@verdocs/web-sdk 5.0.13 → 5.0.14

package/dist/cjs/verdocs-table.cjs.entry.js

@@ -26,3 +26,5 @@ const VerdocsTable = class {
 VerdocsTable.style = VerdocsTableStyle0;
 
 exports.verdocs_table = VerdocsTable;
+
+//# sourceMappingURL=verdocs-table.cjs.entry.js.map

package/dist/cjs/verdocs-table.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-table.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,+yBAA+yB,CAAC;AACx0B,2BAAe,eAAe;;MCoBjB,YAAY;;;;;uBAIM,EAAE;oBAKT,EAAE;;IAYxB,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,KAAK,EAAC,eAAe,IACzBD,oEAAO,KAAK,EAAC,OAAO,IAClBA,sEACEA,iEAAI,KAAK,EAAC,gBAAgB,IACvB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;YACvB,QACEA,gBACE,KAAK,EAAE,sBAAsB,CAAC,QAAQ,GAAG,CAAC,EAAE,EAAE,EAC9C,OAAO,EAAE,gBAAM,OAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,IAAI,CAAC,EAAC,GAAG,EAAC,CAAC,CAAA,EAAA,EAC/C,SAAS,EAAE,GAAG,CAAC,YAAY,GAAG,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,GAC1E,EACF;SACH,CAAC,CACC,CACC,EAERA,sEACG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,KAChBA,gBAAI,KAAK,EAAC,cAAc,EAAC,OAAO,EAAE,gBAAM,OAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,IAAI,CAAC,EAAC,GAAG,EAAC,CAAC,CAAA,EAAA,IAC/D,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;YACvB,OAAO,GAAG,CAAC,UAAU,IACnBA,gBAAI,KAAK,EAAE,oBAAoB,CAAC,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,GAAG,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,GAAI,KAEzFA,gBAAI,KAAK,EAAE,oBAAoB,CAAC,QAAQ,GAAG,CAAC,EAAE,EAAE,IAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAM,CACrE,CAAC;SACH,CAAC,CACC,CACN,CAAC,CACI,CACF,CACH,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/controls/verdocs-table/verdocs-table.scss?tag=verdocs-table","src/components/controls/verdocs-table/verdocs-table.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-table {\n  width: 100%;\n  display: block;\n  margin: 0 0 10px 0;\n  box-sizing: border-box;\n  font-family: $primary-font;\n\n  .table-wrapper {\n    margin: 10px 0;\n    padding: 0;\n  }\n\n  .table {\n    width: 100%;\n    border: none;\n    border-collapse: collapse;\n  }\n\n  .row {\n    &.header-row {\n    }\n\n    &.data-row {\n      border: 1px solid #d4d4d8;\n      background-color: #ffffff;\n    }\n  }\n\n  .header-col {\n    color: #5c6575;\n    font-weight: 600;\n    text-align: left;\n    padding: 8px 16px;\n  }\n\n  .data-col {\n    font-weight: 400;\n    padding: 8px 16px;\n  }\n}\n","import {Component, Prop, Host, h, Event, EventEmitter} from '@stencil/core';\n\nexport interface IColumn {\n  id: string;\n  header?: string;\n  renderHeader?: (col: IColumn) => any;\n  renderCell?: (col: IColumn, row: any) => any;\n}\n\n/**\n * Display a simple table of data. Columns and data cells may have custom renderers defined to\n * support creating interactive table layouts.\n *\n * ```ts\n * <verdocs-table columns={[...columns]} data={[...data]} />\n * ```\n */\n@Component({\n  tag: 'verdocs-table',\n  styleUrl: 'verdocs-table.scss',\n})\nexport class VerdocsTable {\n  /**\n   * The columns to display\n   */\n  @Prop() columns: IColumn[] = [];\n\n  /**\n   * The rows to display\n   */\n  @Prop() data: any[] = [];\n\n  /**\n   * Event fired when the user clicks a column header. This may be used to manage sorting options.\n   */\n  @Event({composed: true}) colHeaderClick: EventEmitter<{col: IColumn}>;\n\n  /**\n   * Event fired when the user clicks a row.\n   */\n  @Event({composed: true}) rowClick: EventEmitter<{row: any}>;\n\n  render() {\n    return (\n      <Host class=\"table-wrapper\">\n        <table class=\"table\">\n          <thead>\n            <tr class=\"row header-row\">\n              {this.columns.map((col, i) => {\n                return (\n                  <th\n                    class={`col header-col col-${i} col-${col.id}`}\n                    onClick={() => this.colHeaderClick?.emit({col})}\n                    innerHTML={col.renderHeader ? col.renderHeader(col) : col.header || col.id}\n                  />\n                );\n              })}\n            </tr>\n          </thead>\n\n          <tbody>\n            {this.data.map(row => (\n              <tr class=\"row data-row\" onClick={() => this.rowClick?.emit({row})}>\n                {this.columns.map((col, i) => {\n                  return col.renderCell ? (\n                    <td class={`col data-col col-${i} col-${col.id}`} innerHTML={col.renderCell(col, row)} />\n                  ) : (\n                    <td class={`col data-col col-${i} col-${col.id}`}>{row[col.id]}</td>\n                  );\n                })}\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-template-card.cjs.entry.js

@@ -24,3 +24,5 @@ const VerdocsTemplateCard = class {
 VerdocsTemplateCard.style = VerdocsTemplateCardStyle0;
 
 exports.verdocs_template_card = VerdocsTemplateCard;
+
+//# sourceMappingURL=verdocs-template-card.cjs.entry.js.map

package/dist/cjs/verdocs-template-card.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-template-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,sBAAsB,GAAG,8wDAA8wD,CAAC;AAC9yD,kCAAe,sBAAsB;;ACErC,MAAM,WAAW,GAAG,kTAAkT,CAAC;AAEvU,MAAM,SAAS,GAAG,oRAAoR,CAAC;AAEvS,MAAM,SAAS,GAAG,qSAAqS,CAAC;AAExT,MAAM,QAAQ,GAAG,woEAAwoE,CAAC;MAU7oE,mBAAmB;;;;;IAM9B,MAAM;;QACJ,QACEA,QAACC,UAAI,uDAIHD,mEAAM,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAQ,EAC9CA,mEAAM,KAAK,EAAC,UAAU,IAAE,CAAA,MAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,0CAAE,IAAI,KAAI,QAAQ,CAAQ,EAE5EA,kEAAM,EAENA,kEAAK,KAAK,EAAC,UAAU,IACnBA,kEAAK,KAAK,EAAC,SAAS,IAClBA,mEAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,GAAI,EAC1CA,mEAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAQ,CACnD,EAENA,kEAAK,KAAK,EAAC,mBAAmB,IAC5BA,mEAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,GAAI,EAC3CA,mEAAM,KAAK,EAAC,OAAO,IAAE,CAAA,MAAA,MAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,SAAS,0CAAG,CAAC,CAAC,0CAAE,KAAK,KAAI,CAAC,CAAQ,CAClE,EAENA,kEAAK,KAAK,EAAC,mBAAmB,IAC5BA,mEAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,GAAI,EAC3CA,mEAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAQ,CAC9C,EAENA,mEAAM,KAAK,EAAC,qBAAqB,EAAC,SAAS,EAAE,WAAW,GAAI,CACxD,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/templates/verdocs-template-card/verdocs-template-card.scss?tag=verdocs-template-card","src/components/templates/verdocs-template-card/verdocs-template-card.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-card {\n  font-family: $primary-font;\n  width: 320px;\n  height: 320px;\n  display: flex;\n  padding: 25px;\n  flex-wrap: nowrap;\n  box-sizing: border-box;\n  flex-direction: column;\n  background-color: $verdocs-grey-4;\n  box-shadow: 2px 2px 5px rgba(51, 54, 75, 0.05);\n\n  .thumbnail {\n    width: 272px;\n    height: 158px;\n    object-fit: cover;\n    margin-bottom: 22px;\n    object-position: -20% 0;\n  }\n\n  .name {\n    font-size: 18px;\n    font-weight: 700;\n    margin-bottom: 7px;\n  }\n\n  .org-name {\n    font-size: 14px;\n    font-weight: 700;\n    margin-bottom: 6px;\n  }\n\n  hr {\n    width: 100%;\n    margin-bottom: 17px;\n    background-color: $icon-color;\n  }\n\n  .controls {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: space-between;\n    text-align: center;\n    font-size: 16px;\n\n    .control {\n      flex: 1;\n      display: flex;\n      margin-right: 8px;\n      align-items: flex-start;\n      border-right: 1px solid $icon-color;\n\n      &.secondary {\n        justify-content: center;\n      }\n\n      svg {\n        fill: $icon-color;\n        height: 16px;\n        max-width: 16px;\n        margin: 0 8px -2px 0;\n      }\n    }\n  }\n\n  .additional-controls svg {\n    margin-right: 0;\n    fill: $verdocs-purple;\n  }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\nimport {ITemplate} from '@verdocs/js-sdk';\n\nconst ActionsIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"/></svg>`;\n\nconst EmailIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M22 6c0-1.1-.9-2-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6zm-2 0l-8 5-8-5h16zm0 12H4V8l8 5 8-5v10z\"/></svg>`;\n\nconst PagesIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4H8c-1.1 0-1.99.9-1.99 2L6 21c0 1.1.89 2 1.99 2H19c1.1 0 2-.9 2-2V11l-6-6zM8 21V7h6v5h5v9H8z\"/></svg>`;\n\nconst StarIcon = `<svg width=\"31\" height=\"29\" viewBox=\"0 0 31 29\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(#clip0_31553_1553)\"><path d=\"M30.886 11.4917C30.8916 11.0917 30.753 10.7034 30.4962 10.3993C30.2394 10.0953 29.882 9.8964 29.4908 9.83995L29.5182 9.65005L29.4908 9.83995L21.0938 8.60261L17.3412 0.912551C17.2067 0.638179 16.9992 0.407285 16.7421 0.245866C16.485 0.0844465 16.1885 -0.00111389 15.886 -0.00111389C15.5835 -0.00111389 15.287 0.0844465 15.0299 0.245866C14.7728 0.407285 14.5653 0.638179 14.4308 0.912551L10.6781 8.60261L2.28121 9.8392C1.89206 9.89475 1.53611 10.0916 1.2796 10.3931C1.02308 10.6945 0.88348 11.08 0.886776 11.4779C0.886447 11.6961 0.929977 11.912 1.01472 12.1125C1.09946 12.3131 1.22363 12.4941 1.37968 12.6445L7.45563 18.5744L6.01943 27.0241C6.00289 27.1258 5.99449 27.2287 5.99435 27.3317C5.99313 27.7717 6.16395 28.1943 6.4695 28.5071C6.77505 28.82 7.19045 28.9976 7.62496 29.0013C7.88846 29.0008 8.14779 28.9345 8.37992 28.8083L15.8883 24.8217L23.3967 28.8114C23.6287 28.9361 23.8873 29.0015 24.15 29.002C24.5752 28.9998 24.9832 28.8318 25.2893 28.5329C25.4452 28.3832 25.5695 28.2029 25.6544 28.003C25.7392 27.8031 25.783 27.5878 25.783 27.3702C25.7827 27.2731 25.7743 27.176 25.7579 27.0803L24.3209 18.6296L30.3931 12.7022C30.7094 12.3809 30.8867 11.9454 30.886 11.4917ZM22.0759 17.53L21.9437 17.3916L22.0759 17.53C22.0072 17.5977 21.9525 17.6787 21.9152 17.7681C21.8779 17.8575 21.8587 17.9536 21.8587 18.0506L21.8693 18.1737L23.2037 26.0237L16.2164 22.3148C16.1136 22.2602 15.9994 22.2317 15.8833 22.2317C15.7673 22.2317 15.653 22.2602 15.5503 22.3148L8.57132 26.0245L9.90651 18.1745L9.91712 18.0506C9.91696 17.9536 9.89768 17.8576 9.86038 17.7682C9.82308 17.6788 9.76851 17.5978 9.6999 17.53L4.05538 11.9724L11.8576 10.8258C11.9725 10.8088 12.0816 10.7638 12.1755 10.6947C12.2695 10.6256 12.3454 10.5344 12.3969 10.429L15.886 3.27721L19.3797 10.429C19.4313 10.5344 19.5074 10.6256 19.6014 10.6948C19.6955 10.7639 19.8047 10.8088 19.9197 10.8258L27.7197 11.9747L22.0759 17.53Z\" fill=\"#ADB6BD\"/></g><defs><clipPath id=\"clip0_31553_1553\"><rect width=\"30\" height=\"29\" fill=\"white\" transform=\"translate(0.886719)\"/></clipPath></defs></svg>`;\n\n/**\n * Displays a summary of a template\n */\n@Component({\n  tag: 'verdocs-template-card',\n  styleUrl: 'verdocs-template-card.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateCard {\n  /**\n   * The template for which the card will be rendered.\n   */\n  @Prop() template: ITemplate;\n\n  render() {\n    return (\n      <Host>\n        {/* TODO */}\n        {/*<img src={this.template?.documents?.thumbnail_url || ''} alt=\"Template Thumbnail\" class=\"thumbnail\" />*/}\n\n        <span class=\"name\">{this.template.name}</span>\n        <span class=\"org-name\">{this.template.organization?.name || 'Public'}</span>\n\n        <hr />\n\n        <div class=\"controls\">\n          <div class=\"control\">\n            <span class=\"icon\" innerHTML={StarIcon} />\n            <span class=\"value\">{this.template.star_counter}</span>\n          </div>\n\n          <div class=\"control secondary\">\n            <span class=\"icon\" innerHTML={PagesIcon} />\n            <span class=\"value\">{this.template?.documents?.[0]?.pages || 1}</span>\n          </div>\n\n          <div class=\"control secondary\">\n            <span class=\"icon\" innerHTML={EmailIcon} />\n            <span class=\"value\">{this.template.counter}</span>\n          </div>\n\n          <span class=\"additional-controls\" innerHTML={ActionsIcon} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-template-create.cjs.entry.js

@@ -106,3 +106,5 @@ const VerdocsTemplateCreate = class {
 VerdocsTemplateCreate.style = VerdocsTemplateCreateStyle0;
 
 exports.verdocs_template_create = VerdocsTemplateCreate;
+
+//# sourceMappingURL=verdocs-template-create.cjs.entry.js.map

package/dist/cjs/verdocs-template-create.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-template-create.entry.cjs.js","mappings":"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","names":["VerdocsEndpoint","createTemplate","SDKError","h","Host"],"sources":["src/components/templates/verdocs-template-create/verdocs-template-create.scss?tag=verdocs-template-create","src/components/templates/verdocs-template-create/verdocs-template-create.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-create {\n  font-family: $verdocs-primary-font;\n\n  form {\n    background-color: $verdocs-grey-4;\n    padding: 12px;\n    display: flex;\n    flex-direction: column;\n\n    .upload-box {\n      box-sizing: border-box;\n      width: 320px;\n      text-align: center;\n      padding: 44px 18px 66px;\n      border: 2px dashed #979797;\n      color: rgba(0, 0, 0, 0.54);\n\n      &.drag-over {\n        border: 2px solid $verdocs-deep-blue;\n      }\n\n      svg {\n        width: 64px;\n        fill: #5c6575;\n      }\n    }\n  }\n\n  p {\n    color: $verdocs-grey-1;\n    margin-top: 20px;\n    font-size: 18px;\n    font-weight: 500;\n    overflow-wrap: anywhere;\n\n    &.subscript {\n      color: $verdocs-bg-4;\n      font-size: 14px;\n      margin: 20px;\n    }\n  }\n\n  .loader-wrapper {\n    background-color: $verdocs-grey-4;\n    display: flex;\n    flex-direction: column;\n    box-sizing: border-box;\n    position: relative;\n    width: 320px;\n    height: 320px;\n    text-align: center;\n    border: 2px dashed #979797;\n    justify-content: flex-end;\n  }\n\n  .progress-wrapper {\n    padding: 20px;\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 8px;\n    margin-top: 16px;\n    align-items: center;\n    flex-direction: row;\n    justify-content: flex-end;\n\n    .flex-fill {\n      flex: 1;\n    }\n  }\n\n  ::placeholder {\n    color: $verdocs-bg-2;\n  }\n\n  .error {\n    margin: 20px 0;\n    color: $verdocs-red-1;\n  }\n}\n","import {createTemplate, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State, Host} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\n\nconst FileIcon =\n  '<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M6 2c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6H6zm7 7V3.5L18.5 9H13z\"></path></svg>';\n\n/**\n * Displays a file upload mechanism suitable for the first step of creating a template.\n * This is typically the first step in a template creation workflow.\n */\n@Component({\n  tag: 'verdocs-template-create',\n  styleUrl: 'verdocs-template-create.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateCreate {\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  @Prop({mutable: true})\n  maxSize: number = 20.5 * 1024 * 1024;\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 user changes the type.\n   */\n  @Event({composed: true}) next: EventEmitter<ITemplate>;\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 user updates the template.\n   */\n  @Event({composed: true}) templateCreated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; templateId: string}>;\n\n  @State() file: File | null;\n  @State() creating = false;\n  @State() progressLabel = 'Uploading...';\n  @State() progressPercent = 0;\n  @State() errorMessage = '';\n\n  componentWillLoad() {\n    this.endpoint.setTimeout(30000);\n    this.endpoint.loadSession();\n  }\n\n  handleFileChanged(e: any) {\n    this.errorMessage = '';\n    this.file = e.target.files?.[0] || null;\n    console.log('[CREATE] Selected file', this.file);\n\n    const totalSize = this.file.size;\n    if (totalSize > this.maxSize) {\n      this.errorMessage = 'Total file size must not exceed 20MB.';\n    }\n  }\n\n  handleUpload(e) {\n    e.stopPropagation();\n    const fileElem = document.getElementById('verdocs-template-create-file');\n    fileElem.click();\n  }\n\n  handleCancel(e) {\n    e.stopPropagation();\n    this.exit.emit();\n  }\n\n  async handleSubmit(e) {\n    e.stopPropagation();\n\n    // Should be true if we're here because onClick is only enabled then. We're just guarding this for Typescript.\n    if (!this.file) {\n      return;\n    }\n\n    this.creating = true;\n    this.progressLabel = 'Uploading...';\n\n    try {\n      const template = await createTemplate(\n        this.endpoint,\n        {\n          name: this.file.name,\n          // TODO: Make optional in the SDK\n          initial_reminder: 0,\n          followup_reminders: 0,\n          documents: [this.file],\n        },\n        percent => {\n          if (percent >= 99) {\n            this.progressLabel = 'Processing...';\n            this.progressPercent = 100;\n          } else {\n            this.progressPercent = percent;\n          }\n        },\n      );\n\n      console.log('[CREATE] Created template', template);\n      this.templateCreated?.emit({endpoint: this.endpoint, template, templateId: template.id});\n      this.next?.emit(template);\n      this.creating = false;\n      this.progressLabel = '';\n      this.progressPercent = 0;\n    } catch (e) {\n      console.log('[CREATE] Error creating template', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      this.creating = false;\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    return (\n      <Host>\n        <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n          <input\n            type=\"file\"\n            id=\"verdocs-template-create-file\"\n            multiple\n            accept=\".pdf,application/pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n            style={{display: 'none'}}\n            onChange={e => this.handleFileChanged(e)}\n          />\n\n          {this.creating ? (\n            <div class=\"loader-wrapper\">\n              <verdocs-loader />\n              {this.progressLabel && (\n                <div class=\"progress-wrapper\">\n                  <verdocs-progress-bar showPercent={true} percent={this.progressPercent} label={this.progressLabel} />\n                </div>\n              )}\n            </div>\n          ) : (\n            <div\n              class=\"upload-box\"\n              onDrop={(e: any) => {\n                e.preventDefault();\n                e.target.classList.remove('drag-over');\n                this.file = e.dataTransfer.files[0];\n\n                if (this.file.size > this.maxSize) {\n                  this.errorMessage = 'Total file size must not exceed 20MB.';\n                }\n              }}\n              onDragOver={(e: any) => {\n                e.preventDefault();\n                e.dataTransfer.dropEffect = 'copy';\n              }}\n              onDragEnter={(e: any) => e.target.classList.add('drag-over')}\n              onDragLeave={(e: any) => e.target.classList.remove('drag-over')}\n            >\n              <span innerHTML={FileIcon} style={{display: 'flex', justifyContent: 'center'}} />\n              <p>{this.file ? this.file.name : 'Drag and drop your files here'}</p>\n              <p class=\"subscript\">Supported files: PDF, Word</p>\n\n              <verdocs-button label={this.file ? 'Select a different file' : 'Select a file from your computer'} size=\"small\" onClick={e => this.handleUpload(e)} />\n            </div>\n          )}\n\n          {!!this.errorMessage && <div class=\"error\">{this.errorMessage}</div>}\n\n          <div class=\"buttons\">\n            <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={e => this.handleCancel(e)} disabled={this.creating} />\n            <verdocs-button label=\"Next\" size=\"small\" onClick={e => this.handleSubmit(e)} disabled={!this.file || this.creating || !!this.errorMessage} />\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js

@@ -219,3 +219,5 @@ VerdocsToolbarIcon.style = VerdocsToolbarIconStyle0;
 
 exports.verdocs_template_document_page = VerdocsTemplateDocumentPage;
 exports.verdocs_toolbar_icon = VerdocsToolbarIcon;
+
+//# sourceMappingURL=verdocs-template-document-page_2.cjs.entry.js.map

package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-template-document-page.verdocs-toolbar-icon.entry.cjs.js","mappings":"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","names":["VerdocsEndpoint","getTemplateDocumentPageDisplayUri","throttle","Store","getTemplate","h","Host","getFieldId","getControlStyles","Fragment","createPopper"],"sources":["src/components/templates/verdocs-template-document-page/verdocs-template-document-page.scss?tag=verdocs-template-document-page","src/components/templates/verdocs-template-document-page/verdocs-template-document-page.tsx","src/components/controls/verdocs-toolbar-icon/verdocs-toolbar-icon.scss?tag=verdocs-toolbar-icon","src/components/controls/verdocs-toolbar-icon/verdocs-toolbar-icon.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-document-page {\n  width: 100%;\n  position: relative;\n\n  .verdocs-template-document-page-layer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    box-shadow: 0 0 10px 5px #0000000f;\n\n    &.img {\n      width: 100%;\n    }\n  }\n\n  .placeholder {\n    opacity: 0.1;\n    width: 612px;\n    height: 792px;\n    box-shadow: 0 0 10px 5px #0000000f;\n  }\n}\n","// NOTE: This component does not have a story because it's not intended for external use.\n\nimport {getTemplate, getTemplateDocumentPageDisplayUri, type ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Element, Fragment} from '@stencil/core';\nimport {IDocumentPageInfo, IPageLayer} from '../../../utils/Types';\nimport {getControlStyles, getFieldId} from '../../../utils/utils';\nimport {throttle} from '../../../utils/utils';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Represents one document page. This is primarily a layout container used to coordinate positions of\n * page-related layers such as the page itself, signature fields, etc. It is not intended to be used\n * on its own as an individual component.\n */\n@Component({\n  tag: 'verdocs-template-document-page',\n  styleUrl: 'verdocs-template-document-page.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateDocumentPage {\n  private templateListenerId = null;\n  private resizeObserver: ResizeObserver;\n\n  @Element() container: HTMLElement;\n\n  /**\n   * The endpoint to load from.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * Whether the fields should be editable (Builder)\n   */\n  @Prop() editable = false;\n\n  /**\n   * Whether the fields should be disabled (Builder)\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Whether the field are interactable (done/submitted disables this)\n   */\n  @Prop() done = false;\n\n  /**\n   * The ID of the template the document is for.\n   */\n  @Prop() templateId: string = '';\n\n  /**\n   * The ID of the document to display.\n   */\n  @Prop() documentId: string = '';\n\n  /**\n   * The page number being rendered. (Reminder: page numbers are 1-based.)\n   */\n  @Prop() pageNumber: number = 1;\n\n  /**\n   * The \"virtual\" width of the page canvas. Defaults to 612 which at 72dpi is 8.5\" wide. This is used to compute\n   * the aspect ratio of the final rendered element when scaling up/down.\n   */\n  @Prop() virtualWidth: number = 612;\n\n  /**\n   * The \"virtual\" height of the page canvas.  Defaults to 792 which at 72dpi is 11\" tall. This is used to compute\n   * the aspect ratio of the final rendered element when scaling up/down.\n   */\n  @Prop({mutable: true}) virtualHeight: number = 792;\n\n  /**\n   * The layers that will be rendered. The DOM structure will be a DIV container with one child DIV for each layer.\n   * The parent DIV will have a unique ID, and each child DIV will have that ID with the layer name appended, e.g.\n   * if `pages` was ['page', 'fields'] the structure will be:\n   *\n   * ```\n   *     <div id=\"verdocs-document-page-ker2fr1p9\">\n   *       <div id=\"verdocs-document-page-ker2fr1p9-page\"></div>\n   *       <div id=\"verdocs-document-page-ker2fr1p9-fields\"></div>\n   *     </div>\n   * ```\n   */\n  @Prop() layers: IPageLayer[] = [{name: 'page', type: 'canvas'}];\n\n  /**\n   * Fired when a page has been rendered. This is also fired when the page is resized.\n   */\n  @Event() pageRendered: EventEmitter<IDocumentPageInfo>;\n\n  @State() containerId = `verdocs-document-page-${Math.random().toString(36).substring(2, 11)}`;\n  @State() renderedWidth: number = this.virtualWidth;\n  @State() renderedHeight: number = this.virtualHeight;\n  @State() naturalWidth: number = this.virtualWidth;\n  @State() naturalHeight: number = this.virtualHeight;\n  @State() aspectRatio: number = this.virtualWidth / this.virtualHeight;\n  @State() skipFirstNotification = true;\n  @State() pageDisplayUri = '';\n  @State() xScale = 1;\n  @State() yScale = 1;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  async componentWillLoad() {\n    this.pageDisplayUri = await getTemplateDocumentPageDisplayUri(this.endpoint, this.documentId, this.pageNumber);\n    this.listenToTemplate();\n  }\n\n  componentDidLoad() {\n    this.resizeObserver = new ResizeObserver(\n      throttle(entries => {\n        for (const entry of entries) {\n          const renderedWidth = entry.contentRect.width;\n          this.renderedWidth = renderedWidth;\n          this.renderedHeight = this.virtualHeight * (renderedWidth / this.virtualWidth);\n        }\n\n        this.notifyRenderedSize();\n      }, 100),\n    );\n\n    this.resizeObserver.observe(this.container);\n  }\n\n  componentDidUpdate() {\n    // This is fired when fields are updated and triggers the parent to re-attach behaviors like drag-and-drop\n    this.notifyRenderedSize();\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n    this.unlistenToTemplate();\n  }\n\n  async listenToTemplate() {\n    this.unlistenToTemplate();\n    Store.subscribe(\n      'templates',\n      this.templateId,\n      () => getTemplate(this.endpoint, this.templateId),\n      false,\n      (template: ITemplate) => {\n        this.template = template;\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  notifyRenderedSize() {\n    // We skip one notification because by default we will always get at least two, one when rendering the initial size\n    // and a second once we're able to compute the scale size, when the resizeObserver sets renderedWidth/renderedHeight.\n    if (this.skipFirstNotification) {\n      this.skipFirstNotification = false;\n      return;\n    }\n\n    const xScale = this.renderedWidth / this.virtualWidth;\n    if (this.xScale !== xScale) {\n      this.xScale = xScale;\n    }\n\n    const yScale = this.renderedHeight / this.virtualHeight;\n    if (this.yScale !== yScale) {\n      this.yScale = yScale;\n    }\n\n    this.pageRendered.emit({\n      // container: this.container,\n      containerId: this.containerId,\n      documentId: this.documentId,\n      pageNumber: this.pageNumber,\n      virtualWidth: this.virtualWidth,\n      virtualHeight: this.virtualHeight,\n      renderedWidth: this.renderedWidth,\n      renderedHeight: this.renderedHeight,\n      naturalWidth: this.naturalWidth,\n      naturalHeight: this.naturalHeight,\n      aspectRatio: this.aspectRatio,\n      xScale,\n      yScale,\n    });\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host>\n          <img src=\"https://public-assets.verdocs.com/loading-placeholder.png\" class=\"placeholder\" alt=\"Placeholder page\" />\n        </Host>\n      );\n    }\n\n    const height = `${this.renderedHeight}px`;\n\n    return (\n      <Host id={`${this.containerId}`} style={{height, flex: `0 0 ${height}`}}>\n        {this.layers.map(layer =>\n          layer.type === 'div' ? (\n            <div class=\"verdocs-template-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}}>\n              {layer.name === 'controls' &&\n                (this.template?.fields || [])\n                  .filter(field => field && field.page === this.pageNumber)\n                  .map(field => {\n                    const id = getFieldId(field);\n                    let {name, type, multiline} = field;\n                    const {xScale, yScale, templateId, editable, disabled, done, pageNumber} = this;\n                    if (field['setting']?.leading > 0 || field['settings']?.leading > 0) {\n                      type = 'textarea';\n                      multiline = true;\n                    }\n                    switch (type as any) {\n                      case 'textbox':\n                        return (\n                          <verdocs-field-textbox\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            multiline={multiline}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'textarea':\n                        return (\n                          <verdocs-field-textarea\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'date':\n                        return (\n                          <verdocs-field-date\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'attachment':\n                        return (\n                          <verdocs-field-attachment\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'dropdown':\n                        return (\n                          <verdocs-field-dropdown\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'initial':\n                        return (\n                          <verdocs-field-initial\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'signature':\n                        return (\n                          <verdocs-field-signature\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, this.xScale, this.yScale)}\n                          />\n                        );\n                      case 'timestamp':\n                        return (\n                          <verdocs-field-timestamp\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'checkbox':\n                        return (\n                          <verdocs-field-checkbox\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      case 'radio':\n                        return (\n                          <verdocs-field-radio\n                            id={id}\n                            fieldname={name}\n                            source=\"template\"\n                            sourceid={templateId}\n                            editable={editable}\n                            disabled={disabled}\n                            done={done}\n                            xscale={xScale}\n                            yscale={yScale}\n                            pagenumber={pageNumber}\n                            style={getControlStyles(field, xScale, yScale)}\n                          />\n                        );\n                      default:\n                        return <Fragment>{name}</Fragment>;\n                    }\n                  })}\n            </div>\n          ) : this.pageDisplayUri ? (\n            <img\n              class=\"verdocs-template-document-page-layer img\"\n              id={`${this.containerId}-${layer.name}`}\n              src={this.pageDisplayUri}\n              alt={`Page ${this.pageNumber}`}\n              aria-hidden={true}\n              loading=\"lazy\"\n              onLoad={(e: any) => {\n                // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that\n                // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).\n                // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values\n                // for a field are based on the responsive Web view the Template editor was seeing. The IMG was scaled down there in the\n                // exact same way, so we just honor it. We capture the natural width and height here more as information. Then we use the\n                // aspect ratio to adjust the \"virtual\" height in case the page is not 8.5\"x11\".\n                // TODO: Store this in the DB with each page.\n                this.naturalWidth = e.target.naturalWidth;\n                this.naturalHeight = e.target.naturalHeight;\n                this.aspectRatio = this.naturalWidth / this.naturalHeight;\n                this.virtualHeight = this.virtualWidth / this.aspectRatio;\n                this.renderedHeight = e.target.offsetWidth / this.aspectRatio;\n              }}\n            />\n          ) : (\n            <div></div>\n          ),\n        )}\n      </Host>\n    );\n  }\n}\n","@import '../../../theme.scss';\n\nverdocs-toolbar-icon {\n  font-family: $verdocs-primary-font;\n  display: inline-block;\n\n  .icon {\n    display: inline-block;\n    cursor: pointer;\n\n    svg {\n      fill: $choice-available-color;\n    }\n  }\n\n  .tooltip {\n    display: none;\n    box-shadow: 0 0 10px 1px #999999;\n    background: #ffffff;\n    color: $label-color;\n    max-width: 240px;\n    font-weight: bold;\n    padding: 5px 10px;\n    font-size: 13px;\n    position: relative;\n    border-radius: 4px;\n    z-index: 20000;\n    white-space: nowrap;\n\n    .arrow,\n    .arrow::before {\n      position: absolute;\n      width: 8px;\n      height: 8px;\n      background: inherit;\n    }\n\n    .arrow {\n      visibility: hidden;\n      top: -4px;\n    }\n\n    .arrow::before {\n      visibility: visible;\n      content: '';\n      transform: rotate(45deg);\n    }\n\n    &[data-show] {\n      display: block;\n    }\n\n    &[data-popper-placement^='top'] > .arrow {\n      bottom: -4px;\n    }\n\n    &[data-popper-placement^='bottom'] > .arrow {\n      top: -4px;\n    }\n\n    &[data-popper-placement^='left'] > .arrow {\n      right: -4px;\n    }\n\n    &[data-popper-placement^='right'] > .arrow {\n      left: -4px;\n    }\n\n    // For the floating menu\n    &[data-popper-placement^='left'] {\n      //margin-right: 22px !important;\n      padding: 3px 10px;\n\n      & > .arrow {\n        right: -1px;\n      }\n    }\n  }\n}\n","import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Prop, State} from '@stencil/core';\nimport {Placement} from '@popperjs/core/lib/enums';\n// import {Component, Event, EventEmitter, h, Host, Prop, State} from '@stencil/core';\n\n/**\n * Displays a simple help icon. Upon hover or focus, a tooltip will be displayed with help text.\n *\n * ```ts\n * <verdocs-toolbar-icon text=\"Sample tooltip text\" icon={CalendarIcon} />\n * ```\n */\n@Component({\n  tag: 'verdocs-toolbar-icon',\n  styleUrl: 'verdocs-toolbar-icon.scss',\n  shadow: false,\n})\nexport class VerdocsToolbarIcon {\n  iconEl: HTMLDivElement;\n  tooltip: HTMLDivElement;\n  popperInstance: Instance;\n\n  /**\n   * Help text to display on hover/focus\n   */\n  @Prop() text: string = '';\n\n  /**\n   * SVG icon to display\n   */\n  @Prop() icon: string = '';\n\n  /**\n   * Override the Popper \"placement\" setting\n   */\n  @Prop() placement: Placement = 'bottom';\n\n  /**\n   * Triggered when the icon is pressed\n   */\n  // @Event({composed: true}) press: EventEmitter;\n\n  @State() containerId = `verdocs-toolbar-icon-${Math.random().toString(36).substring(2, 11)}`;\n\n  componentDidLoad() {\n    this.popperInstance = createPopper(this.iconEl, this.tooltip, {\n      placement: this.placement,\n      modifiers: this.placement === 'left' ? [{name: 'offset', options: {offset: [0, 20]}}] : [],\n    });\n    // placement: 'top-end',\n    // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n    // });\n  }\n\n  disconnectedCallback() {\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n      this.popperInstance = null;\n    }\n  }\n\n  show() {\n    this.tooltip?.setAttribute('data-show', '');\n    this.popperInstance?.update().catch(() => {});\n  }\n\n  hide() {\n    this.tooltip?.removeAttribute('data-show');\n  }\n\n  // handlePress() {\n  //   this.press?.emit();\n  // }\n\n  render() {\n    return (\n      <Host class={{}}>\n        <div\n          aria-describedby={this.containerId}\n          class=\"icon\"\n          innerHTML={this.icon}\n          onMouseEnter={() => this.show()}\n          onFocus={() => this.show()}\n          onMouseLeave={() => this.hide()}\n          onBlur={() => this.hide()}\n          ref={el => (this.iconEl = el as HTMLDivElement)}\n        />\n        <div id={this.containerId} role=\"tooltip\" class=\"tooltip\" data-popper-placement={this.placement} ref={el => (this.tooltip = el as HTMLDivElement)}>\n          {this.text}\n          <div data-popper-arrow=\"true\" class=\"arrow\" />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-template-star.cjs.entry.js

@@ -52,3 +52,5 @@ const VerdocsTemplateStar = class {
 VerdocsTemplateStar.style = VerdocsTemplateStarStyle0;
 
 exports.verdocs_template_star = VerdocsTemplateStar;
+
+//# sourceMappingURL=verdocs-template-star.cjs.entry.js.map

package/dist/cjs/verdocs-template-star.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-template-star.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,sBAAsB,GAAG,4mCAA4mC,CAAC;AAC5oC,kCAAe,sBAAsB;;ACGrC,MAAM,eAAe,GAAG,uhBAAuhB,CAAC;AAEhjB,MAAM,aAAa,GAAG,4aAA4a,CAAC;MAStb,mBAAmB;;;;;wBAIMA,qBAAe,CAAC,UAAU,EAAE;;wBAmB5C,KAAK;;IAEzB,MAAM,iBAAiB;QACrB,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;QAE5B,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;YAC1B,OAAO,CAAC,GAAG,CAAC,mCAAmC,CAAC,CAAC;YACjD,OAAO;SACR;KACF;IAED,MAAM,CAAC,CAAM;QACX,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrBC,gBAAU,CAACD,qBAAe,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;aACvD,IAAI,CAAC,CAAC;YACL,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY,CAAC;YAC5C,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;gBACnB,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;gBAC5B,OAAO,EAAE,CAAC,CAAC,YAAY,GAAG,CAAC;gBAC3B,KAAK,EAAE,CAAC,CAAC,YAAY;aACtB,CAAC,CAAC;SACJ,CAAC;aACD,KAAK,CAAC,CAAC;YACN,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,OAAO,CAAC,GAAG,CAAC,qCAAqC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;YAC9D,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;SACvB,CAAC,CAAC;KACN;IAED,MAAM;QACJ,QACEE,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,QAAQ,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,aAAa,GAAG,eAAe,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAI,EAChKA,kEAAK,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,IAAI,IAAI,CAAO,CACxD,EACP;KACH;;;;;;","names":["VerdocsEndpoint","toggleStar","h","Host"],"sources":["src/components/templates/verdocs-template-star/verdocs-template-star.scss?tag=verdocs-template-star","src/components/templates/verdocs-template-star/verdocs-template-star.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-star {\n  display: flex;\n  flex: 0 0 60px;\n  align-items: center;\n  flex-direction: row;\n  font-family: $primary-font;\n\n  .star {\n    line-height: 10px;\n\n    &.updating {\n      animation: spinningStar 2s infinite linear;\n    }\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .count {\n    color: #595c5d;\n    font-size: 14px;\n    margin-left: 10px;\n  }\n}\n\n@keyframes spinningStar {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(359deg);\n  }\n}\n","import {VerdocsEndpoint, toggleStar, ITemplate} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Host, Event, EventEmitter, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\n\nconst OutlineStarIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.562.562 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z\" /></svg>`;\n\nconst SolidStarIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path fill-rule=\"evenodd\" d=\"M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.007 5.404.433c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.433 2.082-5.006z\" clip-rule=\"evenodd\" /></svg>`;\n\n/**\n * Displays a clickable star that allows users to mark frequently-used templates.\n */\n@Component({\n  tag: 'verdocs-template-star',\n  styleUrl: 'verdocs-template-star.scss',\n})\nexport class VerdocsTemplateStar {\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 to display the star for.\n   */\n  @Prop({mutable: true}) template: ITemplate;\n\n  /**\n   * Event fired when the user toggles the star on or off. The event detail will contain\n   * the new \"starred\" status and count.\n   */\n  @Event({composed: true}) starChange: EventEmitter<{templateId: string; starred: boolean; count: number}>;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  @State() updating = false;\n\n  async componentWillLoad() {\n    this.endpoint.loadSession();\n\n    if (!this.endpoint.session) {\n      console.log('[TEMPLATES] Must be authenticated');\n      return;\n    }\n  }\n\n  toggle(e: any) {\n    e.stopPropagation();\n    this.updating = true;\n    toggleStar(VerdocsEndpoint.getDefault(), this.template.id)\n      .then(r => {\n        this.updating = false;\n        this.template.star_counter = r.star_counter;\n        this.starChange.emit({\n          templateId: this.template.id,\n          starred: r.star_counter > 0,\n          count: r.star_counter,\n        });\n      })\n      .catch(e => {\n        this.updating = false;\n        console.log('[STAR] Error toggling template star', e.message);\n        this.sdkError.emit(e);\n      });\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={`star ${this.updating ? 'updating' : ''}`} innerHTML={this.template.star_counter ? SolidStarIcon : OutlineStarIcon} onClick={e => this.toggle(e)} />\n        <div class=\"count\">{this.template.star_counter || '--'}</div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-template-tags.cjs.entry.js

@@ -20,3 +20,5 @@ const VerdocsTemplateTags = class {
 VerdocsTemplateTags.style = VerdocsTemplateTagsStyle0;
 
 exports.verdocs_template_tags = VerdocsTemplateTags;
+
+//# sourceMappingURL=verdocs-template-tags.cjs.entry.js.map

package/dist/cjs/verdocs-template-tags.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-template-tags.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,sBAAsB,GAAG,0pBAA0pB,CAAC;AAC1rB,kCAAe,sBAAsB;;MCQxB,mBAAmB;;;;;IAM9B,MAAM;;QACJ,QACEA,QAACC,UAAI,uDACF,MAAA,IAAI,CAAC,IAAI,0CAAE,GAAG,CAAC,GAAG,KACjBD,sBAAO,GAAG,CAAQ,CACnB,CAAC,CACG,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/templates/verdocs-template-tags/verdocs-template-tags.scss?tag=verdocs-template-tags","src/components/templates/verdocs-template-tags/verdocs-template-tags.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-tags {\n  font-family: $primary-font;\n\n  span {\n    margin: 0 4px;\n    height: 28px;\n    font-size: 12px;\n    font-weight: 600;\n    padding: 5px 12px 7px;\n    border-radius: 5px;\n    display: inline-block;\n    box-sizing: border-box;\n    text-transform: uppercase;\n    color: $label-color;\n    border: 1px solid $border-color;\n    background-color: $container-bg;\n  }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\n\n/**\n * Displays a message listing a template's tags.\n */\n@Component({\n  tag: 'verdocs-template-tags',\n  styleUrl: 'verdocs-template-tags.scss',\n})\nexport class VerdocsTemplateTags {\n  /**\n   * The tags to display\n   */\n  @Prop() tags: any[];\n\n  render() {\n    return (\n      <Host>\n        {this.tags?.map(tag => (\n          <span>{tag}</span>\n        ))}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-templates-list.cjs.entry.js

@@ -238,3 +238,5 @@ const VerdocsTemplatesList = class {
 VerdocsTemplatesList.style = VerdocsTemplatesListStyle0;
 
 exports.verdocs_templates_list = VerdocsTemplatesList;
+
+//# sourceMappingURL=verdocs-templates-list.cjs.entry.js.map

package/dist/cjs/verdocs-templates-list.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-templates-list.entry.cjs.js","mappings":"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","names":["VerdocsEndpoint","getTemplates","SDKError","deleteTemplate","h","Host","canPerformTemplateAction","format","integerSequence"],"sources":["src/components/templates/verdocs-templates-list/verdocs-templates-list.scss?tag=verdocs-templates-list","src/components/templates/verdocs-templates-list/verdocs-templates-list.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-templates-list {\n  display: flex;\n  padding: 10px;\n  font-size: 18px;\n  flex-wrap: nowrap;\n  border-radius: 6px;\n  color: $label-color;\n  flex-direction: column;\n  font-family: $primary-font;\n\n  .header {\n    width: 100%;\n    row-gap: 4px;\n    display: flex;\n    flex-wrap: wrap;\n    column-gap: 12px;\n    margin: 0 0 10px 0;\n    align-items: center;\n    flex-direction: row;\n\n    .filter {\n      width: 150px;\n    }\n\n    verdocs-text-input {\n      margin: 0;\n\n      input {\n        height: 32px;\n      }\n    }\n  }\n\n  .filter {\n    align-items: center;\n  }\n\n  .template-placeholder {\n    height: 48px;\n    flex: 0 0 48px;\n    margin: 5px 0;\n    border-radius: 5px;\n    background: $verdocs-grey-3;\n  }\n\n  .template {\n    width: 100%;\n    margin: 2px 0;\n    border: 1px solid #ffffff;\n    background: $verdocs-grey-4;\n\n    &:hover {\n      cursor: pointer;\n      background: #ededff;\n      border: 1px solid #a7a7f5;\n    }\n\n    .inner {\n      gap: 12px;\n      display: flex;\n      padding: 8px 14px;\n      border-radius: 5px;\n      flex-direction: row;\n      align-items: center;\n      container-type: inline-size;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n  }\n\n  .name {\n    flex: 1;\n    display: flex;\n    color: black;\n    font-size: 16px;\n    //margin-left: 10px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n\n    @media screen and (max-width: 1300px) {\n      font-size: 16px;\n    }\n\n    @media screen and (max-width: 700px) {\n      //flex: 0;\n    }\n  }\n\n  .spacer {\n    margin: 0;\n    height: 30px;\n    flex: 0 0 1px;\n    display: flex;\n    border-right: 1px solid #dad8dd;\n\n    @media screen and (max-width: 800px) {\n      display: none;\n    }\n  }\n\n  .empty-text {\n    font-size: 20px;\n    text-align: center;\n    margin: 16px 0 0 0;\n    padding: 80px 80px;\n    border: 2px solid #ccc;\n  }\n\n  .usage,\n  .ownership,\n  .last-used {\n    gap: 10px;\n    color: #444;\n    display: flex;\n    font-size: 16px;\n    margin: 0 0 0 10px;\n    align-items: center;\n    flex-direction: row;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n\n    span,\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n\n    span {\n      display: block;\n    }\n  }\n\n  verdocs-template-star {\n    @media screen and (max-width: 700px) {\n      display: none;\n    }\n  }\n\n  .ownership {\n    flex: 0 0 100px;\n\n    @media screen and (max-width: 700px) {\n      display: none;\n    }\n  }\n\n  .last-used {\n    flex: 0 0 130px;\n  }\n\n  .usage {\n    flex: 0 0 60px;\n  }\n\n  .header-row {\n    display: none;\n  }\n\n  table {\n    container-type: size;\n    max-width: 100%;\n    overflow: hidden;\n    table-layout: fixed;\n  }\n\n  .data-row {\n    cursor: pointer;\n    background: #ededff;\n    border: 1px solid #a7a7f5;\n  }\n\n  .data-col {\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .col-name {\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    overflow: hidden;\n  }\n\n  verdocs-templates-list {\n    @container (max-width:700 px) {\n      .col-starred {\n        display: none;\n      }\n    }\n  }\n}\n","import {format} from 'date-fns';\nimport {deleteTemplate, getTemplates, TTemplateAction, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {integerSequence, ITemplate, IGetTemplatesParams, canPerformTemplateAction} from '@verdocs/js-sdk';\nimport {Component, Event, EventEmitter, h, Host, Prop, State, Watch} from '@stencil/core';\nimport {IFilterOption} from '../../controls/verdocs-quick-filter/verdocs-quick-filter';\nimport {IMenuOption} from '../../controls/verdocs-dropdown/verdocs-dropdown';\nimport {SDKError} from '../../../utils/errors';\n\nconst GlobeAltIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418\" /></svg>`;\nconst LockClosedIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z\" /></svg>`;\nconst BuildingOfficeIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21\" /></svg>`;\nconst EnvelopeIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" /></svg>`;\nconst CreatedIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 122.88 122.88\"><g><path d=\"M81.61,4.73c0-2.61,2.58-4.73,5.77-4.73c3.19,0,5.77,2.12,5.77,4.73v20.72c0,2.61-2.58,4.73-5.77,4.73 c-3.19,0-5.77-2.12-5.77-4.73V4.73L81.61,4.73z M66.11,103.81c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2H81.9 c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H66.11L66.11,103.81z M15.85,67.09c-0.34,0-0.61-1.43-0.61-3.2 c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H15.85L15.85,67.09z M40.98,67.09 c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H40.98 L40.98,67.09z M66.11,67.09c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2H81.9c0.34,0,0.61,1.43,0.61,3.2 c0,1.77-0.27,3.2-0.61,3.2H66.11L66.11,67.09z M91.25,67.09c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2h15.79 c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H91.25L91.25,67.09z M15.85,85.45c-0.34,0-0.61-1.43-0.61-3.2 c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H15.85L15.85,85.45z M40.98,85.45 c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H40.98 L40.98,85.45z M66.11,85.45c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2H81.9c0.34,0,0.61,1.43,0.61,3.2 c0,1.77-0.27,3.2-0.61,3.2H66.11L66.11,85.45z M91.25,85.45c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2h15.79 c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H91.25L91.25,85.45z M15.85,103.81c-0.34,0-0.61-1.43-0.61-3.2 c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H15.85L15.85,103.81z M40.98,103.81 c-0.34,0-0.61-1.43-0.61-3.2c0-1.77,0.27-3.2,0.61-3.2h15.79c0.34,0,0.61,1.43,0.61,3.2c0,1.77-0.27,3.2-0.61,3.2H40.98 L40.98,103.81z M29.61,4.73c0-2.61,2.58-4.73,5.77-4.73s5.77,2.12,5.77,4.73v20.72c0,2.61-2.58,4.73-5.77,4.73 s-5.77-2.12-5.77-4.73V4.73L29.61,4.73z M6.4,45.32h110.07V21.47c0-0.8-0.33-1.53-0.86-2.07c-0.53-0.53-1.26-0.86-2.07-0.86H103 c-1.77,0-3.2-1.43-3.2-3.2c0-1.77,1.43-3.2,3.2-3.2h10.55c2.57,0,4.9,1.05,6.59,2.74c1.69,1.69,2.74,4.02,2.74,6.59v27.06v65.03 c0,2.57-1.05,4.9-2.74,6.59c-1.69,1.69-4.02,2.74-6.59,2.74H9.33c-2.57,0-4.9-1.05-6.59-2.74C1.05,118.45,0,116.12,0,113.55V48.52 V21.47c0-2.57,1.05-4.9,2.74-6.59c1.69-1.69,4.02-2.74,6.59-2.74H20.6c1.77,0,3.2,1.43,3.2,3.2c0,1.77-1.43,3.2-3.2,3.2H9.33 c-0.8,0-1.53,0.33-2.07,0.86c-0.53,0.53-0.86,1.26-0.86,2.07V45.32L6.4,45.32z M116.48,51.73H6.4v61.82c0,0.8,0.33,1.53,0.86,2.07 c0.53,0.53,1.26,0.86,2.07,0.86h104.22c0.8,0,1.53-0.33,2.07-0.86c0.53-0.53,0.86-1.26,0.86-2.07V51.73L116.48,51.73z M50.43,18.54 c-1.77,0-3.2-1.43-3.2-3.2c0-1.77,1.43-3.2,3.2-3.2h21.49c1.77,0,3.2,1.43,3.2,3.2c0,1.77-1.43,3.2-3.2,3.2H50.43L50.43,18.54z\"/></g></svg>`;\nconst LastUsedIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 410.2\"><path d=\"M35.28 35.51h32.54v43.42c0 10.58 4.27 20.06 11.35 27.23 17.03 17.14 45.5 17.45 63.06.93 7.71-7.29 12.4-17.14 12.4-28.16V35.51h65.71v43.42c0 6.34 1.56 12.3 4.35 17.6 2.03 3.85 4.71 7.37 7.92 10.43l2.41 2.24c1.79 1.46 3.71 2.79 5.76 3.97l.31.18.07.04.25.13.16.1.15.08.27.14.05.03.32.17.05.03.27.13.15.08.17.09.26.12.07.04.32.16.03.01.31.15.12.06.2.09.24.11.1.05.33.14.34.16.1.04.23.1.21.09.13.05.31.13h.03l.34.14.08.04.27.1.18.07.16.06.3.11.05.02.34.12.06.02.3.11.16.05.19.07.26.09.09.03.35.12.02.01.34.1.13.04.22.07.25.07.11.03.36.11.36.1.11.03.25.07.22.06.14.04.34.09h.02l.37.1.08.02.29.06.19.05.17.03.32.08.05.01.37.08.06.01.31.06.17.04.21.03.28.06.09.02.37.07h.03l.35.06.14.03.23.03.27.04.11.02.38.06.38.05.12.01.26.04.23.03.15.01.35.05h.03l.39.04.08.01.3.02.21.02.17.02.34.02.05.01.39.03h.05l.34.02.18.01.21.01.3.02h.08l.39.01.03.01.36.01h.39l.28.01h.96l.33-.01h.39l.18-.01.2-.01.25-.01h.13l.32-.02h.07l.38-.02h.01l.37-.02.07-.01.32-.02.12-.01.26-.02.19-.02.19-.02.25-.02.13-.01.31-.04h.07l.37-.05h.01l.37-.04.06-.01.32-.04.12-.02.26-.03.18-.03.19-.03.24-.04.14-.02.3-.05.07-.01.36-.06h.01l.37-.07.05-.01.32-.06.12-.02.25-.05.18-.04.19-.04.23-.05.14-.03.29-.07.08-.01.35-.08.01-.01.36-.08.05-.02.31-.08.11-.02.25-.07.17-.04.2-.06.22-.05.14-.05.28-.08.07-.02.34-.09.02-.01.36-.11.03-.01.32-.1.1-.03.25-.08.16-.05.19-.07.22-.07.13-.04.28-.1.08-.03.32-.11.02-.01.35-.13.04-.01.3-.11.09-.04.26-.1.15-.06.19-.07.21-.09.13-.05.26-.11.08-.03.32-.13.02-.01.33-.14.04-.02.3-.13.09-.04.24-.11.14-.07.19-.08.19-.1.14-.06.25-.12.08-.03.3-.16h.03l.32-.17.03-.01.29-.16.09-.04.24-.12.13-.07.19-.1.18-.1.14-.07.23-.13.08-.05.29-.16.03-.01.31-.18c1.11-.64 2.17-1.31 3.2-2.03l2.71-1.95c4.36-3.56 7.92-7.88 10.43-12.76 2.73-5.26 4.25-11.19 4.25-17.5V35.51h33.97c9.68 0 18.5 3.98 24.91 10.38 6.4 6.37 10.38 15.2 10.38 24.9V192.9H365.1v-53.83H11.3v233.49c0 15.25 12.49 27.74 27.75 27.74h298.3c15.27 0 27.75-12.51 27.75-27.74V325.6h11.31v49.32c0 9.7-3.98 18.53-10.37 24.91-6.42 6.39-15.24 10.37-24.92 10.37H35.28c-9.68 0-18.49-3.97-24.89-10.37C3.97 393.41 0 384.59 0 374.92V70.79C0 61.12 3.97 52.3 10.36 45.9c6.43-6.42 15.25-10.39 24.92-10.39zm211.43-21.54c0-7.71 7.61-13.97 17.03-13.97 9.42 0 17.04 6.26 17.04 13.97v64.96c0 7.7-7.62 13.96-17.04 13.96-9.42 0-17.03-6.26-17.03-13.96V13.97zm-152.52 0C94.19 6.26 101.81 0 111.23 0c9.42 0 17.03 6.26 17.03 13.97v64.96c0 7.7-7.61 13.96-17.03 13.96-9.42 0-17.04-6.26-17.04-13.96V13.97zm311.37 327.72c1.48-14.79 2.69-32.45 3.59-46.5h-75.88v-71.88h77.43c-.39-14.06-1.17-31.75-2.35-46.58-.96-5.93 6.02-9.73 10.51-5.9l90.89 82.99c2.7 2.31 3.02 6.38.7 9.08l-.74.73-93.65 84.05c-4.6 3.89-11.47-.19-10.5-5.99zM63.51 286h50.56c3.53 0 6.43 2.91 6.43 6.44v42.06c0 3.52-2.91 6.44-6.43 6.44H63.51c-3.53 0-6.44-2.91-6.44-6.44v-42.06c0-3.54 2.9-6.44 6.44-6.44zm198.44-98.62h50.55c3.23 0 5.92 2.43 6.37 5.52h-16v49.42h-40.92c-3.53 0-6.45-2.9-6.45-6.45v-42.05c0-3.54 2.9-6.44 6.45-6.44zm0 98.62h40.92v39.6h16.07v8.9c0 3.52-2.92 6.44-6.44 6.44h-50.55c-3.53 0-6.45-2.91-6.45-6.44v-42.06c0-3.54 2.9-6.44 6.45-6.44zm-98.5-98.62h50.56c3.53 0 6.43 2.92 6.43 6.44v42.05c0 3.53-2.91 6.45-6.43 6.45h-50.56c-3.53 0-6.44-2.9-6.44-6.45v-42.05c0-3.54 2.9-6.44 6.44-6.44zm-99.94 0h50.56c3.53 0 6.43 2.92 6.43 6.44v42.05c0 3.53-2.91 6.45-6.43 6.45H63.51c-3.53 0-6.44-2.9-6.44-6.45v-42.05c0-3.54 2.9-6.44 6.44-6.44zM163.45 286h50.56c3.53 0 6.43 2.91 6.43 6.44v42.06c0 3.52-2.91 6.44-6.43 6.44h-50.56c-3.53 0-6.44-2.91-6.44-6.44v-42.06c0-3.54 2.9-6.44 6.44-6.44z\"/></svg>`;\nconst UpdatedIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 506.49\"><path fill-rule=\"nonzero\" d=\"m371.06 415.61-43.25 11.52 6.23-46.41 37.02 34.89zm6.76-177.5c36.98 0 70.56 15.04 94.83 39.35C496.96 301.7 512 335.25 512 372.31c0 37.02-15.02 70.61-39.3 94.88l-.68.64c-24.23 23.88-57.5 38.66-94.2 38.66-37.06 0-70.61-15.04-94.88-39.31l-.64-.69c-23.9-24.24-38.68-57.53-38.68-94.18 0-37.06 15.04-70.61 39.32-94.89 24.27-24.27 57.85-39.31 94.88-39.31zm78.74 55.41c-20.09-20.11-47.96-32.58-78.74-32.58-30.75 0-58.61 12.47-78.75 32.62-20.15 20.14-32.62 48-32.62 78.75 0 30.5 12.25 58.14 32.02 78.19l.6.55c20.14 20.14 48 32.61 78.75 32.61 30.48 0 58.12-12.25 78.21-32.02l.54-.58c20.15-20.15 32.61-48 32.61-78.75s-12.48-58.61-32.62-78.79zM294.24 17.11C294.24 7.69 303.52 0 315.1 0c11.57 0 20.87 7.64 20.87 17.11v74.85c0 9.42-9.3 17.11-20.87 17.11-11.58 0-20.86-7.65-20.86-17.11V17.11zM56.8 242.28c-1.17 0-2.23-5.2-2.23-11.57 0-6.38.92-11.53 2.23-11.53h56.94c1.18 0 2.24 5.2 2.24 11.53 0 6.39-.92 11.57-2.24 11.57H56.8zm90.77 0c-1.17 0-2.23-5.2-2.23-11.57 0-6.38.92-11.53 2.23-11.53h56.94c1.18 0 2.24 5.2 2.24 11.53 0 6.39-.92 11.57-2.24 11.57h-56.94zm90.77 0c-1.16 0-2.22-5.2-2.22-11.57 0-6.38.92-11.53 2.22-11.53h56.94c1.19 0 2.25 5.15 2.25 11.49-5.7 3.55-11.2 7.44-16.43 11.61h-42.76zm-181.4 66.24c-1.18 0-2.24-5.2-2.24-11.57 0-6.38.93-11.58 2.24-11.58h56.94c1.18 0 2.22 5.2 2.22 11.58 0 6.37-.91 11.57-2.22 11.57H56.94zm90.77 0c-1.18 0-2.24-5.2-2.24-11.57 0-6.38.93-11.58 2.24-11.58h56.94c1.18 0 2.23 5.2 2.23 11.58 0 6.37-.92 11.57-2.23 11.57h-56.94zM57.06 374.8c-1.18 0-2.24-5.2-2.24-11.59 0-6.36.94-11.56 2.24-11.56H114c1.19 0 2.24 5.2 2.24 11.56 0 6.39-.93 11.59-2.24 11.59H57.06zm90.78 0c-1.19 0-2.25-5.2-2.25-11.59 0-6.36.94-11.56 2.25-11.56h56.94c1.18 0 2.24 5.2 2.24 11.56 0 6.39-.94 11.59-2.24 11.59h-56.94zM106.83 17.11C106.83 7.69 116.1 0 127.69 0c11.57 0 20.86 7.64 20.86 17.11v74.85c0 9.42-9.34 17.11-20.86 17.11-11.59 0-20.86-7.65-20.86-17.11V17.11zM22.97 163.64h397.39V77.46c0-2.94-1.19-5.53-3.09-7.43-1.9-1.9-4.59-3.08-7.42-3.08h-38.1c-6.39 0-11.59-5.2-11.59-11.57 0-6.38 5.2-11.58 11.59-11.58h38.1c9.32 0 17.7 3.77 23.82 9.88 6.12 6.14 9.88 14.5 9.88 23.83v136.81c-7.61-2.62-15.41-4.73-23.44-6.29v-21.38h.25H22.97v223.17c0 2.94 1.18 5.52 3.08 7.42 1.91 1.9 4.61 3.08 7.44 3.08h188.85c2.16 8.02 4.86 15.84 8.11 23.36H33.71c-9.3 0-17.7-3.75-23.84-9.89C3.75 427.72 0 419.36 0 410.02V77.55c0-9.29 3.75-17.7 9.87-23.82 6.14-6.13 14.5-9.89 23.84-9.89h40.67c6.38 0 11.57 5.2 11.57 11.57C85.95 61.8 80.76 67 74.38 67H33.71c-2.96 0-5.54 1.18-7.44 3.08-1.9 1.9-3.09 4.59-3.09 7.43v86.16h-.21v-.03zm158.95-96.69c-6.39 0-11.57-5.2-11.57-11.57 0-6.38 5.18-11.58 11.57-11.58h77.55c6.39 0 11.57 5.2 11.57 11.58 0 6.37-5.18 11.57-11.57 11.57h-77.55zm161.66 303.24 45.37-51.33c.72-.84 1.78-1.34 2.85-1.36.69-.01 1.37.13 1.98.45l32.94 29.96c.66.59 1.05 1.46 1.06 2.35.02 1-.39 1.98-1.16 2.66l-46.15 52.16-36.95-34.89h.06z\"/></svg>`;\n\nconst VisibilityFilters: IFilterOption[] = [\n  {value: 'private_shared', label: 'Personal + Shared'},\n  {value: 'private', label: 'Personal'},\n  {value: 'shared', label: 'Shared'},\n  {value: 'public', label: 'Public'},\n];\n\nconst StarredFilters: IFilterOption[] = [\n  {value: 'all', label: 'All'},\n  {value: 'starred', label: 'Starred'},\n  {value: 'unstarred', label: 'Not Starred'},\n];\n\nconst SortOptions: IFilterOption[] = [\n  {value: 'name', label: 'Name'},\n  {value: 'created_at', label: 'Created'},\n  {value: 'updated_at', label: 'Last Updated'},\n  {value: 'last_used_at', label: 'Last Used'},\n  {value: 'counter', label: 'Most Used'},\n  {value: 'star_counter', label: 'Most Starred'},\n];\n\nexport type TAllowedTemplateAction = 'send' | 'createlink' | 'signnow' | 'submitted' | 'link' | 'edit' | 'delete';\n\n/**\n * Displays a list of envelopes matching specified conditions.\n */\n@Component({\n  tag: 'verdocs-templates-list',\n  styleUrl: 'verdocs-templates-list.scss',\n})\nexport class VerdocsTemplatesList {\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 sharing settings to filter by.\n   */\n  @Prop({reflect: true, mutable: true}) visibility?: 'private_shared' | 'private' | 'shared' | 'public' = 'private_shared';\n\n  /**\n   * The starred settings to filter by.\n   */\n  @Prop({reflect: true, mutable: true}) starred: 'all' | 'starred' | 'unstarred' = 'all';\n\n  /**\n   * The sort order to display.\n   */\n  @Prop({reflect: true, mutable: true}) sort: string = 'updated_at';\n\n  /**\n   * If set, filter templates by the specified name.\n   */\n  @Prop({reflect: true, mutable: true}) name: string = '';\n\n  /**\n   * Override the If set, filter templates by the specified name.\n   */\n  @Prop({reflect: true, mutable: true}) allowedActions: TAllowedTemplateAction[] = ['send', 'submitted', 'link', 'edit', 'delete'];\n  // @Prop({reflect: true, mutable: true}) allowedActions: TAllowedTemplateAction[] = ['send', 'createlink', 'signnow', 'submitted', 'link', 'edit', 'delete'];\n\n  /**\n   * Whether or not pagination should be enabled.\n   */\n  @Prop() showPagination = true;\n\n  /**\n   * The number of rows to display per page.\n   */\n  @Prop() rowsPerPage = 10;\n\n  /**\n   * The initial page number to select. Pagination is internally controlled but may be overriden by the\n   * host applicaiton.\n   */\n  @Prop() selectedPage = 0;\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 user clicks a template to view it. Typically the host application will use this to navigate\n   * to the template preview. This is also fired when the user selects \"Preview/Send\" fropm the dropdown menu.\n   */\n  @Event({composed: true}) viewTemplate: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user clicks to sign a template now.\n   */\n  @Event({composed: true}) signNow: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user clicks to sign a template now.\n   */\n  @Event({composed: true}) submittedData: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user selects to create a preview link for a template.\n   */\n  // @Event({composed: true}) createLink: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user chooses the Edit option from the dropdown menu.\n   */\n  @Event({composed: true}) editTemplate: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user chooses the Delete option from the dropdown menu. When this is fired, the template\n   * will already have been deleted. The host application should remove it from the list or refresh the list.\n   */\n  @Event({composed: true}) templateDeleted: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate}>;\n\n  /**\n   * Event fired when the user changes their sort order. Host applications can use this to save the user's preferences.\n   */\n  @Event({composed: true}) changeSort: EventEmitter<string>;\n\n  /**\n   * Event fired when the user changes their sort order. Host applications can use this to save the user's preferences.\n   */\n  @Event({composed: true}) changeVisibility: EventEmitter<'private_shared' | 'private' | 'shared' | 'public'>;\n\n  /**\n   * Event fired when the user changes their sort order. Host applications can use this to save the user's preferences.\n   */\n  @Event({composed: true}) changeStarred: EventEmitter<'all' | 'starred' | 'unstarred'>;\n\n  /**\n   * Event fired when the user changes the name filter. This is fired for every inputChange event (every character\n   * typed). This event is provided for balance with the other events, but host applications should generally not\n   * save this value. Users might appreciate applications remembering their sorting or filtering preferences, but\n   * probably not their search terms.\n   */\n  @Event({composed: true}) changeName: EventEmitter<string>;\n\n  @State() count = 0;\n  @State() initiallyLoaded = false;\n  @State() loading = true;\n  @State() confirmDelete: ITemplate | null = null;\n  @State() templates: ITemplate[] = [];\n  @State() localNameFilter = '';\n\n  @Watch('sharing')\n  handleSharingUpdated() {\n    return this.queryTemplates();\n  }\n\n  @Watch('starred')\n  handleStarredUpdated() {\n    return this.queryTemplates();\n  }\n\n  @Watch('sort')\n  handleSortUpdated() {\n    return this.queryTemplates();\n  }\n\n  @Watch('name')\n  handleNameUpdated() {\n    return this.queryTemplates();\n  }\n\n  @Watch('selectedPage')\n  handlePageUpdated() {\n    return this.queryTemplates();\n  }\n\n  componentWillLoad() {\n    this.endpoint.loadSession();\n    if (!this.endpoint.session) {\n      console.log('[TEMPLATES] Must be authenticated');\n      return;\n    }\n  }\n\n  async componentDidLoad() {\n    await this.queryTemplates();\n    this.initiallyLoaded = true;\n  }\n\n  async queryTemplates() {\n    console.log('[TEMPLATES] Querying templates');\n    this.loading = true;\n    try {\n      let queryParams: IGetTemplatesParams = {\n        visibility: this.visibility,\n        // starred: this.starred,\n        page: this.selectedPage,\n        // sort: this.sort,\n        rows: this.rowsPerPage,\n        // ascending: this.sort === 'name' || this.sort === 'star_counter',\n      };\n\n      if (this.name.trim() !== '') {\n        queryParams.q = this.name.trim();\n      }\n\n      const response = await getTemplates(this.endpoint, queryParams);\n      this.templates = response.templates;\n      this.count = response.count;\n      this.loading = false;\n    } catch (e) {\n      this.loading = false;\n      console.log('[TEMPLATES] Error listing templates', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  handleOptionSelected = (option: string, template: ITemplate) => {\n    if (option === 'send') {\n      this.viewTemplate?.emit({endpoint: this.endpoint, template: template});\n      // } else if (option === 'createlink') {\n      //   VerdocsToast('This feature is coming soon!');\n    } else if (option === 'signnow') {\n      this.signNow?.emit({endpoint: this.endpoint, template: template});\n    } else if (option === 'submitted') {\n      this.submittedData?.emit({endpoint: this.endpoint, template: template});\n      // } else if (option === 'link') {\n      //   VerdocsToast('This feature is coming soon!');\n    } else if (option === 'edit') {\n      this.editTemplate?.emit({endpoint: this.endpoint, template: template});\n    } else if (option === 'delete') {\n      this.confirmDelete = template;\n    }\n  };\n\n  deleteTemplate(template: ITemplate) {\n    this.confirmDelete = null;\n    deleteTemplate(this.endpoint, template.id)\n      .then(() => {\n        console.log('[TEMPLATES] Deleted template', template);\n        this.templateDeleted?.emit({endpoint: this.endpoint, template: template});\n        return this.queryTemplates();\n      })\n      .catch(e => {\n        console.log('[TEMPLATES] Error deleting template', template);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      });\n  }\n\n  render() {\n    // In addition to the server query we also filter locally. This provides a faster UI update\n    // while the onBlur re-queries the server for any new records that now qualify by the filter.\n    const locallyFilteredTemplates = !this.localNameFilter ? this.templates : this.templates.filter(t => t.name.toLowerCase().includes(this.localNameFilter.toLowerCase()));\n\n    return (\n      <Host>\n        <div class=\"header\">\n          <div class=\"filter\">\n            <verdocs-text-input\n              id=\"verdocs-filter-name\"\n              value={this.name}\n              clearable={true}\n              autocomplete=\"off\"\n              placeholder=\"Filter by Name...\"\n              onInput={(e: any) => (this.localNameFilter = e.target.value.trim())}\n              onFocusout={(e: any) => {\n                this.name = e.target.value.trim();\n                this.localNameFilter = e.target.value.trim();\n                this.changeName?.emit(this.name);\n              }}\n            />\n          </div>\n\n          <verdocs-quick-filter\n            label=\"Visibility\"\n            value={this.visibility}\n            options={VisibilityFilters}\n            onOptionSelected={e => {\n              this.visibility = e.detail.value as any;\n              this.changeVisibility?.emit(this.visibility);\n            }}\n          />\n\n          <verdocs-quick-filter\n            label=\"Starred\"\n            value={this.starred}\n            options={StarredFilters}\n            onOptionSelected={e => {\n              this.starred = e.detail.value as any;\n              this.changeStarred?.emit(this.starred);\n            }}\n          />\n\n          <verdocs-quick-filter\n            label=\"Sort By\"\n            value={this.sort}\n            options={SortOptions}\n            onOptionSelected={e => {\n              this.sort = e.detail.value as any;\n              this.changeSort?.emit(this.sort);\n            }}\n          />\n          {this.loading && <verdocs-spinner mode=\"dark\" size={24} />}\n          <div style={{display: 'flex', flex: '1'}} />\n        </div>\n\n        {/*<verdocs-table*/}\n        {/*  data={locallyFilteredTemplates}*/}\n        {/*  onRowClick={(template: any) => this.viewTemplate?.emit({endpoint: this.endpoint, template: template as ITemplate})}*/}\n        {/*  columns={[*/}\n        {/*    {*/}\n        {/*      id: 'starred',*/}\n        {/*      renderCell: (_, row) => <verdocs-template-star template={row} endpoint={this.endpoint} />,*/}\n        {/*    },*/}\n        {/*    {*/}\n        {/*      id: 'name',*/}\n        {/*    },*/}\n        {/*    {*/}\n        {/*      id: 'usage',*/}\n        {/*      renderCell: (_, row) => (*/}\n        {/*        <div>*/}\n        {/*          <span innerHTML={EnvelopeIcon} title=\"Usage Counter\" />*/}\n        {/*          {row.counter || '--'}*/}\n        {/*        </div>*/}\n        {/*      ),*/}\n        {/*    },*/}\n        {/*    {*/}\n        {/*      id: 'created_at',*/}\n        {/*      renderCell: (_, row) => {*/}\n        {/*        const dateToShow = this.sort === 'created_at' ? 'created_at' : this.sort === 'updated_at' ? 'updated_at' : 'last_used_at';*/}\n        {/*        const date = row[dateToShow];*/}\n\n        {/*        return (*/}\n        {/*          <div class=\"last-used\">*/}\n        {/*            {dateToShow === 'created_at' && <span innerHTML={CreatedIcon} title=\"Created\" />}*/}\n        {/*            {dateToShow === 'updated_at' && <span innerHTML={UpdatedIcon} title=\"Last Updated\" />}*/}\n        {/*            {dateToShow === 'last_used_at' && <span innerHTML={LastUsedIcon} title=\"Last Used\" />}*/}\n        {/*            {date ? format(new Date(date), 'P') : 'Never'}*/}\n        {/*          </div>*/}\n        {/*        );*/}\n        {/*      },*/}\n        {/*    },*/}\n        {/*    {*/}\n        {/*      id: 'ownership',*/}\n        {/*      renderCell: (_, row) => (*/}\n        {/*        <div>*/}\n        {/*          {row.is_public && (*/}\n        {/*            <div class=\"ownership\">*/}\n        {/*              <span innerHTML={GlobeAltIcon} /> Public*/}\n        {/*            </div>*/}\n        {/*          )}*/}\n        {/*          {!row.is_public && !row.is_personal && (*/}\n        {/*            <div class=\"ownership\">*/}\n        {/*              <span innerHTML={LockClosedIcon} /> Private*/}\n        {/*            </div>*/}\n        {/*          )}*/}\n        {/*          {!row.is_public && row.is_personal && (*/}\n        {/*            <div class=\"ownership\">*/}\n        {/*              <span innerHTML={BuildingOfficeIcon} /> Shared*/}\n        {/*            </div>*/}\n        {/*          )}*/}\n        {/*        </div>*/}\n        {/*      ),*/}\n        {/*    },*/}\n        {/*    {*/}\n        {/*      id: 'actions',*/}\n        {/*      renderCell: (_, row) => {*/}\n        {/*        const MENU_OPTIONS: IMenuOption[] = [];*/}\n\n        {/*        if (row.allowed_operations.includes(TemplateActions.READ) && this.allowedActions.includes('send')) {*/}\n        {/*          MENU_OPTIONS.push({label: 'Preview / Send', id: 'send', disabled: !row.allowed_operations.includes(TemplateActions.READ)});*/}\n        {/*        }*/}\n\n        {/*        // if (this.allowedActions.includes('createlink')) {*/}\n        {/*        //   MENU_OPTIONS.push({label: 'Create Link', id: 'createlink', disabled: true});*/}\n        {/*        // }*/}\n\n        {/*        if (row.allowed_operations.includes(TemplateActions.CREATE_PERSONAL) && this.allowedActions.includes('signnow')) {*/}\n        {/*          MENU_OPTIONS.push({label: 'Sign Now', id: 'signnow', disabled: true});*/}\n        {/*        }*/}\n\n        {/*        if (row.allowed_operations.includes(TemplateActions.READ) && this.allowedActions.includes('submitted')) {*/}\n        {/*          MENU_OPTIONS.push({label: ''});*/}\n        {/*          MENU_OPTIONS.push({label: 'Submissions', id: 'submitted'});*/}\n        {/*        }*/}\n\n        {/*        if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {*/}\n        {/*          MENU_OPTIONS.push({label: ''});*/}\n\n        {/*          // TODO: The preview link used to be just an internal route in the main Web application, but*/}\n        {/*          // that's not suitable for embeddding. Disabling until this gets re-requested as a feature,*/}\n        {/*          // in which case we'll want to move this to an API-driven function.*/}\n        {/*          // if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {*/}\n        {/*          //   MENU_OPTIONS.push({label: 'Get Preview Link', id: 'link', disabled: !this.canPreview(template)});*/}\n        {/*          // }*/}\n\n        {/*          if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {*/}\n        {/*            MENU_OPTIONS.push({label: 'Edit', id: 'edit', disabled: !row.allowed_operations.includes(TemplateActions.WRITE)});*/}\n        {/*          }*/}\n\n        {/*          if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {*/}\n        {/*            MENU_OPTIONS.push({*/}\n        {/*              label: 'Delete',*/}\n        {/*              id: 'delete',*/}\n        {/*              disabled: !row.allowed_operations.includes(TemplateActions.DELETE),*/}\n        {/*            });*/}\n        {/*          }*/}\n        {/*        }*/}\n\n        {/*        return <verdocs-dropdown options={MENU_OPTIONS} onOptionSelected={e => this.handleOptionSelected(e.detail.id, row)} />;*/}\n        {/*      },*/}\n        {/*    },*/}\n        {/*  ]}*/}\n        {/*/>*/}\n\n        {locallyFilteredTemplates.map(template => {\n          const dateToShow = this.sort === 'created_at' ? 'created_at' : this.sort === 'updated_at' ? 'updated_at' : 'last_used_at';\n          const date = template[dateToShow];\n\n          const MENU_OPTIONS: IMenuOption[] = [];\n\n          const allowed_operations: TTemplateAction[] = [];\n\n          // serverless/src/functions/getTemplates.ts:        allowed_operations: [] as string[],\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_personal', record) && record.allowed_operations.push('create_personal');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_org', record) && record.allowed_operations.push('create_org');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_public', record) && record.allowed_operations.push('create_public');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'read', record) && record.allowed_operations.push('read');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'write', record) && record.allowed_operations.push('write');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'delete', record) && record.allowed_operations.push('delete');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_personal', record) && record.allowed_operations.push('change_visibility_personal');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_org', record) && record.allowed_operations.push('change_visibility_org');\n          // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_public', record) && record.allowed_operations.push('change_visibility_public');\n\n          if (this.allowedActions.includes('send')) {\n            MENU_OPTIONS.push({label: 'Preview / Send', id: 'send', disabled: !canPerformTemplateAction(this.endpoint.profile, 'read', template)});\n          }\n\n          // if (this.allowedActions.includes('createlink')) {\n          //   MENU_OPTIONS.push({label: 'Create Link', id: 'createlink', disabled: true});\n          // }\n\n          if (this.allowedActions.includes('signnow')) {\n            MENU_OPTIONS.push({label: 'Sign Now', id: 'signnow', disabled: true});\n          }\n\n          if (this.allowedActions.includes('submitted')) {\n            MENU_OPTIONS.push({label: ''});\n            MENU_OPTIONS.push({label: 'Submissions', id: 'submitted', disabled: !canPerformTemplateAction(this.endpoint.profile, 'read', template)});\n          }\n\n          if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {\n            MENU_OPTIONS.push({label: ''});\n\n            // TODO: The preview link used to be just an internal route in the main Web application, but\n            // that's not suitable for embeddding. Disabling until this gets re-requested as a feature,\n            // in which case we'll want to move this to an API-driven function.\n            // if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {\n            //   MENU_OPTIONS.push({label: 'Get Preview Link', id: 'link', disabled: !this.canPreview(template)});\n            // }\n\n            if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {\n              MENU_OPTIONS.push({label: 'Edit', id: 'edit', disabled: !allowed_operations.includes('write')});\n            }\n\n            if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {\n              MENU_OPTIONS.push({label: 'Delete', id: 'delete', disabled: !allowed_operations.includes('delete')});\n            }\n          }\n\n          return (\n            <div\n              class=\"template\"\n              onClick={() => {\n                this.viewTemplate?.emit({endpoint: this.endpoint, template});\n              }}\n            >\n              <div class=\"inner\">\n                <verdocs-template-star template={template} endpoint={this.endpoint} />\n\n                <div class=\"spacer icon-spacer\" />\n                <div class=\"name\">{template.name}</div>\n\n                <div class=\"spacer usage-spacer\" />\n                <div class=\"usage\">\n                  <span innerHTML={EnvelopeIcon} title=\"Usage Counter\" />\n                  {template.counter || '--'}\n                </div>\n\n                <div class=\"spacer last-used-spacer\" />\n                <div class=\"last-used\">\n                  {dateToShow === 'created_at' && <span innerHTML={CreatedIcon} title=\"Created\" />}\n                  {dateToShow === 'updated_at' && <span innerHTML={UpdatedIcon} title=\"Last Updated\" />}\n                  {dateToShow === 'last_used_at' && <span innerHTML={LastUsedIcon} title=\"Last Used\" />}\n                  {date ? format(new Date(date), 'P') : 'Never'}\n                </div>\n\n                <div class=\"spacer ownership-spacer\" />\n                {template.is_public && (\n                  <div class=\"ownership\">\n                    <span innerHTML={GlobeAltIcon} /> Public\n                  </div>\n                )}\n                {!template.is_public && !template.is_personal && (\n                  <div class=\"ownership\">\n                    <span innerHTML={LockClosedIcon} /> Private\n                  </div>\n                )}\n                {!template.is_public && template.is_personal && (\n                  <div class=\"ownership\">\n                    <span innerHTML={BuildingOfficeIcon} /> Shared\n                  </div>\n                )}\n\n                <verdocs-dropdown options={MENU_OPTIONS} onOptionSelected={e => this.handleOptionSelected(e.detail.id, template)} />\n              </div>\n            </div>\n          );\n        })}\n\n        {!this.initiallyLoaded && (\n          <div>\n            {integerSequence(0, this.rowsPerPage).map(() => (\n              <div class=\"template-placeholder\" />\n            ))}\n          </div>\n        )}\n\n        {this.initiallyLoaded && !this.templates.length && <div class=\"empty-text\">No matching templates found. Please adjust your filters and try again.</div>}\n\n        {this.initiallyLoaded && this.templates.length && this.showPagination ? (\n          <div style={{marginTop: '20px'}}>\n            <verdocs-pagination\n              selectedPage={this.selectedPage}\n              perPage={this.rowsPerPage}\n              itemCount={this.count}\n              onSelectPage={e => {\n                this.selectedPage = e.detail.selectedPage;\n              }}\n            />\n          </div>\n        ) : (\n          <div />\n        )}\n\n        {this.confirmDelete && (\n          <verdocs-ok-dialog\n            heading=\"Delete this Template?\"\n            message=\"This operation cannot be undone.\"\n            onNext={() => this.deleteTemplate(this.confirmDelete)}\n            onExit={() => (this.confirmDelete = null)}\n            showCancel={true}\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/verdocs-toggle.cjs.entry.js

@@ -28,3 +28,5 @@ const VerdocsToggle = class {
 VerdocsToggle.style = VerdocsToggleStyle0;
 
 exports.verdocs_toggle = VerdocsToggle;
+
+//# sourceMappingURL=verdocs-toggle.cjs.entry.js.map

package/dist/cjs/verdocs-toggle.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-toggle.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,05CAA05C,CAAC;AACp7C,4BAAe,gBAAgB;;MCuBlB,aAAa;;;;;8BAWU,CAAC;;IAEnC,iBAAiB;;QACf,IAAI,CAAC,cAAc,GAAG,CAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,gBAAgB,KAAI,CAAC,CAAC;KAC3D;IAED,MAAM;QACJ,QACEA,kEAAK,KAAK,EAAC,WAAW,IACpBA,mEAAM,KAAK,EAAC,OAAO,IAAE,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,CAAQ,EACrDA,kEAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAgB,EAAEC,OAAa,MACxDD,oBACE,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAEC,OAAK,KAAK,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,EAAE,EACtD,OAAO,EAAE;gBACP,OAAO,CAAC,GAAG,CAAC,SAAS,EAAEA,OAAK,CAAC,CAAC;gBAC9B,IAAI,CAAC,cAAc,GAAGA,OAAK,CAAC;aAC7B,GACD,CACH,CAAC,CACE,CACF,EACN;KACH;;;;;;","names":["h","index"],"sources":["src/components/controls/verdocs-toggle/verdocs-toggle.scss?tag=verdocs-toggle","src/components/controls/verdocs-toggle/verdocs-toggle.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle {\n  font-family: $primary-font;\n\n  .container {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    background-color: $container-bg;\n  }\n\n  .label {\n    font-size: 24px;\n    font-weight: 700;\n    color: $medium-bg;\n    align-self: center;\n    margin-right: 27px;\n    font-family: sans-serif;\n  }\n\n  .buttons {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n  }\n\n  .buttons button {\n    width: 60px;\n    height: 60px;\n    border: 2px solid $item-border-color;\n    border-radius: 5px;\n    cursor: pointer;\n  }\n\n  .buttons button:not(:last-child) {\n    margin-right: 11px;\n  }\n\n  .buttons svg {\n    width: 30px;\n    height: 30px;\n  }\n\n  .buttons button:hover {\n    background-color: $item-border-color;\n    transition: 0.25s;\n  }\n\n  .buttons button:hover svg {\n    fill: $container-bg;\n    transition: 0.25s;\n  }\n\n  .selected {\n    background-color: $border-color;\n    transition: 0.25s;\n  }\n\n  .selected svg {\n    fill: #ffffff;\n    transition: 0.25s;\n  }\n}\n","import {Component, Prop, h, State} from '@stencil/core';\n\nexport interface IButtons {\n  id: string;\n  icon: string;\n}\n\nexport interface IToggleIconButtons {\n  label: string;\n  defaultSelection: number;\n  buttons: IButtons[];\n}\n\n/**\n * Displays a label and a set of buttons, also allowing a default selection of a button.\n *\n * ```ts\n * <verdocs-toggle options={[...options]} theme=\"light\"></verdocs-toggle>\n * ```\n */\n@Component({\n  tag: 'verdocs-toggle',\n  styleUrl: 'verdocs-toggle.scss',\n})\nexport class VerdocsToggle {\n  /**\n   * The tags to display\n   */\n  @Prop() options: IToggleIconButtons;\n\n  /**\n   * The \"theme\" to be used\n   */\n  @Prop() theme: 'light' | 'dark';\n\n  @State() selectedOption: number = 0;\n\n  componentWillLoad() {\n    this.selectedOption = this.options?.defaultSelection || 0;\n  }\n\n  render() {\n    return (\n      <div class=\"container\">\n        <span class=\"label\">{`${this.options.label}:`}</span>\n        <div class=\"buttons\">\n          {this.options.buttons.map((button: IButtons, index: number) => (\n            <button\n              id={button.id}\n              key={button.id}\n              innerHTML={button.icon}\n              class={index === this.selectedOption ? 'selected' : ''}\n              onClick={() => {\n                console.log('clicked', index);\n                this.selectedOption = index;\n              }}\n            />\n          ))}\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

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

@@ -23,3 +23,5 @@ patchBrowser().then(async (options) => {
 });
 
 exports.setNonce = index.setNonce;
+
+//# sourceMappingURL=verdocs-web-sdk.cjs.js.map

package/dist/cjs/verdocs-web-sdk.cjs.js.map

@@ -0,0 +1 @@
+{"file":"verdocs-web-sdk.cjs.js","mappings":";;;;;;;AAAA;AACA;AACA;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,iNAAe,CAAC;AACrC,EAAE,MAAM,IAAI,GAAiE,EAAE,CAAC;AAChF,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AACtD,GAAG;AACH,EAAE,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAMC,wBAAa,EAAE,CAAC;AACxB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","globalScripts","bootstrapLazy"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.22.3 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}

package/dist/collection/components/controls/verdocs-button/verdocs-button.js

@@ -160,3 +160,4 @@ export class VerdocsButton {
         };
     }
 }
+//# sourceMappingURL=verdocs-button.js.map

package/dist/collection/components/controls/verdocs-button/verdocs-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-button.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-button/verdocs-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AAKH,MAAM,OAAO,aAAa;;;yBASW,IAAI;uBAKN,IAAI;oBAK8B,QAAQ;oBAK7B,QAAQ;uBAKH,UAAU;wBAKjC,KAAK;;IAEjC,MAAM;QACJ,OAAO,CACL,+DAAQ,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE;YACjG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,YAAY,EAAC,SAAS,EAAE,IAAI,CAAC,SAAS,GAAI,CAAC,CAAC,CAAC,IAAI;YAC/E,6DAAM,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,KAAK,CAAQ;YAC7C,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,UAAU,EAAC,SAAS,EAAE,IAAI,CAAC,OAAO,GAAI,CAAC,CAAC,CAAC,IAAI,CAClE,CACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h} from '@stencil/core';\n\n/**\n * A simple button, with consistent styling to other controls in the design system.\n *\n * ```ts\n * <verdocs-button label=\"Click Me\" size=\"normal\" variant=\"standard\" />\n * ```\n */\n@Component({\n  tag: 'verdocs-button',\n  styleUrl: 'verdocs-button.scss',\n})\nexport class VerdocsButton {\n  /**\n   * The label for the button.\n   */\n  @Prop() label!: string;\n\n  /**\n   * If desired, a prefix icon for the button.\n   */\n  @Prop() startIcon: string | null = null;\n\n  /**\n   * If desired, a suffix icon for the button.\n   */\n  @Prop() endIcon: string | null = null;\n\n  /**\n   * The size (height) of the button.\n   */\n  @Prop() size: 'xsmall' | 'small' | 'normal' | 'medium' | 'large' = 'normal';\n\n  /**\n   * The type of the button.\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n\n  /**\n   * The display variant of the button.\n   */\n  @Prop() variant: 'standard' | 'text' | 'outline' = 'standard';\n\n  /**\n   * Whether the button should be disabled.\n   */\n  @Prop() disabled: boolean = false;\n\n  render() {\n    return (\n      <button disabled={this.disabled} type={this.type} class={`${this.variant} ${this.size} ${this.type}`}>\n        {this.startIcon ? <span class=\"icon start\" innerHTML={this.startIcon} /> : null}\n        <span class=\"button-label\">{this.label}</span>\n        {this.endIcon ? <span class=\"icon end\" innerHTML={this.endIcon} /> : null}\n      </button>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-button-panel/verdocs-button-panel.js

@@ -171,3 +171,4 @@ export class VerdocsButtonPanel {
         };
     }
 }
+//# sourceMappingURL=verdocs-button-panel.js.map

package/dist/collection/components/controls/verdocs-button-panel/verdocs-button-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-button-panel.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-button-panel/verdocs-button-panel.tsx"],"names":[],"mappings":"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","sourcesContent":["import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Method, Prop} from '@stencil/core';\n\n/**\n * Display an icon button that triggers a drop-down panel that can display\n * arbitrary child content, such as metadata, forms, or other controls.\n *\n * ```ts\n *   <verdocs-button-panel .icon=${icon}>\n *     <h6>Field Settings</h6>\n *     <form>\n *     <p>\n *       <label>Field Name</label>\n *       <input type=\"text\" placeholder=\"Field Name...\" />\n *     </p>\n *     </form>\n *   </verdocs-button-panel>\n * ```\n */\n@Component({\n  tag: 'verdocs-button-panel',\n  styleUrl: 'verdocs-button-panel.scss',\n  shadow: false,\n})\nexport class VerdocsButtonPanel {\n  iconEl: HTMLDivElement;\n  panelEl: HTMLDivElement;\n  hiderEl?: HTMLDivElement;\n  popperInstance: Instance;\n\n  /**\n   * SVG icon to display\n   */\n  @Prop() icon: string = '';\n\n  componentDidRender() {\n    document.body.appendChild(this.panelEl);\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n    }\n\n    this.popperInstance = createPopper(this.iconEl, this.panelEl, {\n      // placement: 'top-end',\n      // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n      this.popperInstance = null;\n    }\n\n    if (this.panelEl) {\n      this.panelEl.remove();\n    }\n  }\n\n  // Not marked as @State because it's not the thing that controls our rendering\n  showing = false;\n\n  @Method()\n  async showPanel() {\n    this.panelEl?.setAttribute('data-show', '');\n    this.popperInstance?.update().catch(() => {});\n    this.showing = true;\n\n    this.hiderEl = document.createElement('div');\n    this.hiderEl.id = 'verdocs-button-panel-hider';\n    this.hiderEl.style.zIndex = '100';\n    this.hiderEl.style.position = 'absolute';\n    this.hiderEl.style.top = '0px';\n    this.hiderEl.style.left = '0px';\n    this.hiderEl.style.right = '0px';\n    this.hiderEl.style.bottom = '0px';\n    this.hiderEl.onclick = (e: any) => {\n      e.stopPropagation();\n      this.toggle();\n    };\n    document.body.appendChild(this.hiderEl);\n  }\n\n  @Method()\n  async hidePanel() {\n    Array.from(document.getElementsByClassName('verdocs-button-panel-content')).forEach(el => {\n      el.removeAttribute('data-show');\n    });\n    document.getElementById('verdocs-button-panel-hider')?.remove();\n    this.showing = false;\n  }\n\n  @Method()\n  async toggle() {\n    if (this.showing) {\n      await this.hidePanel();\n    } else {\n      await this.showPanel();\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class=\"icon\"\n          innerHTML={this.icon}\n          onClick={(e: any) => {\n            e.stopPropagation();\n            return this.toggle();\n          }}\n          ref={el => (this.iconEl = el)}\n        />\n        <div role=\"tooltip\" class=\"verdocs-button-panel-content\" data-popper-placement=\"bottom\" ref={el => (this.panelEl = el as HTMLDivElement)}>\n          <div data-popper-arrow=\"true\" class=\"arrow\" />\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-checkbox/verdocs-checkbox.js

@@ -152,3 +152,4 @@ export class VerdocsCheckbox {
         };
     }
 }
+//# sourceMappingURL=verdocs-checkbox.js.map

package/dist/collection/components/controls/verdocs-checkbox/verdocs-checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-checkbox.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-checkbox/verdocs-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAEvD;;;;;;;;;;;;;;;;GAgBG;AAMH,MAAM,OAAO,eAAe;;uBAIC,KAAK;oBAKT,EAAE;qBAMD,EAAE;qBAOF,EAAE;qBAKQ,OAAO;wBAKZ,KAAK;;IAElC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,EAAC;YACxD;gBACE,8DAAO,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI;gBAC7G,+DAAO,IAAI,CAAC,KAAK,CAAQ,CACnB,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, h, Host, Prop} from '@stencil/core';\n\n/**\n * Displays a check box. Note that this is different from the `verdocs-field-checkbox` component, which is designed\n * to be used in signing experiences and contains settings that connect to template fields. This is just a simple check\n * box for UI displays e.g. dialog boxes.\n *\n * This control encapsulates a standard HTML checkbox. To subscribe to change events, connect an `onChange`\n * handler. Sample usage:\n *\n * ```ts\n * <verdocs-checkbox\n *    value=\"on\"\n *    name=\"thingEnabled\"\n *    checked={this.thingEnabled}\n *    onInput={(e: any) => (this.thingEnabled = e.target.checked)}\n * />\n * ```\n */\n@Component({\n  tag: 'verdocs-checkbox',\n  styleUrl: 'verdocs-checkbox.scss',\n  shadow: false,\n})\nexport class VerdocsCheckbox {\n  /**\n   * Whether the radio button is currently selected.\n   */\n  @Prop() checked: boolean = false;\n\n  /**\n   * HTML form field name for the input.\n   */\n  @Prop() name: string = '';\n\n  /**\n   * Label to display. Leave blank for no label. The label will be displayed to the right of the checkbox, but may be\n   * repositioned with CSS.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * Value to track with the input. Value is not used internally by this component but is sometimes useful to set\n   * because it can be retrieved in event handlers via e.target.value. This can be used to identify which\n   * checkbox was clicked in a checkbox group.\n   */\n  @Prop() value: string = '';\n\n  /**\n   * Style of checkbox to render. Use 'dark' when rendering on a dark background.\n   */\n  @Prop() theme: 'light' | 'dark' = 'light';\n\n  /**\n   * If set, the button will still be displayed but not selectable.\n   */\n  @Prop() disabled?: boolean = false;\n\n  render() {\n    return (\n      <Host class={{disabled: this.disabled, [this.theme]: true}}>\n        <label>\n          <input type=\"checkbox\" value={this.value} name={this.name} checked={this.checked} disabled={this.disabled} />\n          <span>{this.label}</span>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-component-error/verdocs-component-error.js

@@ -44,3 +44,4 @@ export class VerdocsComponentError {
         };
     }
 }
+//# sourceMappingURL=verdocs-component-error.js.map

package/dist/collection/components/controls/verdocs-component-error/verdocs-component-error.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-component-error.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-component-error/verdocs-component-error.tsx"],"names":[],"mappings":"AAAA,yFAAyF;AAEzF,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAEvD;;GAEG;AAMH,MAAM,OAAO,qBAAqB;;uBAIN,EAAE;;IAE5B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,OAAO,CAAO,CAClC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// NOTE: This component does not have a story because it's not intended for external use.\n\nimport {Component, h, Host, Prop} from '@stencil/core';\n\n/**\n * Render a simple error message.\n */\n@Component({\n  tag: 'verdocs-component-error',\n  styleUrl: 'verdocs-component-error.scss',\n  shadow: false,\n})\nexport class VerdocsComponentError {\n  /**\n   * The message to display.\n   */\n  @Prop() message: string = '';\n\n  render() {\n    return (\n      <Host>\n        <div class=\"inner\">{this.message}</div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.js

@@ -113,3 +113,4 @@ export class VerdocsDropdown {
     }
     static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=verdocs-dropdown.js.map

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-dropdown.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-dropdown/verdocs-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,YAAY,EAAC,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAe,MAAM,eAAe,CAAC;AAE/E,MAAM,aAAa,GAAG,iLAAiL,CAAC;AASxM;;;;;;;;;;;;;;;GAeG;AAKH,MAAM,OAAO,eAAe;;uBAOO,EAAE;2BAQZ,gBAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE;0BAE9D,KAAK;;IAE3B,kBAAkB,CAAC,CAAM,EAAE,MAAmB;;QAC5C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAA,IAAI,CAAC,cAAc,0CAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,oBAAoB,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;QAEnD,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,aAAa,gBAAa,WAAW,EAAC,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,GAAI;YAEvI,IAAI,CAAC,UAAU,IAAI,CAClB,uEAAgB,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAC,6BAA6B,IACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACzB,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;oBAClB,OAAO,WAAK,KAAK,EAAC,iCAAiC,GAAG,CAAC;gBACzD,CAAC;qBAAM,CAAC;oBACN,OAAO,CACL,cAAQ,KAAK,EAAC,8BAA8B,EAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,MAAM,CAAC,IAC9H,MAAM,CAAC,KAAK,CACN,CACV,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CACa,CAClB,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}

package/dist/collection/components/controls/verdocs-file-chooser/verdocs-file-chooser.js

@@ -97,3 +97,4 @@ export class VerdocsFileChooser {
             }];
     }
 }
+//# sourceMappingURL=verdocs-file-chooser.js.map

package/dist/collection/components/controls/verdocs-file-chooser/verdocs-file-chooser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-file-chooser.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-file-chooser/verdocs-file-chooser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AACnF,OAAO,EAAC,WAAW,EAAC,MAAM,sBAAsB,CAAC;AAEjD;;;;;;;GAOG;AAMH,MAAM,OAAO,kBAAkB;;wBAIO,eAAe,CAAC,UAAU,EAAE;;;IAUhE,iBAAiB,CAAC,CAAM;;QACtB,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,CAAC,CAAC,MAAM,CAAC,KAAK,0CAAG,CAAC,CAAC,KAAI,IAAI,CAAC;QACxC,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC,CAAC,CAAC;QAC3C,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IACtD,CAAC;IAED,gBAAgB,CAAC,CAAM;;QACrB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAC;QACtC,MAAA,QAAQ,CAAC,cAAc,CAAC,sBAAsB,CAAC,0CAAE,KAAK,EAAE,CAAC;IAC3D,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,kCAAkC,CAAC;QAE/F,OAAO,CACL,EAAC,IAAI;YACH,8DACE,IAAI,EAAC,MAAM,EACX,QAAQ,QACR,EAAE,EAAC,sBAAsB,EACzB,MAAM,EAAC,4HAA4H,EACnI,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GACxC;YAEF,4DAAK,KAAK,EAAC,YAAY;gBAGrB,4DAAK,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAO;gBAEtF,4DAAK,KAAK,EAAC,WAAW,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,sBAAsB,CAAO;gBAE/E,uEAAgB,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAI,CACvF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}

package/dist/collection/components/controls/verdocs-help-icon/verdocs-help-icon.js

@@ -95,3 +95,4 @@ export class VerdocsHelpIcon {
         };
     }
 }
+//# sourceMappingURL=verdocs-help-icon.js.map

package/dist/collection/components/controls/verdocs-help-icon/verdocs-help-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-help-icon.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-help-icon/verdocs-help-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAW,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAE9D,MAAM,QAAQ,GACZ,q7BAAq7B,CAAC;AAEx7B;;;;;;GAMG;AAMH,MAAM,OAAO,eAAe;;oBAQH,EAAE;oBAKF,QAAQ;2BAER,qBAAqB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE;;IAEzF,gBAAgB;QACd,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE;QAC9D,wBAAwB;QACxB,6DAA6D;SAC9D,CAAC,CAAC;IACL,CAAC;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC;IACH,CAAC;IAED,IAAI;;QACF,MAAA,IAAI,CAAC,SAAS,0CAAE,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;QAC9C,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM,GAAG,KAAK,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAChD,CAAC;IAED,IAAI;;QACF,MAAA,IAAI,CAAC,SAAS,0CAAE,eAAe,CAAC,WAAW,CAAC,CAAC;IAC/C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE;YACb,gFACoB,IAAI,CAAC,WAAW,EAClC,KAAK,EAAC,MAAM,EACZ,SAAS,EAAE,IAAI,CAAC,IAAI,EACpB,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAC/B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAC1B,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAC/B,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EACzB,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,EAAoB,CAAC,GAC/C;YACF,4DACE,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,SAAS,2BACO,QAAQ,EAC9B,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAoB,CAAC;gBAElD,6DAAM,SAAS,EAAE,IAAI,CAAC,IAAI,GAAI;gBAC9B,iFAAuB,MAAM,EAAC,KAAK,EAAC,OAAO,GAAG,CAC1C,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Prop, State} from '@stencil/core';\n\nconst helpIcon =\n  '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" fill=\"#5c6575\"><path d=\"M11.925 18q.55 0 .938-.387.387-.388.387-.938 0-.55-.387-.925-.388-.375-.938-.375-.55 0-.925.375t-.375.925q0 .55.375.938.375.387.925.387Zm-.95-3.85h1.95q0-.8.2-1.287.2-.488 1.025-1.288.65-.625 1.025-1.213.375-.587.375-1.437 0-1.425-1.025-2.175Q13.5 6 12.1 6q-1.425 0-2.35.775t-1.275 1.85l1.775.7q.125-.45.55-.975.425-.525 1.275-.525.725 0 1.1.412.375.413.375.888 0 .475-.287.9-.288.425-.713.775-1.075.95-1.325 1.475-.25.525-.25 1.875ZM12 22.2q-2.125 0-3.988-.8-1.862-.8-3.237-2.175Q3.4 17.85 2.6 15.988 1.8 14.125 1.8 12t.8-3.988q.8-1.862 2.175-3.237Q6.15 3.4 8.012 2.6 9.875 1.8 12 1.8t3.988.8q1.862.8 3.237 2.175Q20.6 6.15 21.4 8.012q.8 1.863.8 3.988t-.8 3.988q-.8 1.862-2.175 3.237Q17.85 20.6 15.988 21.4q-1.863.8-3.988.8Zm0-2.275q3.325 0 5.625-2.3t2.3-5.625q0-3.325-2.3-5.625T12 4.075q-3.325 0-5.625 2.3T4.075 12q0 3.325 2.3 5.625t5.625 2.3ZM12 12Z\"/></svg>';\n\n/**\n * Displays a simple help icon. Upon hover or focus, a tooltip will be displayed with help text.\n *\n * ```ts\n * <verdocs-help-icon text=\"Sample help text\" />\n * ```\n */\n@Component({\n  tag: 'verdocs-help-icon',\n  styleUrl: 'verdocs-help-icon.scss',\n  shadow: false,\n})\nexport class VerdocsHelpIcon {\n  iconEl: HTMLDivElement;\n  tooltipEl: HTMLDivElement;\n  popperInstance: Instance;\n\n  /**\n   * Help text to display on hover/focus\n   */\n  @Prop() text: string = '';\n\n  /**\n   * Optional icon to display. If not supplied, a standard help icon will be shown.\n   */\n  @Prop() icon: string = helpIcon;\n\n  @State() containerId = `verdocs-help-icon-${Math.random().toString(36).substring(2, 11)}`;\n\n  componentDidLoad() {\n    this.popperInstance = createPopper(this.iconEl, this.tooltipEl, {\n      // placement: 'top-end',\n      // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n      this.popperInstance = null;\n    }\n  }\n\n  show() {\n    this.tooltipEl?.setAttribute('data-show', '');\n    this.popperInstance?.update().catch(() => {});\n  }\n\n  hide() {\n    this.tooltipEl?.removeAttribute('data-show');\n  }\n\n  render() {\n    return (\n      <Host class={{}}>\n        <div\n          aria-describedby={this.containerId}\n          class=\"icon\"\n          innerHTML={this.icon}\n          onMouseEnter={() => this.show()}\n          onFocus={() => this.show()}\n          onMouseLeave={() => this.hide()}\n          onBlur={() => this.hide()}\n          ref={el => (this.iconEl = el as HTMLDivElement)}\n        />\n        <div\n          id={this.containerId}\n          role=\"tooltip\"\n          class=\"tooltip\"\n          data-popper-placement=\"bottom\"\n          ref={el => (this.tooltipEl = el as HTMLDivElement)}\n        >\n          <span innerHTML={this.text} />\n          <div data-popper-arrow=\"true\" class=\"arrow\" />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-loader/verdocs-loader.js

@@ -22,3 +22,4 @@ export class VerdocsLoader {
         };
     }
 }
+//# sourceMappingURL=verdocs-loader.js.map

package/dist/collection/components/controls/verdocs-loader/verdocs-loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-loader.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-loader/verdocs-loader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AAMH,MAAM,OAAO,aAAa;IACxB,MAAM;QACJ,OAAO,EAAC,IAAI,sDAAG,CAAC;IAClB,CAAC;;;;;;;;CACF","sourcesContent":["import {Component, h, Host} from '@stencil/core';\n\n/**\n * Animated loader placeholder. There are currently no configuration options for this control.\n *\n * ```ts\n * <verdocs-loader />\n * ```\n */\n@Component({\n  tag: 'verdocs-loader',\n  styleUrl: 'verdocs-loader.scss',\n  shadow: false,\n})\nexport class VerdocsLoader {\n  render() {\n    return <Host />;\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-menu-panel/verdocs-menu-panel.js

@@ -157,3 +157,4 @@ export class VerdocsMenuPanel {
             }];
     }
 }
+//# sourceMappingURL=verdocs-menu-panel.js.map

package/dist/collection/components/controls/verdocs-menu-panel/verdocs-menu-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-menu-panel.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-menu-panel/verdocs-menu-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAEpF;;;;;;;;;;GAUG;AAMH,MAAM,OAAO,gBAAgB;;QAGnB,UAAK,GAAY,KAAK,CAAC;QACvB,cAAS,GAAG,4BAA4B,CAAC;QACzC,YAAO,GAAG,oBAAoB,CAAC;oBAKN,OAAO;uBAKtB,IAAI;qBAKN,GAAG;;IAKnB,WAAW,CAAC,CAAM;;QAChB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC;YACrC,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAI,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,IAAI,EAAE,CAAC;QAEZ,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAC5C,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAC/C,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACpC,CAAC;QAED,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC5C,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAC7C,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;QACjC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;QAE5C,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;YACzB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;QAClC,CAAC;QAED,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACpC,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACxC,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;IAC1D,CAAC;IAED,IAAI;;QACF,MAAA,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,0CAAE,MAAM,EAAE,CAAC;QAClD,MAAA,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,0CAAE,MAAM,EAAE,CAAC;IAClD,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;YAClC,8DAAQ,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, EventEmitter, h, Host, Listen, Prop, Event} from '@stencil/core';\n\n/**\n * Display a menu panel in a left or right sidebar. The panel will animate (slide)\n * as it appears, and an background will be shown over the rest of the page. If\n * the background overlay is present, it can be clicked to dismiss the panel.\n *\n * ```ts\n * <verdocs-menu-panel>\n *   <div style=\"padding: 20px;\">Menu Panel</div>\n * </verdocs-menu-panel>\n * ```\n */\n@Component({\n  tag: 'verdocs-menu-panel',\n  styleUrl: 'verdocs-menu-panel.scss',\n  shadow: false,\n})\nexport class VerdocsMenuPanel {\n  private portal: HTMLElement;\n  private element: HTMLElement;\n  private moved: boolean = false;\n  private overlayId = `verdocs-menu-panel-overlay`;\n  private panelId = `verdocs-menu-panel`;\n\n  /**\n   * Which side of the screen to place the panel.\n   */\n  @Prop() side: 'left' | 'right' = 'right';\n\n  /**\n   * Whether to show an overlay over the rest of the page.\n   */\n  @Prop() overlay = true;\n\n  /**\n   * The width of the panel.\n   */\n  @Prop() width = 300;\n\n  @Event() close: EventEmitter<void>;\n\n  @Listen('click', {target: 'document'})\n  handleClick(e: any) {\n    if (!this.element.contains(e.target)) {\n      this.hide();\n      this.close?.emit();\n    }\n  }\n\n  componentWillLoad() {\n    this.hide();\n\n    if (this.overlay) {\n      this.portal = document.createElement('div');\n      this.portal.setAttribute('id', this.overlayId);\n      document.body.append(this.portal);\n    }\n\n    this.portal = document.createElement('div');\n    this.portal.setAttribute('id', this.panelId);\n    this.portal.style.top = `0px`;\n    this.portal.style.bottom = `0px`;\n    this.portal.style.width = `${this.width}px`;\n\n    if (this.side === 'left') {\n      this.portal.style.left = `0px`;\n    } else {\n      this.portal.style.right = `0px`;\n    }\n\n    document.body.append(this.portal);\n  }\n\n  componentDidLoad() {\n    this.portal.appendChild(this.element);\n  }\n\n  disconnectedCallback() {\n    this.moved ? this.portal.remove() : (this.moved = true);\n  }\n\n  hide() {\n    document.getElementById(this.overlayId)?.remove();\n    document.getElementById(this.panelId)?.remove();\n  }\n\n  render() {\n    return (\n      <Host ref={el => (this.element = el)}>\n        <slot />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-organization-card/verdocs-organization-card.js

@@ -85,3 +85,4 @@ export class VerdocsOrganizationCard {
             }];
     }
 }
+//# sourceMappingURL=verdocs-organization-card.js.map

package/dist/collection/components/controls/verdocs-organization-card/verdocs-organization-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-organization-card.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAGtE,yGAAyG;AACzG,6GAA6G;AAE7G,MAAM,YAAY,GAChB,gWAAgW,CAAC;AAEnW;;;;;;GAMG;AAKH,MAAM,OAAO,uBAAuB;;;uBAOf,KAAK;;IAGxB,WAAW;QACT,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAGD,UAAU;QACR,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,MAAM;;QACJ,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACtF,MAAM,YAAY,GAAG,YAAY,CAAC;QAClC,MAAM,QAAQ,GAAG,oBAAoB,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC;QAE5D,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,QAAQ;YACf,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,WAAK,KAAK,EAAC,MAAM,EAAC,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI;YAEzJ,6DAAM,KAAK,EAAC,SAAS,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ;YAEtD,uEAAgB,MAAM,EAAE,QAAQ;gBAC9B,4DAAK,KAAK,EAAC,wBAAwB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAC;oBAClF,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,CACjC,WAAK,KAAK,EAAC,wBAAwB;wBACjC,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG;wBACxD,WAAK,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAO,CAC9C,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;wBACvB,YAAM,KAAK,EAAC,QAAQ;4BAClB,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI,CACzC;wBACP,YAAM,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ,CAChD,CACP;oBAED,4DAAK,KAAK,EAAC,YAAY;wBACrB,4DAAK,KAAK,EAAC,OAAO;4BAChB,0EAAuB;4BACtB,MAAM,CAAC,IAAI,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,KAAI,SAAS,CAAC,EAAE,UAAU,CAAC,CACrE;wBACL,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CACxB,4DAAK,KAAK,EAAC,OAAO;4BAChB,2EAAwB;4BACxB,0DAAG,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,UAAU,IAC5D,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,CACrB,CACA,CACP,CACG,CACF,CACS,CACZ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {format} from 'date-fns';\nimport {Component, Prop, h, Host, Listen, State} from '@stencil/core';\nimport type {IOrganization} from '@verdocs/js-sdk';\n\n// TODO: See what was done in Storybook. Move all SVG icons to a common file that both projects can share\n//  and reduce duplication between components for re-used icons. Also bring icons into Figma for reuse there.\n\nconst BusinessIcon =\n  '<svg xmlns=\"http://www.w3.org/2000/svg\"  focusable=\"false\" aria-hidden=\"true\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\"><path d=\"M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z\"></path></svg>';\n\n/**\n * Display a small summary card describing an organization.\n *\n * ```ts\n * <verdocs-organization-card organization={organization} />\n * ```\n */\n@Component({\n  tag: 'verdocs-organization-card',\n  styleUrl: 'verdocs-organization-card.scss',\n})\nexport class VerdocsOrganizationCard {\n  /**\n   * The organization to display\n   */\n  @Prop() organization: IOrganization;\n\n  @State()\n  hovered: boolean = false;\n\n  @Listen('mouseover')\n  onMouseOver() {\n    this.hovered = true;\n  }\n\n  @Listen('mouseout')\n  onMouseOut() {\n    this.hovered = false;\n  }\n\n  render() {\n    console.log('Rendering org card', this.organization.thumbnail_url, this.organization);\n    const fallbackIcon = BusinessIcon;\n    const portalId = `verdocs-org-card-${this.organization.id}`;\n\n    return (\n      <Host id={portalId}>\n        {this.organization.thumbnail_url ? <img class=\"icon\" src={this.organization.thumbnail_url} alt=\"Logo\" /> : <span class=\"icon\" innerHTML={fallbackIcon} />}\n\n        <span class=\"content\">{this.organization?.name}</span>\n\n        <verdocs-portal anchor={portalId}>\n          <div class=\"verdocs-org-card-popup\" style={{display: this.hovered ? 'block' : 'none'}}>\n            {this.organization.full_logo_url ? (\n              <div class=\"popup-header-with-logo\">\n                <img src={this.organization.full_logo_url} alt=\"Logo\" />\n                <div class=\"title\">{this.organization?.name}</div>\n              </div>\n            ) : (\n              <div class=\"popup-header\">\n                <span class=\"status\">\n                  <span class=\"icon\" innerHTML={fallbackIcon} />\n                </span>\n                <span class=\"title\">{this.organization?.name}</span>\n              </div>\n            )}\n\n            <div class=\"popup-body\">\n              <div class=\"field\">\n                <strong>Joined</strong>\n                {format(new Date(this.organization?.created_at || undefined), 'LLL d, Y')}\n              </div>\n              {this.organization.url && (\n                <div class=\"field\">\n                  <strong>Website</strong>\n                  <a href={this.organization?.url} target=\"_blank\" rel=\"nofollow\">\n                    {this.organization?.url}\n                  </a>\n                </div>\n              )}\n            </div>\n          </div>\n        </verdocs-portal>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-pagination/verdocs-pagination.js

@@ -135,3 +135,4 @@ export class VerdocsQuickFilter {
     }
     static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=verdocs-pagination.js.map