Code Monkey home page Code Monkey logo

contacts's Introduction


Contacts

@capacitor-community/contacts

Capacitor community plugin for fetching contacts.


Maintainers

Maintainer GitHub Social Sponsoring Company
Jonathan Gerber / Byrds & Bytes GmbH idrimi / Byrds & Bytes GmbH byrds.ch Byrds & Bytes GmbH

Maintenance Status: Actively Maintained

Demo

You can find a working Ionic App using the Byrds' Capacitor Contacts plugin here: https://github.com/byrdsandbytes/capContactsDemo

Prerequisites

Setup your project with Capacitor. For details check here: https://capacitorjs.com

cd my-app
npm install --save @capacitor/core @capacitor/cli

Initialize Capacitor

npx cap init

Add the platforms you want to use.

npx cap add android
npx cap add ios
npx cap add electron

Installation

Install:

npm i --save @capacitor-community/contacts

# or yarn
yarn add @capacitor-community/contacts

# or pnpm
pnpm add @capacitor-community/contacts

Sync:

npx cap sync

iOS

For iOS you need to set a usage description in your info.plist file. (Privacy Setting) Open xCode search for your info.plist file and press the tiny "+". Add the following entry:

Privacy - Contacts Usage Description

Give it a value like:

"We need access to your contacts in order to do something."

Android Notes

For Android you have to add the permissions in your AndroidManifest.xml. Add the following permissions before the closing of the "manifest" tag.

<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS"/>

Next import the capContacts class to your MainActivity

// Initializes the Bridge
this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
  // Additional plugins you've installed go here
  // Ex: add(TotallyAwesomePlugin.class);
  add(Contacts.class);
}});

Make sure to import it properly as well.

import ch.byrds.capacitor.contacts.Contacts;

NOTE: On Android you have to ask for permission first, before you can fetch the contacts. Use the getPermissions() method before you try to fetch contacts using getContacts().

Usage / Examples

You have the following Methods available:

export interface ContactsPlugin {
  getPermissions(): Promise<PermissionStatus>;
  getContacts(): Promise<{contacts: Contact[]}>;
  saveContact(contact: NewContact): Promise<void>;
}

If you're considering to use this plugin you most likely want to retrieve contacts a users contacts:

Import the Plugin in your TS file:

import { Contacts } from '@capacitor-community/contacts'

Next use it and console log the result:

Contacts.getContacts().then(result => {
    console.log(result);
    for (const contact of result.contacts) {
        console.log(contact);
    }
});

That's it. Do Whatever you want with the retrieved contacts.

If you're trying to build something like "contacts matching" based on phone numbers, recommends using google libphonenumber based library awesome-phonenumber.

In order to match them properly you need to format them before you can match or store them properly.

Interfaces

export interface PermissionStatus {
  granted: boolean;
}

export interface Contact {
  contactId: string;
  displayName?: string;
  phoneNumbers: PhoneNumber[];
  emails: EmailAddress[];
  photoThumbnail?: string;
  organizationName?: string;
  organizationRole?: string;
  birthday?: string;
}

export interface PhoneNumber {
  label?: string;
  number?: string;
}

export interface EmailAddress {
  label?: string;
  address?: string;
}

Built With

  • Swift 5
  • Java
  • Angular
  • Capacitor

Authors

License

MIT

Contributors


idrimi

πŸ’»

Tafel

πŸ’»

Max Lynch

πŸ“– πŸ“‹

David Javier Garzon Carrillo

πŸ’»

Vladimir Hinić

πŸ’»

reslear

πŸ“–

Marvin Heilemann

πŸ’» πŸ“–

API

getPermissions()

getPermissions() => Promise<PermissionStatus>

Returns: Promise<PermissionStatus>


getContacts()

getContacts() => Promise<{ contacts: Contact[]; }>

Returns: Promise<{ contacts: Contact[]; }>


saveContact(...)

saveContact(contact: NewContact) => Promise<void>
Param Type
contact NewContact

Interfaces

PermissionStatus

Prop Type
onchange ((this: PermissionStatus, ev: Event) => any) | null
state "denied" | "granted" | "prompt"
Method Signature Description
addEventListener <K extends "change">(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined) => void Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.
addEventListener (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined) => void Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.
removeEventListener <K extends "change">(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined) => void Removes the event listener in target's event listener list with the same type, callback, and options.
removeEventListener (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined) => void Removes the event listener in target's event listener list with the same type, callback, and options.

PermissionStatusEventMap

Prop Type
"change" Event

Event

An event which takes place in the DOM.

Prop Type Description
bubbles boolean Returns true or false depending on how event was initialized. True if event goes through its target's ancestors in reverse tree order, and false otherwise.
cancelBubble boolean
cancelable boolean Returns true or false depending on how event was initialized. Its return value does not always carry meaning, but true can indicate that part of the operation during which event was dispatched, can be canceled by invoking the preventDefault() method.
composed boolean Returns true or false depending on how event was initialized. True if event invokes listeners past a ShadowRoot node that is the root of its target, and false otherwise.
currentTarget EventTarget | null Returns the object whose event listener's callback is currently being invoked.
defaultPrevented boolean Returns true if preventDefault() was invoked successfully to indicate cancelation, and false otherwise.
eventPhase number Returns the event's phase, which is one of NONE, CAPTURING_PHASE, AT_TARGET, and BUBBLING_PHASE.
isTrusted boolean Returns true if event was dispatched by the user agent, and false otherwise.
returnValue boolean
srcElement EventTarget | null
target EventTarget | null Returns the object to which event is dispatched (its target).
timeStamp number Returns the event's timestamp as the number of milliseconds measured relative to the time origin.
type string Returns the type of event, e.g. "click", "hashchange", or "submit".
AT_TARGET number
BUBBLING_PHASE number
CAPTURING_PHASE number
NONE number
Method Signature Description
composedPath () => EventTarget[] Returns the invocation target objects of event's path (objects on which listeners will be invoked), except for any nodes in shadow trees of which the shadow root's mode is "closed" that are not reachable from event's currentTarget.
initEvent (type: string, bubbles?: boolean | undefined, cancelable?: boolean | undefined) => void
preventDefault () => void If invoked when the cancelable attribute value is true, and while executing a listener for the event with passive set to false, signals to the operation that caused event to be dispatched that it needs to be canceled.
stopImmediatePropagation () => void Invoking this method prevents event from reaching any registered event listeners after the current one finishes running and, when dispatched in a tree, also prevents event from reaching any other objects.
stopPropagation () => void When dispatched in a tree, invoking this method prevents event from reaching any objects other than the current object.

EventTarget

EventTarget is a DOM interface implemented by objects that can receive events and may have listeners for them. EventTarget is a DOM interface implemented by objects that can receive events and may have listeners for them.

Method Signature Description
addEventListener (type: string, listener: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.
dispatchEvent (event: Event) => boolean Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.
removeEventListener (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void Removes the event listener in target's event listener list with the same type, callback, and options.

AddEventListenerOptions

Prop Type
once boolean
passive boolean

EventListenerOptions

Prop Type
capture boolean

Contact

Prop Type
contactId string
displayName string
phoneNumbers PhoneNumber[]
emails EmailAddress[]
photoThumbnail string
organizationName string
organizationRole string
birthday string
whatsapp string

PhoneNumber

Prop Type
label string
number string

EmailAddress

Prop Type
label string
address string

NewContact

New contact schema.

Prop Type Description
contactType ContactType
namePrefix string
givenName string
middleName string
familyName string
nameSuffix string
nickname string
jobTitle string
departmentName string
organizationName string
postalAddresses PostalAddress[]
emailAddresses EmailAddress[]
urlAddresses UrlAddress[]
phoneNumbers PhoneNumber[]
birthday string
note string
socialProfiles SocialProfile[]
image string Base64 image

PostalAddress

Prop Type
label string
address { street?: string; city?: string; state?: string; postalCode?: string; country?: string; }

UrlAddress

Prop Type
label string
url string

SocialProfile

Prop Type
label string
profile { username?: string; service?: string; urlString?: string; }

Enums

ContactType

Members
Person
Organization

contacts's People

Contributors

idrimi avatar reslear avatar vhinic avatar hermitdemschoenenleben avatar allcontributors[bot] avatar muuvmuuv avatar rdlabo avatar dependabot[bot] avatar david-garzon-adl avatar mlynch avatar tafelnl avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.