@deskdirector/angular-chat
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0 • Public • Published

    DeskDirector Angular Chat

    Angularjs ui components for chat v4.

    Components

    In general, components will not render certain buttons if a callback is not provided.

    Avatar

    There is no need to use this directly for chat, but if you want you can use this component elsewhere in your app. This avatar will always show the user's presence.

    selector: dac-avatar

    api (bindings):

    userDacUser;
    widthnumber; // default = 28
    heightnumber; // default = 28
    charCountnumber; // default = 2

    ChatContainer

    This is the component that encapsulates the main content of a chat. It shows messages and an input container for entering messages.

    selector: dac-chat-container

    api:

    participantsDacUser[] // Who's currently in the session
    messagesDacMessage[] // All chat messages
    userIdstring // User id of the current user (will affect how messages are displayed)
    hasUnreadboolean // Will show a button that user can click to read the latest message
    typingUsersDacUser[] // Will show who's typing at the bottom of messages
    onReadMessage: () => void // Called when the user clicks the "read message" button. Should be used to read the latest message.
    onInvite: () => void // Called when user clicks invite button. This should be where you swap out this component for the InviteUserContainer component.

    InputContainer

    This is to be used as a wrapper around an input field. It will render a send button as well as style your input element.

    selector: dac-input-container

    api:

    canSendboolean // whether the send button is enabled
    onSend: () => void // Called when the send button is clicked
     
    transclude{
      input // Only transcludes an input field
    }

    InviteUserContainer

    This component encapsulates the main content of inviting a user. This is intended to replace the ChatContainer component when the user clicks the invite button.

    selector: dac-invite-user-container

    api:

    membersDacUser // All members that can be sent an invite
    contactsDacUser // All contacts that can be sent an invite
    onInviteUsers: (args: { users: DacUser }) => void // Called when user clicks invite button after selecting users
    onCancel: () => void // Called when user clicks the back button. You should now swap this component for the ChatContainer component.

    Menu

    This component encapsulates the menu content for dd-tech users. This is intended to replace the ChatContainer or InviteUsersContainer when the user clicks the menu button.

    selector: dac-menu

    api:

    canLeaveboolean // Whether the tech can leave the room
    onCancel: () => void // Called when the user clicks the back button
    onLinkToTicket: () => void // Called when the user clicks the link to ticket button
    onCreateTicket: () => void // Called when the user clicks the create ticket button
    onClose: () => void // Called when the user clicks the close button
    onLeave: () => void // Called when the user clicks the leave chat session button

    Toolbar

    This is the top toolbar for the chat session. It should always be present, even when switching container components around.

    selector: dac-toolbar

    api:

    canLeaveboolean; // Whether the leave button shows
    onLeave// Called when the user clicks the leave button
    onMinimize// Called when the user clicks the minimize button
    onShowMenu// Called when the user clicks the menu button. Use this to show the menu component
    transclude{
      dacToolbarTitle; // Render your title inside this component
    }

    Keywords

    none

    Install

    npm i @deskdirector/angular-chat

    DownloadsWeekly Downloads

    1

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    64.3 kB

    Total Files

    51

    Last publish

    Collaborators

    • silverlancer
    • andrew-lahikainen-dd
    • desk-director