@verdocs/web-sdk 6.2.7 → 6.3.1

package/dist/verdocs-web-sdk/{p-DIFMCsR8.system.js.map → p-BOIq74fd.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-DIFMCsR8.system.js","sources":["src/components/elements/verdocs-search-tabs/verdocs-search-tabs.scss?tag=verdocs-search-tabs","src/components/elements/verdocs-search-tabs/verdocs-search-tabs.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-search-tabs {\n  font-family: $verdocs-primary-font;\n  display: block;\n}\n","import {Component, h, State} from '@stencil/core';\n\nexport type TContentType = 'all' | 'document' | 'template' | 'organization';\n\n@Component({\n  tag: 'verdocs-search-tabs',\n  styleUrl: 'verdocs-search-tabs.scss',\n  shadow: false,\n})\nexport class VerdocsSearchTabs {\n  @State() selected: TContentType = 'all';\n\n  render() {\n    return <div>&nbsp;</div>;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,oBAAoB,GAAG,2bAA2b;;YCS3c,iBAAiB,kCAAA,MAAA;MAL9B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAMW,QAAA,IAAQ,CAAA,QAAA,GAAiB,KAAK;MAKxC;UAHC,MAAM,GAAA;MACJ,QAAA,OAAO,uEAAiB;;;;;;;;;;;"}
+{"version":3,"file":"p-BOIq74fd.system.js","sources":["src/components/elements/verdocs-search-tabs/verdocs-search-tabs.scss?tag=verdocs-search-tabs","src/components/elements/verdocs-search-tabs/verdocs-search-tabs.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-search-tabs {\n  font-family: $verdocs-primary-font;\n  display: block;\n}\n","import {Component, h, State} from '@stencil/core';\n\nexport type TContentType = 'all' | 'document' | 'template' | 'organization';\n\n@Component({\n  tag: 'verdocs-search-tabs',\n  styleUrl: 'verdocs-search-tabs.scss',\n  shadow: false,\n})\nexport class VerdocsSearchTabs {\n  @State() selected: TContentType = 'all';\n\n  render() {\n    return <div>&nbsp;</div>;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,oBAAoB,GAAG,2bAA2b;;YCS3c,iBAAiB,kCAAA,MAAA;MAL9B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAMW,QAAA,IAAQ,CAAA,QAAA,GAAiB,KAAK;MAKxC;UAHC,MAAM,GAAA;MACJ,QAAA,OAAO,uEAAiB;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-Bfjmk6kM.system.js.map → p-BRQAtXgj.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-Bfjmk6kM.system.js","sources":["src/components/embeds/verdocs-build/verdocs-build.scss?tag=verdocs-build","src/components/embeds/verdocs-build/verdocs-build.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-build {\n  display: flex;\n  flex-direction: column;\n  font-family: $verdocs-primary-font;\n\n  .content {\n    flex: 1;\n    gap: 20px;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    //box-shadow: 0 0 7px -3px #000000cc;\n  }\n\n  verdocs-template-attachments,\n  verdocs-template-roles {\n    margin: 20px;\n  }\n\n  verdocs-template-fields {\n    border-top: 1px solid #777777;\n  }\n\n  verdocs-template-attachments {\n    padding: 20px;\n    background: #ffffff;\n  }\n\n  verdocs-template-fields {\n    width: 100%;\n  }\n\n  verdocs-preview {\n    flex: 1;\n  }\n\n  .preview-container {\n    flex-direction: row;\n    display: flex;\n    width: 100%;\n    background-color: #eeeeee;\n    max-height: 100%;\n\n    @media all and (max-width: 450px) {\n      flex-direction: column;\n    }\n  }\n\n  .preview-send-wrapper {\n    display: flex;\n    flex: 0 0 300px;\n    background-color: #ffffff;\n    box-shadow: 1px 1px 6px -2px #0000007f;\n\n    @media all and (max-width: 450px) {\n      flex: 0;\n    }\n  }\n\n  .preview-preview-wrapper {\n    display: flex;\n    flex: 1;\n    justify-content: center;\n    overflow-y: scroll;\n  }\n}\n","import {getTemplate, ICreateEnvelopeRecipientFromTemplate, IRole, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Element, Event, EventEmitter, Host, Watch, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nexport type TVerdocsBuildStep = 'attachments' | 'roles' | 'settings' | 'fields' | 'preview';\n\n/**\n * Display a template building experience. Several event callbacks provide status updates to the\n * parent application to support interface updates.\n *\n * ```ts\n * <verdocs-build\n *   templateId={TEMPLATE_ID} step=\"preview\"\n *   onSend={({detail}) => { console.log('Sent envelope from template', detail) }}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }}\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-build',\n  styleUrl: 'verdocs-build.scss',\n  shadow: false,\n})\nexport class VerdocsBuild {\n  private templateListenerId = null;\n\n  @Element() el!: any;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\n   * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\n   * If it is not specified, `step` will be ignored and the create step will be shown.\n   */\n  @Prop({reflect: true, mutable: true}) templateId: string | null = null;\n\n  /**\n   * The step in the creation process to display.\n   */\n  @Prop({reflect: true, mutable: true}) step: TVerdocsBuildStep = 'preview';\n\n  /**\n   * Event fired if the user clicks Cancel.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the user selects a different step.\n   */\n  @Event({composed: true}) stepChanged: EventEmitter<TVerdocsBuildStep>;\n\n  /**\n   * The user completed the Send form and clicked send.\n   */\n  @Event({composed: true}) send: EventEmitter<{recipients: ICreateEnvelopeRecipientFromTemplate[]; name: string; template_id: string}>;\n\n  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when the template is created by the upload step.\n   */\n  @Event({composed: true}) templateCreated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when roles are updated in the roles step.\n   */\n  @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  @Watch('templateId')\n  onTemplateIdChanged(newTemplateId: string, oldTemplateId: string) {\n    if (!oldTemplateId && newTemplateId && this.step === 'attachments') {\n      this.step = 'preview';\n    }\n\n    this.loadTemplate(newTemplateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  @Watch('step')\n  onStepChanged() {\n    // We reload the template here even if only the step changed in case\n    // we were out of sync before\n    this.loadTemplate(this.templateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n      if (!this.endpoint.session) {\n        console.log('[BUILD] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      if (!this.templateId) {\n        console.log(`[BUILD] No template ID, activating upload mode`);\n        this.step = 'attachments';\n        this.loading = false;\n        return;\n      }\n\n      try {\n        this.loadTemplate(this.templateId).catch(e => console.log('[BUILD] Unable to load template', e));\n      } catch (e) {\n        console.log('[BUILD] Error loading template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    } catch (e) {\n      console.log('[BUILD] Error with builder session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  async loadTemplate(templateId: string) {\n    if (templateId) {\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\n  disconnectedCallback() {\n    console.log('[BUILD] Disconnected');\n    this.unlistenToTemplate();\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  handleCancel() {\n    this.step = 'preview';\n    this.cancel?.emit();\n  }\n\n  async handleTemplateCreated(templateId: string) {\n    await this.loadTemplate(templateId);\n    this.templateId = templateId;\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  async handleRolesUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  async handleTemplateUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  handleAttachmentsNext() {\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  handleRolesNext() {\n    this.step = 'fields';\n    this.stepChanged?.emit('fields');\n  }\n\n  handleStepChanged(step: TVerdocsBuildStep) {\n    this.step = step;\n    this.stepChanged?.emit(step);\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\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        <div class=\"content\">\n          <verdocs-template-build-tabs\n            endpoint={this.endpoint}\n            templateId={this.templateId}\n            step={this.step}\n            onSdkError={e => this.sdkError?.emit(e.detail)}\n            onStepChanged={e => this.handleStepChanged(e.detail)}\n          />\n\n          {this.step === 'attachments' && (\n            <verdocs-template-attachments\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleAttachmentsNext()}\n              onTemplateUpdated={e => this.handleTemplateUpdated(e)}\n            />\n          )}\n\n          {this.step === 'roles' && (\n            <verdocs-template-roles\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleRolesNext()}\n              onRolesUpdated={e => this.handleRolesUpdated(e)}\n            />\n          )}\n\n          {this.step === 'settings' && <verdocs-template-settings templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'fields' && <verdocs-template-fields templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'preview' && (\n            <div class=\"preview-container\">\n              <div class=\"preview-send-wrapper\">\n                <verdocs-send templateId={this.templateId} endpoint={this.endpoint} onSend={e => this.send?.emit(e.detail)} style={{width: '100%'}} />\n              </div>\n              <div class=\"preview-preview-wrapper\">\n                <verdocs-preview templateId={this.templateId} endpoint={this.endpoint} style={{display: 'flex', flex: '1', maxWidth: '1000px'}} />\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"p-BRQAtXgj.system.js","sources":["src/components/embeds/verdocs-build/verdocs-build.scss?tag=verdocs-build","src/components/embeds/verdocs-build/verdocs-build.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-build {\n  display: flex;\n  flex-direction: column;\n  font-family: $verdocs-primary-font;\n\n  .content {\n    flex: 1;\n    gap: 20px;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    //box-shadow: 0 0 7px -3px #000000cc;\n  }\n\n  verdocs-template-attachments,\n  verdocs-template-roles {\n    margin: 20px;\n  }\n\n  verdocs-template-fields {\n    border-top: 1px solid #777777;\n  }\n\n  verdocs-template-attachments {\n    padding: 20px;\n    background: #ffffff;\n  }\n\n  verdocs-template-fields {\n    width: 100%;\n  }\n\n  verdocs-preview {\n    flex: 1;\n  }\n\n  .preview-container {\n    flex-direction: row;\n    display: flex;\n    width: 100%;\n    background-color: #eeeeee;\n    max-height: 100%;\n\n    @media all and (max-width: 450px) {\n      flex-direction: column;\n    }\n  }\n\n  .preview-send-wrapper {\n    display: flex;\n    flex: 0 0 300px;\n    background-color: #ffffff;\n    box-shadow: 1px 1px 6px -2px #0000007f;\n\n    @media all and (max-width: 450px) {\n      flex: 0;\n    }\n  }\n\n  .preview-preview-wrapper {\n    display: flex;\n    flex: 1;\n    justify-content: center;\n    overflow-y: scroll;\n  }\n}\n","import {getTemplate, ICreateEnvelopeRecipientFromTemplate, IRole, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Element, Event, EventEmitter, Host, Watch, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nexport type TVerdocsBuildStep = 'attachments' | 'roles' | 'settings' | 'fields' | 'preview';\n\n/**\n * Display a template building experience. Several event callbacks provide status updates to the\n * parent application to support interface updates.\n *\n * ```ts\n * <verdocs-build\n *   templateId={TEMPLATE_ID} step=\"preview\"\n *   onSend={({detail}) => { console.log('Sent envelope from template', detail) }}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }}\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-build',\n  styleUrl: 'verdocs-build.scss',\n  shadow: false,\n})\nexport class VerdocsBuild {\n  private templateListenerId = null;\n\n  @Element() el!: any;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\n   * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\n   * If it is not specified, `step` will be ignored and the create step will be shown.\n   */\n  @Prop({reflect: true, mutable: true}) templateId: string | null = null;\n\n  /**\n   * The step in the creation process to display.\n   */\n  @Prop({reflect: true, mutable: true}) step: TVerdocsBuildStep = 'preview';\n\n  /**\n   * Event fired if the user clicks Cancel.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the user selects a different step.\n   */\n  @Event({composed: true}) stepChanged: EventEmitter<TVerdocsBuildStep>;\n\n  /**\n   * The user completed the Send form and clicked send.\n   */\n  @Event({composed: true}) send: EventEmitter<{recipients: ICreateEnvelopeRecipientFromTemplate[]; name: string; template_id: string}>;\n\n  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when the template is created by the upload step.\n   */\n  @Event({composed: true}) templateCreated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when roles are updated in the roles step.\n   */\n  @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  @Watch('templateId')\n  onTemplateIdChanged(newTemplateId: string, oldTemplateId: string) {\n    if (!oldTemplateId && newTemplateId && this.step === 'attachments') {\n      this.step = 'preview';\n    }\n\n    this.loadTemplate(newTemplateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  @Watch('step')\n  onStepChanged() {\n    // We reload the template here even if only the step changed in case\n    // we were out of sync before\n    this.loadTemplate(this.templateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n      if (!this.endpoint.session) {\n        console.log('[BUILD] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      if (!this.templateId) {\n        console.log(`[BUILD] No template ID, activating upload mode`);\n        this.step = 'attachments';\n        this.loading = false;\n        return;\n      }\n\n      try {\n        this.loadTemplate(this.templateId).catch(e => console.log('[BUILD] Unable to load template', e));\n      } catch (e) {\n        console.log('[BUILD] Error loading template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    } catch (e) {\n      console.log('[BUILD] Error with builder session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  async loadTemplate(templateId: string) {\n    if (templateId) {\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\n  disconnectedCallback() {\n    console.log('[BUILD] Disconnected');\n    this.unlistenToTemplate();\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  handleCancel() {\n    this.step = 'preview';\n    this.cancel?.emit();\n  }\n\n  async handleTemplateCreated(templateId: string) {\n    await this.loadTemplate(templateId);\n    this.templateId = templateId;\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  async handleRolesUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  async handleTemplateUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  handleAttachmentsNext() {\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  handleRolesNext() {\n    this.step = 'fields';\n    this.stepChanged?.emit('fields');\n  }\n\n  handleStepChanged(step: TVerdocsBuildStep) {\n    this.step = step;\n    this.stepChanged?.emit(step);\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\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        <div class=\"content\">\n          <verdocs-template-build-tabs\n            endpoint={this.endpoint}\n            templateId={this.templateId}\n            step={this.step}\n            onSdkError={e => this.sdkError?.emit(e.detail)}\n            onStepChanged={e => this.handleStepChanged(e.detail)}\n          />\n\n          {this.step === 'attachments' && (\n            <verdocs-template-attachments\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleAttachmentsNext()}\n              onTemplateUpdated={e => this.handleTemplateUpdated(e)}\n            />\n          )}\n\n          {this.step === 'roles' && (\n            <verdocs-template-roles\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleRolesNext()}\n              onRolesUpdated={e => this.handleRolesUpdated(e)}\n            />\n          )}\n\n          {this.step === 'settings' && <verdocs-template-settings templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'fields' && <verdocs-template-fields templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'preview' && (\n            <div class=\"preview-container\">\n              <div class=\"preview-send-wrapper\">\n                <verdocs-send templateId={this.templateId} endpoint={this.endpoint} onSend={e => this.send?.emit(e.detail)} style={{width: '100%'}} />\n              </div>\n              <div class=\"preview-preview-wrapper\">\n                <verdocs-preview templateId={this.templateId} endpoint={this.endpoint} style={{display: 'flex', flex: '1', maxWidth: '1000px'}} />\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-YdG8FzTN.system.js.map → p-BWbfBzAr.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-YdG8FzTN.system.js","sources":["src/components/fields/verdocs-field-payment/verdocs-field-payment.scss?tag=verdocs-field-payment","src/components/fields/verdocs-field-payment/verdocs-field-payment.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-payment {\n  font-family: $verdocs-primary-font;\n  width: 24px;\n  height: 24px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  scroll-margin: 20px 0;\n  border: 1px solid #cfa;\n  background-color: transparent;\n  transform-origin: bottom left;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  button,\n  div {\n    box-sizing: border-box;\n  }\n\n  button {\n    color: rgba(0, 0, 0, 0.87);\n    font-weight: 500;\n    transform-origin: 0 0;\n    //background-color: rgba(225, 255, 255, 0.5);\n    height: 100%;\n    width: 100%;\n    background: none;\n    font-size: 11px;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  input {\n    float: left;\n    font-family: Arial, sans-serif;\n  }\n\n  select {\n    position: absolute;\n    font-family: Arial, sans-serif;\n    background: linear-gradient(55deg, transparent 50%, #333 50%), linear-gradient(125deg, #333 50%, transparent 50%), linear-gradient(to right, transparent, transparent);\n    background-position:\n      calc(100% - 7px) 4px,\n      calc(100% - 3px) 4px,\n      100% 0;\n    background-size:\n      5px 5px,\n      5px 5px,\n      2.5em 2.5em;\n    background-repeat: no-repeat;\n    appearance: none;\n  }\n\n  .frame {\n    width: 100%;\n    height: 100%;\n    background-size: contain;\n    text-align: left;\n\n    img {\n      position: absolute;\n      height: auto;\n      width: 100%;\n    }\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n\n@keyframes verdocs-field-pulse {\n  0% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n  50% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n}\n","import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Method, Fragment} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a signature field. Various field types are supported, including traditional Signature and Initials types as well as\n * input types like text and checkbox.\n */\n@Component({\n  tag: 'verdocs-field-payment',\n  styleUrl: 'verdocs-field-payment.scss',\n  shadow: false,\n})\nexport class VerdocsFieldPayment {\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop({reflect: true}) pagenumber?: number = 1;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n  @State() focused?: boolean = false;\n\n  @Prop() fields: any[];\n  @Prop() pageNum: number;\n  @Prop() roleName: string;\n  @Prop() fieldId: string;\n  @Prop() recipients: any;\n  @Prop() selectedRoleName: string;\n  @Prop() pdfPages: any[];\n  @Prop() currentSignature: string;\n  @Prop() currentSignatureId: string;\n  @Prop() currentInitial: string;\n  @Prop() currentInitialId: string;\n  @Prop() signed: boolean = false;\n\n  @State() preparedMessage: string;\n  @State() signatureUrl: string = '';\n\n  /**\n   * If set, the field will be colored using this index value to select the background color.\n   */\n  @Prop() roleindex?: number = 0;\n\n  mode: string;\n\n  componentWillLoad() {\n    // Load validators\n    // Load fields\n    // Get role names\n    if (this.recipients && this.recipients.length > 0) {\n      const preparer = this.recipients.find((r: any) => r.type === 'preparer');\n      console.log('Found preparer', preparer);\n      if (preparer) {\n        this.preparedMessage = `Prepared by ${preparer['full_name']}`;\n      }\n    }\n  }\n\n  @Method()\n  async focusField() {\n    // We don't have a visible input that we can actually focus on, so we fake it\n    this.focused = true;\n    setTimeout(() => {\n      this.focused = false;\n    }, 500);\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const backgroundColor = getRGBA(index);\n\n    if (!field) {\n      return <Fragment />;\n    }\n\n    if (done) {\n      return <Host class={{done}}>$✓</Host>;\n    }\n\n    return (\n      <Host class={{focused, disabled}} style={{backgroundColor}}>\n        <button class={{hide: this.signed}}>$</button>\n        {this.signed ? <div class=\"frame\" /> : <div style={{display: 'none'}} />}\n        <img width=\"100%\" height=\"100%\" src={this.signatureUrl} alt=\"Payment Icon\" />\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${field.name}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={field.name}\n                  onClose={() => (this.showingProperties = false)}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: fieldname});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={'Check boxes allow the user to select one or more (non-exclusive) options.'}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"p-BWbfBzAr.system.js","sources":["src/components/fields/verdocs-field-payment/verdocs-field-payment.scss?tag=verdocs-field-payment","src/components/fields/verdocs-field-payment/verdocs-field-payment.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-payment {\n  font-family: $verdocs-primary-font;\n  width: 24px;\n  height: 24px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  scroll-margin: 20px 0;\n  border: 1px solid #cfa;\n  background-color: transparent;\n  transform-origin: bottom left;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  button,\n  div {\n    box-sizing: border-box;\n  }\n\n  button {\n    color: rgba(0, 0, 0, 0.87);\n    font-weight: 500;\n    transform-origin: 0 0;\n    //background-color: rgba(225, 255, 255, 0.5);\n    height: 100%;\n    width: 100%;\n    background: none;\n    font-size: 11px;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  input {\n    float: left;\n    font-family: Arial, sans-serif;\n  }\n\n  select {\n    position: absolute;\n    font-family: Arial, sans-serif;\n    background: linear-gradient(55deg, transparent 50%, #333 50%), linear-gradient(125deg, #333 50%, transparent 50%), linear-gradient(to right, transparent, transparent);\n    background-position:\n      calc(100% - 7px) 4px,\n      calc(100% - 3px) 4px,\n      100% 0;\n    background-size:\n      5px 5px,\n      5px 5px,\n      2.5em 2.5em;\n    background-repeat: no-repeat;\n    appearance: none;\n  }\n\n  .frame {\n    width: 100%;\n    height: 100%;\n    background-size: contain;\n    text-align: left;\n\n    img {\n      position: absolute;\n      height: auto;\n      width: 100%;\n    }\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n}\n\n@keyframes verdocs-field-pulse {\n  0% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n  50% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n}\n","import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Method, Fragment} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a signature field. Various field types are supported, including traditional Signature and Initials types as well as\n * input types like text and checkbox.\n */\n@Component({\n  tag: 'verdocs-field-payment',\n  styleUrl: 'verdocs-field-payment.scss',\n  shadow: false,\n})\nexport class VerdocsFieldPayment {\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop({reflect: true}) pagenumber?: number = 1;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n  @State() focused?: boolean = false;\n\n  @Prop() fields: any[];\n  @Prop() pageNum: number;\n  @Prop() roleName: string;\n  @Prop() fieldId: string;\n  @Prop() recipients: any;\n  @Prop() selectedRoleName: string;\n  @Prop() pdfPages: any[];\n  @Prop() currentSignature: string;\n  @Prop() currentSignatureId: string;\n  @Prop() currentInitial: string;\n  @Prop() currentInitialId: string;\n  @Prop() signed: boolean = false;\n\n  @State() preparedMessage: string;\n  @State() signatureUrl: string = '';\n\n  /**\n   * If set, the field will be colored using this index value to select the background color.\n   */\n  @Prop() roleindex?: number = 0;\n\n  mode: string;\n\n  componentWillLoad() {\n    // Load validators\n    // Load fields\n    // Get role names\n    if (this.recipients && this.recipients.length > 0) {\n      const preparer = this.recipients.find((r: any) => r.type === 'preparer');\n      console.log('Found preparer', preparer);\n      if (preparer) {\n        this.preparedMessage = `Prepared by ${preparer['full_name']}`;\n      }\n    }\n  }\n\n  @Method()\n  async focusField() {\n    // We don't have a visible input that we can actually focus on, so we fake it\n    this.focused = true;\n    setTimeout(() => {\n      this.focused = false;\n    }, 500);\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const backgroundColor = getRGBA(index);\n\n    if (!field) {\n      return <Fragment />;\n    }\n\n    if (done) {\n      return <Host class={{done}}>$✓</Host>;\n    }\n\n    return (\n      <Host class={{focused, disabled}} style={{backgroundColor}}>\n        <button class={{hide: this.signed}}>$</button>\n        {this.signed ? <div class=\"frame\" /> : <div style={{display: 'none'}} />}\n        <img width=\"100%\" height=\"100%\" src={this.signatureUrl} alt=\"Payment Icon\" />\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${field.name}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={field.name}\n                  onClose={() => (this.showingProperties = false)}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: fieldname});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={'Check boxes allow the user to select one or more (non-exclusive) options.'}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-tlNLqVnV.system.js.map → p-BhANrWDa.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-tlNLqVnV.system.js","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    console.log('verdocs-toggle componentWillLoad', this.options);\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"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,05CAA05C;;YCwBt6C,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAeW,QAAA,IAAc,CAAA,cAAA,GAAW,CAAC;MA4BpC;UA1BC,iBAAiB,GAAA;;cACf,OAAO,CAAC,GAAG,CAAC,kCAAkC,EAAE,IAAI,CAAC,OAAO,CAAC;MAC7D,QAAA,IAAI,CAAC,cAAc,GAAG,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,gBAAgB,KAAI,CAAC;;UAG3D,MAAM,GAAA;cACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,CAAG,EAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAA,CAAA,CAAG,CAAQ,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAgB,EAAE,KAAa,MACxD,CAAA,CAAA,QAAA,EAAA,EACE,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,EAAE,EACtD,OAAO,EAAE,MAAK;MACZ,gBAAA,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC;MAC7B,gBAAA,IAAI,CAAC,cAAc,GAAG,KAAK;MAC7B,aAAC,GACD,CACH,CAAC,CACE,CACF;;;;;;;;;;;"}
+{"version":3,"file":"p-BhANrWDa.system.js","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    console.log('verdocs-toggle componentWillLoad', this.options);\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"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,05CAA05C;;YCwBt6C,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAeW,QAAA,IAAc,CAAA,cAAA,GAAW,CAAC;MA4BpC;UA1BC,iBAAiB,GAAA;;cACf,OAAO,CAAC,GAAG,CAAC,kCAAkC,EAAE,IAAI,CAAC,OAAO,CAAC;MAC7D,QAAA,IAAI,CAAC,cAAc,GAAG,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,gBAAgB,KAAI,CAAC;;UAG3D,MAAM,GAAA;cACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,CAAG,EAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAA,CAAA,CAAG,CAAQ,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAgB,EAAE,KAAa,MACxD,CAAA,CAAA,QAAA,EAAA,EACE,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,EAAE,EACtD,OAAO,EAAE,MAAK;MACZ,gBAAA,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC;MAC7B,gBAAA,IAAI,CAAC,cAAc,GAAG,KAAK;MAC7B,aAAC,GACD,CACH,CAAC,CACE,CACF;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-DqN8pWd6.system.js.map → p-ByKENGSG.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-DqN8pWd6.system.js","sources":["src/components/controls/verdocs-switch/verdocs-switch.scss?tag=verdocs-switch","src/components/controls/verdocs-switch/verdocs-switch.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-switch {\n  font-family: $primary-font;\n\n  .switch {\n    display: inline-flex;\n    height: 24px;\n    width: 44px;\n    flex-shrink: 0;\n    align-items: center;\n    cursor: pointer;\n    border-radius: 12px;\n    border: transparent;\n    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 150ms;\n  }\n\n  .switch.primary[data-state='checked'] {\n    background: $primary-color;\n  }\n\n  .switch.primary[data-state='unchecked'] {\n    background: $extra-light-border-color;\n  }\n\n  .switch.secondary[data-state='checked'] {\n    background: $secondary-color;\n  }\n\n  .switch.secondary[data-state='unchecked'] {\n    background: $extra-light-border-color;\n  }\n\n  .slider {\n    display: block;\n    width: 20px;\n    height: 20px;\n    border-radius: 20px;\n    background: #ffffff;\n    box-shadow:\n      0 10px 15px -3px rgb(0 0 0 / 0.1),\n      0 4px 6px -4px rgb(0 0 0 / 0.1);\n    transition-property: transform;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 150ms;\n  }\n\n  .slider[data-state='checked'] {\n    transform: translateX(16px);\n  }\n\n  .slider[data-state='unchecked'] {\n    transform: translateX(-4px);\n  }\n\n  .switch.disabled.primary,\n  .switch.disabled.secondary {\n    cursor: not-allowed;\n    background: $dark-disabled-color;\n  }\n}\n","import {Component, Prop, h, EventEmitter, Event} from '@stencil/core';\n\n/**\n * Displays a toggle switch\n *\n * ```ts\n * <verdocs-switch checked={sendReminders} onCheckedChange={setSendReminders} />\n * ```\n */\n@Component({\n  tag: 'verdocs-switch',\n  styleUrl: 'verdocs-switch.scss',\n})\nexport class VerdocsSwitch {\n  @Prop({mutable: true}) checked: boolean = false;\n\n  /**\n   * Select purple or green treatments.\n   */\n  @Prop() theme: 'primary' | 'secondary' = 'primary';\n\n  /**\n   * Should the field be disabled?\n   */\n  @Prop() disabled: boolean = false;\n\n  @Event({composed: true}) checkedChange: EventEmitter<boolean>;\n\n  render() {\n    return (\n      <button\n        value=\"on\"\n        type=\"button\"\n        role=\"switch\"\n        class={`switch ${this.theme} ${this.disabled ? 'disabled' : ''}`}\n        data-state={this.checked ? 'checked' : 'unchecked'}\n        aria-checked={this.checked ? 'checked' : 'unchecked'}\n        onClick={() => {\n          if (!this.disabled) {\n            this.checked = !this.checked;\n            this.checkedChange?.emit(this.checked);\n          }\n        }}\n      >\n        <span data-state={this.checked ? 'checked' : 'unchecked'} class=\"slider\"></span>\n      </button>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,44EAA44E;;YCax5E,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAKyB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;MAE/C;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAA4B,SAAS;MAElD;;MAEG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;MAwBlC;UApBC,MAAM,GAAA;MACJ,QAAA,QACE,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAU,OAAA,EAAA,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAA,YAAA,EACpD,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EAAA,cAAA,EACpC,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EACpD,OAAO,EAAE,MAAK;;MACZ,gBAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAClB,oBAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO;MAC5B,oBAAA,CAAA,EAAA,GAAA,IAAI,CAAC,aAAa,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;;MAE1C,aAAC,EAAA,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,YAAA,EAAkB,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EAAE,KAAK,EAAC,QAAQ,EAAQ,CAAA,CACzE;;;;;;;;;;;"}
+{"version":3,"file":"p-ByKENGSG.system.js","sources":["src/components/controls/verdocs-switch/verdocs-switch.scss?tag=verdocs-switch","src/components/controls/verdocs-switch/verdocs-switch.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-switch {\n  font-family: $primary-font;\n\n  .switch {\n    display: inline-flex;\n    height: 24px;\n    width: 44px;\n    flex-shrink: 0;\n    align-items: center;\n    cursor: pointer;\n    border-radius: 12px;\n    border: transparent;\n    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 150ms;\n  }\n\n  .switch.primary[data-state='checked'] {\n    background: $primary-color;\n  }\n\n  .switch.primary[data-state='unchecked'] {\n    background: $extra-light-border-color;\n  }\n\n  .switch.secondary[data-state='checked'] {\n    background: $secondary-color;\n  }\n\n  .switch.secondary[data-state='unchecked'] {\n    background: $extra-light-border-color;\n  }\n\n  .slider {\n    display: block;\n    width: 20px;\n    height: 20px;\n    border-radius: 20px;\n    background: #ffffff;\n    box-shadow:\n      0 10px 15px -3px rgb(0 0 0 / 0.1),\n      0 4px 6px -4px rgb(0 0 0 / 0.1);\n    transition-property: transform;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 150ms;\n  }\n\n  .slider[data-state='checked'] {\n    transform: translateX(16px);\n  }\n\n  .slider[data-state='unchecked'] {\n    transform: translateX(-4px);\n  }\n\n  .switch.disabled.primary,\n  .switch.disabled.secondary {\n    cursor: not-allowed;\n    background: $dark-disabled-color;\n  }\n}\n","import {Component, Prop, h, EventEmitter, Event} from '@stencil/core';\n\n/**\n * Displays a toggle switch\n *\n * ```ts\n * <verdocs-switch checked={sendReminders} onCheckedChange={setSendReminders} />\n * ```\n */\n@Component({\n  tag: 'verdocs-switch',\n  styleUrl: 'verdocs-switch.scss',\n})\nexport class VerdocsSwitch {\n  @Prop({mutable: true}) checked: boolean = false;\n\n  /**\n   * Select purple or green treatments.\n   */\n  @Prop() theme: 'primary' | 'secondary' = 'primary';\n\n  /**\n   * Should the field be disabled?\n   */\n  @Prop() disabled: boolean = false;\n\n  @Event({composed: true}) checkedChange: EventEmitter<boolean>;\n\n  render() {\n    return (\n      <button\n        value=\"on\"\n        type=\"button\"\n        role=\"switch\"\n        class={`switch ${this.theme} ${this.disabled ? 'disabled' : ''}`}\n        data-state={this.checked ? 'checked' : 'unchecked'}\n        aria-checked={this.checked ? 'checked' : 'unchecked'}\n        onClick={() => {\n          if (!this.disabled) {\n            this.checked = !this.checked;\n            this.checkedChange?.emit(this.checked);\n          }\n        }}\n      >\n        <span data-state={this.checked ? 'checked' : 'unchecked'} class=\"slider\"></span>\n      </button>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,44EAA44E;;YCax5E,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAKyB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;MAE/C;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAA4B,SAAS;MAElD;;MAEG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;MAwBlC;UApBC,MAAM,GAAA;MACJ,QAAA,QACE,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAU,OAAA,EAAA,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAA,YAAA,EACpD,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EAAA,cAAA,EACpC,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EACpD,OAAO,EAAE,MAAK;;MACZ,gBAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAClB,oBAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO;MAC5B,oBAAA,CAAA,EAAA,GAAA,IAAI,CAAC,aAAa,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;;MAE1C,aAAC,EAAA,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,YAAA,EAAkB,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,WAAW,EAAE,KAAK,EAAC,QAAQ,EAAQ,CAAA,CACzE;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-D6lkIXxV.system.js.map → p-CD1Gqdjg.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-D6lkIXxV.system.js","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"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,8wDAA8wD;;MCG7yD,MAAM,WAAW,GAAG,CAAA,gTAAA,CAAkT;MAEtU,MAAM,SAAS,GAAG,CAAA,kRAAA,CAAoR;MAEtS,MAAM,SAAS,GAAG,CAAA,mSAAA,CAAqS;MAEvT,MAAM,QAAQ,GAAG,CAAA,soEAAA,CAAwoE;YAU5oE,mBAAmB,oCAAA,MAAA;;;;UAM9B,MAAM,GAAA;;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAIH,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAQ,EAC9C,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,UAAU,EAAA,EAAE,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,KAAI,QAAQ,CAAQ,EAE5E,CAAM,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,UAAU,EAAA,EACnB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,EAAI,CAAA,EAC1C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAQ,CACnD,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,EAAI,CAAA,EAC3C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAA,EAAE,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,MAAA,IAAI,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,SAAS,0CAAG,CAAC,CAAC,0CAAE,KAAK,KAAI,CAAC,CAAQ,CAClE,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,EAAI,CAAA,EAC3C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAQ,CAC9C,EAEN,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAC,SAAS,EAAE,WAAW,EAAI,CAAA,CACxD,CACD;;;;;;;;;;;"}
+{"version":3,"file":"p-CD1Gqdjg.system.js","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"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,8wDAA8wD;;MCG7yD,MAAM,WAAW,GAAG,CAAA,gTAAA,CAAkT;MAEtU,MAAM,SAAS,GAAG,CAAA,kRAAA,CAAoR;MAEtS,MAAM,SAAS,GAAG,CAAA,mSAAA,CAAqS;MAEvT,MAAM,QAAQ,GAAG,CAAA,soEAAA,CAAwoE;YAU5oE,mBAAmB,oCAAA,MAAA;;;;UAM9B,MAAM,GAAA;;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAIH,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAQ,EAC9C,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,UAAU,EAAA,EAAE,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,KAAI,QAAQ,CAAQ,EAE5E,CAAM,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,UAAU,EAAA,EACnB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,EAAI,CAAA,EAC1C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAQ,CACnD,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,EAAI,CAAA,EAC3C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAA,EAAE,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,MAAA,IAAI,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,SAAS,0CAAG,CAAC,CAAC,0CAAE,KAAK,KAAI,CAAC,CAAQ,CAClE,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,EAAI,CAAA,EAC3C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAQ,CAC9C,EAEN,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAC,SAAS,EAAE,WAAW,EAAI,CAAA,CACxD,CACD;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-BLUIpLYQ.system.js.map → p-CJEtk8yq.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-BLUIpLYQ.system.js","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.document_id === this.documentId && 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  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\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"],"names":[],"mappings":"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"}
+{"version":3,"file":"p-CJEtk8yq.system.js","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.document_id === this.documentId && 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  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\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"],"names":[],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-BFiBadxx.system.js.map → p-CKOnL51R.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-BFiBadxx.system.js","sources":["src/components/controls/verdocs-organization-card/verdocs-organization-card.scss?tag=verdocs-organization-card","src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx","src/components/controls/verdocs-portal/verdocs-portal.scss?tag=verdocs-portal","src/components/controls/verdocs-portal/verdocs-portal.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-organization-card {\n  font-family: $primary-font;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  border: 1px solid $light-border-color;\n  background: #ffffff;\n  border-radius: 8px;\n  padding: 7px 15px;\n\n  .icon {\n    flex: 0;\n    height: 24px;\n    width: 24px;\n    margin: 0 14px 0 0;\n\n    svg {\n      fill: $icon-color;\n      height: 24px;\n      width: 24px;\n    }\n  }\n\n  .content {\n    margin-top: 2px;\n  }\n}\n\n.verdocs-org-card-popup {\n  font-family: $primary-font;\n  background: #ffffff;\n  border-radius: 10px;\n  width: 326px;\n  padding: 20px 40px 0 40px;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  border: 1px solid $light-border-color;\n\n  .popup-header-with-logo {\n    display: flex;\n    flex: 0;\n    gap: 20px;\n    flex-direction: column;\n    margin: 0 0 20px 0;\n    font-size: 21px;\n    line-height: 16px;\n    color: $secondary-color;\n\n    img {\n      max-width: 300px;\n      max-height: 50px;\n    }\n  }\n\n  .popup-header {\n    display: flex;\n    flex: 0;\n    gap: 20px;\n    flex-direction: row;\n    align-items: flex-end;\n    margin: 0 0 20px 0;\n    font-size: 21px;\n    line-height: 16px;\n    color: $secondary-color;\n  }\n\n  .popup-body {\n    display: flex;\n    flex-direction: column;\n    font-size: 14px;\n    text-transform: uppercase;\n  }\n\n  .status {\n    transform: scale(1.5);\n    width: 24px;\n    height: 24px;\n  }\n\n  .field {\n    margin: 0 0 20px 0;\n\n    strong {\n      color: $label-color-very-light;\n      display: block;\n      margin: 0 0 5px 0;\n    }\n\n    a {\n      color: $verdocs-purple;\n      text-transform: uppercase;\n    }\n  }\n}\n","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: Partial<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","@import '../../../theme.scss';\n\nverdocs-portal {\n}\n","import {Component, EventEmitter, h, Host, Listen, Prop, Event} from '@stencil/core';\n\nconst Z_INDEX = '10001';\n\n/**\n * Display a child component in a \"portal\", popping it out of the main DOM tree\n * to allow it to escape the bounds set by its parent.\n * @credit https://github.com/tomas-teston/stencil-portal for the basic\n * technique. This has been altered in a few ways to make it more friendly\n * to cases where there may be multiple portals on the page and provide more\n * alignment options for the child to be displayed.\n *\n * ```ts\n * <div style=\"padding: 40px\">\n *     <div id=\"sample-tooltip\" style=\"border: 1px solid green; padding: 3px 10px;\">\n *       Tooltip Anchor\n *       <verdocs-portal anchor=\"sample-tooltip\" .align=${align} .voffset=${voffset}>\n *         <div style=\"border: 1px solid red; padding: 3px 10px;\">Tooltip</div>\n *       </verdocs-portal>\n *     </div>\n *   </div>\n * ```\n */\n@Component({\n  tag: 'verdocs-portal',\n  styleUrl: 'verdocs-portal.scss',\n  shadow: false,\n})\nexport class VerdocsPortal {\n  private portal: HTMLElement;\n  private element: HTMLElement;\n  private moved: boolean = false;\n\n  /**\n   * Unique ID of the parent element to anchor to.\n   */\n  @Prop() anchor: string;\n\n  /**\n   * Vertical offset from the parent.\n   */\n  @Prop() voffset: number = 0;\n\n  @Event() clickAway: EventEmitter<void>;\n\n  @Listen('scroll', {target: 'window', capture: true})\n  handleScroll() {\n    this.calculatePosition();\n  }\n\n  @Listen('resize', {target: 'window'})\n  handleResize() {\n    this.calculatePosition();\n  }\n\n  @Listen('click', {target: 'document'})\n  handleClick(e) {\n    const closest = e.target.closest('.verdocs-portal');\n    if (!this.element.contains(e.target) && !closest) {\n      this.clickAway?.emit();\n    }\n\n    // Temporary hack to dismiss portals-in-portals, which right now is pretty much just\n    // multiselect.\n    document.querySelectorAll('.verdocs-multiselect-dropdown').forEach(el => el.remove());\n  }\n\n  private calculateLeft() {\n    const anchorEl = document.getElementById(this.anchor);\n    if (!anchorEl) return 0;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n\n    const rightOfViewportWithScroll = document.documentElement.clientWidth + document.documentElement.scrollLeft;\n    const leftOfPopup = Math.max(anchorRect.left, 0);\n    // Old centering logic, disabled temporarily\n    //    Math.max(anchorRect.left - this.portal.offsetWidth / 2 + anchorRect.width / 2, 0);\n    // Old right-align logic, disabled temporarily\n    //    Math.max(anchorRect.left + anchorRect.width - this.portal.offsetWidth, 0);\n    const popupWidth = this.element?.offsetWidth || 400;\n    const offRightEdge = leftOfPopup + popupWidth > rightOfViewportWithScroll;\n\n    return offRightEdge ? rightOfViewportWithScroll - popupWidth - 20 : leftOfPopup;\n  }\n\n  private calculateTop() {\n    const anchorEl = document.getElementById(this.anchor);\n    if (!anchorEl) return 0;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n\n    const bottomOfViewportWithScroll = document.documentElement.clientHeight + document.documentElement.scrollTop;\n    const topOfPopup = anchorRect.bottom + this.voffset + document.documentElement.scrollTop;\n    const popupHeight = this.element?.offsetHeight || 300;\n    const offBottomEdge = topOfPopup + popupHeight > bottomOfViewportWithScroll;\n\n    return offBottomEdge ? topOfPopup - popupHeight - anchorRect.height : topOfPopup;\n  }\n\n  private calculatePosition() {\n    this.portal.style.top = `${this.calculateTop()}px`;\n    this.portal.style.left = `${this.calculateLeft()}px`;\n  }\n\n  componentWillLoad() {\n    const id = `${this.anchor}-portal`;\n    document.getElementById(id)?.remove();\n\n    this.portal = document.createElement('div');\n    this.portal.setAttribute('id', id);\n    this.portal.style.zIndex = Z_INDEX;\n    this.portal.style.position = 'absolute';\n    this.portal.className = 'verdocs-portal-wrapper';\n    document.body.append(this.portal);\n  }\n\n  componentDidLoad() {\n    this.portal.appendChild(this.element);\n    this.calculatePosition();\n  }\n\n  disconnectedCallback() {\n    this.moved ? this.portal.remove() : (this.moved = true);\n  }\n\n  render() {\n    return (\n      <Host ref={el => (this.element = el)} class=\"verdocs-portal\">\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"names":["format"],"mappings":"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"}
+{"version":3,"file":"p-CKOnL51R.system.js","sources":["src/components/controls/verdocs-organization-card/verdocs-organization-card.scss?tag=verdocs-organization-card","src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx","src/components/controls/verdocs-portal/verdocs-portal.scss?tag=verdocs-portal","src/components/controls/verdocs-portal/verdocs-portal.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-organization-card {\n  font-family: $primary-font;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  border: 1px solid $light-border-color;\n  background: #ffffff;\n  border-radius: 8px;\n  padding: 7px 15px;\n\n  .icon {\n    flex: 0;\n    height: 24px;\n    width: 24px;\n    margin: 0 14px 0 0;\n\n    svg {\n      fill: $icon-color;\n      height: 24px;\n      width: 24px;\n    }\n  }\n\n  .content {\n    margin-top: 2px;\n  }\n}\n\n.verdocs-org-card-popup {\n  font-family: $primary-font;\n  background: #ffffff;\n  border-radius: 10px;\n  width: 326px;\n  padding: 20px 40px 0 40px;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  border: 1px solid $light-border-color;\n\n  .popup-header-with-logo {\n    display: flex;\n    flex: 0;\n    gap: 20px;\n    flex-direction: column;\n    margin: 0 0 20px 0;\n    font-size: 21px;\n    line-height: 16px;\n    color: $secondary-color;\n\n    img {\n      max-width: 300px;\n      max-height: 50px;\n    }\n  }\n\n  .popup-header {\n    display: flex;\n    flex: 0;\n    gap: 20px;\n    flex-direction: row;\n    align-items: flex-end;\n    margin: 0 0 20px 0;\n    font-size: 21px;\n    line-height: 16px;\n    color: $secondary-color;\n  }\n\n  .popup-body {\n    display: flex;\n    flex-direction: column;\n    font-size: 14px;\n    text-transform: uppercase;\n  }\n\n  .status {\n    transform: scale(1.5);\n    width: 24px;\n    height: 24px;\n  }\n\n  .field {\n    margin: 0 0 20px 0;\n\n    strong {\n      color: $label-color-very-light;\n      display: block;\n      margin: 0 0 5px 0;\n    }\n\n    a {\n      color: $verdocs-purple;\n      text-transform: uppercase;\n    }\n  }\n}\n","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: Partial<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","@import '../../../theme.scss';\n\nverdocs-portal {\n}\n","import {Component, EventEmitter, h, Host, Listen, Prop, Event} from '@stencil/core';\n\nconst Z_INDEX = '10001';\n\n/**\n * Display a child component in a \"portal\", popping it out of the main DOM tree\n * to allow it to escape the bounds set by its parent.\n * @credit https://github.com/tomas-teston/stencil-portal for the basic\n * technique. This has been altered in a few ways to make it more friendly\n * to cases where there may be multiple portals on the page and provide more\n * alignment options for the child to be displayed.\n *\n * ```ts\n * <div style=\"padding: 40px\">\n *     <div id=\"sample-tooltip\" style=\"border: 1px solid green; padding: 3px 10px;\">\n *       Tooltip Anchor\n *       <verdocs-portal anchor=\"sample-tooltip\" .align=${align} .voffset=${voffset}>\n *         <div style=\"border: 1px solid red; padding: 3px 10px;\">Tooltip</div>\n *       </verdocs-portal>\n *     </div>\n *   </div>\n * ```\n */\n@Component({\n  tag: 'verdocs-portal',\n  styleUrl: 'verdocs-portal.scss',\n  shadow: false,\n})\nexport class VerdocsPortal {\n  private portal: HTMLElement;\n  private element: HTMLElement;\n  private moved: boolean = false;\n\n  /**\n   * Unique ID of the parent element to anchor to.\n   */\n  @Prop() anchor: string;\n\n  /**\n   * Vertical offset from the parent.\n   */\n  @Prop() voffset: number = 0;\n\n  @Event() clickAway: EventEmitter<void>;\n\n  @Listen('scroll', {target: 'window', capture: true})\n  handleScroll() {\n    this.calculatePosition();\n  }\n\n  @Listen('resize', {target: 'window'})\n  handleResize() {\n    this.calculatePosition();\n  }\n\n  @Listen('click', {target: 'document'})\n  handleClick(e) {\n    const closest = e.target.closest('.verdocs-portal');\n    if (!this.element.contains(e.target) && !closest) {\n      this.clickAway?.emit();\n    }\n\n    // Temporary hack to dismiss portals-in-portals, which right now is pretty much just\n    // multiselect.\n    document.querySelectorAll('.verdocs-multiselect-dropdown').forEach(el => el.remove());\n  }\n\n  private calculateLeft() {\n    const anchorEl = document.getElementById(this.anchor);\n    if (!anchorEl) return 0;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n\n    const rightOfViewportWithScroll = document.documentElement.clientWidth + document.documentElement.scrollLeft;\n    const leftOfPopup = Math.max(anchorRect.left, 0);\n    // Old centering logic, disabled temporarily\n    //    Math.max(anchorRect.left - this.portal.offsetWidth / 2 + anchorRect.width / 2, 0);\n    // Old right-align logic, disabled temporarily\n    //    Math.max(anchorRect.left + anchorRect.width - this.portal.offsetWidth, 0);\n    const popupWidth = this.element?.offsetWidth || 400;\n    const offRightEdge = leftOfPopup + popupWidth > rightOfViewportWithScroll;\n\n    return offRightEdge ? rightOfViewportWithScroll - popupWidth - 20 : leftOfPopup;\n  }\n\n  private calculateTop() {\n    const anchorEl = document.getElementById(this.anchor);\n    if (!anchorEl) return 0;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n\n    const bottomOfViewportWithScroll = document.documentElement.clientHeight + document.documentElement.scrollTop;\n    const topOfPopup = anchorRect.bottom + this.voffset + document.documentElement.scrollTop;\n    const popupHeight = this.element?.offsetHeight || 300;\n    const offBottomEdge = topOfPopup + popupHeight > bottomOfViewportWithScroll;\n\n    return offBottomEdge ? topOfPopup - popupHeight - anchorRect.height : topOfPopup;\n  }\n\n  private calculatePosition() {\n    this.portal.style.top = `${this.calculateTop()}px`;\n    this.portal.style.left = `${this.calculateLeft()}px`;\n  }\n\n  componentWillLoad() {\n    const id = `${this.anchor}-portal`;\n    document.getElementById(id)?.remove();\n\n    this.portal = document.createElement('div');\n    this.portal.setAttribute('id', id);\n    this.portal.style.zIndex = Z_INDEX;\n    this.portal.style.position = 'absolute';\n    this.portal.className = 'verdocs-portal-wrapper';\n    document.body.append(this.portal);\n  }\n\n  componentDidLoad() {\n    this.portal.appendChild(this.element);\n    this.calculatePosition();\n  }\n\n  disconnectedCallback() {\n    this.moved ? this.portal.remove() : (this.moved = true);\n  }\n\n  render() {\n    return (\n      <Host ref={el => (this.element = el)} class=\"verdocs-portal\">\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"names":["format"],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-qmFLckgf.system.js.map → p-CPejf19w.system.js.map}

@@ -1 +1 @@
-{"version":3,"file":"p-qmFLckgf.system.js","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, toggleTemplateStar, 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    toggleTemplateStar(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"],"names":[],"mappings":";;;;;;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,4mCAA4mC;;MCI3oC,MAAM,eAAe,GAAG,CAAA,qhBAAA,CAAuhB;MAE/iB,MAAM,aAAa,GAAG,CAAA,0aAAA,CAA4a;YASrb,mBAAmB,oCAAA,MAAA;MAJhC,IAAA,WAAA,CAAA,OAAA,EAAA;;;;MAKE;;MAEG;MACK,QAAA,IAAA,CAAA,QAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE;MAmBvD,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;MAuC1B;MArCC,IAAA,MAAM,iBAAiB,GAAA;MACrB,QAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;MAE3B,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;MAC1B,YAAA,OAAO,CAAC,GAAG,CAAC,mCAAmC,CAAC;kBAChD;;;MAIJ,IAAA,MAAM,CAAC,CAAM,EAAA;cACX,CAAC,CAAC,eAAe,EAAE;MACnB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;cACpB,kBAAkB,CAAC,eAAe,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;mBAC9D,IAAI,CAAC,CAAC,IAAG;MACR,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;kBACrB,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY;MAC3C,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,gBAAA,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;MAC5B,gBAAA,OAAO,EAAE,CAAC,CAAC,YAAY,GAAG,CAAC;sBAC3B,KAAK,EAAE,CAAC,CAAC,YAAY;MACtB,aAAA,CAAC;MACJ,SAAC;mBACA,KAAK,CAAC,CAAC,IAAG;MACT,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;kBACrB,OAAO,CAAC,GAAG,CAAC,qCAAqC,EAAE,CAAC,CAAC,OAAO,CAAC;MAC7D,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;MACvB,SAAC,CAAC;;UAGN,MAAM,GAAA;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAQ,KAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAE,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,aAAa,GAAG,eAAe,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAI,CAAA,EAChK,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,IAAI,IAAI,CAAO,CACxD;;;;;;;;;;;"}
+{"version":3,"file":"p-CPejf19w.system.js","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, toggleTemplateStar, 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    toggleTemplateStar(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"],"names":[],"mappings":";;;;;;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,4mCAA4mC;;MCI3oC,MAAM,eAAe,GAAG,CAAA,qhBAAA,CAAuhB;MAE/iB,MAAM,aAAa,GAAG,CAAA,0aAAA,CAA4a;YASrb,mBAAmB,oCAAA,MAAA;MAJhC,IAAA,WAAA,CAAA,OAAA,EAAA;;;;MAKE;;MAEG;MACK,QAAA,IAAA,CAAA,QAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE;MAmBvD,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;MAuC1B;MArCC,IAAA,MAAM,iBAAiB,GAAA;MACrB,QAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;MAE3B,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;MAC1B,YAAA,OAAO,CAAC,GAAG,CAAC,mCAAmC,CAAC;kBAChD;;;MAIJ,IAAA,MAAM,CAAC,CAAM,EAAA;cACX,CAAC,CAAC,eAAe,EAAE;MACnB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;cACpB,kBAAkB,CAAC,eAAe,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;mBAC9D,IAAI,CAAC,CAAC,IAAG;MACR,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;kBACrB,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY;MAC3C,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,gBAAA,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;MAC5B,gBAAA,OAAO,EAAE,CAAC,CAAC,YAAY,GAAG,CAAC;sBAC3B,KAAK,EAAE,CAAC,CAAC,YAAY;MACtB,aAAA,CAAC;MACJ,SAAC;mBACA,KAAK,CAAC,CAAC,IAAG;MACT,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;kBACrB,OAAO,CAAC,GAAG,CAAC,qCAAqC,EAAE,CAAC,CAAC,OAAO,CAAC;MAC7D,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;MACvB,SAAC,CAAC;;UAGN,MAAM,GAAA;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAQ,KAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAE,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,aAAa,GAAG,eAAe,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAI,CAAA,EAChK,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,IAAI,IAAI,CAAO,CACxD;;;;;;;;;;;"}