@verdocs/web-sdk 5.3.5 → 5.4.2

package/dist/components/{p-pXqgg9BU.js.map → p-DDTha7DK.js.map}

@@ -1 +1 @@
-{"file":"p-pXqgg9BU.js","mappings":";;;;;AAAA,MAAM,qBAAqB,GAAG,45BAA45B;;MCiB76B,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;AAL/B,IAAA,WAAA,GAAA;;;;AAME;;AAEG;AACK,QAAA,IAAA,CAAA,QAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE;AAiDjE;AAvCC,IAAA,iBAAiB,CAAC,CAAM,EAAA;;AACtB,QAAA,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,CAAC,CAAC,MAAM,CAAC,KAAK,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,CAAC,CAAC,KAAI,IAAI;AACvC,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC,CAAC;QAC1C,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,IAAI,CAAC,IAAI,CAAC;;AAGrD,IAAA,gBAAgB,CAAC,CAAM,EAAA;;QACrB,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;AAChB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC;AACrC,QAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,cAAc,CAAC,sBAAsB,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,EAAE;;IAG1D,MAAM,GAAA;AACJ,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,GAAG,yBAAyB,GAAG,kCAAkC;AAE9F,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,QAAQ,EACR,IAAA,EAAA,EAAE,EAAC,sBAAsB,EACzB,MAAM,EAAC,4HAA4H,EACnI,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,EACxB,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EACxC,CAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EAGrB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,kBAAkB,CAAO,EAEtF,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EAAE,IAAI,CAAC,IAAI,GAAG,WAAW,GAAG,sBAAsB,CAAO,EAE/E,CAAgB,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAI,CAAA,CACvF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-file-chooser/verdocs-file-chooser.scss?tag=verdocs-file-chooser","src/components/controls/verdocs-file-chooser/verdocs-file-chooser.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-file-chooser {\n  display: flex;\n  flex-direction: column;\n  background-color: $verdocs-grey-4;\n  font-family: $verdocs-primary-font;\n\n  .upload-box {\n    text-align: center;\n    box-sizing: border-box;\n    padding: 40px 15px;\n    //padding: 44px 18px 66px;\n    color: rgba(0, 0, 0, 0.54);\n\n    svg {\n      width: 64px;\n      height: 64px;\n      fill: #5c6575;\n    }\n  }\n\n  .selected-filename {\n    font-size: 20px;\n    //margin-top: 20px;\n    font-weight: bold;\n    overflow-wrap: anywhere;\n  }\n\n  .or-prefer {\n    height: 20px;\n    margin: 20px 0;\n    font-size: 16px;\n  }\n}\n","import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State, Host} from '@stencil/core';\nimport {unicodeNBSP} from '../../../utils/Icons';\n\n/**\n * Displays a file picker to upload an attachment. This component is just the picker - the host application or component should\n * provide the actual upload functionality.\n *\n * ```ts\n * <verdocs-file-chooser onFileSelected={(e) => console.log('File Selected', e.detail)} />\n * ```\n */\n@Component({\n  tag: 'verdocs-file-chooser',\n  styleUrl: 'verdocs-file-chooser.scss',\n  shadow: false,\n})\nexport class VerdocsFileChooser {\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   * Event fired when a file has been selected. Note that the file may be null if the user is choosing a different file.\n   * Host applications should use this event to enable/disable buttons to upload or otherwise process the selected file.\n   */\n  @Event({composed: true}) fileSelected: EventEmitter<{file: File | null}>;\n\n  @State() file: File | null;\n\n  handleFileChanged(e: any) {\n    this.file = e.target.files?.[0] || null;\n    this.fileSelected?.emit({file: this.file});\n    console.debug('[CHOOSER] Selected file', this.file);\n  }\n\n  handleSelectFile(e: any) {\n    e.stopPropagation();\n    this.file = null;\n    this.fileSelected?.emit({file: null});\n    document.getElementById('verdocs-file-chooser')?.click();\n  }\n\n  render() {\n    const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';\n\n    return (\n      <Host>\n        <input\n          type=\"file\"\n          multiple\n          id=\"verdocs-file-chooser\"\n          accept=\"application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n          style={{display: 'none'}}\n          onChange={e => this.handleFileChanged(e)}\n        />\n\n        <div class=\"upload-box\">\n          {/*<div innerHTML={FileIcon} />*/}\n\n          <div class=\"selected-filename\">{this.file ? this.file.name : 'Drag a file here'}</div>\n\n          <div class=\"or-prefer\">{this.file ? unicodeNBSP : 'Or, if you prefer...'}</div>\n\n          <verdocs-button label={buttonlabel} size=\"small\" onClick={e => this.handleSelectFile(e)} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DDTha7DK.js","mappings":";;;;;AAAA,MAAM,qBAAqB,GAAG,45BAA45B;;MCiB76B,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;AAL/B,IAAA,WAAA,GAAA;;;;AAME;;AAEG;AACK,QAAA,IAAA,CAAA,QAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE;AAiDjE;AAvCC,IAAA,iBAAiB,CAAC,CAAM,EAAA;;AACtB,QAAA,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,CAAC,CAAC,MAAM,CAAC,KAAK,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,CAAC,CAAC,KAAI,IAAI;AACvC,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC,CAAC;QAC1C,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,IAAI,CAAC,IAAI,CAAC;;AAGrD,IAAA,gBAAgB,CAAC,CAAM,EAAA;;QACrB,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;AAChB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC;AACrC,QAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,cAAc,CAAC,sBAAsB,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,EAAE;;IAG1D,MAAM,GAAA;AACJ,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,GAAG,yBAAyB,GAAG,kCAAkC;AAE9F,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,QAAQ,EACR,IAAA,EAAA,EAAE,EAAC,sBAAsB,EACzB,MAAM,EAAC,4HAA4H,EACnI,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,EACxB,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EACxC,CAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EAGrB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,kBAAkB,CAAO,EAEtF,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EAAE,IAAI,CAAC,IAAI,GAAG,WAAW,GAAG,sBAAsB,CAAO,EAE/E,CAAgB,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAI,CAAA,CACvF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-file-chooser/verdocs-file-chooser.scss?tag=verdocs-file-chooser","src/components/controls/verdocs-file-chooser/verdocs-file-chooser.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-file-chooser {\n  display: flex;\n  flex-direction: column;\n  background-color: $verdocs-grey-4;\n  font-family: $verdocs-primary-font;\n\n  .upload-box {\n    text-align: center;\n    box-sizing: border-box;\n    padding: 40px 15px;\n    //padding: 44px 18px 66px;\n    color: rgba(0, 0, 0, 0.54);\n\n    svg {\n      width: 64px;\n      height: 64px;\n      fill: #5c6575;\n    }\n  }\n\n  .selected-filename {\n    font-size: 20px;\n    //margin-top: 20px;\n    font-weight: bold;\n    overflow-wrap: anywhere;\n  }\n\n  .or-prefer {\n    height: 20px;\n    margin: 20px 0;\n    font-size: 16px;\n  }\n}\n","import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State, Host} from '@stencil/core';\nimport {unicodeNBSP} from '../../../utils/Icons';\n\n/**\n * Displays a file picker to upload an attachment. This component is just the picker - the host application or component should\n * provide the actual upload functionality.\n *\n * ```ts\n * <verdocs-file-chooser onFileSelected={(e) => console.log('File Selected', e.detail)} />\n * ```\n */\n@Component({\n  tag: 'verdocs-file-chooser',\n  styleUrl: 'verdocs-file-chooser.scss',\n  shadow: false,\n})\nexport class VerdocsFileChooser {\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   * Event fired when a file has been selected. Note that the file may be null if the user is choosing a different file.\n   * Host applications should use this event to enable/disable buttons to upload or otherwise process the selected file.\n   */\n  @Event({composed: true}) fileSelected: EventEmitter<{file: File | null}>;\n\n  @State() file: File | null;\n\n  handleFileChanged(e: any) {\n    this.file = e.target.files?.[0] || null;\n    this.fileSelected?.emit({file: this.file});\n    console.debug('[CHOOSER] Selected file', this.file);\n  }\n\n  handleSelectFile(e: any) {\n    e.stopPropagation();\n    this.file = null;\n    this.fileSelected?.emit({file: null});\n    document.getElementById('verdocs-file-chooser')?.click();\n  }\n\n  render() {\n    const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';\n\n    return (\n      <Host>\n        <input\n          type=\"file\"\n          multiple\n          id=\"verdocs-file-chooser\"\n          accept=\"application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n          style={{display: 'none'}}\n          onChange={e => this.handleFileChanged(e)}\n        />\n\n        <div class=\"upload-box\">\n          {/*<div innerHTML={FileIcon} />*/}\n\n          <div class=\"selected-filename\">{this.file ? this.file.name : 'Drag a file here'}</div>\n\n          <div class=\"or-prefer\">{this.file ? unicodeNBSP : 'Or, if you prefer...'}</div>\n\n          <verdocs-button label={buttonlabel} size=\"small\" onClick={e => this.handleSelectFile(e)} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p--hL4T8Ae.js → p-DF8La-N2.js}

@@ -1,18 +1,18 @@
-import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-cuwa7Els.js';
+import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-D16h8pzh.js';
 import { r as requireFormat } from './p-BvYQ0L1f.js';
 import { getRGBA } from '@verdocs/js-sdk';
 import { F as FORMAT_TIMESTAMP } from './p-Dl7Xw8F0.js';
 import { S as SettingsIcon } from './p-7LXbcjVz.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$9 } from './p-_nUQ5iEk.js';
-import { d as defineCustomElement$8 } from './p-D0rJh5my.js';
-import { d as defineCustomElement$7 } from './p-Dt-0j6pv.js';
-import { d as defineCustomElement$6 } from './p-IhdX5vVL.js';
-import { d as defineCustomElement$5 } from './p-Cexe1-Oo.js';
-import { d as defineCustomElement$4 } from './p-BakshEO1.js';
-import { d as defineCustomElement$3 } from './p-dDTMckyL.js';
-import { d as defineCustomElement$2 } from './p-CEXKKH9Z.js';
-import { d as defineCustomElement$1 } from './p-BDmKp20X.js';
+import { d as defineCustomElement$9 } from './p-BNrp2UP2.js';
+import { d as defineCustomElement$8 } from './p-wYGYhfrp.js';
+import { d as defineCustomElement$7 } from './p-DsCKNQPC.js';
+import { d as defineCustomElement$6 } from './p-BGZ_owBm.js';
+import { d as defineCustomElement$5 } from './p-Bv-L0hsU.js';
+import { d as defineCustomElement$4 } from './p-Boia1Nbz.js';
+import { d as defineCustomElement$3 } from './p-Cy-AXBKH.js';
+import { d as defineCustomElement$2 } from './p-vCuIwe1D.js';
+import { d as defineCustomElement$1 } from './p-C_SISdpZ.js';
 
 var formatExports = /*@__PURE__*/ requireFormat();
 
@@ -111,7 +111,7 @@ const VerdocsFieldTimestamp = /*@__PURE__*/ proxyCustomElement(class VerdocsFiel
             }, helpText: 'Time stamps are automatically set when the recipient signs the document.' })))))));
     }
     static get style() { return verdocsFieldTimestampCss; }
-}, [0, "verdocs-field-timestamp", {
+}, [256, "verdocs-field-timestamp", {
         "source": [513],
         "sourceid": [513],
         "fieldname": [513],
@@ -188,6 +188,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsFieldTimestamp as V, defineCustomElement as d };
-//# sourceMappingURL=p--hL4T8Ae.js.map
+//# sourceMappingURL=p-DF8La-N2.js.map
 
-//# sourceMappingURL=p--hL4T8Ae.js.map
+//# sourceMappingURL=p-DF8La-N2.js.map

package/dist/components/{p--hL4T8Ae.js.map → p-DF8La-N2.js.map}

@@ -1 +1 @@
-{"file":"p--hL4T8Ae.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","format"],"sources":["src/components/fields/verdocs-field-timestamp/verdocs-field-timestamp.scss?tag=verdocs-field-timestamp","src/components/fields/verdocs-field-timestamp/verdocs-field-timestamp.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-timestamp {\n  width: 160px;\n  height: 15px;\n  display: block;\n  font-size: 9px;\n  position: relative;\n  scroll-margin: 20px 0;\n  background-color: transparent;\n  transform-origin: bottom left;\n  font-family: $verdocs-primary-font;\n\n  &.done {\n    opacity: 1;\n  }\n\n  input {\n    position: absolute;\n\n    // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n    cursor: inherit;\n\n    opacity: 0.5;\n    width: 100%;\n    height: 100%;\n    font-size: 9px;\n    background: none;\n    font-weight: 500;\n    transform-origin: 0 0;\n    box-sizing: border-box;\n    color: rgba(0, 0, 0, 0.87);\n    border: 1px solid rgba(0, 0, 0, 0.2);\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  label {\n    top: -14px;\n    left: -1px;\n    height: 14px;\n    color: white;\n    padding: 0 4px;\n    font-size: 9px;\n    line-height: 13px;\n    position: absolute;\n    background: #4a4a99;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n  }\n\n  &.required {\n    border: 1px solid rgb(204, 0, 0);\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  verdocs-button-panel {\n    top: -3px;\n    left: -2px;\n    opacity: 0.5;\n    z-index: 1000;\n    cursor: pointer;\n    position: absolute;\n    transform: scale(0.6);\n\n    &[data-active],\n    &:hover {\n      opacity: 1;\n    }\n\n    .icon {\n      svg {\n        fill: #333333;\n      }\n\n      &:hover {\n        svg {\n          fill: #000000;\n        }\n      }\n    }\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n","import {format} from 'date-fns/format';\nimport {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Method, Event, EventEmitter, Fragment, State} from '@stencil/core';\nimport {FORMAT_TIMESTAMP} from '../../../utils/Types';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a timestamp. Timestamps are not editable by signers. Instead, they are automatically\n * filled when the signer submits the document.\n */\n@Component({\n  tag: 'verdocs-field-timestamp',\n  styleUrl: 'verdocs-field-timestamp.scss',\n  shadow: false,\n})\nexport class VerdocsFieldTimestamp {\n  private el: HTMLInputElement;\n\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop() pagenumber?: number = 1;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n\n  @Method() async focusField() {\n    this.el.focus();\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n    this.showingProperties = false;\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const {required = false, placeholder = '', value = '', label = ''} = field || {};\n    const backgroundColor = getRGBA(index);\n\n    const formatted = format(new Date(value || new Date().toISOString()), FORMAT_TIMESTAMP);\n\n    if (done) {\n      return <Host class={{done}}>{formatted}</Host>;\n    }\n\n    return (\n      <Host class={{required, disabled, done}} style={{backgroundColor}}>\n        {label && <label>{label}</label>}\n        <input type=\"text\" placeholder={placeholder} value={formatted} disabled={true} ref={el => (this.el = el)} />\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={fieldname}\n                  onClose={() => this.hideSettingsPanel()}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: fieldname});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={'Time stamps are automatically set when the recipient signs the document.'}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DF8La-N2.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","format"],"sources":["src/components/fields/verdocs-field-timestamp/verdocs-field-timestamp.scss?tag=verdocs-field-timestamp","src/components/fields/verdocs-field-timestamp/verdocs-field-timestamp.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-timestamp {\n  width: 160px;\n  height: 15px;\n  display: block;\n  font-size: 9px;\n  position: relative;\n  scroll-margin: 20px 0;\n  background-color: transparent;\n  transform-origin: bottom left;\n  font-family: $verdocs-primary-font;\n\n  &.done {\n    opacity: 1;\n  }\n\n  input {\n    position: absolute;\n\n    // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n    cursor: inherit;\n\n    opacity: 0.5;\n    width: 100%;\n    height: 100%;\n    font-size: 9px;\n    background: none;\n    font-weight: 500;\n    transform-origin: 0 0;\n    box-sizing: border-box;\n    color: rgba(0, 0, 0, 0.87);\n    border: 1px solid rgba(0, 0, 0, 0.2);\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  label {\n    top: -14px;\n    left: -1px;\n    height: 14px;\n    color: white;\n    padding: 0 4px;\n    font-size: 9px;\n    line-height: 13px;\n    position: absolute;\n    background: #4a4a99;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n  }\n\n  &.required {\n    border: 1px solid rgb(204, 0, 0);\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  verdocs-button-panel {\n    top: -3px;\n    left: -2px;\n    opacity: 0.5;\n    z-index: 1000;\n    cursor: pointer;\n    position: absolute;\n    transform: scale(0.6);\n\n    &[data-active],\n    &:hover {\n      opacity: 1;\n    }\n\n    .icon {\n      svg {\n        fill: #333333;\n      }\n\n      &:hover {\n        svg {\n          fill: #000000;\n        }\n      }\n    }\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n","import {format} from 'date-fns/format';\nimport {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Method, Event, EventEmitter, Fragment, State} from '@stencil/core';\nimport {FORMAT_TIMESTAMP} from '../../../utils/Types';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a timestamp. Timestamps are not editable by signers. Instead, they are automatically\n * filled when the signer submits the document.\n */\n@Component({\n  tag: 'verdocs-field-timestamp',\n  styleUrl: 'verdocs-field-timestamp.scss',\n  shadow: false,\n})\nexport class VerdocsFieldTimestamp {\n  private el: HTMLInputElement;\n\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop() pagenumber?: number = 1;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n\n  @Method() async focusField() {\n    this.el.focus();\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n    this.showingProperties = false;\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const {required = false, placeholder = '', value = '', label = ''} = field || {};\n    const backgroundColor = getRGBA(index);\n\n    const formatted = format(new Date(value || new Date().toISOString()), FORMAT_TIMESTAMP);\n\n    if (done) {\n      return <Host class={{done}}>{formatted}</Host>;\n    }\n\n    return (\n      <Host class={{required, disabled, done}} style={{backgroundColor}}>\n        {label && <label>{label}</label>}\n        <input type=\"text\" placeholder={placeholder} value={formatted} disabled={true} ref={el => (this.el = el)} />\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={fieldname}\n                  onClose={() => this.hideSettingsPanel()}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: fieldname});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={'Time stamps are automatically set when the recipient signs the document.'}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-xbfIS4ny.js → p-DMCUZ4ju.js}

@@ -1,6 +1,6 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-cuwa7Els.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-D16h8pzh.js';
 import { randomString } from '@verdocs/js-sdk';
-import { d as defineCustomElement$1 } from './p-BakshEO1.js';
+import { d as defineCustomElement$1 } from './p-Boia1Nbz.js';
 
 const verdocsDropdownCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-dropdown{height:26px;display:block;position:relative;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-dropdown .arrow{width:32px;height:26px;background:#fff;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;border:1px solid #cccccc;-ms-flex-pack:center;justify-content:center}verdocs-dropdown .arrow svg{fill:#55bc81;-webkit-transition:0.3s;transition:0.3s}verdocs-dropdown.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}#verdocs-dropdown-menu-items{width:200px;z-index:10000;position:absolute;border-radius:5px;background:#33354c;border:1px solid #654dcb}.verdocs-dropdown-menu-separator{height:1px;margin-top:5px;padding-top:5px;border-top:1px solid rgba(255, 255, 255, 0.3725490196)}.verdocs-dropdown-menu-option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;text-wrap:nowrap;padding:10px 20px}.verdocs-dropdown-menu-option:hover{cursor:pointer;background:#55bc81}.verdocs-dropdown-menu-option[disabled]{color:#aaaaaa}.verdocs-dropdown-menu-option[disabled]:hover{cursor:inherit;background:transparent;color:#aaaaaa}";
 
@@ -39,7 +39,7 @@ const VerdocsDropdown = /*@__PURE__*/ proxyCustomElement(class VerdocsDropdown e
     }
     get el() { return this; }
     static get style() { return verdocsDropdownCss; }
-}, [0, "verdocs-dropdown", {
+}, [256, "verdocs-dropdown", {
         "options": [16],
         "containerId": [32],
         "showPicker": [32]
@@ -64,6 +64,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsDropdown as V, defineCustomElement as d };
-//# sourceMappingURL=p-xbfIS4ny.js.map
+//# sourceMappingURL=p-DMCUZ4ju.js.map
 
-//# sourceMappingURL=p-xbfIS4ny.js.map
+//# sourceMappingURL=p-DMCUZ4ju.js.map

package/dist/components/{p-xbfIS4ny.js.map → p-DMCUZ4ju.js.map}

@@ -1 +1 @@
-{"file":"p-xbfIS4ny.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,ihDAAihD;;ACI5iD,MAAM,aAAa,GAAG,CAAA,+KAAA,CAAiL;MA6B1L,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAJ5B,IAAA,WAAA,GAAA;;;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAkB,EAAE;QAQ1B,IAAA,CAAA,WAAW,GAAG,CAAA,aAAA,EAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA,CAAE;AAE3E,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK;AAqC5B;IAnCC,kBAAkB,CAAC,CAAM,EAAE,MAAmB,EAAA;;QAC5C,CAAC,CAAC,eAAe,EAAE;QACnB,CAAA,EAAA,GAAA,IAAI,CAAC,cAAc,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,MAAM,CAAC;AACjC,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;;IAGzB,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU;;IAGpC,MAAM,GAAA;QACJ,MAAM,IAAI,GAAG,CAAoB,iBAAA,EAAA,YAAY,CAAC,CAAC,CAAC,EAAE;QAElD,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,aAAa,EAAA,YAAA,EAAa,WAAW,EAAC,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,EAAI,CAAA,EAEvI,IAAI,CAAC,UAAU,KACd,uEAAgB,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAC,6BAA6B,EAAA,EACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,IAAG;AACzB,YAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBACjB,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,iCAAiC,GAAG;;iBACjD;AACL,gBAAA,QACE,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,8BAA8B,EAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,MAAM,CAAC,IAC9H,MAAM,CAAC,KAAK,CACN;;AAGf,SAAC,CAAC,CACa,CAClB,CACI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-dropdown/verdocs-dropdown.scss?tag=verdocs-dropdown","src/components/controls/verdocs-dropdown/verdocs-dropdown.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-dropdown {\n  height: 26px;\n  display: block;\n  position: relative;\n  font-family: $primary-font;\n\n  .arrow {\n    width: 32px;\n    height: 26px;\n    background: #fff;\n    cursor: pointer;\n    border-radius: 4px;\n    align-items: center;\n    display: inline-flex;\n    border: 1px solid $light-border-color;\n    justify-content: center;\n  }\n\n  .arrow svg {\n    fill: $primary-color;\n    transition: 0.3s;\n  }\n\n  &.open {\n    .arrow {\n      background: $secondary-color;\n      border: 1px solid $border-color;\n    }\n\n    .arrow svg {\n      transform: scaleY(-1);\n      fill: #fff;\n    }\n  }\n}\n\n#verdocs-dropdown-menu-items {\n  width: 200px;\n  z-index: 10000;\n  position: absolute;\n  border-radius: 5px;\n  background: $medium-bg;\n  border: 1px solid $item-border-color;\n}\n\n.verdocs-dropdown-menu-separator {\n  height: 1px;\n  margin-top: 5px;\n  padding-top: 5px;\n  border-top: 1px solid #ffffff5f;\n}\n\n.verdocs-dropdown-menu-option {\n  width: 100%;\n  color: #fff;\n  border: none;\n  display: block;\n  text-align: left;\n  background: none;\n  text-wrap: nowrap;\n  padding: 10px 20px;\n}\n\n.verdocs-dropdown-menu-option:hover {\n  cursor: pointer;\n  background: $primary-color;\n}\n\n.verdocs-dropdown-menu-option[disabled] {\n  color: $light-disabled-color;\n}\n\n.verdocs-dropdown-menu-option[disabled]:hover {\n  cursor: inherit;\n  background: transparent;\n  color: $light-disabled-color;\n}\n","import {Host, State} from '@stencil/core';\nimport {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst DropdownArrow = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#50BE80\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M7 10l5 5 5-5H7z\"/></svg>`;\n\nexport interface IMenuOption {\n  label: string;\n  id?: any;\n  faIcon?: any;\n  disabled?: boolean;\n}\n\n/**\n * Display a drop-down menu button. A menu of the specified options will be displayed when the button is pressed. The menu will be hidden\n * when the button is pressed again, or an option is selected. Separators may be created by supplying an entry with an empty label.\n *\n * ```ts\n * <verdocs-dropdown\n *   options={[\n *     {label: 'Option 1', disabled: true},\n *     {label: 'Option 2', id: '2'}\n *     {label: ''}\n *     {label: 'Option 3', id: '2'}\n *    ]}\n *   label=\"OK\" onClick={() => (console.log('OK clicked'))}\n * />\n * ```\n */\n@Component({\n  tag: 'verdocs-dropdown',\n  styleUrl: 'verdocs-dropdown.scss',\n})\nexport class VerdocsDropdown {\n  @Element()\n  el: HTMLElement;\n\n  /**\n   * The menu options to display.\n   */\n  @Prop() options: IMenuOption[] = [];\n\n  /**\n   * Event fired when a menu option is clicked.\n   * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n   */\n  @Event({composed: true}) optionSelected: EventEmitter<IMenuOption>;\n\n  @State() containerId = `verdocs-send-${Math.random().toString(36).substring(2, 11)}`;\n\n  @State() showPicker = false;\n\n  handleSelectOption(e: any, option: IMenuOption) {\n    e.stopPropagation();\n    this.optionSelected?.emit(option);\n    this.showPicker = false;\n  }\n\n  toggle() {\n    this.showPicker = !this.showPicker;\n  }\n\n  render() {\n    const elId = `verdocs-dropdown-${randomString(8)}`;\n\n    return (\n      <Host>\n        <button class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" id={elId} onClick={() => (this.showPicker = !this.showPicker)} />\n\n        {this.showPicker && (\n          <verdocs-portal anchor={elId} onClickAway={() => (this.showPicker = false)} id=\"verdocs-dropdown-menu-items\">\n            {this.options.map(option => {\n              if (!option.label) {\n                return <div class=\"verdocs-dropdown-menu-separator\" />;\n              } else {\n                return (\n                  <button class=\"verdocs-dropdown-menu-option\" disabled={option.disabled || false} onClick={e => this.handleSelectOption(e, option)}>\n                    {option.label}\n                  </button>\n                );\n              }\n            })}\n          </verdocs-portal>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DMCUZ4ju.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,ihDAAihD;;ACI5iD,MAAM,aAAa,GAAG,CAAA,+KAAA,CAAiL;MA6B1L,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAJ5B,IAAA,WAAA,GAAA;;;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAkB,EAAE;QAQ1B,IAAA,CAAA,WAAW,GAAG,CAAA,aAAA,EAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA,CAAE;AAE3E,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK;AAqC5B;IAnCC,kBAAkB,CAAC,CAAM,EAAE,MAAmB,EAAA;;QAC5C,CAAC,CAAC,eAAe,EAAE;QACnB,CAAA,EAAA,GAAA,IAAI,CAAC,cAAc,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,MAAM,CAAC;AACjC,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;;IAGzB,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU;;IAGpC,MAAM,GAAA;QACJ,MAAM,IAAI,GAAG,CAAoB,iBAAA,EAAA,YAAY,CAAC,CAAC,CAAC,EAAE;QAElD,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,aAAa,EAAA,YAAA,EAAa,WAAW,EAAC,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,EAAI,CAAA,EAEvI,IAAI,CAAC,UAAU,KACd,uEAAgB,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAC,6BAA6B,EAAA,EACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,IAAG;AACzB,YAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBACjB,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,iCAAiC,GAAG;;iBACjD;AACL,gBAAA,QACE,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,8BAA8B,EAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,MAAM,CAAC,IAC9H,MAAM,CAAC,KAAK,CACN;;AAGf,SAAC,CAAC,CACa,CAClB,CACI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-dropdown/verdocs-dropdown.scss?tag=verdocs-dropdown","src/components/controls/verdocs-dropdown/verdocs-dropdown.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-dropdown {\n  height: 26px;\n  display: block;\n  position: relative;\n  font-family: $primary-font;\n\n  .arrow {\n    width: 32px;\n    height: 26px;\n    background: #fff;\n    cursor: pointer;\n    border-radius: 4px;\n    align-items: center;\n    display: inline-flex;\n    border: 1px solid $light-border-color;\n    justify-content: center;\n  }\n\n  .arrow svg {\n    fill: $primary-color;\n    transition: 0.3s;\n  }\n\n  &.open {\n    .arrow {\n      background: $secondary-color;\n      border: 1px solid $border-color;\n    }\n\n    .arrow svg {\n      transform: scaleY(-1);\n      fill: #fff;\n    }\n  }\n}\n\n#verdocs-dropdown-menu-items {\n  width: 200px;\n  z-index: 10000;\n  position: absolute;\n  border-radius: 5px;\n  background: $medium-bg;\n  border: 1px solid $item-border-color;\n}\n\n.verdocs-dropdown-menu-separator {\n  height: 1px;\n  margin-top: 5px;\n  padding-top: 5px;\n  border-top: 1px solid #ffffff5f;\n}\n\n.verdocs-dropdown-menu-option {\n  width: 100%;\n  color: #fff;\n  border: none;\n  display: block;\n  text-align: left;\n  background: none;\n  text-wrap: nowrap;\n  padding: 10px 20px;\n}\n\n.verdocs-dropdown-menu-option:hover {\n  cursor: pointer;\n  background: $primary-color;\n}\n\n.verdocs-dropdown-menu-option[disabled] {\n  color: $light-disabled-color;\n}\n\n.verdocs-dropdown-menu-option[disabled]:hover {\n  cursor: inherit;\n  background: transparent;\n  color: $light-disabled-color;\n}\n","import {Host, State} from '@stencil/core';\nimport {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst DropdownArrow = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#50BE80\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M7 10l5 5 5-5H7z\"/></svg>`;\n\nexport interface IMenuOption {\n  label: string;\n  id?: any;\n  faIcon?: any;\n  disabled?: boolean;\n}\n\n/**\n * Display a drop-down menu button. A menu of the specified options will be displayed when the button is pressed. The menu will be hidden\n * when the button is pressed again, or an option is selected. Separators may be created by supplying an entry with an empty label.\n *\n * ```ts\n * <verdocs-dropdown\n *   options={[\n *     {label: 'Option 1', disabled: true},\n *     {label: 'Option 2', id: '2'}\n *     {label: ''}\n *     {label: 'Option 3', id: '2'}\n *    ]}\n *   label=\"OK\" onClick={() => (console.log('OK clicked'))}\n * />\n * ```\n */\n@Component({\n  tag: 'verdocs-dropdown',\n  styleUrl: 'verdocs-dropdown.scss',\n})\nexport class VerdocsDropdown {\n  @Element()\n  el: HTMLElement;\n\n  /**\n   * The menu options to display.\n   */\n  @Prop() options: IMenuOption[] = [];\n\n  /**\n   * Event fired when a menu option is clicked.\n   * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n   */\n  @Event({composed: true}) optionSelected: EventEmitter<IMenuOption>;\n\n  @State() containerId = `verdocs-send-${Math.random().toString(36).substring(2, 11)}`;\n\n  @State() showPicker = false;\n\n  handleSelectOption(e: any, option: IMenuOption) {\n    e.stopPropagation();\n    this.optionSelected?.emit(option);\n    this.showPicker = false;\n  }\n\n  toggle() {\n    this.showPicker = !this.showPicker;\n  }\n\n  render() {\n    const elId = `verdocs-dropdown-${randomString(8)}`;\n\n    return (\n      <Host>\n        <button class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" id={elId} onClick={() => (this.showPicker = !this.showPicker)} />\n\n        {this.showPicker && (\n          <verdocs-portal anchor={elId} onClickAway={() => (this.showPicker = false)} id=\"verdocs-dropdown-menu-items\">\n            {this.options.map(option => {\n              if (!option.label) {\n                return <div class=\"verdocs-dropdown-menu-separator\" />;\n              } else {\n                return (\n                  <button class=\"verdocs-dropdown-menu-option\" disabled={option.disabled || false} onClick={e => this.handleSelectOption(e, option)}>\n                    {option.label}\n                  </button>\n                );\n              }\n            })}\n          </verdocs-portal>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DMYs4VZa.js → p-DNcLDxgP.js}

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-cuwa7Els.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-D16h8pzh.js';
 import { VerdocsEndpoint, getEnvelope, getInPersonLink, formatFullName } from '@verdocs/js-sdk';
 import { V as VerdocsToast } from './p-CyvDgtoV.js';
 import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$1 } from './p-_nUQ5iEk.js';
+import { d as defineCustomElement$1 } from './p-BNrp2UP2.js';
 
 const verdocsEnvelopeRecipientLinkCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-envelope-recipient-link{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:100000;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-family:\"Inter\", \"Barlow\", sans-serif;background-color:rgba(0, 0, 0, 0.4980392157)}verdocs-envelope-recipient-link .summary-content{width:600px;display:-ms-flexbox;display:flex;max-width:90%;font-size:18px;-ms-flex:0 0 600px;flex:0 0 600px;border-radius:6px;background:#ffffff;-ms-flex-direction:column;flex-direction:column;padding:30px 20px 20px}verdocs-envelope-recipient-link .summary-content .summary-title{font-size:20px;font-weight:700;margin:0 0 10px 0;color:#33364b}verdocs-envelope-recipient-link .summary-recipient{display:-ms-flexbox;display:flex;color:#33364b;margin:8px 0 24px 0;-ms-flex-direction:column;flex-direction:column}verdocs-envelope-recipient-link .summary-recipient .role-name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;font-size:14px;font-weight:600;margin:0 0 8px 0;color:#092c4c}verdocs-envelope-recipient-link .summary-recipient .role-info{gap:5px;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end}verdocs-envelope-recipient-link .summary-recipient .role-full-name{-ms-flex:1;flex:1;height:34px;display:-ms-flexbox;display:flex;font-size:16px;padding:0 12px;border-radius:4px;-ms-flex-align:center;align-items:center;border:1px solid #cccccc;background:rgb(249, 250, 251)}verdocs-envelope-recipient-link .summary-recipient .recipient-link{width:120px;padding:0 16px;font-weight:500;margin:0 0 0 8px;text-align:center;font-size:0.875rem;border-radius:100%;color:rgb(55, 65, 81);line-height:1.25rem;background-color:#d8d8d8;border:2px solid rgb(156, 163, 175)}verdocs-envelope-recipient-link .summary-recipient .link-wrapper{gap:5px;display:-ms-flexbox;display:flex;margin:4px 0 0 0;-ms-flex-direction:row;flex-direction:row}verdocs-envelope-recipient-link .summary-recipient .link-wrapper .link{-ms-flex:1;flex:1;height:34px;display:-ms-flexbox;display:flex;font-size:16px;padding:0 12px;overflow:hidden;margin:0 6px 0 0;border-radius:4px;white-space:nowrap;-ms-flex-align:center;align-items:center;text-overflow:ellipsis;border:1px solid #cccccc;background:rgb(249, 250, 251)}verdocs-envelope-recipient-link .buttons{display:-ms-flexbox;display:flex;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;margin:10px 0 0 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}verdocs-envelope-recipient-link .buttons verdocs-button{-ms-flex:0 0 120px;flex:0 0 120px;margin-left:10px;white-space:nowrap}verdocs-envelope-recipient-link .buttons verdocs-button button{width:100%}";
 
@@ -112,7 +112,7 @@ const VerdocsEnvelopeRecipientLink = /*@__PURE__*/ proxyCustomElement(class Verd
         return (h(Host, null, h("div", { class: "summary-content" }, h("h1", { class: "summary-title" }, "In-Person Signing Link"), h("div", { class: "summary-rows" }, h("div", { class: "summary-recipient" }, h("div", { class: "role-name" }, this.recipient.role_name), h("div", { class: "role-details" }, h("div", { class: "role-info" }, h("div", { class: "role-full-name" }, fullName, " (", this.recipient.email || this.recipient.phone, ")"), !this.link && (h("verdocs-button", { size: "small", variant: "outline", label: this.gettingLink ? 'Loading...' : 'Get Link', disabled: this.gettingLink, onClick: () => this.getLink(this.recipient) }))), this.link && (h("div", { class: "link-wrapper" }, h("div", { class: "link" }, this.link), h("verdocs-button", { size: "small", variant: "outline", label: "Copy", onClick: () => this.copyLink(this.link) })))))), h("div", { class: "buttons" }, h("verdocs-button", { size: "small", label: "Done", onClick: e => this.handleDone(e) })))));
     }
     static get style() { return verdocsEnvelopeRecipientLinkCss; }
-}, [0, "verdocs-envelope-recipient-link", {
+}, [256, "verdocs-envelope-recipient-link", {
         "endpoint": [16],
         "envelopeId": [1, "envelope-id"],
         "roleName": [1, "role-name"],
@@ -143,6 +143,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsEnvelopeRecipientLink as V, defineCustomElement as d };
-//# sourceMappingURL=p-DMYs4VZa.js.map
+//# sourceMappingURL=p-DNcLDxgP.js.map
 
-//# sourceMappingURL=p-DMYs4VZa.js.map
+//# sourceMappingURL=p-DNcLDxgP.js.map

package/dist/components/{p-DMYs4VZa.js.map → p-DNcLDxgP.js.map}

@@ -1 +1 @@
-{"file":"p-DMYs4VZa.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/envelopes/verdocs-envelope-recipient-link/verdocs-envelope-recipient-link.scss?tag=verdocs-envelope-recipient-link","src/components/envelopes/verdocs-envelope-recipient-link/verdocs-envelope-recipient-link.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-envelope-recipient-link {\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  z-index: 100000;\n  position: fixed;\n  align-items: center;\n  justify-content: center;\n  font-family: $primary-font;\n  background-color: #0000007f;\n\n  .summary-content {\n    width: 600px;\n    display: flex;\n    max-width: 90%;\n    font-size: 18px;\n    flex: 0 0 600px;\n    border-radius: 6px;\n    background: #ffffff;\n    flex-direction: column;\n    padding: 30px 20px 20px;\n\n    .summary-title {\n      font-size: 20px;\n      font-weight: 700;\n      margin: 0 0 10px 0;\n      color: $verdocs-dark-blue;\n    }\n  }\n\n  .summary-recipient {\n    display: flex;\n    color: $verdocs-grey-1;\n    margin: 8px 0 24px 0;\n    flex-direction: column;\n\n    .role-name {\n      flex: 1;\n      display: flex;\n      font-size: 14px;\n      font-weight: 600;\n      margin: 0 0 8px 0;\n      color: $verdocs-grey-0;\n    }\n\n    .role-details {\n    }\n\n    .role-info {\n      gap: 5px;\n      display: flex;\n      flex-direction: row;\n      align-items: flex-end;\n    }\n\n    .role-full-name {\n      flex: 1;\n      height: 34px;\n      display: flex;\n      font-size: 16px;\n      padding: 0 12px;\n      border-radius: 4px;\n      align-items: center;\n      border: 1px solid #cccccc;\n      background: rgb(249, 250, 251);\n    }\n\n    .recipient-link {\n      width: 120px;\n      padding: 0 16px;\n      font-weight: 500;\n      margin: 0 0 0 8px;\n      text-align: center;\n      font-size: 0.875rem;\n      border-radius: 100%;\n      color: rgb(55, 65, 81);\n      line-height: 1.25rem;\n      background-color: #d8d8d8;\n      border: 2px solid rgb(156, 163, 175);\n    }\n\n    .link-wrapper {\n      gap: 5px;\n      display: flex;\n      margin: 4px 0 0 0;\n      flex-direction: row;\n\n      .link {\n        flex: 1;\n        height: 34px;\n        display: flex;\n        font-size: 16px;\n        padding: 0 12px;\n        overflow: hidden;\n        margin: 0 6px 0 0;\n        border-radius: 4px;\n        white-space: nowrap;\n        align-items: center;\n        text-overflow: ellipsis;\n        border: 1px solid #cccccc;\n        background: rgb(249, 250, 251);\n      }\n    }\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 15px;\n    margin: 10px 0 0 0;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n\n    verdocs-button {\n      flex: 0 0 120px;\n      margin-left: 10px;\n      white-space: nowrap;\n\n      button {\n        width: 100%;\n      }\n    }\n  }\n}\n","import {Component, Prop, Host, h, State, Event, EventEmitter} from '@stencil/core';\nimport {formatFullName, getEnvelope, getInPersonLink, IEnvelope, IRecipient, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {VerdocsToast} from '../../../utils/Toast';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a single recipient from an envelope, with the opportunity to copy an in-person\n * signing link for that recipient to use.\n */\n@Component({\n  tag: 'verdocs-envelope-recipient-link',\n  styleUrl: 'verdocs-envelope-recipient-link.scss',\n})\nexport class VerdocsEnvelopeRecipientLink {\n  private envelopeListenerId = null;\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 envelope ID to edit.\n   */\n  @Prop() envelopeId: string = '';\n\n  /**\n   * The role to load.\n   */\n  @Prop() roleName: string = '';\n\n  /**\n   * Event fired when the user clicks Done to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) next: EventEmitter<{envelope: IEnvelope}>;\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() isOpen: boolean;\n  @State() gettingLink = true;\n  @State() link = '';\n\n  @State() loading = true;\n  @State() envelope: IEnvelope | null = null;\n  @State() recipient: IRecipient | null = null;\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n\n      if (!this.envelopeId) {\n        console.log(`[RECIPIENT_LINK] Missing required envelope ID ${this.envelopeId}`);\n        return;\n      }\n\n      if (!this.endpoint.session) {\n        console.log('[RECIPIENT_LINK] Unable to start session, must be authenticated');\n        return;\n      }\n\n      this.listenToEnvelope();\n    } catch (e) {\n      console.log('[RECIPIENT_LINK] Error loading envelope', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  disconnectedCallback() {\n    this.unlistenToEnvelope();\n  }\n\n  async listenToEnvelope() {\n    console.log('[RECIPIENT_LINK] Loading envelope', this.envelopeId);\n    this.unlistenToEnvelope();\n    Store.subscribe(\n      'envelopes',\n      this.envelopeId,\n      () => getEnvelope(this.endpoint, this.envelopeId),\n      false,\n      (envelope: IEnvelope) => {\n        this.envelope = envelope;\n        this.loading = false;\n\n        this.recipient = (this.envelope?.recipients || []).find(r => r.role_name === this.roleName);\n        this.getLink(this.recipient);\n      },\n    );\n  }\n\n  unlistenToEnvelope() {\n    if (this.envelopeListenerId) {\n      Store.store.delListener(this.envelopeListenerId);\n      this.envelopeListenerId = null;\n    }\n  }\n\n  handleDone(e: any) {\n    e.preventDefault();\n    this.next?.emit({envelope: this.envelope});\n  }\n\n  copyLink(link: string) {\n    navigator.clipboard\n      .writeText(link)\n      .then(() => VerdocsToast('Link copied to clipboard!', {style: 'success', duration: 3000}))\n      .catch(e => {\n        console.warn('[RECIPIENT_LINK] Error copying to clipboard', e);\n        VerdocsToast(`Unable to copy to clipboard: ${e.message}`, {style: 'error'});\n      });\n  }\n\n  getLink(recipient: IRecipient) {\n    this.gettingLink = true;\n    getInPersonLink(this.endpoint, recipient.envelope_id, recipient.role_name)\n      .then(response => {\n        this.gettingLink = false;\n        this.link = response.link;\n        // NOTE: Left here for documentation purposes. We don't auto-copy the link because many browsers now\n        // error on that because we aren't the focus/gesture-initiator since we're a new component just being\n        // drawn in the DOM. So we let the user click to trigger that.\n        // this.copyLink(response.link);\n      })\n      .catch(e => {\n        this.gettingLink = false;\n        console.log('[RECIPIENT_LINK] Error getting link', e);\n        VerdocsToast('Unable to get link: ' + e.message, {style: 'error'});\n      });\n  }\n\n  render() {\n    if (this.loading || !this.recipient) {\n      return <Host />;\n    }\n\n    // const recipientsWithActions = getRecipientsWithActions(this.store.state); const showLinkButton = recipientCanAct(recipient, recipientsWithActions); const link =\n    //   this.links[recipient.role_name]; const gettingLink = this.gettingLinks[recipient.role_name]; return (\n\n    const fullName = formatFullName(this.recipient);\n    return (\n      <Host>\n        <div class=\"summary-content\">\n          <h1 class=\"summary-title\">In-Person Signing Link</h1>\n          <div class=\"summary-rows\">\n            <div class=\"summary-recipient\">\n              <div class=\"role-name\">{this.recipient.role_name}</div>\n              <div class=\"role-details\">\n                <div class=\"role-info\">\n                  <div class=\"role-full-name\">\n                    {fullName} ({this.recipient.email || this.recipient.phone})\n                  </div>\n                  {!this.link && (\n                    <verdocs-button\n                      size=\"small\"\n                      variant=\"outline\"\n                      label={this.gettingLink ? 'Loading...' : 'Get Link'}\n                      disabled={this.gettingLink}\n                      onClick={() => this.getLink(this.recipient)}\n                    />\n                  )}\n                </div>\n\n                {this.link && (\n                  <div class=\"link-wrapper\">\n                    <div class=\"link\">{this.link}</div>\n                    <verdocs-button size=\"small\" variant=\"outline\" label=\"Copy\" onClick={() => this.copyLink(this.link)} />\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n\n          <div class=\"buttons\">\n            <verdocs-button size=\"small\" label=\"Done\" onClick={e => this.handleDone(e)} />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DNcLDxgP.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/envelopes/verdocs-envelope-recipient-link/verdocs-envelope-recipient-link.scss?tag=verdocs-envelope-recipient-link","src/components/envelopes/verdocs-envelope-recipient-link/verdocs-envelope-recipient-link.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-envelope-recipient-link {\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  z-index: 100000;\n  position: fixed;\n  align-items: center;\n  justify-content: center;\n  font-family: $primary-font;\n  background-color: #0000007f;\n\n  .summary-content {\n    width: 600px;\n    display: flex;\n    max-width: 90%;\n    font-size: 18px;\n    flex: 0 0 600px;\n    border-radius: 6px;\n    background: #ffffff;\n    flex-direction: column;\n    padding: 30px 20px 20px;\n\n    .summary-title {\n      font-size: 20px;\n      font-weight: 700;\n      margin: 0 0 10px 0;\n      color: $verdocs-dark-blue;\n    }\n  }\n\n  .summary-recipient {\n    display: flex;\n    color: $verdocs-grey-1;\n    margin: 8px 0 24px 0;\n    flex-direction: column;\n\n    .role-name {\n      flex: 1;\n      display: flex;\n      font-size: 14px;\n      font-weight: 600;\n      margin: 0 0 8px 0;\n      color: $verdocs-grey-0;\n    }\n\n    .role-details {\n    }\n\n    .role-info {\n      gap: 5px;\n      display: flex;\n      flex-direction: row;\n      align-items: flex-end;\n    }\n\n    .role-full-name {\n      flex: 1;\n      height: 34px;\n      display: flex;\n      font-size: 16px;\n      padding: 0 12px;\n      border-radius: 4px;\n      align-items: center;\n      border: 1px solid #cccccc;\n      background: rgb(249, 250, 251);\n    }\n\n    .recipient-link {\n      width: 120px;\n      padding: 0 16px;\n      font-weight: 500;\n      margin: 0 0 0 8px;\n      text-align: center;\n      font-size: 0.875rem;\n      border-radius: 100%;\n      color: rgb(55, 65, 81);\n      line-height: 1.25rem;\n      background-color: #d8d8d8;\n      border: 2px solid rgb(156, 163, 175);\n    }\n\n    .link-wrapper {\n      gap: 5px;\n      display: flex;\n      margin: 4px 0 0 0;\n      flex-direction: row;\n\n      .link {\n        flex: 1;\n        height: 34px;\n        display: flex;\n        font-size: 16px;\n        padding: 0 12px;\n        overflow: hidden;\n        margin: 0 6px 0 0;\n        border-radius: 4px;\n        white-space: nowrap;\n        align-items: center;\n        text-overflow: ellipsis;\n        border: 1px solid #cccccc;\n        background: rgb(249, 250, 251);\n      }\n    }\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 15px;\n    margin: 10px 0 0 0;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n\n    verdocs-button {\n      flex: 0 0 120px;\n      margin-left: 10px;\n      white-space: nowrap;\n\n      button {\n        width: 100%;\n      }\n    }\n  }\n}\n","import {Component, Prop, Host, h, State, Event, EventEmitter} from '@stencil/core';\nimport {formatFullName, getEnvelope, getInPersonLink, IEnvelope, IRecipient, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {VerdocsToast} from '../../../utils/Toast';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a single recipient from an envelope, with the opportunity to copy an in-person\n * signing link for that recipient to use.\n */\n@Component({\n  tag: 'verdocs-envelope-recipient-link',\n  styleUrl: 'verdocs-envelope-recipient-link.scss',\n})\nexport class VerdocsEnvelopeRecipientLink {\n  private envelopeListenerId = null;\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 envelope ID to edit.\n   */\n  @Prop() envelopeId: string = '';\n\n  /**\n   * The role to load.\n   */\n  @Prop() roleName: string = '';\n\n  /**\n   * Event fired when the user clicks Done to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) next: EventEmitter<{envelope: IEnvelope}>;\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() isOpen: boolean;\n  @State() gettingLink = true;\n  @State() link = '';\n\n  @State() loading = true;\n  @State() envelope: IEnvelope | null = null;\n  @State() recipient: IRecipient | null = null;\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n\n      if (!this.envelopeId) {\n        console.log(`[RECIPIENT_LINK] Missing required envelope ID ${this.envelopeId}`);\n        return;\n      }\n\n      if (!this.endpoint.session) {\n        console.log('[RECIPIENT_LINK] Unable to start session, must be authenticated');\n        return;\n      }\n\n      this.listenToEnvelope();\n    } catch (e) {\n      console.log('[RECIPIENT_LINK] Error loading envelope', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  disconnectedCallback() {\n    this.unlistenToEnvelope();\n  }\n\n  async listenToEnvelope() {\n    console.log('[RECIPIENT_LINK] Loading envelope', this.envelopeId);\n    this.unlistenToEnvelope();\n    Store.subscribe(\n      'envelopes',\n      this.envelopeId,\n      () => getEnvelope(this.endpoint, this.envelopeId),\n      false,\n      (envelope: IEnvelope) => {\n        this.envelope = envelope;\n        this.loading = false;\n\n        this.recipient = (this.envelope?.recipients || []).find(r => r.role_name === this.roleName);\n        this.getLink(this.recipient);\n      },\n    );\n  }\n\n  unlistenToEnvelope() {\n    if (this.envelopeListenerId) {\n      Store.store.delListener(this.envelopeListenerId);\n      this.envelopeListenerId = null;\n    }\n  }\n\n  handleDone(e: any) {\n    e.preventDefault();\n    this.next?.emit({envelope: this.envelope});\n  }\n\n  copyLink(link: string) {\n    navigator.clipboard\n      .writeText(link)\n      .then(() => VerdocsToast('Link copied to clipboard!', {style: 'success', duration: 3000}))\n      .catch(e => {\n        console.warn('[RECIPIENT_LINK] Error copying to clipboard', e);\n        VerdocsToast(`Unable to copy to clipboard: ${e.message}`, {style: 'error'});\n      });\n  }\n\n  getLink(recipient: IRecipient) {\n    this.gettingLink = true;\n    getInPersonLink(this.endpoint, recipient.envelope_id, recipient.role_name)\n      .then(response => {\n        this.gettingLink = false;\n        this.link = response.link;\n        // NOTE: Left here for documentation purposes. We don't auto-copy the link because many browsers now\n        // error on that because we aren't the focus/gesture-initiator since we're a new component just being\n        // drawn in the DOM. So we let the user click to trigger that.\n        // this.copyLink(response.link);\n      })\n      .catch(e => {\n        this.gettingLink = false;\n        console.log('[RECIPIENT_LINK] Error getting link', e);\n        VerdocsToast('Unable to get link: ' + e.message, {style: 'error'});\n      });\n  }\n\n  render() {\n    if (this.loading || !this.recipient) {\n      return <Host />;\n    }\n\n    // const recipientsWithActions = getRecipientsWithActions(this.store.state); const showLinkButton = recipientCanAct(recipient, recipientsWithActions); const link =\n    //   this.links[recipient.role_name]; const gettingLink = this.gettingLinks[recipient.role_name]; return (\n\n    const fullName = formatFullName(this.recipient);\n    return (\n      <Host>\n        <div class=\"summary-content\">\n          <h1 class=\"summary-title\">In-Person Signing Link</h1>\n          <div class=\"summary-rows\">\n            <div class=\"summary-recipient\">\n              <div class=\"role-name\">{this.recipient.role_name}</div>\n              <div class=\"role-details\">\n                <div class=\"role-info\">\n                  <div class=\"role-full-name\">\n                    {fullName} ({this.recipient.email || this.recipient.phone})\n                  </div>\n                  {!this.link && (\n                    <verdocs-button\n                      size=\"small\"\n                      variant=\"outline\"\n                      label={this.gettingLink ? 'Loading...' : 'Get Link'}\n                      disabled={this.gettingLink}\n                      onClick={() => this.getLink(this.recipient)}\n                    />\n                  )}\n                </div>\n\n                {this.link && (\n                  <div class=\"link-wrapper\">\n                    <div class=\"link\">{this.link}</div>\n                    <verdocs-button size=\"small\" variant=\"outline\" label=\"Copy\" onClick={() => this.copyLink(this.link)} />\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n\n          <div class=\"buttons\">\n            <verdocs-button size=\"small\" label=\"Done\" onClick={e => this.handleDone(e)} />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-Cbg7a3HQ.js → p-DepyvOoM.js}

@@ -1,17 +1,17 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-cuwa7Els.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-D16h8pzh.js';
 import { getRGBA } from '@verdocs/js-sdk';
 import { S as SettingsIcon } from './p-7LXbcjVz.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$a } from './p-_nUQ5iEk.js';
-import { d as defineCustomElement$9 } from './p-D0rJh5my.js';
-import { d as defineCustomElement$8 } from './p-Dt-0j6pv.js';
-import { d as defineCustomElement$7 } from './p-IhdX5vVL.js';
-import { d as defineCustomElement$6 } from './p-DbwkPoha.js';
-import { d as defineCustomElement$5 } from './p-Cexe1-Oo.js';
-import { d as defineCustomElement$4 } from './p-BakshEO1.js';
-import { d as defineCustomElement$3 } from './p-dDTMckyL.js';
-import { d as defineCustomElement$2 } from './p-CEXKKH9Z.js';
-import { d as defineCustomElement$1 } from './p-BDmKp20X.js';
+import { d as defineCustomElement$a } from './p-BNrp2UP2.js';
+import { d as defineCustomElement$9 } from './p-wYGYhfrp.js';
+import { d as defineCustomElement$8 } from './p-DsCKNQPC.js';
+import { d as defineCustomElement$7 } from './p-BGZ_owBm.js';
+import { d as defineCustomElement$6 } from './p-C1nftqjj.js';
+import { d as defineCustomElement$5 } from './p-Bv-L0hsU.js';
+import { d as defineCustomElement$4 } from './p-Boia1Nbz.js';
+import { d as defineCustomElement$3 } from './p-Cy-AXBKH.js';
+import { d as defineCustomElement$2 } from './p-vCuIwe1D.js';
+import { d as defineCustomElement$1 } from './p-C_SISdpZ.js';
 
 const verdocsFieldInitialCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-field-initial{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:83px;height:36px;display:block;font-size:11px;position:relative;letter-spacing:0.3px;scroll-margin:20px 0;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-initial label{top:-14px;left:-1px;height:14px;color:white;padding:0 4px;font-size:9px;line-height:13px;position:absolute;background:#4a4a99;border-top-left-radius:2px;border-top-right-radius:2px}verdocs-field-initial.done{border:none;opacity:1}verdocs-field-initial img{display:block;max-width:100%;max-height:100%}verdocs-field-initial.disabled img{opacity:0.5}verdocs-field-initial button{cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-initial button.hide{display:none}verdocs-field-initial.required{border:1px solid #cc0000}verdocs-field-initial.focused{-webkit-animation:verdocs-field-pulse 0.4s 1;animation:verdocs-field-pulse 0.4s 1}verdocs-field-initial verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-initial verdocs-button-panel[data-active],verdocs-field-initial verdocs-button-panel:hover{opacity:1}verdocs-field-initial verdocs-button-panel .icon svg{fill:#333333}verdocs-field-initial verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-initial .settings-icon{position:absolute;top:-3px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-initial .settings-icon svg{fill:#707ae5}verdocs-field-initial .settings-icon:hover{opacity:1}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}";
 
@@ -139,7 +139,7 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
             }, helpText: "initial fields capture the recipient's initials on a clause or page." })))))));
     }
     static get style() { return verdocsFieldInitialCss; }
-}, [0, "verdocs-field-initial", {
+}, [256, "verdocs-field-initial", {
         "source": [513],
         "sourceid": [513],
         "fieldname": [513],
@@ -224,6 +224,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsFieldInitial as V, defineCustomElement as d };
-//# sourceMappingURL=p-Cbg7a3HQ.js.map
+//# sourceMappingURL=p-DepyvOoM.js.map
 
-//# sourceMappingURL=p-Cbg7a3HQ.js.map
+//# sourceMappingURL=p-DepyvOoM.js.map

package/dist/components/{p-Cbg7a3HQ.js.map → p-DepyvOoM.js.map}

@@ -1 +1 @@
-{"file":"p-Cbg7a3HQ.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/fields/verdocs-field-initial/verdocs-field-initial.scss?tag=verdocs-field-initial","src/components/fields/verdocs-field-initial/verdocs-field-initial.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-initial {\n  font-family: $verdocs-primary-font;\n  width: 83px;\n  height: 36px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  letter-spacing: 0.3px;\n  scroll-margin: 20px 0;\n  background-color: transparent;\n  transform-origin: bottom left;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n\n  label {\n    top: -14px;\n    left: -1px;\n    height: 14px;\n    color: white;\n    padding: 0 4px;\n    font-size: 9px;\n    line-height: 13px;\n    position: absolute;\n    background: #4a4a99;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n  }\n\n  &.done {\n    border: none;\n    opacity: 1;\n  }\n\n  img {\n    display: block;\n    max-width: 100%;\n    max-height: 100%;\n  }\n\n  &.disabled img {\n    opacity: 0.5;\n  }\n\n  button {\n    // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n    cursor: inherit;\n\n    box-sizing: border-box;\n    border: none;\n    color: rgba(0, 0, 0, 0.87);\n    font-weight: 500;\n    transform-origin: 0 0;\n    height: 100%;\n    width: 100%;\n    background: none;\n    font-size: 11px;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid $verdocs-red-1;\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  verdocs-button-panel {\n    top: -3px;\n    left: -2px;\n    opacity: 0.5;\n    z-index: 1000;\n    cursor: pointer;\n    position: absolute;\n    transform: scale(0.6);\n\n    &[data-active],\n    &:hover {\n      opacity: 1;\n    }\n\n    .icon {\n      svg {\n        fill: #333333;\n      }\n\n      &:hover {\n        svg {\n          fill: #000000;\n        }\n      }\n    }\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n\n@keyframes verdocs-field-pulse {\n  0% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n  50% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n}\n","import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, Event, EventEmitter, h, Host, Method, Prop, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays an initial field. If an initial already exists, it will be displayed and the field\n * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will\n * show a dialog to adopt an initial.\n *\n * NOTE: When initial fields are completed they will be filled with an initial \"stamp\".\n * This requires operation against a live, valid envelope. If you are testing this component\n * in Storybook, it will not be visible here.\n */\n@Component({\n  tag: 'verdocs-field-initial',\n  styleUrl: 'verdocs-field-initial.scss',\n  shadow: false,\n})\nexport class VerdocsFieldInitial {\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop({reflect: true}) initials: string = '';\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop({reflect: true}) pagenumber?: number = 1;\n\n  /**\n   * Event emitted when an initial block is adopted by the user. The event detail will contain the base64 string of the initial image.\n   */\n  @Event({composed: true}) adopt: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: EventEmitter;\n\n  /**\n   * Event fired when the input field value changes. Note that this will only be fired on blur, tab-out, ENTER key press, etc.\n   * It is generally the best event to subscribe to than `input` for most cases EXCEPT autocomplete fields that need to see every\n   * keypress.\n   */\n  @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) settingsPress: EventEmitter;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n  @State() focused?: boolean = false;\n\n  @Method() async focusField() {\n    this.handleShow();\n  }\n\n  @State()\n  tempInitials: string = '';\n\n  private dialog?: any;\n\n  hideDialog() {\n    this.dialog?.remove();\n    this.dialog = null;\n    this.focused = false;\n  }\n\n  handleAdopt(e: any) {\n    console.log('[INITIAL] Adopted initials');\n    this.tempInitials = e.detail;\n    this.fieldChange?.emit(this.tempInitials);\n    this.hideDialog();\n  }\n\n  handleShow() {\n    this.dialog = document.createElement('verdocs-initial-dialog');\n    this.dialog.setAttribute('initials', this.initials);\n    // this.dialog.setAttribute('roleindex', this.roleindex);\n    this.dialog.addEventListener('exit', () => this.hideDialog());\n    this.dialog.addEventListener('next', (e: any) => this.handleAdopt(e));\n    document.body.append(this.dialog);\n    this.focused = true;\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const {required = false, value = '', label = '', settings = {}} = field || {};\n    const backgroundColor = getRGBA(index);\n    const {base64} = settings;\n\n    if (done) {\n      return <Host class={{done}}>{value && <img src={value} alt=\"Initial\" />}</Host>;\n    }\n\n    return (\n      <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n        {label && <label>{label}</label>}\n\n        {base64 ? <img src={base64} alt=\"Initial\" /> : <button onClick={() => !disabled && this.handleShow()}>Initial</button>}\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={fieldname}\n                  onClose={() => (this.showingProperties = false)}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: field.name});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={\"initial fields capture the recipient's initials on a clause or page.\"}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DepyvOoM.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/fields/verdocs-field-initial/verdocs-field-initial.scss?tag=verdocs-field-initial","src/components/fields/verdocs-field-initial/verdocs-field-initial.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-initial {\n  font-family: $verdocs-primary-font;\n  width: 83px;\n  height: 36px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  letter-spacing: 0.3px;\n  scroll-margin: 20px 0;\n  background-color: transparent;\n  transform-origin: bottom left;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n\n  label {\n    top: -14px;\n    left: -1px;\n    height: 14px;\n    color: white;\n    padding: 0 4px;\n    font-size: 9px;\n    line-height: 13px;\n    position: absolute;\n    background: #4a4a99;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n  }\n\n  &.done {\n    border: none;\n    opacity: 1;\n  }\n\n  img {\n    display: block;\n    max-width: 100%;\n    max-height: 100%;\n  }\n\n  &.disabled img {\n    opacity: 0.5;\n  }\n\n  button {\n    // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n    cursor: inherit;\n\n    box-sizing: border-box;\n    border: none;\n    color: rgba(0, 0, 0, 0.87);\n    font-weight: 500;\n    transform-origin: 0 0;\n    height: 100%;\n    width: 100%;\n    background: none;\n    font-size: 11px;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid $verdocs-red-1;\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  verdocs-button-panel {\n    top: -3px;\n    left: -2px;\n    opacity: 0.5;\n    z-index: 1000;\n    cursor: pointer;\n    position: absolute;\n    transform: scale(0.6);\n\n    &[data-active],\n    &:hover {\n      opacity: 1;\n    }\n\n    .icon {\n      svg {\n        fill: #333333;\n      }\n\n      &:hover {\n        svg {\n          fill: #000000;\n        }\n      }\n    }\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n\n@keyframes verdocs-field-pulse {\n  0% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n  50% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n}\n","import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, Event, EventEmitter, h, Host, Method, Prop, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays an initial field. If an initial already exists, it will be displayed and the field\n * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will\n * show a dialog to adopt an initial.\n *\n * NOTE: When initial fields are completed they will be filled with an initial \"stamp\".\n * This requires operation against a live, valid envelope. If you are testing this component\n * in Storybook, it will not be visible here.\n */\n@Component({\n  tag: 'verdocs-field-initial',\n  styleUrl: 'verdocs-field-initial.scss',\n  shadow: false,\n})\nexport class VerdocsFieldInitial {\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop({reflect: true}) initials: string = '';\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop({reflect: true}) pagenumber?: number = 1;\n\n  /**\n   * Event emitted when an initial block is adopted by the user. The event detail will contain the base64 string of the initial image.\n   */\n  @Event({composed: true}) adopt: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: EventEmitter;\n\n  /**\n   * Event fired when the input field value changes. Note that this will only be fired on blur, tab-out, ENTER key press, etc.\n   * It is generally the best event to subscribe to than `input` for most cases EXCEPT autocomplete fields that need to see every\n   * keypress.\n   */\n  @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) settingsPress: EventEmitter;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n  @State() focused?: boolean = false;\n\n  @Method() async focusField() {\n    this.handleShow();\n  }\n\n  @State()\n  tempInitials: string = '';\n\n  private dialog?: any;\n\n  hideDialog() {\n    this.dialog?.remove();\n    this.dialog = null;\n    this.focused = false;\n  }\n\n  handleAdopt(e: any) {\n    console.log('[INITIAL] Adopted initials');\n    this.tempInitials = e.detail;\n    this.fieldChange?.emit(this.tempInitials);\n    this.hideDialog();\n  }\n\n  handleShow() {\n    this.dialog = document.createElement('verdocs-initial-dialog');\n    this.dialog.setAttribute('initials', this.initials);\n    // this.dialog.setAttribute('roleindex', this.roleindex);\n    this.dialog.addEventListener('exit', () => this.hideDialog());\n    this.dialog.addEventListener('next', (e: any) => this.handleAdopt(e));\n    document.body.append(this.dialog);\n    this.focused = true;\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const {required = false, value = '', label = '', settings = {}} = field || {};\n    const backgroundColor = getRGBA(index);\n    const {base64} = settings;\n\n    if (done) {\n      return <Host class={{done}}>{value && <img src={value} alt=\"Initial\" />}</Host>;\n    }\n\n    return (\n      <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n        {label && <label>{label}</label>}\n\n        {base64 ? <img src={base64} alt=\"Initial\" /> : <button onClick={() => !disabled && this.handleShow()}>Initial</button>}\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={fieldname}\n                  onClose={() => (this.showingProperties = false)}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: field.name});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={\"initial fields capture the recipient's initials on a clause or page.\"}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-BRC3PsLk.js → p-DkUmJk0T.js}

@@ -1,15 +1,15 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-cuwa7Els.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-D16h8pzh.js';
 import { VerdocsEndpoint, getTemplate, updateTemplate } from '@verdocs/js-sdk';
 import { V as VerdocsToast } from './p-CyvDgtoV.js';
 import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$7 } from './p-_nUQ5iEk.js';
-import { d as defineCustomElement$6 } from './p-Dt-0j6pv.js';
-import { d as defineCustomElement$5 } from './p-IhdX5vVL.js';
-import { d as defineCustomElement$4 } from './p-Cexe1-Oo.js';
-import { d as defineCustomElement$3 } from './p-dDTMckyL.js';
-import { d as defineCustomElement$2 } from './p-b88NoejR.js';
-import { d as defineCustomElement$1 } from './p-BDmKp20X.js';
+import { d as defineCustomElement$7 } from './p-BNrp2UP2.js';
+import { d as defineCustomElement$6 } from './p-DsCKNQPC.js';
+import { d as defineCustomElement$5 } from './p-BGZ_owBm.js';
+import { d as defineCustomElement$4 } from './p-Bv-L0hsU.js';
+import { d as defineCustomElement$3 } from './p-Cy-AXBKH.js';
+import { d as defineCustomElement$2 } from './p-DonwyCOM.js';
+import { d as defineCustomElement$1 } from './p-C_SISdpZ.js';
 
 const verdocsTemplateSettingsCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-template-settings{display:block;max-width:600px;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-template-settings>form{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff;padding:12px}verdocs-template-settings>form h5{font-size:16px;font-weight:bold;color:#46497d;margin:0 0 10px 0}verdocs-template-settings>form label{display:block;font-size:14px;font-weight:500;margin:0 0 4px 0;color:#5c6575}verdocs-template-settings>form input{border:none;font-size:18px;padding:3px 6px 3px 0;background:transparent;border-bottom:1px solid #33364b}verdocs-template-settings>form input:focus{outline:none}verdocs-template-settings>form .row{margin:20px 0 0 0}verdocs-template-settings .buttons{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:16px;-ms-flex-direction:row;flex-direction:row}verdocs-template-settings ::-webkit-input-placeholder{color:#aaaaaa}verdocs-template-settings ::-moz-placeholder{color:#aaaaaa}verdocs-template-settings :-ms-input-placeholder{color:#aaaaaa}verdocs-template-settings ::-ms-input-placeholder{color:#aaaaaa}verdocs-template-settings ::placeholder{color:#aaaaaa}";
 
@@ -150,7 +150,7 @@ const VerdocsTemplateSettings = /*@__PURE__*/ proxyCustomElement(class VerdocsTe
     }
     get el() { return this; }
     static get style() { return verdocsTemplateSettingsCss; }
-}, [0, "verdocs-template-settings", {
+}, [256, "verdocs-template-settings", {
         "endpoint": [16],
         "templateId": [1, "template-id"],
         "name": [32],
@@ -213,6 +213,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsTemplateSettings as V, defineCustomElement as d };
-//# sourceMappingURL=p-BRC3PsLk.js.map
+//# sourceMappingURL=p-DkUmJk0T.js.map
 
-//# sourceMappingURL=p-BRC3PsLk.js.map
+//# sourceMappingURL=p-DkUmJk0T.js.map

package/dist/components/{p-BRC3PsLk.js.map → p-DkUmJk0T.js.map}

@@ -1 +1 @@
-{"file":"p-BRC3PsLk.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/templates/verdocs-template-settings/verdocs-template-settings.scss?tag=verdocs-template-settings","src/components/templates/verdocs-template-settings/verdocs-template-settings.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-settings {\n  display: block;\n  max-width: 600px;\n  font-family: $verdocs-primary-font;\n\n  > form {\n    display: flex;\n    flex-direction: column;\n    background-color: $verdocs-grey-4;\n\n    // The extra right padding helps ensure when dragged elements move to absolute positioning\n    padding: 12px;\n\n    h5 {\n      font-size: 16px;\n      font-weight: bold;\n      color: $verdocs-grey-blue;\n      margin: 0 0 10px 0;\n    }\n\n    label {\n      display: block;\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0 0 4px 0;\n      color: $verdocs-bg-4;\n    }\n\n    input {\n      border: none;\n      font-size: 18px;\n      padding: 3px 6px 3px 0;\n      background: transparent;\n      border-bottom: 1px solid $verdocs-dark-blue;\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    .row {\n      margin: 20px 0 0 0;\n    }\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 8px;\n    margin-top: 16px;\n    flex-direction: row;\n  }\n\n  ::placeholder {\n    color: $verdocs-bg-2;\n  }\n}\n","import {Component, h, Element, Event, EventEmitter, Host, Prop, State} from '@stencil/core';\nimport {getTemplate, ITemplate, TTemplateSender, TTemplateVisibility, updateTemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {VerdocsToast} from '../../../utils/Toast';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nconst MS_PER_DAY = 24 * 60 * 60 * 1000;\n\n/**\n * Display an edit form that allows the user to adjust a template's roles and workflow.\n */\n@Component({\n  tag: 'verdocs-template-settings',\n  styleUrl: 'verdocs-template-settings.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateSettings {\n  private templateListenerId = null;\n\n  @Element()\n  el: HTMLElement;\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 template ID to edit.\n   */\n  @Prop() templateId: string = '';\n\n  /**\n   * Event fired when the user clicks to proceed.\n   */\n  @Event({composed: true}) next: EventEmitter;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: 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  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  @State() name: string | null = null;\n  @State() visibility: TTemplateVisibility = 'private';\n  @State() sender: TTemplateSender = 'envelope_creator';\n  @State() sendReminders = false;\n  @State() initialReminder = 0;\n  @State() followupReminders = 0;\n  @State() dirty = false;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  disconnectedCallback() {\n    this.unlistenToTemplate();\n  }\n\n  async listenToTemplate() {\n    console.log('[SETTINGS] Loading template', this.templateId);\n    this.unlistenToTemplate();\n    Store.subscribe(\n      'templates',\n      this.templateId,\n      () => getTemplate(this.endpoint, this.templateId),\n      false,\n      (template: ITemplate) => {\n        console.log('[SETTINGS] Template Updated', template);\n        this.template = template;\n        this.name = template.name;\n        this.visibility = template.visibility;\n        this.sender = template.sender;\n        this.sendReminders = template.initial_reminder !== null;\n        this.initialReminder = template.initial_reminder ? Math.floor(template.initial_reminder / MS_PER_DAY) : null;\n        this.followupReminders = template.followup_reminders ? Math.floor(template.followup_reminders / MS_PER_DAY) : null;\n        this.dirty = false;\n        this.loading = false;\n      },\n    );\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n\n      if (!this.templateId) {\n        console.log(`[SETTINGS] Missing required template ID ${this.templateId}`);\n        return;\n      }\n\n      if (!this.endpoint.session) {\n        console.log('[SETTINGS] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      this.listenToTemplate();\n    } catch (e) {\n      console.log('[SETTINGS] Error with preview session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  handleCancel() {\n    this.exit?.emit();\n  }\n\n  handleSubmit() {\n    updateTemplate(this.endpoint, this.templateId, {\n      name: this.name,\n      visibility: this.visibility,\n      sender: this.sender,\n      initial_reminder: this.sendReminders ? this.initialReminder * MS_PER_DAY : null,\n      followup_reminders: this.sendReminders ? this.followupReminders * MS_PER_DAY : null,\n    })\n      .then(template => {\n        console.log('[SETTINGS] Template Updated', template);\n        this.dirty = false;\n        this.name = template.name;\n        this.visibility = template.visibility;\n        this.sender = template.sender;\n        this.sendReminders = template.initial_reminder !== null;\n        this.initialReminder = template.initial_reminder ? Math.floor(template.initial_reminder / MS_PER_DAY) : null;\n        this.followupReminders = template.followup_reminders ? Math.floor(template.followup_reminders / MS_PER_DAY) : null;\n        this.templateUpdated?.emit({endpoint: this.endpoint, template, event: 'update'});\n        this.next?.emit();\n      })\n      .catch(e => {\n        console.log('[SETTINGS] Error updating template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n        VerdocsToast(e.response?.data?.error || 'Error updating template, please try again later.');\n      });\n  }\n\n  render() {\n    if (!this.endpoint.session) {\n      return (\n        <Host>\n          <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n        </Host>\n      );\n    }\n\n    if (this.loading || !this.template) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n          <h5>Settings</h5>\n\n          <div class=\"row\">\n            <verdocs-text-input\n              id=\"verdocs-field-name\"\n              label=\"Template Name\"\n              value={this.name}\n              autocomplete=\"off\"\n              placeholder=\"Template Name...\"\n              onInput={(e: any) => {\n                this.name = e.target.value;\n                this.dirty = true;\n              }}\n            />\n          </div>\n\n          <div class=\"row\">\n            <verdocs-select-input\n              label=\"Visibility\"\n              value={this.visibility}\n              onInput={(e: any) => {\n                this.visibility = e.target.value;\n                this.dirty = true;\n              }}\n              options={[\n                {value: 'private', label: 'Private'},\n                {value: 'shared', label: 'Shared'},\n                {value: 'public', label: 'Public'},\n              ]}\n            />\n          </div>\n\n          <div class=\"row\">\n            <verdocs-select-input\n              label=\"Owner for envelopes created from this template\"\n              value={this.sender}\n              onInput={(e: any) => {\n                this.sender = e.target.value;\n                this.dirty = true;\n              }}\n              options={[\n                {value: 'envelope_creator', label: 'Envelope Creator'},\n                {value: 'template_owner', label: 'Template Owner'},\n              ]}\n            />\n          </div>\n\n          <div class=\"row\">\n            <label>Send Reminders</label>\n            <verdocs-switch checked={this.sendReminders} onCheckedChange={e => (this.sendReminders = e.detail)} />\n          </div>\n\n          {this.sendReminders && (\n            <div class=\"row\">\n              <verdocs-text-input\n                id=\"verdocs-field-name\"\n                label=\"First Reminder (days)\"\n                value={String(this.initialReminder || 0)}\n                autocomplete=\"off\"\n                placeholder=\"Delay in days...\"\n                onInput={(e: any) => {\n                  this.initialReminder = +e.target.value;\n                  this.dirty = true;\n                }}\n              />\n            </div>\n          )}\n\n          {this.sendReminders && (\n            <div class=\"row\">\n              <verdocs-text-input\n                id=\"verdocs-field-name\"\n                label=\"Follow-up Reminders (days)\"\n                value={String(this.followupReminders || 0)}\n                autocomplete=\"off\"\n                placeholder=\"Delay in days...\"\n                onInput={(e: any) => {\n                  this.followupReminders = +e.target.value;\n                  this.dirty = true;\n                }}\n              />\n            </div>\n          )}\n\n          <div class=\"buttons\">\n            <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={() => this.handleCancel()} />\n            <verdocs-button label=\"Save\" size=\"small\" onClick={() => this.handleSubmit()} disabled={!this.dirty} />\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-DkUmJk0T.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/templates/verdocs-template-settings/verdocs-template-settings.scss?tag=verdocs-template-settings","src/components/templates/verdocs-template-settings/verdocs-template-settings.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-settings {\n  display: block;\n  max-width: 600px;\n  font-family: $verdocs-primary-font;\n\n  > form {\n    display: flex;\n    flex-direction: column;\n    background-color: $verdocs-grey-4;\n\n    // The extra right padding helps ensure when dragged elements move to absolute positioning\n    padding: 12px;\n\n    h5 {\n      font-size: 16px;\n      font-weight: bold;\n      color: $verdocs-grey-blue;\n      margin: 0 0 10px 0;\n    }\n\n    label {\n      display: block;\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0 0 4px 0;\n      color: $verdocs-bg-4;\n    }\n\n    input {\n      border: none;\n      font-size: 18px;\n      padding: 3px 6px 3px 0;\n      background: transparent;\n      border-bottom: 1px solid $verdocs-dark-blue;\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    .row {\n      margin: 20px 0 0 0;\n    }\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 8px;\n    margin-top: 16px;\n    flex-direction: row;\n  }\n\n  ::placeholder {\n    color: $verdocs-bg-2;\n  }\n}\n","import {Component, h, Element, Event, EventEmitter, Host, Prop, State} from '@stencil/core';\nimport {getTemplate, ITemplate, TTemplateSender, TTemplateVisibility, updateTemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {VerdocsToast} from '../../../utils/Toast';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nconst MS_PER_DAY = 24 * 60 * 60 * 1000;\n\n/**\n * Display an edit form that allows the user to adjust a template's roles and workflow.\n */\n@Component({\n  tag: 'verdocs-template-settings',\n  styleUrl: 'verdocs-template-settings.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateSettings {\n  private templateListenerId = null;\n\n  @Element()\n  el: HTMLElement;\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 template ID to edit.\n   */\n  @Prop() templateId: string = '';\n\n  /**\n   * Event fired when the user clicks to proceed.\n   */\n  @Event({composed: true}) next: EventEmitter;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: 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  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  @State() name: string | null = null;\n  @State() visibility: TTemplateVisibility = 'private';\n  @State() sender: TTemplateSender = 'envelope_creator';\n  @State() sendReminders = false;\n  @State() initialReminder = 0;\n  @State() followupReminders = 0;\n  @State() dirty = false;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  disconnectedCallback() {\n    this.unlistenToTemplate();\n  }\n\n  async listenToTemplate() {\n    console.log('[SETTINGS] Loading template', this.templateId);\n    this.unlistenToTemplate();\n    Store.subscribe(\n      'templates',\n      this.templateId,\n      () => getTemplate(this.endpoint, this.templateId),\n      false,\n      (template: ITemplate) => {\n        console.log('[SETTINGS] Template Updated', template);\n        this.template = template;\n        this.name = template.name;\n        this.visibility = template.visibility;\n        this.sender = template.sender;\n        this.sendReminders = template.initial_reminder !== null;\n        this.initialReminder = template.initial_reminder ? Math.floor(template.initial_reminder / MS_PER_DAY) : null;\n        this.followupReminders = template.followup_reminders ? Math.floor(template.followup_reminders / MS_PER_DAY) : null;\n        this.dirty = false;\n        this.loading = false;\n      },\n    );\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n\n      if (!this.templateId) {\n        console.log(`[SETTINGS] Missing required template ID ${this.templateId}`);\n        return;\n      }\n\n      if (!this.endpoint.session) {\n        console.log('[SETTINGS] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      this.listenToTemplate();\n    } catch (e) {\n      console.log('[SETTINGS] Error with preview session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  handleCancel() {\n    this.exit?.emit();\n  }\n\n  handleSubmit() {\n    updateTemplate(this.endpoint, this.templateId, {\n      name: this.name,\n      visibility: this.visibility,\n      sender: this.sender,\n      initial_reminder: this.sendReminders ? this.initialReminder * MS_PER_DAY : null,\n      followup_reminders: this.sendReminders ? this.followupReminders * MS_PER_DAY : null,\n    })\n      .then(template => {\n        console.log('[SETTINGS] Template Updated', template);\n        this.dirty = false;\n        this.name = template.name;\n        this.visibility = template.visibility;\n        this.sender = template.sender;\n        this.sendReminders = template.initial_reminder !== null;\n        this.initialReminder = template.initial_reminder ? Math.floor(template.initial_reminder / MS_PER_DAY) : null;\n        this.followupReminders = template.followup_reminders ? Math.floor(template.followup_reminders / MS_PER_DAY) : null;\n        this.templateUpdated?.emit({endpoint: this.endpoint, template, event: 'update'});\n        this.next?.emit();\n      })\n      .catch(e => {\n        console.log('[SETTINGS] Error updating template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n        VerdocsToast(e.response?.data?.error || 'Error updating template, please try again later.');\n      });\n  }\n\n  render() {\n    if (!this.endpoint.session) {\n      return (\n        <Host>\n          <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n        </Host>\n      );\n    }\n\n    if (this.loading || !this.template) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n          <h5>Settings</h5>\n\n          <div class=\"row\">\n            <verdocs-text-input\n              id=\"verdocs-field-name\"\n              label=\"Template Name\"\n              value={this.name}\n              autocomplete=\"off\"\n              placeholder=\"Template Name...\"\n              onInput={(e: any) => {\n                this.name = e.target.value;\n                this.dirty = true;\n              }}\n            />\n          </div>\n\n          <div class=\"row\">\n            <verdocs-select-input\n              label=\"Visibility\"\n              value={this.visibility}\n              onInput={(e: any) => {\n                this.visibility = e.target.value;\n                this.dirty = true;\n              }}\n              options={[\n                {value: 'private', label: 'Private'},\n                {value: 'shared', label: 'Shared'},\n                {value: 'public', label: 'Public'},\n              ]}\n            />\n          </div>\n\n          <div class=\"row\">\n            <verdocs-select-input\n              label=\"Owner for envelopes created from this template\"\n              value={this.sender}\n              onInput={(e: any) => {\n                this.sender = e.target.value;\n                this.dirty = true;\n              }}\n              options={[\n                {value: 'envelope_creator', label: 'Envelope Creator'},\n                {value: 'template_owner', label: 'Template Owner'},\n              ]}\n            />\n          </div>\n\n          <div class=\"row\">\n            <label>Send Reminders</label>\n            <verdocs-switch checked={this.sendReminders} onCheckedChange={e => (this.sendReminders = e.detail)} />\n          </div>\n\n          {this.sendReminders && (\n            <div class=\"row\">\n              <verdocs-text-input\n                id=\"verdocs-field-name\"\n                label=\"First Reminder (days)\"\n                value={String(this.initialReminder || 0)}\n                autocomplete=\"off\"\n                placeholder=\"Delay in days...\"\n                onInput={(e: any) => {\n                  this.initialReminder = +e.target.value;\n                  this.dirty = true;\n                }}\n              />\n            </div>\n          )}\n\n          {this.sendReminders && (\n            <div class=\"row\">\n              <verdocs-text-input\n                id=\"verdocs-field-name\"\n                label=\"Follow-up Reminders (days)\"\n                value={String(this.followupReminders || 0)}\n                autocomplete=\"off\"\n                placeholder=\"Delay in days...\"\n                onInput={(e: any) => {\n                  this.followupReminders = +e.target.value;\n                  this.dirty = true;\n                }}\n              />\n            </div>\n          )}\n\n          <div class=\"buttons\">\n            <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={() => this.handleCancel()} />\n            <verdocs-button label=\"Save\" size=\"small\" onClick={() => this.handleSubmit()} disabled={!this.dirty} />\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"version":3}