npm - @verdocs/web-sdk - Versions diffs - 5.3.1 → 5.3.2 - Mend

@verdocs/web-sdk 5.3.1 → 5.3.2

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

package/dist/verdocs-web-sdk/{p-Dt0S5N8D.system.js.map → p-C3pXyYu2.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-~~Dt0S5N8D~~.system.js","sources":["src/components/controls/verdocs-toggle-button/verdocs-toggle-button.scss?tag=verdocs-toggle-button","src/components/controls/verdocs-toggle-button/verdocs-toggle-button.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle-button {\n font-family: $primary-font;\n\n button {\n border: none;\n outline: none;\n cursor: pointer;\n align-items: center;\n display: inline-flex;\n justify-content: center;\n background: $verdocs-bg-1;\n color: $verdocs-dark-blue;\n\n svg {\n max-width: 100%;\n max-height: 100%;\n fill: $verdocs-dark-blue;\n }\n\n &.active {\n background: $verdocs-green;\n color: $verdocs-grey-3;\n\n svg {\n fill: $verdocs-grey-3;\n }\n }\n\n &:focus {\n border: none;\n outline: none;\n }\n }\n\n &.size-normal button {\n width: 40px;\n height: 40px;\n padding: 6px;\n border-radius: 4px;\n }\n\n &.size-small button {\n width: 34px;\n height: 34px;\n padding: 4px;\n border-radius: 2px;\n }\n}\n","import {Component, Prop, h, State, Event, EventEmitter, Host} from '@stencil/core';\n\n/*\n Displays a single button that can be toggled on or off by clicking it.\n \n ```ts\n * <verdocs-toggle-button icon={MessageIcon} size=\"normal\" active={true} />\n * ```\n /\n@Component({\n tag: 'verdocs-toggle-button',\n styleUrl: 'verdocs-toggle-button.scss',\n})\nexport class VerdocsToggleButton {\n @Prop() active = false;\n\n /\n If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n /\n @Prop() icon?: string \| null = null;\n\n /\n If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n /\n @Prop() label?: string \| null = null;\n\n /\n How large the button should be. Small buttons are intended for dialog boxes and other smaller scale UI regions.\n /\n @Prop() size?: 'small' \| 'normal' = 'normal';\n\n /\n Event fired when the button is pressed.\n */\n @Event({composed: true}) toggle!: EventEmitter<{active: boolean}>;\n\n @State() _active = false;\n\n componentWillLoad() {\n this._active = this.active;\n }\n\n handleToggle(e: any) {\n e.stopPropagation();\n\n const newState = !this._active;\n this._active = newState;\n this.toggle?.emit({active: newState});\n }\n\n render() {\n return (\n <Host class={`size-${this.size}`}>\n {this.icon ? (\n <button innerHTML={this.icon} class={{active: this._active}} onClick={e => this.handleToggle(e)} />\n ) : (\n <button class={{active: this._active}} onClick={e => this.handleToggle(e)}>\n {this.label}\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,siCAAsiC;;YCaxjC,mBAAmB,oCAAA,MAAA;MAJhC,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAKU,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;MAEtB;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAmB,IAAI;MAEnC;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAAmB,IAAI;MAEpC;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAwB,QAAQ;MAOnC,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK;MA2BzB;UAzBC,iBAAiB,GAAA;MACf,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM;;MAG5B,IAAA,YAAY,CAAC,CAAM,EAAA;;cACjB,CAAC,CAAC,eAAe,EAAE;MAEnB,QAAA,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,OAAO;MAC9B,QAAA,IAAI,CAAC,OAAO,GAAG,QAAQ;MACvB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAC,CAAC;;UAGvC,MAAM,GAAA;cACJ,QACE,CAAC,CAAA,IAAI,qDAAC,KAAK,EAAE,CAAQ,KAAA,EAAA,IAAI,CAAC,IAAI,CAAA,CAAE,IAC7B,IAAI,CAAC,IAAI,IACR,CAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAC,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAI,CAAA,KAEnG,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAC,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAA,EACtE,IAAI,CAAC,KAAK,CACJ,CACV,CACI;;;;;;;;;;;"}
1	+ {"version":3,"file":"p-C3pXyYu2.system.js","sources":["src/components/controls/verdocs-toggle-button/verdocs-toggle-button.scss?tag=verdocs-toggle-button","src/components/controls/verdocs-toggle-button/verdocs-toggle-button.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle-button {\n font-family: $primary-font;\n\n button {\n border: none;\n outline: none;\n cursor: pointer;\n align-items: center;\n display: inline-flex;\n justify-content: center;\n background: $verdocs-bg-1;\n color: $verdocs-dark-blue;\n\n svg {\n max-width: 100%;\n max-height: 100%;\n fill: $verdocs-dark-blue;\n }\n\n &.active {\n background: $verdocs-green;\n color: $verdocs-grey-3;\n\n svg {\n fill: $verdocs-grey-3;\n }\n }\n\n &:focus {\n border: none;\n outline: none;\n }\n }\n\n &.size-normal button {\n width: 40px;\n height: 40px;\n padding: 6px;\n border-radius: 4px;\n }\n\n &.size-small button {\n width: 34px;\n height: 34px;\n padding: 4px;\n border-radius: 2px;\n }\n}\n","import {Component, Prop, h, State, Event, EventEmitter, Host} from '@stencil/core';\n\n/*\n Displays a single button that can be toggled on or off by clicking it.\n \n ```ts\n * <verdocs-toggle-button icon={MessageIcon} size=\"normal\" active={true} />\n * ```\n /\n@Component({\n tag: 'verdocs-toggle-button',\n styleUrl: 'verdocs-toggle-button.scss',\n})\nexport class VerdocsToggleButton {\n @Prop() active = false;\n\n /\n If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n /\n @Prop() icon?: string \| null = null;\n\n /\n If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n /\n @Prop() label?: string \| null = null;\n\n /\n How large the button should be. Small buttons are intended for dialog boxes and other smaller scale UI regions.\n /\n @Prop() size?: 'small' \| 'normal' = 'normal';\n\n /\n Event fired when the button is pressed.\n */\n @Event({composed: true}) toggle!: EventEmitter<{active: boolean}>;\n\n @State() _active = false;\n\n componentWillLoad() {\n this._active = this.active;\n }\n\n handleToggle(e: any) {\n e.stopPropagation();\n\n const newState = !this._active;\n this._active = newState;\n this.toggle?.emit({active: newState});\n }\n\n render() {\n return (\n <Host class={`size-${this.size}`}>\n {this.icon ? (\n <button innerHTML={this.icon} class={{active: this._active}} onClick={e => this.handleToggle(e)} />\n ) : (\n <button class={{active: this._active}} onClick={e => this.handleToggle(e)}>\n {this.label}\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,siCAAsiC;;YCaxjC,mBAAmB,oCAAA,MAAA;MAJhC,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAKU,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;MAEtB;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAmB,IAAI;MAEnC;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAAmB,IAAI;MAEpC;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAwB,QAAQ;MAOnC,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK;MA2BzB;UAzBC,iBAAiB,GAAA;MACf,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM;;MAG5B,IAAA,YAAY,CAAC,CAAM,EAAA;;cACjB,CAAC,CAAC,eAAe,EAAE;MAEnB,QAAA,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,OAAO;MAC9B,QAAA,IAAI,CAAC,OAAO,GAAG,QAAQ;MACvB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAC,CAAC;;UAGvC,MAAM,GAAA;cACJ,QACE,CAAC,CAAA,IAAI,qDAAC,KAAK,EAAE,CAAQ,KAAA,EAAA,IAAI,CAAC,IAAI,CAAA,CAAE,IAC7B,IAAI,CAAC,IAAI,IACR,CAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAC,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAI,CAAA,KAEnG,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,OAAO,EAAC,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAA,EACtE,IAAI,CAAC,KAAK,CACJ,CACV,CACI;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-BqV2sLyM.system.js.map → p-C4wFtWGl.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-BqV2sLyM.system.js","sources":["src/components/controls/verdocs-pagination/verdocs-pagination.scss?tag=verdocs-pagination","src/components/controls/verdocs-pagination/verdocs-pagination.tsx","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-pagination {\n gap: 8px;\n display: flex;\n flex-direction: row;\n font-family: $primary-font;\n\n .page-button {\n height: 38px;\n display: flex;\n flex: 0 0 38px;\n cursor: pointer;\n font-size: 16px;\n font-weight: 600;\n border-radius: 4px;\n align-items: center;\n justify-content: center;\n color: $verdocs-dark-blue;\n border: 1px solid $verdocs-purple;\n\n svg {\n width: 18px;\n height: 18px;\n }\n\n &.selected {\n cursor: default;\n color: $verdocs-grey-4;\n background: $verdocs-purple;\n }\n }\n\n .ellipsis {\n width: 38px;\n height: 38px;\n display: flex;\n flex: 0 0 38px;\n line-height: 32px;\n justify-content: center;\n color: $verdocs-dark-blue;\n }\n}\n","import {integerSequence} from '@verdocs/js-sdk';\nimport {Host, FunctionalComponent} from '@stencil/core';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst ChevronDoubleLeft = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M18.75 19.5l-7.5-7.5 7.5-7.5m-6 15L5.25 12l7.5-7.5\" /></svg>`;\n\nconst ChevronDoubleRight = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M11.25 4.5l7.5 7.5-7.5 7.5m-6-15l7.5 7.5-7.5 7.5\" /></svg>`;\n\ntype TPageNumber = number \| 'first' \| 'last';\n\nconst VISIBLE_PAGES = 5;\n\nconst PageButton: FunctionalComponent<{page: TPageNumber; selected: number; onClick: (page: TPageNumber) => void}> = ({page, selected, onClick}) => {\n let label;\n if (page === 'first') {\n label = ChevronDoubleLeft;\n } else if (page === 'last') {\n label = ChevronDoubleRight;\n } else {\n label = String(page + 1);\n }\n\n return <div class={`page-button ${page === selected ? 'selected' : ''}`} onClick={() => onClick(page)} innerHTML={label} />;\n};\n\n/*\n Display a simple pagination control with individual buttons to move through the data set.\n \n ```ts\n * <verdocs-pagination\n * selectedPage={1}\n * itemCount={50}\n * perPage={10}\n * onSelectPage={(e) => {setSelectedpage(e.detail.selectedPage)}}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-pagination',\n styleUrl: 'verdocs-pagination.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n /\n The currently selected page.\n /\n @Prop({mutable: true, reflect: true}) selectedPage: number = 0;\n\n /\n The total number of items.\n /\n @Prop() itemCount: number = 1;\n\n /\n The number of displayed per page.\n /\n @Prop() perPage: number = 10;\n\n /\n Event fired when the selected page changes. The new page number is included in the event.\n /\n @Event({composed: true}) selectPage: EventEmitter<{selectedPage: number}>;\n\n handleSelectPage(page: number) {\n this.selectedPage = page;\n this.selectPage?.emit({selectedPage: page});\n }\n\n render() {\n const firstPage = Math.max(0, this.selectedPage - 2);\n const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;\n const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);\n\n return (\n <Host>\n {this.selectedPage > 0 && <PageButton page={'first'} selected={this.selectedPage} onClick={() => this.handleSelectPage(0)} />}\n\n {firstPage > 0 && <div class=\"ellipsis\">...</div>}\n\n {pagesToDisplay.map(pageNumber => (\n <PageButton page={pageNumber} selected={this.selectedPage} onClick={page => this.handleSelectPage(+page)} />\n ))}\n\n {this.selectedPage < numPages - 1 && <div class=\"ellipsis\">...</div>}\n\n {this.selectedPage < numPages - 1 && <PageButton page={'last'} selected={this.selectedPage} onClick={() => this.handleSelectPage(numPages - 1)} />}\n </Host>\n );\n }\n}\n","@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"],"names":["VerdocsQuickFilter"],"mappings":"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"}
1	+ {"version":3,"file":"p-C4wFtWGl.system.js","sources":["src/components/controls/verdocs-pagination/verdocs-pagination.scss?tag=verdocs-pagination","src/components/controls/verdocs-pagination/verdocs-pagination.tsx","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-pagination {\n gap: 8px;\n display: flex;\n flex-direction: row;\n font-family: $primary-font;\n\n .page-button {\n height: 38px;\n display: flex;\n flex: 0 0 38px;\n cursor: pointer;\n font-size: 16px;\n font-weight: 600;\n border-radius: 4px;\n align-items: center;\n justify-content: center;\n color: $verdocs-dark-blue;\n border: 1px solid $verdocs-purple;\n\n svg {\n width: 18px;\n height: 18px;\n }\n\n &.selected {\n cursor: default;\n color: $verdocs-grey-4;\n background: $verdocs-purple;\n }\n }\n\n .ellipsis {\n width: 38px;\n height: 38px;\n display: flex;\n flex: 0 0 38px;\n line-height: 32px;\n justify-content: center;\n color: $verdocs-dark-blue;\n }\n}\n","import {integerSequence} from '@verdocs/js-sdk';\nimport {Host, FunctionalComponent} from '@stencil/core';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst ChevronDoubleLeft = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M18.75 19.5l-7.5-7.5 7.5-7.5m-6 15L5.25 12l7.5-7.5\" /></svg>`;\n\nconst ChevronDoubleRight = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M11.25 4.5l7.5 7.5-7.5 7.5m-6-15l7.5 7.5-7.5 7.5\" /></svg>`;\n\ntype TPageNumber = number \| 'first' \| 'last';\n\nconst VISIBLE_PAGES = 5;\n\nconst PageButton: FunctionalComponent<{page: TPageNumber; selected: number; onClick: (page: TPageNumber) => void}> = ({page, selected, onClick}) => {\n let label;\n if (page === 'first') {\n label = ChevronDoubleLeft;\n } else if (page === 'last') {\n label = ChevronDoubleRight;\n } else {\n label = String(page + 1);\n }\n\n return <div class={`page-button ${page === selected ? 'selected' : ''}`} onClick={() => onClick(page)} innerHTML={label} />;\n};\n\n/*\n Display a simple pagination control with individual buttons to move through the data set.\n \n ```ts\n * <verdocs-pagination\n * selectedPage={1}\n * itemCount={50}\n * perPage={10}\n * onSelectPage={(e) => {setSelectedpage(e.detail.selectedPage)}}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-pagination',\n styleUrl: 'verdocs-pagination.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n /\n The currently selected page.\n /\n @Prop({mutable: true, reflect: true}) selectedPage: number = 0;\n\n /\n The total number of items.\n /\n @Prop() itemCount: number = 1;\n\n /\n The number of displayed per page.\n /\n @Prop() perPage: number = 10;\n\n /\n Event fired when the selected page changes. The new page number is included in the event.\n /\n @Event({composed: true}) selectPage: EventEmitter<{selectedPage: number}>;\n\n handleSelectPage(page: number) {\n this.selectedPage = page;\n this.selectPage?.emit({selectedPage: page});\n }\n\n render() {\n const firstPage = Math.max(0, this.selectedPage - 2);\n const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;\n const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);\n\n return (\n <Host>\n {this.selectedPage > 0 && <PageButton page={'first'} selected={this.selectedPage} onClick={() => this.handleSelectPage(0)} />}\n\n {firstPage > 0 && <div class=\"ellipsis\">...</div>}\n\n {pagesToDisplay.map(pageNumber => (\n <PageButton page={pageNumber} selected={this.selectedPage} onClick={page => this.handleSelectPage(+page)} />\n ))}\n\n {this.selectedPage < numPages - 1 && <div class=\"ellipsis\">...</div>}\n\n {this.selectedPage < numPages - 1 && <PageButton page={'last'} selected={this.selectedPage} onClick={() => this.handleSelectPage(numPages - 1)} />}\n </Host>\n );\n }\n}\n","@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"],"names":["VerdocsQuickFilter"],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-B9makh4c.system.js.map → p-CB78zeGU.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-~~B9makh4c~~.system.js","sources":["src/components/templates/verdocs-template-tags/verdocs-template-tags.scss?tag=verdocs-template-tags","src/components/templates/verdocs-template-tags/verdocs-template-tags.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-tags {\n font-family: $primary-font;\n\n span {\n margin: 0 4px;\n height: 28px;\n font-size: 12px;\n font-weight: 600;\n padding: 5px 12px 7px;\n border-radius: 5px;\n display: inline-block;\n box-sizing: border-box;\n text-transform: uppercase;\n color: $label-color;\n border: 1px solid $border-color;\n background-color: $container-bg;\n }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\n\n/*\n Displays a message listing a template's tags.\n /\n@Component({\n tag: 'verdocs-template-tags',\n styleUrl: 'verdocs-template-tags.scss',\n})\nexport class VerdocsTemplateTags {\n /\n The tags to display\n */\n @Prop() tags: any[];\n\n render() {\n return (\n <Host>\n {this.tags?.map(tag => (\n <span>{tag}</span>\n ))}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,0pBAA0pB;;YCS5qB,mBAAmB,oCAAA,MAAA;;;;UAM9B,MAAM,GAAA;;cACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,MAAA,IAAI,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,GAAG,CAAC,GAAG,KACjB,CAAO,CAAA,MAAA,EAAA,IAAA,EAAA,GAAG,CAAQ,CACnB,CAAC,CACG;;;;;;;;;;;"}
1	+ {"version":3,"file":"p-CB78zeGU.system.js","sources":["src/components/templates/verdocs-template-tags/verdocs-template-tags.scss?tag=verdocs-template-tags","src/components/templates/verdocs-template-tags/verdocs-template-tags.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-tags {\n font-family: $primary-font;\n\n span {\n margin: 0 4px;\n height: 28px;\n font-size: 12px;\n font-weight: 600;\n padding: 5px 12px 7px;\n border-radius: 5px;\n display: inline-block;\n box-sizing: border-box;\n text-transform: uppercase;\n color: $label-color;\n border: 1px solid $border-color;\n background-color: $container-bg;\n }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\n\n/*\n Displays a message listing a template's tags.\n /\n@Component({\n tag: 'verdocs-template-tags',\n styleUrl: 'verdocs-template-tags.scss',\n})\nexport class VerdocsTemplateTags {\n /\n The tags to display\n */\n @Prop() tags: any[];\n\n render() {\n return (\n <Host>\n {this.tags?.map(tag => (\n <span>{tag}</span>\n ))}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,sBAAsB,GAAG,0pBAA0pB;;YCS5qB,mBAAmB,oCAAA,MAAA;;;;UAM9B,MAAM,GAAA;;cACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,MAAA,IAAI,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,GAAG,CAAC,GAAG,KACjB,CAAO,CAAA,MAAA,EAAA,IAAA,EAAA,GAAG,CAAQ,CACnB,CAAC,CACG;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-BEa6VFpF.system.js.map → p-CD2Fdeq7.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-BEa6VFpF.system.js","sources":["src/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.scss?tag=verdocs-envelope-document-page","src/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-envelope-document-page {\n width: 100%;\n position: relative;\n\n .verdocs-envelope-document-page-layer {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n box-shadow: 0 0 10px 5px #0000000f;\n\n &.img {\n width: 100%;\n }\n }\n}\n","// NOTE: This component does not have a story because it's not intended for external use.\n\nimport {getEnvelopeDocumentPageDisplayUri, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Element} from '@stencil/core';\nimport {IDocumentPageInfo, IPageLayer} from '../../../utils/Types';\nimport {throttle} from '../../../utils/utils';\n\n/*\n Represents one document page. This is primarily a layout container used to coordinate positions of\n * page-related layers such as the page itself, signature fields, etc. It is not intended to be used\n * on its own as an individual component.\n /\n@Component({\n tag: 'verdocs-envelope-document-page',\n styleUrl: 'verdocs-envelope-document-page.scss',\n shadow: false,\n})\nexport class VerdocsEnvelopeDocumentPage {\n @Element() container: HTMLElement;\n private resizeObserver: ResizeObserver;\n\n /\n The endpoint to load from.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The ID of the envelope the document is for.\n /\n @Prop() envelopeId: string = '';\n\n /\n The ID of the document to display.\n /\n @Prop() documentId: string = '';\n\n /\n The page number being rendered. (Reminder: page numbers are 1-based.)\n /\n @Prop() pageNumber: number = 1;\n\n /\n The \"virtual\" width of the page canvas. Defaults to 612 which at 72dpi is 8.5\" wide. This is used to compute\n * the aspect ratio of the final rendered element when scaling up/down.\n /\n @Prop() virtualWidth: number = 612;\n\n /\n The \"virtual\" height of the page canvas. Defaults to 792 which at 72dpi is 11\" tall. This is used to compute\n * the aspect ratio of the final rendered element when scaling up/down.\n /\n @Prop({mutable: true}) virtualHeight: number = 792;\n\n /\n The layers that will be rendered. The DOM structure will be a DIV container with one child DIV for each layer.\n * The parent DIV will have a unique ID, and each child DIV will have that ID with the layer name appended, e.g.\n * if `pages` was ['page', 'fields'] the structure will be:\n \n ```\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9\">\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9-page\"></div>\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9-fields\"></div>\n * </div>\n * ```\n /\n @Prop() layers: IPageLayer[] = [{name: 'page', type: 'canvas'}];\n\n @Prop() type: 'original' \| 'filled' \| 'certificate' = 'original';\n\n /\n Fired when a page has been rendered. This is also fired when the page is resized.\n /\n @Event() pageRendered: EventEmitter<IDocumentPageInfo>;\n\n @State() containerId = `verdocs-envelope-document-page-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() renderedWidth: number = this.virtualWidth;\n @State() renderedHeight: number = this.virtualHeight;\n @State() naturalWidth: number = this.virtualWidth;\n @State() naturalHeight: number = this.virtualHeight;\n @State() aspectRatio: number = this.virtualWidth / this.virtualHeight;\n\n @State() skipFirstNotification = true;\n\n @State() pageDisplayUri = 'https://verdocs-public-assets.s3.amazonaws.com/page-loading-placeholder.png';\n\n async componentWillLoad() {\n this.pageDisplayUri = await getEnvelopeDocumentPageDisplayUri(this.endpoint, this.documentId, this.pageNumber, this.type);\n }\n\n componentDidLoad() {\n this.resizeObserver = new ResizeObserver(\n throttle(entries => {\n for (const entry of entries) {\n const renderedWidth = entry.contentRect.width;\n this.renderedWidth = renderedWidth;\n this.renderedHeight = this.virtualHeight (renderedWidth / this.virtualWidth);\n }\n\n this.notifyRenderedSize();\n }, 100),\n );\n\n this.resizeObserver.observe(this.container);\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n }\n\n // Left here for documentation purposes in case we find an edge case where this isn't true. But we apparently don't need this.\n // When we add the resize observer it will always be triggered at least once so notifying here as well is just a dupe.\n // componentDidRender() {\n // this.notifyRenderedSize();\n // }\n\n notifyRenderedSize() {\n // We skip one notification because by default we will always get at least two, one when rendering the initial size\n // and a second once we're able to compute the scale size, when the resizeObserver sets renderedWidth/renderedHeight.\n if (this.skipFirstNotification) {\n this.skipFirstNotification = false;\n return;\n }\n\n this.pageRendered.emit({\n // container: this.container,\n containerId: this.containerId,\n documentId: this.documentId,\n pageNumber: this.pageNumber,\n virtualWidth: this.virtualWidth,\n virtualHeight: this.virtualHeight,\n renderedWidth: this.renderedWidth,\n renderedHeight: this.renderedHeight,\n naturalWidth: this.naturalWidth,\n naturalHeight: this.naturalHeight,\n aspectRatio: this.aspectRatio,\n xScale: this.renderedWidth / this.virtualWidth,\n yScale: this.renderedHeight / this.virtualHeight,\n });\n }\n\n render() {\n const height = `${this.renderedHeight}px`;\n\n return (\n <Host id={`${this.containerId}`} style={{height, flex: `0 0 ${height}`}}>\n {this.layers.map(layer =>\n layer.type === 'div' ? (\n <div class=\"verdocs-envelope-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}} />\n ) : this.pageDisplayUri ? (\n <img\n class=\"verdocs-envelope-document-page-layer img\"\n id={`${this.containerId}-${layer.name}`}\n src={this.pageDisplayUri}\n alt={`Page ${this.pageNumber}`}\n aria-hidden={true}\n loading=\"lazy\"\n onLoad={(e: any) => {\n // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that\n // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).\n // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values\n // for a field are based on the responsive Web view the Template editor was seeing. The IMG was scaled down there in the\n // exact same way, so we just honor it. We capture the natural width and height here more as information. Then we use the\n // aspect ratio to adjust the \"virtual\" height in case the page is not 8.5\"x11\".\n // TODO: Store this in the DB with each page.\n this.naturalWidth = e.target.naturalWidth;\n this.naturalHeight = e.target.naturalHeight;\n this.aspectRatio = this.naturalWidth / this.naturalHeight;\n this.virtualHeight = this.virtualWidth / this.aspectRatio;\n this.renderedHeight = e.target.offsetWidth / this.aspectRatio;\n }}\n />\n ) : (\n <div></div>\n ),\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"p-CD2Fdeq7.system.js","sources":["src/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.scss?tag=verdocs-envelope-document-page","src/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-envelope-document-page {\n width: 100%;\n position: relative;\n\n .verdocs-envelope-document-page-layer {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n box-shadow: 0 0 10px 5px #0000000f;\n\n &.img {\n width: 100%;\n }\n }\n}\n","// NOTE: This component does not have a story because it's not intended for external use.\n\nimport {getEnvelopeDocumentPageDisplayUri, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Element} from '@stencil/core';\nimport {IDocumentPageInfo, IPageLayer} from '../../../utils/Types';\nimport {throttle} from '../../../utils/utils';\n\n/*\n Represents one document page. This is primarily a layout container used to coordinate positions of\n * page-related layers such as the page itself, signature fields, etc. It is not intended to be used\n * on its own as an individual component.\n /\n@Component({\n tag: 'verdocs-envelope-document-page',\n styleUrl: 'verdocs-envelope-document-page.scss',\n shadow: false,\n})\nexport class VerdocsEnvelopeDocumentPage {\n @Element() container: HTMLElement;\n private resizeObserver: ResizeObserver;\n\n /\n The endpoint to load from.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n The ID of the envelope the document is for.\n /\n @Prop() envelopeId: string = '';\n\n /\n The ID of the document to display.\n /\n @Prop() documentId: string = '';\n\n /\n The page number being rendered. (Reminder: page numbers are 1-based.)\n /\n @Prop() pageNumber: number = 1;\n\n /\n The \"virtual\" width of the page canvas. Defaults to 612 which at 72dpi is 8.5\" wide. This is used to compute\n * the aspect ratio of the final rendered element when scaling up/down.\n /\n @Prop() virtualWidth: number = 612;\n\n /\n The \"virtual\" height of the page canvas. Defaults to 792 which at 72dpi is 11\" tall. This is used to compute\n * the aspect ratio of the final rendered element when scaling up/down.\n /\n @Prop({mutable: true}) virtualHeight: number = 792;\n\n /\n The layers that will be rendered. The DOM structure will be a DIV container with one child DIV for each layer.\n * The parent DIV will have a unique ID, and each child DIV will have that ID with the layer name appended, e.g.\n * if `pages` was ['page', 'fields'] the structure will be:\n \n ```\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9\">\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9-page\"></div>\n * <div id=\"verdocs-envelope-document-page-ker2fr1p9-fields\"></div>\n * </div>\n * ```\n /\n @Prop() layers: IPageLayer[] = [{name: 'page', type: 'canvas'}];\n\n @Prop() type: 'original' \| 'filled' \| 'certificate' = 'original';\n\n /\n Fired when a page has been rendered. This is also fired when the page is resized.\n /\n @Event() pageRendered: EventEmitter<IDocumentPageInfo>;\n\n @State() containerId = `verdocs-envelope-document-page-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() renderedWidth: number = this.virtualWidth;\n @State() renderedHeight: number = this.virtualHeight;\n @State() naturalWidth: number = this.virtualWidth;\n @State() naturalHeight: number = this.virtualHeight;\n @State() aspectRatio: number = this.virtualWidth / this.virtualHeight;\n\n @State() skipFirstNotification = true;\n\n @State() pageDisplayUri = 'https://verdocs-public-assets.s3.amazonaws.com/page-loading-placeholder.png';\n\n async componentWillLoad() {\n this.pageDisplayUri = await getEnvelopeDocumentPageDisplayUri(this.endpoint, this.documentId, this.pageNumber, this.type);\n }\n\n componentDidLoad() {\n this.resizeObserver = new ResizeObserver(\n throttle(entries => {\n for (const entry of entries) {\n const renderedWidth = entry.contentRect.width;\n this.renderedWidth = renderedWidth;\n this.renderedHeight = this.virtualHeight (renderedWidth / this.virtualWidth);\n }\n\n this.notifyRenderedSize();\n }, 100),\n );\n\n this.resizeObserver.observe(this.container);\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n }\n\n // Left here for documentation purposes in case we find an edge case where this isn't true. But we apparently don't need this.\n // When we add the resize observer it will always be triggered at least once so notifying here as well is just a dupe.\n // componentDidRender() {\n // this.notifyRenderedSize();\n // }\n\n notifyRenderedSize() {\n // We skip one notification because by default we will always get at least two, one when rendering the initial size\n // and a second once we're able to compute the scale size, when the resizeObserver sets renderedWidth/renderedHeight.\n if (this.skipFirstNotification) {\n this.skipFirstNotification = false;\n return;\n }\n\n this.pageRendered.emit({\n // container: this.container,\n containerId: this.containerId,\n documentId: this.documentId,\n pageNumber: this.pageNumber,\n virtualWidth: this.virtualWidth,\n virtualHeight: this.virtualHeight,\n renderedWidth: this.renderedWidth,\n renderedHeight: this.renderedHeight,\n naturalWidth: this.naturalWidth,\n naturalHeight: this.naturalHeight,\n aspectRatio: this.aspectRatio,\n xScale: this.renderedWidth / this.virtualWidth,\n yScale: this.renderedHeight / this.virtualHeight,\n });\n }\n\n render() {\n const height = `${this.renderedHeight}px`;\n\n return (\n <Host id={`${this.containerId}`} style={{height, flex: `0 0 ${height}`}}>\n {this.layers.map(layer =>\n layer.type === 'div' ? (\n <div class=\"verdocs-envelope-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}} />\n ) : this.pageDisplayUri ? (\n <img\n class=\"verdocs-envelope-document-page-layer img\"\n id={`${this.containerId}-${layer.name}`}\n src={this.pageDisplayUri}\n alt={`Page ${this.pageNumber}`}\n aria-hidden={true}\n loading=\"lazy\"\n onLoad={(e: any) => {\n // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that\n // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).\n // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values\n // for a field are based on the responsive Web view the Template editor was seeing. The IMG was scaled down there in the\n // exact same way, so we just honor it. We capture the natural width and height here more as information. Then we use the\n // aspect ratio to adjust the \"virtual\" height in case the page is not 8.5\"x11\".\n // TODO: Store this in the DB with each page.\n this.naturalWidth = e.target.naturalWidth;\n this.naturalHeight = e.target.naturalHeight;\n this.aspectRatio = this.naturalWidth / this.naturalHeight;\n this.virtualHeight = this.virtualWidth / this.aspectRatio;\n this.renderedHeight = e.target.offsetWidth / this.aspectRatio;\n }}\n />\n ) : (\n <div></div>\n ),\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;MAAA,MAAM,8BAA8B,GAAG,+qBAA+qB;;YCiBzsB,2BAA2B,6CAAA,MAAA;MALxC,IAAA,WAAA,CAAA,OAAA,EAAA;;;MASE;;MAEG;MACK,QAAA,IAAA,CAAA,QAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE;MAEhE;;MAEG;MACK,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;MAE/B;;MAEG;MACK,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;MAE/B;;MAEG;MACK,QAAA,IAAU,CAAA,UAAA,GAAW,CAAC;MAE9B;;;MAGG;MACK,QAAA,IAAY,CAAA,YAAA,GAAW,GAAG;MAElC;;;MAGG;MACoB,QAAA,IAAa,CAAA,aAAA,GAAW,GAAG;MAElD;;;;;;;;;;;MAWG;MACK,QAAA,IAAA,CAAA,MAAM,GAAiB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAC,CAAC;MAEvD,QAAA,IAAI,CAAA,IAAA,GAA0C,UAAU;cAOvD,IAAA,CAAA,WAAW,GAAG,CAAA,+BAAA,EAAkC,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA,CAAE;MAE7F,QAAA,IAAA,CAAA,aAAa,GAAW,IAAI,CAAC,YAAY;MACzC,QAAA,IAAA,CAAA,cAAc,GAAW,IAAI,CAAC,aAAa;MAC3C,QAAA,IAAA,CAAA,YAAY,GAAW,IAAI,CAAC,YAAY;MACxC,QAAA,IAAA,CAAA,aAAa,GAAW,IAAI,CAAC,aAAa;cAC1C,IAAW,CAAA,WAAA,GAAW,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,aAAa;MAE5D,QAAA,IAAqB,CAAA,qBAAA,GAAG,IAAI;MAE5B,QAAA,IAAc,CAAA,cAAA,GAAG,6EAA6E;MA+FxG;MA7FC,IAAA,MAAM,iBAAiB,GAAA;cACrB,IAAI,CAAC,cAAc,GAAG,MAAM,iCAAiC,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC;;UAG3H,gBAAgB,GAAA;cACd,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CACtC,QAAQ,CAAC,OAAO,IAAG;MACjB,YAAA,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;MAC3B,gBAAA,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK;MAC7C,gBAAA,IAAI,CAAC,aAAa,GAAG,aAAa;MAClC,gBAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,IAAI,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC;;kBAGhF,IAAI,CAAC,kBAAkB,EAAE;MAC3B,SAAC,EAAE,GAAG,CAAC,CACR;cAED,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;;UAG7C,oBAAoB,GAAA;;cAClB,CAAA,EAAA,GAAA,IAAI,CAAC,cAAc,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE;;;;;;;UASnC,kBAAkB,GAAA;;;MAGhB,QAAA,IAAI,IAAI,CAAC,qBAAqB,EAAE;MAC9B,YAAA,IAAI,CAAC,qBAAqB,GAAG,KAAK;kBAClC;;MAGF,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;;kBAErB,WAAW,EAAE,IAAI,CAAC,WAAW;kBAC7B,UAAU,EAAE,IAAI,CAAC,UAAU;kBAC3B,UAAU,EAAE,IAAI,CAAC,UAAU;kBAC3B,YAAY,EAAE,IAAI,CAAC,YAAY;kBAC/B,aAAa,EAAE,IAAI,CAAC,aAAa;kBACjC,aAAa,EAAE,IAAI,CAAC,aAAa;kBACjC,cAAc,EAAE,IAAI,CAAC,cAAc;kBACnC,YAAY,EAAE,IAAI,CAAC,YAAY;kBAC/B,aAAa,EAAE,IAAI,CAAC,aAAa;kBACjC,WAAW,EAAE,IAAI,CAAC,WAAW;MAC7B,YAAA,MAAM,EAAE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY;MAC9C,YAAA,MAAM,EAAE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa;MACjD,SAAA,CAAC;;UAGJ,MAAM,GAAA;MACJ,QAAA,MAAM,MAAM,GAAG,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI;MAEzC,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAE,GAAG,IAAI,CAAC,WAAW,CAAA,CAAE,EAAE,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,EAAE,CAAA,IAAA,EAAO,MAAM,CAAA,CAAE,EAAC,EAAA,EACpE,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,IACpB,KAAK,CAAC,IAAI,KAAK,KAAK,IAClB,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,sCAAsC,EAAC,EAAE,EAAE,CAAG,EAAA,IAAI,CAAC,WAAW,IAAI,KAAK,CAAC,IAAI,CAAA,CAAE,EAAE,KAAK,EAAE,EAAC,MAAM,EAAC,EAAA,CAAI,IAC5G,IAAI,CAAC,cAAc,IACrB,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,0CAA0C,EAChD,EAAE,EAAE,GAAG,IAAI,CAAC,WAAW,CAAA,CAAA,EAAI,KAAK,CAAC,IAAI,CAAA,CAAE,EACvC,GAAG,EAAE,IAAI,CAAC,cAAc,EACxB,GAAG,EAAE,QAAQ,IAAI,CAAC,UAAU,CAAA,CAAE,EACjB,aAAA,EAAA,IAAI,EACjB,OAAO,EAAC,MAAM,EACd,MAAM,EAAE,CAAC,CAAM,KAAI;;;;;;;;sBAQjB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,YAAY;sBACzC,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC,aAAa;sBAC3C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,aAAa;sBACzD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW;MACzD,gBAAA,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW;MAC/D,aAAC,EAAA,CACD,KAEF,CAAA,CAAA,KAAA,EAAA,IAAA,CAAW,CACZ,CACF,CACI;;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-fih-g25U.system.js.map → p-CHZu9FwY.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-~~fih-g25U~~.system.js","sources":["src/components/controls/verdocs-radio-button/verdocs-radio-button.scss?tag=verdocs-radio-button","src/components/controls/verdocs-radio-button/verdocs-radio-button.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\n// See https://www.sliderrevolution.com/resources/styling-radio-buttons/\nverdocs-radio-button {\n font-family: $verdocs-primary-font;\n width: 20px;\n height: 20px;\n display: block;\n font-size: 11px;\n position: relative;\n background-color: transparent;\n transform-origin: bottom left;\n border-radius: 100%;\n\n &.disabled {\n opacity: 0.5;\n }\n\n input[type='radio'] {\n position: absolute;\n opacity: 0;\n\n + label {\n &:before {\n content: '';\n background: $verdocs-grey-3;\n border-radius: 100%;\n border: 1px solid rgba(0, 0, 0, 0.6);\n display: inline-block;\n width: 16px;\n height: 16px;\n position: absolute;\n left: 1px;\n top: 1px;\n cursor: pointer;\n text-align: center;\n transition: all 250ms ease;\n }\n }\n\n &:checked {\n + label {\n &:before {\n background-color: $verdocs-green;\n box-shadow: inset 0 0 0 2px $verdocs-grey-3;\n }\n }\n }\n\n &:focus {\n + label {\n &:before {\n outline: none;\n border-color: $verdocs-green;\n }\n }\n }\n\n &:disabled {\n + label {\n &:before {\n box-shadow: inset 0 0 0 4px $verdocs-grey-3;\n border-color: #f3f3fc;\n background: #f3f3fc;\n }\n }\n }\n\n + label {\n &:empty {\n &:before {\n margin-right: 0;\n }\n }\n }\n }\n\n &.required {\n input[type='radio'] {\n + label {\n &:before {\n border: 1px solid $verdocs-red-1;\n }\n }\n }\n }\n\n &.hide {\n display: none;\n }\n\n &.focused {\n animation: verdocs-field-pulse 0.75s 2;\n }\n}\n","import {Component, h, Host, Prop} from '@stencil/core';\n\n/*\n Displays a radio button. Note that this is different from the `verdocs-field-radio-button` component, which is\n * designed to be used in signing experiences and contains settings that connect to template fields. This is just a\n * simple radio button for UI displays e.g. dialog boxes.\n \n This control encapsulates a standard HTML radio button. To subscribe to change events, connect an `onChange`\n * handler. Sample usage:\n \n ```ts\n * <verdocs-radio-button\n * value=\"val1\"\n * name=\"someProperty\"\n * checked={this.someProperty === 'val1'}\n * onInput={(e: any) => { this.someProperty = 'val1' }}\n * disabled={false}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-radio-button',\n styleUrl: 'verdocs-radio-button.scss',\n shadow: false,\n})\nexport class VerdocsRadioButton {\n /\n Whether the radio button is currently selected.\n /\n @Prop() checked: boolean = false;\n\n /\n HTML form field name for the input.\n /\n @Prop() name: string = '';\n\n /\n Value to track with the input.\n /\n @Prop() value: string = '';\n\n /\n If set, the button will still be displayed but not selectable.\n */\n @Prop() disabled?: boolean = false;\n\n render() {\n return (\n <Host class={{disabled: this.disabled}}>\n <input\n type=\"radio\"\n value={this.value}\n name={this.name}\n id={`verdocs-radio-button-${this.name}-${this.value}`}\n checked={this.checked}\n disabled={this.disabled}\n // onChange={e => this.handleChange(e)}\n />\n <label htmlFor={`verdocs-radio-button-${this.name}-${this.value}`} />\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,qBAAqB,GAAG,mvDAAmvD;;YCyBpwD,kBAAkB,mCAAA,MAAA;MAL/B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAME;;MAEG;MACK,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;MAEhC;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAW,EAAE;MAEzB;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;MAE1B;;MAEG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;MAkBnC;UAhBC,MAAM,GAAA;cACJ,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAC,EAAA,EACpC,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,wBAAwB,IAAI,CAAC,IAAI,CAAI,CAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAE,EACrD,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAEvB,CAAA,EACF,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,CAAwB,qBAAA,EAAA,IAAI,CAAC,IAAI,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,EAAE,EAAI,CAAA,CAChE;;;;;;;;;;;"}
1	+ {"version":3,"file":"p-CHZu9FwY.system.js","sources":["src/components/controls/verdocs-radio-button/verdocs-radio-button.scss?tag=verdocs-radio-button","src/components/controls/verdocs-radio-button/verdocs-radio-button.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\n// See https://www.sliderrevolution.com/resources/styling-radio-buttons/\nverdocs-radio-button {\n font-family: $verdocs-primary-font;\n width: 20px;\n height: 20px;\n display: block;\n font-size: 11px;\n position: relative;\n background-color: transparent;\n transform-origin: bottom left;\n border-radius: 100%;\n\n &.disabled {\n opacity: 0.5;\n }\n\n input[type='radio'] {\n position: absolute;\n opacity: 0;\n\n + label {\n &:before {\n content: '';\n background: $verdocs-grey-3;\n border-radius: 100%;\n border: 1px solid rgba(0, 0, 0, 0.6);\n display: inline-block;\n width: 16px;\n height: 16px;\n position: absolute;\n left: 1px;\n top: 1px;\n cursor: pointer;\n text-align: center;\n transition: all 250ms ease;\n }\n }\n\n &:checked {\n + label {\n &:before {\n background-color: $verdocs-green;\n box-shadow: inset 0 0 0 2px $verdocs-grey-3;\n }\n }\n }\n\n &:focus {\n + label {\n &:before {\n outline: none;\n border-color: $verdocs-green;\n }\n }\n }\n\n &:disabled {\n + label {\n &:before {\n box-shadow: inset 0 0 0 4px $verdocs-grey-3;\n border-color: #f3f3fc;\n background: #f3f3fc;\n }\n }\n }\n\n + label {\n &:empty {\n &:before {\n margin-right: 0;\n }\n }\n }\n }\n\n &.required {\n input[type='radio'] {\n + label {\n &:before {\n border: 1px solid $verdocs-red-1;\n }\n }\n }\n }\n\n &.hide {\n display: none;\n }\n\n &.focused {\n animation: verdocs-field-pulse 0.75s 2;\n }\n}\n","import {Component, h, Host, Prop} from '@stencil/core';\n\n/*\n Displays a radio button. Note that this is different from the `verdocs-field-radio-button` component, which is\n * designed to be used in signing experiences and contains settings that connect to template fields. This is just a\n * simple radio button for UI displays e.g. dialog boxes.\n \n This control encapsulates a standard HTML radio button. To subscribe to change events, connect an `onChange`\n * handler. Sample usage:\n \n ```ts\n * <verdocs-radio-button\n * value=\"val1\"\n * name=\"someProperty\"\n * checked={this.someProperty === 'val1'}\n * onInput={(e: any) => { this.someProperty = 'val1' }}\n * disabled={false}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-radio-button',\n styleUrl: 'verdocs-radio-button.scss',\n shadow: false,\n})\nexport class VerdocsRadioButton {\n /\n Whether the radio button is currently selected.\n /\n @Prop() checked: boolean = false;\n\n /\n HTML form field name for the input.\n /\n @Prop() name: string = '';\n\n /\n Value to track with the input.\n /\n @Prop() value: string = '';\n\n /\n If set, the button will still be displayed but not selectable.\n */\n @Prop() disabled?: boolean = false;\n\n render() {\n return (\n <Host class={{disabled: this.disabled}}>\n <input\n type=\"radio\"\n value={this.value}\n name={this.name}\n id={`verdocs-radio-button-${this.name}-${this.value}`}\n checked={this.checked}\n disabled={this.disabled}\n // onChange={e => this.handleChange(e)}\n />\n <label htmlFor={`verdocs-radio-button-${this.name}-${this.value}`} />\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,qBAAqB,GAAG,mvDAAmvD;;YCyBpwD,kBAAkB,mCAAA,MAAA;MAL/B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAME;;MAEG;MACK,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;MAEhC;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAW,EAAE;MAEzB;;MAEG;MACK,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;MAE1B;;MAEG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;MAkBnC;UAhBC,MAAM,GAAA;cACJ,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAC,EAAA,EACpC,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,wBAAwB,IAAI,CAAC,IAAI,CAAI,CAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAE,EACrD,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAEvB,CAAA,EACF,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,CAAwB,qBAAA,EAAA,IAAI,CAAC,IAAI,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,EAAE,EAAI,CAAA,CAChE;;;;;;;;;;;"}

package/dist/verdocs-web-sdk/{p-DAWcoDTu.system.js.map → p-CflLDny-.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-DAWcoDTu.system.js","sources":["src/components/controls/verdocs-button/verdocs-button.scss?tag=verdocs-button","src/components/controls/verdocs-button/verdocs-button.tsx","src/components/controls/verdocs-help-icon/verdocs-help-icon.scss?tag=verdocs-help-icon","src/components/controls/verdocs-help-icon/verdocs-help-icon.tsx","src/components/controls/verdocs-text-input/verdocs-text-input.scss?tag=verdocs-text-input","src/components/controls/verdocs-text-input/verdocs-text-input.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-button {\n button {\n font-family: $verdocs-primary-font;\n text-transform: uppercase;\n justify-content: center;\n display: inline-flex;\n align-items: center;\n font-weight: 700;\n cursor: pointer;\n margin: 0;\n\n &:disabled {\n cursor: inherit;\n pointer-events: none;\n }\n\n .icon {\n margin: 0 12px;\n\n svg {\n fill: $verdocs-grey-4;\n display: block;\n }\n }\n\n .button-label {\n padding: 0 12px;\n }\n\n // Small-sized button size adjustments\n &.xsmall {\n height: 26px;\n font-size: 12px;\n\n .icon {\n margin: 0 3px;\n\n svg {\n margin: 2px 0 0 0;\n height: 18px;\n }\n }\n\n .button-label {\n padding: 0 4px;\n }\n }\n\n // Small-sized button size adjustments\n &.small {\n height: 34px;\n font-size: 13px;\n\n .icon {\n margin: 0 4px;\n\n svg {\n margin: 2px 0 0 0;\n height: 20px;\n }\n }\n\n .button-label {\n padding: 0 4px;\n }\n }\n\n // Normal-sized button size adjustments\n &.normal {\n height: 44px;\n font-size: 14px;\n\n .icon.start {\n margin: 0 4px 0 8px;\n }\n\n .icon.end {\n margin: 0 8px 0 4px;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 22px;\n }\n }\n\n .button-label {\n padding: 0 10px;\n }\n }\n\n // Medium-sized button size adjustments\n &.medium {\n height: 52px;\n font-size: 16px;\n\n .icon.start {\n margin: 0 0 0 18px;\n }\n\n .icon.end {\n margin: 0 18px 0 0;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 26px;\n }\n }\n\n .button-label {\n padding: 0 20px;\n }\n }\n\n // Large-sized button size adjustments\n &.large {\n height: 60px;\n font-size: 20px;\n\n .icon.start {\n margin: 0 0 0 24px;\n }\n\n .icon.end {\n margin: 0 24px 0 0;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 32px;\n }\n }\n\n .button-label {\n padding: 0 34px;\n }\n }\n\n // Standard variant is a solid color\n &.standard {\n background: $verdocs-green;\n border-radius: 4px;\n outline: none;\n border: none;\n color: white;\n\n &:disabled {\n background-color: $disabled-color;\n cursor: default;\n }\n\n &:active:not([disabled]) {\n filter: brightness(110%);\n }\n }\n\n // Text variant is just a label\n &.text {\n color: $secondary-color;\n background: transparent;\n font-weight: 500;\n padding: 0 4px;\n outline: none;\n border: none;\n\n &:disabled {\n color: $disabled-color;\n }\n\n &:active:not([disabled]) {\n filter: brightness(130%);\n }\n\n .icon {\n svg {\n fill: $secondary-color;\n }\n }\n }\n\n // Standard variant is a solid color\n &.outline {\n border: 1px solid $secondary-color;\n color: $secondary-color;\n outline: none;\n background: transparent;\n border-radius: 4px;\n padding: 0 20px;\n\n &:disabled {\n color: $disabled-color;\n border: 1px solid $disabled-color;\n }\n\n &:active {\n background: $secondary-color;\n color: white;\n }\n\n .icon {\n svg {\n fill: $secondary-color;\n }\n }\n }\n }\n}\n","import {Component, Prop, h} from '@stencil/core';\n\n/*\n A simple button, with consistent styling to other controls in the design system.\n \n ```ts\n * <verdocs-button label=\"Click Me\" size=\"normal\" variant=\"standard\" />\n * ```\n /\n@Component({\n tag: 'verdocs-button',\n styleUrl: 'verdocs-button.scss',\n})\nexport class VerdocsButton {\n /\n The label for the button.\n /\n @Prop() label!: string;\n\n /\n If desired, a prefix icon for the button.\n /\n @Prop() startIcon: string \| null = null;\n\n /\n If desired, a suffix icon for the button.\n /\n @Prop() endIcon: string \| null = null;\n\n /\n The size (height) of the button.\n /\n @Prop() size: 'xsmall' \| 'small' \| 'normal' \| 'medium' \| 'large' = 'normal';\n\n /\n The type of the button.\n /\n @Prop() type: 'button' \| 'submit' \| 'reset' = 'button';\n\n /\n The display variant of the button.\n /\n @Prop() variant: 'standard' \| 'text' \| 'outline' = 'standard';\n\n /\n Whether the button should be disabled.\n /\n @Prop() disabled: boolean = false;\n\n render() {\n return (\n <button disabled={this.disabled} type={this.type} class={`${this.variant} ${this.size} ${this.type}`}>\n {this.startIcon ? <span class=\"icon start\" innerHTML={this.startIcon} /> : null}\n <span class=\"button-label\">{this.label}</span>\n {this.endIcon ? <span class=\"icon end\" innerHTML={this.endIcon} /> : null}\n </button>\n );\n }\n}\n","@import '../../../theme.scss';\n\nverdocs-help-icon {\n font-family: $verdocs-primary-font;\n display: inline-block;\n opacity: 0.3;\n position: relative;\n\n &:hover {\n opacity: 1;\n }\n\n .icon {\n display: inline-block;\n }\n\n .tooltip {\n display: none;\n min-width: 200px;\n box-shadow: 0 0 10px 1px #999999;\n background: #ffffff;\n color: $label-color;\n max-width: 240px;\n font-weight: 500;\n position: absolute;\n padding: 5px 10px;\n font-size: 12px;\n border-radius: 4px;\n z-index: 10005;\n\n .arrow,\n .arrow::before {\n position: absolute;\n width: 8px;\n height: 8px;\n background: inherit;\n }\n\n .arrow {\n visibility: hidden;\n top: -4px;\n }\n\n .arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n }\n\n &[data-show] {\n display: block;\n }\n\n &[data-popper-placement^='top'] > .arrow {\n bottom: -4px;\n }\n\n &[data-popper-placement^='bottom'] > .arrow {\n top: -4px;\n }\n\n &[data-popper-placement^='left'] > .arrow {\n right: -4px;\n }\n\n &[data-popper-placement^='right'] > .arrow {\n left: -4px;\n }\n }\n}\n","import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Prop, State} from '@stencil/core';\n\nconst helpIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" fill=\"#5c6575\"><path d=\"M11.925 18q.55 0 .938-.387.387-.388.387-.938 0-.55-.387-.925-.388-.375-.938-.375-.55 0-.925.375t-.375.925q0 .55.375.938.375.387.925.387Zm-.95-3.85h1.95q0-.8.2-1.287.2-.488 1.025-1.288.65-.625 1.025-1.213.375-.587.375-1.437 0-1.425-1.025-2.175Q13.5 6 12.1 6q-1.425 0-2.35.775t-1.275 1.85l1.775.7q.125-.45.55-.975.425-.525 1.275-.525.725 0 1.1.412.375.413.375.888 0 .475-.287.9-.288.425-.713.775-1.075.95-1.325 1.475-.25.525-.25 1.875ZM12 22.2q-2.125 0-3.988-.8-1.862-.8-3.237-2.175Q3.4 17.85 2.6 15.988 1.8 14.125 1.8 12t.8-3.988q.8-1.862 2.175-3.237Q6.15 3.4 8.012 2.6 9.875 1.8 12 1.8t3.988.8q1.862.8 3.237 2.175Q20.6 6.15 21.4 8.012q.8 1.863.8 3.988t-.8 3.988q-.8 1.862-2.175 3.237Q17.85 20.6 15.988 21.4q-1.863.8-3.988.8Zm0-2.275q3.325 0 5.625-2.3t2.3-5.625q0-3.325-2.3-5.625T12 4.075q-3.325 0-5.625 2.3T4.075 12q0 3.325 2.3 5.625t5.625 2.3ZM12 12Z\"/></svg>';\n\n/\n Displays a simple help icon. Upon hover or focus, a tooltip will be displayed with help text.\n \n ```ts\n * <verdocs-help-icon text=\"Sample help text\" />\n * ```\n /\n@Component({\n tag: 'verdocs-help-icon',\n styleUrl: 'verdocs-help-icon.scss',\n shadow: false,\n})\nexport class VerdocsHelpIcon {\n iconEl: HTMLDivElement;\n tooltipEl: HTMLDivElement;\n popperInstance: Instance;\n\n /\n Help text to display on hover/focus\n /\n @Prop() text: string = '';\n\n /\n Optional icon to display. If not supplied, a standard help icon will be shown.\n /\n @Prop() icon: string = helpIcon;\n\n @State() containerId = `verdocs-help-icon-${Math.random().toString(36).substring(2, 11)}`;\n\n componentDidLoad() {\n this.popperInstance = createPopper(this.iconEl, this.tooltipEl, {\n // placement: 'top-end',\n // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n });\n }\n\n disconnectedCallback() {\n if (this.popperInstance) {\n this.popperInstance.destroy();\n this.popperInstance = null;\n }\n }\n\n show() {\n this.tooltipEl?.setAttribute('data-show', '');\n this.popperInstance?.update().catch(() => {});\n }\n\n hide() {\n this.tooltipEl?.removeAttribute('data-show');\n }\n\n render() {\n return (\n <Host class={{}}>\n <div\n aria-describedby={this.containerId}\n class=\"icon\"\n innerHTML={this.icon}\n onMouseEnter={() => this.show()}\n onFocus={() => this.show()}\n onMouseLeave={() => this.hide()}\n onBlur={() => this.hide()}\n ref={el => (this.iconEl = el as HTMLDivElement)}\n />\n <div\n id={this.containerId}\n role=\"tooltip\"\n class=\"tooltip\"\n data-popper-placement=\"bottom\"\n ref={el => (this.tooltipEl = el as HTMLDivElement)}\n >\n <span innerHTML={this.text} />\n <div data-popper-arrow=\"true\" class=\"arrow\" />\n </div>\n </Host>\n );\n }\n}\n","@import '../../../theme.scss';\n\nverdocs-text-input {\n font-family: $primary-font;\n box-sizing: border-box;\n margin: 0 0 10px 0;\n display: block;\n\n .input-element {\n box-sizing: border-box;\n border: 1px solid $border-color;\n border-radius: 4px;\n background: $verdocs-grey-4;\n color: #000;\n width: 100%;\n font-size: 16px;\n height: 34px;\n padding: 0 9px;\n outline: none;\n\n &:disabled {\n cursor: not-allowed;\n background: $verdocs-grey-2;\n border: 1px solid $verdocs-grey-1;\n }\n\n &::placeholder {\n color: $light-disabled-color;\n opacity: 1;\n }\n\n &:focus {\n outline: 1px solid $border-color-highlight;\n }\n }\n\n .input-label {\n display: block;\n color: $label-color-light;\n font-weight: 700;\n font-size: 14px;\n margin: 0 0 4px 0;\n }\n\n .required {\n color: red;\n margin-left: 2px;\n display: inline-block;\n }\n\n // @see https://community.logmein.com/t5/LastPass-Support-Discussions/placeholder-text-overrides-data-lpignore-quot-true-quot/td-p/295135\n // LastPass is ignoring the data-lpignore attribute in some cases\n [data-lastpass-icon-root] {\n display: none !important;\n }\n\n .input-container {\n position: relative;\n }\n\n .clear {\n top: 7px;\n right: 5px;\n width: 18px;\n height: 18px;\n fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: #720101;\n cursor: pointer;\n }\n }\n\n .copy {\n top: 7px;\n right: 5px;\n width: 18px;\n height: 18px;\n fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: $verdocs-purple;\n cursor: pointer;\n }\n }\n\n .toggle-pw {\n top: 5px;\n right: 7px;\n width: 18px;\n height: 18px;\n stroke: #cccccc;\n //fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: $verdocs-purple;\n cursor: pointer;\n }\n }\n\n &.clearable,\n &.copyable {\n .input-element {\n padding-right: 32px;\n }\n }\n}\n","import {Component, Element, Prop, Host, h, State} from '@stencil/core';\nimport {VerdocsToast} from '../../../utils/Toast';\n\nconst ClearIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 122.881 122.88\"><g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M61.44,0c33.933,0,61.441,27.507,61.441,61.439 c0,33.933-27.508,61.44-61.441,61.44C27.508,122.88,0,95.372,0,61.439C0,27.507,27.508,0,61.44,0L61.44,0z M81.719,36.226 c1.363-1.363,3.572-1.363,4.936,0c1.363,1.363,1.363,3.573,0,4.936L66.375,61.439l20.279,20.278c1.363,1.363,1.363,3.573,0,4.937 c-1.363,1.362-3.572,1.362-4.936,0L61.44,66.376L41.162,86.654c-1.362,1.362-3.573,1.362-4.936,0c-1.363-1.363-1.363-3.573,0-4.937 l20.278-20.278L36.226,41.162c-1.363-1.363-1.363-3.573,0-4.936c1.363-1.363,3.573-1.363,4.936,0L61.44,56.504L81.719,36.226 L81.719,36.226z\"/></g></svg>`;\nconst CopyIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path fill-rule=\"evenodd\" d=\"M15.988 3.012A2.25 2.25 0 0118 5.25v6.5A2.25 2.25 0 0115.75 14H13.5V7A2.5 2.5 0 0011 4.5H8.128a2.252 2.252 0 011.884-1.488A2.25 2.25 0 0112.25 1h1.5a2.25 2.25 0 012.238 2.012zM11.5 3.25a.75.75 0 01.75-.75h1.5a.75.75 0 01.75.75v.25h-3v-.25z\" clip-rule=\"evenodd\" /><path fill-rule=\"evenodd\" d=\"M2 7a1 1 0 011-1h8a1 1 0 011 1v10a1 1 0 01-1 1H3a1 1 0 01-1-1V7zm2 3.25a.75.75 0 01.75-.75h4.5a.75.75 0 010 1.5h-4.5a.75.75 0 01-.75-.75zm0 3.5a.75.75 0 01.75-.75h4.5a.75.75 0 010 1.5h-4.5a.75.75 0 01-.75-.75z\" clip-rule=\"evenodd\" /></svg>`;\nconst EyeIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z\" /><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\" /></svg>`;\nconst EyeSlashIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88\" /></svg>`;\n\n/\n Display a text input field. This is just a standard HTML input field with minimal markup to fit the\n * visual styles of the other components. Note that events \"bubble\" from the input field to the container,\n * so you can subscribe to the same DOM events (input, blur, etc) that a normal input would emit.\n \n ```ts\n * <verdocs-text-input type=\"text\" label=\"Name\" placeholder=\"Enter your name...\" value=\"\" />\n * ```\n /\n@Component({\n tag: 'verdocs-text-input',\n styleUrl: 'verdocs-text-input.scss',\n})\nexport class VerdocsTextInput {\n private inputEl: HTMLInputElement;\n\n @Element()\n hostEl: HTMLElement;\n\n /\n The initial value for the input field.\n /\n @Prop({mutable: true, reflect: true}) value: string = '';\n\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the field.\n /\n @Prop() placeholder: string = '';\n\n /\n If desired, the autocomplete attribute to set.\n /\n @Prop() autocomplete: string = '';\n\n /\n If supplied, a help icon will be displayed to provide the user more information.\n /\n @Prop() helpText: string = '';\n\n /\n If set, a clear button will be displayed.\n /\n @Prop() clearable = false;\n\n /\n If set, a copy-to-clipboard button will be displayed. NOTE: A field may not be\n * both clearable and copyable. If both properties are set to true, copyable will\n * be ignored.\n /\n @Prop() copyable = false;\n\n /\n The type of field to render. Only text-type fields are allowed here for the current styling. Additional types\n * (e.g. a date picker) will be supported by other controls in the future.\n /\n @Prop() type: 'text' \| 'password' \| 'email' \| 'number' \| 'search' \| 'tel' \| 'url' = 'text';\n\n /\n Should the field be disabled?\n /\n @Prop() disabled: boolean = false;\n\n /\n Should the field be required?\n /\n @Prop() required: boolean = false;\n\n @State() showingPw: boolean = false;\n\n copyToClipboard() {\n this.inputEl.select();\n navigator.clipboard\n .writeText(this.value)\n .then(() => VerdocsToast('Copied!'))\n .catch(e => console.log('Error copying to clipboard', e));\n }\n\n render() {\n return (\n <Host class={`input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}`}>\n <label>\n {this.label && (\n <div class=\"input-label\">\n {this.label + ':'}\n {this.required && <span class=\"required\"></span>}\n </div>\n )}\n\n <div class=\"input-container\">\n <input\n type={this.type === 'password' && this.showingPw ? 'text' : this.type}\n value={this.value}\n required={this.required}\n class=\"input-element\"\n data-lpignore=\"true\"\n disabled={this.disabled}\n placeholder={this.placeholder}\n autoComplete={this.autocomplete}\n // onBlur={(e: any) => this.blur?.emit(e.target.value)}\n ref={el => (this.inputEl = el as HTMLInputElement)}\n onInput={(e: any) => (this.value = e.target.value)}\n />\n\n {this.clearable && this.value && (\n <span\n innerHTML={ClearIcon}\n class=\"clear\"\n onClick={() => {\n // We need to allow the onInput event to fire first in case\n // the user was focused on this field before clicking clear.\n setTimeout(() => {\n this.value = '';\n this.inputEl?.setAttribute('value', '');\n // We need to allow the value to \"settle\"\n setTimeout(() => {\n this.inputEl?.dispatchEvent(new window.Event('focusout'));\n this.inputEl?.blur();\n }, 50);\n }, 50);\n }}\n />\n )}\n\n {this.type === 'password' && (\n <span\n innerHTML={this.showingPw ? EyeIcon : EyeSlashIcon}\n class=\"toggle-pw\"\n onClick={() => {\n this.showingPw = !this.showingPw;\n }}\n />\n )}\n\n {!this.clearable && this.copyable && this.value && <span innerHTML={CopyIcon} class=\"copy\" onClick={() => this.copyToClipboard()} />}\n </div>\n\n {this.helpText && <verdocs-help-icon text={this.helpText} />}\n </label>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"p-CflLDny-.system.js","sources":["src/components/controls/verdocs-button/verdocs-button.scss?tag=verdocs-button","src/components/controls/verdocs-button/verdocs-button.tsx","src/components/controls/verdocs-help-icon/verdocs-help-icon.scss?tag=verdocs-help-icon","src/components/controls/verdocs-help-icon/verdocs-help-icon.tsx","src/components/controls/verdocs-text-input/verdocs-text-input.scss?tag=verdocs-text-input","src/components/controls/verdocs-text-input/verdocs-text-input.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-button {\n button {\n font-family: $verdocs-primary-font;\n text-transform: uppercase;\n justify-content: center;\n display: inline-flex;\n align-items: center;\n font-weight: 700;\n cursor: pointer;\n margin: 0;\n\n &:disabled {\n cursor: inherit;\n pointer-events: none;\n }\n\n .icon {\n margin: 0 12px;\n\n svg {\n fill: $verdocs-grey-4;\n display: block;\n }\n }\n\n .button-label {\n padding: 0 12px;\n }\n\n // Small-sized button size adjustments\n &.xsmall {\n height: 26px;\n font-size: 12px;\n\n .icon {\n margin: 0 3px;\n\n svg {\n margin: 2px 0 0 0;\n height: 18px;\n }\n }\n\n .button-label {\n padding: 0 4px;\n }\n }\n\n // Small-sized button size adjustments\n &.small {\n height: 34px;\n font-size: 13px;\n\n .icon {\n margin: 0 4px;\n\n svg {\n margin: 2px 0 0 0;\n height: 20px;\n }\n }\n\n .button-label {\n padding: 0 4px;\n }\n }\n\n // Normal-sized button size adjustments\n &.normal {\n height: 44px;\n font-size: 14px;\n\n .icon.start {\n margin: 0 4px 0 8px;\n }\n\n .icon.end {\n margin: 0 8px 0 4px;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 22px;\n }\n }\n\n .button-label {\n padding: 0 10px;\n }\n }\n\n // Medium-sized button size adjustments\n &.medium {\n height: 52px;\n font-size: 16px;\n\n .icon.start {\n margin: 0 0 0 18px;\n }\n\n .icon.end {\n margin: 0 18px 0 0;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 26px;\n }\n }\n\n .button-label {\n padding: 0 20px;\n }\n }\n\n // Large-sized button size adjustments\n &.large {\n height: 60px;\n font-size: 20px;\n\n .icon.start {\n margin: 0 0 0 24px;\n }\n\n .icon.end {\n margin: 0 24px 0 0;\n }\n\n .icon {\n svg {\n margin: 2px 0 0 0;\n height: 32px;\n }\n }\n\n .button-label {\n padding: 0 34px;\n }\n }\n\n // Standard variant is a solid color\n &.standard {\n background: $verdocs-green;\n border-radius: 4px;\n outline: none;\n border: none;\n color: white;\n\n &:disabled {\n background-color: $disabled-color;\n cursor: default;\n }\n\n &:active:not([disabled]) {\n filter: brightness(110%);\n }\n }\n\n // Text variant is just a label\n &.text {\n color: $secondary-color;\n background: transparent;\n font-weight: 500;\n padding: 0 4px;\n outline: none;\n border: none;\n\n &:disabled {\n color: $disabled-color;\n }\n\n &:active:not([disabled]) {\n filter: brightness(130%);\n }\n\n .icon {\n svg {\n fill: $secondary-color;\n }\n }\n }\n\n // Standard variant is a solid color\n &.outline {\n border: 1px solid $secondary-color;\n color: $secondary-color;\n outline: none;\n background: transparent;\n border-radius: 4px;\n padding: 0 20px;\n\n &:disabled {\n color: $disabled-color;\n border: 1px solid $disabled-color;\n }\n\n &:active {\n background: $secondary-color;\n color: white;\n }\n\n .icon {\n svg {\n fill: $secondary-color;\n }\n }\n }\n }\n}\n","import {Component, Prop, h} from '@stencil/core';\n\n/*\n A simple button, with consistent styling to other controls in the design system.\n \n ```ts\n * <verdocs-button label=\"Click Me\" size=\"normal\" variant=\"standard\" />\n * ```\n /\n@Component({\n tag: 'verdocs-button',\n styleUrl: 'verdocs-button.scss',\n})\nexport class VerdocsButton {\n /\n The label for the button.\n /\n @Prop() label!: string;\n\n /\n If desired, a prefix icon for the button.\n /\n @Prop() startIcon: string \| null = null;\n\n /\n If desired, a suffix icon for the button.\n /\n @Prop() endIcon: string \| null = null;\n\n /\n The size (height) of the button.\n /\n @Prop() size: 'xsmall' \| 'small' \| 'normal' \| 'medium' \| 'large' = 'normal';\n\n /\n The type of the button.\n /\n @Prop() type: 'button' \| 'submit' \| 'reset' = 'button';\n\n /\n The display variant of the button.\n /\n @Prop() variant: 'standard' \| 'text' \| 'outline' = 'standard';\n\n /\n Whether the button should be disabled.\n /\n @Prop() disabled: boolean = false;\n\n render() {\n return (\n <button disabled={this.disabled} type={this.type} class={`${this.variant} ${this.size} ${this.type}`}>\n {this.startIcon ? <span class=\"icon start\" innerHTML={this.startIcon} /> : null}\n <span class=\"button-label\">{this.label}</span>\n {this.endIcon ? <span class=\"icon end\" innerHTML={this.endIcon} /> : null}\n </button>\n );\n }\n}\n","@import '../../../theme.scss';\n\nverdocs-help-icon {\n font-family: $verdocs-primary-font;\n display: inline-block;\n opacity: 0.3;\n position: relative;\n\n &:hover {\n opacity: 1;\n }\n\n .icon {\n display: inline-block;\n }\n\n .tooltip {\n display: none;\n min-width: 200px;\n box-shadow: 0 0 10px 1px #999999;\n background: #ffffff;\n color: $label-color;\n max-width: 240px;\n font-weight: 500;\n position: absolute;\n padding: 5px 10px;\n font-size: 12px;\n border-radius: 4px;\n z-index: 10005;\n\n .arrow,\n .arrow::before {\n position: absolute;\n width: 8px;\n height: 8px;\n background: inherit;\n }\n\n .arrow {\n visibility: hidden;\n top: -4px;\n }\n\n .arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n }\n\n &[data-show] {\n display: block;\n }\n\n &[data-popper-placement^='top'] > .arrow {\n bottom: -4px;\n }\n\n &[data-popper-placement^='bottom'] > .arrow {\n top: -4px;\n }\n\n &[data-popper-placement^='left'] > .arrow {\n right: -4px;\n }\n\n &[data-popper-placement^='right'] > .arrow {\n left: -4px;\n }\n }\n}\n","import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Prop, State} from '@stencil/core';\n\nconst helpIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" fill=\"#5c6575\"><path d=\"M11.925 18q.55 0 .938-.387.387-.388.387-.938 0-.55-.387-.925-.388-.375-.938-.375-.55 0-.925.375t-.375.925q0 .55.375.938.375.387.925.387Zm-.95-3.85h1.95q0-.8.2-1.287.2-.488 1.025-1.288.65-.625 1.025-1.213.375-.587.375-1.437 0-1.425-1.025-2.175Q13.5 6 12.1 6q-1.425 0-2.35.775t-1.275 1.85l1.775.7q.125-.45.55-.975.425-.525 1.275-.525.725 0 1.1.412.375.413.375.888 0 .475-.287.9-.288.425-.713.775-1.075.95-1.325 1.475-.25.525-.25 1.875ZM12 22.2q-2.125 0-3.988-.8-1.862-.8-3.237-2.175Q3.4 17.85 2.6 15.988 1.8 14.125 1.8 12t.8-3.988q.8-1.862 2.175-3.237Q6.15 3.4 8.012 2.6 9.875 1.8 12 1.8t3.988.8q1.862.8 3.237 2.175Q20.6 6.15 21.4 8.012q.8 1.863.8 3.988t-.8 3.988q-.8 1.862-2.175 3.237Q17.85 20.6 15.988 21.4q-1.863.8-3.988.8Zm0-2.275q3.325 0 5.625-2.3t2.3-5.625q0-3.325-2.3-5.625T12 4.075q-3.325 0-5.625 2.3T4.075 12q0 3.325 2.3 5.625t5.625 2.3ZM12 12Z\"/></svg>';\n\n/\n Displays a simple help icon. Upon hover or focus, a tooltip will be displayed with help text.\n \n ```ts\n * <verdocs-help-icon text=\"Sample help text\" />\n * ```\n /\n@Component({\n tag: 'verdocs-help-icon',\n styleUrl: 'verdocs-help-icon.scss',\n shadow: false,\n})\nexport class VerdocsHelpIcon {\n iconEl: HTMLDivElement;\n tooltipEl: HTMLDivElement;\n popperInstance: Instance;\n\n /\n Help text to display on hover/focus\n /\n @Prop() text: string = '';\n\n /\n Optional icon to display. If not supplied, a standard help icon will be shown.\n /\n @Prop() icon: string = helpIcon;\n\n @State() containerId = `verdocs-help-icon-${Math.random().toString(36).substring(2, 11)}`;\n\n componentDidLoad() {\n this.popperInstance = createPopper(this.iconEl, this.tooltipEl, {\n // placement: 'top-end',\n // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n });\n }\n\n disconnectedCallback() {\n if (this.popperInstance) {\n this.popperInstance.destroy();\n this.popperInstance = null;\n }\n }\n\n show() {\n this.tooltipEl?.setAttribute('data-show', '');\n this.popperInstance?.update().catch(() => {});\n }\n\n hide() {\n this.tooltipEl?.removeAttribute('data-show');\n }\n\n render() {\n return (\n <Host class={{}}>\n <div\n aria-describedby={this.containerId}\n class=\"icon\"\n innerHTML={this.icon}\n onMouseEnter={() => this.show()}\n onFocus={() => this.show()}\n onMouseLeave={() => this.hide()}\n onBlur={() => this.hide()}\n ref={el => (this.iconEl = el as HTMLDivElement)}\n />\n <div\n id={this.containerId}\n role=\"tooltip\"\n class=\"tooltip\"\n data-popper-placement=\"bottom\"\n ref={el => (this.tooltipEl = el as HTMLDivElement)}\n >\n <span innerHTML={this.text} />\n <div data-popper-arrow=\"true\" class=\"arrow\" />\n </div>\n </Host>\n );\n }\n}\n","@import '../../../theme.scss';\n\nverdocs-text-input {\n font-family: $primary-font;\n box-sizing: border-box;\n margin: 0 0 10px 0;\n display: block;\n\n .input-element {\n box-sizing: border-box;\n border: 1px solid $border-color;\n border-radius: 4px;\n background: $verdocs-grey-4;\n color: #000;\n width: 100%;\n font-size: 16px;\n height: 34px;\n padding: 0 9px;\n outline: none;\n\n &:disabled {\n cursor: not-allowed;\n background: $verdocs-grey-2;\n border: 1px solid $verdocs-grey-1;\n }\n\n &::placeholder {\n color: $light-disabled-color;\n opacity: 1;\n }\n\n &:focus {\n outline: 1px solid $border-color-highlight;\n }\n }\n\n .input-label {\n display: block;\n color: $label-color-light;\n font-weight: 700;\n font-size: 14px;\n margin: 0 0 4px 0;\n }\n\n .required {\n color: red;\n margin-left: 2px;\n display: inline-block;\n }\n\n // @see https://community.logmein.com/t5/LastPass-Support-Discussions/placeholder-text-overrides-data-lpignore-quot-true-quot/td-p/295135\n // LastPass is ignoring the data-lpignore attribute in some cases\n [data-lastpass-icon-root] {\n display: none !important;\n }\n\n .input-container {\n position: relative;\n }\n\n .clear {\n top: 7px;\n right: 5px;\n width: 18px;\n height: 18px;\n fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: #720101;\n cursor: pointer;\n }\n }\n\n .copy {\n top: 7px;\n right: 5px;\n width: 18px;\n height: 18px;\n fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: $verdocs-purple;\n cursor: pointer;\n }\n }\n\n .toggle-pw {\n top: 5px;\n right: 7px;\n width: 18px;\n height: 18px;\n stroke: #cccccc;\n //fill: #cccccc;\n position: absolute;\n\n &:hover {\n fill: $verdocs-purple;\n cursor: pointer;\n }\n }\n\n &.clearable,\n &.copyable {\n .input-element {\n padding-right: 32px;\n }\n }\n}\n","import {Component, Element, Prop, Host, h, State} from '@stencil/core';\nimport {VerdocsToast} from '../../../utils/Toast';\n\nconst ClearIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 122.881 122.88\"><g><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M61.44,0c33.933,0,61.441,27.507,61.441,61.439 c0,33.933-27.508,61.44-61.441,61.44C27.508,122.88,0,95.372,0,61.439C0,27.507,27.508,0,61.44,0L61.44,0z M81.719,36.226 c1.363-1.363,3.572-1.363,4.936,0c1.363,1.363,1.363,3.573,0,4.936L66.375,61.439l20.279,20.278c1.363,1.363,1.363,3.573,0,4.937 c-1.363,1.362-3.572,1.362-4.936,0L61.44,66.376L41.162,86.654c-1.362,1.362-3.573,1.362-4.936,0c-1.363-1.363-1.363-3.573,0-4.937 l20.278-20.278L36.226,41.162c-1.363-1.363-1.363-3.573,0-4.936c1.363-1.363,3.573-1.363,4.936,0L61.44,56.504L81.719,36.226 L81.719,36.226z\"/></g></svg>`;\nconst CopyIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path fill-rule=\"evenodd\" d=\"M15.988 3.012A2.25 2.25 0 0118 5.25v6.5A2.25 2.25 0 0115.75 14H13.5V7A2.5 2.5 0 0011 4.5H8.128a2.252 2.252 0 011.884-1.488A2.25 2.25 0 0112.25 1h1.5a2.25 2.25 0 012.238 2.012zM11.5 3.25a.75.75 0 01.75-.75h1.5a.75.75 0 01.75.75v.25h-3v-.25z\" clip-rule=\"evenodd\" /><path fill-rule=\"evenodd\" d=\"M2 7a1 1 0 011-1h8a1 1 0 011 1v10a1 1 0 01-1 1H3a1 1 0 01-1-1V7zm2 3.25a.75.75 0 01.75-.75h4.5a.75.75 0 010 1.5h-4.5a.75.75 0 01-.75-.75zm0 3.5a.75.75 0 01.75-.75h4.5a.75.75 0 010 1.5h-4.5a.75.75 0 01-.75-.75z\" clip-rule=\"evenodd\" /></svg>`;\nconst EyeIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z\" /><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\" /></svg>`;\nconst EyeSlashIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88\" /></svg>`;\n\n/\n Display a text input field. This is just a standard HTML input field with minimal markup to fit the\n * visual styles of the other components. Note that events \"bubble\" from the input field to the container,\n * so you can subscribe to the same DOM events (input, blur, etc) that a normal input would emit.\n \n ```ts\n * <verdocs-text-input type=\"text\" label=\"Name\" placeholder=\"Enter your name...\" value=\"\" />\n * ```\n /\n@Component({\n tag: 'verdocs-text-input',\n styleUrl: 'verdocs-text-input.scss',\n})\nexport class VerdocsTextInput {\n private inputEl: HTMLInputElement;\n\n @Element()\n hostEl: HTMLElement;\n\n /\n The initial value for the input field.\n /\n @Prop({mutable: true, reflect: true}) value: string = '';\n\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the field.\n /\n @Prop() placeholder: string = '';\n\n /\n If desired, the autocomplete attribute to set.\n /\n @Prop() autocomplete: string = '';\n\n /\n If supplied, a help icon will be displayed to provide the user more information.\n /\n @Prop() helpText: string = '';\n\n /\n If set, a clear button will be displayed.\n /\n @Prop() clearable = false;\n\n /\n If set, a copy-to-clipboard button will be displayed. NOTE: A field may not be\n * both clearable and copyable. If both properties are set to true, copyable will\n * be ignored.\n /\n @Prop() copyable = false;\n\n /\n The type of field to render. Only text-type fields are allowed here for the current styling. Additional types\n * (e.g. a date picker) will be supported by other controls in the future.\n /\n @Prop() type: 'text' \| 'password' \| 'email' \| 'number' \| 'search' \| 'tel' \| 'url' = 'text';\n\n /\n Should the field be disabled?\n /\n @Prop() disabled: boolean = false;\n\n /\n Should the field be required?\n /\n @Prop() required: boolean = false;\n\n @State() showingPw: boolean = false;\n\n copyToClipboard() {\n this.inputEl.select();\n navigator.clipboard\n .writeText(this.value)\n .then(() => VerdocsToast('Copied!'))\n .catch(e => console.log('Error copying to clipboard', e));\n }\n\n render() {\n return (\n <Host class={`input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}`}>\n <label>\n {this.label && (\n <div class=\"input-label\">\n {this.label + ':'}\n {this.required && <span class=\"required\"></span>}\n </div>\n )}\n\n <div class=\"input-container\">\n <input\n type={this.type === 'password' && this.showingPw ? 'text' : this.type}\n value={this.value}\n required={this.required}\n class=\"input-element\"\n data-lpignore=\"true\"\n disabled={this.disabled}\n placeholder={this.placeholder}\n autoComplete={this.autocomplete}\n // onBlur={(e: any) => this.blur?.emit(e.target.value)}\n ref={el => (this.inputEl = el as HTMLInputElement)}\n onInput={(e: any) => (this.value = e.target.value)}\n />\n\n {this.clearable && this.value && (\n <span\n innerHTML={ClearIcon}\n class=\"clear\"\n onClick={() => {\n // We need to allow the onInput event to fire first in case\n // the user was focused on this field before clicking clear.\n setTimeout(() => {\n this.value = '';\n this.inputEl?.setAttribute('value', '');\n // We need to allow the value to \"settle\"\n setTimeout(() => {\n this.inputEl?.dispatchEvent(new window.Event('focusout'));\n this.inputEl?.blur();\n }, 50);\n }, 50);\n }}\n />\n )}\n\n {this.type === 'password' && (\n <span\n innerHTML={this.showingPw ? EyeIcon : EyeSlashIcon}\n class=\"toggle-pw\"\n onClick={() => {\n this.showingPw = !this.showingPw;\n }}\n />\n )}\n\n {!this.clearable && this.copyable && this.value && <span innerHTML={CopyIcon} class=\"copy\" onClick={() => this.copyToClipboard()} />}\n </div>\n\n {this.helpText && <verdocs-help-icon text={this.helpText} />}\n </label>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/verdocs-web-sdk/{p-DqMEkp6a.system.js.map → p-CqnaEr0M.system.js.map} RENAMED Viewed

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

package/dist/verdocs-web-sdk/{p-DwPw01KR.system.js.map → p-Ctlx9aRK.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-~~DwPw01KR~~.system.js","sources":["src/components/controls/verdocs-multiselect/verdocs-multiselect.scss?tag=verdocs-multiselect","src/components/controls/verdocs-multiselect/verdocs-multiselect.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-multiselect {\n width: 100%;\n display: block;\n margin: 0 0 10px 0;\n box-sizing: border-box;\n font-family: $primary-font;\n position: relative;\n\n .input-wrapper {\n width: 100%;\n position: relative;\n\n .icon {\n top: 6px;\n right: 6px;\n width: 18px;\n height: 18px;\n z-index: 10;\n position: absolute;\n }\n }\n\n .trigger {\n gap: 3px;\n width: 100%;\n display: flex;\n flex-wrap: wrap;\n max-width: 100%;\n border-radius: 4px;\n flex-direction: row;\n box-sizing: border-box;\n padding: 5px 32px 5px 7px;\n background: $verdocs-grey-4;\n border: 1px solid $border-color;\n\n &::placeholder {\n opacity: 1;\n color: $light-disabled-color;\n }\n }\n\n .selected-option {\n color: white;\n font-size: 12px;\n padding: 2px 6px;\n border-radius: 3px;\n display: inline-block;\n background: $verdocs-grey-blue;\n }\n\n .input-label {\n display: block;\n font-weight: 700;\n font-size: 14px;\n margin: 0 0 4px 0;\n color: $label-color-light;\n }\n\n .verdocs-multiselect-dropdown {\n left: 0;\n top: 30px;\n width: 210px;\n z-index: 10000;\n position: absolute;\n border-radius: 5px;\n font-family: $primary-font;\n background: $verdocs-grey-4;\n border: 1px solid $item-border-color;\n\n .option {\n gap: 4px;\n display: flex;\n padding: 5px 8px;\n align-items: center;\n flex-direction: row;\n text-wrap: nowrap;\n }\n\n label {\n font-size: 13px;\n }\n }\n}\n\n#verdocs-multiselect-menu-items {\n width: 200px;\n z-index: 10000;\n position: absolute;\n border-radius: 5px;\n font-family: $primary-font;\n background: $verdocs-grey-4;\n border: 1px solid $item-border-color;\n\n .option {\n display: flex;\n gap: 4px;\n padding: 5px 8px;\n align-items: center;\n flex-direction: row;\n }\n\n label {\n font-size: 13px;\n }\n}\n","import {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Host, h, State, EventEmitter, Event} from '@stencil/core';\n\nexport interface IMultiSelectOption {\n label: string;\n value: string;\n}\n\nconst DownIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" /></svg>`;\nconst UpIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\" /></svg>`;\n\n/*\n Display a dropdown that allows multiple options to be selected. Note that events \"bubble\" from the\n * input field to the container, so you can subscribe to the same DOM events (input, blur, etc) that a\n * normal input would emit.\n \n ```ts\n * <verdocs-multiselect label=\"Methods:\" value={[]} options={[...options]} onInput={() => {}} />\n * ```\n /\n@Component({\n tag: 'verdocs-multiselect',\n styleUrl: 'verdocs-multiselect.scss',\n})\nexport class VerdocsMultiselect {\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the input element when no options are selected.\n /\n @Prop() placeholder: string = 'Select...';\n\n /\n The options to list.\n /\n @Prop() options: IMultiSelectOption[];\n\n /\n The currently selected options.\n /\n @Prop() selectedOptions: string[] = [];\n\n @Event({composed: true}) selectionChanged: EventEmitter<{selectedOptions: string[]}>;\n\n @State() showPicker = false;\n\n handleToggleOption(e: any, option: IMultiSelectOption) {\n if (e.target.checked) {\n this.selectedOptions = [...this.selectedOptions, option.value];\n } else {\n this.selectedOptions = this.selectedOptions.filter(selected => selected !== option.value);\n }\n\n this.selectionChanged?.emit({selectedOptions: this.selectedOptions});\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host class={this.showPicker ? 'open' : 'closed'}>\n <label>\n {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n <div class=\"input-wrapper\">\n <button id={elId} class=\"trigger\" value=\"\" onClick={() => (this.showPicker = !this.showPicker)}>\n {this.selectedOptions.length === 0 ? (\n <span class=\"placeholder\">{this.placeholder}</span>\n ) : (\n this.selectedOptions.map(option => <span class=\"selected-option\">{this.options.find(opt => opt.value === option)?.label \|\| 'Unknown'}</span>)\n )}\n </button>\n\n <div class=\"icon\" innerHTML={this.showPicker ? UpIcon : DownIcon} />\n\n {this.showPicker && (\n <div class=\"verdocs-multiselect-dropdown\">\n {/<verdocs-portal/}\n {/ anchor={elId}/}\n {/ voffset={2}/}\n {/ onClickAway={() => {/}\n {/ this.showPicker = false;/}\n {/ }}/}\n {/ id=\"verdocs-multiselect-menu-items\"/}\n {/>/}\n {this.options.map((option, i) => (\n <div class=\"option\" onClick={() => (this.showPicker = false)}>\n <verdocs-checkbox\n size=\"small\"\n id={`verdocs-multi-select-opt-${i}`}\n value={option.value}\n checked={this.selectedOptions.includes(option.value)}\n onInput={(e: any) => this.handleToggleOption(e, option)}\n />\n <label htmlFor={`verdocs-multi-select-option-${i}`}>{option.label}</label>\n </div>\n ))}\n {/</verdocs-portal>*/}\n </div>\n )}\n </div>\n </label>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"p-Ctlx9aRK.system.js","sources":["src/components/controls/verdocs-multiselect/verdocs-multiselect.scss?tag=verdocs-multiselect","src/components/controls/verdocs-multiselect/verdocs-multiselect.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-multiselect {\n width: 100%;\n display: block;\n margin: 0 0 10px 0;\n box-sizing: border-box;\n font-family: $primary-font;\n position: relative;\n\n .input-wrapper {\n width: 100%;\n position: relative;\n\n .icon {\n top: 6px;\n right: 6px;\n width: 18px;\n height: 18px;\n z-index: 10;\n position: absolute;\n }\n }\n\n .trigger {\n gap: 3px;\n width: 100%;\n display: flex;\n flex-wrap: wrap;\n max-width: 100%;\n border-radius: 4px;\n flex-direction: row;\n box-sizing: border-box;\n padding: 5px 32px 5px 7px;\n background: $verdocs-grey-4;\n border: 1px solid $border-color;\n\n &::placeholder {\n opacity: 1;\n color: $light-disabled-color;\n }\n }\n\n .selected-option {\n color: white;\n font-size: 12px;\n padding: 2px 6px;\n border-radius: 3px;\n display: inline-block;\n background: $verdocs-grey-blue;\n }\n\n .input-label {\n display: block;\n font-weight: 700;\n font-size: 14px;\n margin: 0 0 4px 0;\n color: $label-color-light;\n }\n\n .verdocs-multiselect-dropdown {\n left: 0;\n top: 30px;\n width: 210px;\n z-index: 10000;\n position: absolute;\n border-radius: 5px;\n font-family: $primary-font;\n background: $verdocs-grey-4;\n border: 1px solid $item-border-color;\n\n .option {\n gap: 4px;\n display: flex;\n padding: 5px 8px;\n align-items: center;\n flex-direction: row;\n text-wrap: nowrap;\n }\n\n label {\n font-size: 13px;\n }\n }\n}\n\n#verdocs-multiselect-menu-items {\n width: 200px;\n z-index: 10000;\n position: absolute;\n border-radius: 5px;\n font-family: $primary-font;\n background: $verdocs-grey-4;\n border: 1px solid $item-border-color;\n\n .option {\n display: flex;\n gap: 4px;\n padding: 5px 8px;\n align-items: center;\n flex-direction: row;\n }\n\n label {\n font-size: 13px;\n }\n}\n","import {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Host, h, State, EventEmitter, Event} from '@stencil/core';\n\nexport interface IMultiSelectOption {\n label: string;\n value: string;\n}\n\nconst DownIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" /></svg>`;\nconst UpIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\" /></svg>`;\n\n/*\n Display a dropdown that allows multiple options to be selected. Note that events \"bubble\" from the\n * input field to the container, so you can subscribe to the same DOM events (input, blur, etc) that a\n * normal input would emit.\n \n ```ts\n * <verdocs-multiselect label=\"Methods:\" value={[]} options={[...options]} onInput={() => {}} />\n * ```\n /\n@Component({\n tag: 'verdocs-multiselect',\n styleUrl: 'verdocs-multiselect.scss',\n})\nexport class VerdocsMultiselect {\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the input element when no options are selected.\n /\n @Prop() placeholder: string = 'Select...';\n\n /\n The options to list.\n /\n @Prop() options: IMultiSelectOption[];\n\n /\n The currently selected options.\n /\n @Prop() selectedOptions: string[] = [];\n\n @Event({composed: true}) selectionChanged: EventEmitter<{selectedOptions: string[]}>;\n\n @State() showPicker = false;\n\n handleToggleOption(e: any, option: IMultiSelectOption) {\n if (e.target.checked) {\n this.selectedOptions = [...this.selectedOptions, option.value];\n } else {\n this.selectedOptions = this.selectedOptions.filter(selected => selected !== option.value);\n }\n\n this.selectionChanged?.emit({selectedOptions: this.selectedOptions});\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host class={this.showPicker ? 'open' : 'closed'}>\n <label>\n {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n <div class=\"input-wrapper\">\n <button id={elId} class=\"trigger\" value=\"\" onClick={() => (this.showPicker = !this.showPicker)}>\n {this.selectedOptions.length === 0 ? (\n <span class=\"placeholder\">{this.placeholder}</span>\n ) : (\n this.selectedOptions.map(option => <span class=\"selected-option\">{this.options.find(opt => opt.value === option)?.label \|\| 'Unknown'}</span>)\n )}\n </button>\n\n <div class=\"icon\" innerHTML={this.showPicker ? UpIcon : DownIcon} />\n\n {this.showPicker && (\n <div class=\"verdocs-multiselect-dropdown\">\n {/<verdocs-portal/}\n {/ anchor={elId}/}\n {/ voffset={2}/}\n {/ onClickAway={() => {/}\n {/ this.showPicker = false;/}\n {/ }}/}\n {/ id=\"verdocs-multiselect-menu-items\"/}\n {/>/}\n {this.options.map((option, i) => (\n <div class=\"option\" onClick={() => (this.showPicker = false)}>\n <verdocs-checkbox\n size=\"small\"\n id={`verdocs-multi-select-opt-${i}`}\n value={option.value}\n checked={this.selectedOptions.includes(option.value)}\n onInput={(e: any) => this.handleToggleOption(e, option)}\n />\n <label htmlFor={`verdocs-multi-select-option-${i}`}>{option.label}</label>\n </div>\n ))}\n {/</verdocs-portal>*/}\n </div>\n )}\n </div>\n </label>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/verdocs-web-sdk/p-CwXSduhy.system.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(e,t,a,i){function n(e){return e instanceof a?e:new a((function(t){t(e)}))}return new(a||(a=Promise))((function(a,s){function d(e){try{l(i.next(e))}catch(e){s(e)}}function o(e){try{l(i["throw"](e))}catch(e){s(e)}}function l(e){e.done?a(e.value):n(e.value).then(d,o)}l((i=i.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var a={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},i,n,s,d;return d={next:o(0),throw:o(1),return:o(2)},typeof Symbol==="function"&&(d[Symbol.iterator]=function(){return this}),d;function o(e){return function(t){return l([e,t])}}function l(o){if(i)throw new TypeError("Generator is already executing.");while(d&&(d=0,o[0]&&(a=0)),a)try{if(i=1,n&&(s=o[0]&2?n["return"]:o[0]?n["throw"]||((s=n["return"])&&s.call(n),0):n.next)&&!(s=s.call(n,o[1])).done)return s;if(n=0,s)o=[o[0]&2,s.value];switch(o[0]){case 0:case 1:s=o;break;case 4:a.label++;return{value:o[1],done:false};case 5:a.label++;n=o[1];o=[0];continue;case 7:o=a.ops.pop();a.trys.pop();continue;default:if(!(s=a.trys,s=s.length>0&&s[s.length-1])&&(o[0]===6||o[0]===2)){a=0;continue}if(o[0]===3&&(!s||o[1]>s[0]&&o[1]<s[3])){a.label=o[1];break}if(o[0]===6&&a.label<s[1]){a.label=s[1];s=o;break}if(s&&a.label<s[2]){a.label=s[2];a.ops.push(o);break}if(s[2])a.ops.pop();a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e];n=0}finally{i=s=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};System.register(["./p-gAi_FRvp.system.js","./p-BbPAtVJG.system.js"],(function(e,t){"use strict";var a,i,n;return{setters:[function(t){a=t.p;i=t.b;e("setNonce",t.s)},function(e){n=e.g}],execute:function(){var e=this;var s=function(){var e=t.meta.url;var i={};if(e!==""){i.resourcesUrl=new URL(".",e).href}return a(i)};s().then((function(t){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,n()];case 1:e.sent();return[2,i(JSON.parse('[["p-e63c903a.system",[[0,"verdocs-build",{"endpoint":[16],"templateId":[1537,"template-id"],"step":[1537],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"],"step":["onStepChanged"]}]]],["p-bec52dd1.system",[[0,"verdocs-sign",{"endpoint":[1040],"envelopeId":[513,"envelope-id"],"roleId":[513,"role-id"],"inviteCode":[513,"invite-code"],"headerTargetId":[1,"header-target-id"],"recipient":[32],"hasSignature":[32],"nextButtonLabel":[32],"nextSubmits":[32],"fatalErrorHeader":[32],"fatalErrorMessage":[32],"focusedField":[32],"disclosure":[32],"submitting":[32],"submitted":[32],"isDone":[32],"showDone":[32],"showLoadError":[32],"finishLater":[32],"showFinishLater":[32],"agreed":[32],"documentsSingularPlural":[32],"authStep":[32],"authMethodStates":[32],"kbaQuestions":[32],"showSpinner":[32],"kbaChoices":[32],"loading":[32],"envelope":[32]}]]],["p-44de70af.system",[[0,"verdocs-envelopes-list",{"endpoint":[16],"view":[1537],"status":[1537],"sort":[1537],"match":[1537],"showPagination":[4,"show-pagination"],"rowsPerPage":[2,"rows-per-page"],"selectedPage":[2,"selected-page"],"count":[32],"initiallyLoaded":[32],"loading":[32],"selectedEnvelopes":[32],"envelopes":[32]},null,{"view":["handleViewUpdated"],"status":["handleStatusUpdated"],"sort":["handleSortUpdated"],"match":["handleMatchUpdated"],"selectedPage":["handlePageUpdated"]}]]],["p-795cb651.system",[[0,"verdocs-templates-list",{"endpoint":[16],"visibility":[1537],"starred":[1537],"sort":[1537],"name":[1537],"allowedActions":[1040,"allowed-actions"],"showPagination":[4,"show-pagination"],"rowsPerPage":[2,"rows-per-page"],"selectedPage":[2,"selected-page"],"count":[32],"initiallyLoaded":[32],"loading":[32],"confirmDelete":[32],"templates":[32],"localNameFilter":[32]},null,{"sharing":["handleSharingUpdated"],"starred":["handleStarredUpdated"],"sort":["handleSortUpdated"],"name":["handleNameUpdated"],"selectedPage":["handlePageUpdated"]}]]],["p-9f4c393c.system",[[0,"verdocs-envelope-sidebar",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"activeTab":[32],"panelOpen":[32],"showRecipientDialog":[32],"showCancelDialog":[32],"showReinviteDialog":[32],"showUpdateDialog":[32],"remindersEnabled":[32],"updatingReminders":[32],"initialReminder":[32],"followupReminders":[32],"loading":[32],"envelope":[32]}]]],["p-8c98a765.system",[[0,"verdocs-field-payment",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16,"pdf-pages"],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"signed":[4],"roleindex":[2],"showingProperties":[32],"focused":[32],"preparedMessage":[32],"signatureUrl":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}]]],["p-d5469309.system",[[0,"verdocs-template-create",{"endpoint":[16],"maxSize":[1026,"max-size"],"file":[32],"creating":[32],"progressLabel":[32],"progressPercent":[32],"errorMessage":[32]}]]],["p-51b0c10c.system",[[0,"verdocs-auth",{"endpoint":[16],"visible":[4],"logo":[1],"displayMode":[1025,"display-mode"],"org_name":[32],"first_name":[32],"last_name":[32],"email":[32],"verificationCode":[32],"newPassword":[32],"password":[32],"confirmpass":[32],"submitting":[32],"resendDisabled":[32],"session":[32],"profile":[32]}]]],["p-ecefb50c.system",[[0,"verdocs-date-input",{"value":[1537],"label":[1],"placeholder":[1],"helpText":[1,"help-text"],"disabled":[4],"required":[4],"showingPw":[32],"focused":[32],"containerId":[32],"focusField":[64]}]]],["p-ac05c34d.system",[[0,"verdocs-envelope-recipient-summary",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"canSendAnother":[4,"can-send-another"],"canView":[4,"can-view"],"canDone":[4,"can-done"],"isOpen":[32],"recipientStatusIcons":[32],"containerId":[32],"gettingLinks":[32],"links":[32],"loading":[32],"envelope":[32]}]]],["p-193b964f.system",[[0,"verdocs-multiselect",{"label":[1],"placeholder":[1],"options":[16],"selectedOptions":[16,"selected-options"],"showPicker":[32]}]]],["p-d5790af4.system",[[4,"verdocs-dialog"]]],["p-ae16382f.system",[[0,"verdocs-quick-functions",{"endpoint":[16]}]]],["p-f4a3d054.system",[[0,"verdocs-radio-button",{"checked":[4],"name":[1],"value":[1],"disabled":[4]}]]],["p-8e4e1679.system",[[0,"verdocs-search-box",{"endpoint":[16],"placeholder":[1],"type":[1],"query":[1],"grabsFocus":[4,"grabs-focus"],"focusField":[64]}]]],["p-c0591548.system",[[0,"verdocs-search-tabs",{"selected":[32]}]]],["p-33edf6a4.system",[[0,"verdocs-table",{"columns":[16],"data":[16]}]]],["p-7c6f814c.system",[[0,"verdocs-template-card",{"template":[16]}]]],["p-56c75804.system",[[0,"verdocs-template-tags",{"tags":[16]}]]],["p-c639c1aa.system",[[0,"verdocs-toggle",{"options":[16],"theme":[1],"selectedOption":[32]}]]],["p-a4320fdc.system",[[0,"verdocs-toggle-button",{"active":[4],"icon":[1],"label":[1],"size":[1],"_active":[32]}]]],["p-0cbb6332.system",[[0,"verdocs-status-indicator",{"size":[1],"theme":[1],"status":[1],"envelope":[16],"isOpen":[32],"containerId":[32]}]]],["p-ebf5f173.system",[[0,"verdocs-template-star",{"endpoint":[16],"template":[1040],"updating":[32]}]]],["p-50c4a3da.system",[[0,"verdocs-text-input",{"value":[1537],"label":[1],"placeholder":[1],"autocomplete":[1],"helpText":[1,"help-text"],"clearable":[4],"copyable":[4],"type":[1],"disabled":[4],"required":[4],"showingPw":[32]}],[0,"verdocs-help-icon",{"text":[1],"icon":[1],"containerId":[32]}],[0,"verdocs-button",{"label":[1],"startIcon":[1,"start-icon"],"endIcon":[1,"end-icon"],"size":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["p-c16b24c0.system",[[0,"verdocs-envelope-update-recipient",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"roleName":[1,"role-name"],"isOpen":[32],"gettingLink":[32],"link":[32],"loading":[32],"envelope":[32],"originalRecipient":[32],"updatedRecipient":[32]}],[0,"verdocs-envelope-recipient-link",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"roleName":[1,"role-name"],"isOpen":[32],"gettingLink":[32],"link":[32],"loading":[32],"envelope":[32],"recipient":[32]}]]],["p-69c97fa9.system",[[0,"verdocs-contact-picker",{"endpoint":[16],"templateRole":[16,"template-role"],"contactSuggestions":[16,"contact-suggestions"],"first_name":[32],"last_name":[32],"email":[32],"phone":[32],"zip":[32],"address":[32],"message":[32],"showSuggestions":[32],"showMessage":[32],"delegator":[32],"auth_methods":[32],"passcode":[32],"firstNameFieldId":[32],"lastNameFieldId":[32],"emailFieldId":[32],"phoneFieldId":[32],"featureFlags":[32],"activeEntitlements":[32]}]]],["p-68b0e020.system",[[0,"verdocs-envelope-document-page",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"documentId":[1,"document-id"],"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[1026,"virtual-height"],"layers":[16],"type":[1],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"naturalWidth":[32],"naturalHeight":[32],"aspectRatio":[32],"skipFirstNotification":[32],"pageDisplayUri":[32]}]]],["p-5a4af164.system",[[0,"verdocs-switch",{"checked":[1028],"theme":[1],"disabled":[4]}]]],["p-1c66bd2c.system",[[0,"verdocs-template-field-properties",{"endpoint":[16],"templateId":[1,"template-id"],"fieldName":[1025,"field-name"],"helpText":[1,"help-text"],"dirty":[32],"label":[32],"type":[32],"name":[32],"required":[32],"roleName":[32],"group":[32],"fieldType":[32],"options":[32],"placeholder":[32],"defaultValue":[32],"showingHelp":[32],"loading":[32],"template":[32]}],[0,"verdocs-select-input",{"value":[1],"label":[1],"options":[16],"disabled":[4]}],[0,"verdocs-checkbox",{"checked":[4],"name":[1],"label":[1],"value":[1],"theme":[1],"size":[1],"disabled":[4]}],[0,"verdocs-component-error",{"message":[1]}],[0,"verdocs-loader"]]],["p-a224a4cc.system",[[0,"verdocs-view",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"headerTargetId":[1,"header-target-id"],"canceling":[32],"showCancelDone":[32],"showLoadError":[32],"loading":[32],"envelope":[32]}],[0,"verdocs-kba-dialog",{"step":[2],"steps":[2],"helptitle":[1],"helptext":[1],"mode":[1],"label":[1],"placeholder":[1],"recipient":[16],"choices":[16],"agreed":[32],"response":[32],"updatedRecipient":[32],"dobContainerId":[32]}],[0,"verdocs-otp-dialog",{"endpoint":[1040],"method":[1],"recipient":[16],"resendDisabled":[32],"response":[32]}]]],["p-65a5d2d4.system",[[0,"verdocs-template-role-properties",{"endpoint":[16],"templateId":[1,"template-id"],"roleName":[1,"role-name"],"dirty":[32],"saving":[32],"name":[32],"type":[32],"first_name":[32],"last_name":[32],"email":[32],"phone":[32],"delegator":[32],"loading":[32],"template":[32]}],[4,"verdocs-menu-panel",{"side":[1],"overlay":[4],"width":[2]},[[4,"click","handleClick"]]]]],["p-6fbe86fa.system",[[4,"verdocs-button-panel",{"icon":[1],"showPanel":[64],"hidePanel":[64],"toggle":[64]}],[4,"verdocs-tabs",{"tabs":[16],"selectedTab":[2,"selected-tab"]}]]],["p-9f2bde83.system",[[0,"verdocs-pagination",{"selectedPage":[1538,"selected-page"],"itemCount":[2,"item-count"],"perPage":[2,"per-page"]}],[0,"verdocs-quick-filter",{"options":[16],"label":[1],"value":[1537],"placeholder":[1],"open":[32]}]]],["p-9766843a.system",[[0,"verdocs-file-chooser",{"endpoint":[16],"file":[32]}],[0,"verdocs-progress-bar",{"label":[1],"showPercent":[4,"show-percent"],"percent":[2]}]]],["p-289ad8d2.system",[[0,"verdocs-organization-card",{"organization":[16],"hovered":[32]},[[1,"mouseover","onMouseOver"],[1,"mouseout","onMouseOut"]]],[4,"verdocs-portal",{"anchor":[1],"voffset":[2]},[[11,"scroll","handleScroll"],[9,"resize","handleResize"],[4,"click","handleClick"]]]]],["p-a37e8f84.system",[[0,"verdocs-toolbar-icon",{"text":[1],"icon":[1],"placement":[1],"containerId":[32]}],[0,"verdocs-template-document-page",{"endpoint":[16],"editable":[4],"disabled":[4],"done":[4],"templateId":[1,"template-id"],"documentId":[1,"document-id"],"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[1026,"virtual-height"],"layers":[16],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"naturalWidth":[32],"naturalHeight":[32],"aspectRatio":[32],"skipFirstNotification":[32],"pageDisplayUri":[32],"xScale":[32],"yScale":[32],"loading":[32],"template":[32]}]]],["p-e579e74c.system",[[0,"verdocs-dropdown",{"options":[16],"containerId":[32],"showPicker":[32]}]]],["p-805c4396.system",[[0,"verdocs-spinner",{"size":[2],"mode":[1]}]]],["p-191dacad.system",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"buttonLabel":[1,"button-label"],"showCancel":[4,"show-cancel"],"closed":[32]}]]],["p-0134d663.system",[[0,"verdocs-field-attachment",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"dialogOpen":[32],"selectedFile":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-initial",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"initials":[513],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"tempInitials":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-signature",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"name":[513],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"tempSignature":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-checkbox",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-date",{"source":[513],"sourceid":[513],"fieldname":[513],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"field":[16],"containerId":[32],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-dropdown",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-radio",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"required":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-textarea",{"endpoint":[16],"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-textbox",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"multiline":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-timestamp",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[2],"showingProperties":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-initial-dialog",{"initials":[1],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}],[0,"verdocs-signature-dialog",{"name":[1],"fontLoaded":[32],"enteredName":[32],"mode":[32]}],[0,"verdocs-upload-dialog",{"maxSize":[1026,"max-size"],"existingFile":[1032,"existing-file"],"draggingOver":[32],"confirmDelete":[32],"selectedFiles":[32],"errorMessage":[32]}]]],["p-4175122c.system",[[0,"verdocs-template-fields",{"endpoint":[16],"templateId":[1537,"template-id"],"toolbarTargetId":[1,"toolbar-target-id"],"placing":[32],"showMustSelectRole":[32],"selectedRoleName":[32],"loading":[32],"template":[32]},[[4,"keydown","handleKeyDown"]],{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-preview",{"endpoint":[16],"templateId":[1,"template-id"],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-template-roles",{"endpoint":[16],"templateId":[1,"template-id"],"showingRoleDialog":[32],"sender":[32],"dragging":[32],"loading":[32],"template":[32]}],[0,"verdocs-send",{"endpoint":[16],"templateId":[513,"template-id"],"environment":[1],"containerId":[32],"showPickerForId":[32],"sessionContacts":[32],"sending":[32],"rolesCompleted":[32],"loading":[32],"template":[32],"reset":[64]},null,{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-template-settings",{"endpoint":[16],"templateId":[1,"template-id"],"name":[32],"visibility":[32],"sender":[32],"sendReminders":[32],"initialReminder":[32],"followupReminders":[32],"dirty":[32],"loading":[32],"template":[32]}],[0,"verdocs-template-attachments",{"endpoint":[16],"templateId":[1,"template-id"],"uploading":[32],"progressLabel":[32],"progressPercent":[32],"showDeleteError":[32],"confirmDeleteDocument":[32],"loading":[32],"template":[32]}],[0,"verdocs-template-build-tabs",{"endpoint":[16],"templateId":[1537,"template-id"],"step":[1537],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"],"step":["onStepChanged"]}]]]]'),t)]}}))}))}))}}}));
+var __awaiter=this&&this.__awaiter||function(e,t,a,i){function n(e){return e instanceof a?e:new a((function(t){t(e)}))}return new(a||(a=Promise))((function(a,s){function o(e){try{l(i.next(e))}catch(e){s(e)}}function d(e){try{l(i["throw"](e))}catch(e){s(e)}}function l(e){e.done?a(e.value):n(e.value).then(o,d)}l((i=i.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var a={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},i,n,s,o;return o={next:d(0),throw:d(1),return:d(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function d(e){return function(t){return l([e,t])}}function l(d){if(i)throw new TypeError("Generator is already executing.");while(o&&(o=0,d[0]&&(a=0)),a)try{if(i=1,n&&(s=d[0]&2?n["return"]:d[0]?n["throw"]||((s=n["return"])&&s.call(n),0):n.next)&&!(s=s.call(n,d[1])).done)return s;if(n=0,s)d=[d[0]&2,s.value];switch(d[0]){case 0:case 1:s=d;break;case 4:a.label++;return{value:d[1],done:false};case 5:a.label++;n=d[1];d=[0];continue;case 7:d=a.ops.pop();a.trys.pop();continue;default:if(!(s=a.trys,s=s.length>0&&s[s.length-1])&&(d[0]===6||d[0]===2)){a=0;continue}if(d[0]===3&&(!s||d[1]>s[0]&&d[1]<s[3])){a.label=d[1];break}if(d[0]===6&&a.label<s[1]){a.label=s[1];s=d;break}if(s&&a.label<s[2]){a.label=s[2];a.ops.push(d);break}if(s[2])a.ops.pop();a.trys.pop();continue}d=t.call(e,a)}catch(e){d=[6,e];n=0}finally{i=s=0}if(d[0]&5)throw d[1];return{value:d[0]?d[1]:void 0,done:true}}};System.register(["./p-gAi_FRvp.system.js","./p-BbPAtVJG.system.js"],(function(e,t){"use strict";var a,i,n;return{setters:[function(t){a=t.p;i=t.b;e("setNonce",t.s)},function(e){n=e.g}],execute:function(){var e=this;var s=function(){var e=t.meta.url;var i={};if(e!==""){i.resourcesUrl=new URL(".",e).href}return a(i)};s().then((function(t){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,n()];case 1:e.sent();return[2,i(JSON.parse('[["p-e63c903a.system",[[0,"verdocs-build",{"endpoint":[16],"templateId":[1537,"template-id"],"step":[1537],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"],"step":["onStepChanged"]}]]],["p-33691e24.system",[[0,"verdocs-sign",{"endpoint":[1040],"envelopeId":[513,"envelope-id"],"roleId":[513,"role-id"],"inviteCode":[513,"invite-code"],"headerTargetId":[1,"header-target-id"],"recipient":[32],"hasSignature":[32],"nextButtonLabel":[32],"nextSubmits":[32],"fatalErrorHeader":[32],"fatalErrorMessage":[32],"focusedField":[32],"disclosure":[32],"submitting":[32],"submitted":[32],"isDone":[32],"showDone":[32],"showLoadError":[32],"finishLater":[32],"showFinishLater":[32],"agreed":[32],"documentsSingularPlural":[32],"authStep":[32],"authMethodStates":[32],"kbaQuestions":[32],"showSpinner":[32],"declining":[32],"delegating":[32],"delegated":[32],"kbaChoices":[32],"loading":[32],"envelope":[32]}]]],["p-c5b23884.system",[[0,"verdocs-envelopes-list",{"endpoint":[16],"view":[1537],"status":[1537],"sort":[1537],"match":[1537],"showPagination":[4,"show-pagination"],"rowsPerPage":[2,"rows-per-page"],"selectedPage":[2,"selected-page"],"count":[32],"initiallyLoaded":[32],"loading":[32],"selectedEnvelopes":[32],"envelopes":[32]},null,{"view":["handleViewUpdated"],"status":["handleStatusUpdated"],"sort":["handleSortUpdated"],"match":["handleMatchUpdated"],"selectedPage":["handlePageUpdated"]}]]],["p-204afc1e.system",[[0,"verdocs-templates-list",{"endpoint":[16],"visibility":[1537],"starred":[1537],"sort":[1537],"name":[1537],"allowedActions":[1040,"allowed-actions"],"showPagination":[4,"show-pagination"],"rowsPerPage":[2,"rows-per-page"],"selectedPage":[2,"selected-page"],"count":[32],"initiallyLoaded":[32],"loading":[32],"confirmDelete":[32],"templates":[32],"localNameFilter":[32]},null,{"sharing":["handleSharingUpdated"],"starred":["handleStarredUpdated"],"sort":["handleSortUpdated"],"name":["handleNameUpdated"],"selectedPage":["handlePageUpdated"]}]]],["p-76aed8e2.system",[[0,"verdocs-envelope-sidebar",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"activeTab":[32],"panelOpen":[32],"showRecipientDialog":[32],"showCancelDialog":[32],"showReinviteDialog":[32],"showUpdateDialog":[32],"remindersEnabled":[32],"updatingReminders":[32],"initialReminder":[32],"followupReminders":[32],"loading":[32],"envelope":[32]}]]],["p-8c98a765.system",[[0,"verdocs-field-payment",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16,"pdf-pages"],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"signed":[4],"roleindex":[2],"showingProperties":[32],"focused":[32],"preparedMessage":[32],"signatureUrl":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}]]],["p-d5469309.system",[[0,"verdocs-template-create",{"endpoint":[16],"maxSize":[1026,"max-size"],"file":[32],"creating":[32],"progressLabel":[32],"progressPercent":[32],"errorMessage":[32]}]]],["p-51b0c10c.system",[[0,"verdocs-auth",{"endpoint":[16],"visible":[4],"logo":[1],"displayMode":[1025,"display-mode"],"org_name":[32],"first_name":[32],"last_name":[32],"email":[32],"verificationCode":[32],"newPassword":[32],"password":[32],"confirmpass":[32],"submitting":[32],"resendDisabled":[32],"session":[32],"profile":[32]}]]],["p-7f085b76.system",[[0,"verdocs-date-input",{"value":[1537],"label":[1],"placeholder":[1],"helpText":[1,"help-text"],"disabled":[4],"required":[4],"showingPw":[32],"focused":[32],"containerId":[32],"focusField":[64]}]]],["p-ac05c34d.system",[[0,"verdocs-envelope-recipient-summary",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"canSendAnother":[4,"can-send-another"],"canView":[4,"can-view"],"canDone":[4,"can-done"],"isOpen":[32],"recipientStatusIcons":[32],"containerId":[32],"gettingLinks":[32],"links":[32],"loading":[32],"envelope":[32]}]]],["p-cd60348a.system",[[0,"verdocs-multiselect",{"label":[1],"placeholder":[1],"options":[16],"selectedOptions":[16,"selected-options"],"showPicker":[32]}]]],["p-4e28a33a.system",[[4,"verdocs-dialog"]]],["p-fe22a117.system",[[0,"verdocs-quick-functions",{"endpoint":[16]}]]],["p-ed194be6.system",[[0,"verdocs-radio-button",{"checked":[4],"name":[1],"value":[1],"disabled":[4]}]]],["p-3ab1625e.system",[[0,"verdocs-search-box",{"endpoint":[16],"placeholder":[1],"type":[1],"query":[1],"grabsFocus":[4,"grabs-focus"],"focusField":[64]}]]],["p-6845c12e.system",[[0,"verdocs-search-tabs",{"selected":[32]}]]],["p-6f6a0c7a.system",[[0,"verdocs-table",{"columns":[16],"data":[16]}]]],["p-963208c6.system",[[0,"verdocs-template-card",{"template":[16]}]]],["p-d2a4aedb.system",[[0,"verdocs-template-tags",{"tags":[16]}]]],["p-596326ba.system",[[0,"verdocs-toggle",{"options":[16],"theme":[1],"selectedOption":[32]}]]],["p-dbb8413d.system",[[0,"verdocs-toggle-button",{"active":[4],"icon":[1],"label":[1],"size":[1],"_active":[32]}]]],["p-3a0cc47f.system",[[0,"verdocs-status-indicator",{"size":[1],"theme":[1],"status":[1],"envelope":[16],"isOpen":[32],"containerId":[32]}]]],["p-352ab9b7.system",[[0,"verdocs-template-star",{"endpoint":[16],"template":[1040],"updating":[32]}]]],["p-ce2336aa.system",[[0,"verdocs-text-input",{"value":[1537],"label":[1],"placeholder":[1],"autocomplete":[1],"helpText":[1,"help-text"],"clearable":[4],"copyable":[4],"type":[1],"disabled":[4],"required":[4],"showingPw":[32]}],[0,"verdocs-help-icon",{"text":[1],"icon":[1],"containerId":[32]}],[0,"verdocs-button",{"label":[1],"startIcon":[1,"start-icon"],"endIcon":[1,"end-icon"],"size":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["p-c16b24c0.system",[[0,"verdocs-envelope-update-recipient",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"roleName":[1,"role-name"],"isOpen":[32],"gettingLink":[32],"link":[32],"loading":[32],"envelope":[32],"originalRecipient":[32],"updatedRecipient":[32]}],[0,"verdocs-envelope-recipient-link",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"roleName":[1,"role-name"],"isOpen":[32],"gettingLink":[32],"link":[32],"loading":[32],"envelope":[32],"recipient":[32]}]]],["p-72e9198d.system",[[0,"verdocs-contact-picker",{"endpoint":[16],"templateRole":[16,"template-role"],"contactSuggestions":[16,"contact-suggestions"],"first_name":[32],"last_name":[32],"email":[32],"phone":[32],"zip":[32],"address":[32],"message":[32],"showSuggestions":[32],"showMessage":[32],"delegator":[32],"auth_methods":[32],"passcode":[32],"firstNameFieldId":[32],"lastNameFieldId":[32],"emailFieldId":[32],"phoneFieldId":[32],"featureFlags":[32],"activeEntitlements":[32]}]]],["p-931bf9ec.system",[[0,"verdocs-envelope-document-page",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"documentId":[1,"document-id"],"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[1026,"virtual-height"],"layers":[16],"type":[1],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"naturalWidth":[32],"naturalHeight":[32],"aspectRatio":[32],"skipFirstNotification":[32],"pageDisplayUri":[32]}]]],["p-a279bb92.system",[[0,"verdocs-switch",{"checked":[1028],"theme":[1],"disabled":[4]}]]],["p-e8c146fc.system",[[0,"verdocs-template-field-properties",{"endpoint":[16],"templateId":[1,"template-id"],"fieldName":[1025,"field-name"],"helpText":[1,"help-text"],"dirty":[32],"label":[32],"type":[32],"name":[32],"required":[32],"roleName":[32],"group":[32],"fieldType":[32],"options":[32],"placeholder":[32],"defaultValue":[32],"showingHelp":[32],"loading":[32],"template":[32]}],[0,"verdocs-select-input",{"value":[1],"label":[1],"options":[16],"disabled":[4]}],[0,"verdocs-checkbox",{"checked":[4],"name":[1],"label":[1],"value":[1],"theme":[1],"size":[1],"disabled":[4]}],[0,"verdocs-component-error",{"message":[1]}],[0,"verdocs-loader"]]],["p-33ce9472.system",[[0,"verdocs-view",{"endpoint":[16],"envelopeId":[1,"envelope-id"],"headerTargetId":[1,"header-target-id"],"canceling":[32],"showCancelDone":[32],"showLoadError":[32],"loading":[32],"envelope":[32]}],[0,"verdocs-kba-dialog",{"step":[2],"steps":[2],"helptitle":[1],"helptext":[1],"mode":[1],"label":[1],"placeholder":[1],"recipient":[16],"choices":[16],"agreed":[32],"response":[32],"updatedRecipient":[32],"dobContainerId":[32]}],[0,"verdocs-delegate-dialog",{"endpoint":[1040],"envelope":[16],"first_name":[32],"last_name":[32],"email":[32],"phone":[32],"message":[32]}],[0,"verdocs-otp-dialog",{"endpoint":[1040],"method":[1],"recipient":[16],"resendDisabled":[32],"response":[32]}]]],["p-76a86430.system",[[0,"verdocs-template-role-properties",{"endpoint":[16],"templateId":[1,"template-id"],"roleName":[1,"role-name"],"dirty":[32],"saving":[32],"name":[32],"type":[32],"first_name":[32],"last_name":[32],"email":[32],"phone":[32],"delegator":[32],"loading":[32],"template":[32]}],[4,"verdocs-menu-panel",{"side":[1],"overlay":[4],"width":[2]},[[4,"click","handleClick"]]]]],["p-4c5bb9d1.system",[[4,"verdocs-button-panel",{"icon":[1],"showPanel":[64],"hidePanel":[64],"toggle":[64]}],[4,"verdocs-tabs",{"tabs":[16],"selectedTab":[2,"selected-tab"]}]]],["p-6a5c1de9.system",[[0,"verdocs-pagination",{"selectedPage":[1538,"selected-page"],"itemCount":[2,"item-count"],"perPage":[2,"per-page"]}],[0,"verdocs-quick-filter",{"options":[16],"label":[1],"value":[1537],"placeholder":[1],"open":[32]}]]],["p-72c996d0.system",[[0,"verdocs-file-chooser",{"endpoint":[16],"file":[32]}],[0,"verdocs-progress-bar",{"label":[1],"showPercent":[4,"show-percent"],"percent":[2]}]]],["p-efc459f7.system",[[0,"verdocs-organization-card",{"organization":[16],"hovered":[32]},[[1,"mouseover","onMouseOver"],[1,"mouseout","onMouseOut"]]],[4,"verdocs-portal",{"anchor":[1],"voffset":[2]},[[11,"scroll","handleScroll"],[9,"resize","handleResize"],[4,"click","handleClick"]]]]],["p-be6db7c0.system",[[0,"verdocs-toolbar-icon",{"text":[1],"icon":[1],"placement":[1],"containerId":[32]}],[0,"verdocs-template-document-page",{"endpoint":[16],"editable":[4],"disabled":[4],"done":[4],"templateId":[1,"template-id"],"documentId":[1,"document-id"],"pageNumber":[2,"page-number"],"virtualWidth":[2,"virtual-width"],"virtualHeight":[1026,"virtual-height"],"layers":[16],"containerId":[32],"renderedWidth":[32],"renderedHeight":[32],"naturalWidth":[32],"naturalHeight":[32],"aspectRatio":[32],"skipFirstNotification":[32],"pageDisplayUri":[32],"xScale":[32],"yScale":[32],"loading":[32],"template":[32]}]]],["p-767c93e8.system",[[0,"verdocs-dropdown",{"options":[16],"containerId":[32],"showPicker":[32]}]]],["p-c48624a8.system",[[0,"verdocs-spinner",{"size":[2],"mode":[1]}]]],["p-2514da1e.system",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"buttonLabel":[1,"button-label"],"showCancel":[4,"show-cancel"],"closed":[32]}]]],["p-bee95303.system",[[0,"verdocs-field-attachment",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"dialogOpen":[32],"selectedFile":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-initial",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"initials":[513],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"tempInitials":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-signature",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"name":[513],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"tempSignature":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-checkbox",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-date",{"source":[513],"sourceid":[513],"fieldname":[513],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"field":[16],"containerId":[32],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-dropdown",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-radio",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"required":[516],"done":[516],"editable":[516],"moveable":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-textarea",{"endpoint":[16],"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-textbox",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"multiline":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[514],"showingProperties":[32],"focused":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-field-timestamp",{"source":[513],"sourceid":[513],"fieldname":[513],"field":[16],"disabled":[516],"editable":[516],"moveable":[516],"done":[516],"xscale":[514],"yscale":[514],"pagenumber":[2],"showingProperties":[32],"focusField":[64],"showSettingsPanel":[64],"hideSettingsPanel":[64]}],[0,"verdocs-initial-dialog",{"initials":[1],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}],[0,"verdocs-signature-dialog",{"name":[1],"fontLoaded":[32],"enteredName":[32],"mode":[32]}],[0,"verdocs-upload-dialog",{"maxSize":[1026,"max-size"],"existingFile":[1032,"existing-file"],"draggingOver":[32],"confirmDelete":[32],"selectedFiles":[32],"errorMessage":[32]}]]],["p-4175122c.system",[[0,"verdocs-template-fields",{"endpoint":[16],"templateId":[1537,"template-id"],"toolbarTargetId":[1,"toolbar-target-id"],"placing":[32],"showMustSelectRole":[32],"selectedRoleName":[32],"loading":[32],"template":[32]},[[4,"keydown","handleKeyDown"]],{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-preview",{"endpoint":[16],"templateId":[1,"template-id"],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-template-roles",{"endpoint":[16],"templateId":[1,"template-id"],"showingRoleDialog":[32],"sender":[32],"dragging":[32],"loading":[32],"template":[32]}],[0,"verdocs-send",{"endpoint":[16],"templateId":[513,"template-id"],"environment":[1],"containerId":[32],"showPickerForId":[32],"sessionContacts":[32],"sending":[32],"rolesCompleted":[32],"loading":[32],"template":[32],"reset":[64]},null,{"templateId":["onTemplateIdChanged"]}],[0,"verdocs-template-settings",{"endpoint":[16],"templateId":[1,"template-id"],"name":[32],"visibility":[32],"sender":[32],"sendReminders":[32],"initialReminder":[32],"followupReminders":[32],"dirty":[32],"loading":[32],"template":[32]}],[0,"verdocs-template-attachments",{"endpoint":[16],"templateId":[1,"template-id"],"uploading":[32],"progressLabel":[32],"progressPercent":[32],"showDeleteError":[32],"confirmDeleteDocument":[32],"loading":[32],"template":[32]}],[0,"verdocs-template-build-tabs",{"endpoint":[16],"templateId":[1537,"template-id"],"step":[1537],"loading":[32],"template":[32]},null,{"templateId":["onTemplateIdChanged"],"step":["onStepChanged"]}]]]]'),t)]}}))}))}))}}}));
 //# sourceMappingURL=p-CwXSduhy.system.js.map

package/dist/verdocs-web-sdk/{p-DtqpEcJn.system.js.map → p-CxebBOfo.system.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"p-~~DtqpEcJn~~.system.js","sources":["src/components/controls/verdocs-toggle/verdocs-toggle.scss?tag=verdocs-toggle","src/components/controls/verdocs-toggle/verdocs-toggle.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle {\n font-family: $primary-font;\n\n .container {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n background-color: $container-bg;\n }\n\n .label {\n font-size: 24px;\n font-weight: 700;\n color: $medium-bg;\n align-self: center;\n margin-right: 27px;\n font-family: sans-serif;\n }\n\n .buttons {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n }\n\n .buttons button {\n width: 60px;\n height: 60px;\n border: 2px solid $item-border-color;\n border-radius: 5px;\n cursor: pointer;\n }\n\n .buttons button:not(:last-child) {\n margin-right: 11px;\n }\n\n .buttons svg {\n width: 30px;\n height: 30px;\n }\n\n .buttons button:hover {\n background-color: $item-border-color;\n transition: 0.25s;\n }\n\n .buttons button:hover svg {\n fill: $container-bg;\n transition: 0.25s;\n }\n\n .selected {\n background-color: $border-color;\n transition: 0.25s;\n }\n\n .selected svg {\n fill: #ffffff;\n transition: 0.25s;\n }\n}\n","import {Component, Prop, h, State} from '@stencil/core';\n\nexport interface IButtons {\n id: string;\n icon: string;\n}\n\nexport interface IToggleIconButtons {\n label: string;\n defaultSelection: number;\n buttons: IButtons[];\n}\n\n/*\n Displays a label and a set of buttons, also allowing a default selection of a button.\n \n ```ts\n * <verdocs-toggle options={[...options]} theme=\"light\"></verdocs-toggle>\n * ```\n /\n@Component({\n tag: 'verdocs-toggle',\n styleUrl: 'verdocs-toggle.scss',\n})\nexport class VerdocsToggle {\n /\n The tags to display\n /\n @Prop() options: IToggleIconButtons;\n\n /\n The \"theme\" to be used\n */\n @Prop() theme: 'light' \| 'dark';\n\n @State() selectedOption: number = 0;\n\n componentWillLoad() {\n this.selectedOption = this.options?.defaultSelection \|\| 0;\n }\n\n render() {\n return (\n <div class=\"container\">\n <span class=\"label\">{`${this.options.label}:`}</span>\n <div class=\"buttons\">\n {this.options.buttons.map((button: IButtons, index: number) => (\n <button\n id={button.id}\n key={button.id}\n innerHTML={button.icon}\n class={index === this.selectedOption ? 'selected' : ''}\n onClick={() => {\n console.log('clicked', index);\n this.selectedOption = index;\n }}\n />\n ))}\n </div>\n </div>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,05CAA05C;;YCwBt6C,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAeW,QAAA,IAAc,CAAA,cAAA,GAAW,CAAC;MA2BpC;UAzBC,iBAAiB,GAAA;;MACf,QAAA,IAAI,CAAC,cAAc,GAAG,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,gBAAgB,KAAI,CAAC;;UAG3D,MAAM,GAAA;cACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,CAAG,EAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAA,CAAA,CAAG,CAAQ,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAgB,EAAE,KAAa,MACxD,CAAA,CAAA,QAAA,EAAA,EACE,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,EAAE,EACtD,OAAO,EAAE,MAAK;MACZ,gBAAA,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC;MAC7B,gBAAA,IAAI,CAAC,cAAc,GAAG,KAAK;MAC7B,aAAC,GACD,CACH,CAAC,CACE,CACF;;;;;;;;;;;"}
1	+ {"version":3,"file":"p-CxebBOfo.system.js","sources":["src/components/controls/verdocs-toggle/verdocs-toggle.scss?tag=verdocs-toggle","src/components/controls/verdocs-toggle/verdocs-toggle.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle {\n font-family: $primary-font;\n\n .container {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n background-color: $container-bg;\n }\n\n .label {\n font-size: 24px;\n font-weight: 700;\n color: $medium-bg;\n align-self: center;\n margin-right: 27px;\n font-family: sans-serif;\n }\n\n .buttons {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n }\n\n .buttons button {\n width: 60px;\n height: 60px;\n border: 2px solid $item-border-color;\n border-radius: 5px;\n cursor: pointer;\n }\n\n .buttons button:not(:last-child) {\n margin-right: 11px;\n }\n\n .buttons svg {\n width: 30px;\n height: 30px;\n }\n\n .buttons button:hover {\n background-color: $item-border-color;\n transition: 0.25s;\n }\n\n .buttons button:hover svg {\n fill: $container-bg;\n transition: 0.25s;\n }\n\n .selected {\n background-color: $border-color;\n transition: 0.25s;\n }\n\n .selected svg {\n fill: #ffffff;\n transition: 0.25s;\n }\n}\n","import {Component, Prop, h, State} from '@stencil/core';\n\nexport interface IButtons {\n id: string;\n icon: string;\n}\n\nexport interface IToggleIconButtons {\n label: string;\n defaultSelection: number;\n buttons: IButtons[];\n}\n\n/*\n Displays a label and a set of buttons, also allowing a default selection of a button.\n \n ```ts\n * <verdocs-toggle options={[...options]} theme=\"light\"></verdocs-toggle>\n * ```\n /\n@Component({\n tag: 'verdocs-toggle',\n styleUrl: 'verdocs-toggle.scss',\n})\nexport class VerdocsToggle {\n /\n The tags to display\n /\n @Prop() options: IToggleIconButtons;\n\n /\n The \"theme\" to be used\n */\n @Prop() theme: 'light' \| 'dark';\n\n @State() selectedOption: number = 0;\n\n componentWillLoad() {\n this.selectedOption = this.options?.defaultSelection \|\| 0;\n }\n\n render() {\n return (\n <div class=\"container\">\n <span class=\"label\">{`${this.options.label}:`}</span>\n <div class=\"buttons\">\n {this.options.buttons.map((button: IButtons, index: number) => (\n <button\n id={button.id}\n key={button.id}\n innerHTML={button.icon}\n class={index === this.selectedOption ? 'selected' : ''}\n onClick={() => {\n console.log('clicked', index);\n this.selectedOption = index;\n }}\n />\n ))}\n </div>\n </div>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;MAAA,MAAM,gBAAgB,GAAG,05CAA05C;;YCwBt6C,aAAa,6BAAA,MAAA;MAJ1B,IAAA,WAAA,CAAA,OAAA,EAAA;;MAeW,QAAA,IAAc,CAAA,cAAA,GAAW,CAAC;MA2BpC;UAzBC,iBAAiB,GAAA;;MACf,QAAA,IAAI,CAAC,cAAc,GAAG,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,gBAAgB,KAAI,CAAC;;UAG3D,MAAM,GAAA;cACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,CAAG,EAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAA,CAAA,CAAG,CAAQ,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EACjB,EAAA,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAgB,EAAE,KAAa,MACxD,CAAA,CAAA,QAAA,EAAA,EACE,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,EAAE,EACtD,OAAO,EAAE,MAAK;MACZ,gBAAA,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC;MAC7B,gBAAA,IAAI,CAAC,cAAc,GAAG,KAAK;MAC7B,aAAC,GACD,CACH,CAAC,CACE,CACF;;;;;;;;;;;"}