npm - @verdocs/web-sdk - Versions diffs - 1.9.9 → 1.9.10 - Mend

@verdocs/web-sdk 1.9.9 → 1.9.10

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 (523) hide show

package/dist/collection/components/elements/verdocs-template-fields/verdocs-template-fields.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-template-fields.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-fields/verdocs-template-fields.tsx"],"names":[],"mappings":"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","sourcesContent":["import interact from 'interactjs';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\nimport {ITemplateField} from '@verdocs/js-sdk/Templates/Types';\nimport {Component, h, Event, EventEmitter, Fragment, Prop, Host} from '@stencil/core';\nimport {IPageRenderEvent} from '../../embeds/verdocs-view/verdocs-view';\nimport {getRoleIndex, renderDocumentField} from '../../../utils/utils';\nimport TemplateStore from '../../../utils/templateStore';\nimport {loadTemplate} from '../../../utils/Templates';\nimport {SDKError} from '../../../utils/errors';\n\n/*\n Helper function to safely set/update components in a CSS transform attribute. Transform is normally set as a string of\n * `operation1(param) operation2(param) ...` components, which makes updating them a bit of a pain. This will remove the\n * specified component if it's already set and replace it with the new value, without touching the other components that\n * may already be set. Note that this operation moves the component to the end of the transform chain so it's not meant\n * to be used for order-sensitive components e.g. translate-then-rotate.\n /\nconst updateCssTransform = (el: HTMLElement, key: string, value: string) => {\n // e.g. 'scale(1.87908, 1.87908) translate(0px, 0px);'\n const currentTransform = el.style.transform;\n // e.g. ['scale(1.87908, 1.87908)', 'scale', '1.87908, 1.87908', ...], [ 'translate(0px, 0px)', 'translate', '0px, 0px']]\n const components = [...currentTransform.matchAll(/(\\w+)\$([^)])\$/gi)];\n el.style.transform = [\n components //\n .filter(component => component[1] !== key) // Remove the entry if it's already set\n .map(component => component[0]), // Convert back the remaining entries\n `${key}(${value})`,\n ].join(' ');\n};\n\nconst iconSingleline = '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M3.425 16.15V13h11.15v3.15Zm0-5.15V7.85h17.15V11Z\"/></svg>';\n\nconst iconMultiline =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M3.225 20.725v-3.15h11.55v3.15Zm0-4.775V12.8h17.55v3.15Zm0-4.75V8.05h17.55v3.15Zm0-4.775v-3.15h17.55v3.15Z\"/></svg>';\n\nconst iconCheck =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m10.55 16.55 7.275-7.275L16.05 7.5l-5.5 5.45-2.675-2.65L6.1 12.075Zm-5.375 4.925q-1.125 0-1.887-.763-.763-.762-.763-1.887V5.175q0-1.125.763-1.888.762-.762 1.887-.762h13.65q1.125 0 1.888.762.762.763.762 1.888v13.65q0 1.125-.762 1.887-.763.763-1.888.763Zm0-2.65h13.65V5.175H5.175v13.65Zm0-13.65v13.65-13.65Z\"/></svg>';\n\nconst iconRadio =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M12 17q2.075 0 3.538-1.463Q17 14.075 17 12t-1.462-3.538Q14.075 7 12 7 9.925 7 8.463 8.462 7 9.925 7 12q0 2.075 1.463 3.537Q9.925 17 12 17Zm0 5.85q-2.275 0-4.25-.85t-3.438-2.312Q2.85 18.225 2 16.25q-.85-1.975-.85-4.25T2 7.75q.85-1.975 2.312-3.438Q5.775 2.85 7.75 2q1.975-.85 4.25-.85t4.25.85q1.975.85 3.438 2.312Q21.15 5.775 22 7.75q.85 1.975.85 4.25T22 16.25q-.85 1.975-2.312 3.438Q18.225 21.15 16.25 22q-1.975.85-4.25.85Zm0-3.15q3.25 0 5.475-2.225Q19.7 15.25 19.7 12q0-3.25-2.225-5.475Q15.25 4.3 12 4.3q-3.25 0-5.475 2.225Q4.3 8.75 4.3 12q0 3.25 2.225 5.475Q8.75 19.7 12 19.7Zm0-7.7Z\"/></svg>';\n\nconst iconDatepicker =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M7.6 13.925q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375Zm4.4 0q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375Zm4.4 0q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375ZM5.3 22.85q-1.325 0-2.238-.912-.912-.913-.912-2.238V6.3q0-1.325.912-2.238.913-.912 2.238-.912H6v-2h2.575v2h6.85v-2H18v2h.7q1.325 0 2.238.912.912.913.912 2.238v13.4q0 1.325-.912 2.238-.913.912-2.238.912Zm0-3.15h13.4V10H5.3v9.7ZM5.3 8h13.4V6.3H5.3Zm0 0V6.3 8Z\"/></svg>';\n\nconst iconSignature =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m9.225 21.225 4.65-4.65h8.45v4.65Zm-5.35-2.2H5.05l8.5-8.5-1.175-1.175-8.5 8.5Zm14.25-9.95L13.8 4.8l1.325-1.325q.625-.65 1.525-.663.9-.012 1.6.663l1.225 1.175q.675.675.663 1.562-.013.888-.663 1.513ZM16.7 10.55 6 21.225H1.675V16.9L12.35 6.225Zm-3.725-.625-.6-.575 1.175 1.175Z\"/></svg>';\n\nconst iconInitial = '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M6.225 20.775V7h-5V3.225H15V7h-5v13.775Zm9.775 0v-8h-3V9h9.775v3.775h-3v8Z\"/></svg>';\n\n/*\n Displays a builder experience for laying out fields in a template. Note that this experience requires a large display area to\n * present all of the required controls, so it is primarily intended to be used in desktop environments.\n /\n@Component({\n tag: 'verdocs-template-fields',\n styleUrl: 'verdocs-template-fields.scss',\n shadow: false,\n})\nexport class VerdocsTemplateFields {\n page0El: HTMLDivElement;\n toolbarEl: HTMLDivElement;\n\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The ID of the template to create the document from.\n /\n @Prop() templateId: string \| null = null;\n\n /\n Event fired when the user completes the step.\n /\n @Event({composed: true}) settingsUpdated: EventEmitter;\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n\n if (!this.templateId) {\n console.log(`[FIELDS] Missing required template ID ${this.templateId}`);\n return;\n }\n\n try {\n console.log(`[FIELDS] Loading template ${this.templateId}`);\n await loadTemplate(this.endpoint, this.templateId);\n } catch (e) {\n console.log('[FIELDS] Error loading template', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n } catch (e) {\n console.log('[FIELDS] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n componentDidRender() {\n // console.log('rendered', this.page0El, this.toolbarEl);\n // console.log('w', this.page0El.clientWidth);\n // console.log('t', this.toolbarEl.clientWidth);\n interact.dynamicDrop(true);\n this.toolbarEl.style.width = `${this.page0El.clientWidth}px`;\n }\n\n async handleFieldChange(field: ITemplateField, e: any, optionId?: string) {\n console.log('[FIELDS] handleFieldChange', field, e, optionId);\n }\n\n handlePageRendered(e) {\n const pageInfo = e.detail as IPageRenderEvent;\n console.log('[FIELDS] Page rendered', pageInfo);\n\n const fields = TemplateStore.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);\n // const fields = this.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);\n console.log('[FIELDS] Fields on page', fields);\n fields.forEach(field => {\n const el = renderDocumentField(field, pageInfo.renderedPage, getRoleIndex(TemplateStore.roleNames, field.role_name), this.handleFieldChange, true, true, true);\n // const el = renderDocumentField(field, pageInfo.renderedPage, getRoleIndex(this.roles, field.role_name), this.handleFieldChange, true, true, true);\n if (!el) {\n return;\n }\n\n el.addEventListener('recipientChanged', e => {\n el.setAttribute('roleindex', getRoleIndex(TemplateStore.roleNames, e.detail));\n // el.setAttribute('roleindex', getRoleIndex(this.roles, e.detail));\n });\n\n el.setAttribute('xScale', pageInfo.renderedPage.xScale);\n el.setAttribute('yScale', pageInfo.renderedPage.yScale);\n\n interact(el).draggable({\n listeners: {\n start(event) {\n console.log('[FIELDS] Drag started', event.type, event.target);\n },\n move(event) {\n const oldX = +(event.target.getAttribute('posX') \|\| 0);\n const oldY = +(event.target.getAttribute('posY') \|\| 0);\n const xScale = +(event.target.getAttribute('xScale') \|\| 1);\n const yScale = +(event.target.getAttribute('yScale') \|\| 1);\n const newX = event.dx / xScale + oldX;\n const newY = event.dy / yScale + oldY;\n event.target.setAttribute('posX', newX);\n event.target.setAttribute('posy', newY);\n updateCssTransform(event.target, 'translate', `${newX}px, ${newY}px`);\n },\n end(event) {\n console.log('[FIELDS] Drag ended', event);\n // event.target.setAttribute('posX', 0);\n // event.target.setAttribute('posy', 0);\n // updateCssTransform(event.target, 'translate', `${0}px, ${0}px`);\n },\n },\n });\n });\n }\n\n render() {\n const testField: ITemplateField = {\n template_id: '',\n name: 'test',\n role_name: 'Recipient 1',\n type: 'textbox',\n required: true,\n setting: {\n x: 0,\n y: 0,\n },\n page_sequence: 0,\n };\n\n if (TemplateStore.loading) {\n return (\n <Host>\n <verdocs-loader />\n </Host>\n );\n }\n\n return (\n <Host>\n {TemplateStore.template ? (\n <Fragment>\n <div class=\"fields-bar\" ref={el => (this.toolbarEl = el as HTMLDivElement)}>\n <div class=\"label\">Add Field:</div>\n <verdocs-toolbar-icon icon={iconSingleline} text=\"Single-line Text Box\" onPress={() => console.log('single press')} />\n <verdocs-toolbar-icon icon={iconMultiline} text=\"Multi-line Text Box\" onPress={() => console.log('multi press')} />\n <verdocs-toolbar-icon icon={iconCheck} text=\"Checkbox\" onPress={() => console.log('check press')} />\n <verdocs-toolbar-icon icon={iconRadio} text=\"Radio Button\" onPress={() => console.log('radio press')} />\n <verdocs-toolbar-icon icon={iconDatepicker} text=\"Date Picker\" onPress={() => console.log('date press')} />\n <verdocs-toolbar-icon icon={iconSignature} text=\"Signature\" onPress={() => console.log('signature press')} />\n <verdocs-toolbar-icon icon={iconInitial} text=\"Initials\" onPress={() => console.log('initial press')} />\n <div style={{flex: '1'}} />\n <button onClick={() => console.log('save')} disabled={true} class=\"operation\">\n Save\n </button>\n <button onClick={() => console.log('close')} class=\"operation\">\n Close\n </button>\n </div>\n\n <div class=\"page-0\" ref={el => (this.page0El = el as HTMLDivElement)}>\n <div class=\"user-placed-fields\">\n <div class=\"title\">User-Placed Fields</div>\n <verdocs-field-signature\n field={testField}\n style={{width: '82px', height: '41px', left: '20px', top: '40px', transform: 'scale(1,1)', backgroundColor: getRGBA(0)}}\n moveable={true}\n editable={true}\n />\n </div>\n </div>\n\n <verdocs-view\n templateId={this.templateId}\n endpoint={this.endpoint}\n onPageRendered={e => this.handlePageRendered(e)}\n pageLayers={[\n {name: 'page', type: 'canvas'},\n {name: 'controls', type: 'div'},\n ]}\n />\n </Fragment>\n ) : (\n <div>Error loading Template. Please try again later.</div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-template-fields.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-fields/verdocs-template-fields.tsx"],"names":[],"mappings":"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","sourcesContent":["import interact from 'interactjs';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\nimport {ITemplate, ITemplateField} from '@verdocs/js-sdk/Templates/Types';\nimport {Component, h, Event, EventEmitter, Fragment, Prop, Host} from '@stencil/core';\nimport {IPageRenderEvent} from '../../embeds/verdocs-view/verdocs-view';\nimport {getRoleIndex, renderDocumentField} from '../../../utils/utils';\nimport TemplateStore from '../../../utils/templateStore';\nimport {loadTemplate} from '../../../utils/Templates';\nimport {SDKError} from '../../../utils/errors';\n\n/*\n Helper function to safely set/update components in a CSS transform attribute. Transform is normally set as a string of\n * `operation1(param) operation2(param) ...` components, which makes updating them a bit of a pain. This will remove the\n * specified component if it's already set and replace it with the new value, without touching the other components that\n * may already be set. Note that this operation moves the component to the end of the transform chain so it's not meant\n * to be used for order-sensitive components e.g. translate-then-rotate.\n /\nconst updateCssTransform = (el: HTMLElement, key: string, value: string) => {\n // e.g. 'scale(1.87908, 1.87908) translate(0px, 0px);'\n const currentTransform = el.style.transform;\n // e.g. ['scale(1.87908, 1.87908)', 'scale', '1.87908, 1.87908', ...], [ 'translate(0px, 0px)', 'translate', '0px, 0px']]\n const components = [...currentTransform.matchAll(/(\\w+)\$([^)])\$/gi)];\n el.style.transform = [\n components //\n .filter(component => component[1] !== key) // Remove the entry if it's already set\n .map(component => component[0]), // Convert back the remaining entries\n `${key}(${value})`,\n ].join(' ');\n};\n\nconst iconSingleline = '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M3.425 16.15V13h11.15v3.15Zm0-5.15V7.85h17.15V11Z\"/></svg>';\n\nconst iconMultiline =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M3.225 20.725v-3.15h11.55v3.15Zm0-4.775V12.8h17.55v3.15Zm0-4.75V8.05h17.55v3.15Zm0-4.775v-3.15h17.55v3.15Z\"/></svg>';\n\nconst iconCheck =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m10.55 16.55 7.275-7.275L16.05 7.5l-5.5 5.45-2.675-2.65L6.1 12.075Zm-5.375 4.925q-1.125 0-1.887-.763-.763-.762-.763-1.887V5.175q0-1.125.763-1.888.762-.762 1.887-.762h13.65q1.125 0 1.888.762.762.763.762 1.888v13.65q0 1.125-.762 1.887-.763.763-1.888.763Zm0-2.65h13.65V5.175H5.175v13.65Zm0-13.65v13.65-13.65Z\"/></svg>';\n\nconst iconRadio =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M12 17q2.075 0 3.538-1.463Q17 14.075 17 12t-1.462-3.538Q14.075 7 12 7 9.925 7 8.463 8.462 7 9.925 7 12q0 2.075 1.463 3.537Q9.925 17 12 17Zm0 5.85q-2.275 0-4.25-.85t-3.438-2.312Q2.85 18.225 2 16.25q-.85-1.975-.85-4.25T2 7.75q.85-1.975 2.312-3.438Q5.775 2.85 7.75 2q1.975-.85 4.25-.85t4.25.85q1.975.85 3.438 2.312Q21.15 5.775 22 7.75q.85 1.975.85 4.25T22 16.25q-.85 1.975-2.312 3.438Q18.225 21.15 16.25 22q-1.975.85-4.25.85Zm0-3.15q3.25 0 5.475-2.225Q19.7 15.25 19.7 12q0-3.25-2.225-5.475Q15.25 4.3 12 4.3q-3.25 0-5.475 2.225Q4.3 8.75 4.3 12q0 3.25 2.225 5.475Q8.75 19.7 12 19.7Zm0-7.7Z\"/></svg>';\n\nconst iconDatepicker =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M7.6 13.925q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375Zm4.4 0q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375Zm4.4 0q-.55 0-.925-.375t-.375-.925q0-.55.375-.937.375-.388.925-.388t.925.388q.375.387.375.937t-.375.925q-.375.375-.925.375ZM5.3 22.85q-1.325 0-2.238-.912-.912-.913-.912-2.238V6.3q0-1.325.912-2.238.913-.912 2.238-.912H6v-2h2.575v2h6.85v-2H18v2h.7q1.325 0 2.238.912.912.913.912 2.238v13.4q0 1.325-.912 2.238-.913.912-2.238.912Zm0-3.15h13.4V10H5.3v9.7ZM5.3 8h13.4V6.3H5.3Zm0 0V6.3 8Z\"/></svg>';\n\nconst iconSignature =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m9.225 21.225 4.65-4.65h8.45v4.65Zm-5.35-2.2H5.05l8.5-8.5-1.175-1.175-8.5 8.5Zm14.25-9.95L13.8 4.8l1.325-1.325q.625-.65 1.525-.663.9-.012 1.6.663l1.225 1.175q.675.675.663 1.562-.013.888-.663 1.513ZM16.7 10.55 6 21.225H1.675V16.9L12.35 6.225Zm-3.725-.625-.6-.575 1.175 1.175Z\"/></svg>';\n\nconst iconInitial = '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M6.225 20.775V7h-5V3.225H15V7h-5v13.775Zm9.775 0v-8h-3V9h9.775v3.775h-3v8Z\"/></svg>';\n\n/*\n Displays a builder experience for laying out fields in a template. Note that this experience requires a large display area to\n * present all of the required controls, so it is primarily intended to be used in desktop environments.\n /\n@Component({\n tag: 'verdocs-template-fields',\n styleUrl: 'verdocs-template-fields.scss',\n shadow: false,\n})\nexport class VerdocsTemplateFields {\n page0El: HTMLDivElement;\n toolbarEl: HTMLDivElement;\n\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The ID of the template to create the document from.\n /\n @Prop() templateId: string \| null = null;\n\n /\n Event fired when the user completes the step.\n /\n @Event({composed: true}) next: EventEmitter<ITemplate>;\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n\n if (!this.templateId) {\n console.log(`[FIELDS] Missing required template ID ${this.templateId}`);\n return;\n }\n\n try {\n console.log(`[FIELDS] Loading template ${this.templateId}`);\n await loadTemplate(this.endpoint, this.templateId);\n } catch (e) {\n console.log('[FIELDS] Error loading template', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n } catch (e) {\n console.log('[FIELDS] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n componentDidRender() {\n // console.log('rendered', this.page0El, this.toolbarEl);\n // console.log('w', this.page0El.clientWidth);\n // console.log('t', this.toolbarEl.clientWidth);\n interact.dynamicDrop(true);\n this.toolbarEl.style.width = `${this.page0El.clientWidth}px`;\n }\n\n async handleFieldChange(field: ITemplateField, e: any, optionId?: string) {\n console.log('[FIELDS] handleFieldChange', field, e, optionId);\n }\n\n handlePageRendered(e) {\n const pageInfo = e.detail as IPageRenderEvent;\n console.log('[FIELDS] Page rendered', pageInfo);\n\n const fields = TemplateStore.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);\n // const fields = this.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);\n console.log('[FIELDS] Fields on page', fields);\n fields.forEach(field => {\n const el = renderDocumentField(field, pageInfo.renderedPage, getRoleIndex(TemplateStore.roleNames, field.role_name), this.handleFieldChange, true, true, true);\n // const el = renderDocumentField(field, pageInfo.renderedPage, getRoleIndex(this.roles, field.role_name), this.handleFieldChange, true, true, true);\n if (!el) {\n return;\n }\n\n el.addEventListener('recipientChanged', e => {\n el.setAttribute('roleindex', getRoleIndex(TemplateStore.roleNames, e.detail));\n // el.setAttribute('roleindex', getRoleIndex(this.roles, e.detail));\n });\n\n el.setAttribute('xScale', pageInfo.renderedPage.xScale);\n el.setAttribute('yScale', pageInfo.renderedPage.yScale);\n\n interact(el).draggable({\n listeners: {\n start(event) {\n console.log('[FIELDS] Drag started', event.type, event.target);\n },\n move(event) {\n const oldX = +(event.target.getAttribute('posX') \|\| 0);\n const oldY = +(event.target.getAttribute('posY') \|\| 0);\n const xScale = +(event.target.getAttribute('xScale') \|\| 1);\n const yScale = +(event.target.getAttribute('yScale') \|\| 1);\n const newX = event.dx / xScale + oldX;\n const newY = event.dy / yScale + oldY;\n event.target.setAttribute('posX', newX);\n event.target.setAttribute('posy', newY);\n updateCssTransform(event.target, 'translate', `${newX}px, ${newY}px`);\n },\n end(event) {\n console.log('[FIELDS] Drag ended', event);\n // event.target.setAttribute('posX', 0);\n // event.target.setAttribute('posy', 0);\n // updateCssTransform(event.target, 'translate', `${0}px, ${0}px`);\n },\n },\n });\n });\n }\n\n render() {\n const testField: ITemplateField = {\n template_id: '',\n name: 'test',\n role_name: 'Recipient 1',\n type: 'textbox',\n required: true,\n setting: {\n x: 0,\n y: 0,\n },\n page_sequence: 0,\n };\n\n if (TemplateStore.loading) {\n return (\n <Host>\n <verdocs-loader />\n </Host>\n );\n }\n\n return (\n <Host>\n {TemplateStore.template ? (\n <Fragment>\n <div class=\"fields-bar\" ref={el => (this.toolbarEl = el as HTMLDivElement)}>\n <div class=\"label\">Add Field:</div>\n <verdocs-toolbar-icon icon={iconSingleline} text=\"Single-line Text Box\" onClick={() => console.log('single press')} />\n <verdocs-toolbar-icon icon={iconMultiline} text=\"Multi-line Text Box\" onClick={() => console.log('multi press')} />\n <verdocs-toolbar-icon icon={iconCheck} text=\"Checkbox\" onClick={() => console.log('check press')} />\n <verdocs-toolbar-icon icon={iconRadio} text=\"Radio Button\" onClick={() => console.log('radio press')} />\n <verdocs-toolbar-icon icon={iconDatepicker} text=\"Date Picker\" onClick={() => console.log('date press')} />\n <verdocs-toolbar-icon icon={iconSignature} text=\"Signature\" onClick={() => console.log('signature press')} />\n <verdocs-toolbar-icon icon={iconInitial} text=\"Initials\" onClick={() => console.log('initial press')} />\n <div style={{flex: '1'}} />\n <button onClick={() => this.next?.emit(TemplateStore.template)} disabled={true} class=\"operation\">\n Save\n </button>\n <button onClick={() => this.cancel?.emit()} class=\"operation\">\n Close\n </button>\n </div>\n\n <div class=\"page-0\" ref={el => (this.page0El = el as HTMLDivElement)}>\n <div class=\"user-placed-fields\">\n <div class=\"title\">User-Placed Fields</div>\n <verdocs-field-signature\n field={testField}\n style={{width: '82px', height: '41px', left: '20px', top: '40px', transform: 'scale(1,1)', backgroundColor: getRGBA(0)}}\n moveable={true}\n editable={true}\n />\n </div>\n </div>\n\n <verdocs-view\n templateId={this.templateId}\n endpoint={this.endpoint}\n onPageRendered={e => this.handlePageRendered(e)}\n pageLayers={[\n {name: 'page', type: 'canvas'},\n {name: 'controls', type: 'div'},\n ]}\n />\n </Fragment>\n ) : (\n <div>Error loading Template. Please try again later.</div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/elements/verdocs-template-fields/verdocs-template-fields.stories.js CHANGED Viewed

@@ -6,15 +6,15 @@ export default {
     templateId: 'd2338742-f3a1-465b-8592-806587413cc1',
   },
   argTypes: {
-    cancel: { action: 'cancel' },
-    save: { action: 'save' },
+    onCancel: { action: 'cancel' },
+    onNext: { action: 'next' },
   },
   parameters: {
     layout: 'fullscreen',
   },
 };
 //export const TemplateFields = ({templateId, cancel, save}) => html`<div style="height: 600px; transform: translateZ(0);">
-export const TemplateFields = ({ templateId, cancel, save }) => html `<div style="height: 600px">
-  <verdocs-template-fields .templateId=${templateId} @cancel=${cancel} @save=${save} />
+export const TemplateFields = ({ templateId, onCancel, onNext }) => html `<div style="height: 600px">
+  <verdocs-template-fields .templateId=${templateId} @cancel=${onCancel} @next=${onNext} />
 </div>`;
 //# sourceMappingURL=verdocs-template-fields.stories.js.map

package/dist/collection/components/elements/verdocs-template-fields/verdocs-template-fields.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-template-fields.stories.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-fields/verdocs-template-fields.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,UAAU,CAAC;AAG9B,eAAe;EACb,KAAK,EAAE,0BAA0B;EACjC,SAAS,EAAE,yBAAyB;EACpC,IAAI,EAAE;IACJ,UAAU,EAAE,sCAAsC;GACnD;EACD,QAAQ,EAAE;IACR,~~MAAM~~,EAAE,EAAC,MAAM,EAAE,QAAQ,EAAC;~~IAC1B~~,~~IAAI~~,EAAE,EAAC,MAAM,EAAE,MAAM,EAAC;~~GACvB~~;EACD,UAAU,EAAE;IACV,MAAM,EAAE,YAAY;GACrB;CACM,CAAC;AAEV,2HAA2H;AAC3H,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAC,UAAU,EAAE,~~MAAM~~,EAAE,~~IAAI~~,EAAC,EAAE,EAAE,CAAC,IAAI,CAAA;~~yCACzB~~,UAAU,YAAY,~~MAAM~~,UAAU,~~IAAI~~;~~OAC5E~~,CAAC","sourcesContent":["import {html} from 'lit-html';\nimport {Meta} from '@storybook/web-components';\n\nexport default {\n title: 'Elements/Template Fields',\n component: 'verdocs-template-fields',\n args: {\n templateId: 'd2338742-f3a1-465b-8592-806587413cc1',\n },\n argTypes: {\n ~~cancel~~: {action: 'cancel'},\n ~~save~~: {action: '~~save~~'},\n },\n parameters: {\n layout: 'fullscreen',\n },\n} as Meta;\n\n//export const TemplateFields = ({templateId, cancel, save}) => html`<div style=\"height: 600px; transform: translateZ(0);\">\nexport const TemplateFields = ({templateId, ~~cancel~~, ~~save~~}) => html`<div style=\"height: 600px\">\n <verdocs-template-fields .templateId=${templateId} @cancel=${~~cancel~~} @~~save~~=${~~save~~} />\n</div>`;\n"]}
1	+ {"version":3,"file":"verdocs-template-fields.stories.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-fields/verdocs-template-fields.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,UAAU,CAAC;AAG9B,eAAe;EACb,KAAK,EAAE,0BAA0B;EACjC,SAAS,EAAE,yBAAyB;EACpC,IAAI,EAAE;IACJ,UAAU,EAAE,sCAAsC;GACnD;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE,EAAC,MAAM,EAAE,QAAQ,EAAC;IAC5B,MAAM,EAAE,EAAC,MAAM,EAAE,MAAM,EAAC;GACzB;EACD,UAAU,EAAE;IACV,MAAM,EAAE,YAAY;GACrB;CACM,CAAC;AAEV,2HAA2H;AAC3H,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAC,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAC,EAAE,EAAE,CAAC,IAAI,CAAA;yCAC7B,UAAU,YAAY,QAAQ,UAAU,MAAM;OAChF,CAAC","sourcesContent":["import {html} from 'lit-html';\nimport {Meta} from '@storybook/web-components';\n\nexport default {\n title: 'Elements/Template Fields',\n component: 'verdocs-template-fields',\n args: {\n templateId: 'd2338742-f3a1-465b-8592-806587413cc1',\n },\n argTypes: {\n onCancel: {action: 'cancel'},\n onNext: {action: 'next'},\n },\n parameters: {\n layout: 'fullscreen',\n },\n} as Meta;\n\n//export const TemplateFields = ({templateId, cancel, save}) => html`<div style=\"height: 600px; transform: translateZ(0);\">\nexport const TemplateFields = ({templateId, onCancel, onNext}) => html`<div style=\"height: 600px\">\n <verdocs-template-fields .templateId=${templateId} @cancel=${onCancel} @next=${onNext} />\n</div>`;\n"]}

package/dist/collection/components/elements/verdocs-template-properties/verdocs-template-properties.js CHANGED Viewed

@@ -38,10 +38,6 @@ export class VerdocsTemplateProperties {
       (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
     }
   }
-  handleMessageChange(e) {
-    console.log(e);
-    // this.message = e.target.value;
-  }
   handleCancel(e) {
     var _a;
     e.stopPropagation();
@@ -50,32 +46,15 @@ export class VerdocsTemplateProperties {
   handleSubmit(e) {
     var _a;
     e.stopPropagation();
-    console.log('new', {
-      name: this.name,
-      visibility: this.visibility,
-      firstReminderDays: +this.firstReminderDays,
-      reminderDays: +this.reminderDays,
-      sendReminders: this.sendReminders,
-    });
-    (_a = this.settingsUpdated) === null || _a === void 0 ? void 0 : _a.emit({
+    (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit({
       name: this.name,
       firstReminderDays: +this.firstReminderDays,
       reminderDays: +this.reminderDays,
       sendReminders: this.sendReminders,
     });
-    // this.contactSelected?.emit({
-    //   delegator: this.delegator,
-    // });
   }
   render() {
-    console.log('vals', { firstReminderDays: this.firstReminderDays, reminderDays: this.reminderDays, name: this.name });
-    return (h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Template Name"), h("fieldset", null, h("verdocs-text-input", { value: this.name, autocomplete: "off", onInput: (e) => {
-        this.name = e.target.value;
-      } })), h("h5", null, "Reminders"), h("fieldset", null, h("div", { class: "input-row" }, h("label", null, "Send Automatic Reminders"), h("verdocs-checkbox", { name: "automatic-reminders", checked: this.sendReminders, value: "on", onSelected: e => (this.sendReminders = e.detail.value === 'on') })), h("div", { class: "input-row" }, h("label", null, "Days Before First Reminder"), h("verdocs-text-input", { value: this.firstReminderDays, onInput: (e) => {
-        this.firstReminderDays = e.target.value;
-      } })), h("div", { class: "input-row" }, h("label", null, "Days Between Reminders"), h("verdocs-text-input", { value: this.reminderDays, onInput: (e) => {
-        this.firstReminderDays = e.target.value;
-      } }))), h("h5", null, "Template Visibility"), h("fieldset", null, h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "private" }), h("label", { htmlFor: "verdocs-radio-button-visibility-private" }, h("div", { class: "title" }, "Private"), h("div", { class: "description" }, "Only you can share and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared" }), h("label", { htmlFor: "verdocs-radio-button-visibility-shared" }, h("div", { class: "title" }, "Shared to your organization"), h("div", { class: "description" }, "Give access to your organization to share and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared_public" }), h("label", { htmlFor: "verdocs-radio-button-visibility-shared_public" }, h("div", { class: "title" }, "Shared to your organization and Public"), h("div", { class: "description" }, "Give access to your organization to share this template, and anyone on the Web can find and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "public" }), h("label", { htmlFor: "verdocs-radio-button-visibility-public" }, h("div", { class: "title" }, "Public"), h("div", { class: "description" }, "Anyone on the Web can find and use this template")))), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onPress: e => this.handleCancel(e) }), h("verdocs-button", { label: "OK", size: "small", onPress: e => this.handleSubmit(e) }))));
+    return (h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Template Name"), h("fieldset", null, h("verdocs-text-input", { value: this.name, autocomplete: "off", onInput: (e) => (this.name = e.target.value) })), h("h5", null, "Reminders"), h("fieldset", null, h("div", { class: "input-row" }, h("label", null, "Send Automatic Reminders"), h("verdocs-checkbox", { name: "automatic-reminders", checked: this.sendReminders, value: "on", onInput: (e) => (this.sendReminders = e.target.checked) })), h("div", { class: "input-row" }, h("label", null, "Days Before First Reminder"), h("verdocs-text-input", { value: this.firstReminderDays, onInput: (e) => (this.firstReminderDays = e.target.value) })), h("div", { class: "input-row" }, h("label", null, "Days Between Reminders"), h("verdocs-text-input", { value: this.reminderDays, onInput: (e) => (this.reminderDays = e.target.value) }))), h("h5", null, "Template Visibility"), h("fieldset", null, h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "private", onChange: () => (this.visibility = 'private') }), h("label", { htmlFor: "verdocs-radio-button-visibility-private" }, h("div", { class: "title" }, "Private"), h("div", { class: "description" }, "Only you can share and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared", onChange: () => (this.visibility = 'shared') }), h("label", { htmlFor: "verdocs-radio-button-visibility-shared" }, h("div", { class: "title" }, "Shared to your organization"), h("div", { class: "description" }, "Give access to your organization to share and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared_public", onChange: () => (this.visibility = 'shared_public') }), h("label", { htmlFor: "verdocs-radio-button-visibility-shared_public" }, h("div", { class: "title" }, "Shared to your organization and Public"), h("div", { class: "description" }, "Give access to your organization to share this template, and anyone on the Web can find and use this template"))), h("div", { class: "radio-row" }, h("verdocs-radio-button", { name: "visibility", checked: this.visibility === 'public', value: "public", onChange: () => (this.visibility = 'public') }), h("label", { htmlFor: "verdocs-radio-button-visibility-public" }, h("div", { class: "title" }, "Public"), h("div", { class: "description" }, "Anyone on the Web can find and use this template")))), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
   }
   static get is() { return "verdocs-template-properties"; }
   static get originalStyleUrls() {
@@ -158,8 +137,8 @@ export class VerdocsTemplateProperties {
           "references": {}
         }
       }, {
-        "method": "settingsUpdated",
-        "name": "settingsUpdated",
+        "method": "next",
+        "name": "next",
         "bubbles": true,
         "cancelable": true,
         "composed": true,

package/dist/collection/components/elements/verdocs-template-properties/verdocs-template-properties.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-template-properties.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-properties/verdocs-template-properties.tsx"],"names":[],"mappings":"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","sourcesContent":["import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State} from '@stencil/core';\nimport {getTemplate} from '@verdocs/js-sdk/Templates/Templates';\nimport {ITemplate} from '@verdocs/js-sdk/Templates/Types';\nimport {SDKError} from '../../../utils/errors';\nimport TemplateStore from '../../../utils/templateStore';\n\n/*\n Displays a collection of settings boxes that allow a user to configure a template's behavior.\n /\n@Component({\n tag: 'verdocs-template-properties',\n styleUrl: 'verdocs-template-properties.scss',\n shadow: false,\n})\nexport class VerdocsTemplateProperties {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The template ID to edit.\n /\n @Prop() templateId: string = '';\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired when the user completes the step.\n /\n @Event({composed: true}) settingsUpdated: EventEmitter<{name: string; sendReminders: boolean; firstReminderDays: number; reminderDays: number}>;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n @State() template: ITemplate \| null = null;\n @State() name: string = '';\n @State() visibility: string = '';\n @State() sendReminders = false;\n @State() firstReminderDays = '1';\n @State() reminderDays = '1';\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n\n console.log(`[PROPERTIES] Loading template ${this.templateId}`);\n const template = await getTemplate(this.endpoint, this.templateId);\n if (!template) {\n console.log('[PREVIEW] Unable to load template');\n return;\n }\n\n console.log('[PROPERTIES] Got template', template);\n this.template = template;\n TemplateStore.template = template;\n this.name = template.name;\n this.sendReminders = template.reminder_id !== null;\n } catch (e) {\n console.log('[PROPERTIES] Error loading template', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n handleMessageChange(e: any) {\n console.log(e);\n // this.message = e.target.value;\n }\n\n handleCancel(e) {\n e.stopPropagation();\n this.cancel?.emit();\n }\n\n handleSubmit(e) {\n e.stopPropagation();\n\n console.log('new', {\n name: this.name,\n visibility: this.visibility,\n firstReminderDays: +this.firstReminderDays,\n reminderDays: +this.reminderDays,\n sendReminders: this.sendReminders,\n });\n this.settingsUpdated?.emit({\n name: this.name,\n firstReminderDays: +this.firstReminderDays,\n reminderDays: +this.reminderDays,\n sendReminders: this.sendReminders,\n });\n\n // this.contactSelected?.emit({\n // delegator: this.delegator,\n // });\n }\n\n render() {\n console.log('vals', {firstReminderDays: this.firstReminderDays, reminderDays: this.reminderDays, name: this.name});\n return (\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Template Name</h5>\n <fieldset>\n <verdocs-text-input\n value={this.name}\n autocomplete=\"off\"\n onInput={(e: any) => {\n this.name = e.target.value;\n }}\n />\n </fieldset>\n\n <h5>Reminders</h5>\n <fieldset>\n <div class=\"input-row\">\n <label>Send Automatic Reminders</label>\n <verdocs-checkbox name=\"automatic-reminders\" checked={this.sendReminders} value=\"on\" onSelected={e => (this.sendReminders = e.detail.value === 'on')} />\n </div>\n\n <div class=\"input-row\">\n <label>Days Before First Reminder</label>\n <verdocs-text-input\n value={this.firstReminderDays}\n onInput={(e: any) => {\n this.firstReminderDays = e.target.value;\n }}\n />\n </div>\n <div class=\"input-row\">\n <label>Days Between Reminders</label>\n <verdocs-text-input\n value={this.reminderDays}\n onInput={(e: any) => {\n this.firstReminderDays = e.target.value;\n }}\n />\n </div>\n </fieldset>\n\n <h5>Template Visibility</h5>\n <fieldset>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"private\" />\n <label htmlFor=\"verdocs-radio-button-visibility-private\">\n <div class=\"title\">Private</div>\n <div class=\"description\">Only you can share and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"shared\" />\n <label htmlFor=\"verdocs-radio-button-visibility-shared\">\n <div class=\"title\">Shared to your organization</div>\n <div class=\"description\">Give access to your organization to share and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"shared_public\" />\n <label htmlFor=\"verdocs-radio-button-visibility-shared_public\">\n <div class=\"title\">Shared to your organization and Public</div>\n <div class=\"description\">Give access to your organization to share this template, and anyone on the Web can find and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"public\" />\n <label htmlFor=\"verdocs-radio-button-visibility-public\">\n <div class=\"title\">Public</div>\n <div class=\"description\">Anyone on the Web can find and use this template</div>\n </label>\n </div>\n </fieldset>\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onPress={e => this.handleCancel(e)} />\n <verdocs-button label=\"OK\" size=\"small\" onPress={e => this.handleSubmit(e)} />\n </div>\n </form>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-template-properties.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-properties/verdocs-template-properties.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAC,WAAW,EAAC,MAAM,qCAAqC,CAAC;AAEhE,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAC;AAC/C,OAAO,aAAa,MAAM,8BAA8B,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,yBAAyB;;oBAIA,eAAe,CAAC,UAAU,EAAE;sBAKnC,EAAE;oBAkBO,IAAI;gBAClB,EAAE;sBACI,EAAE;yBACP,KAAK;6BACD,GAAG;wBACR,GAAG;;EAE3B,KAAK,CAAC,iBAAiB;;IACrB,IAAI;MACF,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;MAE5B,OAAO,CAAC,GAAG,CAAC,iCAAiC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;MAChE,MAAM,QAAQ,GAAG,MAAM,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;MACnE,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,CAAC,GAAG,CAAC,mCAAmC,CAAC,CAAC;QACjD,OAAO;OACR;MAED,OAAO,CAAC,GAAG,CAAC,2BAA2B,EAAE,QAAQ,CAAC,CAAC;MACnD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;MACzB,aAAa,CAAC,QAAQ,GAAG,QAAQ,CAAC;MAClC,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;MAC1B,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC,WAAW,KAAK,IAAI,CAAC;KACpD;IAAC,OAAO,CAAC,EAAE;MACV,OAAO,CAAC,GAAG,CAAC,qCAAqC,EAAE,CAAC,CAAC,CAAC;MACtD,MAAA,IAAI,CAAC,QAAQ,0CAAE,IAAI,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,MAAA,CAAC,CAAC,QAAQ,0CAAE,MAAM,EAAE,MAAA,CAAC,CAAC,QAAQ,0CAAE,IAAI,CAAC,CAAC,CAAC;KACpF;EACH,CAAC;EAED,YAAY,CAAC,CAAC;;IACZ,CAAC,CAAC,eAAe,EAAE,CAAC;IACpB,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,EAAE,CAAC;EACtB,CAAC;EAED,YAAY,CAAC,CAAC;;IACZ,CAAC,CAAC,eAAe,EAAE,CAAC;IAEpB,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAC;MACd,IAAI,EAAE,IAAI,CAAC,IAAI;MACf,iBAAiB,EAAE,CAAC,IAAI,CAAC,iBAAiB;MAC1C,YAAY,EAAE,CAAC,IAAI,CAAC,YAAY;MAChC,aAAa,EAAE,IAAI,CAAC,aAAa;KAClC,CAAC,CAAC;EACL,CAAC;EAED,MAAM;IACJ,OAAO,CACL,YAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,YAAY,EAAC,KAAK;MAC5F,8BAAsB;MACtB;QACE,0BAAoB,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,YAAY,EAAC,KAAK,EAAC,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,CACrG;MAEX,0BAAkB;MAClB;QACE,WAAK,KAAK,EAAC,WAAW;UACpB,4CAAuC;UACvC,wBAAkB,IAAI,EAAC,qBAAqB,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAC,IAAI,EAAC,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GAAI,CACjJ;QAEN,WAAK,KAAK,EAAC,WAAW;UACpB,8CAAyC;UACzC,0BAAoB,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,CACjH;QACN,WAAK,KAAK,EAAC,WAAW;UACpB,0CAAqC;UACrC,0BAAoB,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,CACvG,CACG;MAEX,oCAA4B;MAC5B;QACE,WAAK,KAAK,EAAC,WAAW;UACpB,4BAAsB,IAAI,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,EAAE,KAAK,EAAC,SAAS,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC,GAAI;UACxH,aAAO,OAAO,EAAC,yCAAyC;YACtD,WAAK,KAAK,EAAC,OAAO,cAAc;YAChC,WAAK,KAAK,EAAC,aAAa,+CAA+C,CACjE,CACJ;QACN,WAAK,KAAK,EAAC,WAAW;UACpB,4BAAsB,IAAI,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,EAAE,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,GAAI;UACtH,aAAO,OAAO,EAAC,wCAAwC;YACrD,WAAK,KAAK,EAAC,OAAO,kCAAkC;YACpD,WAAK,KAAK,EAAC,aAAa,sEAAsE,CACxF,CACJ;QACN,WAAK,KAAK,EAAC,WAAW;UACpB,4BAAsB,IAAI,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,EAAE,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC,GAAI;UACpI,aAAO,OAAO,EAAC,+CAA+C;YAC5D,WAAK,KAAK,EAAC,OAAO,6CAA6C;YAC/D,WAAK,KAAK,EAAC,aAAa,oHAAoH,CACtI,CACJ;QACN,WAAK,KAAK,EAAC,WAAW;UACpB,4BAAsB,IAAI,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,KAAK,QAAQ,EAAE,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,GAAI;UAC9I,aAAO,OAAO,EAAC,wCAAwC;YACrD,WAAK,KAAK,EAAC,OAAO,aAAa;YAC/B,WAAK,KAAK,EAAC,aAAa,uDAAuD,CACzE,CACJ,CACG;MAEX,WAAK,KAAK,EAAC,SAAS;QAClB,WAAK,KAAK,EAAC,WAAW,GAAG;QAEzB,sBAAgB,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GAAI;QACpG,sBAAgB,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GAAI,CAC1E,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State} from '@stencil/core';\nimport {getTemplate} from '@verdocs/js-sdk/Templates/Templates';\nimport {ITemplate} from '@verdocs/js-sdk/Templates/Types';\nimport {SDKError} from '../../../utils/errors';\nimport TemplateStore from '../../../utils/templateStore';\n\n/*\n Displays a collection of settings boxes that allow a user to configure a template's behavior.\n /\n@Component({\n tag: 'verdocs-template-properties',\n styleUrl: 'verdocs-template-properties.scss',\n shadow: false,\n})\nexport class VerdocsTemplateProperties {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The template ID to edit.\n /\n @Prop() templateId: string = '';\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired when the user completes the step.\n /\n @Event({composed: true}) next: EventEmitter<{name: string; sendReminders: boolean; firstReminderDays: number; reminderDays: number}>;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n @State() template: ITemplate \| null = null;\n @State() name: string = '';\n @State() visibility: string = '';\n @State() sendReminders = false;\n @State() firstReminderDays = '1';\n @State() reminderDays = '1';\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n\n console.log(`[PROPERTIES] Loading template ${this.templateId}`);\n const template = await getTemplate(this.endpoint, this.templateId);\n if (!template) {\n console.log('[PREVIEW] Unable to load template');\n return;\n }\n\n console.log('[PROPERTIES] Got template', template);\n this.template = template;\n TemplateStore.template = template;\n this.name = template.name;\n this.sendReminders = template.reminder_id !== null;\n } catch (e) {\n console.log('[PROPERTIES] Error loading template', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n handleCancel(e) {\n e.stopPropagation();\n this.cancel?.emit();\n }\n\n handleSubmit(e) {\n e.stopPropagation();\n\n this.next?.emit({\n name: this.name,\n firstReminderDays: +this.firstReminderDays,\n reminderDays: +this.reminderDays,\n sendReminders: this.sendReminders,\n });\n }\n\n render() {\n return (\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Template Name</h5>\n <fieldset>\n <verdocs-text-input value={this.name} autocomplete=\"off\" onInput={(e: any) => (this.name = e.target.value)} />\n </fieldset>\n\n <h5>Reminders</h5>\n <fieldset>\n <div class=\"input-row\">\n <label>Send Automatic Reminders</label>\n <verdocs-checkbox name=\"automatic-reminders\" checked={this.sendReminders} value=\"on\" onInput={(e: any) => (this.sendReminders = e.target.checked)} />\n </div>\n\n <div class=\"input-row\">\n <label>Days Before First Reminder</label>\n <verdocs-text-input value={this.firstReminderDays} onInput={(e: any) => (this.firstReminderDays = e.target.value)} />\n </div>\n <div class=\"input-row\">\n <label>Days Between Reminders</label>\n <verdocs-text-input value={this.reminderDays} onInput={(e: any) => (this.reminderDays = e.target.value)} />\n </div>\n </fieldset>\n\n <h5>Template Visibility</h5>\n <fieldset>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"private\" onChange={() => (this.visibility = 'private')} />\n <label htmlFor=\"verdocs-radio-button-visibility-private\">\n <div class=\"title\">Private</div>\n <div class=\"description\">Only you can share and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"shared\" onChange={() => (this.visibility = 'shared')} />\n <label htmlFor=\"verdocs-radio-button-visibility-shared\">\n <div class=\"title\">Shared to your organization</div>\n <div class=\"description\">Give access to your organization to share and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={true} value=\"shared_public\" onChange={() => (this.visibility = 'shared_public')} />\n <label htmlFor=\"verdocs-radio-button-visibility-shared_public\">\n <div class=\"title\">Shared to your organization and Public</div>\n <div class=\"description\">Give access to your organization to share this template, and anyone on the Web can find and use this template</div>\n </label>\n </div>\n <div class=\"radio-row\">\n <verdocs-radio-button name=\"visibility\" checked={this.visibility === 'public'} value=\"public\" onChange={() => (this.visibility = 'public')} />\n <label htmlFor=\"verdocs-radio-button-visibility-public\">\n <div class=\"title\">Public</div>\n <div class=\"description\">Anyone on the Web can find and use this template</div>\n </label>\n </div>\n </fieldset>\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={e => this.handleCancel(e)} />\n <verdocs-button label=\"OK\" size=\"small\" onClick={e => this.handleSubmit(e)} />\n </div>\n </form>\n );\n }\n}\n"]}

package/dist/collection/components/elements/verdocs-template-properties/verdocs-template-properties.stories.js CHANGED Viewed

@@ -6,9 +6,9 @@ export default {
     templateId: '951016b0-c5ef-450d-b628-9a0c5b84b163',
   },
   argTypes: {
-    cancel: { action: 'cancel' },
-    settingsUpdated: { action: 'settingsUpdated' },
+    onCancel: { action: 'cancel' },
+    onNext: { action: 'next' },
   },
 };
-export const TemplateProperties = ({ cancel, settingsUpdated, templateId }) => html `<verdocs-template-properties .templateId=${templateId} @cancel=${cancel} @settingsUpdated=${settingsUpdated} />`;
+export const TemplateProperties = ({ onCancel, onNext, templateId }) => html `<verdocs-template-properties .templateId=${templateId} @cancel=${onCancel} @next=${onNext} />`;
 //# sourceMappingURL=verdocs-template-properties.stories.js.map

package/dist/collection/components/elements/verdocs-template-properties/verdocs-template-properties.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-template-properties.stories.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-properties/verdocs-template-properties.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,UAAU,CAAC;AAG9B,eAAe;EACb,KAAK,EAAE,8BAA8B;EACrC,SAAS,EAAE,6BAA6B;EACxC,IAAI,EAAE;IACJ,UAAU,EAAE,sCAAsC;GACnD;EACD,QAAQ,EAAE;IACR,~~MAAM~~,EAAE,EAAC,MAAM,EAAE,QAAQ,EAAC;~~IAC1B~~,~~eAAe~~,EAAE,EAAC,MAAM,EAAE,~~iBAAiB~~,EAAC;~~GAC7C~~;CACM,CAAC;AAEV,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAAC,~~MAAM~~,EAAE,~~eAAe~~,EAAE,UAAU,EAAC,EAAE,EAAE,~~CAC1E~~,IAAI,CAAA,4CAA4C,UAAU,YAAY,~~MAAM~~,~~qBAAqB~~,~~eAAe~~,KAAK,CAAC","sourcesContent":["import {html} from 'lit-html';\nimport {Meta} from '@storybook/web-components';\n\nexport default {\n title: 'Elements/Template Properties',\n component: 'verdocs-template-properties',\n args: {\n templateId: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n },\n argTypes: {\n ~~cancel~~: {action: 'cancel'},\n ~~settingsUpdated~~: {action: '~~settingsUpdated~~'},\n },\n} as Meta;\n\nexport const TemplateProperties = ({~~cancel~~, ~~settingsUpdated~~, templateId}) ~~=>\n~~ html`<verdocs-template-properties .templateId=${templateId} @cancel=${~~cancel~~} @~~settingsUpdated~~=${~~settingsUpdated~~} />`;\n"]}
1	+ {"version":3,"file":"verdocs-template-properties.stories.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-properties/verdocs-template-properties.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,UAAU,CAAC;AAG9B,eAAe;EACb,KAAK,EAAE,8BAA8B;EACrC,SAAS,EAAE,6BAA6B;EACxC,IAAI,EAAE;IACJ,UAAU,EAAE,sCAAsC;GACnD;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE,EAAC,MAAM,EAAE,QAAQ,EAAC;IAC5B,MAAM,EAAE,EAAC,MAAM,EAAE,MAAM,EAAC;GACzB;CACM,CAAC;AAEV,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAC,EAAE,EAAE,CAAC,IAAI,CAAA,4CAA4C,UAAU,YAAY,QAAQ,UAAU,MAAM,KAAK,CAAC","sourcesContent":["import {html} from 'lit-html';\nimport {Meta} from '@storybook/web-components';\n\nexport default {\n title: 'Elements/Template Properties',\n component: 'verdocs-template-properties',\n args: {\n templateId: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n },\n argTypes: {\n onCancel: {action: 'cancel'},\n onNext: {action: 'next'},\n },\n} as Meta;\n\nexport const TemplateProperties = ({onCancel, onNext, templateId}) => html`<verdocs-template-properties .templateId=${templateId} @cancel=${onCancel} @next=${onNext} />`;\n"]}

package/dist/collection/components/elements/verdocs-template-recipients/verdocs-template-recipients.js CHANGED Viewed

@@ -191,17 +191,16 @@ export class VerdocsTemplateRecipients {
     (_a = this.cancel) === null || _a === void 0 ? void 0 : _a.emit();
   }
   handleSubmit(e) {
-    var _a, _b;
+    var _a;
     e.stopPropagation();
     this.showSuggestions = false;
-    (_a = this.contactSelected) === null || _a === void 0 ? void 0 : _a.emit({
+    (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit({
       full_name: this.name,
       email: this.email,
       phone: this.phone,
       message: this.message,
       delegator: this.delegator,
     });
-    (_b = this.settingsUpdated) === null || _b === void 0 ? void 0 : _b.emit({});
   }
   render() {
     console.log('ordered roles', JSON.parse(JSON.stringify(this.orderedRoles)));
@@ -210,9 +209,9 @@ export class VerdocsTemplateRecipients {
     return (h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Participant Order"), h("div", { class: "participants" }, h("div", { class: "left-line" }), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: startIcon }), h("div", { class: "sender" }, h("span", { class: "label" }, "Sender:"), " ", senderLabels[this.sender], ' ', h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" }))), this.sequences.map(sequence => (h("div", { class: "row" }, h("div", { class: "icon", innerHTML: stepIcon }), h("div", { class: "dropzone", "data-order": beforeOrder, "data-sequence": sequence }), this.rolesAtSequence[sequence].map(role => {
       beforeOrder = role.order;
       return (h(Fragment, null, h("div", { class: "recipient", style: { backgroundColor: getRGBA(getRoleIndex(roleNames, role.name)) }, "data-rolename": role.name }, role.name, " ", h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })), h("div", { class: "dropzone", "data-order": beforeOrder, "data-sequence": sequence })));
-    })))), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: doneIcon }), h("div", { class: "complete" }, "Document Complete"))), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onPress: e => this.handleCancel(e) }), h("verdocs-button", { label: "OK", size: "small", onPress: e => this.handleSubmit(e) })), this.showingSenderDialog && (h("verdocs-template-sender-dialog", { open: true, value: this.sender, onCancel: () => (this.showingSenderDialog = false), onDone: e => {
+    })))), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: doneIcon }), h("div", { class: "complete" }, "Document Complete"))), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { label: "OK", size: "small", onClick: e => this.handleSubmit(e) })), this.showingSenderDialog && (h("verdocs-template-sender-dialog", { value: this.sender, onCancel: () => (this.showingSenderDialog = false), onNext: e => {
         this.showingSenderDialog = false;
-        this.sender = e.detail.sender;
+        this.sender = e.detail;
       } }))));
   }
   static get is() { return "verdocs-template-recipients"; }
@@ -345,29 +344,14 @@ export class VerdocsTemplateRecipients {
           "references": {}
         }
       }, {
-        "method": "settingsUpdated",
-        "name": "settingsUpdated",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user completes the step."
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "contactSelected",
-        "name": "contactSelected",
+        "method": "next",
+        "name": "next",
         "bubbles": true,
         "cancelable": true,
         "composed": true,
         "docs": {
           "tags": [],
-          "text": "Event fired when the user changes the type."
+          "text": "Event fired when the user selects a contact."
         },
         "complexType": {
           "original": "IContactSelectEvent",

package/dist/collection/components/elements/verdocs-template-recipients/verdocs-template-recipients.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-template-recipients.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-recipients/verdocs-template-recipients.tsx"],"names":[],"mappings":"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","sourcesContent":["import interact from 'interactjs';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\nimport {IRole, TemplateSenderTypes} from '@verdocs/js-sdk/Templates/Types';\nimport {Component, h, Event, EventEmitter, Fragment, Prop, State} from '@stencil/core';\nimport {getRoleIndex} from '../../../utils/utils';\n\nconst arrayMove = (arr: any[], fromIndex: number, toIndex: number) => {\n const newArr = [...arr];\n newArr.splice(toIndex, 0, newArr.splice(fromIndex, 1)[0]);\n return newArr;\n};\n\ntype TAnnotatedRole = IRole & {order: number};\n\nconst senderLabels: Record<TemplateSenderTypes, string> = {\n [TemplateSenderTypes.EVERYONE]: 'Everyone',\n [TemplateSenderTypes.EVERYONE_AS_CREATOR]: 'Everyone as Me',\n [TemplateSenderTypes.ORGANIZATION_MEMBER]: 'Organization member',\n [TemplateSenderTypes.ORGANIZATION_MEMBER_AS_CREATOR]: 'Organization Member as Me',\n [TemplateSenderTypes.CREATOR]: 'Me',\n};\n\nconst settingsIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\"><path d=\"m8.021 17.917-.313-2.5q-.27-.125-.625-.334-.354-.208-.625-.395l-2.312.979-1.979-3.438 1.979-1.5q-.021-.167-.031-.364-.011-.198-.011-.365 0-.146.011-.344.01-.198.031-.385l-1.979-1.5 1.979-3.417 2.312.958q.271-.187.615-.385t.635-.344l.313-2.5h3.958l.313 2.5q.312.167.625.344.312.177.604.385l2.333-.958 1.979 3.417-1.979 1.521q.021.187.021.364V10q0 .146-.01.333-.011.188-.011.396l1.958 1.5-1.979 3.438-2.312-.979q-.292.208-.615.395-.323.188-.614.334l-.313 2.5Zm1.937-5.355q1.063 0 1.813-.75t.75-1.812q0-1.062-.75-1.812t-1.813-.75q-1.041 0-1.802.75-.76.75-.76 1.812t.76 1.812q.761.75 1.802.75Zm0-1.333q-.5 0-.864-.364-.365-.365-.365-.865t.365-.865q.364-.364.864-.364t.865.364q.365.365.365.865t-.365.865q-.365.364-.865.364ZM10.021 10Zm-.854 6.583h1.666l.25-2.187q.605-.167 1.136-.49.531-.323 1.031-.802l2.021.875.854-1.375-1.792-1.354q.105-.333.136-.635.031-.303.031-.615 0-.292-.031-.573-.031-.281-.115-.635l1.792-1.396-.834-1.375-2.062.875q-.438-.438-1.021-.781-.583-.344-1.125-.49l-.271-2.208H9.167l-.271 2.208q-.584.146-1.125.458-.542.313-1.042.792l-2.021-.854-.833 1.375 1.75 1.354q-.083.333-.125.646-.042.312-.042.604t.042.594q.042.302.125.635l-1.75 1.375.833 1.375 2.021-.854q.479.458 1.021.771.542.312 1.146.479Z\"/></svg>';\n\nconst startIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"M2 12C2 6.48 6.48 2 12 2s10 4.48 10 10-4.48 10-10 10S2 17.52 2 12zm10 6c3.31 0 6-2.69 6-6s-2.69-6-6-6-6 2.69-6 6 2.69 6 6 6z\"></path></svg>';\n\nconst stepIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z\"></path></svg>';\n\nconst doneIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"m18 7-1.41-1.41-6.34 6.34 1.41 1.41L18 7zm4.24-1.41L11.66 16.17 7.48 12l-1.41 1.41L11.66 19l12-12-1.42-1.41zM.41 13.41 6 19l1.41-1.41L1.83 12 .41 13.41z\"></path></svg>';\n\nexport interface IContactSearchEvent {\n // The text the user has entered in the search field\n query: string;\n}\n\nexport interface IContactSelectEvent {\n full_name: string;\n email: string;\n phone: string;\n message: string;\n delegator: boolean;\n}\n\nexport interface IEmailContact {\n // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n id?: any;\n\n // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n // `verdocs-contact-picker .avatar { display: none; }`\n avatar?: string;\n\n // The recipient's name, as it should be displayed to the user.\n name: string;\n\n // The email address for the contact.\n email: string;\n\n // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n // notifications will be sent to both locations.\n phone?: string;\n\n [key: string]: any;\n}\n\nexport interface IPhoneContact {\n // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n id?: any;\n\n // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n // `verdocs-contact-picker .avatar { display: none; }`\n avatar?: string;\n\n // The recipient's name, as it should be displayed to the user.\n name: string;\n\n // The email address for the contact.\n email?: string;\n\n // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n // notifications will be sent to both locations.\n phone: string;\n\n [key: string]: any;\n}\n\n/*\n Displays a contact picker suitable for filling out Recipient objects when sending Documents.\n \n This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the\n * user interacts with the component, the text entered in the name field is sent back to the parent via the `searchContacts` event.\n * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be\n * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as \"Recently Used\" contacts, or\n * to always display the user's own contact record.\n /\n@Component({\n tag: 'verdocs-template-recipients',\n styleUrl: 'verdocs-template-recipients.scss',\n shadow: false,\n})\nexport class VerdocsTemplateRecipients {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The role that this contact will be assigned to.\n /\n @Prop() templateRole: IRole \| null = null;\n\n /\n If set, suggestions will be displayed in a drop-down list to the user. It is recommended that the number\n * of suggestions be limited to the 5 best matching records.\n /\n @Prop() contactSuggestions: (IEmailContact \| IPhoneContact)[] = [];\n\n /\n Event fired when the user enters text in the search field. The calling application may use this to update\n * the `contactSuggestions` property.\n /\n @Event({composed: true}) searchContacts: EventEmitter<IContactSearchEvent>;\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired when the user completes the step.\n /\n @Event({composed: true}) settingsUpdated: EventEmitter;\n\n /\n Event fired when the user changes the type.\n /\n @Event({composed: true}) contactSelected: EventEmitter<IContactSelectEvent>;\n\n @State() name: string;\n @State() email: string;\n @State() phone: string;\n @State() message: string;\n @State() showSuggestions: boolean = false;\n @State() showMessage: boolean = false;\n @State() delegator: boolean = false;\n @State() sender: TemplateSenderTypes = TemplateSenderTypes.CREATOR;\n @State() showingSenderDialog = false;\n @State() orderedRoles: TAnnotatedRole[] = [];\n\n sequences: number[] = [];\n rolesAtSequence: Record<number, TAnnotatedRole[]> = {};\n\n componentWillLoad() {\n if (this.templateRole) {\n this.name = this.templateRole.full_name \|\| '';\n this.email = this.templateRole.email \|\| '';\n this.phone = this.templateRole.phone \|\| '';\n this.delegator = this.templateRole.delegator \|\| false;\n this.message = this.templateRole.message \|\| '';\n this.showMessage = this.message !== '';\n }\n\n this.orderedRoles = [\n {\n order: 0,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Seller 1',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 1,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 1,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Seller 2',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 1,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 2,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Buyer 1',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 2,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 3,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Buyer 2',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 2,\n fields: [],\n delegator: false,\n phone: '',\n },\n ];\n\n this.computeRolesBySequence();\n }\n\n componentDidRender() {\n interact.dynamicDrop(true);\n interact('.recipient').draggable({\n listeners: {\n start(event) {\n console.log('drag start', event.type, event.target);\n },\n move(event) {\n const oldX = +(event.target.getAttribute('posX') \|\| 0);\n const oldY = +(event.target.getAttribute('posY') \|\| 0);\n const newX = event.dx + oldX;\n const newY = event.dy + oldY;\n event.target.setAttribute('posX', newX);\n event.target.setAttribute('posy', newY);\n event.target.style.transform = `translate(${newX}px, ${newY}px)`;\n },\n end(event) {\n console.log('end', event);\n event.target.setAttribute('posX', 0);\n event.target.setAttribute('posy', 0);\n event.target.style.transform = `translate(0px, 0px)`;\n },\n },\n });\n\n interact('.dropzone').dropzone({\n overlap: 0.05,\n ondrop: event => {\n event.target.classList.remove('active');\n\n console.log(event.relatedTarget.id + ' was dropped into ' + event.target.id);\n\n const roleName = event.relatedTarget.dataset.rolename;\n const targetOrder = +event.target.dataset.order;\n const targetSequence = +event.target.dataset.sequence;\n // const roleIndex = this.orderedRoles.findIndex(role => role.name === roleToMove);\n\n const roleIndex = this.orderedRoles.findIndex(role => role.name === roleName);\n if (roleIndex !== -1) {\n console.log('Will move', {roleName, targetOrder, targetSequence, roleIndex});\n const role = this.orderedRoles[roleIndex];\n role.sequence = targetSequence;\n\n console.log('before', JSON.parse(JSON.stringify(this.orderedRoles)));\n this.orderedRoles = arrayMove(this.orderedRoles, roleIndex, targetOrder);\n this.orderedRoles.forEach((role, index) => {\n role.order = index;\n });\n console.log('after', JSON.parse(JSON.stringify(this.orderedRoles)));\n this.computeRolesBySequence();\n }\n },\n ondropactivate: e => {\n // console.log('drop activated');\n e.target.classList.add('visible');\n },\n ondropdeactivate: e => {\n e.target.classList.remove('visible');\n },\n ondragenter: e => {\n // console.log('drag enter', e);\n e.target.classList.add('active');\n },\n ondragleave: e => {\n // console.log('drag leave', e);\n e.target.classList.remove('active');\n },\n });\n }\n\n computeRolesBySequence() {\n const rolesAtSequence: Record<number, TAnnotatedRole[]> = {};\n\n this.orderedRoles.forEach(role => {\n rolesAtSequence[role.sequence] \|\|= [];\n rolesAtSequence[role.sequence].push(role);\n });\n\n this.rolesAtSequence = rolesAtSequence;\n\n console.log('ras', this.rolesAtSequence);\n this.sequences = Object.keys(rolesAtSequence).map(levelStr => +levelStr);\n this.sequences.sort((a, b) => a - b);\n }\n\n handleCancel(e) {\n e.stopPropagation();\n this.showSuggestions = false;\n this.cancel?.emit();\n }\n\n handleSubmit(e) {\n e.stopPropagation();\n\n this.showSuggestions = false;\n this.contactSelected?.emit({\n full_name: this.name,\n email: this.email,\n phone: this.phone,\n message: this.message,\n delegator: this.delegator,\n });\n\n this.settingsUpdated?.emit({});\n }\n\n render() {\n console.log('ordered roles', JSON.parse(JSON.stringify(this.orderedRoles)));\n const roleNames = this.orderedRoles.map(role => role.name) \|\| [];\n let beforeOrder = 0;\n\n return (\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Participant Order</h5>\n\n <div class=\"participants\">\n <div class=\"left-line\" />\n <div class=\"row\">\n <div class=\"icon\" innerHTML={startIcon} />\n <div class=\"sender\">\n <span class=\"label\">Sender:</span> {senderLabels[this.sender]}{' '}\n <div class=\"settings-button\" innerHTML={settingsIcon} onClick={() => (this.showingSenderDialog = true)} aria-role=\"button\" />\n </div>\n </div>\n\n {this.sequences.map(sequence => (\n <div class=\"row\">\n <div class=\"icon\" innerHTML={stepIcon} />\n <div class=\"dropzone\" data-order={beforeOrder} data-sequence={sequence} />\n {this.rolesAtSequence[sequence].map(role => {\n beforeOrder = role.order;\n return (\n <Fragment>\n <div class=\"recipient\" style={{backgroundColor: getRGBA(getRoleIndex(roleNames, role.name))}} data-rolename={role.name}>\n {role.name} <div class=\"settings-button\" innerHTML={settingsIcon} onClick={() => (this.showingSenderDialog = true)} aria-role=\"button\" />\n </div>\n <div class=\"dropzone\" data-order={beforeOrder} data-sequence={sequence} />\n </Fragment>\n );\n })}\n </div>\n ))}\n\n <div class=\"row\">\n <div class=\"icon\" innerHTML={doneIcon} />\n <div class=\"complete\">Document Complete</div>\n </div>\n </div>\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onPress={e => this.handleCancel(e)} />\n <verdocs-button label=\"OK\" size=\"small\" onPress={e => this.handleSubmit(e)} />\n </div>\n\n {/ We do it this way instead of setting open so the widget resets each time it's displayed, in case the user opens/changes/cancels */}\n {this.showingSenderDialog && (\n <verdocs-template-sender-dialog\n open={true}\n value={this.sender}\n onCancel={() => (this.showingSenderDialog = false)}\n onDone={e => {\n this.showingSenderDialog = false;\n this.sender = e.detail.sender;\n }}\n />\n )}\n </form>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-template-recipients.js","sourceRoot":"","sources":["../../../../src/components/elements/verdocs-template-recipients/verdocs-template-recipients.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAC,OAAO,EAAC,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAQ,mBAAmB,EAAC,MAAM,iCAAiC,CAAC;AAC3E,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AACvF,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAC;AAElD,MAAM,SAAS,GAAG,CAAC,GAAU,EAAE,SAAiB,EAAE,OAAe,EAAE,EAAE;EACnE,MAAM,MAAM,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC;EACxB,MAAM,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;EAC1D,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAIF,MAAM,YAAY,GAAwC;EACxD,CAAC,mBAAmB,CAAC,QAAQ,CAAC,EAAE,UAAU;EAC1C,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,EAAE,gBAAgB;EAC3D,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,EAAE,qBAAqB;EAChE,CAAC,mBAAmB,CAAC,8BAA8B,CAAC,EAAE,2BAA2B;EACjF,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,IAAI;CACpC,CAAC;AAEF,MAAM,YAAY,GAChB,kxCAAkxC,CAAC;AAErxC,MAAM,SAAS,GACb,kOAAkO,CAAC;AAErO,MAAM,QAAQ,GACZ,gQAAgQ,CAAC;AAEnQ,MAAM,QAAQ,GACZ,8PAA8P,CAAC;AAyDjQ;;;;;;;;GAQG;AAMH,MAAM,OAAO,yBAAyB;;IA4CpC,cAAS,GAAa,EAAE,CAAC;IACzB,oBAAe,GAAqC,EAAE,CAAC;oBAzCnB,eAAe,CAAC,UAAU,EAAE;wBAK3B,IAAI;8BAMuB,EAAE;;;;;2BAsB9B,KAAK;uBACT,KAAK;qBACP,KAAK;kBACI,mBAAmB,CAAC,OAAO;+BACnC,KAAK;wBACM,EAAE;;EAK5C,iBAAiB;IACf,IAAI,IAAI,CAAC,YAAY,EAAE;MACrB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,IAAI,EAAE,CAAC;MAC9C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC;MAC3C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC;MAC3C,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,IAAI,KAAK,CAAC;MACtD,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,CAAC;MAC/C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,OAAO,KAAK,EAAE,CAAC;KACxC;IAED,IAAI,CAAC,YAAY,GAAG;MAClB;QACE,KAAK,EAAE,CAAC;QACR,WAAW,EAAE,sCAAsC;QACnD,IAAI,EAAE,UAAU;QAChB,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,CAAC;QACX,MAAM,EAAE,EAAE;QACV,SAAS,EAAE,KAAK;QAChB,KAAK,EAAE,EAAE;OACV;MACD;QACE,KAAK,EAAE,CAAC;QACR,WAAW,EAAE,sCAAsC;QACnD,IAAI,EAAE,UAAU;QAChB,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,CAAC;QACX,MAAM,EAAE,EAAE;QACV,SAAS,EAAE,KAAK;QAChB,KAAK,EAAE,EAAE;OACV;MACD;QACE,KAAK,EAAE,CAAC;QACR,WAAW,EAAE,sCAAsC;QACnD,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,CAAC;QACX,MAAM,EAAE,EAAE;QACV,SAAS,EAAE,KAAK;QAChB,KAAK,EAAE,EAAE;OACV;MACD;QACE,KAAK,EAAE,CAAC;QACR,WAAW,EAAE,sCAAsC;QACnD,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,CAAC;QACX,MAAM,EAAE,EAAE;QACV,SAAS,EAAE,KAAK;QAChB,KAAK,EAAE,EAAE;OACV;KACF,CAAC;IAEF,IAAI,CAAC,sBAAsB,EAAE,CAAC;EAChC,CAAC;EAED,kBAAkB;IAChB,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IAC3B,QAAQ,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC;MAC/B,SAAS,EAAE;QACT,KAAK,CAAC,KAAK;UACT,OAAO,CAAC,GAAG,CAAC,YAAY,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACtD,CAAC;QACD,IAAI,CAAC,KAAK;UACR,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;UACvD,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;UACvD,MAAM,IAAI,GAAG,KAAK,CAAC,EAAE,GAAG,IAAI,CAAC;UAC7B,MAAM,IAAI,GAAG,KAAK,CAAC,EAAE,GAAG,IAAI,CAAC;UAC7B,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;UACxC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;UACxC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,aAAa,IAAI,OAAO,IAAI,KAAK,CAAC;QACnE,CAAC;QACD,GAAG,CAAC,KAAK;UACP,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;UAC1B,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;UACrC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;UACrC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,qBAAqB,CAAC;QACvD,CAAC;OACF;KACF,CAAC,CAAC;IAEH,QAAQ,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC;MAC7B,OAAO,EAAE,IAAI;MACb,MAAM,EAAE,KAAK,CAAC,EAAE;QACd,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QAExC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,aAAa,CAAC,EAAE,GAAG,oBAAoB,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAE7E,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,QAAQ,CAAC;QACtD,MAAM,WAAW,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAChD,MAAM,cAAc,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC;QACtD,mFAAmF;QAEnF,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC;QAC9E,IAAI,SAAS,KAAK,CAAC,CAAC,EAAE;UACpB,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,EAAC,QAAQ,EAAE,WAAW,EAAE,cAAc,EAAE,SAAS,EAAC,CAAC,CAAC;UAC7E,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;UAC1C,IAAI,CAAC,QAAQ,GAAG,cAAc,CAAC;UAE/B,OAAO,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;UACrE,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC;UACzE,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;UACrB,CAAC,CAAC,CAAC;UACH,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;UACpE,IAAI,CAAC,sBAAsB,EAAE,CAAC;SAC/B;MACH,CAAC;MACD,cAAc,EAAE,CAAC,CAAC,EAAE;QAClB,iCAAiC;QACjC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;MACpC,CAAC;MACD,gBAAgB,EAAE,CAAC,CAAC,EAAE;QACpB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;MACvC,CAAC;MACD,WAAW,EAAE,CAAC,CAAC,EAAE;QACf,gCAAgC;QAChC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;MACnC,CAAC;MACD,WAAW,EAAE,CAAC,CAAC,EAAE;QACf,gCAAgC;QAChC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;MACtC,CAAC;KACF,CAAC,CAAC;EACL,CAAC;EAED,sBAAsB;IACpB,MAAM,eAAe,GAAqC,EAAE,CAAC;IAE7D,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;;MAC/B,eAAe,MAAC,IAAI,CAAC,QAAQ,MAA7B,eAAe,OAAoB,EAAE,EAAC;MACtC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5C,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,eAAe,GAAG,eAAe,CAAC;IAEvC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IACzC,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC;IACzE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;EACvC,CAAC;EAED,YAAY,CAAC,CAAC;;IACZ,CAAC,CAAC,eAAe,EAAE,CAAC;IACpB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC7B,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,EAAE,CAAC;EACtB,CAAC;EAED,YAAY,CAAC,CAAC;;IACZ,CAAC,CAAC,eAAe,EAAE,CAAC;IAEpB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC7B,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAC;MACd,SAAS,EAAE,IAAI,CAAC,IAAI;MACpB,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,OAAO,EAAE,IAAI,CAAC,OAAO;MACrB,SAAS,EAAE,IAAI,CAAC,SAAS;KAC1B,CAAC,CAAC;EACL,CAAC;EAED,MAAM;IACJ,OAAO,CAAC,GAAG,CAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;IAC5E,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;IACjE,IAAI,WAAW,GAAG,CAAC,CAAC;IAEpB,OAAO,CACL,YAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,YAAY,EAAC,KAAK;MAC5F,kCAA0B;MAE1B,WAAK,KAAK,EAAC,cAAc;QACvB,WAAK,KAAK,EAAC,WAAW,GAAG;QACzB,WAAK,KAAK,EAAC,KAAK;UACd,WAAK,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,GAAI;UAC1C,WAAK,KAAK,EAAC,QAAQ;YACjB,YAAM,KAAK,EAAC,OAAO,cAAe;;YAAE,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC;YAAE,GAAG;YAClE,WAAK,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,eAAY,QAAQ,GAAG,CACzH,CACF;QAEL,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAC9B,WAAK,KAAK,EAAC,KAAK;UACd,WAAK,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,GAAI;UACzC,WAAK,KAAK,EAAC,UAAU,gBAAa,WAAW,mBAAiB,QAAQ,GAAI;UACzE,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACzC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC;YACzB,OAAO,CACL,EAAC,QAAQ;cACP,WAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,EAAC,eAAe,EAAE,OAAO,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,EAAC,mBAAiB,IAAI,CAAC,IAAI;gBACnH,IAAI,CAAC,IAAI;;gBAAE,WAAK,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,eAAY,QAAQ,GAAG,CACrI;cACN,WAAK,KAAK,EAAC,UAAU,gBAAa,WAAW,mBAAiB,QAAQ,GAAI,CACjE,CACZ,CAAC;UACJ,CAAC,CAAC,CACE,CACP,CAAC;QAEF,WAAK,KAAK,EAAC,KAAK;UACd,WAAK,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,GAAI;UACzC,WAAK,KAAK,EAAC,UAAU,wBAAwB,CACzC,CACF;MAEN,WAAK,KAAK,EAAC,SAAS;QAClB,WAAK,KAAK,EAAC,WAAW,GAAG;QAEzB,sBAAgB,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GAAI;QACpG,sBAAgB,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GAAI,CAC1E;MAGL,IAAI,CAAC,mBAAmB,IAAI,CAC3B,sCACE,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,EAClD,MAAM,EAAE,CAAC,CAAC,EAAE;UACV,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;UACjC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC;QACzB,CAAC,GACD,CACH,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import interact from 'interactjs';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\nimport {IRole, TemplateSenderTypes} from '@verdocs/js-sdk/Templates/Types';\nimport {Component, h, Event, EventEmitter, Fragment, Prop, State} from '@stencil/core';\nimport {getRoleIndex} from '../../../utils/utils';\n\nconst arrayMove = (arr: any[], fromIndex: number, toIndex: number) => {\n const newArr = [...arr];\n newArr.splice(toIndex, 0, newArr.splice(fromIndex, 1)[0]);\n return newArr;\n};\n\ntype TAnnotatedRole = IRole & {order: number};\n\nconst senderLabels: Record<TemplateSenderTypes, string> = {\n [TemplateSenderTypes.EVERYONE]: 'Everyone',\n [TemplateSenderTypes.EVERYONE_AS_CREATOR]: 'Everyone as Me',\n [TemplateSenderTypes.ORGANIZATION_MEMBER]: 'Organization member',\n [TemplateSenderTypes.ORGANIZATION_MEMBER_AS_CREATOR]: 'Organization Member as Me',\n [TemplateSenderTypes.CREATOR]: 'Me',\n};\n\nconst settingsIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\"><path d=\"m8.021 17.917-.313-2.5q-.27-.125-.625-.334-.354-.208-.625-.395l-2.312.979-1.979-3.438 1.979-1.5q-.021-.167-.031-.364-.011-.198-.011-.365 0-.146.011-.344.01-.198.031-.385l-1.979-1.5 1.979-3.417 2.312.958q.271-.187.615-.385t.635-.344l.313-2.5h3.958l.313 2.5q.312.167.625.344.312.177.604.385l2.333-.958 1.979 3.417-1.979 1.521q.021.187.021.364V10q0 .146-.01.333-.011.188-.011.396l1.958 1.5-1.979 3.438-2.312-.979q-.292.208-.615.395-.323.188-.614.334l-.313 2.5Zm1.937-5.355q1.063 0 1.813-.75t.75-1.812q0-1.062-.75-1.812t-1.813-.75q-1.041 0-1.802.75-.76.75-.76 1.812t.76 1.812q.761.75 1.802.75Zm0-1.333q-.5 0-.864-.364-.365-.365-.365-.865t.365-.865q.364-.364.864-.364t.865.364q.365.365.365.865t-.365.865q-.365.364-.865.364ZM10.021 10Zm-.854 6.583h1.666l.25-2.187q.605-.167 1.136-.49.531-.323 1.031-.802l2.021.875.854-1.375-1.792-1.354q.105-.333.136-.635.031-.303.031-.615 0-.292-.031-.573-.031-.281-.115-.635l1.792-1.396-.834-1.375-2.062.875q-.438-.438-1.021-.781-.583-.344-1.125-.49l-.271-2.208H9.167l-.271 2.208q-.584.146-1.125.458-.542.313-1.042.792l-2.021-.854-.833 1.375 1.75 1.354q-.083.333-.125.646-.042.312-.042.604t.042.594q.042.302.125.635l-1.75 1.375.833 1.375 2.021-.854q.479.458 1.021.771.542.312 1.146.479Z\"/></svg>';\n\nconst startIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"M2 12C2 6.48 6.48 2 12 2s10 4.48 10 10-4.48 10-10 10S2 17.52 2 12zm10 6c3.31 0 6-2.69 6-6s-2.69-6-6-6-6 2.69-6 6 2.69 6 6 6z\"></path></svg>';\n\nconst stepIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z\"></path></svg>';\n\nconst doneIcon =\n '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" tabindex=\"-1\"><path d=\"m18 7-1.41-1.41-6.34 6.34 1.41 1.41L18 7zm4.24-1.41L11.66 16.17 7.48 12l-1.41 1.41L11.66 19l12-12-1.42-1.41zM.41 13.41 6 19l1.41-1.41L1.83 12 .41 13.41z\"></path></svg>';\n\nexport interface IContactSearchEvent {\n // The text the user has entered in the search field\n query: string;\n}\n\nexport interface IContactSelectEvent {\n full_name: string;\n email: string;\n phone: string;\n message: string;\n delegator: boolean;\n}\n\nexport interface IEmailContact {\n // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n id?: any;\n\n // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n // `verdocs-contact-picker .avatar { display: none; }`\n avatar?: string;\n\n // The recipient's name, as it should be displayed to the user.\n name: string;\n\n // The email address for the contact.\n email: string;\n\n // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n // notifications will be sent to both locations.\n phone?: string;\n\n [key: string]: any;\n}\n\nexport interface IPhoneContact {\n // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n id?: any;\n\n // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n // `verdocs-contact-picker .avatar { display: none; }`\n avatar?: string;\n\n // The recipient's name, as it should be displayed to the user.\n name: string;\n\n // The email address for the contact.\n email?: string;\n\n // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n // notifications will be sent to both locations.\n phone: string;\n\n [key: string]: any;\n}\n\n/*\n Displays a contact picker suitable for filling out Recipient objects when sending Documents.\n \n This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the\n * user interacts with the component, the text entered in the name field is sent back to the parent via the `searchContacts` event.\n * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be\n * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as \"Recently Used\" contacts, or\n * to always display the user's own contact record.\n /\n@Component({\n tag: 'verdocs-template-recipients',\n styleUrl: 'verdocs-template-recipients.scss',\n shadow: false,\n})\nexport class VerdocsTemplateRecipients {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The role that this contact will be assigned to.\n /\n @Prop() templateRole: IRole \| null = null;\n\n /\n If set, suggestions will be displayed in a drop-down list to the user. It is recommended that the number\n * of suggestions be limited to the 5 best matching records.\n /\n @Prop() contactSuggestions: (IEmailContact \| IPhoneContact)[] = [];\n\n /\n Event fired when the user enters text in the search field. The calling application may use this to update\n * the `contactSuggestions` property.\n /\n @Event({composed: true}) searchContacts: EventEmitter<IContactSearchEvent>;\n\n /\n Event fired when the user cancels the dialog.\n /\n @Event({composed: true}) cancel: EventEmitter;\n\n /\n Event fired when the user selects a contact.\n /\n @Event({composed: true}) next: EventEmitter<IContactSelectEvent>;\n\n @State() name: string;\n @State() email: string;\n @State() phone: string;\n @State() message: string;\n @State() showSuggestions: boolean = false;\n @State() showMessage: boolean = false;\n @State() delegator: boolean = false;\n @State() sender: TemplateSenderTypes = TemplateSenderTypes.CREATOR;\n @State() showingSenderDialog = false;\n @State() orderedRoles: TAnnotatedRole[] = [];\n\n sequences: number[] = [];\n rolesAtSequence: Record<number, TAnnotatedRole[]> = {};\n\n componentWillLoad() {\n if (this.templateRole) {\n this.name = this.templateRole.full_name \|\| '';\n this.email = this.templateRole.email \|\| '';\n this.phone = this.templateRole.phone \|\| '';\n this.delegator = this.templateRole.delegator \|\| false;\n this.message = this.templateRole.message \|\| '';\n this.showMessage = this.message !== '';\n }\n\n this.orderedRoles = [\n {\n order: 0,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Seller 1',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 1,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 1,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Seller 2',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 1,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 2,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Buyer 1',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 2,\n fields: [],\n delegator: false,\n phone: '',\n },\n {\n order: 3,\n template_id: '951016b0-c5ef-450d-b628-9a0c5b84b163',\n name: 'Buyer 2',\n full_name: '',\n email: '',\n type: 'signer',\n sequence: 2,\n fields: [],\n delegator: false,\n phone: '',\n },\n ];\n\n this.computeRolesBySequence();\n }\n\n componentDidRender() {\n interact.dynamicDrop(true);\n interact('.recipient').draggable({\n listeners: {\n start(event) {\n console.log('drag start', event.type, event.target);\n },\n move(event) {\n const oldX = +(event.target.getAttribute('posX') \|\| 0);\n const oldY = +(event.target.getAttribute('posY') \|\| 0);\n const newX = event.dx + oldX;\n const newY = event.dy + oldY;\n event.target.setAttribute('posX', newX);\n event.target.setAttribute('posy', newY);\n event.target.style.transform = `translate(${newX}px, ${newY}px)`;\n },\n end(event) {\n console.log('end', event);\n event.target.setAttribute('posX', 0);\n event.target.setAttribute('posy', 0);\n event.target.style.transform = `translate(0px, 0px)`;\n },\n },\n });\n\n interact('.dropzone').dropzone({\n overlap: 0.05,\n ondrop: event => {\n event.target.classList.remove('active');\n\n console.log(event.relatedTarget.id + ' was dropped into ' + event.target.id);\n\n const roleName = event.relatedTarget.dataset.rolename;\n const targetOrder = +event.target.dataset.order;\n const targetSequence = +event.target.dataset.sequence;\n // const roleIndex = this.orderedRoles.findIndex(role => role.name === roleToMove);\n\n const roleIndex = this.orderedRoles.findIndex(role => role.name === roleName);\n if (roleIndex !== -1) {\n console.log('Will move', {roleName, targetOrder, targetSequence, roleIndex});\n const role = this.orderedRoles[roleIndex];\n role.sequence = targetSequence;\n\n console.log('before', JSON.parse(JSON.stringify(this.orderedRoles)));\n this.orderedRoles = arrayMove(this.orderedRoles, roleIndex, targetOrder);\n this.orderedRoles.forEach((role, index) => {\n role.order = index;\n });\n console.log('after', JSON.parse(JSON.stringify(this.orderedRoles)));\n this.computeRolesBySequence();\n }\n },\n ondropactivate: e => {\n // console.log('drop activated');\n e.target.classList.add('visible');\n },\n ondropdeactivate: e => {\n e.target.classList.remove('visible');\n },\n ondragenter: e => {\n // console.log('drag enter', e);\n e.target.classList.add('active');\n },\n ondragleave: e => {\n // console.log('drag leave', e);\n e.target.classList.remove('active');\n },\n });\n }\n\n computeRolesBySequence() {\n const rolesAtSequence: Record<number, TAnnotatedRole[]> = {};\n\n this.orderedRoles.forEach(role => {\n rolesAtSequence[role.sequence] \|\|= [];\n rolesAtSequence[role.sequence].push(role);\n });\n\n this.rolesAtSequence = rolesAtSequence;\n\n console.log('ras', this.rolesAtSequence);\n this.sequences = Object.keys(rolesAtSequence).map(levelStr => +levelStr);\n this.sequences.sort((a, b) => a - b);\n }\n\n handleCancel(e) {\n e.stopPropagation();\n this.showSuggestions = false;\n this.cancel?.emit();\n }\n\n handleSubmit(e) {\n e.stopPropagation();\n\n this.showSuggestions = false;\n this.next?.emit({\n full_name: this.name,\n email: this.email,\n phone: this.phone,\n message: this.message,\n delegator: this.delegator,\n });\n }\n\n render() {\n console.log('ordered roles', JSON.parse(JSON.stringify(this.orderedRoles)));\n const roleNames = this.orderedRoles.map(role => role.name) \|\| [];\n let beforeOrder = 0;\n\n return (\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Participant Order</h5>\n\n <div class=\"participants\">\n <div class=\"left-line\" />\n <div class=\"row\">\n <div class=\"icon\" innerHTML={startIcon} />\n <div class=\"sender\">\n <span class=\"label\">Sender:</span> {senderLabels[this.sender]}{' '}\n <div class=\"settings-button\" innerHTML={settingsIcon} onClick={() => (this.showingSenderDialog = true)} aria-role=\"button\" />\n </div>\n </div>\n\n {this.sequences.map(sequence => (\n <div class=\"row\">\n <div class=\"icon\" innerHTML={stepIcon} />\n <div class=\"dropzone\" data-order={beforeOrder} data-sequence={sequence} />\n {this.rolesAtSequence[sequence].map(role => {\n beforeOrder = role.order;\n return (\n <Fragment>\n <div class=\"recipient\" style={{backgroundColor: getRGBA(getRoleIndex(roleNames, role.name))}} data-rolename={role.name}>\n {role.name} <div class=\"settings-button\" innerHTML={settingsIcon} onClick={() => (this.showingSenderDialog = true)} aria-role=\"button\" />\n </div>\n <div class=\"dropzone\" data-order={beforeOrder} data-sequence={sequence} />\n </Fragment>\n );\n })}\n </div>\n ))}\n\n <div class=\"row\">\n <div class=\"icon\" innerHTML={doneIcon} />\n <div class=\"complete\">Document Complete</div>\n </div>\n </div>\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={e => this.handleCancel(e)} />\n <verdocs-button label=\"OK\" size=\"small\" onClick={e => this.handleSubmit(e)} />\n </div>\n\n {/ We do it this way instead of setting open so the widget resets each time it's displayed, in case the user opens/changes/cancels */}\n {this.showingSenderDialog && (\n <verdocs-template-sender-dialog\n value={this.sender}\n onCancel={() => (this.showingSenderDialog = false)}\n onNext={e => {\n this.showingSenderDialog = false;\n this.sender = e.detail;\n }}\n />\n )}\n </form>\n );\n }\n}\n"]}

package/dist/collection/components/embeds/verdocs-auth/verdocs-auth.js CHANGED Viewed

@@ -96,14 +96,14 @@ export class VerdocsAuth {
     }
     if (this.isAuthenticated) {
       if (this.debug) {
-        return (h("div", { class: "status-result debug" }, h("verdocs-button", { label: "Logout", disabled: this.loggingIn, onPress: () => this.handleLogout() })));
+        return (h("div", { class: "status-result debug" }, h("verdocs-button", { label: "Logout", disabled: this.loggingIn, onClick: () => this.handleLogout() })));
       }
       return h("div", { class: "status-result" }, "Authenticated");
     }
     if (this.displayMode === 'signup') {
-      return (h("div", { class: "signup-form" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" }), h("h3", null, "Sign up for an account"), h("h4", null, "Already have an account?", h("verdocs-button", { label: "Log In", variant: "text", onClick: () => (this.displayMode = 'login'), disabled: this.loggingIn })), h("form", { onSubmit: () => this.handleLogin() }, h("verdocs-text-input", { label: "Email", autocomplete: "username", value: this.username, onInput: (e) => (this.username = e.target.value), disabled: this.loggingIn }), h("verdocs-text-input", { label: "Password", type: "password", autocomplete: "current-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.loggingIn }), h("verdocs-button", { label: "Signup", disabled: this.loggingIn, onPress: () => this.handleLogin(), style: { display: 'flex', justifyContent: 'center', margin: '30px auto 0' } }))));
+      return (h("div", { class: "signup-form" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" }), h("h3", null, "Sign up for an account"), h("h4", null, "Already have an account?", h("verdocs-button", { label: "Log In", variant: "text", onClick: () => (this.displayMode = 'login'), disabled: this.loggingIn })), h("form", { onSubmit: () => this.handleLogin() }, h("verdocs-text-input", { label: "Email", autocomplete: "username", value: this.username, onInput: (e) => (this.username = e.target.value), disabled: this.loggingIn }), h("verdocs-text-input", { label: "Password", type: "password", autocomplete: "current-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.loggingIn }), h("verdocs-button", { label: "Signup", disabled: this.loggingIn, onClick: () => this.handleLogin(), style: { display: 'flex', justifyContent: 'center', margin: '30px auto 0' } }))));
     }
-    return (h("div", { class: "login-form" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" }), h("h3", null, "Log in to your account"), h("h4", null, "Don't have an account?", h("verdocs-button", { label: "Sign Up", variant: "text", onClick: () => (this.displayMode = 'signup'), disabled: this.loggingIn })), h("form", { onSubmit: () => this.handleLogin() }, h("verdocs-text-input", { label: "Email", autocomplete: "username", value: this.username, onInput: (e) => (this.username = e.target.value), disabled: this.loggingIn }), h("verdocs-text-input", { label: "Password", type: "password", autocomplete: "current-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.loggingIn }), h("verdocs-button", { label: "Forgot Your Password?", variant: "text", onClick: () => (this.displayMode = 'signup'), disabled: this.loggingIn, style: { display: 'flex', justifyContent: 'center', margin: '10px auto 20px' } }), h("verdocs-button", { label: "Login", disabled: this.loggingIn, onPress: () => this.handleLogin(), style: { display: 'flex', justifyContent: 'center', margin: '10px auto 0' } })), this.loginError ? h("verdocs-ok-dialog", { open: true, heading: "Login Error", message: this.loginError, onClosed: () => this.handleClearError() }) : h("div", null)));
+    return (h("div", { class: "login-form" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" }), h("h3", null, "Log in to your account"), h("h4", null, "Don't have an account?", h("verdocs-button", { label: "Sign Up", variant: "text", onClick: () => (this.displayMode = 'signup'), disabled: this.loggingIn })), h("form", { onSubmit: () => this.handleLogin() }, h("verdocs-text-input", { label: "Email", autocomplete: "username", value: this.username, onInput: (e) => (this.username = e.target.value), disabled: this.loggingIn }), h("verdocs-text-input", { label: "Password", type: "password", autocomplete: "current-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.loggingIn }), h("verdocs-button", { label: "Forgot Your Password?", variant: "text", onClick: () => (this.displayMode = 'signup'), disabled: this.loggingIn, style: { display: 'flex', justifyContent: 'center', margin: '10px auto 20px' } }), h("verdocs-button", { label: "Login", disabled: this.loggingIn, onClick: () => this.handleLogin(), style: { display: 'flex', justifyContent: 'center', margin: '10px auto 0' } })), this.loginError ? h("verdocs-ok-dialog", { heading: "Login Error", message: this.loginError, onNext: () => this.handleClearError() }) : h("div", null)));
   }
   static get is() { return "verdocs-auth"; }
   static get originalStyleUrls() {

package/dist/collection/components/embeds/verdocs-auth/verdocs-auth.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-auth.js","sourceRoot":"","sources":["../../../../src/components/embeds/verdocs-auth/verdocs-auth.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Auth} from '@verdocs/js-sdk/Users';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {TSession} from '@verdocs/js-sdk/Sessions/Types';\nimport {Component, Prop, State, h, Event, EventEmitter} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\n\nexport interface IAuthStatus {\n authenticated: boolean;\n session: TSession;\n}\n\n/*\n Display an authentication dialog that allows the user to login or sign up. Callbacks are provided for events that\n * occur during the process (especially successful completion). The success callback will be fired immediately if the\n * user is already authenticated with a valid session, so this component may not always display visibly.\n \n To simplify some types of authentication flows, a visibility flag can force this component to never display. This\n * allows you to susbcribe to notifications from the\n \n This embed is responsive / mobile-friendly, but the calling application should provide at least a 300px wide\n * container to allow sufficient space for the required forms.\n \n As noted below, the primary event is `authenticated`. This will always be fired at least once, immediately after\n * the widget is rendered and the user's status has been checked. It may be fired again as the user completes (or\n * cancels) authentication steps.\n \n Authentication is required to demonstrate this Element. You may do this in Storybook by using the Auth\n * embed. This Element will reuse the same session produced by logging in via that Embed.\n \n ```typescript\n * interface IAuthStatus {\n * // If true, the user is authenticated with a valid session\n * authenticated: boolean;\n \n // Details for the user's session\n * session: IActiveSession \| null;\n * }\n * ```\n /\n@Component({\n tag: 'verdocs-auth',\n styleUrl: 'verdocs-auth.scss',\n shadow: false,\n})\nexport class VerdocsAuth {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n Normally, if the user has a valid session, this embed will be invisible, otherwise it will display\n * login / signup forms. If this is set to false, this embed will be invisible in both cases. Apps may\n * use this to verify if a user has a valid session without needing a separate call to Verdocs JS SDK.\n /\n @Prop() visible: boolean = true;\n\n /\n By default, a Verdocs logo will be displayed above the login/signup forms. This may be used to\n * override its source. (Alternatively, you may simply hide it via CSS overrides.) Logos should be\n * in SVG format for best results.\n /\n @Prop() logo: string = 'https://verdocs.com/assets/blue-logo.svg';\n\n /\n If the user is authenticated, this embed will normally render invisibly. If debug is set true, a summary\n * if the user's session details will be displayed instead. This may be useful while debugging authentication\n * flows in new applications.\n /\n @Prop() debug: boolean = false;\n\n /\n Event fired when session authentication process has completed. Check the event contents for completion status.\n /\n @Event({composed: true}) authenticated: EventEmitter<IAuthStatus>;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n @State() isAuthenticated: boolean = false;\n @State() displayMode: string = 'login';\n @State() username: string = '';\n @State() password: string = '';\n @State() loggingIn: boolean = false;\n @State() activeSession: TSession = null;\n @State() loginError: string \| null = null;\n\n componentWillLoad() {\n this.endpoint.loadSession();\n if (this.endpoint.session) {\n console.log('[AUTH] Authenticated');\n this.isAuthenticated = true;\n this.activeSession = this.endpoint.session;\n this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n } else {\n console.log('[AUTH] Anonymous');\n this.authenticated?.emit({authenticated: false, session: null});\n }\n }\n\n handleLogin() {\n this.loggingIn = true;\n Auth.authenticateUser(this.endpoint, {username: this.username, password: this.password})\n .then(r => {\n this.loggingIn = false;\n this.endpoint.setToken(r.accessToken);\n this.activeSession = this.endpoint.session;\n this.isAuthenticated = true;\n this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n })\n .catch(e => {\n console.log('[AUTH] Authentication error', e.response, JSON.stringify(e));\n this.loggingIn = false;\n this.activeSession = null;\n this.authenticated?.emit({authenticated: false, session: null});\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n\n if (e?.response?.status === 403) {\n this.loginError = 'Please check your username and password and try again.';\n }\n });\n }\n\n handleLogout() {\n this.endpoint.clearSession();\n this.isAuthenticated = false;\n this.authenticated?.emit({authenticated: false, session: null});\n }\n\n handleClearError() {\n this.loginError = null;\n }\n\n render() {\n if (!this.visible) {\n return <div style={{display: 'none'}}>Verdocs Auth Placeholder</div>;\n }\n\n if (this.isAuthenticated) {\n if (this.debug) {\n return (\n <div class=\"status-result debug\">\n <verdocs-button label=\"Logout\" disabled={this.loggingIn} onPress={() => this.handleLogout()} />\n </div>\n );\n }\n\n return <div class=\"status-result\">Authenticated</div>;\n }\n\n if (this.displayMode === 'signup') {\n return (\n <div class=\"signup-form\">\n <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n <h3>Sign up for an account</h3>\n <h4>\n Already have an account?\n <verdocs-button label=\"Log In\" variant=\"text\" onClick={() => (this.displayMode = 'login')} disabled={this.loggingIn} />\n </h4>\n\n <form onSubmit={() => this.handleLogin()}>\n <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n <verdocs-text-input\n label=\"Password\"\n type=\"password\"\n autocomplete=\"current-password\"\n value={this.password}\n onInput={(e: any) => (this.password = e.target.value)}\n disabled={this.loggingIn}\n />\n\n <verdocs-button\n label=\"Signup\"\n disabled={this.loggingIn}\n onPress={() => this.handleLogin()}\n style={{display: 'flex', justifyContent: 'center', margin: '30px auto 0'}}\n />\n </form>\n </div>\n );\n }\n\n return (\n <div class=\"login-form\">\n <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n <h3>Log in to your account</h3>\n <h4>\n Don't have an account?\n <verdocs-button label=\"Sign Up\" variant=\"text\" onClick={() => (this.displayMode = 'signup')} disabled={this.loggingIn} />\n </h4>\n\n <form onSubmit={() => this.handleLogin()}>\n <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n <verdocs-text-input\n label=\"Password\"\n type=\"password\"\n autocomplete=\"current-password\"\n value={this.password}\n onInput={(e: any) => (this.password = e.target.value)}\n disabled={this.loggingIn}\n />\n\n <verdocs-button\n label=\"Forgot Your Password?\"\n variant=\"text\"\n onClick={() => (this.displayMode = 'signup')}\n disabled={this.loggingIn}\n style={{display: 'flex', justifyContent: 'center', margin: '10px auto 20px'}}\n />\n\n <verdocs-button label=\"Login\" disabled={this.loggingIn} onPress={() => this.handleLogin()} style={{display: 'flex', justifyContent: 'center', margin: '10px auto 0'}} />\n </form>\n\n {this.loginError ? <verdocs-ok-dialog open={true} heading=\"Login Error\" message={this.loginError} onClosed={() => this.handleClearError()} /> : <div />}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-auth.js","sourceRoot":"","sources":["../../../../src/components/embeds/verdocs-auth/verdocs-auth.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Auth} from '@verdocs/js-sdk/Users';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {TSession} from '@verdocs/js-sdk/Sessions/Types';\nimport {Component, Prop, State, h, Event, EventEmitter} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\n\nexport interface IAuthStatus {\n authenticated: boolean;\n session: TSession;\n}\n\n/*\n Display an authentication dialog that allows the user to login or sign up. Callbacks are provided for events that\n * occur during the process (especially successful completion). The success callback will be fired immediately if the\n * user is already authenticated with a valid session, so this component may not always display visibly.\n \n To simplify some types of authentication flows, a visibility flag can force this component to never display. This\n * allows you to susbcribe to notifications from the\n \n This embed is responsive / mobile-friendly, but the calling application should provide at least a 300px wide\n * container to allow sufficient space for the required forms.\n \n As noted below, the primary event is `authenticated`. This will always be fired at least once, immediately after\n * the widget is rendered and the user's status has been checked. It may be fired again as the user completes (or\n * cancels) authentication steps.\n \n Authentication is required to demonstrate this Element. You may do this in Storybook by using the Auth\n * embed. This Element will reuse the same session produced by logging in via that Embed.\n \n ```typescript\n * interface IAuthStatus {\n * // If true, the user is authenticated with a valid session\n * authenticated: boolean;\n \n // Details for the user's session\n * session: IActiveSession \| null;\n * }\n * ```\n /\n@Component({\n tag: 'verdocs-auth',\n styleUrl: 'verdocs-auth.scss',\n shadow: false,\n})\nexport class VerdocsAuth {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n Normally, if the user has a valid session, this embed will be invisible, otherwise it will display\n * login / signup forms. If this is set to false, this embed will be invisible in both cases. Apps may\n * use this to verify if a user has a valid session without needing a separate call to Verdocs JS SDK.\n /\n @Prop() visible: boolean = true;\n\n /\n By default, a Verdocs logo will be displayed above the login/signup forms. This may be used to\n * override its source. (Alternatively, you may simply hide it via CSS overrides.) Logos should be\n * in SVG format for best results.\n /\n @Prop() logo: string = 'https://verdocs.com/assets/blue-logo.svg';\n\n /\n If the user is authenticated, this embed will normally render invisibly. If debug is set true, a summary\n * if the user's session details will be displayed instead. This may be useful while debugging authentication\n * flows in new applications.\n /\n @Prop() debug: boolean = false;\n\n /\n Event fired when session authentication process has completed. Check the event contents for completion status.\n /\n @Event({composed: true}) authenticated: EventEmitter<IAuthStatus>;\n\n /\n Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n @State() isAuthenticated: boolean = false;\n @State() displayMode: string = 'login';\n @State() username: string = '';\n @State() password: string = '';\n @State() loggingIn: boolean = false;\n @State() activeSession: TSession = null;\n @State() loginError: string \| null = null;\n\n componentWillLoad() {\n this.endpoint.loadSession();\n if (this.endpoint.session) {\n console.log('[AUTH] Authenticated');\n this.isAuthenticated = true;\n this.activeSession = this.endpoint.session;\n this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n } else {\n console.log('[AUTH] Anonymous');\n this.authenticated?.emit({authenticated: false, session: null});\n }\n }\n\n handleLogin() {\n this.loggingIn = true;\n Auth.authenticateUser(this.endpoint, {username: this.username, password: this.password})\n .then(r => {\n this.loggingIn = false;\n this.endpoint.setToken(r.accessToken);\n this.activeSession = this.endpoint.session;\n this.isAuthenticated = true;\n this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n })\n .catch(e => {\n console.log('[AUTH] Authentication error', e.response, JSON.stringify(e));\n this.loggingIn = false;\n this.activeSession = null;\n this.authenticated?.emit({authenticated: false, session: null});\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n\n if (e?.response?.status === 403) {\n this.loginError = 'Please check your username and password and try again.';\n }\n });\n }\n\n handleLogout() {\n this.endpoint.clearSession();\n this.isAuthenticated = false;\n this.authenticated?.emit({authenticated: false, session: null});\n }\n\n handleClearError() {\n this.loginError = null;\n }\n\n render() {\n if (!this.visible) {\n return <div style={{display: 'none'}}>Verdocs Auth Placeholder</div>;\n }\n\n if (this.isAuthenticated) {\n if (this.debug) {\n return (\n <div class=\"status-result debug\">\n <verdocs-button label=\"Logout\" disabled={this.loggingIn} onClick={() => this.handleLogout()} />\n </div>\n );\n }\n\n return <div class=\"status-result\">Authenticated</div>;\n }\n\n if (this.displayMode === 'signup') {\n return (\n <div class=\"signup-form\">\n <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n <h3>Sign up for an account</h3>\n <h4>\n Already have an account?\n <verdocs-button label=\"Log In\" variant=\"text\" onClick={() => (this.displayMode = 'login')} disabled={this.loggingIn} />\n </h4>\n\n <form onSubmit={() => this.handleLogin()}>\n <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n <verdocs-text-input\n label=\"Password\"\n type=\"password\"\n autocomplete=\"current-password\"\n value={this.password}\n onInput={(e: any) => (this.password = e.target.value)}\n disabled={this.loggingIn}\n />\n\n <verdocs-button\n label=\"Signup\"\n disabled={this.loggingIn}\n onClick={() => this.handleLogin()}\n style={{display: 'flex', justifyContent: 'center', margin: '30px auto 0'}}\n />\n </form>\n </div>\n );\n }\n\n return (\n <div class=\"login-form\">\n <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n <h3>Log in to your account</h3>\n <h4>\n Don't have an account?\n <verdocs-button label=\"Sign Up\" variant=\"text\" onClick={() => (this.displayMode = 'signup')} disabled={this.loggingIn} />\n </h4>\n\n <form onSubmit={() => this.handleLogin()}>\n <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n <verdocs-text-input\n label=\"Password\"\n type=\"password\"\n autocomplete=\"current-password\"\n value={this.password}\n onInput={(e: any) => (this.password = e.target.value)}\n disabled={this.loggingIn}\n />\n\n <verdocs-button\n label=\"Forgot Your Password?\"\n variant=\"text\"\n onClick={() => (this.displayMode = 'signup')}\n disabled={this.loggingIn}\n style={{display: 'flex', justifyContent: 'center', margin: '10px auto 20px'}}\n />\n\n <verdocs-button label=\"Login\" disabled={this.loggingIn} onClick={() => this.handleLogin()} style={{display: 'flex', justifyContent: 'center', margin: '10px auto 0'}} />\n </form>\n\n {this.loginError ? <verdocs-ok-dialog heading=\"Login Error\" message={this.loginError} onNext={() => this.handleClearError()} /> : <div />}\n </div>\n );\n }\n}\n"]}