npm - @verdocs/web-sdk - Versions diffs - 1.7.2 → 1.7.3 - Mend

@verdocs/web-sdk 1.7.2 → 1.7.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (31) hide show

package/dist/cjs/verdocs-web-sdk.cjs.js CHANGED Viewed

@@ -15,7 +15,7 @@ const patchBrowser = () => {
 };
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["verdocs-sign.cjs",[[0,"verdocs-sign",{"endpoint":[16],"documentId":[1,"document-id"],"roleId":[1,"role-id"],"inviteCode":[1,"invite-code"],"recipient":[32],"signerToken":[32],"pdfUrl":[32],"recipientIndex":[32],"document":[32],"fields":[32],"hasSignature":[32],"nextButtonLabel":[32],"focusedField":[32]}]]],["verdocs-auth.cjs",[[0,"verdocs-auth",{"endpoint":[16],"visible":[4],"logo":[1],"debug":[4],"isAuthenticated":[32],"displayMode":[32],"username":[32],"password":[32],"loggingIn":[32],"activeSession":[32],"loginError":[32]}]]],["verdocs-field-initial.cjs",[[0,"verdocs-field-initial",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}]]],["verdocs-field-signature.cjs",[[0,"verdocs-field-signature",{"field":[16],"recipient":[16],"tempSignature":[32],"focusField":[64]}]]],["verdocs-search.cjs",[[0,"verdocs-search",{"endpoint":[16]}]]],["verdocs-field-attachment.cjs",[[0,"verdocs-field-attachment",{"field":[16],"order":[2],"value":[1],"required":[4],"disabled":[4],"focusField":[64]}]]],["verdocs-kba-dialog.cjs",[[0,"verdocs-kba-dialog",{"step":[2],"steps":[2],"helptitle":[1],"helptext":[1],"mode":[1],"label":[1],"placeholder":[1],"choices":[16],"open":[4],"response":[32]}]]],["verdocs-field-date.cjs",[[0,"verdocs-field-date",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]],["verdocs-field-dropdown.cjs",[[0,"verdocs-field-dropdown",{"options":[16],"required":[4],"order":[2],"disabled":[4],"value":[1],"focused":[32],"focusField":[64]}]]],["verdocs-field-payment.cjs",[[0,"verdocs-field-payment",{"field":[16],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"focused":[4],"signed":[4],"preparedMessage":[32],"signatureUrl":[32]}]]],["verdocs-field-textarea.cjs",[[0,"verdocs-field-textarea",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]],["verdocs-field-textbox.cjs",[[0,"verdocs-field-textbox",{"field":[16],"focused":[32],"focusField":[64]}]]],["verdocs-field-timestamp.cjs",[[0,"verdocs-field-timestamp",{"field":[16],"focused":[32],"focusField":[64]}]]],["verdocs-organization-card.cjs",[[0,"verdocs-organization-card",{"organization":[16]}]]],["verdocs-search-tabs.cjs",[[0,"verdocs-search-tabs",{"selected":[32]}]]],["verdocs-status-indicator.cjs",[[0,"verdocs-status-indicator",{"size":[1],"theme":[1],"status":[1],"document":[16],"isOpen":[32],"recipientStatusIcons":[32]}]]],["verdocs-template-card.cjs",[[0,"verdocs-template-card",{"template":[16]}]]],["verdocs-template-tags.cjs",[[0,"verdocs-template-tags",{"tags":[16]}]]],["verdocs-toggle.cjs",[[0,"verdocs-toggle",{"options":[16],"theme":[1]},[[6,"click","handleClick"]]]]],["verdocs-text-input.cjs",[[0,"verdocs-text-input",{"value":[1],"label":[1],"placeholder":[1],"autocomplete":[1],"type":[1],"disabled":[4],"_value":[32]}]]],["verdocs-button.cjs",[[0,"verdocs-button",{"label":[1],"startIcon":[1,"start-icon"],"endIcon":[1,"end-icon"],"size":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["verdocs-initial-dialog.cjs",[[0,"verdocs-initial-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}]]],["verdocs-signature-dialog.cjs",[[0,"verdocs-signature-dialog",{"fullName":[1,"full-name"],"open":[4],"fontLoaded":[32],"enteredName":[32],"mode":[32]}]]],["verdocs-ok-dialog.cjs",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"open":[4],"cancel":[4]}]]],["verdocs-upload-dialog.cjs",[[0,"verdocs-upload-dialog",{"open":[4],"draggingOver":[32],"decodedFiles":[32]}]]],["verdocs-quick-functions_3.cjs",[[0,"verdocs-quick-functions",{"endpoint":[16]}],[0,"verdocs-search-activity",{"endpoint":[16],"type":[1],"options":[8],"emptyMessage":[32],"authFailure":[32],"title":[32],"recent":[32],"saved":[32],"starred":[32]}],[0,"verdocs-search-box",{"endpoint":[16],"placeholder":[1],"type":[1],"query":[1]}]]],["verdocs-document-page_2.cjs",[[0,"verdocs-document-page",{"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[2,"virtual-height"],"layers":[16],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"skipFirstNotification":[32]}],[0,"verdocs-loader"]]],["verdocs-dropdown_4.cjs",[[0,"verdocs-view",{"endpoint":[16],"rotation":[2],"pageLayers":[16],"source":[1],"loadProgress":[32],"numPages":[32]}],[0,"verdocs-dropdown",{"options":[16],"open":[4],"isOpen":[32]}],[0,"verdocs-field-checkbox",{"order":[2],"value":[4],"required":[4],"disabled":[4]}],[0,"verdocs-field-radio-button",{"order":[2],"checked":[4],"value":[1],"name":[1],"required":[4],"disabled":[4]}]]]], options);
+  return index.bootstrapLazy([["verdocs-sign.cjs",[[0,"verdocs-sign",{"endpoint":[16],"documentId":[1,"document-id"],"roleId":[1,"role-id"],"inviteCode":[1,"invite-code"],"recipient":[32],"signerToken":[32],"pdfUrl":[32],"recipientIndex":[32],"document":[32],"fields":[32],"hasSignature":[32],"nextButtonLabel":[32],"focusedField":[32]}]]],["verdocs-auth.cjs",[[0,"verdocs-auth",{"endpoint":[16],"visible":[4],"logo":[1],"debug":[4],"isAuthenticated":[32],"displayMode":[32],"username":[32],"password":[32],"loggingIn":[32],"activeSession":[32],"loginError":[32]}]]],["verdocs-field-initial.cjs",[[0,"verdocs-field-initial",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}]]],["verdocs-field-signature.cjs",[[0,"verdocs-field-signature",{"field":[16],"recipient":[16],"tempSignature":[32],"focusField":[64]}]]],["verdocs-search.cjs",[[0,"verdocs-search",{"endpoint":[16]}]]],["verdocs-field-attachment.cjs",[[0,"verdocs-field-attachment",{"field":[16],"order":[2],"value":[1],"required":[4],"disabled":[4],"focusField":[64]}]]],["verdocs-kba-dialog.cjs",[[0,"verdocs-kba-dialog",{"step":[2],"steps":[2],"helptitle":[1],"helptext":[1],"mode":[1],"label":[1],"placeholder":[1],"choices":[16],"open":[4],"response":[32]}]]],["verdocs-field-date.cjs",[[0,"verdocs-field-date",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]],["verdocs-field-dropdown.cjs",[[0,"verdocs-field-dropdown",{"options":[16],"required":[4],"order":[2],"disabled":[4],"value":[1],"focused":[32],"focusField":[64]}]]],["verdocs-field-payment.cjs",[[0,"verdocs-field-payment",{"field":[16],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"focused":[4],"signed":[4],"preparedMessage":[32],"signatureUrl":[32]}]]],["verdocs-field-textarea.cjs",[[0,"verdocs-field-textarea",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]],["verdocs-field-textbox.cjs",[[0,"verdocs-field-textbox",{"field":[16],"focused":[32],"focusField":[64]}]]],["verdocs-field-timestamp.cjs",[[0,"verdocs-field-timestamp",{"field":[16],"focused":[32],"focusField":[64]}]]],["verdocs-organization-card.cjs",[[0,"verdocs-organization-card",{"organization":[16]}]]],["verdocs-search-tabs.cjs",[[0,"verdocs-search-tabs",{"selected":[32]}]]],["verdocs-status-indicator.cjs",[[0,"verdocs-status-indicator",{"size":[1],"theme":[1],"status":[1],"document":[16],"isOpen":[32],"recipientStatusIcons":[32],"containerId":[32]}]]],["verdocs-template-card.cjs",[[0,"verdocs-template-card",{"template":[16]}]]],["verdocs-template-tags.cjs",[[0,"verdocs-template-tags",{"tags":[16]}]]],["verdocs-toggle.cjs",[[0,"verdocs-toggle",{"options":[16],"theme":[1]},[[6,"click","handleClick"]]]]],["verdocs-text-input.cjs",[[0,"verdocs-text-input",{"value":[1],"label":[1],"placeholder":[1],"autocomplete":[1],"type":[1],"disabled":[4],"_value":[32]}]]],["verdocs-button.cjs",[[0,"verdocs-button",{"label":[1],"startIcon":[1,"start-icon"],"endIcon":[1,"end-icon"],"size":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["verdocs-initial-dialog.cjs",[[0,"verdocs-initial-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}]]],["verdocs-signature-dialog.cjs",[[0,"verdocs-signature-dialog",{"fullName":[1,"full-name"],"open":[4],"fontLoaded":[32],"enteredName":[32],"mode":[32]}]]],["verdocs-ok-dialog.cjs",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"open":[4],"cancel":[4]}]]],["verdocs-upload-dialog.cjs",[[0,"verdocs-upload-dialog",{"open":[4],"draggingOver":[32],"decodedFiles":[32]}]]],["verdocs-quick-functions_3.cjs",[[0,"verdocs-quick-functions",{"endpoint":[16]}],[0,"verdocs-search-activity",{"endpoint":[16],"type":[1],"options":[8],"emptyMessage":[32],"authFailure":[32],"title":[32],"recent":[32],"saved":[32],"starred":[32]}],[0,"verdocs-search-box",{"endpoint":[16],"placeholder":[1],"type":[1],"query":[1]}]]],["verdocs-document-page_2.cjs",[[0,"verdocs-document-page",{"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[2,"virtual-height"],"layers":[16],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"skipFirstNotification":[32]}],[0,"verdocs-loader"]]],["verdocs-dropdown_4.cjs",[[0,"verdocs-view",{"endpoint":[16],"rotation":[2],"pageLayers":[16],"source":[1],"loadProgress":[32],"numPages":[32]}],[0,"verdocs-dropdown",{"options":[16],"open":[4],"isOpen":[32]}],[0,"verdocs-field-checkbox",{"order":[2],"value":[4],"required":[4],"disabled":[4]}],[0,"verdocs-field-radio-button",{"order":[2],"checked":[4],"value":[1],"name":[1],"required":[4],"disabled":[4]}]]]], options);
 });
 //# sourceMappingURL=verdocs-web-sdk.cjs.js.map

package/dist/collection/components/controls/verdocs-status-indicator/verdocs-status-indicator.js CHANGED Viewed

@@ -44,6 +44,7 @@ export class VerdocsStatusIndicator {
      */
     this.theme = 'light';
     this.recipientStatusIcons = [];
+    this.containerId = `verdocs-status-indicator-${Math.random().toString(36).substring(2, 11)}`;
   }
   componentDidLoad() {
     var _a;
@@ -110,7 +111,7 @@ export class VerdocsStatusIndicator {
       });
       this.recipientStatusIcons = statusIcons;
       const diagram = RecipientFlow();
-      diagram.initalize('#verdocs-recipient-status-diagram', canvasWidth, canvasHeight);
+      diagram.initalize(`#${this.containerId}`, canvasWidth, canvasHeight);
       diagram.update({ entities, lines });
     }
   }
@@ -243,7 +244,7 @@ export class VerdocsStatusIndicator {
       h("span", { class: "icon", innerHTML: icon }),
       h("span", { class: "content" }, statusMessage),
       h("div", { class: "detail-panel", ref: el => (this.detailPanel = el) },
-        h("div", { id: "verdocs-recipient-status-diagram" }),
+        h("div", { id: `${this.containerId}` }),
         this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
   }
   static get is() { return "verdocs-status-indicator"; }
@@ -339,7 +340,8 @@ export class VerdocsStatusIndicator {
   }; }
   static get states() { return {
     "isOpen": {},
-    "recipientStatusIcons": {}
+    "recipientStatusIcons": {},
+    "containerId": {}
   }; }
 }
 //# sourceMappingURL=verdocs-status-indicator.js.map

package/dist/collection/components/controls/verdocs-status-indicator/verdocs-status-indicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-status-indicator.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-status-indicator/verdocs-status-indicator.tsx"],"names":[],"mappings":"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","sourcesContent":["import {RecipientFlow} from './recipient-flow';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Host, h, State} from '@stencil/core';\nimport {IDocument, TDocumentStatus, TRecipientStatus} from '@verdocs/js-sdk/Documents/Documents';\nimport AcceptedLight from './accepted-light.svg';\nimport AcceptedDark from './accepted-dark.svg';\nimport CanceledLight from './canceled-light.svg';\nimport CanceledDark from './canceled-dark.svg';\nimport CompletedLight from './complete-light.svg';\nimport CompletedDark from './complete-dark.svg';\nimport DeclinedLight from './declined-light.svg';\nimport DeclinedDark from './declined-dark.svg';\nimport InProgressLight from './in-progress-light.svg';\nimport InProgressDark from './in-progress-dark.svg';\nimport OpenedLight from './opened-light.svg';\nimport OpenedDark from './opened-dark.svg';\nimport PendingLight from './pending-light.svg';\nimport PendingDark from './pending-dark.svg';\nimport SignedLight from './signed-light.svg';\nimport SignedDark from './signed-dark.svg';\nimport SomeSignedLight from './some-signed-light.svg';\nimport SomeSignedDark from './some-signed-dark.svg';\nimport SubmittedLight from './submitted-light.svg';\nimport SubmittedDark from './submitted-dark.svg';\n\nconst ENTRY_WIDTH = 140;\nconst ENTRY_HEIGHT = 40;\nconst ENTRY_PADDING = 40;\n\n/*\n Displays an icon and message describing a document's completion status. For convenience, the status may be passed in either\n * directly as a status field or the whole document object may be passed in.\n \n If the document is provided, the status flag will indicate the document's overall status. This also makes the component clickable\n * to display a popup panel with per-recipient status data.\n \n If the status is provided as a string it can be either a `TRecipientStatus` or `TDocumentStatus` value.\n /\n@Component({\n tag: 'verdocs-status-indicator',\n styleUrl: 'verdocs-status-indicator.scss',\n})\nexport class VerdocsStatusIndicator {\n private summaryComponent?: HTMLButtonElement;\n private detailPanel?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The size (height) of the indicator. The small variant is suitable for use in densely populated components such as table rows.\n /\n @Prop() size: 'small' \| 'normal' = 'normal';\n\n /\n The theme to use for diplay.\n /\n @Prop() theme?: 'dark' \| 'light' = 'light';\n\n /\n The status to display.\n /\n // The accepted override is here because we don't actually have an official status for that yet, but we plan to add it\n @Prop() status?: TDocumentStatus \| TRecipientStatus \| 'accepted';\n\n /\n The document to display status for. Ignored if `status` is set directly.\n /\n @Prop() document?: IDocument;\n\n @State() isOpen: boolean;\n\n @State() recipientStatusIcons = [];\n\n componentDidLoad() {\n this.popper = createPopper(this.summaryComponent, this.detailPanel, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [0, 10]}}]});\n\n if (this.document?.recipients) {\n const recipientsAtLevel = [];\n this.document.recipients.forEach(recipient => {\n const level = recipient.sequence - 1;\n recipientsAtLevel[level] \|\|= [];\n const id = `r-${level}-${recipientsAtLevel[level].length}`;\n recipientsAtLevel[level].push({...recipient, id});\n });\n\n const levelCount = Object.keys(recipientsAtLevel).length;\n\n const canvasHeight = levelCount ENTRY_HEIGHT + (levelCount + 1) * ENTRY_PADDING;\n let canvasWidth = 0;\n Object.values(recipientsAtLevel).forEach(recipients => {\n let minW = recipients.length * ENTRY_WIDTH + (recipients.length + 1) * ENTRY_PADDING;\n if (minW > canvasWidth) {\n canvasWidth = minW;\n }\n });\n\n const entities = [];\n const lines = [];\n const statusIcons = [];\n\n let y = ENTRY_PADDING;\n Object.entries(recipientsAtLevel).forEach(([level, recipients]) => {\n // To center align here, we figure out how many items are per line and how much leftover space there would be if we just\n // drew them left-to-right. We add half of that as a left offset.\n const renderedItemsWidth = recipients.length * (ENTRY_WIDTH + ENTRY_PADDING);\n const leftoverSpace = canvasWidth - renderedItemsWidth;\n const leftOffset = ENTRY_PADDING / 2 + leftoverSpace / 2;\n\n recipients.forEach((recipient, index) => {\n const [first, last] = (recipient.full_name \|\| 'Unknown').toUpperCase().split(' ');\n const name = `${first} ${last?.substring(0, 1)}`;\n const entity = {\n id: recipient.id,\n text: name,\n icon: this.getStatusIcon(recipient.status),\n x: index * (ENTRY_WIDTH + ENTRY_PADDING) + leftOffset,\n y,\n width: ENTRY_WIDTH,\n height: ENTRY_HEIGHT,\n color: this.getStatusColor(recipient.status),\n radius: 8,\n };\n entities.push(entity);\n\n statusIcons.push({\n icon: this.getStatusIcon(recipient.status),\n x: index * (ENTRY_WIDTH + ENTRY_PADDING) + leftOffset + (ENTRY_WIDTH - 32),\n y: y + ENTRY_HEIGHT / 2 - 13,\n });\n\n recipientsAtLevel[+level - 1]?.forEach(prevRecip => {\n const line = {\n id: `line-${prevRecip.id}-${entity.id}`,\n from: {element: prevRecip.id, point: 'bottom'},\n to: {element: entity.id, point: 'top'},\n color: this.getStatusColor(recipient.status),\n };\n lines.push(line);\n });\n });\n\n y += ENTRY_HEIGHT + ENTRY_PADDING;\n });\n\n this.recipientStatusIcons = statusIcons;\n\n const diagram = RecipientFlow();\n diagram.initalize('#verdocs-recipient-status-diagram', canvasWidth, canvasHeight);\n diagram.update({entities, lines});\n }\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.isOpen = true;\n this.detailPanel.setAttribute('data-show', '');\n this.detailPanel.removeAttribute('aria-hidden');\n\n this.popper?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }));\n\n this.popper?.update();\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown() {\n if (this.isOpen) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.isOpen = false;\n this.detailPanel.removeAttribute('data-show');\n this.detailPanel.setAttribute('aria-hidden', 'true');\n this.popper?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }));\n }\n\n getStatusColor(status: string) {\n switch (status) {\n case 'invited':\n case 'opened':\n case 'accepted':\n case 'signed':\n return '#654dcb';\n case 'some-signed':\n case 'submitted':\n case 'complete':\n return '#55bc81';\n case 'declined':\n return '#ff0000';\n case 'canceled':\n case 'in progress':\n case 'pending':\n default:\n return '#999999';\n }\n }\n\n getStatusIcon(status: string) {\n switch (status) {\n case 'accepted':\n return this.theme === 'light' ? AcceptedLight : AcceptedDark;\n case 'complete':\n return this.theme === 'light' ? CompletedLight : CompletedDark;\n case 'in progress':\n return this.theme === 'light' ? InProgressLight : InProgressDark;\n case 'canceled':\n return this.theme === 'light' ? CanceledLight : CanceledDark;\n case 'declined':\n return this.theme === 'light' ? DeclinedLight : DeclinedDark;\n case 'invited':\n return this.theme === 'light' ? InProgressLight : InProgressDark;\n case 'opened':\n return this.theme === 'light' ? OpenedLight : OpenedDark;\n case 'signed':\n return this.theme === 'light' ? SignedLight : SignedDark;\n case 'submitted':\n return this.theme === 'light' ? SubmittedLight : SubmittedDark;\n case 'some-signed':\n return this.theme === 'light' ? SomeSignedLight : SomeSignedDark;\n default:\n case 'pending':\n return this.theme === 'light' ? PendingLight : PendingDark;\n }\n }\n\n getStatusMessage(status: string) {\n switch (status) {\n case 'accepted':\n return 'Accepted';\n case 'complete':\n return 'Completed';\n case 'in progress':\n return 'In Progress';\n case 'canceled':\n return 'Cancelled';\n case 'declined':\n return 'Declined';\n case 'invited':\n return 'Invited';\n case 'opened':\n return 'Opened';\n case 'signed':\n return 'Signed';\n case 'submitted':\n return 'Submitted';\n case 'some-signed':\n return 'Partly Signed';\n default:\n case 'pending':\n return 'Pending';\n }\n }\n\n render() {\n // The extra fallback for accepted is to future proof for when we add that.\n let status: string = this.status \|\| this.document?.status \|\| 'pending' \|\| 'accepted';\n if (!this.status && this.document?.recipients) {\n const submittedRecipients = this.document.recipients.filter(r => r.status === 'submitted');\n if (submittedRecipients.length > 0 && submittedRecipients.length !== this.document.recipients.length) {\n status = 'some-signed';\n }\n }\n\n const icon = this.getStatusIcon(status);\n const statusMessage = this.getStatusMessage(status);\n\n return (\n <Host\n ref={el => (this.summaryComponent = el as HTMLButtonElement)}\n class={`${this.theme} ${this.size} ${this.document ? 'has-document' : ''}`}\n aria-label=\"Click to View Details\"\n onClick={() => this.document && this.toggleDropdown()}\n onBlur={e => this.document && this.handleHideDropdown(e)}\n >\n <span class=\"icon\" innerHTML={icon} />\n <span class=\"content\">{statusMessage}</span>\n\n <div class=\"detail-panel\" ref={el => (this.detailPanel = el as HTMLDivElement)}>\n <div id=\"verdocs-recipient-status-diagram\" />\n {this.recipientStatusIcons.map(icon => (\n <span innerHTML={icon.icon} style={{position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px`}} />\n ))}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-status-indicator.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-status-indicator/verdocs-status-indicator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,aAAa,EAAC,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAC,YAAY,EAAW,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAE9D,OAAO,aAAa,MAAM,sBAAsB,CAAC;AACjD,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,aAAa,MAAM,sBAAsB,CAAC;AACjD,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,aAAa,MAAM,qBAAqB,CAAC;AAChD,OAAO,aAAa,MAAM,sBAAsB,CAAC;AACjD,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,eAAe,MAAM,yBAAyB,CAAC;AACtD,OAAO,cAAc,MAAM,wBAAwB,CAAC;AACpD,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,UAAU,MAAM,mBAAmB,CAAC;AAC3C,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,UAAU,MAAM,mBAAmB,CAAC;AAC3C,OAAO,eAAe,MAAM,yBAAyB,CAAC;AACtD,OAAO,cAAc,MAAM,wBAAwB,CAAC;AACpD,OAAO,cAAc,MAAM,uBAAuB,CAAC;AACnD,OAAO,aAAa,MAAM,sBAAsB,CAAC;AAEjD,MAAM,WAAW,GAAG,GAAG,CAAC;AACxB,MAAM,YAAY,GAAG,EAAE,CAAC;AACxB,MAAM,aAAa,GAAG,EAAE,CAAC;AAEzB;;;;;;;;GAQG;AAKH,MAAM,OAAO,sBAAsB;EAJnC;IASE;;OAEG;IACK,SAAI,GAAuB,QAAQ,CAAC;IAE5C;;OAEG;IACK,UAAK,GAAsB,OAAO,CAAC;IAelC,yBAAoB,GAAG,EAAE,CAAC;IAE1B,gBAAW,GAAG,4BAA4B,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC;GAyOlG;EAvOC,gBAAgB;;IACd,IAAI,CAAC,MAAM,GAAG,YAAY,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,EAAE,EAAC,SAAS,EAAE,cAAc,EAAE,SAAS,EAAE,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,EAAC,EAAC,CAAC,EAAC,CAAC,CAAC;IAE5J,IAAI,MAAA,IAAI,CAAC,QAAQ,0CAAE,UAAU,EAAE;MAC7B,MAAM,iBAAiB,GAAG,EAAE,CAAC;MAC7B,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;QAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC;QACrC,iBAAiB,CAAC,KAAK,MAAvB,iBAAiB,CAAC,KAAK,IAAM,EAAE,EAAC;QAChC,MAAM,EAAE,GAAG,KAAK,KAAK,IAAI,iBAAiB,CAAC,KAAK,CAAC,CAAC,MAAM,EAAE,CAAC;QAC3D,iBAAiB,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,EAAC,GAAG,SAAS,EAAE,EAAE,EAAC,CAAC,CAAC;MACpD,CAAC,CAAC,CAAC;MAEH,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC;MAEzD,MAAM,YAAY,GAAG,UAAU,GAAG,YAAY,GAAG,CAAC,UAAU,GAAG,CAAC,CAAC,GAAG,aAAa,CAAC;MAClF,IAAI,WAAW,GAAG,CAAC,CAAC;MACpB,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;QACpD,IAAI,IAAI,GAAG,UAAU,CAAC,MAAM,GAAG,WAAW,GAAG,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,aAAa,CAAC;QACrF,IAAI,IAAI,GAAG,WAAW,EAAE;UACtB,WAAW,GAAG,IAAI,CAAC;SACpB;MACH,CAAC,CAAC,CAAC;MAEH,MAAM,QAAQ,GAAG,EAAE,CAAC;MACpB,MAAM,KAAK,GAAG,EAAE,CAAC;MACjB,MAAM,WAAW,GAAG,EAAE,CAAC;MAEvB,IAAI,CAAC,GAAG,aAAa,CAAC;MACtB,MAAM,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,EAAE,EAAE;QAChE,wHAAwH;QACxH,iEAAiE;QACjE,MAAM,kBAAkB,GAAG,UAAU,CAAC,MAAM,GAAG,CAAC,WAAW,GAAG,aAAa,CAAC,CAAC;QAC7E,MAAM,aAAa,GAAG,WAAW,GAAG,kBAAkB,CAAC;QACvD,MAAM,UAAU,GAAG,aAAa,GAAG,CAAC,GAAG,aAAa,GAAG,CAAC,CAAC;QAEzD,UAAU,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE;;UACtC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,SAAS,IAAI,SAAS,CAAC,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;UAClF,MAAM,IAAI,GAAG,GAAG,KAAK,IAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;UACjD,MAAM,MAAM,GAAG;YACb,EAAE,EAAE,SAAS,CAAC,EAAE;YAChB,IAAI,EAAE,IAAI;YACV,IAAI,EAAE,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC;YAC1C,CAAC,EAAE,KAAK,GAAG,CAAC,WAAW,GAAG,aAAa,CAAC,GAAG,UAAU;YACrD,CAAC;YACD,KAAK,EAAE,WAAW;YAClB,MAAM,EAAE,YAAY;YACpB,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,MAAM,CAAC;YAC5C,MAAM,EAAE,CAAC;WACV,CAAC;UACF,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;UAEtB,WAAW,CAAC,IAAI,CAAC;YACf,IAAI,EAAE,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC;YAC1C,CAAC,EAAE,KAAK,GAAG,CAAC,WAAW,GAAG,aAAa,CAAC,GAAG,UAAU,GAAG,CAAC,WAAW,GAAG,EAAE,CAAC;YAC1E,CAAC,EAAE,CAAC,GAAG,YAAY,GAAG,CAAC,GAAG,EAAE;WAC7B,CAAC,CAAC;UAEH,MAAA,iBAAiB,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,0CAAE,OAAO,CAAC,SAAS,CAAC,EAAE;YACjD,MAAM,IAAI,GAAG;cACX,EAAE,EAAE,QAAQ,SAAS,CAAC,EAAE,IAAI,MAAM,CAAC,EAAE,EAAE;cACvC,IAAI,EAAE,EAAC,OAAO,EAAE,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAC;cAC9C,EAAE,EAAE,EAAC,OAAO,EAAE,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,EAAC;cACtC,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,MAAM,CAAC;aAC7C,CAAC;YACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;UACnB,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,CAAC,IAAI,YAAY,GAAG,aAAa,CAAC;MACpC,CAAC,CAAC,CAAC;MAEH,IAAI,CAAC,oBAAoB,GAAG,WAAW,CAAC;MAExC,MAAM,OAAO,GAAG,aAAa,EAAE,CAAC;MAChC,OAAO,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC;MACrE,OAAO,CAAC,MAAM,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC,CAAC;KACnC;EACH,CAAC;EAED,8CAA8C;EAC9C,8GAA8G;EAC9G,YAAY;;IACV,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACnB,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;IAC/C,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;IAEhD,MAAA,IAAI,CAAC,MAAM,0CAAE,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;MAClC,GAAG,OAAO;MACV,SAAS,EAAE,CAAC,GAAG,OAAO,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;KAC3E,CAAC,CAAC,CAAC;IAEJ,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,EAAE,CAAC;EACxB,CAAC;EAED,kBAAkB,CAAC,CAAM;;IACvB,IAAI,CAAA,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,0CAAE,SAAS,MAAK,QAAQ,IAAI,CAAA,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,0CAAE,SAAS,MAAK,OAAO,EAAE;MACzE,+FAA+F;MAC/F,OAAO;KACR;IAED,IAAI,CAAC,IAAI,EAAE,CAAC;EACd,CAAC;EAED,cAAc;IACZ,IAAI,IAAI,CAAC,MAAM,EAAE;MACf,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;SAAM;MACL,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;EACH,CAAC;EAED,IAAI;;IACF,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACpB,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAC9C,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IACrD,MAAA,IAAI,CAAC,MAAM,0CAAE,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;MAClC,GAAG,OAAO;MACV,SAAS,EAAE,CAAC,GAAG,OAAO,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,KAAK,EAAC,CAAC;KAC5E,CAAC,CAAC,CAAC;EACN,CAAC;EAED,cAAc,CAAC,MAAc;IAC3B,QAAQ,MAAM,EAAE;MACd,KAAK,SAAS,CAAC;MACf,KAAK,QAAQ,CAAC;MACd,KAAK,UAAU,CAAC;MAChB,KAAK,QAAQ;QACX,OAAO,SAAS,CAAC;MACnB,KAAK,aAAa,CAAC;MACnB,KAAK,WAAW,CAAC;MACjB,KAAK,UAAU;QACb,OAAO,SAAS,CAAC;MACnB,KAAK,UAAU;QACb,OAAO,SAAS,CAAC;MACnB,KAAK,UAAU,CAAC;MAChB,KAAK,aAAa,CAAC;MACnB,KAAK,SAAS,CAAC;MACf;QACE,OAAO,SAAS,CAAC;KACpB;EACH,CAAC;EAED,aAAa,CAAC,MAAc;IAC1B,QAAQ,MAAM,EAAE;MACd,KAAK,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC;MAC/D,KAAK,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC;MACjE,KAAK,aAAa;QAChB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC;MACnE,KAAK,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC;MAC/D,KAAK,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC;MAC/D,KAAK,SAAS;QACZ,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC;MACnE,KAAK,QAAQ;QACX,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC;MAC3D,KAAK,QAAQ;QACX,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC;MAC3D,KAAK,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC;MACjE,KAAK,aAAa;QAChB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC;MACnE,QAAQ;MACR,KAAK,SAAS;QACZ,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC;KAC9D;EACH,CAAC;EAED,gBAAgB,CAAC,MAAc;IAC7B,QAAQ,MAAM,EAAE;MACd,KAAK,UAAU;QACb,OAAO,UAAU,CAAC;MACpB,KAAK,UAAU;QACb,OAAO,WAAW,CAAC;MACrB,KAAK,aAAa;QAChB,OAAO,aAAa,CAAC;MACvB,KAAK,UAAU;QACb,OAAO,WAAW,CAAC;MACrB,KAAK,UAAU;QACb,OAAO,UAAU,CAAC;MACpB,KAAK,SAAS;QACZ,OAAO,SAAS,CAAC;MACnB,KAAK,QAAQ;QACX,OAAO,QAAQ,CAAC;MAClB,KAAK,QAAQ;QACX,OAAO,QAAQ,CAAC;MAClB,KAAK,WAAW;QACd,OAAO,WAAW,CAAC;MACrB,KAAK,aAAa;QAChB,OAAO,eAAe,CAAC;MACzB,QAAQ;MACR,KAAK,SAAS;QACZ,OAAO,SAAS,CAAC;KACpB;EACH,CAAC;EAED,MAAM;;IACJ,2EAA2E;IAC3E,IAAI,MAAM,GAAW,IAAI,CAAC,MAAM,KAAI,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,CAAA,IAAI,SAAS,IAAI,UAAU,CAAC;IACrF,IAAI,CAAC,IAAI,CAAC,MAAM,KAAI,MAAA,IAAI,CAAC,QAAQ,0CAAE,UAAU,CAAA,EAAE;MAC7C,MAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,CAAC;MAC3F,IAAI,mBAAmB,CAAC,MAAM,GAAG,CAAC,IAAI,mBAAmB,CAAC,MAAM,KAAK,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,MAAM,EAAE;QACpG,MAAM,GAAG,aAAa,CAAC;OACxB;KACF;IAED,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IACxC,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAEpD,OAAO,CACL,EAAC,IAAI,IACH,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,gBAAgB,GAAG,EAAuB,CAAC,EAC5D,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,gBAC/D,uBAAuB,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE,EACrD,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;MAExD,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,IAAI,GAAI;MACtC,YAAM,KAAK,EAAC,SAAS,IAAE,aAAa,CAAQ;MAE5C,WAAK,KAAK,EAAC,cAAc,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAoB,CAAC;QAC5E,WAAK,EAAE,EAAE,GAAG,IAAI,CAAC,WAAW,EAAE,GAAI;QACjC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACrC,YAAM,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAC,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,CAAC,IAAI,EAAC,GAAI,CACvG,CAAC,CACE,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {RecipientFlow} from './recipient-flow';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Host, h, State} from '@stencil/core';\nimport {IDocument, TDocumentStatus, TRecipientStatus} from '@verdocs/js-sdk/Documents/Documents';\nimport AcceptedLight from './accepted-light.svg';\nimport AcceptedDark from './accepted-dark.svg';\nimport CanceledLight from './canceled-light.svg';\nimport CanceledDark from './canceled-dark.svg';\nimport CompletedLight from './complete-light.svg';\nimport CompletedDark from './complete-dark.svg';\nimport DeclinedLight from './declined-light.svg';\nimport DeclinedDark from './declined-dark.svg';\nimport InProgressLight from './in-progress-light.svg';\nimport InProgressDark from './in-progress-dark.svg';\nimport OpenedLight from './opened-light.svg';\nimport OpenedDark from './opened-dark.svg';\nimport PendingLight from './pending-light.svg';\nimport PendingDark from './pending-dark.svg';\nimport SignedLight from './signed-light.svg';\nimport SignedDark from './signed-dark.svg';\nimport SomeSignedLight from './some-signed-light.svg';\nimport SomeSignedDark from './some-signed-dark.svg';\nimport SubmittedLight from './submitted-light.svg';\nimport SubmittedDark from './submitted-dark.svg';\n\nconst ENTRY_WIDTH = 140;\nconst ENTRY_HEIGHT = 40;\nconst ENTRY_PADDING = 40;\n\n/*\n Displays an icon and message describing a document's completion status. For convenience, the status may be passed in either\n * directly as a status field or the whole document object may be passed in.\n \n If the document is provided, the status flag will indicate the document's overall status. This also makes the component clickable\n * to display a popup panel with per-recipient status data.\n \n If the status is provided as a string it can be either a `TRecipientStatus` or `TDocumentStatus` value.\n /\n@Component({\n tag: 'verdocs-status-indicator',\n styleUrl: 'verdocs-status-indicator.scss',\n})\nexport class VerdocsStatusIndicator {\n private summaryComponent?: HTMLButtonElement;\n private detailPanel?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The size (height) of the indicator. The small variant is suitable for use in densely populated components such as table rows.\n /\n @Prop() size: 'small' \| 'normal' = 'normal';\n\n /\n The theme to use for diplay.\n /\n @Prop() theme?: 'dark' \| 'light' = 'light';\n\n /\n The status to display.\n /\n // The accepted override is here because we don't actually have an official status for that yet, but we plan to add it\n @Prop() status?: TDocumentStatus \| TRecipientStatus \| 'accepted';\n\n /\n The document to display status for. Ignored if `status` is set directly.\n /\n @Prop() document?: IDocument;\n\n @State() isOpen: boolean;\n\n @State() recipientStatusIcons = [];\n\n @State() containerId = `verdocs-status-indicator-${Math.random().toString(36).substring(2, 11)}`;\n\n componentDidLoad() {\n this.popper = createPopper(this.summaryComponent, this.detailPanel, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [0, 10]}}]});\n\n if (this.document?.recipients) {\n const recipientsAtLevel = [];\n this.document.recipients.forEach(recipient => {\n const level = recipient.sequence - 1;\n recipientsAtLevel[level] \|\|= [];\n const id = `r-${level}-${recipientsAtLevel[level].length}`;\n recipientsAtLevel[level].push({...recipient, id});\n });\n\n const levelCount = Object.keys(recipientsAtLevel).length;\n\n const canvasHeight = levelCount ENTRY_HEIGHT + (levelCount + 1) * ENTRY_PADDING;\n let canvasWidth = 0;\n Object.values(recipientsAtLevel).forEach(recipients => {\n let minW = recipients.length * ENTRY_WIDTH + (recipients.length + 1) * ENTRY_PADDING;\n if (minW > canvasWidth) {\n canvasWidth = minW;\n }\n });\n\n const entities = [];\n const lines = [];\n const statusIcons = [];\n\n let y = ENTRY_PADDING;\n Object.entries(recipientsAtLevel).forEach(([level, recipients]) => {\n // To center align here, we figure out how many items are per line and how much leftover space there would be if we just\n // drew them left-to-right. We add half of that as a left offset.\n const renderedItemsWidth = recipients.length * (ENTRY_WIDTH + ENTRY_PADDING);\n const leftoverSpace = canvasWidth - renderedItemsWidth;\n const leftOffset = ENTRY_PADDING / 2 + leftoverSpace / 2;\n\n recipients.forEach((recipient, index) => {\n const [first, last] = (recipient.full_name \|\| 'Unknown').toUpperCase().split(' ');\n const name = `${first} ${last?.substring(0, 1)}`;\n const entity = {\n id: recipient.id,\n text: name,\n icon: this.getStatusIcon(recipient.status),\n x: index * (ENTRY_WIDTH + ENTRY_PADDING) + leftOffset,\n y,\n width: ENTRY_WIDTH,\n height: ENTRY_HEIGHT,\n color: this.getStatusColor(recipient.status),\n radius: 8,\n };\n entities.push(entity);\n\n statusIcons.push({\n icon: this.getStatusIcon(recipient.status),\n x: index * (ENTRY_WIDTH + ENTRY_PADDING) + leftOffset + (ENTRY_WIDTH - 32),\n y: y + ENTRY_HEIGHT / 2 - 13,\n });\n\n recipientsAtLevel[+level - 1]?.forEach(prevRecip => {\n const line = {\n id: `line-${prevRecip.id}-${entity.id}`,\n from: {element: prevRecip.id, point: 'bottom'},\n to: {element: entity.id, point: 'top'},\n color: this.getStatusColor(recipient.status),\n };\n lines.push(line);\n });\n });\n\n y += ENTRY_HEIGHT + ENTRY_PADDING;\n });\n\n this.recipientStatusIcons = statusIcons;\n\n const diagram = RecipientFlow();\n diagram.initalize(`#${this.containerId}`, canvasWidth, canvasHeight);\n diagram.update({entities, lines});\n }\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.isOpen = true;\n this.detailPanel.setAttribute('data-show', '');\n this.detailPanel.removeAttribute('aria-hidden');\n\n this.popper?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }));\n\n this.popper?.update();\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown() {\n if (this.isOpen) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.isOpen = false;\n this.detailPanel.removeAttribute('data-show');\n this.detailPanel.setAttribute('aria-hidden', 'true');\n this.popper?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }));\n }\n\n getStatusColor(status: string) {\n switch (status) {\n case 'invited':\n case 'opened':\n case 'accepted':\n case 'signed':\n return '#654dcb';\n case 'some-signed':\n case 'submitted':\n case 'complete':\n return '#55bc81';\n case 'declined':\n return '#ff0000';\n case 'canceled':\n case 'in progress':\n case 'pending':\n default:\n return '#999999';\n }\n }\n\n getStatusIcon(status: string) {\n switch (status) {\n case 'accepted':\n return this.theme === 'light' ? AcceptedLight : AcceptedDark;\n case 'complete':\n return this.theme === 'light' ? CompletedLight : CompletedDark;\n case 'in progress':\n return this.theme === 'light' ? InProgressLight : InProgressDark;\n case 'canceled':\n return this.theme === 'light' ? CanceledLight : CanceledDark;\n case 'declined':\n return this.theme === 'light' ? DeclinedLight : DeclinedDark;\n case 'invited':\n return this.theme === 'light' ? InProgressLight : InProgressDark;\n case 'opened':\n return this.theme === 'light' ? OpenedLight : OpenedDark;\n case 'signed':\n return this.theme === 'light' ? SignedLight : SignedDark;\n case 'submitted':\n return this.theme === 'light' ? SubmittedLight : SubmittedDark;\n case 'some-signed':\n return this.theme === 'light' ? SomeSignedLight : SomeSignedDark;\n default:\n case 'pending':\n return this.theme === 'light' ? PendingLight : PendingDark;\n }\n }\n\n getStatusMessage(status: string) {\n switch (status) {\n case 'accepted':\n return 'Accepted';\n case 'complete':\n return 'Completed';\n case 'in progress':\n return 'In Progress';\n case 'canceled':\n return 'Cancelled';\n case 'declined':\n return 'Declined';\n case 'invited':\n return 'Invited';\n case 'opened':\n return 'Opened';\n case 'signed':\n return 'Signed';\n case 'submitted':\n return 'Submitted';\n case 'some-signed':\n return 'Partly Signed';\n default:\n case 'pending':\n return 'Pending';\n }\n }\n\n render() {\n // The extra fallback for accepted is to future proof for when we add that.\n let status: string = this.status \|\| this.document?.status \|\| 'pending' \|\| 'accepted';\n if (!this.status && this.document?.recipients) {\n const submittedRecipients = this.document.recipients.filter(r => r.status === 'submitted');\n if (submittedRecipients.length > 0 && submittedRecipients.length !== this.document.recipients.length) {\n status = 'some-signed';\n }\n }\n\n const icon = this.getStatusIcon(status);\n const statusMessage = this.getStatusMessage(status);\n\n return (\n <Host\n ref={el => (this.summaryComponent = el as HTMLButtonElement)}\n class={`${this.theme} ${this.size} ${this.document ? 'has-document' : ''}`}\n aria-label=\"Click to View Details\"\n onClick={() => this.document && this.toggleDropdown()}\n onBlur={e => this.document && this.handleHideDropdown(e)}\n >\n <span class=\"icon\" innerHTML={icon} />\n <span class=\"content\">{statusMessage}</span>\n\n <div class=\"detail-panel\" ref={el => (this.detailPanel = el as HTMLDivElement)}>\n <div id={`${this.containerId}`} />\n {this.recipientStatusIcons.map(icon => (\n <span innerHTML={icon.icon} style={{position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px`}} />\n ))}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/components/verdocs-status-indicator.js CHANGED Viewed

@@ -7323,6 +7323,7 @@ const VerdocsStatusIndicator$1 = /*@__PURE__*/ proxyCustomElement(class extends
      */
     this.theme = 'light';
     this.recipientStatusIcons = [];
+    this.containerId = `verdocs-status-indicator-${Math.random().toString(36).substring(2, 11)}`;
   }
   componentDidLoad() {
     var _a;
@@ -7389,7 +7390,7 @@ const VerdocsStatusIndicator$1 = /*@__PURE__*/ proxyCustomElement(class extends
       });
       this.recipientStatusIcons = statusIcons;
       const diagram = RecipientFlow();
-      diagram.initalize('#verdocs-recipient-status-diagram', canvasWidth, canvasHeight);
+      diagram.initalize(`#${this.containerId}`, canvasWidth, canvasHeight);
       diagram.update({ entities, lines });
     }
   }
@@ -7518,7 +7519,7 @@ const VerdocsStatusIndicator$1 = /*@__PURE__*/ proxyCustomElement(class extends
     }
     const icon = this.getStatusIcon(status);
     const statusMessage = this.getStatusMessage(status);
-    return (h(Host, { ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.document ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: () => this.document && this.toggleDropdown(), onBlur: e => this.document && this.handleHideDropdown(e) }, h("span", { class: "icon", innerHTML: icon }), h("span", { class: "content" }, statusMessage), h("div", { class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { id: "verdocs-recipient-status-diagram" }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+    return (h(Host, { ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.document ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: () => this.document && this.toggleDropdown(), onBlur: e => this.document && this.handleHideDropdown(e) }, h("span", { class: "icon", innerHTML: icon }), h("span", { class: "content" }, statusMessage), h("div", { class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
   }
   static get style() { return verdocsStatusIndicatorCss; }
 }, [0, "verdocs-status-indicator", {
@@ -7527,7 +7528,8 @@ const VerdocsStatusIndicator$1 = /*@__PURE__*/ proxyCustomElement(class extends
     "status": [1],
     "document": [16],
     "isOpen": [32],
-    "recipientStatusIcons": [32]
+    "recipientStatusIcons": [32],
+    "containerId": [32]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {