legalesign-document-viewer 0.6.2 → 0.6.4
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.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ls-compose-manager.cjs.entry.js +2 -2
- package/dist/cjs/{ls-document-options_46.cjs.entry.js → ls-document-options_45.cjs.entry.js} +106 -146
- package/dist/cjs/ls-document-viewer.cjs.js +1 -1
- package/dist/cjs/ls-field-properties-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/ls-formfield.cjs.entry.js +2 -2
- package/dist/cjs/ls-number-input_5.cjs.entry.js +6 -6
- package/dist/cjs/ls-title-input.cjs.entry.js +49 -0
- package/dist/collection/components/ls-compose-manager/ls-compose-manager.js +2 -2
- package/dist/collection/components/ls-document-viewer/editorUtils.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +20 -2
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js.map +1 -1
- package/dist/collection/components/ls-editor-table/ls-editor-table.js +1 -1
- package/dist/collection/components/ls-feature-column/ls-feature-column.js +6 -6
- package/dist/collection/components/ls-field-alignment/ls-field-alignment.js +2 -2
- package/dist/collection/components/ls-field-content/ls-field-content.js +2 -2
- package/dist/collection/components/ls-field-dimensions/ls-field-dimensions.js +3 -3
- package/dist/collection/components/ls-field-distribute/ls-field-distribute.js +5 -5
- package/dist/collection/components/ls-field-footer/ls-field-footer.js +1 -1
- package/dist/collection/components/ls-field-format/ls-field-format.js +11 -11
- package/dist/collection/components/ls-field-placement/ls-field-placement.js +1 -1
- package/dist/collection/components/ls-field-properties/ls-field-properties.js +1 -1
- package/dist/collection/components/ls-field-properties-advanced/ls-field-properties-advanced.js +2 -2
- package/dist/collection/components/ls-field-properties-autosign/ls-field-properties-autosign.js +1 -1
- package/dist/collection/components/ls-field-properties-container/ls-field-properties-container.js +1 -1
- package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js +1 -1
- package/dist/collection/components/ls-field-properties-dropdown/ls-field-properties-dropdown.js +1 -1
- package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js +1 -1
- package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js +1 -1
- package/dist/collection/components/ls-field-properties-general/ls-field-properties-general.js +1 -1
- package/dist/collection/components/ls-field-properties-image/ls-field-properties-image.js +1 -1
- package/dist/collection/components/ls-field-properties-multiple/ls-field-properties-multiple.js +3 -3
- package/dist/collection/components/ls-field-properties-number/ls-field-properties-number.js +1 -1
- package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js +1 -1
- package/dist/collection/components/ls-field-properties-text/ls-field-properties-text.js +1 -1
- package/dist/collection/components/ls-field-size/ls-field-size.js +1 -1
- package/dist/collection/components/ls-field-type-display/ls-field-type-display.js +3 -3
- package/dist/collection/components/ls-formfield/inputs/ls-number-input/ls-number-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-select-input/ls-select-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-text-input/ls-text-input.js +2 -2
- package/dist/collection/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.js +1 -1
- package/dist/collection/components/ls-formfield/ls-formfield.js +2 -2
- package/dist/collection/components/ls-helper-bar/ls-helper-bar.js +1 -1
- package/dist/collection/components/ls-icon/ls-icon.js +1 -1
- package/dist/collection/components/ls-input-wrapper/ls-input-wrapper.js +1 -1
- package/dist/collection/components/ls-keyboard-shortcuts/ls-keyboard-shortcuts.js +1 -1
- package/dist/collection/components/ls-page-loader/ls-page-loader.js +2 -2
- package/dist/collection/components/ls-participant-card/ls-participant-card.js +8 -8
- package/dist/collection/components/ls-participant-manager/ls-participant-manager.js +2 -2
- package/dist/collection/components/ls-participant-select/ls-participant-select.js +9 -9
- package/dist/collection/components/ls-props-section/ls-props-section.js +1 -1
- package/dist/collection/components/ls-recipient-card/ls-recipient-card.js +5 -5
- package/dist/collection/components/ls-recipient-manager/ls-recipient-manager.js +1 -1
- package/dist/collection/components/ls-statusbar/ls-statusbar.js +3 -3
- package/dist/collection/components/ls-title-input/ls-title-input.js +1 -1
- package/dist/collection/components/ls-toggle/ls-toggle.js +2 -2
- package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js +3 -3
- package/dist/collection/components/ls-tooltip/ls-tooltip.js +1 -1
- package/dist/collection/components/ls-validation-manager/ls-validation-manager.js +2 -2
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js +2 -2
- package/dist/components/ls-compose-manager.js +2 -2
- package/dist/components/ls-document-options.js +1 -1
- package/dist/components/ls-document-viewer.js +88 -90
- package/dist/components/ls-document-viewer.js.map +1 -1
- package/dist/components/ls-editor-field.js +1 -1
- package/dist/components/ls-editor-table.js +1 -1
- package/dist/components/ls-feature-column.js +1 -1
- package/dist/components/ls-field-alignment.js +1 -1
- package/dist/components/ls-field-content.js +1 -1
- package/dist/components/ls-field-dimensions.js +1 -1
- package/dist/components/ls-field-distribute.js +1 -1
- package/dist/components/ls-field-footer.js +1 -1
- package/dist/components/ls-field-format.js +1 -1
- package/dist/components/ls-field-placement.js +1 -1
- package/dist/components/ls-field-properties-advanced.js +1 -1
- package/dist/components/ls-field-properties-autosign.js +1 -1
- package/dist/components/ls-field-properties-container.js +1 -1
- package/dist/components/ls-field-properties-date.js +1 -1
- package/dist/components/ls-field-properties-dropdown.js +14 -14
- package/dist/components/ls-field-properties-email.js +1 -1
- package/dist/components/ls-field-properties-file.js +1 -1
- package/dist/components/ls-field-properties-general.js +1 -1
- package/dist/components/ls-field-properties-image.js +1 -1
- package/dist/components/ls-field-properties-multiple.js +1 -1
- package/dist/components/ls-field-properties-number.js +1 -1
- package/dist/components/ls-field-properties-signature.js +1 -1
- package/dist/components/ls-field-properties-text.js +1 -1
- package/dist/components/ls-field-properties.js +1 -1
- package/dist/components/ls-field-size.js +1 -1
- package/dist/components/ls-field-type-display.js +1 -1
- package/dist/components/ls-formfield.js +8 -8
- package/dist/components/ls-helper-bar.js +1 -1
- package/dist/components/ls-icon.js +1 -1
- package/dist/components/ls-input-wrapper.js +1 -1
- package/dist/components/ls-keyboard-shortcuts.js +1 -1
- package/dist/components/ls-number-input.js +1 -1
- package/dist/components/ls-page-loader.js +1 -1
- package/dist/components/ls-participant-card.js +1 -1
- package/dist/components/ls-participant-manager.js +1 -1
- package/dist/components/ls-participant-select.js +1 -1
- package/dist/components/ls-props-section.js +1 -1
- package/dist/components/ls-radio-input.js +1 -1
- package/dist/components/ls-recipient-card.js +1 -1
- package/dist/components/ls-recipient-manager.js +1 -1
- package/dist/components/ls-select-input.js +1 -1
- package/dist/components/ls-statusbar.js +1 -1
- package/dist/components/ls-text-input.js +1 -1
- package/dist/components/ls-textarea-input.js +1 -1
- package/dist/components/ls-title-input.js +71 -1
- package/dist/components/ls-title-input.js.map +1 -1
- package/dist/components/ls-toggle.js +1 -1
- package/dist/components/ls-toolbar.js +1 -1
- package/dist/components/ls-toolbox-field.js +1 -1
- package/dist/components/ls-tooltip.js +1 -1
- package/dist/components/ls-validation-manager.js +1 -1
- package/dist/components/ls-validation-tag.js +1 -1
- package/dist/components/{p-Du60SSaA.js → p-B5cnJ7Uh.js} +4 -4
- package/dist/components/{p-Du60SSaA.js.map → p-B5cnJ7Uh.js.map} +1 -1
- package/dist/components/{p-mRzg677Y.js → p-B6kmJVw0.js} +4 -4
- package/dist/components/{p-mRzg677Y.js.map → p-B6kmJVw0.js.map} +1 -1
- package/dist/components/{p-CGQK3l8F.js → p-BDTgDxaX.js} +4 -4
- package/dist/components/{p-CGQK3l8F.js.map → p-BDTgDxaX.js.map} +1 -1
- package/dist/components/{p-BQZBAjo_.js → p-BFUdzGLI.js} +3 -3
- package/dist/components/{p-BQZBAjo_.js.map → p-BFUdzGLI.js.map} +1 -1
- package/dist/components/{p-D4sy9pOl.js → p-BFkdb2U_.js} +16 -16
- package/dist/components/{p-D4sy9pOl.js.map → p-BFkdb2U_.js.map} +1 -1
- package/dist/components/{p-DKaEsQyk.js → p-BQL_JBkw.js} +4 -4
- package/dist/components/{p-DKaEsQyk.js.map → p-BQL_JBkw.js.map} +1 -1
- package/dist/components/{p-C9CUft6J.js → p-BSpwN-xy.js} +6 -6
- package/dist/components/{p-C9CUft6J.js.map → p-BSpwN-xy.js.map} +1 -1
- package/dist/components/{p-D4LYfv_D.js → p-BWxN_Vjk.js} +16 -16
- package/dist/components/{p-D4LYfv_D.js.map → p-BWxN_Vjk.js.map} +1 -1
- package/dist/components/{p-CazTGpgq.js → p-B_JOCgcw.js} +4 -4
- package/dist/components/{p-CazTGpgq.js.map → p-B_JOCgcw.js.map} +1 -1
- package/dist/components/{p-Dyy8mvcD.js → p-BgkYJeKL.js} +16 -16
- package/dist/components/{p-Dyy8mvcD.js.map → p-BgkYJeKL.js.map} +1 -1
- package/dist/components/{p-Dz_jxFKX.js → p-Bkyhs-9F.js} +3 -3
- package/dist/components/{p-Dz_jxFKX.js.map → p-Bkyhs-9F.js.map} +1 -1
- package/dist/components/{p-BbRzNkJ-.js → p-BrNFnrQ5.js} +4 -4
- package/dist/components/{p-BbRzNkJ-.js.map → p-BrNFnrQ5.js.map} +1 -1
- package/dist/components/{p-xfxA2gr3.js → p-Bs5jafH9.js} +16 -16
- package/dist/components/{p-xfxA2gr3.js.map → p-Bs5jafH9.js.map} +1 -1
- package/dist/components/{p-DY31qJMn.js → p-C0jnLrrj.js} +29 -29
- package/dist/components/{p-DY31qJMn.js.map → p-C0jnLrrj.js.map} +1 -1
- package/dist/components/{p-BqmNrlid.js → p-C5Vb76Fm.js} +16 -16
- package/dist/components/{p-BqmNrlid.js.map → p-C5Vb76Fm.js.map} +1 -1
- package/dist/components/{p-BjENvp2j.js → p-C6pzA2Lp.js} +4 -4
- package/dist/components/{p-BjENvp2j.js.map → p-C6pzA2Lp.js.map} +1 -1
- package/dist/components/{p-BCPpSevg.js → p-CH80YX8k.js} +5 -5
- package/dist/components/{p-BCPpSevg.js.map → p-CH80YX8k.js.map} +1 -1
- package/dist/components/{p-BFlzDwrT.js → p-CHOBv8qd.js} +6 -6
- package/dist/components/{p-BFlzDwrT.js.map → p-CHOBv8qd.js.map} +1 -1
- package/dist/components/{p-jpsL_Z0S.js → p-CHZeQy3Z.js} +10 -10
- package/dist/components/{p-jpsL_Z0S.js.map → p-CHZeQy3Z.js.map} +1 -1
- package/dist/components/{p-DFIjS6r1.js → p-CJkBPERb.js} +10 -10
- package/dist/components/{p-DFIjS6r1.js.map → p-CJkBPERb.js.map} +1 -1
- package/dist/components/{p-CXXb9tnA.js → p-CKGxyjXl.js} +16 -16
- package/dist/components/{p-CXXb9tnA.js.map → p-CKGxyjXl.js.map} +1 -1
- package/dist/components/{p-CUdAWxnx.js → p-CPvKTPe5.js} +15 -15
- package/dist/components/{p-CUdAWxnx.js.map → p-CPvKTPe5.js.map} +1 -1
- package/dist/components/{p-C1FhAvg1.js → p-CQbfOsEw.js} +10 -10
- package/dist/components/{p-C1FhAvg1.js.map → p-CQbfOsEw.js.map} +1 -1
- package/dist/components/{p-DeiaBmYM.js → p-CUKHkPYp.js} +7 -7
- package/dist/components/{p-DeiaBmYM.js.map → p-CUKHkPYp.js.map} +1 -1
- package/dist/components/{p-CpViLazu.js → p-CidVEtba.js} +13 -13
- package/dist/components/{p-CpViLazu.js.map → p-CidVEtba.js.map} +1 -1
- package/dist/components/{p-CDebJ6iA.js → p-CkhPBlI9.js} +16 -16
- package/dist/components/{p-CDebJ6iA.js.map → p-CkhPBlI9.js.map} +1 -1
- package/dist/components/{p-DCiK4Zkr.js → p-CkqxItxD.js} +5 -5
- package/dist/components/{p-DCiK4Zkr.js.map → p-CkqxItxD.js.map} +1 -1
- package/dist/components/{p-aDB_kHQ9.js → p-CntMVGQM.js} +4 -4
- package/dist/components/{p-aDB_kHQ9.js.map → p-CntMVGQM.js.map} +1 -1
- package/dist/components/{p-CJSY3-Q3.js → p-CwkNbClZ.js} +3 -3
- package/dist/components/{p-CJSY3-Q3.js.map → p-CwkNbClZ.js.map} +1 -1
- package/dist/components/{p-BHkzqT6a.js → p-Czl42iXj.js} +7 -7
- package/dist/components/{p-BHkzqT6a.js.map → p-Czl42iXj.js.map} +1 -1
- package/dist/components/{p-CEB07hOR.js → p-D1Vbun-H.js} +3 -3
- package/dist/components/{p-CEB07hOR.js.map → p-D1Vbun-H.js.map} +1 -1
- package/dist/components/{p-BcS632QQ.js → p-D2OTJcln.js} +3 -3
- package/dist/components/{p-BcS632QQ.js.map → p-D2OTJcln.js.map} +1 -1
- package/dist/components/{p-y-KagAwA.js → p-D7jf6qmY.js} +8 -8
- package/dist/components/{p-y-KagAwA.js.map → p-D7jf6qmY.js.map} +1 -1
- package/dist/components/{p-BcSJFRsU.js → p-DK4_6BnD.js} +12 -12
- package/dist/components/{p-BcSJFRsU.js.map → p-DK4_6BnD.js.map} +1 -1
- package/dist/components/{p-DSUzA701.js → p-DLH6tfrF.js} +5 -5
- package/dist/components/{p-DSUzA701.js.map → p-DLH6tfrF.js.map} +1 -1
- package/dist/components/{p-DCHe6qj9.js → p-DYgxVYY_.js} +16 -16
- package/dist/components/{p-DCHe6qj9.js.map → p-DYgxVYY_.js.map} +1 -1
- package/dist/components/{p-BIPw2c6i.js → p-DZJAZNpf.js} +9 -9
- package/dist/components/{p-BIPw2c6i.js.map → p-DZJAZNpf.js.map} +1 -1
- package/dist/components/{p-T-mzC4lc.js → p-DeijuJkt.js} +7 -7
- package/dist/components/{p-T-mzC4lc.js.map → p-DeijuJkt.js.map} +1 -1
- package/dist/components/{p-Bbzg-qau.js → p-DfkXv1vI.js} +3 -3
- package/dist/components/{p-Bbzg-qau.js.map → p-DfkXv1vI.js.map} +1 -1
- package/dist/components/{p-D95fiMAP.js → p-DnyBXRV4.js} +3 -3
- package/dist/components/{p-D95fiMAP.js.map → p-DnyBXRV4.js.map} +1 -1
- package/dist/components/{p-B3DQQkl0.js → p-Drbp3Wll.js} +3 -3
- package/dist/components/{p-B3DQQkl0.js.map → p-Drbp3Wll.js.map} +1 -1
- package/dist/components/{p-B_6EV5o3.js → p-DzeltV9H.js} +7 -7
- package/dist/components/{p-B_6EV5o3.js.map → p-DzeltV9H.js.map} +1 -1
- package/dist/components/{p-DazmCUCS.js → p-QIG8yroe.js} +10 -10
- package/dist/components/{p-DazmCUCS.js.map → p-QIG8yroe.js.map} +1 -1
- package/dist/components/{p-B0UsrnF-.js → p-SKySuEfc.js} +16 -16
- package/dist/components/{p-B0UsrnF-.js.map → p-SKySuEfc.js.map} +1 -1
- package/dist/components/{p-rOYFY0lA.js → p-kug3tj7P.js} +6 -6
- package/dist/components/{p-rOYFY0lA.js.map → p-kug3tj7P.js.map} +1 -1
- package/dist/components/{p-6JLudxC8.js → p-n1WnrNQm.js} +6 -6
- package/dist/components/{p-6JLudxC8.js.map → p-n1WnrNQm.js.map} +1 -1
- package/dist/components/{p-CvSaf_ja.js → p-nmGTYrW-.js} +5 -5
- package/dist/components/{p-CvSaf_ja.js.map → p-nmGTYrW-.js.map} +1 -1
- package/dist/components/{p-CdXSq0ok.js → p-pkGFr1Z2.js} +10 -10
- package/dist/components/{p-CdXSq0ok.js.map → p-pkGFr1Z2.js.map} +1 -1
- package/dist/components/{p-D836X_cy.js → p-tbdpKil5.js} +5 -5
- package/dist/components/{p-D836X_cy.js.map → p-tbdpKil5.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ls-compose-manager.entry.js +2 -2
- package/dist/esm/{ls-document-options_46.entry.js → ls-document-options_45.entry.js} +106 -145
- package/dist/esm/ls-document-viewer.js +1 -1
- package/dist/esm/ls-field-properties-dropdown.entry.js +1 -1
- package/dist/esm/ls-formfield.entry.js +2 -2
- package/dist/esm/ls-number-input_5.entry.js +6 -6
- package/dist/{components/p-JIZHOmMy.js → esm/ls-title-input.entry.js} +10 -39
- package/dist/esm/ls-title-input.entry.js.map +1 -0
- package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
- package/dist/ls-document-viewer/{p-d223d66a.entry.js → p-00ab25ff.entry.js} +2 -2
- package/dist/ls-document-viewer/{p-1442f973.entry.js → p-131fe514.entry.js} +2 -2
- package/dist/ls-document-viewer/p-96fe16df.entry.js +2 -0
- package/dist/ls-document-viewer/p-9d295f9a.entry.js +2 -0
- package/dist/ls-document-viewer/p-9d295f9a.entry.js.map +1 -0
- package/dist/ls-document-viewer/p-ccbc4663.entry.js +2 -0
- package/dist/ls-document-viewer/{p-0ccba83b.entry.js → p-fbdef951.entry.js} +3 -3
- package/dist/ls-document-viewer/p-fbdef951.entry.js.map +1 -0
- package/dist/types/components/ls-document-viewer/ls-document-viewer.d.ts +3 -0
- package/dist/types/components.d.ts +2 -0
- package/package.json +1 -1
- package/dist/components/p-JIZHOmMy.js.map +0 -1
- package/dist/ls-document-viewer/p-0ccba83b.entry.js.map +0 -1
- package/dist/ls-document-viewer/p-31f8c44a.entry.js +0 -2
- package/dist/ls-document-viewer/p-caa89c6c.entry.js +0 -2
- /package/dist/ls-document-viewer/{p-d223d66a.entry.js.map → p-00ab25ff.entry.js.map} +0 -0
- /package/dist/ls-document-viewer/{p-1442f973.entry.js.map → p-131fe514.entry.js.map} +0 -0
- /package/dist/ls-document-viewer/{p-31f8c44a.entry.js.map → p-96fe16df.entry.js.map} +0 -0
- /package/dist/ls-document-viewer/{p-caa89c6c.entry.js.map → p-ccbc4663.entry.js.map} +0 -0
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BhZ5Udbm.js';
|
|
2
2
|
import { d as defaultRolePalette } from './p-BKrsDBDB.js';
|
|
3
3
|
import { a as attachAllTooltips } from './p-Cb8nDMs-.js';
|
|
4
|
-
import { d as defineCustomElement$2 } from './p-
|
|
5
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$2 } from './p-DnyBXRV4.js';
|
|
5
|
+
import { d as defineCustomElement$1 } from './p-Drbp3Wll.js';
|
|
6
6
|
|
|
7
7
|
const lsToolboxFieldCss = () => `.ls-toolbox-field{display:flex;padding:0.5rem;align-items:center;justify-content:center;gap:0.875rem;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:white;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.ls-toolbox-field:hover{background:var(--gray-10, #f7f8fa);box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);border:1px solid var(--gray-30, #e0e2e5)}.warning-box{display:flex;padding:0.38rem;align-items:center;justify-content:center;border-radius:0.625rem;border:1px solid var(--red-40, #fca39a);background:var(--red-10, #fff1f0);color:var(--red-60, #f04438)}.toolbox-field-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--signer-color);background:var(--signer-color-light);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);color:var(--signer-color)}.toolbox-field-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;width:100%;margin:0}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
|
|
8
8
|
|
|
@@ -82,7 +82,7 @@ const LsToolboxField = /*@__PURE__*/ proxyCustomElement(class LsToolboxField ext
|
|
|
82
82
|
attachAllTooltips(this.component.shadowRoot);
|
|
83
83
|
}
|
|
84
84
|
render() {
|
|
85
|
-
return (h(Host, { key: '
|
|
85
|
+
return (h(Host, { key: '839ca32d4ef3117e241d2f70837dd32b88da7808', draggable: "true" }, h("div", { key: '1b06e4c676d3527caca6dd2d3b1a5bf47ccbc94b', class: 'ls-toolbox-field', style: this.isSelected && {
|
|
86
86
|
background: defaultRolePalette[this.signer % 100].s10,
|
|
87
87
|
border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,
|
|
88
88
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
@@ -97,9 +97,9 @@ const LsToolboxField = /*@__PURE__*/ proxyCustomElement(class LsToolboxField ext
|
|
|
97
97
|
defaultWidth: this.defaultWidth,
|
|
98
98
|
fixedAspect: this.fixedAspect,
|
|
99
99
|
});
|
|
100
|
-
} }, h("div", { key: '
|
|
100
|
+
} }, h("div", { key: 'a58fa5a5554c77c500ded10d55aa14c314c2a63f', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }, "data-tooltip": this.tooltip, "data-tooltip-placement": "right" }, h("ls-icon", { key: 'f3cf977768c1a66323f1843cc5c3cfbfbb35d2c7', name: this.icon, size: "1.25rem" })), h("p", { key: '8723f3d54dbfe9fe41dfe667a363729602bc1294', class: "toolbox-field-label", style: this.isSelected && {
|
|
101
101
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
102
|
-
} }, this.label), this.redDot && (h("div", { key: '
|
|
102
|
+
} }, this.label), this.redDot && (h("div", { key: '78905ebc7b639ac564baec469de56110af4de677', class: 'warning-box', "data-tooltip": `${this.label} Field Required`, "data-tooltip-placement": "left" }, h("ls-icon", { key: '5adc59245e67a703d76ca833664c2103300c1de3', name: "exclamation-circle", size: "1.125rem", solid: true }))), h("ls-icon", { key: 'fc072d33c1517bd2b2ee0601aab4e05cb10fcb4d', name: "drag-vertical", size: "1rem", color: "#787a80" })), h("ls-tooltip", { key: '49d08025b8820015f270c2b8901756379c989960', id: "ls-tooltip-master", tooltipText: "Something" })));
|
|
103
103
|
}
|
|
104
104
|
static get style() { return lsToolboxFieldCss(); }
|
|
105
105
|
}, [769, "ls-toolbox-field", {
|
|
@@ -142,6 +142,6 @@ function defineCustomElement() {
|
|
|
142
142
|
defineCustomElement();
|
|
143
143
|
|
|
144
144
|
export { LsToolboxField as L, defineCustomElement as d };
|
|
145
|
-
//# sourceMappingURL=p-
|
|
145
|
+
//# sourceMappingURL=p-DzeltV9H.js.map
|
|
146
146
|
|
|
147
|
-
//# sourceMappingURL=p-
|
|
147
|
+
//# sourceMappingURL=p-DzeltV9H.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-B_6EV5o3.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-toolbox-field/ls-toolbox-field.css?tag=ls-toolbox-field&encapsulation=shadow","src/components/ls-toolbox-field/ls-toolbox-field.tsx"],"sourcesContent":[".ls-toolbox-field {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n justify-content: center;\n gap: 0.875rem;\n border-radius: 1rem;\n border: 1px solid var(--gray-20, #edeff2);\n background: white;\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\n.ls-toolbox-field:hover {\n background: var(--gray-10, #f7f8fa);\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid var(--gray-30, #e0e2e5);\n}\n\n.warning-box {\n display: flex;\n padding: 0.38rem;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid var(--red-40, #fca39a);\n background: var(--red-10, #fff1f0);\n color: var(--red-60, #f04438);\n}\n\n\n\n.toolbox-field-icon {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n border-radius: 0.5rem;\n border: 1px solid var(--signer-color);\n background: var(--signer-color-light);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n color: var(--signer-color);\n}\n\n.toolbox-field-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n width: 100%;\n margin: 0;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 2.25rem;\n}\n\n.input-wrapper {\n position: relative;\n width: fit-content;\n}\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Event, Host, Listen, Prop, Element, h, EventEmitter } from '@stencil/core';\nimport { Icon } from '../../types/Icon';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-toolbox-field',\n styleUrl: 'ls-toolbox-field.css',\n shadow: true,\n})\nexport class LsToolboxField {\n @Element() component: HTMLElement;\n /**\n * The field type of this toolbox item, e.g. 'signature'. Note these should always be lowercase.\n */\n @Prop() formElementType: string;\n @Prop() elementType: string;\n @Prop() validation: number = 0;\n @Prop() fixedAspect: number | null = null;\n @Prop() redDot: boolean = false;\n\n /**\n * The text to display for this field type.\n */\n @Prop() label: string;\n\n /**\n * The icon to display for this field type.\n */\n @Prop() icon: Icon;\n /**\n * The tooltip hint to describe to the field type\n */\n @Prop() tooltip: string;\n\n /**\n * The starting height of this control type in pixels.\n */\n @Prop() defaultHeight: number;\n /**\n * The starting width of this control type in pixels.\n */\n @Prop() defaultWidth: number;\n\n /**\n * The signer color of the element\n */\n @Prop() signer: number = 0;\n\n @Prop({ mutable: true }) isSelected: boolean = false;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n fieldTypeSelected: EventEmitter<{\n label: string;\n elementType: string;\n defaultHeight: number;\n defaultWidth: number;\n formElementType: string;\n validation: number;\n fixedAspect: number | null;\n }>;\n\n @Listen('dragstart')\n handleDragStart(event) {\n\n var canvas = document.createElement('div');\n canvas.style.position = 'absolute';\n canvas.style.left = '-100%';\n canvas.style.zIndex = '-100';\n canvas.style.height = this.defaultHeight +'px';\n canvas.style.width = this.defaultWidth +'px';\n canvas.style.backgroundColor = 'rgba(255, 255, 255, 1)';\n canvas.style.border = `1px dashed ${defaultRolePalette[this.signer % 100].s60}`;\n canvas.innerHTML = this.formElementType;\n document.body.appendChild(canvas); \n\n event.dataTransfer.setDragImage(canvas, -50, -20);\n\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n }),\n );\n event.dataTransfer.dropEffect = 'copy';\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'ArrowDown') {\n console.log('down arrow pressed');\n }\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host draggable=\"true\">\n <div\n class={'ls-toolbox-field'}\n style={\n this.isSelected && {\n background: defaultRolePalette[this.signer % 100].s10,\n border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,\n color: defaultRolePalette[this.signer % 100].s80,\n boxShadow: `0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);`,\n }\n }\n onClick={() => {\n this.fieldTypeSelected.emit({\n label: this.label,\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n });\n }}\n >\n <div\n class=\"toolbox-field-icon\"\n style={{ '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }}\n data-tooltip={this.tooltip}\n data-tooltip-placement=\"right\"\n >\n <ls-icon name={this.icon} size=\"1.25rem\" />\n </div>\n <p\n class=\"toolbox-field-label\"\n style={\n this.isSelected && {\n color: defaultRolePalette[this.signer % 100].s80,\n }\n }\n >\n {this.label}\n </p>\n {this.redDot && (\n <div class={'warning-box'} data-tooltip={`${this.label} Field Required`} data-tooltip-placement=\"left\">\n <ls-icon name=\"exclamation-circle\" size=\"1.125rem\" solid />\n </div>\n )}\n <ls-icon name=\"drag-vertical\" size=\"1rem\" color=\"#787a80\" />\n </div>\n <ls-tooltip id=\"ls-tooltip-master\" tooltipText=\"Something\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-DzeltV9H.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-toolbox-field/ls-toolbox-field.css?tag=ls-toolbox-field&encapsulation=shadow","src/components/ls-toolbox-field/ls-toolbox-field.tsx"],"sourcesContent":[".ls-toolbox-field {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n justify-content: center;\n gap: 0.875rem;\n border-radius: 1rem;\n border: 1px solid var(--gray-20, #edeff2);\n background: white;\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\n.ls-toolbox-field:hover {\n background: var(--gray-10, #f7f8fa);\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid var(--gray-30, #e0e2e5);\n}\n\n.warning-box {\n display: flex;\n padding: 0.38rem;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid var(--red-40, #fca39a);\n background: var(--red-10, #fff1f0);\n color: var(--red-60, #f04438);\n}\n\n\n\n.toolbox-field-icon {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n border-radius: 0.5rem;\n border: 1px solid var(--signer-color);\n background: var(--signer-color-light);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n color: var(--signer-color);\n}\n\n.toolbox-field-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n width: 100%;\n margin: 0;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 2.25rem;\n}\n\n.input-wrapper {\n position: relative;\n width: fit-content;\n}\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Event, Host, Listen, Prop, Element, h, EventEmitter } from '@stencil/core';\nimport { Icon } from '../../types/Icon';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-toolbox-field',\n styleUrl: 'ls-toolbox-field.css',\n shadow: true,\n})\nexport class LsToolboxField {\n @Element() component: HTMLElement;\n /**\n * The field type of this toolbox item, e.g. 'signature'. Note these should always be lowercase.\n */\n @Prop() formElementType: string;\n @Prop() elementType: string;\n @Prop() validation: number = 0;\n @Prop() fixedAspect: number | null = null;\n @Prop() redDot: boolean = false;\n\n /**\n * The text to display for this field type.\n */\n @Prop() label: string;\n\n /**\n * The icon to display for this field type.\n */\n @Prop() icon: Icon;\n /**\n * The tooltip hint to describe to the field type\n */\n @Prop() tooltip: string;\n\n /**\n * The starting height of this control type in pixels.\n */\n @Prop() defaultHeight: number;\n /**\n * The starting width of this control type in pixels.\n */\n @Prop() defaultWidth: number;\n\n /**\n * The signer color of the element\n */\n @Prop() signer: number = 0;\n\n @Prop({ mutable: true }) isSelected: boolean = false;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n fieldTypeSelected: EventEmitter<{\n label: string;\n elementType: string;\n defaultHeight: number;\n defaultWidth: number;\n formElementType: string;\n validation: number;\n fixedAspect: number | null;\n }>;\n\n @Listen('dragstart')\n handleDragStart(event) {\n\n var canvas = document.createElement('div');\n canvas.style.position = 'absolute';\n canvas.style.left = '-100%';\n canvas.style.zIndex = '-100';\n canvas.style.height = this.defaultHeight +'px';\n canvas.style.width = this.defaultWidth +'px';\n canvas.style.backgroundColor = 'rgba(255, 255, 255, 1)';\n canvas.style.border = `1px dashed ${defaultRolePalette[this.signer % 100].s60}`;\n canvas.innerHTML = this.formElementType;\n document.body.appendChild(canvas); \n\n event.dataTransfer.setDragImage(canvas, -50, -20);\n\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n }),\n );\n event.dataTransfer.dropEffect = 'copy';\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'ArrowDown') {\n console.log('down arrow pressed');\n }\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host draggable=\"true\">\n <div\n class={'ls-toolbox-field'}\n style={\n this.isSelected && {\n background: defaultRolePalette[this.signer % 100].s10,\n border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,\n color: defaultRolePalette[this.signer % 100].s80,\n boxShadow: `0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);`,\n }\n }\n onClick={() => {\n this.fieldTypeSelected.emit({\n label: this.label,\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n });\n }}\n >\n <div\n class=\"toolbox-field-icon\"\n style={{ '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }}\n data-tooltip={this.tooltip}\n data-tooltip-placement=\"right\"\n >\n <ls-icon name={this.icon} size=\"1.25rem\" />\n </div>\n <p\n class=\"toolbox-field-label\"\n style={\n this.isSelected && {\n color: defaultRolePalette[this.signer % 100].s80,\n }\n }\n >\n {this.label}\n </p>\n {this.redDot && (\n <div class={'warning-box'} data-tooltip={`${this.label} Field Required`} data-tooltip-placement=\"left\">\n <ls-icon name=\"exclamation-circle\" size=\"1.125rem\" solid />\n </div>\n )}\n <ls-icon name=\"drag-vertical\" size=\"1rem\" color=\"#787a80\" />\n </div>\n <ls-tooltip id=\"ls-tooltip-master\" tooltipText=\"Something\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BhZ5Udbm.js';
|
|
2
2
|
import { d as defaultRolePalette } from './p-BKrsDBDB.js';
|
|
3
|
-
import { d as defineCustomElement$3 } from './p-
|
|
4
|
-
import { d as defineCustomElement$2 } from './p-
|
|
5
|
-
import { d as defineCustomElement$1 } from './p-
|
|
3
|
+
import { d as defineCustomElement$3 } from './p-DnyBXRV4.js';
|
|
4
|
+
import { d as defineCustomElement$2 } from './p-DzeltV9H.js';
|
|
5
|
+
import { d as defineCustomElement$1 } from './p-Drbp3Wll.js';
|
|
6
6
|
|
|
7
7
|
const lsRecipientCardCss = () => `:host{display:block}*{box-sizing:border-box;margin:0}.participant-card{display:flex;padding:0.75rem;flex-direction:column;align-items:flex-start;gap:0.5rem;align-self:stretch;max-height:6.25rem;transition:max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden;transform-origin:top}.participant-card.expand-up{transform-origin:bottom}.participant-card.expand-down{transform-origin:top}.participant-card.expanded{max-height:125rem;}.dot{width:0.5rem;height:0.5rem;background:var(--red-50, #ff706b);border-radius:50%;margin-right:0.25rem}.top-card{border-radius:1rem 1rem 0 0}.full-card{border-radius:1.5rem}.bottom-card{border-radius:0 0 1rem 1rem}.participant-card-inner{width:100%;display:flex;flex-direction:column;gap:0.5rem}.hidden{visibility:hidden;display:none}.form-button-set{display:flex;gap:0.5rem}.role-label{display:flex;padding:0.125rem 0.5rem;justify-content:center;align-items:center;gap:0.25rem;border-radius:0.5rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.fields-box{display:flex;flex-direction:column;gap:0.5rem;width:100%}.role-label.fields{border-radius:1rem;margin-top:0.5rem}.innerButton{margin:0px;padding:0px;max-height:1.25rem !important;max-width:1.25rem !important;background-color:transparent;border:none;cursor:pointer;color:var(--default-button-colour)}.innerButton:hover{color:var(--hover-button-colour)}.participant-card-top-items{display:flex;width:100%;justify-content:space-between;align-items:center}.button-set{display:flex;gap:0.125rem}.participant-text-description{font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.participant-text-type{font-style:normal;font-weight:400;line-height:1.25rem;}.titleButton{width:100%;text-align:left;background-color:transparent;border:none}.full-width{width:100%}.participant-card-text{padding:0 0.125rem 0.125rem 0.125rem}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem;width:100%}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover:not(:disabled),select:hover:not(:disabled),textarea:hover:not(:disabled){border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.tertiary{border:1px solid var(--primary-60, #4456f6);background:transparent;color:var(--primary-70, #2134dc)}button.tertiary:hover{border:1px solid var(--primary-70, #2134dc);border:1px solid var(--primary-80, #0c34b8)}button.destructive{border:1px solid var(--red-60, #f04438);background:transparent;color:var(--red-60)}button.destructive:hover{border:1px solid var(--red-70, #d92d20);background:var(--red-10, #fff1f0);background-color:var(--red-10, #fff1f0)}button.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
|
|
8
8
|
|
|
@@ -80,7 +80,7 @@ const LsRecipientCard = /*@__PURE__*/ proxyCustomElement(class LsRecipientCard e
|
|
|
80
80
|
render() {
|
|
81
81
|
const recipientFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.recipient.signerIndex) || [];
|
|
82
82
|
const recipientSignatures = recipientFields.filter(f => f.elementType === 'signature' || f.elementType === 'auto sign');
|
|
83
|
-
return (h(Host, { key: '
|
|
83
|
+
return (h(Host, { key: '903130cf529b43981b952104f0becfe3072348b2' }, h("div", { key: 'c77bea20d29c2abe70294403fa44401a46e4e930', ref: el => (this.cardRef = el), class: `participant-card top-card full-card ${this.activeRecipient === this.recipient.signerIndex ? 'expanded' : ''}`, style: {
|
|
84
84
|
background: defaultRolePalette[this.recipient?.signerIndex % 100].s10,
|
|
85
85
|
border: `1px solid ${defaultRolePalette[this.recipient?.signerIndex % 100].s60}`,
|
|
86
86
|
outline: `${this.recipient.signerIndex === this.activeRecipient ? '4px solid ' + defaultRolePalette[this.recipient?.signerIndex % 100].s40 : 'none'}`,
|
|
@@ -92,14 +92,14 @@ const LsRecipientCard = /*@__PURE__*/ proxyCustomElement(class LsRecipientCard e
|
|
|
92
92
|
this.setIsHovered(true);
|
|
93
93
|
}, onMouseLeave: () => {
|
|
94
94
|
this.setIsHovered(false);
|
|
95
|
-
} }, h("div", { key: '
|
|
95
|
+
} }, h("div", { key: '4bc11b093120878066273e874aa9882e6e39e7bc', class: 'participant-card-inner' }, h("div", { key: '944f9692a566a1a1c79aaa8dc059323d80b471fe', class: 'participant-card-top-items' }, h("div", { key: 'fb955e6daec5ed9695585eb2af23ce56d2cb6929', class: 'role-label', style: {
|
|
96
96
|
background: defaultRolePalette[this.recipient?.signerIndex % 100].s20,
|
|
97
97
|
color: defaultRolePalette[this.recipient?.signerIndex % 100].s90,
|
|
98
|
-
} }, h("ls-icon", { key: '
|
|
98
|
+
} }, h("ls-icon", { key: '2d1e276bde796354e98f52069ab6048d3b481f11', name: this.recipient?.roleType === 'APPROVER' ? 'check-circle' : this.recipient?.roleType === 'WITNESS' ? 'eye' : 'signature', size: '1rem' }), this.recipient?.roleType || 'Signer'), h("ls-icon", { key: '5b24b29b958e95b6bb8768aa58beccd5c0b2edc6', name: "cursor-click", size: "1rem", customStyle: { color: defaultRolePalette[this.recipient?.signerIndex % 100].s70 }, solid: true, style: { display: this.isHovered && this.recipient.signerIndex !== this.activeRecipient ? 'block' : 'none' } }), h("div", { key: '8f6621f8c95f0f40fed3ce646f08abdb43dfe92e', class: "dot", style: { display: (!this.isHovered || this.recipient.signerIndex === this.activeRecipient) && recipientSignatures.length === 0 ? 'block' : 'none' } })), h("div", { key: 'c66e5675ad85ec2670f7fd451d6087c6279004ad', class: 'participant-card-text' }, h("p", { key: '9430c5b17a9af2b946f9704cca36c47809a6c22c', class: "participant-text-description", style: {
|
|
99
99
|
color: defaultRolePalette[this.recipient?.signerIndex % 100].s100,
|
|
100
|
-
} }, this.recipient?.firstName + ' ' + this.recipient?.lastName), h("p", { key: '
|
|
100
|
+
} }, this.recipient?.firstName + ' ' + this.recipient?.lastName), h("p", { key: 'adacb17c980d30db40aa5ecc5242ea56c8cfea88', class: "participant-text-type", style: {
|
|
101
101
|
color: defaultRolePalette[this.recipient?.signerIndex % 100].s80,
|
|
102
|
-
} }, this.recipient.email)), h("div", { key: '
|
|
102
|
+
} }, this.recipient.email)), h("div", { key: '74f92c9be85a13f24ebf3a0062307e727ff91d21', class: "fields-box", style: { display: this.recipient.signerIndex === this.activeRecipient ? 'flex' : 'hidden' } }, this.recipient.signerIndex > 0 && this.showTool('signature') && (h("ls-toolbox-field", { key: '582305497fd7216b8d1b2ad9099909cb087ac9ed', elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: this.recipient.signerIndex, redDot: recipientSignatures.length === 0 })), this.recipient.signerIndex === 0 && this.showTool('auto sign') && (h("ls-toolbox-field", { key: '1d6b1339d14d1a20b191d24b252b76770b9afe11', elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "auto-sign", tooltip: "Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending", signer: this.recipient.signerIndex })), this.showTool('text') && (h("ls-toolbox-field", { key: 'ddd544a2b90174b57ab08eafeffdbb301a395def', elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text", tooltip: "A field for collecting any plain text values such as: names, addresses or descriptions", signer: this.recipient.signerIndex })), this.recipient.signerIndex > 0 && this.showTool('signing date') && (h("ls-toolbox-field", { key: '59b7070b8de29037a928f379a9b206c428363250', elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date", tooltip: "Automatically inserts the date upon completion by the assigned Participant", signer: this.recipient.signerIndex })), this.showTool('date') && (h("ls-toolbox-field", { key: 'efd9647eeb4cf3b0ef2e4b53750c1b2a79183cba', elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender", tooltip: "A field for collecting dates with built-in date formatting options", signer: this.recipient.signerIndex })), this.showTool('email') && (h("ls-toolbox-field", { key: 'c8c45da7b41019e4f608e14d41933b6c0cffaab8', elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol", tooltip: "A Field to only accept entries formatted as an email address (e.g., example@example.com)", signer: this.recipient.signerIndex })), this.showTool('initials') && (h("ls-toolbox-field", { key: '2b492c3cbab7c15bc2c33adf6d823e984d753483', elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials", tooltip: "Use this field anywhere Participants are required to Initial your document", signer: this.recipient.signerIndex })), this.showTool('number') && (h("ls-toolbox-field", { key: '23c8df40155b90ee0b85b59750a2560114fc9340', elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag", tooltip: "A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)", signer: this.recipient.signerIndex })), this.showTool('dropdown') && (h("ls-toolbox-field", { key: '3e8626852735666572168f082cb8c5ddc2e11cb7', elementType: "dropdown", formElementType: "dropdown", label: "Dropdown", defaultHeight: 27, defaultWidth: 80, validation: 20, icon: "dropdown", tooltip: "Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes", signer: this.recipient.signerIndex })), this.showTool('checkbox') && (h("ls-toolbox-field", { key: 'd7b88874a12fa7f8ce3db5c7ec0df30f5f2eabfc', elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check", tooltip: "Places a checkbox on your document. Handy for T&Cs or \u2714/\u2717 sections", signer: this.recipient.signerIndex })), this.recipient.signerIndex > 0 && this.showTool('regex') && (h("ls-toolbox-field", { key: '3cb77d82364e2669ddb3b4823227fb8c7dd6a331', elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code", tooltip: "Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need", signer: this.recipient.signerIndex })), this.recipient.signerIndex > 0 && this.showTool('image') && (h("ls-toolbox-field", { key: 'ab118340a9ff3f79b5e4a73d0466fd23947b14e0', elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph", tooltip: "Use when you need Participants to upload their own images during the signing process", signer: this.recipient.signerIndex })), this.recipient.signerIndex > 0 && this.showTool('file') && (h("ls-toolbox-field", { key: '9790ff5b2adebaf0cc37d6d76e752693a870e0ba', elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload", tooltip: "Use when you need Participants to upload their own documents during the signing process", signer: this.recipient.signerIndex })), this.recipient.signerIndex > 0 && this.showTool('drawn') && (h("ls-toolbox-field", { key: '59b014db250eec0aa8a26cdf71c10fe80ca61eba', elementType: "drawn", formElementType: "drawn", label: "Drawn", defaultHeight: 120, defaultWidth: 120, validation: 90, icon: "pencil", tooltip: "Allow users to draw on the document using their mouse or touchscreen", signer: this.recipient.signerIndex }))))), h("slot", { key: '663ed6dcbf31fbc950578c271e2e86b78d8f7387' }), h("ls-tooltip", { key: '18346e1c26aa528bf4afe88b87d67241984d1fca', id: "ls-tooltip-master" })));
|
|
103
103
|
}
|
|
104
104
|
static get watchers() { return {
|
|
105
105
|
"activeRecipient": ["handleExpandCollapse"]
|
|
@@ -147,6 +147,6 @@ function defineCustomElement() {
|
|
|
147
147
|
defineCustomElement();
|
|
148
148
|
|
|
149
149
|
export { LsRecipientCard as L, defineCustomElement as d };
|
|
150
|
-
//# sourceMappingURL=p-
|
|
150
|
+
//# sourceMappingURL=p-QIG8yroe.js.map
|
|
151
151
|
|
|
152
|
-
//# sourceMappingURL=p-
|
|
152
|
+
//# sourceMappingURL=p-QIG8yroe.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-DazmCUCS.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,MAAM,CAAC,47NAA47N,CAAC;;MCYl9N,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AAE1B;;;;AAIG;AACK,IAAA,SAAS;AACT,IAAA,eAAe;AACf,IAAA,iBAAiB,GAAkB;AACzC,QAAA,KAAK,EAAE,WAAW;AAClB,QAAA,eAAe,EAAE,WAAW;AAC5B,QAAA,WAAW,EAAE,WAAW;AACxB,QAAA,UAAU,EAAE,CAAC;AACb,QAAA,aAAa,EAAE,EAAE;AACjB,QAAA,YAAY,EAAE,GAAG;KAClB;AACO,IAAA,QAAQ;IACP,SAAS,GAAY,KAAK;AAE3B,IAAA,YAAY,CAAC,KAAc,EAAA;AACjC,QAAA,IAAI,CAAC,SAAS,GAAG,KAAK;;IAEhB,gBAAgB,GAAsB,EAAE;AAEhD;;;AAGG;IACK,aAAa,GAAY,IAAI;;AAG5B,IAAA,YAAY;;AAGZ,IAAA,aAAa;AAGtB,IAAA,uBAAuB,CAAC,KAAK,EAAA;AAC3B,QAAA,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;AAClB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,gBAAgB,CAAC,kBAAkB,CAAC;AAE7E,QAAA,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC;AAEnB,QAAA,MAAM,CAAC,OAAO,CAAC,OAAO,IAAG;AACvB,YAAA,OAAO,CAAC,UAAU,GAAG,OAAO,CAAC,eAAe,KAAK,KAAK,CAAC,MAAM,CAAC,eAAe;AAC/E,SAAC,CAAC;AAEF,QAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,MAAM;;AAGvC,IAAA,QAAQ,CAAC,aAAqB,EAAA;AAC5B,QAAA,OAAO,IAAI,CAAC,aAAa,KAAK,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC;;AAGrF,IAAA,OAAO;IAGf,oBAAoB,GAAA;QAClB,IAAI,CAAC,IAAI,CAAC,OAAO;YAAE;QAEnB,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,SAAS,CAAC,WAAW;QAEpE,IAAI,QAAQ,EAAE;;AAEZ,YAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,GAAG,IAAI;;aAC1D;;YAEL,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM;;;IAIzC,gBAAgB,GAAA;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,SAAS,CAAC,WAAW;QACpE,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,GAAG,IAAI,GAAG,MAAM;;IAGrF,MAAM,GAAA;AACJ,QAAA,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE;QACnI,MAAM,mBAAmB,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,KAAK,WAAW,IAAI,CAAC,CAAC,WAAW,KAAK,WAAW,CAAC;QACvH,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC,EAC9B,KAAK,EAAE,CAAA,oCAAA,EAAuC,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,UAAU,GAAG,EAAE,CAAA,CAAE,EACrH,KAAK,EAAE;AACL,gBAAA,UAAU,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACrE,gBAAA,MAAM,EAAE,CAAA,UAAA,EAAa,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG,CAAE,CAAA;AAChF,gBAAA,OAAO,EAAE,CAAA,EAAG,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,IAAI,CAAC,eAAe,GAAG,YAAY,GAAG,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG,GAAG,MAAM,CAAE,CAAA;AACrJ,gBAAA,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,KAAK,SAAS,GAAG,WAAW,GAAG,GAAG;AACpE,gBAAA,MAAM,EAAE,SAAS;aAClB,EACD,OAAO,EAAE,MAAK;gBACZ,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC;AACpD,aAAC,EACD,YAAY,EAAE,MAAK;AACjB,gBAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;AACzB,aAAC,EACD,YAAY,EAAE,MAAK;AACjB,gBAAA,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;aACzB,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,wBAAwB,EAAA,EAClC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,4BAA4B,EAAA,EACtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE;AACL,gBAAA,UAAU,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACrE,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;aACjE,EAAA,EAED,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,QAAQ,KAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,SAAS,EAAE,QAAQ,KAAK,SAAS,GAAG,KAAK,GAAG,WAAW,EAAE,IAAI,EAAC,MAAM,EAAG,CAAA,EACrJ,IAAI,CAAC,SAAS,EAAE,QAAQ,IAAI,QAAQ,CACjC,EACN,CACE,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,EAAE,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,EACjF,KAAK,QACL,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,IAAI,CAAC,eAAe,GAAG,OAAO,GAAG,MAAM,EAAE,EAC5G,CAAA,EACF,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,KAAK,EACX,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,IAAI,CAAC,eAAe,KAAK,mBAAmB,CAAC,MAAM,KAAK,CAAC,GAAG,OAAO,GAAG,MAAM,EAAE,GACnJ,CACE,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,uBAAuB,EAAA,EACjC,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,8BAA8B,EACpC,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,IAAI;AAClE,aAAA,EAAA,EAEA,IAAI,CAAC,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE,QAAQ,CACzD,EACJ,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,uBAAuB,EAC7B,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;aACjE,EAAA,EAEA,IAAI,CAAC,SAAS,CAAC,KAAK,CACnB,CAeA,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,IAAI,CAAC,eAAe,GAAG,MAAM,GAAG,QAAQ,EAAE,EAAA,EAChH,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,KAC3D,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,WAAW,EACvB,eAAe,EAAC,WAAW,EAC3B,KAAK,EAAC,WAAW,EACjB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,WAAW,EAChB,OAAO,EAAC,wDAAwD,EAChE,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAClC,MAAM,EAAE,mBAAmB,CAAC,MAAM,KAAK,CAAC,GACxC,CACH,EAEA,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,KAC7D,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAC,WAAW,EACvB,eAAe,EAAC,WAAW,EAC3B,KAAK,EAAC,WAAW,EACjB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,IAAI,EAChB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAC,wGAAwG,EAChH,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EACA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KACpB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,MAAM,EAClB,eAAe,EAAC,MAAM,EACtB,KAAK,EAAC,MAAM,EACZ,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,wFAAwF,EAChG,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,KAC9D,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAC,cAAc,EAC1B,eAAe,EAAC,cAAc,EAC9B,KAAK,EAAC,cAAc,EACpB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,WAAW,EAChB,OAAO,EAAC,4EAA4E,EACpF,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KACpB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,MAAM,EAClB,eAAe,EAAC,MAAM,EACtB,KAAK,EAAC,MAAM,EACZ,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,EAAE,EAChB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,UAAU,EACf,OAAO,EAAC,oEAAoE,EAC5E,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EACA,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KACrB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,OAAO,EACnB,eAAe,EAAC,OAAO,EACvB,KAAK,EAAC,OAAO,EACb,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,WAAW,EAChB,OAAO,EAAC,0FAA0F,EAClG,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,KACxB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,UAAU,EACtB,eAAe,EAAC,UAAU,EAC1B,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,IAAI,EAChB,IAAI,EAAC,UAAU,EACf,OAAO,EAAC,4EAA4E,EACpF,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,KACtB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,QAAQ,EACpB,eAAe,EAAC,QAAQ,EACxB,KAAK,EAAC,QAAQ,EACd,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,EAAE,EAChB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,6JAA6J,EACrK,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,KACxB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,UAAU,EACtB,eAAe,EAAC,UAAU,EAC1B,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,EAAE,EAChB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,UAAU,EACf,OAAO,EAAC,8HAA8H,EACtI,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,KACxB,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,UAAU,EACtB,eAAe,EAAC,UAAU,EAC1B,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,EAAE,EAChB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,+EAAqE,EAC7E,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EAEA,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KACvD,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAC,OAAO,EACnB,eAAe,EAAC,OAAO,EACvB,KAAK,EAAC,OAAO,EACb,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,sHAAsH,EAC9H,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EACA,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KACvD,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAC,OAAO,EACnB,eAAe,EAAC,OAAO,EACvB,KAAK,EAAC,OAAO,EACb,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,YAAY,EACjB,OAAO,EAAC,sFAAsF,EAC9F,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EACA,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KACtD,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAC,MAAM,EAClB,eAAe,EAAC,MAAM,EACtB,KAAK,EAAC,MAAM,EACZ,aAAa,EAAE,EAAE,EACjB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,yFAAyF,EACjG,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAAA,CAClC,CACH,EACA,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KACvD,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,OAAO,EACnB,eAAe,EAAC,OAAO,EACvB,KAAK,EAAC,OAAO,EACb,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,EAAE,EACd,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,sEAAsE,EAC9E,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW,EAClC,CAAA,CACH,CACG,CACF,CACF,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACb,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAY,EAAE,EAAC,mBAAmB,EAAG,CAAA,CAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-recipient-card/ls-recipient-card.css?tag=ls-recipient-card&encapsulation=shadow","src/components/ls-recipient-card/ls-recipient-card.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n* {\n box-sizing: border-box;\n margin: 0;\n}\n\n.participant-card {\n display: flex;\n padding: 0.75rem;\n flex-direction: column;\n align-items: flex-start;\n gap: 0.5rem;\n align-self: stretch;\n max-height: 6.25rem;\n transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n transform-origin: top;\n}\n\n.participant-card.expand-up {\n transform-origin: bottom;\n}\n.participant-card.expand-down {\n transform-origin: top;\n}\n\n.participant-card.expanded {\n max-height: 125rem; /* large enough for any content */\n}\n\n.dot {\n width: 0.5rem;\n height: 0.5rem;\n background: var(--red-50, #ff706b);\n border-radius: 50%;\n margin-right: 0.25rem;\n}\n\n.top-card {\n border-radius: 1rem 1rem 0 0;\n}\n\n.full-card {\n border-radius: 1.5rem;\n}\n\n.bottom-card {\n border-radius: 0 0 1rem 1rem;\n}\n\n.participant-card-inner {\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.hidden {\n visibility: hidden;\n display: none;\n}\n\n.form-button-set {\n display: flex;\n gap: 0.5rem;\n}\n\n.role-label {\n display: flex;\n padding: 0.125rem 0.5rem;\n justify-content: center;\n align-items: center;\n gap: 0.25rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.fields-box {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n width: 100%;\n}\n\n.role-label.fields {\n border-radius: 1rem;\n margin-top: 0.5rem;\n}\n\n.innerButton {\n margin: 0px;\n padding: 0px;\n max-height: 1.25rem !important;\n max-width: 1.25rem !important;\n background-color: transparent;\n border: none;\n cursor: pointer;\n color: var(--default-button-colour);\n}\n\n.innerButton:hover {\n color: var(--hover-button-colour);\n}\n\n.participant-card-top-items {\n display: flex;\n width: 100%;\n justify-content: space-between;\n align-items: center;\n}\n\n.button-set {\n display: flex;\n gap: 0.125rem;\n}\n\n.participant-text-description {\n font-size: 0.875rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.participant-text-type {\n font-style: normal;\n font-weight: 400;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.titleButton {\n width: 100%;\n text-align: left;\n background-color: transparent;\n border: none;\n}\n\n/* Global Styles */\n\n.full-width {\n width: 100%;\n}\n\n.participant-card-text {\n padding: 0 0.125rem 0.125rem 0.125rem;\n}\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 2.25rem;\n width: 100%;\n}\n\n.input-wrapper {\n position: relative;\n width: fit-content;\n}\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover:not(:disabled),\nselect:hover:not(:disabled),\ntextarea:hover:not(:disabled) {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.tertiary {\n border: 1px solid var(--primary-60, #4456f6);\n background: transparent;\n color: var(--primary-70, #2134dc);\n}\n\nbutton.tertiary:hover {\n border: 1px solid var(--primary-70, #2134dc);\n border: 1px solid var(--primary-80, #0c34b8);\n}\n\nbutton.destructive {\n border: 1px solid var(--red-60, #f04438);\n background: transparent;\n color: var(--red-60);\n}\n\nbutton.destructive:hover {\n border: 1px solid var(--red-70, #d92d20);\n background: var(--red-10, #fff1f0);\n background-color: var(--red-10, #fff1f0);\n}\n\nbutton.secondary {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--white, #fff);\n color: var(--gray-90, #5e6066);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.secondary:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State, Listen, Element, Watch } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { LSApiRecipient } from '../../types/LSApiRecipient';\nimport { LSApiTemplate } from '../../components';\nimport { ValidationError } from '../../types/ValidationError';\nimport { IToolboxField } from '../interfaces/IToolboxField';\n\n@Component({\n tag: 'ls-recipient-card',\n styleUrl: 'ls-recipient-card.css',\n shadow: true,\n})\nexport class LsRecipientCard {\n @Element() component: HTMLElement;\n /**\n * The initial template data, including the link for background PDF. See README and\n * example for correct GraphQL query and data structure.\n * {LSApiTemplate}\n */\n @Prop() recipient: LSApiRecipient;\n @Prop() activeRecipient: number;\n @Prop() fieldTypeSelected: IToolboxField = {\n label: 'Signature',\n formElementType: 'signature',\n elementType: 'signature',\n validation: 0,\n defaultHeight: 27,\n defaultWidth: 120,\n };\n @Prop() template: LSApiTemplate;\n @State() isHovered: boolean = false;\n\n private setIsHovered(value: boolean) {\n this.isHovered = value;\n }\n @Prop() validationErrors: ValidationError[] = [];\n\n /**\n * Allows the selection of fields in the toolbox to be limited to a | (pipe) delimited list.\n * {string}\n */\n @Prop() filtertoolbox?: string = null;\n\n // Send an internal event to be processed\n @Event() changeSigner: EventEmitter<number>;\n\n // Send an internal event to be processed\n @Event() fieldSelected: EventEmitter<IToolboxField>;\n\n @Listen('fieldTypeSelected')\n handleFieldTypeSelected(event) {\n console.log(event);\n const fields = this.component.shadowRoot.querySelectorAll('ls-toolbox-field');\n\n console.log(fields);\n\n fields.forEach(element => {\n element.isSelected = element.formElementType === event.detail.formElementType;\n });\n\n this.fieldTypeSelected = event.detail;\n }\n\n showTool(fieldFormType: string): boolean {\n return this.filtertoolbox === null || this.filtertoolbox.split('|').includes(fieldFormType);\n }\n\n private cardRef!: HTMLElement;\n\n @Watch('activeRecipient')\n handleExpandCollapse() {\n if (!this.cardRef) return;\n\n const isActive = this.activeRecipient === this.recipient.signerIndex;\n\n if (isActive) {\n // Expand\n this.cardRef.style.maxHeight = this.cardRef.scrollHeight + 'px';\n } else {\n // Collapse\n this.cardRef.style.maxHeight = '6rem';\n }\n }\n\n componentDidLoad() {\n const isActive = this.activeRecipient === this.recipient.signerIndex;\n this.cardRef.style.maxHeight = isActive ? this.cardRef.scrollHeight + 'px' : '6rem';\n }\n\n render() {\n const recipientFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.recipient.signerIndex) || [];\n const recipientSignatures = recipientFields.filter(f => f.elementType === 'signature' || f.elementType === 'auto sign');\n return (\n <Host>\n <div\n ref={el => (this.cardRef = el)}\n class={`participant-card top-card full-card ${this.activeRecipient === this.recipient.signerIndex ? 'expanded' : ''}`}\n style={{\n background: defaultRolePalette[this.recipient?.signerIndex % 100].s10,\n border: `1px solid ${defaultRolePalette[this.recipient?.signerIndex % 100].s60}`,\n outline: `${this.recipient.signerIndex === this.activeRecipient ? '4px solid ' + defaultRolePalette[this.recipient?.signerIndex % 100].s40 : 'none'}`,\n marginTop: this.recipient.roleType === 'WITNESS' ? '-0.813rem' : '0',\n cursor: 'pointer',\n }}\n onClick={() => {\n this.changeSigner.emit(this.recipient.signerIndex);\n }}\n onMouseEnter={() => {\n this.setIsHovered(true);\n }}\n onMouseLeave={() => {\n this.setIsHovered(false);\n }}\n >\n <div class={'participant-card-inner'}>\n <div class={'participant-card-top-items'}>\n <div\n class={'role-label'}\n style={{\n background: defaultRolePalette[this.recipient?.signerIndex % 100].s20,\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s90,\n }}\n >\n <ls-icon name={this.recipient?.roleType === 'APPROVER' ? 'check-circle' : this.recipient?.roleType === 'WITNESS' ? 'eye' : 'signature'} size='1rem' />\n {this.recipient?.roleType || 'Signer'}\n </div>\n <ls-icon\n name=\"cursor-click\"\n size=\"1rem\"\n customStyle={{ color: defaultRolePalette[this.recipient?.signerIndex % 100].s70 }}\n solid\n style={{ display: this.isHovered && this.recipient.signerIndex !== this.activeRecipient ? 'block' : 'none' }}\n />\n <div\n class=\"dot\"\n style={{ display: (!this.isHovered || this.recipient.signerIndex === this.activeRecipient) && recipientSignatures.length === 0 ? 'block' : 'none' }}\n />\n </div>\n\n <div class={'participant-card-text'}>\n <p\n class=\"participant-text-description\"\n style={{\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s100,\n }}\n >\n {this.recipient?.firstName + ' ' + this.recipient?.lastName}\n </p>\n <p\n class=\"participant-text-type\"\n style={{\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s80,\n }}\n >\n {this.recipient.email}\n </p>\n {/* {this.recipient?.roleType !== 'APPROVER' && (\n <div\n class={'role-label fields'}\n style={{\n background:\n recipientFields.length === 0 ? defaultRolePalette[this.recipient?.signerIndex % 100].s60 : defaultRolePalette[this.recipient?.signerIndex % 100].s20,\n color: recipientFields.length === 0 ? 'white' : defaultRolePalette[this.recipient?.signerIndex % 100].s90,\n // display: this.isHovered && this.recipient.signerIndex !== this.activeRecipient ? '' : 'none',\n }}\n >\n {recipientSignatures.length === 0 && <ls-icon name=\"exclamation-circle\" size=\"16\" style={{ marginRight: '0.125rem' }} />}\n {recipientSignatures.length === 0 ? 'Signature Required' : `${recipientFields.length} ${recipientFields.length === 1 ? 'Field' : 'Fields'}`}\n </div>\n )} */}\n </div>\n\n <div class=\"fields-box\" style={{ display: this.recipient.signerIndex === this.activeRecipient ? 'flex' : 'hidden' }}>\n {this.recipient.signerIndex > 0 && this.showTool('signature') && (\n <ls-toolbox-field\n elementType=\"signature\"\n formElementType=\"signature\"\n label=\"Signature\"\n defaultHeight={27}\n defaultWidth={120}\n validation={0}\n icon=\"signature\"\n tooltip=\"Use this field to collect Signatures from Participants\"\n signer={this.recipient.signerIndex}\n redDot={recipientSignatures.length === 0}\n />\n )}\n\n {this.recipient.signerIndex === 0 && this.showTool('auto sign') && (\n <ls-toolbox-field\n elementType=\"auto sign\"\n formElementType=\"auto sign\"\n label=\"Auto Sign\"\n defaultHeight={27}\n defaultWidth={120}\n validation={3000}\n icon=\"auto-sign\"\n tooltip=\"Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.showTool('text') && (\n <ls-toolbox-field\n elementType=\"text\"\n formElementType=\"text\"\n label=\"Text\"\n defaultHeight={27}\n defaultWidth={100}\n validation={0}\n icon=\"text\"\n tooltip=\"A field for collecting any plain text values such as: names, addresses or descriptions\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.recipient.signerIndex > 0 && this.showTool('signing date') && (\n <ls-toolbox-field\n elementType=\"signing date\"\n formElementType=\"signing date\"\n label=\"Signing Date\"\n defaultHeight={27}\n defaultWidth={120}\n validation={30}\n icon=\"auto-date\"\n tooltip=\"Automatically inserts the date upon completion by the assigned Participant\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('date') && (\n <ls-toolbox-field\n elementType=\"date\"\n formElementType=\"date\"\n label=\"Date\"\n defaultHeight={27}\n defaultWidth={80}\n validation={2}\n icon=\"calender\"\n tooltip=\"A field for collecting dates with built-in date formatting options\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.showTool('email') && (\n <ls-toolbox-field\n elementType=\"email\"\n formElementType=\"email\"\n label=\"Email\"\n defaultHeight={27}\n defaultWidth={120}\n validation={1}\n icon=\"at-symbol\"\n tooltip=\"A Field to only accept entries formatted as an email address (e.g., example@example.com)\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('initials') && (\n <ls-toolbox-field\n elementType=\"initials\"\n formElementType=\"initials\"\n label=\"Initials\"\n defaultHeight={27}\n defaultWidth={120}\n validation={2000}\n icon=\"initials\"\n tooltip=\"Use this field anywhere Participants are required to Initial your document\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('number') && (\n <ls-toolbox-field\n elementType=\"number\"\n formElementType=\"number\"\n label=\"Number\"\n defaultHeight={27}\n defaultWidth={80}\n validation={50}\n icon=\"hashtag\"\n tooltip=\"A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('dropdown') && (\n <ls-toolbox-field\n elementType=\"dropdown\"\n formElementType=\"dropdown\"\n label=\"Dropdown\"\n defaultHeight={27}\n defaultWidth={80}\n validation={20}\n icon=\"dropdown\"\n tooltip=\"Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('checkbox') && (\n <ls-toolbox-field\n elementType=\"checkbox\"\n formElementType=\"checkbox\"\n label=\"Checkbox\"\n defaultHeight={27}\n defaultWidth={27}\n validation={25}\n icon=\"check\"\n tooltip=\"Places a checkbox on your document. Handy for T&Cs or ✔/✗ sections\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.recipient.signerIndex > 0 && this.showTool('regex') && (\n <ls-toolbox-field\n elementType=\"regex\"\n formElementType=\"regex\"\n label=\"Regex\"\n defaultHeight={27}\n defaultWidth={120}\n validation={93}\n icon=\"code\"\n tooltip=\"Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('image') && (\n <ls-toolbox-field\n elementType=\"image\"\n formElementType=\"image\"\n label=\"Image\"\n defaultHeight={27}\n defaultWidth={120}\n validation={90}\n icon=\"photograph\"\n tooltip=\"Use when you need Participants to upload their own images during the signing process\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('file') && (\n <ls-toolbox-field\n elementType=\"file\"\n formElementType=\"file\"\n label=\"File\"\n defaultHeight={27}\n defaultWidth={120}\n validation={74}\n icon=\"upload\"\n tooltip=\"Use when you need Participants to upload their own documents during the signing process\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('drawn') && (\n <ls-toolbox-field\n elementType=\"drawn\"\n formElementType=\"drawn\"\n label=\"Drawn\"\n defaultHeight={120}\n defaultWidth={120}\n validation={90}\n icon=\"pencil\"\n tooltip=\"Allow users to draw on the document using their mouse or touchscreen\"\n signer={this.recipient.signerIndex}\n />\n )}\n </div>\n </div>\n </div>\n <slot></slot>\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-QIG8yroe.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-recipient-card/ls-recipient-card.css?tag=ls-recipient-card&encapsulation=shadow","src/components/ls-recipient-card/ls-recipient-card.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n* {\n box-sizing: border-box;\n margin: 0;\n}\n\n.participant-card {\n display: flex;\n padding: 0.75rem;\n flex-direction: column;\n align-items: flex-start;\n gap: 0.5rem;\n align-self: stretch;\n max-height: 6.25rem;\n transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n transform-origin: top;\n}\n\n.participant-card.expand-up {\n transform-origin: bottom;\n}\n.participant-card.expand-down {\n transform-origin: top;\n}\n\n.participant-card.expanded {\n max-height: 125rem; /* large enough for any content */\n}\n\n.dot {\n width: 0.5rem;\n height: 0.5rem;\n background: var(--red-50, #ff706b);\n border-radius: 50%;\n margin-right: 0.25rem;\n}\n\n.top-card {\n border-radius: 1rem 1rem 0 0;\n}\n\n.full-card {\n border-radius: 1.5rem;\n}\n\n.bottom-card {\n border-radius: 0 0 1rem 1rem;\n}\n\n.participant-card-inner {\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.hidden {\n visibility: hidden;\n display: none;\n}\n\n.form-button-set {\n display: flex;\n gap: 0.5rem;\n}\n\n.role-label {\n display: flex;\n padding: 0.125rem 0.5rem;\n justify-content: center;\n align-items: center;\n gap: 0.25rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.fields-box {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n width: 100%;\n}\n\n.role-label.fields {\n border-radius: 1rem;\n margin-top: 0.5rem;\n}\n\n.innerButton {\n margin: 0px;\n padding: 0px;\n max-height: 1.25rem !important;\n max-width: 1.25rem !important;\n background-color: transparent;\n border: none;\n cursor: pointer;\n color: var(--default-button-colour);\n}\n\n.innerButton:hover {\n color: var(--hover-button-colour);\n}\n\n.participant-card-top-items {\n display: flex;\n width: 100%;\n justify-content: space-between;\n align-items: center;\n}\n\n.button-set {\n display: flex;\n gap: 0.125rem;\n}\n\n.participant-text-description {\n font-size: 0.875rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.participant-text-type {\n font-style: normal;\n font-weight: 400;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.titleButton {\n width: 100%;\n text-align: left;\n background-color: transparent;\n border: none;\n}\n\n/* Global Styles */\n\n.full-width {\n width: 100%;\n}\n\n.participant-card-text {\n padding: 0 0.125rem 0.125rem 0.125rem;\n}\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 2.25rem;\n width: 100%;\n}\n\n.input-wrapper {\n position: relative;\n width: fit-content;\n}\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover:not(:disabled),\nselect:hover:not(:disabled),\ntextarea:hover:not(:disabled) {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.tertiary {\n border: 1px solid var(--primary-60, #4456f6);\n background: transparent;\n color: var(--primary-70, #2134dc);\n}\n\nbutton.tertiary:hover {\n border: 1px solid var(--primary-70, #2134dc);\n border: 1px solid var(--primary-80, #0c34b8);\n}\n\nbutton.destructive {\n border: 1px solid var(--red-60, #f04438);\n background: transparent;\n color: var(--red-60);\n}\n\nbutton.destructive:hover {\n border: 1px solid var(--red-70, #d92d20);\n background: var(--red-10, #fff1f0);\n background-color: var(--red-10, #fff1f0);\n}\n\nbutton.secondary {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--white, #fff);\n color: var(--gray-90, #5e6066);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.secondary:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State, Listen, Element, Watch } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { LSApiRecipient } from '../../types/LSApiRecipient';\nimport { LSApiTemplate } from '../../components';\nimport { ValidationError } from '../../types/ValidationError';\nimport { IToolboxField } from '../interfaces/IToolboxField';\n\n@Component({\n tag: 'ls-recipient-card',\n styleUrl: 'ls-recipient-card.css',\n shadow: true,\n})\nexport class LsRecipientCard {\n @Element() component: HTMLElement;\n /**\n * The initial template data, including the link for background PDF. See README and\n * example for correct GraphQL query and data structure.\n * {LSApiTemplate}\n */\n @Prop() recipient: LSApiRecipient;\n @Prop() activeRecipient: number;\n @Prop() fieldTypeSelected: IToolboxField = {\n label: 'Signature',\n formElementType: 'signature',\n elementType: 'signature',\n validation: 0,\n defaultHeight: 27,\n defaultWidth: 120,\n };\n @Prop() template: LSApiTemplate;\n @State() isHovered: boolean = false;\n\n private setIsHovered(value: boolean) {\n this.isHovered = value;\n }\n @Prop() validationErrors: ValidationError[] = [];\n\n /**\n * Allows the selection of fields in the toolbox to be limited to a | (pipe) delimited list.\n * {string}\n */\n @Prop() filtertoolbox?: string = null;\n\n // Send an internal event to be processed\n @Event() changeSigner: EventEmitter<number>;\n\n // Send an internal event to be processed\n @Event() fieldSelected: EventEmitter<IToolboxField>;\n\n @Listen('fieldTypeSelected')\n handleFieldTypeSelected(event) {\n console.log(event);\n const fields = this.component.shadowRoot.querySelectorAll('ls-toolbox-field');\n\n console.log(fields);\n\n fields.forEach(element => {\n element.isSelected = element.formElementType === event.detail.formElementType;\n });\n\n this.fieldTypeSelected = event.detail;\n }\n\n showTool(fieldFormType: string): boolean {\n return this.filtertoolbox === null || this.filtertoolbox.split('|').includes(fieldFormType);\n }\n\n private cardRef!: HTMLElement;\n\n @Watch('activeRecipient')\n handleExpandCollapse() {\n if (!this.cardRef) return;\n\n const isActive = this.activeRecipient === this.recipient.signerIndex;\n\n if (isActive) {\n // Expand\n this.cardRef.style.maxHeight = this.cardRef.scrollHeight + 'px';\n } else {\n // Collapse\n this.cardRef.style.maxHeight = '6rem';\n }\n }\n\n componentDidLoad() {\n const isActive = this.activeRecipient === this.recipient.signerIndex;\n this.cardRef.style.maxHeight = isActive ? this.cardRef.scrollHeight + 'px' : '6rem';\n }\n\n render() {\n const recipientFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.recipient.signerIndex) || [];\n const recipientSignatures = recipientFields.filter(f => f.elementType === 'signature' || f.elementType === 'auto sign');\n return (\n <Host>\n <div\n ref={el => (this.cardRef = el)}\n class={`participant-card top-card full-card ${this.activeRecipient === this.recipient.signerIndex ? 'expanded' : ''}`}\n style={{\n background: defaultRolePalette[this.recipient?.signerIndex % 100].s10,\n border: `1px solid ${defaultRolePalette[this.recipient?.signerIndex % 100].s60}`,\n outline: `${this.recipient.signerIndex === this.activeRecipient ? '4px solid ' + defaultRolePalette[this.recipient?.signerIndex % 100].s40 : 'none'}`,\n marginTop: this.recipient.roleType === 'WITNESS' ? '-0.813rem' : '0',\n cursor: 'pointer',\n }}\n onClick={() => {\n this.changeSigner.emit(this.recipient.signerIndex);\n }}\n onMouseEnter={() => {\n this.setIsHovered(true);\n }}\n onMouseLeave={() => {\n this.setIsHovered(false);\n }}\n >\n <div class={'participant-card-inner'}>\n <div class={'participant-card-top-items'}>\n <div\n class={'role-label'}\n style={{\n background: defaultRolePalette[this.recipient?.signerIndex % 100].s20,\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s90,\n }}\n >\n <ls-icon name={this.recipient?.roleType === 'APPROVER' ? 'check-circle' : this.recipient?.roleType === 'WITNESS' ? 'eye' : 'signature'} size='1rem' />\n {this.recipient?.roleType || 'Signer'}\n </div>\n <ls-icon\n name=\"cursor-click\"\n size=\"1rem\"\n customStyle={{ color: defaultRolePalette[this.recipient?.signerIndex % 100].s70 }}\n solid\n style={{ display: this.isHovered && this.recipient.signerIndex !== this.activeRecipient ? 'block' : 'none' }}\n />\n <div\n class=\"dot\"\n style={{ display: (!this.isHovered || this.recipient.signerIndex === this.activeRecipient) && recipientSignatures.length === 0 ? 'block' : 'none' }}\n />\n </div>\n\n <div class={'participant-card-text'}>\n <p\n class=\"participant-text-description\"\n style={{\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s100,\n }}\n >\n {this.recipient?.firstName + ' ' + this.recipient?.lastName}\n </p>\n <p\n class=\"participant-text-type\"\n style={{\n color: defaultRolePalette[this.recipient?.signerIndex % 100].s80,\n }}\n >\n {this.recipient.email}\n </p>\n {/* {this.recipient?.roleType !== 'APPROVER' && (\n <div\n class={'role-label fields'}\n style={{\n background:\n recipientFields.length === 0 ? defaultRolePalette[this.recipient?.signerIndex % 100].s60 : defaultRolePalette[this.recipient?.signerIndex % 100].s20,\n color: recipientFields.length === 0 ? 'white' : defaultRolePalette[this.recipient?.signerIndex % 100].s90,\n // display: this.isHovered && this.recipient.signerIndex !== this.activeRecipient ? '' : 'none',\n }}\n >\n {recipientSignatures.length === 0 && <ls-icon name=\"exclamation-circle\" size=\"16\" style={{ marginRight: '0.125rem' }} />}\n {recipientSignatures.length === 0 ? 'Signature Required' : `${recipientFields.length} ${recipientFields.length === 1 ? 'Field' : 'Fields'}`}\n </div>\n )} */}\n </div>\n\n <div class=\"fields-box\" style={{ display: this.recipient.signerIndex === this.activeRecipient ? 'flex' : 'hidden' }}>\n {this.recipient.signerIndex > 0 && this.showTool('signature') && (\n <ls-toolbox-field\n elementType=\"signature\"\n formElementType=\"signature\"\n label=\"Signature\"\n defaultHeight={27}\n defaultWidth={120}\n validation={0}\n icon=\"signature\"\n tooltip=\"Use this field to collect Signatures from Participants\"\n signer={this.recipient.signerIndex}\n redDot={recipientSignatures.length === 0}\n />\n )}\n\n {this.recipient.signerIndex === 0 && this.showTool('auto sign') && (\n <ls-toolbox-field\n elementType=\"auto sign\"\n formElementType=\"auto sign\"\n label=\"Auto Sign\"\n defaultHeight={27}\n defaultWidth={120}\n validation={3000}\n icon=\"auto-sign\"\n tooltip=\"Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.showTool('text') && (\n <ls-toolbox-field\n elementType=\"text\"\n formElementType=\"text\"\n label=\"Text\"\n defaultHeight={27}\n defaultWidth={100}\n validation={0}\n icon=\"text\"\n tooltip=\"A field for collecting any plain text values such as: names, addresses or descriptions\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.recipient.signerIndex > 0 && this.showTool('signing date') && (\n <ls-toolbox-field\n elementType=\"signing date\"\n formElementType=\"signing date\"\n label=\"Signing Date\"\n defaultHeight={27}\n defaultWidth={120}\n validation={30}\n icon=\"auto-date\"\n tooltip=\"Automatically inserts the date upon completion by the assigned Participant\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('date') && (\n <ls-toolbox-field\n elementType=\"date\"\n formElementType=\"date\"\n label=\"Date\"\n defaultHeight={27}\n defaultWidth={80}\n validation={2}\n icon=\"calender\"\n tooltip=\"A field for collecting dates with built-in date formatting options\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.showTool('email') && (\n <ls-toolbox-field\n elementType=\"email\"\n formElementType=\"email\"\n label=\"Email\"\n defaultHeight={27}\n defaultWidth={120}\n validation={1}\n icon=\"at-symbol\"\n tooltip=\"A Field to only accept entries formatted as an email address (e.g., example@example.com)\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('initials') && (\n <ls-toolbox-field\n elementType=\"initials\"\n formElementType=\"initials\"\n label=\"Initials\"\n defaultHeight={27}\n defaultWidth={120}\n validation={2000}\n icon=\"initials\"\n tooltip=\"Use this field anywhere Participants are required to Initial your document\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('number') && (\n <ls-toolbox-field\n elementType=\"number\"\n formElementType=\"number\"\n label=\"Number\"\n defaultHeight={27}\n defaultWidth={80}\n validation={50}\n icon=\"hashtag\"\n tooltip=\"A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('dropdown') && (\n <ls-toolbox-field\n elementType=\"dropdown\"\n formElementType=\"dropdown\"\n label=\"Dropdown\"\n defaultHeight={27}\n defaultWidth={80}\n validation={20}\n icon=\"dropdown\"\n tooltip=\"Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.showTool('checkbox') && (\n <ls-toolbox-field\n elementType=\"checkbox\"\n formElementType=\"checkbox\"\n label=\"Checkbox\"\n defaultHeight={27}\n defaultWidth={27}\n validation={25}\n icon=\"check\"\n tooltip=\"Places a checkbox on your document. Handy for T&Cs or ✔/✗ sections\"\n signer={this.recipient.signerIndex}\n />\n )}\n\n {this.recipient.signerIndex > 0 && this.showTool('regex') && (\n <ls-toolbox-field\n elementType=\"regex\"\n formElementType=\"regex\"\n label=\"Regex\"\n defaultHeight={27}\n defaultWidth={120}\n validation={93}\n icon=\"code\"\n tooltip=\"Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('image') && (\n <ls-toolbox-field\n elementType=\"image\"\n formElementType=\"image\"\n label=\"Image\"\n defaultHeight={27}\n defaultWidth={120}\n validation={90}\n icon=\"photograph\"\n tooltip=\"Use when you need Participants to upload their own images during the signing process\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('file') && (\n <ls-toolbox-field\n elementType=\"file\"\n formElementType=\"file\"\n label=\"File\"\n defaultHeight={27}\n defaultWidth={120}\n validation={74}\n icon=\"upload\"\n tooltip=\"Use when you need Participants to upload their own documents during the signing process\"\n signer={this.recipient.signerIndex}\n />\n )}\n {this.recipient.signerIndex > 0 && this.showTool('drawn') && (\n <ls-toolbox-field\n elementType=\"drawn\"\n formElementType=\"drawn\"\n label=\"Drawn\"\n defaultHeight={120}\n defaultWidth={120}\n validation={90}\n icon=\"pencil\"\n tooltip=\"Allow users to draw on the document using their mouse or touchscreen\"\n signer={this.recipient.signerIndex}\n />\n )}\n </div>\n </div>\n </div>\n <slot></slot>\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-BhZ5Udbm.js';
|
|
2
|
-
import { d as defineCustomElement$d } from './p-
|
|
3
|
-
import { d as defineCustomElement$c } from './p-
|
|
4
|
-
import { d as defineCustomElement$b } from './p-
|
|
5
|
-
import { d as defineCustomElement$a } from './p-
|
|
6
|
-
import { d as defineCustomElement$9 } from './p-
|
|
7
|
-
import { d as defineCustomElement$8 } from './p-
|
|
8
|
-
import { d as defineCustomElement$7 } from './p-
|
|
9
|
-
import { d as defineCustomElement$6 } from './p-
|
|
10
|
-
import { d as defineCustomElement$5 } from './p-
|
|
11
|
-
import { d as defineCustomElement$4 } from './p-
|
|
12
|
-
import { d as defineCustomElement$3 } from './p-
|
|
13
|
-
import { d as defineCustomElement$2 } from './p-
|
|
14
|
-
import { d as defineCustomElement$1 } from './p-
|
|
2
|
+
import { d as defineCustomElement$d } from './p-D2OTJcln.js';
|
|
3
|
+
import { d as defineCustomElement$c } from './p-CHZeQy3Z.js';
|
|
4
|
+
import { d as defineCustomElement$b } from './p-CUKHkPYp.js';
|
|
5
|
+
import { d as defineCustomElement$a } from './p-BDTgDxaX.js';
|
|
6
|
+
import { d as defineCustomElement$9 } from './p-CkqxItxD.js';
|
|
7
|
+
import { d as defineCustomElement$8 } from './p-BSpwN-xy.js';
|
|
8
|
+
import { d as defineCustomElement$7 } from './p-BFUdzGLI.js';
|
|
9
|
+
import { d as defineCustomElement$6 } from './p-kug3tj7P.js';
|
|
10
|
+
import { d as defineCustomElement$5 } from './p-DnyBXRV4.js';
|
|
11
|
+
import { d as defineCustomElement$4 } from './p-B5cnJ7Uh.js';
|
|
12
|
+
import { d as defineCustomElement$3 } from './p-CwkNbClZ.js';
|
|
13
|
+
import { d as defineCustomElement$2 } from './p-BQL_JBkw.js';
|
|
14
|
+
import { d as defineCustomElement$1 } from './p-Drbp3Wll.js';
|
|
15
15
|
|
|
16
16
|
const lsFieldPropertiesNumberCss = () => `:host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem;width:100%}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{display:flex;gap:0.5rem;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;font-weight:500;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.destructive{border:1px solid var(--red-60, #f04438);background-color:white;color:var(--red-60)}button.destructive:hover{border:1px solid var(--red-70, #d92d20);background:var(--red-10, #fff1f0)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
|
|
17
17
|
|
|
@@ -25,7 +25,7 @@ const LsFieldPropertiesNumber = /*@__PURE__*/ proxyCustomElement(class LsFieldPr
|
|
|
25
25
|
}
|
|
26
26
|
dataItem;
|
|
27
27
|
render() {
|
|
28
|
-
return (h(Host, { key: '
|
|
28
|
+
return (h(Host, { key: 'cc2c8964352e5e6b6d266281a7f747f660005133' }, h("ls-field-properties-container", { key: 'f2d5529532cf2abfa59a2c6ec90281e81e2a5068', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: 'ec018864c78e77b7570a497d1cb985cd11ec67a9', class: 'field-set', slot: "content" }, h("ls-field-content", { key: '49f673e5220bcd1e0db764e15883fb1cd225b06e', dataItem: this.dataItem }), h("ls-field-properties-advanced", { key: '49a5043c391cff90710de9e1a715bbf0dd347431', dataItem: this.dataItem })), h("div", { key: '669a57f7c5ed46518472e38997404be9c6de13e5', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: '6df37aa19b7bb1014875453e3581eca75a639904', dataItem: this.dataItem })), h("div", { key: '2212b1e2a81fa7acf2f9a7a8fd08aa32a89e70e5', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: 'd6d12bb5d35c3a7bdc88e277f7f22006357e8e21', dataItem: this.dataItem }))), h("ls-field-footer", { key: '9c8c889b5d775b98c0e6a14e752e672771803666', dataItem: this.dataItem })));
|
|
29
29
|
}
|
|
30
30
|
static get style() { return lsFieldPropertiesNumberCss(); }
|
|
31
31
|
}, [769, "ls-field-properties-number", {
|
|
@@ -112,6 +112,6 @@ function defineCustomElement() {
|
|
|
112
112
|
defineCustomElement();
|
|
113
113
|
|
|
114
114
|
export { LsFieldPropertiesNumber as L, defineCustomElement as d };
|
|
115
|
-
//# sourceMappingURL=p-
|
|
115
|
+
//# sourceMappingURL=p-SKySuEfc.js.map
|
|
116
116
|
|
|
117
|
-
//# sourceMappingURL=p-
|
|
117
|
+
//# sourceMappingURL=p-SKySuEfc.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-SKySuEfc.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,0BAA0B,GAAG,MAAM,CAAC,mtJAAmtJ,CAAC;;MCQjvJ,uBAAuB,iBAAAA,kBAAA,CAAA,MAAA,uBAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC1B,IAAA,QAAQ;IAEZ,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAA+B,CAAA,+BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC,EAAA,EACzE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,SAAS,EAAA,EACrC,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EAC7C,CAAA,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACrD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,YAAY,EAAA,EACxC,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5C,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,WAAW,EAAA,EACvC,CAAA,CAAA,oBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CAC3C,CACwB,EAChC,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,CACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-number/ls-field-properties-number.css?tag=ls-field-properties-number&encapsulation=shadow","src/components/ls-field-properties-number/ls-field-properties-number.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n height: 100%;\n position: relative;\n}\n\n* {\n margin: 0;\n}\n\n.field-set {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 2.25rem;\n width: 100%;\n}\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n display: flex;\n gap: 0.5rem;\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n font-weight: 500;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.secondary {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--white, #fff);\n color: var(--gray-90, #5e6066);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.secondary:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.destructive {\n border: 1px solid var(--red-60, #f04438);\n background-color: white;\n color: var(--red-60);\n}\n\nbutton.destructive:hover {\n border: 1px solid var(--red-70, #d92d20);\n background: var(--red-10, #fff1f0);\n}\n\n\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n tag: 'ls-field-properties-number',\n styleUrl: 'ls-field-properties-number.css',\n shadow: true,\n})\nexport class LsFieldPropertiesNumber {\n @Prop() dataItem: LSApiElement;\n \n render() {\n return (\n <Host>\n <ls-field-properties-container tabs={['content', 'placement', 'dimensions']}>\n <div class={'field-set'} slot=\"content\">\n <ls-field-content dataItem={this.dataItem} />\n <ls-field-properties-advanced dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"dimensions\">\n <ls-field-dimensions dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"placement\">\n <ls-field-placement dataItem={this.dataItem} />\n </div>\n </ls-field-properties-container>\n <ls-field-footer dataItem={this.dataItem} />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-BhZ5Udbm.js';
|
|
2
2
|
import { d as defaultRolePalette } from './p-BKrsDBDB.js';
|
|
3
3
|
import { g as getFieldIcon } from './p-Cp3IxvzK.js';
|
|
4
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$1 } from './p-DnyBXRV4.js';
|
|
5
5
|
|
|
6
6
|
const defaultFieldLabels = {
|
|
7
7
|
'signature': 'Signature',
|
|
@@ -75,14 +75,14 @@ const LsFieldTypeDisplay = /*@__PURE__*/ proxyCustomElement(class LsFieldTypeDis
|
|
|
75
75
|
fieldType = 'signature';
|
|
76
76
|
render() {
|
|
77
77
|
const color = defaultRolePalette[this.assignee % 100];
|
|
78
|
-
return (h(Host, { key: '
|
|
78
|
+
return (h(Host, { key: 'a6789ca82e6e4261c1193f6db019733d34904f14', class: 'ls-field-type-wrapper', style: {
|
|
79
79
|
border: `1px dashed ${color.s30}`,
|
|
80
80
|
background: color.s10,
|
|
81
|
-
} }, h("div", { key: '
|
|
81
|
+
} }, h("div", { key: 'a95e889ef2e532547ac9879dbba7a5d2d00a86c7', class: 'ls-field-type-inner' }, h("div", { key: '9762ab0e1daa88b474caff3cc1f527642d746473', class: 'ls-field-type-icon', style: {
|
|
82
82
|
border: `1px solid ${color.s60}`,
|
|
83
83
|
color: color.s60,
|
|
84
84
|
background: color.s10,
|
|
85
|
-
} }, h("ls-icon", { key: '
|
|
85
|
+
} }, h("ls-icon", { key: '26e53ab3b01fe6657f670f173238b07a0e0c5698', name: getFieldIcon(this.fieldType), size: "1.25rem" })), h("p", { key: '756ae8d043fd195e0d8258f5feb31a76105d817b', class: 'ls-field-type-name' }, getFieldLabel(this.fieldType)))));
|
|
86
86
|
}
|
|
87
87
|
static get style() { return lsFieldTypeDisplayCss(); }
|
|
88
88
|
}, [769, "ls-field-type-display", {
|
|
@@ -110,6 +110,6 @@ function defineCustomElement() {
|
|
|
110
110
|
defineCustomElement();
|
|
111
111
|
|
|
112
112
|
export { LsFieldTypeDisplay as L, getFieldTitleSuggestion as a, defineCustomElement as d, getFieldPlaceholder as g };
|
|
113
|
-
//# sourceMappingURL=p-
|
|
113
|
+
//# sourceMappingURL=p-kug3tj7P.js.map
|
|
114
114
|
|
|
115
|
-
//# sourceMappingURL=p-
|
|
115
|
+
//# sourceMappingURL=p-kug3tj7P.js.map
|