npm - @verdocs/web-sdk - Versions diffs - 6.8.11 → 6.9.6 - Mend

@verdocs/web-sdk 6.8.11 → 6.9.6

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

package/dist/components/{p-D1TqIILD.js → p-CLFt5iKT.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-CUAGH_8P.js';
-import { d as dateFnsExports } from './p-6fSdgmoO.js';
+import { d as dateFnsExports } from './p-CIJlsf-4.js';
 import { i as interact } from './p-CGNX5HqF.js';
 import { A as AirDatepicker, l as localeEn } from './p-CjPsvAbb.js';
 import { VerdocsEndpoint, updateField } from '@verdocs/js-sdk';
@@ -301,6 +301,6 @@ function defineCustomElement() {
 }
 export { VerdocsFieldDate as V, defineCustomElement as d };
-//# sourceMappingURL=p-D1TqIILD.js.map
+//# sourceMappingURL=p-CLFt5iKT.js.map
-//# sourceMappingURL=p-D1TqIILD.js.map
+//# sourceMappingURL=p-CLFt5iKT.js.map

package/dist/components/{p-D1TqIILD.js.map → p-CLFt5iKT.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-D1TqIILD.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","format"],"sources":["src/components/fields/verdocs-field-date/verdocs-field-date.scss?tag=verdocs-field-date","src/components/fields/verdocs-field-date/verdocs-field-date.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-date {\n font-family: $verdocs-primary-font;\n width: 74px;\n height: 20px;\n display: block;\n font-size: 11px;\n position: relative;\n scroll-margin: 20px 0;\n letter-spacing: 0.3px;\n background-color: var(--verdocs-field-background, transparent);\n transform-origin: bottom left;\n\n &.small input {\n font-size: 7px;\n }\n\n .edge-top,\n .edge-right,\n .edge-left,\n .edge-bottom {\n position: absolute;\n z-index: 10;\n }\n\n .edge-top {\n top: -2px;\n left: 0;\n right: 0;\n height: 5px;\n }\n\n .edge-right {\n top: 0;\n bottom: 0;\n right: -2px;\n width: 5px;\n }\n\n .edge-left {\n top: 0;\n left: -2px;\n bottom: 0;\n width: 5px;\n }\n\n .edge-bottom {\n bottom: -2px;\n left: 0;\n right: 0;\n height: 5px;\n }\n\n label {\n top: -14px;\n left: 0;\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 input {\n position: absolute;\n\n font-size: 12px;\n\n // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n cursor: inherit;\n\n box-sizing: border-box;\n color: var(--verdocs-field-text-color, rgba(0, 0, 0, 0.87));\n font-weight: 500;\n transform-origin: 0 0;\n height: 100%;\n width: 100%;\n background: none;\n border: var(--verdocs-field-border, 1px solid $light-border-color);\n border-radius: var(--verdocs-field-radius);\n appearance: none;\n\n &.hide {\n display: none;\n }\n }\n\n &.disabled input {\n opacity: 0.5;\n }\n\n &.required {\n input {\n border: 1px solid var(--verdocs-required-field-border);\n }\n }\n\n verdocs-button-panel {\n top: -3px;\n left: -2px;\n opacity: 0.5;\n z-index: 1000;\n cursor: pointer;\n position: absolute;\n transform: scale(0.6);\n\n &[data-active],\n &:hover {\n opacity: 1;\n }\n\n .icon {\n svg {\n fill: #333333;\n }\n\n &:hover {\n svg {\n fill: #000000;\n }\n }\n }\n }\n\n .settings-icon {\n position: absolute;\n top: -3px;\n left: -18px;\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.air-datepicker-cell.-year-.-other-decade-,\n.air-datepicker-cell.-day-.-other-month- {\n color: var(--adp-color-other-month);\n}\n\n.air-datepicker-cell.-year-.-other-decade-:hover,\n.air-datepicker-cell.-day-.-other-month-:hover {\n color: var(--adp-color-other-month-hover);\n}\n\n.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month- {\n color: var(--adp-color-other-month);\n}\n\n.-selected-.air-datepicker-cell.-year-.-other-decade-,\n.-selected-.air-datepicker-cell.-day-.-other-month- {\n color: #fff;\n background: var(--adp-background-color-selected-other-month);\n}\n\n.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-selected-.-focus-.air-datepicker-cell.-day-.-other-month- {\n background: var(--adp-background-color-selected-other-month-focused);\n}\n\n.-in-range-.air-datepicker-cell.-year-.-other-decade-,\n.-in-range-.air-datepicker-cell.-day-.-other-month- {\n background-color: var(--adp-background-color-in-range);\n color: var(--adp-color);\n}\n\n.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month- {\n background-color: var(--adp-background-color-in-range-focused);\n}\n\n.air-datepicker-cell.-year-.-other-decade-:empty,\n.air-datepicker-cell.-day-.-other-month-:empty {\n background: none;\n border: none;\n}\n\n.air-datepicker-cell {\n border-radius: var(--adp-cell-border-radius);\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n z-index: 1;\n}\n\n.air-datepicker-cell.-focus- {\n background: var(--adp-cell-background-color-hover);\n}\n\n.air-datepicker-cell.-current- {\n color: var(--adp-color-current-date);\n}\n\n.air-datepicker-cell.-current-.-focus- {\n color: var(--adp-color);\n}\n\n.air-datepicker-cell.-current-.-in-range- {\n color: var(--adp-color-current-date);\n}\n\n.air-datepicker-cell.-disabled- {\n cursor: default;\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-disabled-.-focus- {\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-disabled-.-in-range- {\n color: var(--adp-color-disabled-in-range);\n}\n\n.air-datepicker-cell.-disabled-.-current-.-focus- {\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-in-range- {\n background: var(--adp-cell-background-color-in-range);\n border-radius: 0;\n}\n\n.air-datepicker-cell.-in-range-:hover {\n background: var(--adp-cell-background-color-in-range-hover);\n}\n\n.air-datepicker-cell.-range-from- {\n border: 1px solid var(--adp-cell-border-color-in-range);\n background-color: var(--adp-cell-background-color-in-range);\n border-radius: var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius);\n}\n\n.air-datepicker-cell.-range-to- {\n border: 1px solid var(--adp-cell-border-color-in-range);\n background-color: var(--adp-cell-background-color-in-range);\n border-radius: 0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0;\n}\n\n.air-datepicker-cell.-range-to-.-range-from- {\n border-radius: var(--adp-cell-border-radius);\n}\n\n.air-datepicker-cell.-selected- {\n color: #fff;\n border: none;\n background: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-cell.-selected-.-current- {\n color: #fff;\n background: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-cell.-selected-.-focus- {\n background: var(--adp-cell-background-color-selected-hover);\n}\n\n.air-datepicker-body {\n transition: all var(--adp-transition-duration) var(--adp-transition-ease);\n}\n\n.air-datepicker-body.-hidden- {\n display: none;\n}\n\n.air-datepicker-body--day-names {\n display: grid;\n grid-template-columns: repeat(7, var(--adp-day-cell-width));\n margin: 8px 0 3px;\n}\n\n.air-datepicker-body--day-name {\n color: var(--adp-day-name-color);\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1;\n text-align: center;\n text-transform: uppercase;\n font-size: 0.8em;\n}\n\n.air-datepicker-body--day-name.-clickable- {\n cursor: pointer;\n}\n\n.air-datepicker-body--day-name.-clickable-:hover {\n color: var(--adp-day-name-color-hover);\n}\n\n.air-datepicker-body--cells {\n display: grid;\n}\n\n.air-datepicker-body--cells.-days- {\n grid-template-columns: repeat(7, var(--adp-day-cell-width));\n grid-auto-rows: var(--adp-day-cell-height);\n}\n\n.air-datepicker-body--cells.-months- {\n grid-template-columns: repeat(3, 1fr);\n grid-auto-rows: var(--adp-month-cell-height);\n}\n\n.air-datepicker-body--cells.-years- {\n grid-template-columns: repeat(4, 1fr);\n grid-auto-rows: var(--adp-year-cell-height);\n}\n\n.air-datepicker-nav {\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid var(--adp-border-color-inner);\n min-height: var(--adp-nav-height);\n padding: var(--adp-padding);\n box-sizing: content-box;\n}\n\n.-only-timepicker- .air-datepicker-nav {\n display: none;\n}\n\n.air-datepicker-nav--title,\n.air-datepicker-nav--action {\n display: flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n}\n\n.air-datepicker-nav--action {\n width: var(--adp-nav-action-size);\n border-radius: var(--adp-border-radius);\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n\n.air-datepicker-nav--action:hover {\n background: var(--adp-background-color-hover);\n}\n\n.air-datepicker-nav--action:active {\n background: var(--adp-background-color-active);\n}\n\n.air-datepicker-nav--action.-disabled- {\n visibility: hidden;\n}\n\n.air-datepicker-nav--action svg {\n width: 32px;\n height: 32px;\n}\n\n.air-datepicker-nav--action path {\n fill: none;\n stroke: var(--adp-nav-arrow-color);\n stroke-width: 2px;\n}\n\n.air-datepicker-nav--title {\n border-radius: var(--adp-border-radius);\n padding: 0 8px;\n}\n\n.air-datepicker-nav--title i {\n font-style: normal;\n color: var(--adp-nav-color-secondary);\n margin-left: 0.3em;\n}\n\n.air-datepicker-nav--title:hover {\n background: var(--adp-background-color-hover);\n}\n\n.air-datepicker-nav--title:active {\n background: var(--adp-background-color-active);\n}\n\n.air-datepicker-nav--title.-disabled- {\n cursor: default;\n background: none;\n}\n\n.air-datepicker-buttons {\n display: grid;\n grid-auto-columns: 1fr;\n grid-auto-flow: column;\n}\n\n.air-datepicker-button {\n display: inline-flex;\n color: var(--adp-btn-color);\n border-radius: var(--adp-btn-border-radius);\n cursor: pointer;\n height: var(--adp-btn-height);\n border: none;\n background: rgba(255, 255, 255, 0);\n}\n\n.air-datepicker-button:hover {\n color: var(--adp-btn-color-hover);\n background: var(--adp-btn-background-color-hover);\n}\n\n.air-datepicker-button:focus {\n color: var(--adp-btn-color-hover);\n background: var(--adp-btn-background-color-hover);\n outline: none;\n}\n\n.air-datepicker-button:active {\n background: var(--adp-btn-background-color-active);\n}\n\n.air-datepicker-button span {\n outline: none;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n}\n\n.air-datepicker-time {\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 12px;\n align-items: center;\n position: relative;\n padding: 0 var(--adp-time-padding-inner);\n}\n\n.-only-timepicker- .air-datepicker-time {\n border-top: none;\n}\n\n.air-datepicker-time--current {\n display: flex;\n align-items: center;\n flex: 1;\n font-size: 14px;\n text-align: center;\n}\n\n.air-datepicker-time--current-colon {\n margin: 0 2px 3px;\n line-height: 1;\n}\n\n.air-datepicker-time--current-hours,\n.air-datepicker-time--current-minutes {\n line-height: 1;\n font-size: 19px;\n font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;\n position: relative;\n z-index: 1;\n}\n\n.air-datepicker-time--current-hours:after,\n.air-datepicker-time--current-minutes:after {\n content: '';\n background: var(--adp-background-color-hover);\n border-radius: var(--adp-border-radius);\n position: absolute;\n left: -2px;\n top: -3px;\n right: -2px;\n bottom: -2px;\n z-index: -1;\n opacity: 0;\n}\n\n.air-datepicker-time--current-hours.-focus-:after,\n.air-datepicker-time--current-minutes.-focus-:after {\n opacity: 1;\n}\n\n.air-datepicker-time--current-ampm {\n text-transform: uppercase;\n align-self: flex-end;\n color: var(--adp-time-day-period-color);\n margin-left: 6px;\n font-size: 11px;\n margin-bottom: 1px;\n}\n\n.air-datepicker-time--row {\n display: flex;\n align-items: center;\n font-size: 11px;\n height: 17px;\n background: linear-gradient(to right, var(--adp-time-track-color), var(--adp-time-track-color)) left 50%/100% var(--adp-time-track-height) no-repeat;\n}\n\n.air-datepicker-time--row:first-child {\n margin-bottom: 4px;\n}\n\n.air-datepicker-time--row input[type='range'] {\n background: none;\n cursor: pointer;\n flex: 1;\n height: 100%;\n width: 100%;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n -webkit-appearance: none;\n}\n\n.air-datepicker-time--row input[type='range']::-ms-tooltip {\n display: none;\n}\n\n.air-datepicker-time--row input[type='range']:hover::-webkit-slider-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:hover::-moz-range-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:hover::-ms-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:focus {\n outline: none;\n}\n\n.air-datepicker-time--row input[type='range']:focus::-webkit-slider-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']:focus::-moz-range-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']:focus::-ms-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -webkit-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-moz-range-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -moz-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -ms-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n margin-top: calc(var(--adp-time-thumb-size) / 2 * -1);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-runnable-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-moz-range-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-fill-lower {\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-fill-upper {\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker {\n --adp-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\n --adp-font-size: 14px;\n --adp-width: 246px;\n --adp-z-index: 100;\n --adp-padding: 4px;\n --adp-grid-areas: 'nav' 'body' 'timepicker' 'buttons';\n --adp-transition-duration: 0.3s;\n --adp-transition-ease: ease-out;\n --adp-transition-offset: 8px;\n --adp-background-color: #fff;\n --adp-background-color-hover: #f0f0f0;\n --adp-background-color-active: #eaeaea;\n --adp-background-color-in-range: rgba(92, 196, 239, 0.1);\n --adp-background-color-in-range-focused: rgba(92, 196, 239, 0.2);\n --adp-background-color-selected-other-month-focused: #8ad5f4;\n --adp-background-color-selected-other-month: #a2ddf6;\n --adp-color: #4a4a4a;\n --adp-color-secondary: #9c9c9c;\n --adp-accent-color: #4eb5e6;\n --adp-color-current-date: var(--adp-accent-color);\n --adp-color-other-month: #dedede;\n --adp-color-disabled: #aeaeae;\n --adp-color-disabled-in-range: #939393;\n --adp-color-other-month-hover: #c5c5c5;\n --adp-border-color: #dbdbdb;\n --adp-border-color-inner: #efefef;\n --adp-border-radius: 4px;\n --adp-border-color-inline: #d7d7d7;\n --adp-nav-height: 32px;\n --adp-nav-arrow-color: var(--adp-color-secondary);\n --adp-nav-action-size: 32px;\n --adp-nav-color-secondary: var(--adp-color-secondary);\n --adp-day-name-color: #ff9a19;\n --adp-day-name-color-hover: #8ad5f4;\n --adp-day-cell-width: 1fr;\n --adp-day-cell-height: 32px;\n --adp-month-cell-height: 42px;\n --adp-year-cell-height: 56px;\n --adp-pointer-size: 10px;\n --adp-poiner-border-radius: 2px;\n --adp-pointer-offset: 14px;\n --adp-cell-border-radius: 4px;\n --adp-cell-background-color-hover: var(--adp-background-color-hover);\n --adp-cell-background-color-selected: #5cc4ef;\n --adp-cell-background-color-selected-hover: #45bced;\n --adp-cell-background-color-in-range: rgba(92, 196, 239, 0.1);\n --adp-cell-background-color-in-range-hover: rgba(92, 196, 239, 0.2);\n --adp-cell-border-color-in-range: var(--adp-cell-background-color-selected);\n --adp-btn-height: 32px;\n --adp-btn-color: var(--adp-accent-color);\n --adp-btn-color-hover: var(--adp-color);\n --adp-btn-border-radius: var(--adp-border-radius);\n --adp-btn-background-color-hover: var(--adp-background-color-hover);\n --adp-btn-background-color-active: var(--adp-background-color-active);\n --adp-time-track-height: 1px;\n --adp-time-track-color: #dedede;\n --adp-time-track-color-hover: #b1b1b1;\n --adp-time-thumb-size: 12px;\n --adp-time-padding-inner: 10px;\n --adp-time-day-period-color: var(--adp-color-secondary);\n --adp-mobile-font-size: 16px;\n --adp-mobile-nav-height: 40px;\n --adp-mobile-width: 320px;\n --adp-mobile-day-cell-height: 38px;\n --adp-mobile-month-cell-height: 48px;\n --adp-mobile-year-cell-height: 64px;\n}\n\n.air-datepicker-overlay {\n --adp-overlay-background-color: rgba(0, 0, 0, 0.3);\n --adp-overlay-transition-duration: 0.3s;\n --adp-overlay-transition-ease: ease-out;\n --adp-overlay-z-index: 99;\n}\n\n.air-datepicker {\n background: var(--adp-background-color);\n border: 1px solid var(--adp-border-color);\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n border-radius: var(--adp-border-radius);\n box-sizing: content-box;\n display: grid;\n grid-template-columns: 1fr;\n grid-template-rows: repeat(4, max-content);\n grid-template-areas: var(--adp-grid-areas);\n font-family: var(--adp-font-family), sans-serif;\n font-size: var(--adp-font-size);\n color: var(--adp-color);\n width: var(--adp-width);\n position: absolute;\n transition:\n opacity var(--adp-transition-duration) var(--adp-transition-ease),\n transform var(--adp-transition-duration) var(--adp-transition-ease);\n z-index: var(--adp-z-index);\n}\n\n.air-datepicker:not(.-custom-position-) {\n opacity: 0;\n}\n\n.air-datepicker.-from-top- {\n transform: translateY(calc(var(--adp-transition-offset) * -1));\n}\n\n.air-datepicker.-from-right- {\n transform: translateX(var(--adp-transition-offset));\n}\n\n.air-datepicker.-from-bottom- {\n transform: translateY(var(--adp-transition-offset));\n}\n\n.air-datepicker.-from-left- {\n transform: translateX(calc(var(--adp-transition-offset) * -1));\n}\n\n.air-datepicker.-active-:not(.-custom-position-) {\n transform: translate(0, 0);\n opacity: 1;\n}\n\n.air-datepicker.-active-.-custom-position- {\n transition: none;\n}\n\n.air-datepicker.-inline- {\n border-color: var(--adp-border-color-inline);\n box-shadow: none;\n position: static;\n left: auto;\n right: auto;\n opacity: 1;\n transform: none;\n}\n\n.air-datepicker.-inline- .air-datepicker--pointer {\n display: none;\n}\n\n.air-datepicker.-is-mobile- {\n --adp-font-size: var(--adp-mobile-font-size);\n --adp-day-cell-height: var(--adp-mobile-day-cell-height);\n --adp-month-cell-height: var(--adp-mobile-month-cell-height);\n --adp-year-cell-height: var(--adp-mobile-year-cell-height);\n --adp-nav-height: var(--adp-mobile-nav-height);\n --adp-nav-action-size: var(--adp-mobile-nav-height);\n position: fixed;\n width: var(--adp-mobile-width);\n border: none;\n}\n\n.air-datepicker.-is-mobile- * {\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker.-is-mobile- .air-datepicker--pointer {\n display: none;\n}\n\n.air-datepicker.-is-mobile-:not(.-custom-position-) {\n transform: translate(-50%, calc(-50% + var(--adp-transition-offset)));\n}\n\n.air-datepicker.-is-mobile-.-active-:not(.-custom-position-) {\n transform: translate(-50%, -50%);\n}\n\n.air-datepicker.-custom-position- {\n transition: none;\n}\n\n.air-datepicker-global-container {\n position: absolute;\n left: 0;\n top: 0;\n}\n\n.air-datepicker--pointer {\n --pointer-half-size: calc(var(--adp-pointer-size) / 2);\n position: absolute;\n width: var(--adp-pointer-size);\n height: var(--adp-pointer-size);\n z-index: -1;\n}\n\n.air-datepicker--pointer:after {\n content: '';\n position: absolute;\n background: #fff;\n border-top: 1px solid var(--adp-border-color-inline);\n border-right: 1px solid var(--adp-border-color-inline);\n border-top-right-radius: var(--adp-poiner-border-radius);\n width: var(--adp-pointer-size);\n height: var(--adp-pointer-size);\n box-sizing: border-box;\n}\n\n.-top-left- .air-datepicker--pointer,\n.-top-center- .air-datepicker--pointer,\n.-top-right- .air-datepicker--pointer,\n[data-popper-placement^='top'] .air-datepicker--pointer {\n top: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-top-left- .air-datepicker--pointer:after,\n.-top-center- .air-datepicker--pointer:after,\n.-top-right- .air-datepicker--pointer:after,\n[data-popper-placement^='top'] .air-datepicker--pointer:after {\n transform: rotate(135deg);\n}\n\n.-right-top- .air-datepicker--pointer,\n.-right-center- .air-datepicker--pointer,\n.-right-bottom- .air-datepicker--pointer,\n[data-popper-placement^='right'] .air-datepicker--pointer {\n right: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-right-top- .air-datepicker--pointer:after,\n.-right-center- .air-datepicker--pointer:after,\n.-right-bottom- .air-datepicker--pointer:after,\n[data-popper-placement^='right'] .air-datepicker--pointer:after {\n transform: rotate(225deg);\n}\n\n.-bottom-left- .air-datepicker--pointer,\n.-bottom-center- .air-datepicker--pointer,\n.-bottom-right- .air-datepicker--pointer,\n[data-popper-placement^='bottom'] .air-datepicker--pointer {\n bottom: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-bottom-left- .air-datepicker--pointer:after,\n.-bottom-center- .air-datepicker--pointer:after,\n.-bottom-right- .air-datepicker--pointer:after,\n[data-popper-placement^='bottom'] .air-datepicker--pointer:after {\n transform: rotate(315deg);\n}\n\n.-left-top- .air-datepicker--pointer,\n.-left-center- .air-datepicker--pointer,\n.-left-bottom- .air-datepicker--pointer,\n[data-popper-placement^='left'] .air-datepicker--pointer {\n left: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-left-top- .air-datepicker--pointer:after,\n.-left-center- .air-datepicker--pointer:after,\n.-left-bottom- .air-datepicker--pointer:after,\n[data-popper-placement^='left'] .air-datepicker--pointer:after {\n transform: rotate(45deg);\n}\n\n.-top-left- .air-datepicker--pointer,\n.-bottom-left- .air-datepicker--pointer {\n left: var(--adp-pointer-offset);\n}\n\n.-top-right- .air-datepicker--pointer,\n.-bottom-right- .air-datepicker--pointer {\n right: var(--adp-pointer-offset);\n}\n\n.-top-center- .air-datepicker--pointer,\n.-bottom-center- .air-datepicker--pointer {\n left: calc(50% - var(--adp-pointer-size) / 2);\n}\n\n.-left-top- .air-datepicker--pointer,\n.-right-top- .air-datepicker--pointer {\n top: var(--adp-pointer-offset);\n}\n\n.-left-bottom- .air-datepicker--pointer,\n.-right-bottom- .air-datepicker--pointer {\n bottom: var(--adp-pointer-offset);\n}\n\n.-left-center- .air-datepicker--pointer,\n.-right-center- .air-datepicker--pointer {\n top: calc(50% - var(--adp-pointer-size) / 2);\n}\n\n.air-datepicker--navigation {\n grid-area: nav;\n}\n\n.air-datepicker--content {\n box-sizing: content-box;\n padding: var(--adp-padding);\n grid-area: body;\n}\n\n.-only-timepicker- .air-datepicker--content {\n display: none;\n}\n\n.air-datepicker--time {\n grid-area: timepicker;\n}\n\n.air-datepicker--buttons {\n grid-area: buttons;\n}\n\n.air-datepicker--buttons,\n.air-datepicker--time {\n padding: var(--adp-padding);\n border-top: 1px solid var(--adp-border-color-inner);\n}\n\n.air-datepicker-overlay {\n position: fixed;\n background: var(--adp-overlay-background-color);\n left: 0;\n top: 0;\n width: 0;\n height: 0;\n opacity: 0;\n transition:\n opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),\n left 0s,\n height 0s,\n width 0s;\n transition-delay: 0s, var(--adp-overlay-transition-duration), var(--adp-overlay-transition-duration), var(--adp-overlay-transition-duration);\n z-index: var(--adp-overlay-z-index);\n}\n\n.air-datepicker-overlay.-active- {\n opacity: 1;\n width: 100%;\n height: 100%;\n transition:\n opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),\n height 0s,\n width 0s;\n}\n\n@keyframes adp-spin {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n","import {format} from 'date-fns';\n// import {getRGBA} from '@verdocs/js-sdk';\nimport interact from 'interactjs';\nimport {ResizeEvent} from '@interactjs/actions/resize/plugin';\nimport AirDatepicker from 'air-datepicker';\nimport localeEn from 'air-datepicker/locale/en';\nimport {type ITemplate, type ITemplateField, updateField, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Fragment, State, Listen, Watch} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {FORMAT_DATE} from '../../../utils/Types';\nimport {Store} from '../../../utils/Datastore';\n\n/*\n Displays a date field. When tapped or clicked, the input element will display a date picker component.\n /\n@Component({\n tag: 'verdocs-field-date',\n styleUrl: 'verdocs-field-date.scss',\n shadow: false,\n})\nexport class VerdocsFieldDate {\n @Element() el: HTMLElement;\n private inputEl: HTMLInputElement;\n\n /\n Fields may be attached to templates or envelopes, but only template fields may be edited.\n /\n @Prop({reflect: true}) source: 'template' \| 'envelope' = 'template';\n\n /\n The source template or envelope ID the field is found in.\n /\n @Prop({reflect: true}) sourceid: string = '';\n\n /\n The name of the field to display.\n /\n @Prop({reflect: true}) fieldname: string = '';\n\n /\n If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n /\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /\n If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n /\n @Prop({reflect: true}) editable?: boolean = false;\n\n /\n If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n /\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /\n If set, the field is considered \"done\" and is drawn in a display-final-value state.\n /\n @Prop({reflect: true}) done?: boolean = false;\n\n /\n If set, the field will be be scaled horizontally by this factor.\n /\n @Prop({reflect: true}) xscale?: number = 1;\n\n /\n If set, the field will be be scaled vertically by this factor.\n /\n @Prop({reflect: true}) yscale?: number = 1;\n\n /\n The page the field is on\n /\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /\n If set, the field will be be scaled vertically by this factor.\n /\n @Prop() field?: ITemplateField;\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 Event fired on every character entered into / deleted from the field.\n /\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /\n Event fired when the field'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() containerId = `verdocs-date-picker-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showingProperties?: boolean = false;\n\n @State() focused = false;\n\n @Listen('blur', {capture: true})\n handleBlur() {\n this.focused = false;\n }\n\n @Method()\n async focusField() {\n this.inputEl.focus();\n this.focused = true;\n }\n\n picker: AirDatepicker<HTMLElement> \| null = null;\n\n componentDidLoad() {\n const {source, sourceid, fieldname} = this;\n const {field} = Store.getField(source, sourceid, fieldname, this.field);\n const {readonly = false} = field \|\| {};\n\n if (!readonly) {\n this.picker = new AirDatepicker<HTMLElement>(`#${this.containerId}`, {\n locale: localeEn,\n isMobile: true,\n autoClose: true,\n onShow: () => (this.focused = true),\n onHide: () => (this.focused = false),\n onSelect: ({date, formattedDate}) => {\n const event = new CustomEvent('fieldChange', {detail: {date, formattedDate}});\n this.el.dispatchEvent(event);\n },\n });\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 componentDidRender() {\n interact.dynamicDrop(true);\n\n if (this.editable) {\n interact(this.el).resizable({\n edges: {\n top: '.edge-top',\n left: '.edge-left',\n bottom: '.edge-bottom',\n right: '.edge-right',\n },\n modifiers: [\n interact.modifiers.restrictSize({\n min: {width: 50, height: 12},\n }),\n ],\n listeners: {\n start: this.handleResizeStart.bind(this),\n move: this.handleResize.bind(this),\n end: this.handleResizeEnd.bind(this),\n },\n });\n }\n }\n\n handleResizeStart(e: ResizeEvent) {\n e.preventDefault();\n e.stopPropagation();\n e.target.dataset.originalBottom = e.target.style.bottom;\n }\n\n handleResize(e: any) {\n let {width, height} = e.rect;\n\n const dX = e.deltaRect.left;\n const dY = e.deltaRect.bottom;\n const currentLeft = parseFloat(e.target.style.left);\n const currentBottom = parseFloat(e.target.style.bottom);\n\n width /= this.xscale;\n height /= this.yscale;\n\n Object.assign(e.target.style, {\n width: `${width}px`,\n height: `${height}px`,\n left: `${currentLeft + dX}px`,\n bottom: `${currentBottom - dY}px`,\n });\n }\n\n async handleResizeEnd(e: any) {\n const {sourceid, fieldname} = this;\n\n const width = Math.round(parseFloat(e.target.style.width));\n let height = Math.round(parseFloat(e.target.style.height));\n if (height < 12) {\n height = 12;\n }\n\n const newBottom = parseFloat(e.target.style.bottom);\n const originalBottom = parseFloat(e.target.dataset.originalBottom);\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const oldField = template.fields.find(f => f.name === fieldname);\n const y = newBottom !== originalBottom ? newBottom / this.yscale : oldField?.y;\n\n updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, {width, height, y})\n .then(async updatedField => {\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const newTemplate = JSON.parse(JSON.stringify(template)) as ITemplate;\n const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);\n if (fieldIndex > -1) {\n newTemplate.fields[fieldIndex] = updatedField;\n }\n Store.updateTemplate(this.sourceid, newTemplate);\n\n this.settingsChanged?.emit({fieldName: fieldname, field: updatedField});\n Object.assign(e.target.dataset, {x: 0, y: 0, h: 0});\n })\n .catch(e => console.log('Field update failed', e));\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 // NOTE: We don't use a \"date\" field here because browsers vary widely in their formatting of it.\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, placeholder = 'Date...', value = '', label = '', readonly = false, height = 20, width = 74} = field \|\| {};\n const signerClass = `signer-${(index % 10) + 1}`;\n const small = height < 20 \|\| width < 74;\n\n const formattedValue = value ? format(new Date(value), FORMAT_DATE) : '';\n\n if (this.done) {\n return <Host class={{'verdocs-field': true,done}}>{formattedValue}</Host>;\n }\n\n return (\n <Host class={{'verdocs-field': true,required, disabled, done, focused, small, [signerClass]: true}}>\n {editable && <div class=\"edge-top\" />}\n {editable && <div class=\"edge-right\" />}\n {editable && <div class=\"edge-left\" />}\n {editable && <div class=\"edge-bottom\" />}\n\n {label && <label>{label}</label>}\n\n <input\n name={fieldname}\n class=\"input-el\"\n type=\"text\"\n value={formattedValue}\n id={this.containerId}\n placeholder={placeholder}\n disabled={readonly \|\| disabled}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\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={fieldname}\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={'Date fields allow the user to select a date.'}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-CLFt5iKT.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","format"],"sources":["src/components/fields/verdocs-field-date/verdocs-field-date.scss?tag=verdocs-field-date","src/components/fields/verdocs-field-date/verdocs-field-date.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-date {\n font-family: $verdocs-primary-font;\n width: 74px;\n height: 20px;\n display: block;\n font-size: 11px;\n position: relative;\n scroll-margin: 20px 0;\n letter-spacing: 0.3px;\n background-color: var(--verdocs-field-background, transparent);\n transform-origin: bottom left;\n\n &.small input {\n font-size: 7px;\n }\n\n .edge-top,\n .edge-right,\n .edge-left,\n .edge-bottom {\n position: absolute;\n z-index: 10;\n }\n\n .edge-top {\n top: -2px;\n left: 0;\n right: 0;\n height: 5px;\n }\n\n .edge-right {\n top: 0;\n bottom: 0;\n right: -2px;\n width: 5px;\n }\n\n .edge-left {\n top: 0;\n left: -2px;\n bottom: 0;\n width: 5px;\n }\n\n .edge-bottom {\n bottom: -2px;\n left: 0;\n right: 0;\n height: 5px;\n }\n\n label {\n top: -14px;\n left: 0;\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 input {\n position: absolute;\n\n font-size: 12px;\n\n // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n cursor: inherit;\n\n box-sizing: border-box;\n color: var(--verdocs-field-text-color, rgba(0, 0, 0, 0.87));\n font-weight: 500;\n transform-origin: 0 0;\n height: 100%;\n width: 100%;\n background: none;\n border: var(--verdocs-field-border, 1px solid $light-border-color);\n border-radius: var(--verdocs-field-radius);\n appearance: none;\n\n &.hide {\n display: none;\n }\n }\n\n &.disabled input {\n opacity: 0.5;\n }\n\n &.required {\n input {\n border: 1px solid var(--verdocs-required-field-border);\n }\n }\n\n verdocs-button-panel {\n top: -3px;\n left: -2px;\n opacity: 0.5;\n z-index: 1000;\n cursor: pointer;\n position: absolute;\n transform: scale(0.6);\n\n &[data-active],\n &:hover {\n opacity: 1;\n }\n\n .icon {\n svg {\n fill: #333333;\n }\n\n &:hover {\n svg {\n fill: #000000;\n }\n }\n }\n }\n\n .settings-icon {\n position: absolute;\n top: -3px;\n left: -18px;\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.air-datepicker-cell.-year-.-other-decade-,\n.air-datepicker-cell.-day-.-other-month- {\n color: var(--adp-color-other-month);\n}\n\n.air-datepicker-cell.-year-.-other-decade-:hover,\n.air-datepicker-cell.-day-.-other-month-:hover {\n color: var(--adp-color-other-month-hover);\n}\n\n.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month- {\n color: var(--adp-color-other-month);\n}\n\n.-selected-.air-datepicker-cell.-year-.-other-decade-,\n.-selected-.air-datepicker-cell.-day-.-other-month- {\n color: #fff;\n background: var(--adp-background-color-selected-other-month);\n}\n\n.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-selected-.-focus-.air-datepicker-cell.-day-.-other-month- {\n background: var(--adp-background-color-selected-other-month-focused);\n}\n\n.-in-range-.air-datepicker-cell.-year-.-other-decade-,\n.-in-range-.air-datepicker-cell.-day-.-other-month- {\n background-color: var(--adp-background-color-in-range);\n color: var(--adp-color);\n}\n\n.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,\n.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month- {\n background-color: var(--adp-background-color-in-range-focused);\n}\n\n.air-datepicker-cell.-year-.-other-decade-:empty,\n.air-datepicker-cell.-day-.-other-month-:empty {\n background: none;\n border: none;\n}\n\n.air-datepicker-cell {\n border-radius: var(--adp-cell-border-radius);\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n z-index: 1;\n}\n\n.air-datepicker-cell.-focus- {\n background: var(--adp-cell-background-color-hover);\n}\n\n.air-datepicker-cell.-current- {\n color: var(--adp-color-current-date);\n}\n\n.air-datepicker-cell.-current-.-focus- {\n color: var(--adp-color);\n}\n\n.air-datepicker-cell.-current-.-in-range- {\n color: var(--adp-color-current-date);\n}\n\n.air-datepicker-cell.-disabled- {\n cursor: default;\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-disabled-.-focus- {\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-disabled-.-in-range- {\n color: var(--adp-color-disabled-in-range);\n}\n\n.air-datepicker-cell.-disabled-.-current-.-focus- {\n color: var(--adp-color-disabled);\n}\n\n.air-datepicker-cell.-in-range- {\n background: var(--adp-cell-background-color-in-range);\n border-radius: 0;\n}\n\n.air-datepicker-cell.-in-range-:hover {\n background: var(--adp-cell-background-color-in-range-hover);\n}\n\n.air-datepicker-cell.-range-from- {\n border: 1px solid var(--adp-cell-border-color-in-range);\n background-color: var(--adp-cell-background-color-in-range);\n border-radius: var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius);\n}\n\n.air-datepicker-cell.-range-to- {\n border: 1px solid var(--adp-cell-border-color-in-range);\n background-color: var(--adp-cell-background-color-in-range);\n border-radius: 0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0;\n}\n\n.air-datepicker-cell.-range-to-.-range-from- {\n border-radius: var(--adp-cell-border-radius);\n}\n\n.air-datepicker-cell.-selected- {\n color: #fff;\n border: none;\n background: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-cell.-selected-.-current- {\n color: #fff;\n background: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-cell.-selected-.-focus- {\n background: var(--adp-cell-background-color-selected-hover);\n}\n\n.air-datepicker-body {\n transition: all var(--adp-transition-duration) var(--adp-transition-ease);\n}\n\n.air-datepicker-body.-hidden- {\n display: none;\n}\n\n.air-datepicker-body--day-names {\n display: grid;\n grid-template-columns: repeat(7, var(--adp-day-cell-width));\n margin: 8px 0 3px;\n}\n\n.air-datepicker-body--day-name {\n color: var(--adp-day-name-color);\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1;\n text-align: center;\n text-transform: uppercase;\n font-size: 0.8em;\n}\n\n.air-datepicker-body--day-name.-clickable- {\n cursor: pointer;\n}\n\n.air-datepicker-body--day-name.-clickable-:hover {\n color: var(--adp-day-name-color-hover);\n}\n\n.air-datepicker-body--cells {\n display: grid;\n}\n\n.air-datepicker-body--cells.-days- {\n grid-template-columns: repeat(7, var(--adp-day-cell-width));\n grid-auto-rows: var(--adp-day-cell-height);\n}\n\n.air-datepicker-body--cells.-months- {\n grid-template-columns: repeat(3, 1fr);\n grid-auto-rows: var(--adp-month-cell-height);\n}\n\n.air-datepicker-body--cells.-years- {\n grid-template-columns: repeat(4, 1fr);\n grid-auto-rows: var(--adp-year-cell-height);\n}\n\n.air-datepicker-nav {\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid var(--adp-border-color-inner);\n min-height: var(--adp-nav-height);\n padding: var(--adp-padding);\n box-sizing: content-box;\n}\n\n.-only-timepicker- .air-datepicker-nav {\n display: none;\n}\n\n.air-datepicker-nav--title,\n.air-datepicker-nav--action {\n display: flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n}\n\n.air-datepicker-nav--action {\n width: var(--adp-nav-action-size);\n border-radius: var(--adp-border-radius);\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n\n.air-datepicker-nav--action:hover {\n background: var(--adp-background-color-hover);\n}\n\n.air-datepicker-nav--action:active {\n background: var(--adp-background-color-active);\n}\n\n.air-datepicker-nav--action.-disabled- {\n visibility: hidden;\n}\n\n.air-datepicker-nav--action svg {\n width: 32px;\n height: 32px;\n}\n\n.air-datepicker-nav--action path {\n fill: none;\n stroke: var(--adp-nav-arrow-color);\n stroke-width: 2px;\n}\n\n.air-datepicker-nav--title {\n border-radius: var(--adp-border-radius);\n padding: 0 8px;\n}\n\n.air-datepicker-nav--title i {\n font-style: normal;\n color: var(--adp-nav-color-secondary);\n margin-left: 0.3em;\n}\n\n.air-datepicker-nav--title:hover {\n background: var(--adp-background-color-hover);\n}\n\n.air-datepicker-nav--title:active {\n background: var(--adp-background-color-active);\n}\n\n.air-datepicker-nav--title.-disabled- {\n cursor: default;\n background: none;\n}\n\n.air-datepicker-buttons {\n display: grid;\n grid-auto-columns: 1fr;\n grid-auto-flow: column;\n}\n\n.air-datepicker-button {\n display: inline-flex;\n color: var(--adp-btn-color);\n border-radius: var(--adp-btn-border-radius);\n cursor: pointer;\n height: var(--adp-btn-height);\n border: none;\n background: rgba(255, 255, 255, 0);\n}\n\n.air-datepicker-button:hover {\n color: var(--adp-btn-color-hover);\n background: var(--adp-btn-background-color-hover);\n}\n\n.air-datepicker-button:focus {\n color: var(--adp-btn-color-hover);\n background: var(--adp-btn-background-color-hover);\n outline: none;\n}\n\n.air-datepicker-button:active {\n background: var(--adp-btn-background-color-active);\n}\n\n.air-datepicker-button span {\n outline: none;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n}\n\n.air-datepicker-time {\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 12px;\n align-items: center;\n position: relative;\n padding: 0 var(--adp-time-padding-inner);\n}\n\n.-only-timepicker- .air-datepicker-time {\n border-top: none;\n}\n\n.air-datepicker-time--current {\n display: flex;\n align-items: center;\n flex: 1;\n font-size: 14px;\n text-align: center;\n}\n\n.air-datepicker-time--current-colon {\n margin: 0 2px 3px;\n line-height: 1;\n}\n\n.air-datepicker-time--current-hours,\n.air-datepicker-time--current-minutes {\n line-height: 1;\n font-size: 19px;\n font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;\n position: relative;\n z-index: 1;\n}\n\n.air-datepicker-time--current-hours:after,\n.air-datepicker-time--current-minutes:after {\n content: '';\n background: var(--adp-background-color-hover);\n border-radius: var(--adp-border-radius);\n position: absolute;\n left: -2px;\n top: -3px;\n right: -2px;\n bottom: -2px;\n z-index: -1;\n opacity: 0;\n}\n\n.air-datepicker-time--current-hours.-focus-:after,\n.air-datepicker-time--current-minutes.-focus-:after {\n opacity: 1;\n}\n\n.air-datepicker-time--current-ampm {\n text-transform: uppercase;\n align-self: flex-end;\n color: var(--adp-time-day-period-color);\n margin-left: 6px;\n font-size: 11px;\n margin-bottom: 1px;\n}\n\n.air-datepicker-time--row {\n display: flex;\n align-items: center;\n font-size: 11px;\n height: 17px;\n background: linear-gradient(to right, var(--adp-time-track-color), var(--adp-time-track-color)) left 50%/100% var(--adp-time-track-height) no-repeat;\n}\n\n.air-datepicker-time--row:first-child {\n margin-bottom: 4px;\n}\n\n.air-datepicker-time--row input[type='range'] {\n background: none;\n cursor: pointer;\n flex: 1;\n height: 100%;\n width: 100%;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n -webkit-appearance: none;\n}\n\n.air-datepicker-time--row input[type='range']::-ms-tooltip {\n display: none;\n}\n\n.air-datepicker-time--row input[type='range']:hover::-webkit-slider-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:hover::-moz-range-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:hover::-ms-thumb {\n border-color: var(--adp-time-track-color-hover);\n}\n\n.air-datepicker-time--row input[type='range']:focus {\n outline: none;\n}\n\n.air-datepicker-time--row input[type='range']:focus::-webkit-slider-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']:focus::-moz-range-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']:focus::-ms-thumb {\n background: var(--adp-cell-background-color-selected);\n border-color: var(--adp-cell-background-color-selected);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -webkit-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-moz-range-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -moz-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-thumb {\n box-sizing: border-box;\n height: 12px;\n width: 12px;\n border-radius: 3px;\n border: 1px solid var(--adp-time-track-color);\n background: #fff;\n cursor: pointer;\n -ms-transition: background var(--adp-transition-duration);\n transition: background var(--adp-transition-duration);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-thumb {\n margin-top: calc(var(--adp-time-thumb-size) / 2 * -1);\n}\n\n.air-datepicker-time--row input[type='range']::-webkit-slider-runnable-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-moz-range-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-track {\n border: none;\n height: var(--adp-time-track-height);\n cursor: pointer;\n color: rgba(0, 0, 0, 0);\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-fill-lower {\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker-time--row input[type='range']::-ms-fill-upper {\n background: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker {\n --adp-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\n --adp-font-size: 14px;\n --adp-width: 246px;\n --adp-z-index: 100;\n --adp-padding: 4px;\n --adp-grid-areas: 'nav' 'body' 'timepicker' 'buttons';\n --adp-transition-duration: 0.3s;\n --adp-transition-ease: ease-out;\n --adp-transition-offset: 8px;\n --adp-background-color: #fff;\n --adp-background-color-hover: #f0f0f0;\n --adp-background-color-active: #eaeaea;\n --adp-background-color-in-range: rgba(92, 196, 239, 0.1);\n --adp-background-color-in-range-focused: rgba(92, 196, 239, 0.2);\n --adp-background-color-selected-other-month-focused: #8ad5f4;\n --adp-background-color-selected-other-month: #a2ddf6;\n --adp-color: #4a4a4a;\n --adp-color-secondary: #9c9c9c;\n --adp-accent-color: #4eb5e6;\n --adp-color-current-date: var(--adp-accent-color);\n --adp-color-other-month: #dedede;\n --adp-color-disabled: #aeaeae;\n --adp-color-disabled-in-range: #939393;\n --adp-color-other-month-hover: #c5c5c5;\n --adp-border-color: #dbdbdb;\n --adp-border-color-inner: #efefef;\n --adp-border-radius: 4px;\n --adp-border-color-inline: #d7d7d7;\n --adp-nav-height: 32px;\n --adp-nav-arrow-color: var(--adp-color-secondary);\n --adp-nav-action-size: 32px;\n --adp-nav-color-secondary: var(--adp-color-secondary);\n --adp-day-name-color: #ff9a19;\n --adp-day-name-color-hover: #8ad5f4;\n --adp-day-cell-width: 1fr;\n --adp-day-cell-height: 32px;\n --adp-month-cell-height: 42px;\n --adp-year-cell-height: 56px;\n --adp-pointer-size: 10px;\n --adp-poiner-border-radius: 2px;\n --adp-pointer-offset: 14px;\n --adp-cell-border-radius: 4px;\n --adp-cell-background-color-hover: var(--adp-background-color-hover);\n --adp-cell-background-color-selected: #5cc4ef;\n --adp-cell-background-color-selected-hover: #45bced;\n --adp-cell-background-color-in-range: rgba(92, 196, 239, 0.1);\n --adp-cell-background-color-in-range-hover: rgba(92, 196, 239, 0.2);\n --adp-cell-border-color-in-range: var(--adp-cell-background-color-selected);\n --adp-btn-height: 32px;\n --adp-btn-color: var(--adp-accent-color);\n --adp-btn-color-hover: var(--adp-color);\n --adp-btn-border-radius: var(--adp-border-radius);\n --adp-btn-background-color-hover: var(--adp-background-color-hover);\n --adp-btn-background-color-active: var(--adp-background-color-active);\n --adp-time-track-height: 1px;\n --adp-time-track-color: #dedede;\n --adp-time-track-color-hover: #b1b1b1;\n --adp-time-thumb-size: 12px;\n --adp-time-padding-inner: 10px;\n --adp-time-day-period-color: var(--adp-color-secondary);\n --adp-mobile-font-size: 16px;\n --adp-mobile-nav-height: 40px;\n --adp-mobile-width: 320px;\n --adp-mobile-day-cell-height: 38px;\n --adp-mobile-month-cell-height: 48px;\n --adp-mobile-year-cell-height: 64px;\n}\n\n.air-datepicker-overlay {\n --adp-overlay-background-color: rgba(0, 0, 0, 0.3);\n --adp-overlay-transition-duration: 0.3s;\n --adp-overlay-transition-ease: ease-out;\n --adp-overlay-z-index: 99;\n}\n\n.air-datepicker {\n background: var(--adp-background-color);\n border: 1px solid var(--adp-border-color);\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n border-radius: var(--adp-border-radius);\n box-sizing: content-box;\n display: grid;\n grid-template-columns: 1fr;\n grid-template-rows: repeat(4, max-content);\n grid-template-areas: var(--adp-grid-areas);\n font-family: var(--adp-font-family), sans-serif;\n font-size: var(--adp-font-size);\n color: var(--adp-color);\n width: var(--adp-width);\n position: absolute;\n transition:\n opacity var(--adp-transition-duration) var(--adp-transition-ease),\n transform var(--adp-transition-duration) var(--adp-transition-ease);\n z-index: var(--adp-z-index);\n}\n\n.air-datepicker:not(.-custom-position-) {\n opacity: 0;\n}\n\n.air-datepicker.-from-top- {\n transform: translateY(calc(var(--adp-transition-offset) * -1));\n}\n\n.air-datepicker.-from-right- {\n transform: translateX(var(--adp-transition-offset));\n}\n\n.air-datepicker.-from-bottom- {\n transform: translateY(var(--adp-transition-offset));\n}\n\n.air-datepicker.-from-left- {\n transform: translateX(calc(var(--adp-transition-offset) * -1));\n}\n\n.air-datepicker.-active-:not(.-custom-position-) {\n transform: translate(0, 0);\n opacity: 1;\n}\n\n.air-datepicker.-active-.-custom-position- {\n transition: none;\n}\n\n.air-datepicker.-inline- {\n border-color: var(--adp-border-color-inline);\n box-shadow: none;\n position: static;\n left: auto;\n right: auto;\n opacity: 1;\n transform: none;\n}\n\n.air-datepicker.-inline- .air-datepicker--pointer {\n display: none;\n}\n\n.air-datepicker.-is-mobile- {\n --adp-font-size: var(--adp-mobile-font-size);\n --adp-day-cell-height: var(--adp-mobile-day-cell-height);\n --adp-month-cell-height: var(--adp-mobile-month-cell-height);\n --adp-year-cell-height: var(--adp-mobile-year-cell-height);\n --adp-nav-height: var(--adp-mobile-nav-height);\n --adp-nav-action-size: var(--adp-mobile-nav-height);\n position: fixed;\n width: var(--adp-mobile-width);\n border: none;\n}\n\n.air-datepicker.-is-mobile- * {\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.air-datepicker.-is-mobile- .air-datepicker--pointer {\n display: none;\n}\n\n.air-datepicker.-is-mobile-:not(.-custom-position-) {\n transform: translate(-50%, calc(-50% + var(--adp-transition-offset)));\n}\n\n.air-datepicker.-is-mobile-.-active-:not(.-custom-position-) {\n transform: translate(-50%, -50%);\n}\n\n.air-datepicker.-custom-position- {\n transition: none;\n}\n\n.air-datepicker-global-container {\n position: absolute;\n left: 0;\n top: 0;\n}\n\n.air-datepicker--pointer {\n --pointer-half-size: calc(var(--adp-pointer-size) / 2);\n position: absolute;\n width: var(--adp-pointer-size);\n height: var(--adp-pointer-size);\n z-index: -1;\n}\n\n.air-datepicker--pointer:after {\n content: '';\n position: absolute;\n background: #fff;\n border-top: 1px solid var(--adp-border-color-inline);\n border-right: 1px solid var(--adp-border-color-inline);\n border-top-right-radius: var(--adp-poiner-border-radius);\n width: var(--adp-pointer-size);\n height: var(--adp-pointer-size);\n box-sizing: border-box;\n}\n\n.-top-left- .air-datepicker--pointer,\n.-top-center- .air-datepicker--pointer,\n.-top-right- .air-datepicker--pointer,\n[data-popper-placement^='top'] .air-datepicker--pointer {\n top: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-top-left- .air-datepicker--pointer:after,\n.-top-center- .air-datepicker--pointer:after,\n.-top-right- .air-datepicker--pointer:after,\n[data-popper-placement^='top'] .air-datepicker--pointer:after {\n transform: rotate(135deg);\n}\n\n.-right-top- .air-datepicker--pointer,\n.-right-center- .air-datepicker--pointer,\n.-right-bottom- .air-datepicker--pointer,\n[data-popper-placement^='right'] .air-datepicker--pointer {\n right: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-right-top- .air-datepicker--pointer:after,\n.-right-center- .air-datepicker--pointer:after,\n.-right-bottom- .air-datepicker--pointer:after,\n[data-popper-placement^='right'] .air-datepicker--pointer:after {\n transform: rotate(225deg);\n}\n\n.-bottom-left- .air-datepicker--pointer,\n.-bottom-center- .air-datepicker--pointer,\n.-bottom-right- .air-datepicker--pointer,\n[data-popper-placement^='bottom'] .air-datepicker--pointer {\n bottom: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-bottom-left- .air-datepicker--pointer:after,\n.-bottom-center- .air-datepicker--pointer:after,\n.-bottom-right- .air-datepicker--pointer:after,\n[data-popper-placement^='bottom'] .air-datepicker--pointer:after {\n transform: rotate(315deg);\n}\n\n.-left-top- .air-datepicker--pointer,\n.-left-center- .air-datepicker--pointer,\n.-left-bottom- .air-datepicker--pointer,\n[data-popper-placement^='left'] .air-datepicker--pointer {\n left: calc(100% - var(--pointer-half-size) + 1px);\n}\n\n.-left-top- .air-datepicker--pointer:after,\n.-left-center- .air-datepicker--pointer:after,\n.-left-bottom- .air-datepicker--pointer:after,\n[data-popper-placement^='left'] .air-datepicker--pointer:after {\n transform: rotate(45deg);\n}\n\n.-top-left- .air-datepicker--pointer,\n.-bottom-left- .air-datepicker--pointer {\n left: var(--adp-pointer-offset);\n}\n\n.-top-right- .air-datepicker--pointer,\n.-bottom-right- .air-datepicker--pointer {\n right: var(--adp-pointer-offset);\n}\n\n.-top-center- .air-datepicker--pointer,\n.-bottom-center- .air-datepicker--pointer {\n left: calc(50% - var(--adp-pointer-size) / 2);\n}\n\n.-left-top- .air-datepicker--pointer,\n.-right-top- .air-datepicker--pointer {\n top: var(--adp-pointer-offset);\n}\n\n.-left-bottom- .air-datepicker--pointer,\n.-right-bottom- .air-datepicker--pointer {\n bottom: var(--adp-pointer-offset);\n}\n\n.-left-center- .air-datepicker--pointer,\n.-right-center- .air-datepicker--pointer {\n top: calc(50% - var(--adp-pointer-size) / 2);\n}\n\n.air-datepicker--navigation {\n grid-area: nav;\n}\n\n.air-datepicker--content {\n box-sizing: content-box;\n padding: var(--adp-padding);\n grid-area: body;\n}\n\n.-only-timepicker- .air-datepicker--content {\n display: none;\n}\n\n.air-datepicker--time {\n grid-area: timepicker;\n}\n\n.air-datepicker--buttons {\n grid-area: buttons;\n}\n\n.air-datepicker--buttons,\n.air-datepicker--time {\n padding: var(--adp-padding);\n border-top: 1px solid var(--adp-border-color-inner);\n}\n\n.air-datepicker-overlay {\n position: fixed;\n background: var(--adp-overlay-background-color);\n left: 0;\n top: 0;\n width: 0;\n height: 0;\n opacity: 0;\n transition:\n opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),\n left 0s,\n height 0s,\n width 0s;\n transition-delay: 0s, var(--adp-overlay-transition-duration), var(--adp-overlay-transition-duration), var(--adp-overlay-transition-duration);\n z-index: var(--adp-overlay-z-index);\n}\n\n.air-datepicker-overlay.-active- {\n opacity: 1;\n width: 100%;\n height: 100%;\n transition:\n opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),\n height 0s,\n width 0s;\n}\n\n@keyframes adp-spin {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n","import {format} from 'date-fns';\n// import {getRGBA} from '@verdocs/js-sdk';\nimport interact from 'interactjs';\nimport {ResizeEvent} from '@interactjs/actions/resize/plugin';\nimport AirDatepicker from 'air-datepicker';\nimport localeEn from 'air-datepicker/locale/en';\nimport {type ITemplate, type ITemplateField, updateField, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Fragment, State, Listen, Watch} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {FORMAT_DATE} from '../../../utils/Types';\nimport {Store} from '../../../utils/Datastore';\n\n/*\n Displays a date field. When tapped or clicked, the input element will display a date picker component.\n /\n@Component({\n tag: 'verdocs-field-date',\n styleUrl: 'verdocs-field-date.scss',\n shadow: false,\n})\nexport class VerdocsFieldDate {\n @Element() el: HTMLElement;\n private inputEl: HTMLInputElement;\n\n /\n Fields may be attached to templates or envelopes, but only template fields may be edited.\n /\n @Prop({reflect: true}) source: 'template' \| 'envelope' = 'template';\n\n /\n The source template or envelope ID the field is found in.\n /\n @Prop({reflect: true}) sourceid: string = '';\n\n /\n The name of the field to display.\n /\n @Prop({reflect: true}) fieldname: string = '';\n\n /\n If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n /\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /\n If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n /\n @Prop({reflect: true}) editable?: boolean = false;\n\n /\n If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n /\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /\n If set, the field is considered \"done\" and is drawn in a display-final-value state.\n /\n @Prop({reflect: true}) done?: boolean = false;\n\n /\n If set, the field will be be scaled horizontally by this factor.\n /\n @Prop({reflect: true}) xscale?: number = 1;\n\n /\n If set, the field will be be scaled vertically by this factor.\n /\n @Prop({reflect: true}) yscale?: number = 1;\n\n /\n The page the field is on\n /\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /\n If set, the field will be be scaled vertically by this factor.\n /\n @Prop() field?: ITemplateField;\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 Event fired on every character entered into / deleted from the field.\n /\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /\n Event fired when the field'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() containerId = `verdocs-date-picker-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showingProperties?: boolean = false;\n\n @State() focused = false;\n\n @Listen('blur', {capture: true})\n handleBlur() {\n this.focused = false;\n }\n\n @Method()\n async focusField() {\n this.inputEl.focus();\n this.focused = true;\n }\n\n picker: AirDatepicker<HTMLElement> \| null = null;\n\n componentDidLoad() {\n const {source, sourceid, fieldname} = this;\n const {field} = Store.getField(source, sourceid, fieldname, this.field);\n const {readonly = false} = field \|\| {};\n\n if (!readonly) {\n this.picker = new AirDatepicker<HTMLElement>(`#${this.containerId}`, {\n locale: localeEn,\n isMobile: true,\n autoClose: true,\n onShow: () => (this.focused = true),\n onHide: () => (this.focused = false),\n onSelect: ({date, formattedDate}) => {\n const event = new CustomEvent('fieldChange', {detail: {date, formattedDate}});\n this.el.dispatchEvent(event);\n },\n });\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 componentDidRender() {\n interact.dynamicDrop(true);\n\n if (this.editable) {\n interact(this.el).resizable({\n edges: {\n top: '.edge-top',\n left: '.edge-left',\n bottom: '.edge-bottom',\n right: '.edge-right',\n },\n modifiers: [\n interact.modifiers.restrictSize({\n min: {width: 50, height: 12},\n }),\n ],\n listeners: {\n start: this.handleResizeStart.bind(this),\n move: this.handleResize.bind(this),\n end: this.handleResizeEnd.bind(this),\n },\n });\n }\n }\n\n handleResizeStart(e: ResizeEvent) {\n e.preventDefault();\n e.stopPropagation();\n e.target.dataset.originalBottom = e.target.style.bottom;\n }\n\n handleResize(e: any) {\n let {width, height} = e.rect;\n\n const dX = e.deltaRect.left;\n const dY = e.deltaRect.bottom;\n const currentLeft = parseFloat(e.target.style.left);\n const currentBottom = parseFloat(e.target.style.bottom);\n\n width /= this.xscale;\n height /= this.yscale;\n\n Object.assign(e.target.style, {\n width: `${width}px`,\n height: `${height}px`,\n left: `${currentLeft + dX}px`,\n bottom: `${currentBottom - dY}px`,\n });\n }\n\n async handleResizeEnd(e: any) {\n const {sourceid, fieldname} = this;\n\n const width = Math.round(parseFloat(e.target.style.width));\n let height = Math.round(parseFloat(e.target.style.height));\n if (height < 12) {\n height = 12;\n }\n\n const newBottom = parseFloat(e.target.style.bottom);\n const originalBottom = parseFloat(e.target.dataset.originalBottom);\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const oldField = template.fields.find(f => f.name === fieldname);\n const y = newBottom !== originalBottom ? newBottom / this.yscale : oldField?.y;\n\n updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, {width, height, y})\n .then(async updatedField => {\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const newTemplate = JSON.parse(JSON.stringify(template)) as ITemplate;\n const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);\n if (fieldIndex > -1) {\n newTemplate.fields[fieldIndex] = updatedField;\n }\n Store.updateTemplate(this.sourceid, newTemplate);\n\n this.settingsChanged?.emit({fieldName: fieldname, field: updatedField});\n Object.assign(e.target.dataset, {x: 0, y: 0, h: 0});\n })\n .catch(e => console.log('Field update failed', e));\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 // NOTE: We don't use a \"date\" field here because browsers vary widely in their formatting of it.\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, placeholder = 'Date...', value = '', label = '', readonly = false, height = 20, width = 74} = field \|\| {};\n const signerClass = `signer-${(index % 10) + 1}`;\n const small = height < 20 \|\| width < 74;\n\n const formattedValue = value ? format(new Date(value), FORMAT_DATE) : '';\n\n if (this.done) {\n return <Host class={{'verdocs-field': true,done}}>{formattedValue}</Host>;\n }\n\n return (\n <Host class={{'verdocs-field': true,required, disabled, done, focused, small, [signerClass]: true}}>\n {editable && <div class=\"edge-top\" />}\n {editable && <div class=\"edge-right\" />}\n {editable && <div class=\"edge-left\" />}\n {editable && <div class=\"edge-bottom\" />}\n\n {label && <label>{label}</label>}\n\n <input\n name={fieldname}\n class=\"input-el\"\n type=\"text\"\n value={formattedValue}\n id={this.containerId}\n placeholder={placeholder}\n disabled={readonly \|\| disabled}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\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={fieldname}\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={'Date fields allow the user to select a date.'}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-uNqpODUQ.js → p-CfktXSy-.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CUAGH_8P.js';
-import { e as renderedTextWidth } from './p-CndV_5Je.js';
+import { e as renderedTextWidth } from './p-CqJhwGiq.js';
 import { d as defineCustomElement$1 } from './p-BC5N3FIA.js';
 import { c as createPopper } from './p-BfP9ezJQ.js';
@@ -120,6 +120,6 @@ function defineCustomElement() {
 }
 export { VerdocsQuickFilter as V, defineCustomElement as d };
-//# sourceMappingURL=p-uNqpODUQ.js.map
+//# sourceMappingURL=p-CfktXSy-.js.map
-//# sourceMappingURL=p-uNqpODUQ.js.map
+//# sourceMappingURL=p-CfktXSy-.js.map

package/dist/components/{p-uNqpODUQ.js.map → p-CfktXSy-.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-uNqpODUQ.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-quick-filter/verdocs-quick-filter.scss?tag=verdocs-quick-filter","src/components/controls/verdocs-quick-filter/verdocs-quick-filter.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-quick-filter {\n position: relative;\n font-family: $primary-font;\n\n .control {\n outline: 0;\n height: 34px;\n display: flex;\n cursor: pointer;\n border-radius: 4px;\n align-items: center;\n flex-direction: row;\n box-sizing: border-box;\n background: $verdocs-grey-4;\n transition: all 100ms ease 0s;\n border: 1px solid $verdocs-bg-1;\n }\n\n .title {\n padding: 0 8px;\n font-size: 14px;\n max-width: 100%;\n overflow: hidden;\n color: $label-color;\n white-space: nowrap;\n box-sizing: border-box;\n text-overflow: ellipsis;\n\n .prefix {\n display: inline;\n font-weight: 700;\n margin: 0 7px 0 0;\n color: $secondary-color;\n }\n }\n\n .arrow {\n width: 32px;\n height: 32px;\n border: none;\n outline: none;\n cursor: pointer;\n align-items: center;\n display: inline-flex;\n justify-content: center;\n background: $verdocs-grey-4;\n transition: color 150ms ease 0s;\n\n svg {\n transition: 0.3s;\n fill: $verdocs-bg-1;\n }\n }\n\n .separator {\n width: 1px;\n display: block;\n margin-top: 8px;\n margin-bottom: 8px;\n align-self: stretch;\n box-sizing: border-box;\n background-color: $verdocs-bg-1;\n }\n\n .items {\n display: none;\n z-index: 10000;\n position: absolute;\n border-radius: 4px;\n background: $verdocs-grey-4;\n box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.1) 0 4px 11px;\n }\n\n .items[data-show] {\n display: block;\n }\n\n .option {\n width: 100%;\n border: none;\n display: block;\n font-size: 14px;\n text-align: left;\n background: none;\n padding: 10px 20px;\n color: $verdocs-bg-5;\n }\n\n .option:hover {\n cursor: pointer;\n background: #4c56cb3f;\n }\n\n .option[disabled] {\n color: $light-disabled-color;\n }\n\n .option[disabled]:hover {\n cursor: inherit;\n background: transparent;\n color: $light-disabled-color;\n }\n\n &.open {\n .items {\n display: block;\n }\n\n .arrow svg {\n transform: scaleY(-1);\n }\n }\n}\n","import {Host} from '@stencil/core';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Element, State, h, Event, EventEmitter} from '@stencil/core';\nimport {renderedTextWidth} from '../../../utils/utils';\n\nconst DropdownArrow = `<svg height=\"20\" width=\"20\" viewBox=\"0 0 20 20\" aria-hidden=\"true\" focusable=\"false\" class=\"css-8mmkcg\"><path d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"></path></svg>`;\n\nexport interface IFilterOption {\n value: string;\n label: string;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu of quick filter options.\n \n ```ts\n * <verdocs-quick-filter options={[...options]} value={1} label=\"Filter\" placeholder=\"All\" />\n * ```\n /\n@Component({\n tag: 'verdocs-quick-filter',\n styleUrl: 'verdocs-quick-filter.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n private dropdownButton?: HTMLElement;\n private dropdownMenu?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The menu options to display.\n /\n @Prop() options: IFilterOption[] = [];\n\n @Prop()\n label: string = 'Filter';\n\n @Prop({reflect: true, mutable: true})\n value: string = '';\n\n @Prop()\n placeholder: string = 'Select...';\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IFilterOption>;\n\n @State() open: boolean;\n\n // We need to do this to reliably disconnect the click-away listener\n clickListenerSymbol = new AbortController();\n componentDidLoad() {\n this.popper = createPopper(this.dropdownButton, this.dropdownMenu, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [-1, 14]}}]});\n\n window.addEventListener('click', this.clickListener.bind(this), {signal: this.clickListenerSymbol.signal});\n }\n\n disconnectedCallback() {\n this.clickListenerSymbol.abort();\n }\n\n clickListener(e: any) {\n const outside = !(e.target == this.el \|\| this.el.contains(e.target));\n if (outside) {\n this.hide();\n }\n }\n\n handleSelectOption(e: any, option: IFilterOption) {\n e.stopPropagation();\n this.optionSelected.emit(option);\n this.value = option.value;\n this.hide();\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.open = true;\n this.dropdownMenu.setAttribute('data-show', '');\n this.dropdownMenu.removeAttribute('aria-hidden');\n\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }))\n .catch(() => {});\n\n this.popper?.update().catch(() => {});\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown(e: any) {\n e.stopPropagation();\n\n if (this.open) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.open = false;\n this.dropdownMenu.removeAttribute('data-show');\n this.dropdownMenu.setAttribute('aria-hidden', 'true');\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }))\n .catch(() => {});\n }\n\n render() {\n const selectedOption = this.options?.find(option => option.value === this.value);\n const longestOption = this.options?.reduce((prev, curr) => (prev.label.length > curr.label.length ? prev : curr));\n const longestLabelWidth = renderedTextWidth(longestOption?.label \|\| 'FILLER', '14px Inter, Barlow, sans-serif');\n const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');\n const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;\n\n return (\n <Host class={{open: !!this.open}} style={{minWidth, display: 'inline-block'}}>\n <div class=\"control\" onClick={e => this.toggleDropdown(e)} onBlur={e => this.handleHideDropdown(e)}>\n <div class=\"title\" ref={el => (this.dropdownButton = el as HTMLElement)}>\n <span class=\"prefix\">{this.label}:</span>\n {selectedOption ? selectedOption.label : this.placeholder}\n </div>\n\n <div style={{flex: '1'}} />\n\n <div class=\"separator\" />\n\n <div class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" />\n </div>\n\n <div class=\"items\" aria-hidden={!this.open} ref={el => (this.dropdownMenu = el as HTMLDivElement)} style={{minWidth}}>\n {this.options?.map(option =>\n option.label ? (\n <button onClick={e => this.handleSelectOption(e, option)} class={`option ${option.value === this.value ? 'selected' : ''}`} disabled={option.disabled}>\n {option.label}\n </button>\n ) : (\n <div class=\"separator\" />\n ),\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-CfktXSy-.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/controls/verdocs-quick-filter/verdocs-quick-filter.scss?tag=verdocs-quick-filter","src/components/controls/verdocs-quick-filter/verdocs-quick-filter.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-quick-filter {\n position: relative;\n font-family: $primary-font;\n\n .control {\n outline: 0;\n height: 34px;\n display: flex;\n cursor: pointer;\n border-radius: 4px;\n align-items: center;\n flex-direction: row;\n box-sizing: border-box;\n background: $verdocs-grey-4;\n transition: all 100ms ease 0s;\n border: 1px solid $verdocs-bg-1;\n }\n\n .title {\n padding: 0 8px;\n font-size: 14px;\n max-width: 100%;\n overflow: hidden;\n color: $label-color;\n white-space: nowrap;\n box-sizing: border-box;\n text-overflow: ellipsis;\n\n .prefix {\n display: inline;\n font-weight: 700;\n margin: 0 7px 0 0;\n color: $secondary-color;\n }\n }\n\n .arrow {\n width: 32px;\n height: 32px;\n border: none;\n outline: none;\n cursor: pointer;\n align-items: center;\n display: inline-flex;\n justify-content: center;\n background: $verdocs-grey-4;\n transition: color 150ms ease 0s;\n\n svg {\n transition: 0.3s;\n fill: $verdocs-bg-1;\n }\n }\n\n .separator {\n width: 1px;\n display: block;\n margin-top: 8px;\n margin-bottom: 8px;\n align-self: stretch;\n box-sizing: border-box;\n background-color: $verdocs-bg-1;\n }\n\n .items {\n display: none;\n z-index: 10000;\n position: absolute;\n border-radius: 4px;\n background: $verdocs-grey-4;\n box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.1) 0 4px 11px;\n }\n\n .items[data-show] {\n display: block;\n }\n\n .option {\n width: 100%;\n border: none;\n display: block;\n font-size: 14px;\n text-align: left;\n background: none;\n padding: 10px 20px;\n color: $verdocs-bg-5;\n }\n\n .option:hover {\n cursor: pointer;\n background: #4c56cb3f;\n }\n\n .option[disabled] {\n color: $light-disabled-color;\n }\n\n .option[disabled]:hover {\n cursor: inherit;\n background: transparent;\n color: $light-disabled-color;\n }\n\n &.open {\n .items {\n display: block;\n }\n\n .arrow svg {\n transform: scaleY(-1);\n }\n }\n}\n","import {Host} from '@stencil/core';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Element, State, h, Event, EventEmitter} from '@stencil/core';\nimport {renderedTextWidth} from '../../../utils/utils';\n\nconst DropdownArrow = `<svg height=\"20\" width=\"20\" viewBox=\"0 0 20 20\" aria-hidden=\"true\" focusable=\"false\" class=\"css-8mmkcg\"><path d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"></path></svg>`;\n\nexport interface IFilterOption {\n value: string;\n label: string;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu of quick filter options.\n \n ```ts\n * <verdocs-quick-filter options={[...options]} value={1} label=\"Filter\" placeholder=\"All\" />\n * ```\n /\n@Component({\n tag: 'verdocs-quick-filter',\n styleUrl: 'verdocs-quick-filter.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n private dropdownButton?: HTMLElement;\n private dropdownMenu?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The menu options to display.\n /\n @Prop() options: IFilterOption[] = [];\n\n @Prop()\n label: string = 'Filter';\n\n @Prop({reflect: true, mutable: true})\n value: string = '';\n\n @Prop()\n placeholder: string = 'Select...';\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IFilterOption>;\n\n @State() open: boolean;\n\n // We need to do this to reliably disconnect the click-away listener\n clickListenerSymbol = new AbortController();\n componentDidLoad() {\n this.popper = createPopper(this.dropdownButton, this.dropdownMenu, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [-1, 14]}}]});\n\n window.addEventListener('click', this.clickListener.bind(this), {signal: this.clickListenerSymbol.signal});\n }\n\n disconnectedCallback() {\n this.clickListenerSymbol.abort();\n }\n\n clickListener(e: any) {\n const outside = !(e.target == this.el \|\| this.el.contains(e.target));\n if (outside) {\n this.hide();\n }\n }\n\n handleSelectOption(e: any, option: IFilterOption) {\n e.stopPropagation();\n this.optionSelected.emit(option);\n this.value = option.value;\n this.hide();\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.open = true;\n this.dropdownMenu.setAttribute('data-show', '');\n this.dropdownMenu.removeAttribute('aria-hidden');\n\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }))\n .catch(() => {});\n\n this.popper?.update().catch(() => {});\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown(e: any) {\n e.stopPropagation();\n\n if (this.open) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.open = false;\n this.dropdownMenu.removeAttribute('data-show');\n this.dropdownMenu.setAttribute('aria-hidden', 'true');\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }))\n .catch(() => {});\n }\n\n render() {\n const selectedOption = this.options?.find(option => option.value === this.value);\n const longestOption = this.options?.reduce((prev, curr) => (prev.label.length > curr.label.length ? prev : curr));\n const longestLabelWidth = renderedTextWidth(longestOption?.label \|\| 'FILLER', '14px Inter, Barlow, sans-serif');\n const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');\n const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;\n\n return (\n <Host class={{open: !!this.open}} style={{minWidth, display: 'inline-block'}}>\n <div class=\"control\" onClick={e => this.toggleDropdown(e)} onBlur={e => this.handleHideDropdown(e)}>\n <div class=\"title\" ref={el => (this.dropdownButton = el as HTMLElement)}>\n <span class=\"prefix\">{this.label}:</span>\n {selectedOption ? selectedOption.label : this.placeholder}\n </div>\n\n <div style={{flex: '1'}} />\n\n <div class=\"separator\" />\n\n <div class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" />\n </div>\n\n <div class=\"items\" aria-hidden={!this.open} ref={el => (this.dropdownMenu = el as HTMLDivElement)} style={{minWidth}}>\n {this.options?.map(option =>\n option.label ? (\n <button onClick={e => this.handleSelectOption(e, option)} class={`option ${option.value === this.value ? 'selected' : ''}`} disabled={option.disabled}>\n {option.label}\n </button>\n ) : (\n <div class=\"separator\" />\n ),\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-CndV_5Je.js → p-CqJhwGiq.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { d as dateFnsExports } from './p-6fSdgmoO.js';
+import { d as dateFnsExports } from './p-CIJlsf-4.js';
 import { getEnvelopesZip, downloadBlob, rescale } from '@verdocs/js-sdk';
 import { a as FORMAT_DATE } from './p-DMMF9yT2.js';
@@ -291,6 +291,6 @@ const getFieldLabel = (field) => {
 };
 export { renderDocumentField as a, getFieldLabel as b, convertToE164 as c, defaultHeight as d, renderedTextWidth as e, getControlStyles as f, getFieldId as g, updateCssTransform as h, removeCssTransform as i, setControlStyles as j, defaultWidth as k, renderDocumentFlag as r, saveEnvelopesAsZip as s, throttle as t, updateDocumentFieldValue as u };
-//# sourceMappingURL=p-CndV_5Je.js.map
+//# sourceMappingURL=p-CqJhwGiq.js.map
-//# sourceMappingURL=p-CndV_5Je.js.map
+//# sourceMappingURL=p-CqJhwGiq.js.map

package/dist/components/{p-CndV_5Je.js.map → p-CqJhwGiq.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-CndV_5Je.js","mappings":"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","names":["format"],"sources":["src/utils/utils.ts"],"sourcesContent":["import {format} from 'date-fns';\nimport {downloadBlob, getEnvelopeFile, getEnvelopesZip, IEnvelope, IEnvelopeField, ITemplateField, rescale, TFieldType, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {FORMAT_DATE, IDocumentPageInfo} from './Types';\n\nexport const defaultWidth = (type: TFieldType) => {\n // checkbox was a legacy field type\n switch (type as any) {\n case 'textarea':\n return 150;\n case 'textbox':\n return 150;\n case 'timestamp':\n return 105;\n case 'date':\n return 75;\n case 'dropdown':\n return 85;\n case 'attachment':\n case 'payment':\n return 24;\n case 'radio':\n case 'checkbox':\n return 14;\n case 'signature':\n case 'initial':\n return 71;\n }\n\n return 150;\n};\n\nexport const defaultHeight = (type: TFieldType) => {\n switch (type as any) {\n case 'textarea':\n return 41;\n case 'textbox':\n return 15;\n case 'timestamp':\n return 15;\n case 'date':\n return 15;\n case 'dropdown':\n return 20;\n case 'attachment':\n case 'payment':\n return 24;\n case 'radio':\n case 'checkbox':\n return 14;\n case 'signature':\n case 'initial':\n return 36;\n }\n\n return 50;\n};\n\nexport const setControlStyles = (el: HTMLElement, field: ITemplateField \| IEnvelopeField, xScale: number, yScale: number) => {\n let {x = 0, y = 0, width = defaultWidth(field.type), height = defaultHeight(field.type), settings} = field;\n const isCanvasField = field.type === 'signature' \|\| field.type === 'initial';\n const canvasWidth = !isCanvasField ? width : (settings?.canvasWidth ?? width);\n const canvasHeight = !isCanvasField ? height : (settings?.canvasHeight ?? height);\n\n el.style.width = `${canvasWidth}px`;\n el.style.height = `${canvasHeight}px`;\n el.style.position = 'absolute';\n el.style.left = `${rescale(xScale, x)}px`;\n el.style.bottom = `${rescale(yScale, y)}px`;\n el.style.transform = `scale(${xScale}, ${yScale})`;\n};\n\nexport const getControlStyles = (field: ITemplateField \| IEnvelopeField, xScale: number, yScale: number) => {\n let {x = 0, y = 0, width = defaultWidth(field.type), height = defaultHeight(field.type)} = field;\n\n return {\n zIndex: '100',\n width: `${width}px`,\n height: `${height}px`,\n position: 'absolute',\n left: `${rescale(xScale, x)}px`,\n bottom: `${rescale(yScale, y)}px`,\n transform: `scale(${xScale}, ${yScale})`,\n };\n};\n\nexport const getFieldId = (field: ITemplateField \| IEnvelopeField) => {\n return `verdocs-doc-fld-${field.name}`;\n};\n\ninterface IFieldOptions {\n disabled?: boolean;\n editable?: boolean;\n draggable?: boolean;\n done?: boolean;\n}\n\nexport const updateDocumentFieldValue = (field: ITemplateField \| IEnvelopeField) => {\n const id = getFieldId(field);\n const existingField = document.getElementById(id) as any;\n if (existingField) {\n existingField.field = field;\n existingField.roleindex = field;\n existingField.setAttribute('id', id); // We need this to trigger a re-render\n existingField.setAttribute('disabled', true); // We need this to trigger a re-render\n existingField.setAttribute('disabled', false); // We need this to trigger a re-render\n }\n};\n\nexport const renderDocumentField = (\n source: 'envelope' \| 'template',\n field: ITemplateField \| IEnvelopeField,\n docPage: IDocumentPageInfo,\n fieldOptions: IFieldOptions,\n tabIndex: number = 1,\n) => {\n const {disabled = false, editable = false, draggable = false, done = false} = fieldOptions;\n const controlsDiv = document.getElementById(docPage.containerId + '-controls');\n if (!controlsDiv) {\n // TODO: This gets emitted a lot by the builder naturally, when placing or updating fields, because Store.updateTemplate\n // triggers a re-render but we still have async code pending in contexts with references to the old/wrong controls DIV\n // IDs. It doesn't break anything because the re-render fixes it all up. But we do want to trap this for \"other\" situations.\n // console.log('[renderDocumentField] No controls DIV found', docPage.containerId + '-controls', docPage);\n return;\n }\n\n switch (field.type as any) {\n case 'radio':\n case 'checkbox':\n case 'attachment':\n case 'date':\n case 'dropdown':\n case 'initial':\n case 'payment':\n case 'signature':\n case 'timestamp':\n case 'textarea':\n case 'textbox': {\n const id = getFieldId(field);\n const existingField = document.getElementById(id) as any;\n if (existingField) {\n existingField.field = field;\n existingField.done = done;\n setControlStyles(existingField, field, docPage.xScale, docPage.yScale);\n return existingField;\n }\n\n let {type} = field;\n if (type === 'textbox') {\n if (field['setting']?.leading > 0 \|\| field['settings']?.leading > 0) {\n type = 'textarea';\n }\n }\n\n const el: any = document.createElement(`verdocs-field-${type}`);\n el.field = field;\n el.setAttribute('id', id);\n el.setAttribute('fieldname', field.name);\n el.setAttribute('source', source);\n el.setAttribute('sourceid', 'template_id' in field ? field.template_id : field.envelope_id);\n\n if (disabled) {\n el.setAttribute('tabindex', -1);\n el.setAttribute('disabled', true);\n } else {\n el.setAttribute('tabindex', tabIndex);\n }\n\n el.setAttribute('editable', editable);\n el.setAttribute('draggable', draggable);\n el.setAttribute('done', done);\n\n setControlStyles(el, field, docPage.xScale, docPage.yScale);\n controlsDiv.appendChild(el);\n\n return el;\n }\n\n default:\n console.log('[PREVIEW] Skipping unsupported field type', field);\n return null;\n }\n};\n\n/*\n Helper function to safely set/update components in a CSS transform attribute. Transform is normally set as a string of\n * `operation1(param) operation2(param) ...` components, which makes updating them a bit of a pain. This will remove the\n * specified component if it's already set and replace it with the new value, without touching the other components that\n * may already be set. Note that this operation moves the component to the end of the transform chain so it's not meant\n * to be used for order-sensitive components e.g. translate-then-rotate.\n /\nexport const updateCssTransform = (el: HTMLElement, key: string, value: string) => {\n const currentTransform = el.style.transform \|\| '';\n\n const newValue = `${key}(${value})`;\n if (currentTransform.includes(key)) {\n el.style.transform = currentTransform.replace(new RegExp(`${key}\\\$.+?\\\$`), newValue);\n } else {\n el.style.transform = currentTransform + ' ' + newValue;\n }\n};\n\nexport const removeCssTransform = (el: HTMLElement) => {\n // const currentTransform = el.style.transform \|\| '';\n el.style.transform = el.style.transform.split(')')[0] + ')';\n // TODO: This is not working\n // el.style.transform = currentTransform.replace(new RegExp(`\$${key}\\\\(.+?\\\$\\)`), '');\n};\n\n// TODO: Shift to getDownloadLilnk\nexport const saveAttachment = async (endpoint: VerdocsEndpoint, envelope: IEnvelope, documentId: string) => {\n // e.g. \"Colorado-Motor-Vehicle-Bill-of-Sale.pdf\"\n const date = format(new Date(envelope.updated_at), FORMAT_DATE);\n const fileName = `${envelope.name} - ${date}.pdf`;\n const data = await getEnvelopeFile(endpoint, documentId);\n downloadBlob(data, fileName);\n};\n\nexport const saveEnvelopesAsZip = async (endpoint: VerdocsEndpoint, envelopes: IEnvelope[]) => {\n const formattedDate = format(envelopes.length === 1 ? new Date(envelopes[0].updated_at) : new Date(), FORMAT_DATE);\n const zipFileName = envelopes.length === 1 ? `${envelopes[0].name} - ${formattedDate}.zip` : `Verdocs-Envelopes-${formattedDate}`;\n console.log('Downloading envelopes as ZIP', envelopes, zipFileName);\n const result = await getEnvelopesZip(\n endpoint,\n envelopes.map(e => e.id),\n );\n downloadBlob(result.data, zipFileName);\n};\n\n/\n Throttle a given function by a delay value. Useful for things like resizeObserver.\n /\nexport const throttle = (f: Function, delay: number) => {\n let timer: any = 0;\n return function (...args) {\n clearTimeout(timer);\n timer = setTimeout(() => f.apply(this, args), delay);\n };\n};\n\n/\n Compute the rendered width of a given text string, using a given font.\n /\nexport const renderedTextWidth = (text: string, font: string = '16px Arial') => {\n const canvas = document.createElement('canvas');\n const ctx = canvas.getContext('2d');\n ctx.font = font;\n return ctx.measureText(text).width;\n};\n\n// \"(212) 555-1212\" => +12125551212\n// \"+46766861004\" => \"+46766861004\"\n// \"212-555-1212\" => +12125551212\n// \"212.555.1212\" => +12125551212\n// \"212 555 1212\" => +12125551212\n// @see https://46elks.com/kb/e164\nexport const convertToE164 = (input: string) => {\n let temp = (input \|\| '').trim();\n // If we are already prefixed, assume the user did it deliberately and attempt to use what they entered. We also short-circuit blanks.\n if (!temp \|\| temp.startsWith('+')) {\n return temp;\n }\n\n // Remove any spaces, parenthesis or other punctuation.\n temp = temp.replace(/[^0-9]/g, '');\n\n // If the number begins with a zero, remove the leading zero. Do not combine this with the previous step because it needs to be removed\n // whether it's the actual first character e.g. `0(5)` or just the first digit e.g. `(05`.\n temp = temp.replace(/^0/g, '');\n\n // Prepend the country code and +. We're assuming US in this case given the target demographic. Users in other countries would/should be\n // already entering a prefix so they'd shortcut out of this routine via the + prefix check.\n return `+1${temp}`;\n};\n\nexport interface IFlagOptions {\n variant: 'fill' \| 'next';\n label: string;\n showSkip?: boolean;\n onSkip?: () => void;\n onClick?: () => void;\n id?: string;\n}\n\nexport const renderDocumentFlag = (\n docPage: IDocumentPageInfo,\n y: number, // Bottom position from field\n height: number, // Field height\n options: IFlagOptions,\n) => {\n const controlsDiv = document.getElementById(docPage.containerId + '-controls');\n if (!controlsDiv) {\n return;\n }\n\n const el: any = document.createElement('verdocs-flag');\n el.variant = options.variant;\n el.label = options.label;\n el.showSkip = options.showSkip;\n if (options.id) {\n el.setAttribute('id', options.id);\n }\n el.classList.add('verdocs-flag-instance'); // Marker class for easy removal\n\n if (options.onSkip) {\n el.addEventListener('skip', options.onSkip);\n }\n if (options.onClick) {\n el.addEventListener('flagClick', options.onClick);\n }\n\n // Position the flag to stick out of the right edge of the page\n el.style.position = 'absolute';\n\n // The flag has a left-pointing arrow that is 14px wide (15% of 97px ~= 14.5px).\n // We want the \"body\" of the rectangle (starting after the arrow) to align with the\n // right edge of the page.\n el.style.left = 'calc(100% - 14px)';\n\n /\n * Positioning Logic:\n * Field Y is distance from bottom.\n * Fields have `transform-origin: bottom left`.\n * Visual Bottom = y * scale.\n * Visual Top = (y * scale) + (height * scale).\n * Visual Center = (y * scale) + (height * scale) / 2.\n /\n // const flagHeight = 24; // Matches CSS\n const scaledY = rescale(docPage.yScale, y);\n const scaledHeight = rescale(docPage.yScale, height);\n\n // Align Flag Bottom with Field Top\n const bottom = scaledY + scaledHeight;\n\n el.style.bottom = `${bottom}px`;\n\n controlsDiv.appendChild(el);\n return el;\n};\n\n/\n Helper to generate a human-readable label for a field.\n /\nexport const getFieldLabel = (field: IEnvelopeField \| ITemplateField) => {\n if (!field) return '';\n const typeMap: Record<string, string> = {\n signature: 'Signature',\n initial: 'Initials',\n date: 'Date',\n textbox: 'Text Field',\n checkbox: 'Checkbox',\n radio: 'Radio Button',\n dropdown: 'Dropdown',\n attachment: 'Attachment',\n payment: 'Payment',\n };\n\n const typeName = typeMap[field.type] \|\| 'Field';\n if (field.required) {\n return `Required ${typeName}`;\n }\n return `Optional ${typeName}`;\n};\n"],"version":3}
1	+ {"file":"p-CqJhwGiq.js","mappings":"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","names":["format"],"sources":["src/utils/utils.ts"],"sourcesContent":["import {format} from 'date-fns';\nimport {downloadBlob, getEnvelopeFile, getEnvelopesZip, IEnvelope, IEnvelopeField, ITemplateField, rescale, TFieldType, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {FORMAT_DATE, IDocumentPageInfo} from './Types';\n\nexport const defaultWidth = (type: TFieldType) => {\n // checkbox was a legacy field type\n switch (type as any) {\n case 'textarea':\n return 150;\n case 'textbox':\n return 150;\n case 'timestamp':\n return 105;\n case 'date':\n return 75;\n case 'dropdown':\n return 85;\n case 'attachment':\n case 'payment':\n return 24;\n case 'radio':\n case 'checkbox':\n return 14;\n case 'signature':\n case 'initial':\n return 71;\n }\n\n return 150;\n};\n\nexport const defaultHeight = (type: TFieldType) => {\n switch (type as any) {\n case 'textarea':\n return 41;\n case 'textbox':\n return 15;\n case 'timestamp':\n return 15;\n case 'date':\n return 15;\n case 'dropdown':\n return 20;\n case 'attachment':\n case 'payment':\n return 24;\n case 'radio':\n case 'checkbox':\n return 14;\n case 'signature':\n case 'initial':\n return 36;\n }\n\n return 50;\n};\n\nexport const setControlStyles = (el: HTMLElement, field: ITemplateField \| IEnvelopeField, xScale: number, yScale: number) => {\n let {x = 0, y = 0, width = defaultWidth(field.type), height = defaultHeight(field.type), settings} = field;\n const isCanvasField = field.type === 'signature' \|\| field.type === 'initial';\n const canvasWidth = !isCanvasField ? width : (settings?.canvasWidth ?? width);\n const canvasHeight = !isCanvasField ? height : (settings?.canvasHeight ?? height);\n\n el.style.width = `${canvasWidth}px`;\n el.style.height = `${canvasHeight}px`;\n el.style.position = 'absolute';\n el.style.left = `${rescale(xScale, x)}px`;\n el.style.bottom = `${rescale(yScale, y)}px`;\n el.style.transform = `scale(${xScale}, ${yScale})`;\n};\n\nexport const getControlStyles = (field: ITemplateField \| IEnvelopeField, xScale: number, yScale: number) => {\n let {x = 0, y = 0, width = defaultWidth(field.type), height = defaultHeight(field.type)} = field;\n\n return {\n zIndex: '100',\n width: `${width}px`,\n height: `${height}px`,\n position: 'absolute',\n left: `${rescale(xScale, x)}px`,\n bottom: `${rescale(yScale, y)}px`,\n transform: `scale(${xScale}, ${yScale})`,\n };\n};\n\nexport const getFieldId = (field: ITemplateField \| IEnvelopeField) => {\n return `verdocs-doc-fld-${field.name}`;\n};\n\ninterface IFieldOptions {\n disabled?: boolean;\n editable?: boolean;\n draggable?: boolean;\n done?: boolean;\n}\n\nexport const updateDocumentFieldValue = (field: ITemplateField \| IEnvelopeField) => {\n const id = getFieldId(field);\n const existingField = document.getElementById(id) as any;\n if (existingField) {\n existingField.field = field;\n existingField.roleindex = field;\n existingField.setAttribute('id', id); // We need this to trigger a re-render\n existingField.setAttribute('disabled', true); // We need this to trigger a re-render\n existingField.setAttribute('disabled', false); // We need this to trigger a re-render\n }\n};\n\nexport const renderDocumentField = (\n source: 'envelope' \| 'template',\n field: ITemplateField \| IEnvelopeField,\n docPage: IDocumentPageInfo,\n fieldOptions: IFieldOptions,\n tabIndex: number = 1,\n) => {\n const {disabled = false, editable = false, draggable = false, done = false} = fieldOptions;\n const controlsDiv = document.getElementById(docPage.containerId + '-controls');\n if (!controlsDiv) {\n // TODO: This gets emitted a lot by the builder naturally, when placing or updating fields, because Store.updateTemplate\n // triggers a re-render but we still have async code pending in contexts with references to the old/wrong controls DIV\n // IDs. It doesn't break anything because the re-render fixes it all up. But we do want to trap this for \"other\" situations.\n // console.log('[renderDocumentField] No controls DIV found', docPage.containerId + '-controls', docPage);\n return;\n }\n\n switch (field.type as any) {\n case 'radio':\n case 'checkbox':\n case 'attachment':\n case 'date':\n case 'dropdown':\n case 'initial':\n case 'payment':\n case 'signature':\n case 'timestamp':\n case 'textarea':\n case 'textbox': {\n const id = getFieldId(field);\n const existingField = document.getElementById(id) as any;\n if (existingField) {\n existingField.field = field;\n existingField.done = done;\n setControlStyles(existingField, field, docPage.xScale, docPage.yScale);\n return existingField;\n }\n\n let {type} = field;\n if (type === 'textbox') {\n if (field['setting']?.leading > 0 \|\| field['settings']?.leading > 0) {\n type = 'textarea';\n }\n }\n\n const el: any = document.createElement(`verdocs-field-${type}`);\n el.field = field;\n el.setAttribute('id', id);\n el.setAttribute('fieldname', field.name);\n el.setAttribute('source', source);\n el.setAttribute('sourceid', 'template_id' in field ? field.template_id : field.envelope_id);\n\n if (disabled) {\n el.setAttribute('tabindex', -1);\n el.setAttribute('disabled', true);\n } else {\n el.setAttribute('tabindex', tabIndex);\n }\n\n el.setAttribute('editable', editable);\n el.setAttribute('draggable', draggable);\n el.setAttribute('done', done);\n\n setControlStyles(el, field, docPage.xScale, docPage.yScale);\n controlsDiv.appendChild(el);\n\n return el;\n }\n\n default:\n console.log('[PREVIEW] Skipping unsupported field type', field);\n return null;\n }\n};\n\n/*\n Helper function to safely set/update components in a CSS transform attribute. Transform is normally set as a string of\n * `operation1(param) operation2(param) ...` components, which makes updating them a bit of a pain. This will remove the\n * specified component if it's already set and replace it with the new value, without touching the other components that\n * may already be set. Note that this operation moves the component to the end of the transform chain so it's not meant\n * to be used for order-sensitive components e.g. translate-then-rotate.\n /\nexport const updateCssTransform = (el: HTMLElement, key: string, value: string) => {\n const currentTransform = el.style.transform \|\| '';\n\n const newValue = `${key}(${value})`;\n if (currentTransform.includes(key)) {\n el.style.transform = currentTransform.replace(new RegExp(`${key}\\\$.+?\\\$`), newValue);\n } else {\n el.style.transform = currentTransform + ' ' + newValue;\n }\n};\n\nexport const removeCssTransform = (el: HTMLElement) => {\n // const currentTransform = el.style.transform \|\| '';\n el.style.transform = el.style.transform.split(')')[0] + ')';\n // TODO: This is not working\n // el.style.transform = currentTransform.replace(new RegExp(`\$${key}\\\\(.+?\\\$\\)`), '');\n};\n\n// TODO: Shift to getDownloadLilnk\nexport const saveAttachment = async (endpoint: VerdocsEndpoint, envelope: IEnvelope, documentId: string) => {\n // e.g. \"Colorado-Motor-Vehicle-Bill-of-Sale.pdf\"\n const date = format(new Date(envelope.updated_at), FORMAT_DATE);\n const fileName = `${envelope.name} - ${date}.pdf`;\n const data = await getEnvelopeFile(endpoint, documentId);\n downloadBlob(data, fileName);\n};\n\nexport const saveEnvelopesAsZip = async (endpoint: VerdocsEndpoint, envelopes: IEnvelope[]) => {\n const formattedDate = format(envelopes.length === 1 ? new Date(envelopes[0].updated_at) : new Date(), FORMAT_DATE);\n const zipFileName = envelopes.length === 1 ? `${envelopes[0].name} - ${formattedDate}.zip` : `Verdocs-Envelopes-${formattedDate}`;\n console.log('Downloading envelopes as ZIP', envelopes, zipFileName);\n const result = await getEnvelopesZip(\n endpoint,\n envelopes.map(e => e.id),\n );\n downloadBlob(result.data, zipFileName);\n};\n\n/\n Throttle a given function by a delay value. Useful for things like resizeObserver.\n /\nexport const throttle = (f: Function, delay: number) => {\n let timer: any = 0;\n return function (...args) {\n clearTimeout(timer);\n timer = setTimeout(() => f.apply(this, args), delay);\n };\n};\n\n/\n Compute the rendered width of a given text string, using a given font.\n /\nexport const renderedTextWidth = (text: string, font: string = '16px Arial') => {\n const canvas = document.createElement('canvas');\n const ctx = canvas.getContext('2d');\n ctx.font = font;\n return ctx.measureText(text).width;\n};\n\n// \"(212) 555-1212\" => +12125551212\n// \"+46766861004\" => \"+46766861004\"\n// \"212-555-1212\" => +12125551212\n// \"212.555.1212\" => +12125551212\n// \"212 555 1212\" => +12125551212\n// @see https://46elks.com/kb/e164\nexport const convertToE164 = (input: string) => {\n let temp = (input \|\| '').trim();\n // If we are already prefixed, assume the user did it deliberately and attempt to use what they entered. We also short-circuit blanks.\n if (!temp \|\| temp.startsWith('+')) {\n return temp;\n }\n\n // Remove any spaces, parenthesis or other punctuation.\n temp = temp.replace(/[^0-9]/g, '');\n\n // If the number begins with a zero, remove the leading zero. Do not combine this with the previous step because it needs to be removed\n // whether it's the actual first character e.g. `0(5)` or just the first digit e.g. `(05`.\n temp = temp.replace(/^0/g, '');\n\n // Prepend the country code and +. We're assuming US in this case given the target demographic. Users in other countries would/should be\n // already entering a prefix so they'd shortcut out of this routine via the + prefix check.\n return `+1${temp}`;\n};\n\nexport interface IFlagOptions {\n variant: 'fill' \| 'next';\n label: string;\n showSkip?: boolean;\n onSkip?: () => void;\n onClick?: () => void;\n id?: string;\n}\n\nexport const renderDocumentFlag = (\n docPage: IDocumentPageInfo,\n y: number, // Bottom position from field\n height: number, // Field height\n options: IFlagOptions,\n) => {\n const controlsDiv = document.getElementById(docPage.containerId + '-controls');\n if (!controlsDiv) {\n return;\n }\n\n const el: any = document.createElement('verdocs-flag');\n el.variant = options.variant;\n el.label = options.label;\n el.showSkip = options.showSkip;\n if (options.id) {\n el.setAttribute('id', options.id);\n }\n el.classList.add('verdocs-flag-instance'); // Marker class for easy removal\n\n if (options.onSkip) {\n el.addEventListener('skip', options.onSkip);\n }\n if (options.onClick) {\n el.addEventListener('flagClick', options.onClick);\n }\n\n // Position the flag to stick out of the right edge of the page\n el.style.position = 'absolute';\n\n // The flag has a left-pointing arrow that is 14px wide (15% of 97px ~= 14.5px).\n // We want the \"body\" of the rectangle (starting after the arrow) to align with the\n // right edge of the page.\n el.style.left = 'calc(100% - 14px)';\n\n /\n * Positioning Logic:\n * Field Y is distance from bottom.\n * Fields have `transform-origin: bottom left`.\n * Visual Bottom = y * scale.\n * Visual Top = (y * scale) + (height * scale).\n * Visual Center = (y * scale) + (height * scale) / 2.\n /\n // const flagHeight = 24; // Matches CSS\n const scaledY = rescale(docPage.yScale, y);\n const scaledHeight = rescale(docPage.yScale, height);\n\n // Align Flag Bottom with Field Top\n const bottom = scaledY + scaledHeight;\n\n el.style.bottom = `${bottom}px`;\n\n controlsDiv.appendChild(el);\n return el;\n};\n\n/\n Helper to generate a human-readable label for a field.\n /\nexport const getFieldLabel = (field: IEnvelopeField \| ITemplateField) => {\n if (!field) return '';\n const typeMap: Record<string, string> = {\n signature: 'Signature',\n initial: 'Initials',\n date: 'Date',\n textbox: 'Text Field',\n checkbox: 'Checkbox',\n radio: 'Radio Button',\n dropdown: 'Dropdown',\n attachment: 'Attachment',\n payment: 'Payment',\n };\n\n const typeName = typeMap[field.type] \|\| 'Field';\n if (field.required) {\n return `Required ${typeName}`;\n }\n return `Optional ${typeName}`;\n};\n"],"version":3}

package/dist/components/{p-B6tZPSE-.js → p-NpSE9E9W.js} RENAMED Viewed

@@ -5,7 +5,7 @@ import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-C7hFgM52.js';
 import { d as defineCustomElement$8 } from './p-Ba_mXs1J.js';
 import { d as defineCustomElement$7 } from './p-Dlm5bUxv.js';
-import { d as defineCustomElement$6 } from './p-BCwx8bsK.js';
+import { d as defineCustomElement$6 } from './p-BszQpvWk.js';
 import { d as defineCustomElement$5 } from './p-BC5N3FIA.js';
 import { d as defineCustomElement$4 } from './p-CNKACBaL.js';
 import { d as defineCustomElement$3 } from './p-o9BQIoXw.js';
@@ -410,6 +410,6 @@ function defineCustomElement() {
 }
 export { VerdocsView as V, defineCustomElement as d };
-//# sourceMappingURL=p-B6tZPSE-.js.map
+//# sourceMappingURL=p-NpSE9E9W.js.map
-//# sourceMappingURL=p-B6tZPSE-.js.map
+//# sourceMappingURL=p-NpSE9E9W.js.map