@hubsync/esign-web-sdk 6.9.24 → 6.9.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/cjs/verdocs-field-attachment_11.cjs.entry.js +2 -2
  2. package/dist/collection/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.js +1 -1
  3. package/dist/collection/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.js.map +1 -1
  4. package/dist/collection/components/fields/verdocs-field-radio/verdocs-field-radio.js +1 -1
  5. package/dist/collection/components/fields/verdocs-field-radio/verdocs-field-radio.js.map +1 -1
  6. package/dist/components/{p-DZrvJ_QT.js → p-1v1nkPcE.js} +5 -5
  7. package/dist/components/{p-DZrvJ_QT.js.map → p-1v1nkPcE.js.map} +1 -1
  8. package/dist/components/{p-Dolz_jo3.js → p-Bf1POXi1.js} +3 -3
  9. package/dist/components/p-Bf1POXi1.js.map +1 -0
  10. package/dist/components/{p-yM0XEtHG.js → p-DbpqTdhn.js} +5 -5
  11. package/dist/components/{p-yM0XEtHG.js.map → p-DbpqTdhn.js.map} +1 -1
  12. package/dist/components/{p-DemYa78C.js → p-DrmZLNU5.js} +4 -4
  13. package/dist/components/{p-DemYa78C.js.map → p-DrmZLNU5.js.map} +1 -1
  14. package/dist/components/{p-CoX-UPik.js → p-wsUzEIVY.js} +3 -3
  15. package/dist/components/p-wsUzEIVY.js.map +1 -0
  16. package/dist/components/verdocs-build.js +5 -5
  17. package/dist/components/verdocs-field-checkbox.js +1 -1
  18. package/dist/components/verdocs-field-radio.js +1 -1
  19. package/dist/components/verdocs-preview.js +1 -1
  20. package/dist/components/verdocs-template-document-page.js +1 -1
  21. package/dist/components/verdocs-template-fields.js +1 -1
  22. package/dist/esm/verdocs-field-attachment_11.entry.js +2 -2
  23. package/dist/esm-es5/verdocs-field-attachment_11.entry.js +1 -1
  24. package/dist/esm-es5/verdocs-field-attachment_11.entry.js.map +1 -1
  25. package/dist/verdocs-web-sdk/p-B8zpaHu-.system.js +1 -1
  26. package/dist/verdocs-web-sdk/p-W5scp_Cb.system.js.map +1 -0
  27. package/dist/verdocs-web-sdk/p-b05f5cd5.entry.js +2 -0
  28. package/dist/verdocs-web-sdk/p-b05f5cd5.entry.js.map +1 -0
  29. package/dist/verdocs-web-sdk/p-b0f1ff28.system.entry.js +2 -0
  30. package/dist/verdocs-web-sdk/p-b0f1ff28.system.entry.js.map +1 -0
  31. package/dist/verdocs-web-sdk/verdocs-web-sdk.esm.js +1 -1
  32. package/package.json +1 -1
  33. package/dist/components/p-CoX-UPik.js.map +0 -1
  34. package/dist/components/p-Dolz_jo3.js.map +0 -1
  35. package/dist/verdocs-web-sdk/p-2ebc769e.entry.js +0 -2
  36. package/dist/verdocs-web-sdk/p-2ebc769e.entry.js.map +0 -1
  37. package/dist/verdocs-web-sdk/p-6d41df5d.system.entry.js +0 -2
  38. package/dist/verdocs-web-sdk/p-6d41df5d.system.entry.js.map +0 -1
  39. package/dist/verdocs-web-sdk/p-BUFQbxzf.system.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"p-yM0XEtHG.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-preview/verdocs-preview.scss?tag=verdocs-preview","src/components/embeds/verdocs-preview/verdocs-preview.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-preview {\n font-family: $verdocs-primary-font;\n display: flex;\n padding: 15px;\n row-gap: 15px;\n min-height: 200px;\n position: relative;\n align-items: center;\n box-sizing: border-box;\n flex-direction: column;\n\n div,\n canvas {\n box-sizing: border-box;\n }\n}\n","import interact from 'interactjs';\nimport {getTemplate, integerSequence, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Element, Event, EventEmitter, Host, Component, Prop, h, State, Fragment, Watch} from '@stencil/core';\nimport {renderDocumentField} from '../../../utils/utils';\nimport {IDocumentPageInfo} from '../../../utils/Types';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a template preview experience. This will display the template's attached\n * documents with signing fields overlaid on each page. Fields will be color-coded\n * by recipient, and will be read-only (cannot be filled, moved, or altered).\n *\n * ```ts\n * <verdocs-preview\n * templateId={TEMPLATE_ID}\n * onSdkError={({ detail }) => { console.log('SDK error', detail) }\n * />\n * ```\n */\n@Component({\n tag: 'verdocs-preview',\n styleUrl: 'verdocs-preview.scss',\n shadow: false,\n})\nexport class VerdocsPreview {\n private templateListenerId = null;\n private renderedPages: Record<string, IDocumentPageInfo> = {};\n\n @Element() hostEl: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The ID of the template to create the document from.\n */\n @Prop() templateId: string | null = null;\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() loading = true;\n @State() template: ITemplate | null = null;\n\n disconnectedCallback() {\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 @Watch('templateId')\n onTemplateIdChanged(newTemplateId: string) {\n console.log('[PREVIEW] Template ID changed', newTemplateId);\n this.listenToTemplate();\n }\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n if (!this.endpoint.session) {\n console.log('[PREVIEW] Unable to start builder session, must be authenticated');\n return;\n }\n\n if (!this.templateId) {\n console.log(`[PREVIEW] Missing required template ID ${this.templateId}`);\n return;\n }\n\n this.listenToTemplate();\n } catch (e) {\n console.log('[PREVIEW] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n componentDidRender() {\n // Defensive hack: fields rendered in other tabs (e.g. the builder's Fields tab) may share DOM\n // IDs with fields shown here, and interact.js — being vanilla JS — is unaware of Stencil's\n // re-renders. Unbind any drag/resize handlers on fields inside our own subtree after each\n // render so they stay non-interactive in preview mode. Scope to hostEl so we don't clobber\n // handlers on fields belonging to a sibling component during brief tab-switch overlaps.\n this.hostEl?.querySelectorAll('.verdocs-field').forEach(el => {\n interact(el as HTMLElement).unset();\n });\n }\n\n handlePageRendered(e: any) {\n const pageInfo = e.detail as IDocumentPageInfo;\n this.renderedPages[`${pageInfo.documentId}:${pageInfo.pageNumber}`] = pageInfo;\n\n const fields = (this.template?.fields || []).filter(field => {\n // Templates created on the new builder have document_id set, but old ones may not.\n // If document_id is missing, we assume it's for the first document or use legacy logic.\n // However, for this fix, we primarily care about multi-doc templates which should have IDs.\n if (field['document_id']) {\n return field['document_id'] === pageInfo.documentId && field.page === pageInfo.pageNumber;\n }\n return field.page === pageInfo.pageNumber;\n });\n\n // console.log('[PREVIEW] Page rendered', pageInfo, fields);\n fields.forEach(field => renderDocumentField('template', field, pageInfo, {disabled: true, editable: false, draggable: false}));\n }\n\n render() {\n if (this.loading) {\n return (\n <Host>\n <verdocs-loader />\n </Host>\n );\n }\n\n return (\n <Host>\n {(this.template?.documents || []).map(document => {\n const pageNumbers = integerSequence(1, document.pages);\n return (\n <Fragment>\n {pageNumbers.map(pageNumber => {\n const pageSize = document.page_sizes?.[pageNumber] || {width: 612, height: 792};\n\n return (\n <verdocs-template-document-page\n templateId={document.template_id}\n documentId={document.id}\n pageNumber={pageNumber}\n disabled={true}\n editable={false}\n done={false}\n virtualWidth={pageSize.width}\n virtualHeight={pageSize.height}\n onPageRendered={e => this.handlePageRendered(e)}\n layers={[\n {name: 'page', type: 'canvas'},\n {name: 'controls', type: 'div'},\n ]}\n />\n );\n })}\n </Fragment>\n );\n })}\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"p-DbpqTdhn.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-preview/verdocs-preview.scss?tag=verdocs-preview","src/components/embeds/verdocs-preview/verdocs-preview.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-preview {\n font-family: $verdocs-primary-font;\n display: flex;\n padding: 15px;\n row-gap: 15px;\n min-height: 200px;\n position: relative;\n align-items: center;\n box-sizing: border-box;\n flex-direction: column;\n\n div,\n canvas {\n box-sizing: border-box;\n }\n}\n","import interact from 'interactjs';\nimport {getTemplate, integerSequence, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Element, Event, EventEmitter, Host, Component, Prop, h, State, Fragment, Watch} from '@stencil/core';\nimport {renderDocumentField} from '../../../utils/utils';\nimport {IDocumentPageInfo} from '../../../utils/Types';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a template preview experience. This will display the template's attached\n * documents with signing fields overlaid on each page. Fields will be color-coded\n * by recipient, and will be read-only (cannot be filled, moved, or altered).\n *\n * ```ts\n * <verdocs-preview\n * templateId={TEMPLATE_ID}\n * onSdkError={({ detail }) => { console.log('SDK error', detail) }\n * />\n * ```\n */\n@Component({\n tag: 'verdocs-preview',\n styleUrl: 'verdocs-preview.scss',\n shadow: false,\n})\nexport class VerdocsPreview {\n private templateListenerId = null;\n private renderedPages: Record<string, IDocumentPageInfo> = {};\n\n @Element() hostEl: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The ID of the template to create the document from.\n */\n @Prop() templateId: string | null = null;\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() loading = true;\n @State() template: ITemplate | null = null;\n\n disconnectedCallback() {\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 @Watch('templateId')\n onTemplateIdChanged(newTemplateId: string) {\n console.log('[PREVIEW] Template ID changed', newTemplateId);\n this.listenToTemplate();\n }\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n if (!this.endpoint.session) {\n console.log('[PREVIEW] Unable to start builder session, must be authenticated');\n return;\n }\n\n if (!this.templateId) {\n console.log(`[PREVIEW] Missing required template ID ${this.templateId}`);\n return;\n }\n\n this.listenToTemplate();\n } catch (e) {\n console.log('[PREVIEW] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n componentDidRender() {\n // Defensive hack: fields rendered in other tabs (e.g. the builder's Fields tab) may share DOM\n // IDs with fields shown here, and interact.js — being vanilla JS — is unaware of Stencil's\n // re-renders. Unbind any drag/resize handlers on fields inside our own subtree after each\n // render so they stay non-interactive in preview mode. Scope to hostEl so we don't clobber\n // handlers on fields belonging to a sibling component during brief tab-switch overlaps.\n this.hostEl?.querySelectorAll('.verdocs-field').forEach(el => {\n interact(el as HTMLElement).unset();\n });\n }\n\n handlePageRendered(e: any) {\n const pageInfo = e.detail as IDocumentPageInfo;\n this.renderedPages[`${pageInfo.documentId}:${pageInfo.pageNumber}`] = pageInfo;\n\n const fields = (this.template?.fields || []).filter(field => {\n // Templates created on the new builder have document_id set, but old ones may not.\n // If document_id is missing, we assume it's for the first document or use legacy logic.\n // However, for this fix, we primarily care about multi-doc templates which should have IDs.\n if (field['document_id']) {\n return field['document_id'] === pageInfo.documentId && field.page === pageInfo.pageNumber;\n }\n return field.page === pageInfo.pageNumber;\n });\n\n // console.log('[PREVIEW] Page rendered', pageInfo, fields);\n fields.forEach(field => renderDocumentField('template', field, pageInfo, {disabled: true, editable: false, draggable: false}));\n }\n\n render() {\n if (this.loading) {\n return (\n <Host>\n <verdocs-loader />\n </Host>\n );\n }\n\n return (\n <Host>\n {(this.template?.documents || []).map(document => {\n const pageNumbers = integerSequence(1, document.pages);\n return (\n <Fragment>\n {pageNumbers.map(pageNumber => {\n const pageSize = document.page_sizes?.[pageNumber] || {width: 612, height: 792};\n\n return (\n <verdocs-template-document-page\n templateId={document.template_id}\n documentId={document.id}\n pageNumber={pageNumber}\n disabled={true}\n editable={false}\n done={false}\n virtualWidth={pageSize.width}\n virtualHeight={pageSize.height}\n onPageRendered={e => this.handlePageRendered(e)}\n layers={[\n {name: 'page', type: 'canvas'},\n {name: 'controls', type: 'div'},\n ]}\n />\n );\n })}\n </Fragment>\n );\n })}\n </Host>\n );\n }\n}\n"],"version":3}
@@ -7,11 +7,11 @@ import { d as defineCustomElement$m } from './p-BvV9rOTP.js';
7
7
  import { d as defineCustomElement$l } from './p-CdmWI0-q.js';
8
8
  import { d as defineCustomElement$k } from './p-92Hd0xeK.js';
9
9
  import { d as defineCustomElement$j } from './p-DJ-FHysU.js';
10
- import { d as defineCustomElement$i } from './p-CoX-UPik.js';
10
+ import { d as defineCustomElement$i } from './p-wsUzEIVY.js';
11
11
  import { d as defineCustomElement$h } from './p-BAMSjBQv.js';
12
12
  import { d as defineCustomElement$g } from './p-DpVavzPM.js';
13
13
  import { d as defineCustomElement$f } from './p-DH2bIBiL.js';
14
- import { d as defineCustomElement$e } from './p-Dolz_jo3.js';
14
+ import { d as defineCustomElement$e } from './p-Bf1POXi1.js';
15
15
  import { d as defineCustomElement$d } from './p-DukBB28M.js';
16
16
  import { d as defineCustomElement$c } from './p-I2UaGmFI.js';
17
17
  import { d as defineCustomElement$b } from './p-hSMRF_eR.js';
@@ -383,6 +383,6 @@ function defineCustomElement() {
383
383
  }
384
384
 
385
385
  export { VerdocsTemplateDocumentPage as V, defineCustomElement as d };
386
- //# sourceMappingURL=p-DemYa78C.js.map
386
+ //# sourceMappingURL=p-DrmZLNU5.js.map
387
387
 
388
- //# sourceMappingURL=p-DemYa78C.js.map
388
+ //# sourceMappingURL=p-DrmZLNU5.js.map
@@ -1 +1 @@
1
- {"file":"p-DemYa78C.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"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"],"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({reflect: true}) templateId: string = '';\n\n /**\n * The ID of the document to display.\n */\n @Prop({reflect: true}) documentId: string = '';\n\n /**\n * The page number being rendered. (Reminder: page numbers are 1-based.)\n */\n @Prop({reflect: true}) 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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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"],"version":3}
1
+ {"file":"p-DrmZLNU5.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"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"],"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({reflect: true}) templateId: string = '';\n\n /**\n * The ID of the document to display.\n */\n @Prop({reflect: true}) documentId: string = '';\n\n /**\n * The page number being rendered. (Reminder: page numbers are 1-based.)\n */\n @Prop({reflect: true}) 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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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 isPreview\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"],"version":3}
@@ -109,7 +109,7 @@ const VerdocsFieldCheckbox = /*@__PURE__*/ proxyCustomElement(class VerdocsField
109
109
  if (done) {
110
110
  return h(Host, { class: { 'verdocs-field': true, done } }, checked ? '✓' : '☐');
111
111
  }
112
- return (h(Host, { class: { 'verdocs-field': true, required, disabled, done, focused, [signerClass]: true } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldname }, h("input", { id: fieldname, name: fieldname, type: "checkbox", checked: checked, disabled: readonly || disabled, required: required }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
112
+ return (h(Host, { class: { 'verdocs-field': true, required, disabled, done, focused, [signerClass]: source !== 'envelope' } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldname }, h("input", { id: fieldname, name: fieldname, type: "checkbox", checked: checked, disabled: readonly || disabled, required: required }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
113
113
  e.stopPropagation();
114
114
  this.showingProperties = !this.showingProperties;
115
115
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${field.name}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: field.name, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -208,6 +208,6 @@ function defineCustomElement() {
208
208
  }
209
209
 
210
210
  export { VerdocsFieldCheckbox as V, defineCustomElement as d };
211
- //# sourceMappingURL=p-CoX-UPik.js.map
211
+ //# sourceMappingURL=p-wsUzEIVY.js.map
212
212
 
213
- //# sourceMappingURL=p-CoX-UPik.js.map
213
+ //# sourceMappingURL=p-wsUzEIVY.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-wsUzEIVY.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.scss?tag=verdocs-field-checkbox","src/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\n// See https://www.kallmanation.com/styling-a-checkbox-with-only-css\nverdocs-field-checkbox {\n padding: 0;\n width: 16px;\n height: 16px;\n display: block;\n scroll-margin: 20px 0;\n box-sizing: border-box;\n transform-origin: bottom left;\n font-family: $verdocs-primary-font;\n\n // To avoid conflicting with the use of a label for the checkbox itself\n div.label {\n top: -14px;\n left: -1px;\n height: 14px;\n color: white;\n padding: 0 4px;\n font-size: 9px;\n line-height: 13px;\n position: absolute;\n background: #4a4a99;\n border-top-left-radius: 2px;\n border-top-right-radius: 2px;\n }\n\n label {\n // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n cursor: inherit;\n\n width: 14px;\n height: 14px;\n display: block;\n box-sizing: border-box;\n }\n\n &.disabled label {\n opacity: 0.5;\n }\n\n label > input[type='checkbox'] {\n display: none;\n }\n\n label > input[type='checkbox'] + *::before {\n margin: 0;\n content: '';\n width: 12px;\n height: 12px;\n display: block;\n line-height: 12px;\n border-radius: var(--verdocs-field-radius);\n box-sizing: border-box;\n border: 1px solid $verdocs-grey-2;\n }\n\n label > input[type='checkbox']:checked + * {\n color: $verdocs-green;\n }\n\n label > input[type='checkbox']:checked + *::before {\n content: '✓';\n color: white;\n font-size: 12px;\n text-align: center;\n background: $verdocs-green;\n border-color: $verdocs-green;\n }\n\n &.required {\n border: 1px solid var(--verdocs-required-field-border);\n }\n\n &.hide {\n display: none;\n }\n\n verdocs-button-panel {\n display: block;\n margin-left: -20px;\n margin-top: -17px;\n transform: scale(0.7);\n }\n\n .settings-icon {\n position: absolute;\n top: -5px;\n left: -20px;\n display: inline-block;\n cursor: pointer;\n opacity: 0.3;\n\n svg {\n fill: $border-color;\n }\n\n &:hover {\n opacity: 1;\n }\n }\n}\n","import interact from 'interactjs';\nimport {ITemplateField, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, Event, EventEmitter, Fragment, h, Host, Method, Prop, State, Element, Listen, Watch} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a checkbox.\n */\n@Component({\n tag: 'verdocs-field-checkbox',\n styleUrl: 'verdocs-field-checkbox.scss',\n shadow: false,\n})\nexport class VerdocsFieldCheckbox {\n @Element() el: HTMLElement;\n\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * Override the field's settings. This is intended to be used during signing when fields are being\n * mutated.\n */\n @Prop() field: IEnvelopeField | null | undefined = null;\n\n /**\n * If set to true, it will force interact to unset the el, resulting in no dragging the field.\n */\n @Prop({reflect: true}) isPreview?: boolean;\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 = false;\n\n @Listen('blur')\n handleBlur() {\n this.focused = false;\n }\n\n @Method()\n async focusField() {\n this.el.focus();\n this.focused = true;\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n }\n\n @Watch('editable')\n onEditableChanged(newVal: boolean, oldVal: boolean) {\n // When transitioning out of editable mode (e.g., builder -> preview tab), clear interact bindings\n if (oldVal && !newVal) {\n interact(this.el).unset();\n }\n }\n\n disconnectedCallback() {\n // Clear any interact.js drag/resize bindings so they don't leak if the DOM element is reused elsewhere\n interact(this.el).unset();\n }\n\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, label = '', value = false, readonly = false} = field || {};\n const signerClass = `signer-${(index % 10) + 1}`;\n\n const checked = value === 'true';\n\n if (done) {\n return <Host class={{'verdocs-field': true,done}}>{checked ? '✓' : '☐'}</Host>;\n }\n\n return (\n <Host class={{'verdocs-field': true,required, disabled, done, focused, [signerClass]: source !== 'envelope'}}>\n {label && <div class=\"label\">{label}</div>}\n\n <label htmlFor={fieldname}>\n <input id={fieldname} name={fieldname} type=\"checkbox\" checked={checked} disabled={readonly || disabled} required={required} />\n <span />\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 </label>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -8,11 +8,11 @@ import { d as defineCustomElement$A } from './p-CdmWI0-q.js';
8
8
  import { d as defineCustomElement$z } from './p-BbJx5d0P.js';
9
9
  import { d as defineCustomElement$y } from './p-92Hd0xeK.js';
10
10
  import { d as defineCustomElement$x } from './p-DJ-FHysU.js';
11
- import { d as defineCustomElement$w } from './p-CoX-UPik.js';
11
+ import { d as defineCustomElement$w } from './p-wsUzEIVY.js';
12
12
  import { d as defineCustomElement$v } from './p-BAMSjBQv.js';
13
13
  import { d as defineCustomElement$u } from './p-DpVavzPM.js';
14
14
  import { d as defineCustomElement$t } from './p-DH2bIBiL.js';
15
- import { d as defineCustomElement$s } from './p-Dolz_jo3.js';
15
+ import { d as defineCustomElement$s } from './p-Bf1POXi1.js';
16
16
  import { d as defineCustomElement$r } from './p-DukBB28M.js';
17
17
  import { d as defineCustomElement$q } from './p-I2UaGmFI.js';
18
18
  import { d as defineCustomElement$p } from './p-hSMRF_eR.js';
@@ -24,16 +24,16 @@ import { d as defineCustomElement$k } from './p-CNKACBaL.js';
24
24
  import { d as defineCustomElement$j } from './p-C4BOQLSR.js';
25
25
  import { d as defineCustomElement$i } from './p-D3NVBZRw.js';
26
26
  import { d as defineCustomElement$h } from './p-DUYRis3A.js';
27
- import { d as defineCustomElement$g } from './p-yM0XEtHG.js';
27
+ import { d as defineCustomElement$g } from './p-DbpqTdhn.js';
28
28
  import { d as defineCustomElement$f } from './p-DzEqts-G.js';
29
29
  import { d as defineCustomElement$e } from './p-C1AtapGD.js';
30
30
  import { d as defineCustomElement$d } from './p-gqexdqWf.js';
31
31
  import { d as defineCustomElement$c } from './p-lE3_dyeh.js';
32
32
  import { d as defineCustomElement$b } from './p-DSiIGDHy.js';
33
33
  import { d as defineCustomElement$a } from './p-BqoZV7Do.js';
34
- import { d as defineCustomElement$9 } from './p-DemYa78C.js';
34
+ import { d as defineCustomElement$9 } from './p-DrmZLNU5.js';
35
35
  import { d as defineCustomElement$8 } from './p-D7H5IOY_.js';
36
- import { d as defineCustomElement$7 } from './p-DZrvJ_QT.js';
36
+ import { d as defineCustomElement$7 } from './p-1v1nkPcE.js';
37
37
  import { d as defineCustomElement$6 } from './p-CvxkuxX3.js';
38
38
  import { d as defineCustomElement$5 } from './p-BGOLa_zC.js';
39
39
  import { d as defineCustomElement$4 } from './p-CcIN7yIE.js';
@@ -1,4 +1,4 @@
1
- import { V as VerdocsFieldCheckbox$1, d as defineCustomElement$1 } from './p-CoX-UPik.js';
1
+ import { V as VerdocsFieldCheckbox$1, d as defineCustomElement$1 } from './p-wsUzEIVY.js';
2
2
 
3
3
  const VerdocsFieldCheckbox = VerdocsFieldCheckbox$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { V as VerdocsFieldRadio$1, d as defineCustomElement$1 } from './p-Dolz_jo3.js';
1
+ import { V as VerdocsFieldRadio$1, d as defineCustomElement$1 } from './p-Bf1POXi1.js';
2
2
 
3
3
  const VerdocsFieldRadio = VerdocsFieldRadio$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { V as VerdocsPreview$1, d as defineCustomElement$1 } from './p-yM0XEtHG.js';
1
+ import { V as VerdocsPreview$1, d as defineCustomElement$1 } from './p-DbpqTdhn.js';
2
2
 
3
3
  const VerdocsPreview = VerdocsPreview$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { V as VerdocsTemplateDocumentPage$1, d as defineCustomElement$1 } from './p-DemYa78C.js';
1
+ import { V as VerdocsTemplateDocumentPage$1, d as defineCustomElement$1 } from './p-DrmZLNU5.js';
2
2
 
3
3
  const VerdocsTemplateDocumentPage = VerdocsTemplateDocumentPage$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { V as VerdocsTemplateFields$1, d as defineCustomElement$1 } from './p-DZrvJ_QT.js';
1
+ import { V as VerdocsTemplateFields$1, d as defineCustomElement$1 } from './p-1v1nkPcE.js';
2
2
 
3
3
  const VerdocsTemplateFields = VerdocsTemplateFields$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -240,7 +240,7 @@ const VerdocsFieldCheckbox = class {
240
240
  if (done) {
241
241
  return h(Host, { class: { 'verdocs-field': true, done } }, checked ? '✓' : '☐');
242
242
  }
243
- return (h(Host, { class: { 'verdocs-field': true, required, disabled, done, focused, [signerClass]: true } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldname }, h("input", { id: fieldname, name: fieldname, type: "checkbox", checked: checked, disabled: readonly || disabled, required: required }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
243
+ return (h(Host, { class: { 'verdocs-field': true, required, disabled, done, focused, [signerClass]: source !== 'envelope' } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldname }, h("input", { id: fieldname, name: fieldname, type: "checkbox", checked: checked, disabled: readonly || disabled, required: required }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
244
244
  e.stopPropagation();
245
245
  this.showingProperties = !this.showingProperties;
246
246
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${field.name}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: field.name, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -960,7 +960,7 @@ const VerdocsFieldRadio = class {
960
960
  if (done) {
961
961
  return (h(Host, { class: { 'verdocs-field': true, done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
962
962
  }
963
- return (h(Host, { class: { 'verdocs-field': true, required: this.required || required, disabled, done, focused, [signerClass]: true } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldname, type: "radio", name: group || fieldname, value: name, checked: !!selected, disabled: readonly || disabled, required: required }), h("label", { htmlFor: fieldname }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
963
+ return (h(Host, { class: { 'verdocs-field': true, required: this.required || required, disabled, done, focused, [signerClass]: source !== 'envelope' } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldname, type: "radio", name: group || fieldname, value: name, checked: !!selected, disabled: readonly || disabled, required: required }), h("label", { htmlFor: fieldname }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
964
964
  e.stopPropagation();
965
965
  this.showingProperties = !this.showingProperties;
966
966
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {