legalesign-document-viewer 0.2.18 → 0.3.0
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/{index-DqDUg8D7.js → index-DruwRbfl.js} +15 -2
- package/dist/cjs/index-DruwRbfl.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/ls-document-options_44.cjs.entry.js +133 -86
- package/dist/cjs/ls-document-options_44.cjs.entry.js.map +1 -1
- package/dist/cjs/ls-document-viewer.cjs.js +2 -2
- package/dist/cjs/ls-field-properties-dropdown.cjs.entry.js +1 -1
- package/dist/collection/components/ls-document-options/ls-document-options.js +4 -5
- package/dist/collection/components/ls-document-options/ls-document-options.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/editorUtils.js +2 -17
- package/dist/collection/components/ls-document-viewer/editorUtils.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.css +6 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +42 -26
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/mouseHandlers.js +7 -4
- package/dist/collection/components/ls-document-viewer/mouseHandlers.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/validator.js +1 -1
- package/dist/collection/components/ls-document-viewer/validator.js.map +1 -1
- package/dist/collection/components/ls-field-properties-container/ls-field-properties-container.js +3 -3
- package/dist/collection/components/ls-field-properties-container/ls-field-properties-container.js.map +1 -1
- package/dist/collection/components/ls-participant-card/ls-participant-card.css +37 -3
- package/dist/collection/components/ls-participant-card/ls-participant-card.js +37 -10
- package/dist/collection/components/ls-participant-card/ls-participant-card.js.map +1 -1
- package/dist/collection/components/ls-participant-manager/ls-participant-manager.js +25 -7
- package/dist/collection/components/ls-participant-manager/ls-participant-manager.js.map +1 -1
- package/dist/collection/components/ls-participant-select/ls-participant-select.js +33 -36
- package/dist/collection/components/ls-participant-select/ls-participant-select.js.map +1 -1
- package/dist/collection/components/ls-toolbar/ls-toolbar.css +2 -1
- package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
- package/dist/collection/components/ls-toolbar/ls-toolbar.js.map +1 -1
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js +3 -2
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/ls-document-options.js +1 -1
- package/dist/components/ls-document-viewer.js +93 -74
- 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 +12 -12
- 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 +1 -1
- package/dist/components/ls-icon.js +1 -1
- package/dist/components/ls-input-wrapper.js +1 -1
- package/dist/components/ls-number-input.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-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-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-validation-tag.js +1 -1
- package/dist/components/{p-D3FTfizs.js → p-5D8PsBm3.js} +4 -4
- package/dist/components/{p-D3FTfizs.js.map → p-5D8PsBm3.js.map} +1 -1
- package/dist/components/{p-DMMnoA4j.js → p-5bipMnyu.js} +27 -27
- package/dist/components/{p-DMMnoA4j.js.map → p-5bipMnyu.js.map} +1 -1
- package/dist/components/{p-PlRt3hai.js → p-5dvIIDY3.js} +4 -4
- package/dist/components/{p-PlRt3hai.js.map → p-5dvIIDY3.js.map} +1 -1
- package/dist/components/{p-BjFkOQE2.js → p-8U1vQjh6.js} +14 -14
- package/dist/components/{p-BjFkOQE2.js.map → p-8U1vQjh6.js.map} +1 -1
- package/dist/components/{p-DedKsdai.js → p-B3nXZzYN.js} +4 -4
- package/dist/components/{p-DedKsdai.js.map → p-B3nXZzYN.js.map} +1 -1
- package/dist/components/{p-D7kumolq.js → p-BClQCPwn.js} +4 -4
- package/dist/components/{p-D7kumolq.js.map → p-BClQCPwn.js.map} +1 -1
- package/dist/components/{p-D9m0QSvy.js → p-BLqzepwP.js} +5 -5
- package/dist/components/{p-D9m0QSvy.js.map → p-BLqzepwP.js.map} +1 -1
- package/dist/components/p-BO65LHPL.js +147 -0
- package/dist/components/p-BO65LHPL.js.map +1 -0
- package/dist/components/{p-BilmyMZI.js → p-BOES-kpO.js} +14 -14
- package/dist/components/{p-BilmyMZI.js.map → p-BOES-kpO.js.map} +1 -1
- package/dist/components/{p-DjfDnBZ1.js → p-BWLt02JN.js} +15 -2
- package/dist/components/p-BWLt02JN.js.map +1 -0
- package/dist/components/{p-B_NmEzQ7.js → p-BYfxQYIe.js} +14 -14
- package/dist/components/{p-B_NmEzQ7.js.map → p-BYfxQYIe.js.map} +1 -1
- package/dist/components/{p-BRLSnaia.js → p-BZmc1jRS.js} +12 -12
- package/dist/components/{p-BRLSnaia.js.map → p-BZmc1jRS.js.map} +1 -1
- package/dist/components/{p-HwxhESdb.js → p-B_RSAYa_.js} +4 -4
- package/dist/components/{p-HwxhESdb.js.map → p-B_RSAYa_.js.map} +1 -1
- package/dist/components/{p-BTkwdXtg.js → p-BcERGojX.js} +3 -3
- package/dist/components/{p-BTkwdXtg.js.map → p-BcERGojX.js.map} +1 -1
- package/dist/components/{p-XTkbfo1k.js → p-BdHdKShC.js} +5 -5
- package/dist/components/{p-XTkbfo1k.js.map → p-BdHdKShC.js.map} +1 -1
- package/dist/components/{p-WpDmGPlV.js → p-C19Sk5Pv.js} +9 -9
- package/dist/components/{p-WpDmGPlV.js.map → p-C19Sk5Pv.js.map} +1 -1
- package/dist/components/{p-B-MQpwUM.js → p-C1qHGnSs.js} +4 -19
- package/dist/components/p-C1qHGnSs.js.map +1 -0
- package/dist/components/{p-Diiu5PgI.js → p-C2AvJYU2.js} +4 -4
- package/dist/components/{p-Diiu5PgI.js.map → p-C2AvJYU2.js.map} +1 -1
- package/dist/components/{p-zUGMkAns.js → p-C4yNfeqL.js} +4 -4
- package/dist/components/{p-zUGMkAns.js.map → p-C4yNfeqL.js.map} +1 -1
- package/dist/components/p-CATruwEZ.js +94 -0
- package/dist/components/p-CATruwEZ.js.map +1 -0
- package/dist/components/{p-1WwuurWL.js → p-CDXBrRc3.js} +7 -6
- package/dist/components/p-CDXBrRc3.js.map +1 -0
- package/dist/components/{p-FDV-xQ4p.js → p-CFM4LGyt.js} +14 -14
- package/dist/components/{p-FDV-xQ4p.js.map → p-CFM4LGyt.js.map} +1 -1
- package/dist/components/{p-DWNbQoKy.js → p-CIMsSQwZ.js} +36 -17
- package/dist/components/p-CIMsSQwZ.js.map +1 -0
- package/dist/components/{p-BhIPFVxz.js → p-CKpdUPQa.js} +4 -4
- package/dist/components/{p-BhIPFVxz.js.map → p-CKpdUPQa.js.map} +1 -1
- package/dist/components/{p-DkNcLKhc.js → p-CTcGU-0M.js} +4 -4
- package/dist/components/{p-DkNcLKhc.js.map → p-CTcGU-0M.js.map} +1 -1
- package/dist/components/{p-D_w94geo.js → p-CXf5rRrm.js} +3 -3
- package/dist/components/{p-D_w94geo.js.map → p-CXf5rRrm.js.map} +1 -1
- package/dist/components/{p-BHrfmA8s.js → p-CXfTLG4X.js} +15 -16
- package/dist/components/p-CXfTLG4X.js.map +1 -0
- package/dist/components/{p-w22N5I-l.js → p-CYXQyrVE.js} +3 -3
- package/dist/components/{p-w22N5I-l.js.map → p-CYXQyrVE.js.map} +1 -1
- package/dist/components/{p-CsQFaTRj.js → p-CkFBf2X6.js} +8 -8
- package/dist/components/{p-CsQFaTRj.js.map → p-CkFBf2X6.js.map} +1 -1
- package/dist/components/{p-CWzJSXfJ.js → p-CkgCA2si.js} +4 -4
- package/dist/components/{p-CWzJSXfJ.js.map → p-CkgCA2si.js.map} +1 -1
- package/dist/components/{p-udzp6R_t.js → p-Cp5JvKGz.js} +30 -12
- package/dist/components/p-Cp5JvKGz.js.map +1 -0
- package/dist/components/{p-B_6X4Dj9.js → p-D7fmSEF_.js} +14 -14
- package/dist/components/{p-B_6X4Dj9.js.map → p-D7fmSEF_.js.map} +1 -1
- package/dist/components/{p-C1dxLL7L.js → p-DJwEQOhf.js} +3 -3
- package/dist/components/{p-C1dxLL7L.js.map → p-DJwEQOhf.js.map} +1 -1
- package/dist/components/{p-C4WAsTO3.js → p-DNYMtQaJ.js} +14 -14
- package/dist/components/{p-C4WAsTO3.js.map → p-DNYMtQaJ.js.map} +1 -1
- package/dist/components/{p-Cj_UymrF.js → p-DPTEeSlE.js} +5 -5
- package/dist/components/p-DPTEeSlE.js.map +1 -0
- package/dist/components/{p-Dkv2SHBh.js → p-DVYZ-l9i.js} +4 -4
- package/dist/components/{p-Dkv2SHBh.js.map → p-DVYZ-l9i.js.map} +1 -1
- package/dist/components/{p-BFkGGLWP.js → p-DjBw61k9.js} +14 -14
- package/dist/components/{p-BFkGGLWP.js.map → p-DjBw61k9.js.map} +1 -1
- package/dist/components/{p-BSoSLQYh.js → p-DvrE7Co1.js} +4 -4
- package/dist/components/{p-BSoSLQYh.js.map → p-DvrE7Co1.js.map} +1 -1
- package/dist/components/{p-D2YMJ0Aw.js → p-Dz71sI_1.js} +9 -9
- package/dist/components/{p-D2YMJ0Aw.js.map → p-Dz71sI_1.js.map} +1 -1
- package/dist/components/{p-BhfOYgiv.js → p-EJeMGdQu.js} +5 -5
- package/dist/components/{p-BhfOYgiv.js.map → p-EJeMGdQu.js.map} +1 -1
- package/dist/components/{p-DwVBt06x.js → p-EXjgBKTQ.js} +4 -4
- package/dist/components/{p-DwVBt06x.js.map → p-EXjgBKTQ.js.map} +1 -1
- package/dist/components/{p-Cq59orUr.js → p-FYWJbZt4.js} +4 -4
- package/dist/components/{p-Cq59orUr.js.map → p-FYWJbZt4.js.map} +1 -1
- package/dist/components/{p-By0To2FW.js → p-TSI6GwEl.js} +4 -4
- package/dist/components/{p-By0To2FW.js.map → p-TSI6GwEl.js.map} +1 -1
- package/dist/components/{p-Cu1yVewC.js → p-gc1S5qea.js} +14 -14
- package/dist/components/{p-Cu1yVewC.js.map → p-gc1S5qea.js.map} +1 -1
- package/dist/components/{p-CpNSQOFF.js → p-pj0dnyXK.js} +4 -4
- package/dist/components/{p-CpNSQOFF.js.map → p-pj0dnyXK.js.map} +1 -1
- package/dist/esm/{index-BwkWPcyG.js → index-CjW5NqdW.js} +15 -2
- package/dist/esm/index-CjW5NqdW.js.map +1 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/ls-document-options_44.entry.js +133 -86
- package/dist/esm/ls-document-options_44.entry.js.map +1 -1
- package/dist/esm/ls-document-viewer.js +3 -3
- package/dist/esm/ls-field-properties-dropdown.entry.js +1 -1
- package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
- package/dist/ls-document-viewer/{p-8473f817.entry.js → p-316dbde4.entry.js} +6 -6
- package/dist/ls-document-viewer/p-316dbde4.entry.js.map +1 -0
- package/dist/ls-document-viewer/{p-7c302d79.entry.js → p-798903b4.entry.js} +2 -2
- package/dist/ls-document-viewer/{p-BwkWPcyG.js → p-CjW5NqdW.js} +2 -2
- package/dist/ls-document-viewer/p-CjW5NqdW.js.map +1 -0
- package/dist/types/components/ls-document-options/ls-document-options.d.ts +1 -1
- package/dist/types/components/ls-document-viewer/ls-document-viewer.d.ts +10 -5
- package/dist/types/components/ls-participant-card/ls-participant-card.d.ts +5 -1
- package/dist/types/components/ls-participant-manager/ls-participant-manager.d.ts +4 -0
- package/dist/types/components/ls-participant-select/ls-participant-select.d.ts +2 -2
- package/dist/types/components.d.ts +8 -8
- package/package.json +1 -1
- package/readme.md +39 -74
- package/dist/cjs/index-DqDUg8D7.js.map +0 -1
- package/dist/components/p-1WwuurWL.js.map +0 -1
- package/dist/components/p-B-MQpwUM.js.map +0 -1
- package/dist/components/p-BHrfmA8s.js.map +0 -1
- package/dist/components/p-BY5udTK7.js +0 -94
- package/dist/components/p-BY5udTK7.js.map +0 -1
- package/dist/components/p-Cj_UymrF.js.map +0 -1
- package/dist/components/p-DWNbQoKy.js.map +0 -1
- package/dist/components/p-DjfDnBZ1.js.map +0 -1
- package/dist/components/p-lkNnKQtr.js +0 -140
- package/dist/components/p-lkNnKQtr.js.map +0 -1
- package/dist/components/p-udzp6R_t.js.map +0 -1
- package/dist/esm/index-BwkWPcyG.js.map +0 -1
- package/dist/ls-document-viewer/p-8473f817.entry.js.map +0 -1
- package/dist/ls-document-viewer/p-BwkWPcyG.js.map +0 -1
- /package/dist/ls-document-viewer/{p-7c302d79.entry.js.map → p-798903b4.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-5dvIIDY3.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,2nIAA2nI;;MCSzoI,eAAe,iBAAAA,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;;;;;;AAClB,IAAA,IAAI;AACJ,IAAA,KAAK;AACL,IAAA,WAAW;AACX,IAAA,IAAI;AACJ,IAAA,QAAQ;AACR,IAAA,QAAQ;AACR,IAAA,WAAW;AACX,IAAA,QAAQ;AACR,IAAA,KAAK;AACL,IAAA,KAAK;AACL,IAAA,QAAQ;AACR,IAAA,WAAW;AACX,IAAA,UAAU;AACV,IAAA,SAAS;IAEjB,MAAM,GAAA;AACJ,QAAA,MAAM,EACJ,IAAI,EACJ,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAAW,EACX,UAAU,EACV,SAAS,GACV,GAAG,IAAI;AAER,QAAA,MAAM,UAAU,GAAG,IAAI,CACrB,YAAY,EACZ;AACE,cAAE;cACA,KAAK,IAAI;AACT,kBAAE;AACF,kBAAE,KAAK,IAAI,CAAC;AACV,sBAAE;AACF,sBAAE;AACA,0BAAE;0BACA,SAAS,EACnB,SAAS,IAAI,YAAY,EACzB,KAAK,IAAI,cAAc,EACvB,UAAU,IAAI,cAAc,EAC5B,UAAU,IAAI,KAAK,IAAI,mBAAmB,CAC3C;QAED,QACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,MAAM,EAAA,EACf,SAAS,KACR,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,QAAQ,GAAG,mBAAmB,GAAG,WAAW,EAChD,IAAI,EAAE,SAAS,GACN,CACZ,EACD,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,UAAU,EACjB,EAAE,EAAE,IAAI,EACR,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,QAAQ,EACnB,WAAW,EAAE,WAAW,EACZ,YAAA,EAAA,IAAI,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,CAAA,EACF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACrB,KAAK,IAAI,CAAC,QAAQ,KACjB,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,KAAK,GAAG,WAAW,GAAG,aAAa,EACvC,IAAI,EAAE,KAAK,GAAG,cAAc,GAAG,oBAAoB,GAC1C,CACZ,EACA,UAAU,KACT,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,WAAW,EAAA,EACzC,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,EAAE,EAAC,YAAY,EAAC,IAAI,EAAE,UAAU,EAAA,CAAY,CAC9C,CACV,CACG,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.css?tag=ls-textarea-input&encapsulation=shadow","src/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.tsx"],"sourcesContent":["* {\n box-sizing: border-box;\n font-family: \"IBM Plex\", sans-serif;\n margin: 0;\n}\n\n.host {\n position: relative;\n display: flex;\n width: 100%;\n}\n\n#fieldIcon {\n position: absolute;\n top: 0.5rem;\n left: 0.75rem;\n color: var(--gray-80);\n}\n\n#fieldIconDisabled {\n position: absolute;\n top: 0.5rem;\n left: 0.75rem;\n color: var(--gray-60);\n}\n\n.icon-input {\n padding-left: 2.5rem !important;\n}\n\n.button-input {\n padding-right: 2.5rem !important;\n}\n\n.right-items-input {\n padding-right: 4rem !important;\n}\n\n.input-base {\n display: flex;\n resize: vertical;\n width: 100%;\n min-height: 4rem;\n padding: 0.5rem 0.75rem;\n align-items: center;\n gap: 0.5rem;\n align-self: stretch;\n border-radius: 0.5rem;\n /* Shadow/sm */\n box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);\n overflow: hidden;\n text-overflow: ellipsis;\n /* text-sm/leading-5/font-regular */\n font-size: 0.875rem;\n font-style: normal;\n font-weight: 400;\n}\n\n.input-base:active:not(:disabled) {\n outline: 1px solid var(--Legalesign-Blue-60, #4456f6);\n box-shadow:\n 0px 0px 3px 0px rgba(0, 15, 153, 0.25),\n 0px 0px 2px 0px rgba(0, 15, 153, 0.06),\n 0px 0px 0px 4px #9dc3fc;\n}\n\n.input-base:focus:not(:disabled) {\n outline: 1px solid var(--Legalesign-Blue-60, #4456f6);\n box-shadow:\n 0px 0px 3px 0px rgba(0, 15, 153, 0.25),\n 0px 0px 2px 0px rgba(0, 15, 153, 0.06),\n 0px 0px 0px 4px #9dc3fc;\n}\n\n.default {\n border: 1px solid var(--gray-40, #d8d9dc);\n background: var(--White, #fff);\n color: var(--gray-100);\n}\n\n.default:hover {\n border: 1px solid var(--gray-50, #d8d9dc);\n background: var(--White, #fff);\n color: var(--gray-110);\n}\n\n.disabled {\n border: 1px solid var(--gray-40, #d8d9dc);\n background: var(--gray-10, #f7f8fa);\n color: var(--gray-60);\n cursor: not-allowed;\n}\n\n.invalid {\n border: 1px solid var(--red-40, #ffa19e);\n background: var(--White, #fff);\n color: var(--Red-100, #7a1714);\n}\n\n.invalid:hover {\n border: 1px solid var(--red-50, #ffa19e);\n background: var(--White, #fff);\n color: var(--Red-100, #7a1714);\n}\n\n.valid {\n border: 1px solid var(--green-40, #72f0c2);\n background: var(--White, #fff);\n color: var(--Green-100, #125241);\n}\n\n.valid:hover {\n border: 1px solid var(--green-50, #72f0c2);\n background: var(--White, #fff);\n color: var(--Green-100, #125241);\n}\n\n.right-items {\n position: absolute;\n padding: 0.25rem;\n height: 36px;\n right: 0;\n top: 0;\n display: flex;\n align-items: center;\n}\n\n#invalidIcon {\n margin: 0 0.5rem;\n color: var(--red-70);\n}\n\n#validIcon {\n margin: 0 0.5rem;\n color: var(--green-60);\n}\n\n.button {\n display: flex;\n height: 28px;\n width: 28px;\n padding: 0.25rem;\n justify-content: center;\n align-items: center;\n border-radius: 0.375rem;\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--White, #fff);\n box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);\n\n #buttonIcon {\n color: var(--gray-90);\n }\n}\n\n.button:hover {\n display: flex;\n height: 28px;\n width: 28px;\n padding: 0.25rem;\n justify-content: center;\n align-items: center;\n border-radius: 0.375rem;\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-20, #edeff2);\n box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);\n\n #buttonIcon {\n color: var(--gray-100);\n }\n}\n\n.button:active {\n display: flex;\n height: 28px;\n width: 28px;\n padding: 0.25rem;\n justify-content: center;\n align-items: center;\n border-radius: 0.375rem;\n border: 1px solid var(--Primary-Blue-Light, #4456f6);\n background: var(--White, #fff);\n box-shadow:\n 0px 0px 4px 0px #c7ddff inset,\n 0px 0px 0px 4px #9dc3fc;\n\n #buttonIcon {\n color: var(--gray-100);\n }\n}\n\n.button:focus {\n display: flex;\n height: 28px;\n width: 28px;\n padding: 0.25rem;\n justify-content: center;\n align-items: center;\n border-radius: 0.375rem;\n border: 1px solid var(--Primary-Blue-Light, #4456f6);\n background: var(--White, #fff);\n box-shadow:\n 0px 0px 4px 0px #c7ddff inset,\n 0px 0px 0px 4px #9dc3fc;\n\n #buttonIcon {\n color: var(--gray-100);\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { Icon } from '../../../../types/Icon';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'ls-textarea-input',\n styleUrl: 'ls-textarea-input.css',\n shadow: true,\n})\nexport class LsTextareaInput {\n @Prop() name: string;\n @Prop() value?: string;\n @Prop() placeholder?: string;\n @Prop() aria?: string;\n @Prop() inputRef?: string;\n @Prop() disabled: boolean;\n @Prop() displayOnly: boolean;\n @Prop() required: boolean;\n @Prop() valid: boolean;\n @Prop() dirty: boolean;\n @Prop() countMax: number;\n @Prop() buttonClick?: any;\n @Prop() buttonIcon?: Icon;\n @Prop() fieldIcon?: Icon;\n\n render() {\n const {\n name,\n value,\n placeholder,\n aria,\n disabled,\n displayOnly,\n required,\n valid,\n dirty,\n countMax,\n buttonClick,\n buttonIcon,\n fieldIcon,\n } = this;\n\n const inputClass = clsx(\n 'input-base',\n disabled\n ? 'disabled'\n : dirty && valid\n ? 'valid'\n : dirty && !valid\n ? 'invalid'\n : displayOnly\n ? 'displayOnly'\n : 'default',\n fieldIcon && 'icon-input',\n dirty && 'button-input',\n buttonIcon && 'button-input',\n buttonIcon && dirty && 'right-items-input',\n );\n\n return (\n <host class='host'>\n {fieldIcon && (\n <ls-icon\n id={disabled ? 'fieldIconDisabled' : 'fieldIcon'}\n name={fieldIcon}\n ></ls-icon>\n )}\n <textarea\n class={inputClass}\n id={name}\n name={name}\n value={value}\n maxlength={countMax}\n placeholder={placeholder}\n aria-label={aria}\n required={required}\n disabled={disabled}\n />\n <div class='right-items'>\n {dirty && !disabled && (\n <ls-icon\n id={valid ? 'validIcon' : 'invalidIcon'}\n name={valid ? 'check-circle' : 'exclamation-circle'}\n ></ls-icon>\n )}\n {buttonIcon && (\n <button class='button' onClick={buttonClick}>\n <ls-icon id='buttonIcon' name={buttonIcon}></ls-icon>\n </button>\n )}\n </div>\n </host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, d as Host } from './p-
|
|
2
|
-
import { d as defineCustomElement$b } from './p-
|
|
3
|
-
import { d as defineCustomElement$a } from './p-
|
|
4
|
-
import { d as defineCustomElement$9 } from './p-
|
|
5
|
-
import { d as defineCustomElement$8 } from './p-
|
|
6
|
-
import { d as defineCustomElement$7 } from './p-
|
|
7
|
-
import { d as defineCustomElement$6 } from './p-
|
|
8
|
-
import { d as defineCustomElement$5 } from './p-
|
|
9
|
-
import { d as defineCustomElement$4 } from './p-
|
|
10
|
-
import { d as defineCustomElement$3 } from './p-
|
|
11
|
-
import { d as defineCustomElement$2 } from './p-
|
|
12
|
-
import { d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, d as Host } from './p-BWLt02JN.js';
|
|
2
|
+
import { d as defineCustomElement$b } from './p-C19Sk5Pv.js';
|
|
3
|
+
import { d as defineCustomElement$a } from './p-pj0dnyXK.js';
|
|
4
|
+
import { d as defineCustomElement$9 } from './p-DvrE7Co1.js';
|
|
5
|
+
import { d as defineCustomElement$8 } from './p-CTcGU-0M.js';
|
|
6
|
+
import { d as defineCustomElement$7 } from './p-BdHdKShC.js';
|
|
7
|
+
import { d as defineCustomElement$6 } from './p-DPTEeSlE.js';
|
|
8
|
+
import { d as defineCustomElement$5 } from './p-BClQCPwn.js';
|
|
9
|
+
import { d as defineCustomElement$4 } from './p-CXf5rRrm.js';
|
|
10
|
+
import { d as defineCustomElement$3 } from './p-C4yNfeqL.js';
|
|
11
|
+
import { d as defineCustomElement$2 } from './p-CYXQyrVE.js';
|
|
12
|
+
import { d as defineCustomElement$1 } from './p-DJwEQOhf.js';
|
|
13
13
|
|
|
14
14
|
const lsFieldPropertiesSignatureCss = ":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:36px;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)}";
|
|
15
15
|
|
|
@@ -98,6 +98,6 @@ function defineCustomElement() {
|
|
|
98
98
|
defineCustomElement();
|
|
99
99
|
|
|
100
100
|
export { LsFieldPropertiesSignature as L, defineCustomElement as d };
|
|
101
|
-
//# sourceMappingURL=p-
|
|
101
|
+
//# sourceMappingURL=p-8U1vQjh6.js.map
|
|
102
102
|
|
|
103
|
-
//# sourceMappingURL=p-
|
|
103
|
+
//# sourceMappingURL=p-8U1vQjh6.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-8U1vQjh6.js","mappings":";;;;;;;;;;;;;AAAA,MAAM,6BAA6B,GAAG,ktJAAktJ;;MCQ3uJ,0BAA0B,iBAAAA,kBAAA,CAAA,MAAA,0BAAA,SAAAC,CAAA,CAAA;;;;;;AAC7B,IAAA,QAAQ;IAEhB,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,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,mBAAmB,EAAE,KAAK,EAAI,CAAA,EACzE,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-signature/ls-field-properties-signature.css?tag=ls-field-properties-signature&encapsulation=shadow","src/components/ls-field-properties-signature/ls-field-properties-signature.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: 36px;\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-signature',\n styleUrl: 'ls-field-properties-signature.css',\n shadow: true,\n})\nexport class LsFieldPropertiesSignature {\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} showValidationTypes={false} />\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,6 +1,6 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h } from './p-BWLt02JN.js';
|
|
2
2
|
import { c as clsx } from './p-ChV9xqsO.js';
|
|
3
|
-
import { d as defineCustomElement$1 } from './p-
|
|
3
|
+
import { d as defineCustomElement$1 } from './p-CXf5rRrm.js';
|
|
4
4
|
|
|
5
5
|
const lsRadioInputCss = ".radioLabel{display:flex;align-items:center;gap:0.75rem;border-radius:0.5rem;padding:0.5rem 0.75rem}.radioLabel.checked{background-color:var(--primary-10);border-color:var(--primary-20);color:var(--primary-90)}.radioLabel:not(checked){color:var(--gray-90);background-color:var(--gray-10);border:1px solid var(--gray-20)}.radioLabel.checked:hover{border-color:var(--primary-30);color:var(--primary-100)}.radioLabel:not(.checked):not(.disabled):hover{border-color:var(--gray-50);color:var(--gray-100)}.radioLabel:focus:not(.disabled){box-shadow:var(--focus-box-shadow);outline-offset:var(--focus-outline-offset);outline:none}.radioLabel.disabled{cursor:not-allowed}.radioLabel.disabled.checked{background-color:var(--primary-10);color:var(--primary-40);border-color:var(--primary-40)}.radioLabel.disabled:not(.checked){background-color:var(--gray-10);color:var(--gray-60)}.inputClass{margin-top:0px}.inputClass:focus{outline:none}.inputClass:disabled{cursor:not-allowed}.spanContainer{display:flex;gap:0.25rem;align-items:center}";
|
|
6
6
|
|
|
@@ -52,6 +52,6 @@ function defineCustomElement() {
|
|
|
52
52
|
defineCustomElement();
|
|
53
53
|
|
|
54
54
|
export { LsRadioInput as L, defineCustomElement as d };
|
|
55
|
-
//# sourceMappingURL=p-
|
|
55
|
+
//# sourceMappingURL=p-B3nXZzYN.js.map
|
|
56
56
|
|
|
57
|
-
//# sourceMappingURL=p-
|
|
57
|
+
//# sourceMappingURL=p-B3nXZzYN.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-B3nXZzYN.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,qgCAAqgC;;MCShhC,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;;;;;AACf,IAAA,OAAO;AACP,IAAA,KAAK;AACL,IAAA,IAAI;IACJ,IAAI,GAAY,MAAM;IACtB,OAAO,GAAY,KAAK;IACxB,QAAQ,GAAa,KAAK;AAC1B,IAAA,WAAW;IAEnB,MAAM,GAAA;AACJ,QAAA,MAAM,EACJ,KAAK,EACL,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,WAAW,GACZ,GAAG,IAAI;AACR,QAAA,MAAM,eAAe,GAAG,IAAI,CAC1B,YAAY,EACZ,QAAQ,IAAI,UAAU,EACtB,OAAO,IAAI,SAAS,CACrB;AAED,QAAA,QACE,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,eAAe,EACtB,KAAK,EAAE,WAAW,EAAA,EAElB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,YAAY,EAClB,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,OAAO,EAChB,CAAA,EACF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,IAAI,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAA,CAAY,CAAQ,EAClE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAO,KAAK,CAAQ,CAChB,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.css?tag=ls-radio-input","src/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.tsx"],"sourcesContent":[".radioLabel{\n display: flex;\n align-items: center;\n gap: 0.75rem;\n border-radius: 0.5rem;\n padding: 0.5rem 0.75rem;\n}\n\n.radioLabel.checked {\n background-color: var(--primary-10);\n border-color: var(--primary-20);\n color: var(--primary-90)\n}\n\n.radioLabel:not(checked) {\n color: var(--gray-90);\n background-color: var(--gray-10);\n border: 1px solid var(--gray-20);\n}\n\n.radioLabel.checked:hover {\n border-color: var(--primary-30);\n color: var(--primary-100);\n \n}\n\n.radioLabel:not(.checked):not(.disabled):hover {\n border-color: var(--gray-50);\n color: var(--gray-100);\n}\n\n.radioLabel:focus:not(.disabled) {\n box-shadow: var(--focus-box-shadow);\n outline-offset: var(--focus-outline-offset);\n outline: none;\n}\n\n.radioLabel.disabled {\n cursor: not-allowed;\n}\n\n.radioLabel.disabled.checked {\n background-color: var(--primary-10);\n color: var(--primary-40);\n border-color: var(--primary-40);\n}\n\n.radioLabel.disabled:not(.checked) {\n background-color: var(--gray-10);\n color: var(--gray-60);\n}\n\n.inputClass {\n margin-top: 0px;\n}\n\n.inputClass:focus {\n outline: none;\n}\n\n.inputClass:disabled {\n cursor: not-allowed;\n}\n\n.spanContainer {\n display: flex;\n gap: 0.25rem;\n align-items: center;\n}","import { Component, Prop, h } from '@stencil/core';\nimport { Icon } from '../../../../types/Icon';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'ls-radio-input',\n styleUrl: 'ls-radio-input.css',\n shadow: false,\n})\nexport class LsRadioInput {\n @Prop() radioId: string;\n @Prop() label: string;\n @Prop() icon?: Icon;\n @Prop() name?: string = 'name';\n @Prop() checked: boolean = false;\n @Prop() disabled?: boolean = false;\n @Prop() customStyle?: { [key: string]: string };\n\n render() {\n const {\n label,\n radioId,\n icon,\n name,\n disabled,\n checked,\n customStyle,\n } = this;\n const radioLabelClass = clsx(\n 'radioLabel',\n disabled && 'disabled',\n checked && 'checked',\n );\n\n return (\n <label\n htmlFor={radioId}\n tabIndex={0}\n class={radioLabelClass}\n style={customStyle}\n >\n <input\n type='radio'\n class='inputClass'\n id={radioId}\n name={name}\n value={label}\n disabled={disabled}\n tabIndex={0}\n checked={checked}\n />\n <div class='spanContainer'>\n <span>{icon && <ls-icon name={icon} size={\"16\"}></ls-icon>}</span>\n <span>{label}</span>\n </div>\n </label>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, d as Host } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, d as Host } from './p-BWLt02JN.js';
|
|
2
2
|
import { d as defaultRolePalette } from './p-CwCWCxsI.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-CXf5rRrm.js';
|
|
5
5
|
|
|
6
6
|
const defaultFieldLabels = {
|
|
7
7
|
'signature': 'Signature',
|
|
@@ -70,6 +70,6 @@ function defineCustomElement() {
|
|
|
70
70
|
defineCustomElement();
|
|
71
71
|
|
|
72
72
|
export { LsFieldTypeDisplay as L, defineCustomElement as d };
|
|
73
|
-
//# sourceMappingURL=p-
|
|
73
|
+
//# sourceMappingURL=p-BClQCPwn.js.map
|
|
74
74
|
|
|
75
|
-
//# sourceMappingURL=p-
|
|
75
|
+
//# sourceMappingURL=p-BClQCPwn.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-BClQCPwn.js","mappings":";;;;;AAAO,MAAM,kBAAkB,GAA8B;AAC3D,IAAA,WAAW,EAAE,WAAW;AACxB,IAAA,WAAW,EAAE,WAAW;AACxB,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,cAAc,EAAE,WAAW;AAC3B,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,UAAU,EAAE,UAAU;AACtB,IAAA,UAAU,EAAE,UAAU;AACtB,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,QAAQ,EAAE,QAAQ;AAClB,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,UAAU,EAAE,UAAU;AACtB,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,aAAa,EAAE,MAAM;AACrB,IAAA,oBAAoB,EAAE,OAAO;CAC9B;AAEK,SAAU,aAAa,CAAC,GAAW,EAAA;AACvC,IAAA,OAAO,kBAAkB,CAAC,GAAG,CAAC,IAAI,SAAS;AAC7C;;ACnBA,MAAM,qBAAqB,GAAG,whBAAwhB;;MCUziB,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;;;;;;AACrB,IAAA,QAAQ;IACR,SAAS,GAAW,WAAW;IAEvC,MAAM,GAAA;QACJ,MAAM,KAAK,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;AACrD,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE,uBAAuB,EAC9B,KAAK,EAAE;AACL,gBAAA,MAAM,EAAE,CAAA,WAAA,EAAc,KAAK,CAAC,GAAG,CAAE,CAAA;gBACjC,UAAU,EAAE,KAAK,CAAC,GAAG;AACtB,aAAA,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,qBAAqB,EAAA,EAC/B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,oBAAoB,EAC3B,KAAK,EAAE;AACL,gBAAA,MAAM,EAAE,CAAA,UAAA,EAAa,KAAK,CAAC,GAAG,CAAE,CAAA;gBAChC,KAAK,EAAE,KAAK,CAAC,GAAG;gBAChB,UAAU,EAAE,KAAK,CAAC,GAAG;aACtB,EAAA,EAED,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAAC,IAAI,GAAG,CACrD,EACN,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAE,oBAAoB,EAAA,EAAG,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAK,CAC/D,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-document-viewer/defaultFieldLabels.ts","src/components/ls-field-type-display/ls-field-type-display.css?tag=ls-field-type-display&encapsulation=shadow","src/components/ls-field-type-display/ls-field-type-display.tsx"],"sourcesContent":["export const defaultFieldLabels: { [key: string]: string } = {\n 'signature': 'Signature',\n 'auto sign': 'Auto Sign',\n 'text': 'Text',\n 'signing date': 'Auto Date',\n 'date': 'Date',\n 'initials': 'Initials',\n 'checkbox': 'Checkbox',\n 'email': 'Email',\n 'number': 'Number',\n 'image': 'Image',\n 'dropdown': 'Dropdown',\n 'file': 'File',\n 'drawn field': 'Draw',\n 'regular expression': 'RegEx',\n};\n\nexport function getFieldLabel(key: string): string | undefined {\n return defaultFieldLabels[key] || 'Unknown';\n}\n",":host {\n position: relative;\n border-radius: 0.875rem;\n padding: 0.25rem;\n}\n\n* {\n margin: 0;\n}\n\n.ls-field-type-inner {\n border-radius: 0.625rem;\n background: var(--white, #fff);\n display: flex;\n padding: 0.25rem 0.5rem 0.25rem 0.25rem;\n align-items: center;\n gap: 0.875rem;\n align-self: stretch;\n}\n\n.ls-field-type-icon {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n border-radius: 0.5rem;\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-field-type-name {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1.5rem; /* 150% */\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { getFieldLabel } from '../ls-document-viewer/defaultFieldLabels';\nimport { getFieldIcon } from '../ls-document-viewer/defaultFieldIcons';\n\n@Component({\n tag: 'ls-field-type-display',\n styleUrl: 'ls-field-type-display.css',\n shadow: true,\n})\nexport class LsFieldTypeDisplay {\n @Prop() assignee: number;\n @Prop() fieldType: string = 'signature';\n\n render() {\n const color = defaultRolePalette[this.assignee % 100];\n return (\n <Host\n class={'ls-field-type-wrapper'}\n style={{\n border: `1px dashed ${color.s30}`,\n background: color.s10,\n }}\n >\n <div class={'ls-field-type-inner'}>\n <div\n class={'ls-field-type-icon'}\n style={{\n border: `1px solid ${color.s60}`,\n color: color.s60,\n background: color.s10,\n }}\n >\n <ls-icon name={getFieldIcon(this.fieldType)} size=\"20\" />\n </div>\n <p class={'ls-field-type-name'}>{getFieldLabel(this.fieldType)}</p>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
|
|
2
|
-
import { b as getInputType } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-BWLt02JN.js';
|
|
2
|
+
import { b as getInputType } from './p-C1qHGnSs.js';
|
|
3
3
|
import { d as defaultRolePalette } from './p-CwCWCxsI.js';
|
|
4
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$1 } from './p-CXf5rRrm.js';
|
|
5
5
|
|
|
6
6
|
const lsEditorFieldCss = ":host{display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}.required-icon{position:absolute;top:2px;right:2px;color:var(--red-60, #f64a44)}";
|
|
7
7
|
|
|
@@ -176,6 +176,6 @@ function defineCustomElement() {
|
|
|
176
176
|
defineCustomElement();
|
|
177
177
|
|
|
178
178
|
export { LsEditorField as L, defineCustomElement as d };
|
|
179
|
-
//# sourceMappingURL=p-
|
|
179
|
+
//# sourceMappingURL=p-BLqzepwP.js.map
|
|
180
180
|
|
|
181
|
-
//# sourceMappingURL=p-
|
|
181
|
+
//# sourceMappingURL=p-BLqzepwP.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-D9m0QSvy.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-editor-field/ls-editor-field.css?tag=ls-editor-field&encapsulation=shadow","src/components/ls-editor-field/ls-editor-field.tsx"],"sourcesContent":[":host {\n display: block;\n position: absolute;\n margin: 0px;\n padding: 0px 0px 0px 0px;\n isolation: isolate;\n}\n\n.ls-editor-field-editable {\n display: block;\n font-family: inherit;\n font-size: inherit;\n overflow: hidden;\n\n /* no extra spaces */\n white-space: nowrap;\n margin: 0;\n padding: 0px 0px 0px 0px;\n /* default widths */\n min-width: 2em;\n height: 100%;\n width: 100%;\n}\n\n.ls-editor-field {\n opacity: 0.7;\n}\n\n.ls-editor-field-editable:focus {\n outline: none;\n}\n\n.ls-editor-field-draggable {\n display: block;\n font-family: inherit;\n font-size: inherit;\n overflow: hidden;\n\n /* no extra spaces */\n white-space: nowrap;\n\n /* default widths */\n min-width: 2px;\n height: 98%;\n width: 98%;\n}\n\n/* .is-selected {\n border: 1px dotted rgb(193, 26, 26);\n} */\n\n.hidden-field {\n display: none;\n}\n\ninput {\n all: unset;\n}\n\n.draggable-input {\n font-family: inherit;\n font-size: inherit;\n position: relative;\n height: 95%;\n width: 95%;\n}\n\n.editing-input {\n caret-color: rgb(15 23 42);\n caret-shape: auto;\n height: 100%;\n width: 100%;\n}\n\n.required-icon {\n position: absolute;\n top: 2px;\n right: 2px;\n color: var(--red-60, #f64a44);\n}\n","import { Component, Host, h, Element, State, Prop, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../components';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { getInputType } from '../ls-document-viewer/editorUtils';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-editor-field',\n styleUrl: 'ls-editor-field.css',\n shadow: true,\n})\nexport class LsEditorField {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() selected: boolean = false;\n @Prop() readonly: boolean;\n @Prop() type: 'text' | 'signature' | 'date' | 'regex' | 'file' | 'number' | 'autodate';\n @Prop() page: { height: number; width: number };\n @State() isEditing: boolean = false;\n @State() heldEdge: string = null;\n @State() isEdgeDragging: boolean = false;\n @State() innerValue: string;\n private sizeObserver: ResizeObserver;\n\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n @Listen('keydown')\n handleInput(e: KeyboardEvent) {\n if (e.code === 'Enter') {\n this.isEditing = false;\n this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));\n }\n }\n\n @Listen('mousemove', { capture: true })\n handleMouseMove(e) {\n if (this.readonly) return;\n if (!e.clientX) return;\n\n // Determine which edge is being moved over and what cursor to show.\n if (Math.abs(e.offsetX) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetX - this.component.clientWidth) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetY) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else if (Math.abs(e.offsetY - this.component.clientHeight) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else {\n this.component.style.cursor = 'move';\n }\n }\n\n @Listen('dblclick', { capture: true })\n handleDoubleClick() {\n if (this.readonly) return;\n this.isEditing = true;\n this.heldEdge = null;\n this.isEdgeDragging = false;\n this.sizeObserver.disconnect();\n this.innerValue = this.innerValue ? this.innerValue : this.dataItem?.value;\n\n const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLInputElement;\n console.log(this.dataItem);\n\n if (editbox) {\n editbox.className = 'ls-editor-field-editable';\n editbox.focus();\n }\n }\n\n @Listen('dragstart', { capture: false, passive: false })\n handleDragStart(event) {\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n type: this.type,\n }),\n );\n event.dataTransfer.dropEffect = 'move';\n }\n\n @Watch('selected')\n watchSelectedHandler(_newValue: boolean, _oldValue: boolean) {\n if (_newValue) {\n this.component.style.background = defaultRolePalette[this.dataItem?.signer % 100].s20;\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = '#ffffff';\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = 'none';\n }\n }\n\n componentDidLoad() {\n this.sizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n if (entry.contentRect) {\n // const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLElement;\n const movebox = this.component.shadowRoot.getElementById('field-info') as HTMLElement;\n // console.log(editbox)\n // editbox.style.height = entry.contentRect.height + \"px\"\n // editbox.style.width = entry.contentRect.width + \"px\"\n\n movebox.style.height = entry.contentRect.height + 'px';\n movebox.style.width = entry.contentRect.width + 'px';\n }\n }\n });\n\n this.sizeObserver.observe(this.component);\n\n // New dropped components automatically need selecting.\n if (this.selected) {\n this.component.style.background = defaultRolePalette[this.dataItem?.signer % 100].s20;\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = '#ffffff';\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = 'none';\n }\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 900);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }, delay);\n }\n\n render() {\n return (\n <Host style={{ border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` }}>\n <div\n class={{\n 'ls-editor-field': true,\n 'is-selected': this.selected,\n }}\n >\n {!this.dataItem?.optional && <ls-icon name=\"required\" size=\"12\" class=\"required-icon\" customStyle={{ verticalAlign: 'top'}}/>}\n <input\n id=\"editing-input\"\n class={this.isEditing ? 'ls-editor-field-editable' : 'hidden-field'}\n type={getInputType(this.dataItem.validation).inputType}\n value={this.dataItem?.value}\n checked={this.dataItem?.value ? true : false}\n onInput={e => this.alter({ value: (e.target as HTMLInputElement).value })}\n />\n\n <div id=\"field-info\" class={this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable'}>\n {this.dataItem.value.length && this.dataItem.value || this.dataItem?.label || this.dataItem?.formElementType}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-BLqzepwP.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-editor-field/ls-editor-field.css?tag=ls-editor-field&encapsulation=shadow","src/components/ls-editor-field/ls-editor-field.tsx"],"sourcesContent":[":host {\n display: block;\n position: absolute;\n margin: 0px;\n padding: 0px 0px 0px 0px;\n isolation: isolate;\n}\n\n.ls-editor-field-editable {\n display: block;\n font-family: inherit;\n font-size: inherit;\n overflow: hidden;\n\n /* no extra spaces */\n white-space: nowrap;\n margin: 0;\n padding: 0px 0px 0px 0px;\n /* default widths */\n min-width: 2em;\n height: 100%;\n width: 100%;\n}\n\n.ls-editor-field {\n opacity: 0.7;\n}\n\n.ls-editor-field-editable:focus {\n outline: none;\n}\n\n.ls-editor-field-draggable {\n display: block;\n font-family: inherit;\n font-size: inherit;\n overflow: hidden;\n\n /* no extra spaces */\n white-space: nowrap;\n\n /* default widths */\n min-width: 2px;\n height: 98%;\n width: 98%;\n}\n\n/* .is-selected {\n border: 1px dotted rgb(193, 26, 26);\n} */\n\n.hidden-field {\n display: none;\n}\n\ninput {\n all: unset;\n}\n\n.draggable-input {\n font-family: inherit;\n font-size: inherit;\n position: relative;\n height: 95%;\n width: 95%;\n}\n\n.editing-input {\n caret-color: rgb(15 23 42);\n caret-shape: auto;\n height: 100%;\n width: 100%;\n}\n\n.required-icon {\n position: absolute;\n top: 2px;\n right: 2px;\n color: var(--red-60, #f64a44);\n}\n","import { Component, Host, h, Element, State, Prop, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../components';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { getInputType } from '../ls-document-viewer/editorUtils';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-editor-field',\n styleUrl: 'ls-editor-field.css',\n shadow: true,\n})\nexport class LsEditorField {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() selected: boolean = false;\n @Prop() readonly: boolean;\n @Prop() type: 'text' | 'signature' | 'date' | 'regex' | 'file' | 'number' | 'autodate';\n @Prop() page: { height: number; width: number };\n @State() isEditing: boolean = false;\n @State() heldEdge: string = null;\n @State() isEdgeDragging: boolean = false;\n @State() innerValue: string;\n private sizeObserver: ResizeObserver;\n\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n @Listen('keydown')\n handleInput(e: KeyboardEvent) {\n if (e.code === 'Enter') {\n this.isEditing = false;\n this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));\n }\n }\n\n @Listen('mousemove', { capture: true })\n handleMouseMove(e) {\n if (this.readonly) return;\n if (!e.clientX) return;\n\n // Determine which edge is being moved over and what cursor to show.\n if (Math.abs(e.offsetX) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetX - this.component.clientWidth) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetY) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else if (Math.abs(e.offsetY - this.component.clientHeight) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else {\n this.component.style.cursor = 'move';\n }\n }\n\n @Listen('dblclick', { capture: true })\n handleDoubleClick() {\n if (this.readonly) return;\n this.isEditing = true;\n this.heldEdge = null;\n this.isEdgeDragging = false;\n this.sizeObserver.disconnect();\n this.innerValue = this.innerValue ? this.innerValue : this.dataItem?.value;\n\n const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLInputElement;\n console.log(this.dataItem);\n\n if (editbox) {\n editbox.className = 'ls-editor-field-editable';\n editbox.focus();\n }\n }\n\n @Listen('dragstart', { capture: false, passive: false })\n handleDragStart(event) {\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n type: this.type,\n }),\n );\n event.dataTransfer.dropEffect = 'move';\n }\n\n @Watch('selected')\n watchSelectedHandler(_newValue: boolean, _oldValue: boolean) {\n if (_newValue) {\n this.component.style.background = defaultRolePalette[this.dataItem?.signer % 100].s20;\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = '#ffffff';\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = 'none';\n }\n }\n\n componentDidLoad() {\n this.sizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n if (entry.contentRect) {\n // const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLElement;\n const movebox = this.component.shadowRoot.getElementById('field-info') as HTMLElement;\n // console.log(editbox)\n // editbox.style.height = entry.contentRect.height + \"px\"\n // editbox.style.width = entry.contentRect.width + \"px\"\n\n movebox.style.height = entry.contentRect.height + 'px';\n movebox.style.width = entry.contentRect.width + 'px';\n }\n }\n });\n\n this.sizeObserver.observe(this.component);\n\n // New dropped components automatically need selecting.\n if (this.selected) {\n this.component.style.background = defaultRolePalette[this.dataItem?.signer % 100].s20;\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = '#ffffff';\n this.component.style.opacity = '0.7';\n this.component.style.boxShadow = 'none';\n }\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 900);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }, delay);\n }\n\n render() {\n return (\n <Host style={{ border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` }}>\n <div\n class={{\n 'ls-editor-field': true,\n 'is-selected': this.selected,\n }}\n >\n {!this.dataItem?.optional && <ls-icon name=\"required\" size=\"12\" class=\"required-icon\" customStyle={{ verticalAlign: 'top'}}/>}\n <input\n id=\"editing-input\"\n class={this.isEditing ? 'ls-editor-field-editable' : 'hidden-field'}\n type={getInputType(this.dataItem.validation).inputType}\n value={this.dataItem?.value}\n checked={this.dataItem?.value ? true : false}\n onInput={e => this.alter({ value: (e.target as HTMLInputElement).value })}\n />\n\n <div id=\"field-info\" class={this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable'}>\n {this.dataItem.value.length && this.dataItem.value || this.dataItem?.label || this.dataItem?.formElementType}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-BWLt02JN.js';
|
|
2
|
+
import { d as defaultRolePalette } from './p-CwCWCxsI.js';
|
|
3
|
+
import { d as defineCustomElement$2 } from './p-CXf5rRrm.js';
|
|
4
|
+
import { d as defineCustomElement$1 } from './p-C4yNfeqL.js';
|
|
5
|
+
|
|
6
|
+
const lsParticipantCardCss = ":host{display:block}*{box-sizing:border-box;margin:0}.participant-card{display:flex;padding:0.625rem;flex-direction:column;align-items:flex-start;gap:0.5rem;align-self:stretch}.top-card{border-radius:1rem 1rem 0 0}.full-card{border-radius:1rem}.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;}.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%}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:36px;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)}";
|
|
7
|
+
|
|
8
|
+
const LsParticipantCard = /*@__PURE__*/ proxyCustomElement(class LsParticipantCard extends H {
|
|
9
|
+
constructor() {
|
|
10
|
+
super();
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
this.__attachShadow();
|
|
13
|
+
this.mutate = createEvent(this, "mutate");
|
|
14
|
+
this.update = createEvent(this, "update");
|
|
15
|
+
this.opened = createEvent(this, "opened");
|
|
16
|
+
this.addParticipant = createEvent(this, "addParticipant");
|
|
17
|
+
}
|
|
18
|
+
get component() { return this; }
|
|
19
|
+
signer;
|
|
20
|
+
index;
|
|
21
|
+
editable = false;
|
|
22
|
+
template;
|
|
23
|
+
mutate;
|
|
24
|
+
update;
|
|
25
|
+
opened;
|
|
26
|
+
// Send one or more mutations up the chain
|
|
27
|
+
// The source of the chain fires the mutation
|
|
28
|
+
// NOTE this alter is debounced to account for typing
|
|
29
|
+
alter(diff) {
|
|
30
|
+
this.signer = { ...this.signer, ...diff };
|
|
31
|
+
this.debounce(this.signer, 500);
|
|
32
|
+
}
|
|
33
|
+
labeltimer;
|
|
34
|
+
debounce(data, delay) {
|
|
35
|
+
if (this.labeltimer)
|
|
36
|
+
clearTimeout(this.labeltimer);
|
|
37
|
+
this.labeltimer = setTimeout(() => {
|
|
38
|
+
const diffs = [{ action: 'update', data }];
|
|
39
|
+
this.mutate.emit(diffs);
|
|
40
|
+
this.update.emit(diffs);
|
|
41
|
+
}, delay);
|
|
42
|
+
}
|
|
43
|
+
deleteHandler(role) {
|
|
44
|
+
this.update.emit([{ action: 'delete', data: role }]);
|
|
45
|
+
this.mutate.emit([{ action: 'delete', data: role }]);
|
|
46
|
+
}
|
|
47
|
+
swapHandler(role1, role2) {
|
|
48
|
+
this.update.emit([{ action: 'swap', data: role1, data2: role2 }]);
|
|
49
|
+
this.mutate.emit([{ action: 'swap', data: role1, data2: role2 }]);
|
|
50
|
+
}
|
|
51
|
+
modeHandler(_editable) {
|
|
52
|
+
// When opened fire an event to let the parent handle closing other controls
|
|
53
|
+
if (_editable) {
|
|
54
|
+
this.opened.emit(this.signer);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
addParticipant;
|
|
58
|
+
render() {
|
|
59
|
+
const participantFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.signer.signerIndex) || [];
|
|
60
|
+
const child = this.template.roles.find(r => r.signerParent === this.signer.id);
|
|
61
|
+
return (h(Host, { key: '050ce0bf860dfebc0f79d45295b6876a8c714c61' }, h("div", { key: '03a6151b022ee20de49836d55362ca7842d91c2b', class: 'participant-card' + (child ? ' top-card' : this.signer?.signerParent ? ' bottom-card' : ' full-card'), style: {
|
|
62
|
+
background: defaultRolePalette[this.signer?.signerIndex % 100].s10,
|
|
63
|
+
border: `1px solid ${defaultRolePalette[this.signer?.signerIndex % 100].s60}`,
|
|
64
|
+
marginTop: this.signer.roleType === 'WITNESS' ? '-0.813rem' : '0',
|
|
65
|
+
}, onMouseEnter: e => e.currentTarget.querySelector('.button-set')?.classList.remove('hidden'), onMouseLeave: e => e.currentTarget.querySelector('.button-set')?.classList.add('hidden'), onDblClick: () => {
|
|
66
|
+
this.editable = true;
|
|
67
|
+
} }, h("div", { key: '4471c63e21cba70ca9c99e08518b58aa27d51ba7', class: 'participant-card-inner' }, h("div", { key: '2880b2ada85743bb5aebb533cf51e837b275329e', class: 'participant-card-top-items' }, h("div", { key: '3d4eb8164d136326349cece0b18f5c53b0f88a49', class: 'role-label', style: {
|
|
68
|
+
background: defaultRolePalette[this.signer?.signerIndex % 100].s20,
|
|
69
|
+
color: defaultRolePalette[this.signer?.signerIndex % 100].s90,
|
|
70
|
+
} }, h("ls-icon", { key: 'dad3b4055bdd45df6f8e5085f459961da09d010f', name: this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye' }), 'Participant ' + (this.signer?.signerIndex || '')), h("div", { key: '07fe8b88998c7121217db858c231dcc1cc1707fe', class: 'button-set hidden' }, this.index > 0 && this.signer.roleType !== 'WITNESS' && (h("div", { key: '830f21fbae631a0e8e42af15a91d67c9547c1c01', class: "innerButton", onClick: () => {
|
|
71
|
+
this.swapHandler(this.signer, this.template.roles[this.index - 1]);
|
|
72
|
+
}, style: {
|
|
73
|
+
'--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
|
|
74
|
+
'--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
|
|
75
|
+
} }, h("ls-icon", { key: '8b09d4c2d21c0da1d1e2b8d259808f17db459cbb', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (h("div", { key: '615157461249449a36d2de250682f61476a9f201', class: "innerButton", onClick: () => {
|
|
76
|
+
this.swapHandler(this.signer, this.template.roles[this.index + 1]);
|
|
77
|
+
}, style: {
|
|
78
|
+
'--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
|
|
79
|
+
'--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
|
|
80
|
+
} }, h("ls-icon", { key: 'f5272e02633d855779e651e7210f93d345832b88', name: "arrow-down", size: "18" }))), h("div", { key: '83fcb361f4610ca0f08db9d6be84ad3cf3abd5d8', class: "innerButton", onClick: () => {
|
|
81
|
+
this.editable = !this.editable;
|
|
82
|
+
}, style: {
|
|
83
|
+
'--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
|
|
84
|
+
'--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
|
|
85
|
+
} }, h("ls-icon", { key: '9aea4e29845683be3ab72ad4aba8897e2e8f4a2f', name: this.editable ? 'check' : 'pencil-alt', size: "18" })), h("div", { key: '451e0cc218f1f505e64a9783902d8627c4c1a005', class: "innerButton", onClick: () => {
|
|
86
|
+
this.deleteHandler(this.signer);
|
|
87
|
+
}, style: {
|
|
88
|
+
'--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
|
|
89
|
+
'--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
|
|
90
|
+
} }, h("ls-icon", { key: '5678a46062f0ea120d60e070a86f5b1a75d06662', name: "trash", size: "18" })))), this.editable ? (h("div", { class: 'participant-card-inner' }, this.signer?.roleType !== 'WITNESS' ? (h("ls-input-wrapper", { select: true, leadingIcon: this.signer?.roleType === 'APPROVER' ? 'check-circle' : 'signature' }, h("select", { name: "roleType", id: "role-type", class: 'has-leading-icon', onChange: e => this.alter({ roleType: e.target.value }), disabled: child ? true : false }, h("option", { value: "APPROVER", selected: this.signer?.roleType === 'APPROVER' }, "Approver"), h("option", { value: "SIGNER", selected: this.signer?.roleType === 'SIGNER' }, "Signer")))) : (h("ls-input-wrapper", { leadingIcon: "eye" }, h("input", { name: "roleType", id: "role-type", class: 'has-leading-icon', disabled: true, value: "Witness" }))), h("input", { type: "text", id: "participant-description", name: "participantDescription", placeholder: "Description, eg. Tenant 1, Agent", defaultValue: this.signer.name, onInput: e => this.alter({ name: e.target.value }), onKeyUp: e => {
|
|
91
|
+
if (e.key === 'Enter' || e.keyCode === 13)
|
|
92
|
+
this.editable = false;
|
|
93
|
+
} }), this.signer?.roleType === 'SIGNER' && !child ? (h("button", { class: 'tertiary', onClick: () => this.addParticipant.emit({ type: 'WITNESS', parent: this.signer.id }) }, h("ls-icon", { name: "plus", style: { marginRight: '0.25rem' } }), "Add Witness")) : this.signer?.roleType === 'SIGNER' && child ? (h("button", { class: 'destructive', onClick: () => {
|
|
94
|
+
this.deleteHandler(child);
|
|
95
|
+
} }, h("ls-icon", { name: "minus-sm", style: { marginRight: '0.25rem' } }), "Remove Witness")) : this.signer?.roleType === 'WITNESS' ? (h("button", { class: 'destructive', onClick: () => {
|
|
96
|
+
this.deleteHandler(this.signer);
|
|
97
|
+
} }, h("ls-icon", { name: "minus-sm", style: { marginRight: '0.25rem' } }), "Remove Witness")) : null)) : (h("div", { class: 'participant-card-text' }, h("p", { class: "participant-text-description", style: {
|
|
98
|
+
color: defaultRolePalette[this.signer?.signerIndex % 100].s100,
|
|
99
|
+
} }, this.signer.name || `${this.signer.signerIndex > 100 ? 'Witness' : 'Signer'} ${this.signer.signerIndex + 1}`), h("p", { class: "participant-text-type", style: {
|
|
100
|
+
color: defaultRolePalette[this.signer?.signerIndex % 100].s80,
|
|
101
|
+
textTransform: 'capitalize',
|
|
102
|
+
} }, this.signer.roleType.toLowerCase()), this.signer?.roleType !== 'APPROVER' && (h("div", { class: 'role-label fields', style: {
|
|
103
|
+
background: participantFields.length === 0 ? defaultRolePalette[this.signer?.signerIndex % 100].s60 : defaultRolePalette[this.signer?.signerIndex % 100].s20,
|
|
104
|
+
color: participantFields.length === 0 ? 'white' : defaultRolePalette[this.signer?.signerIndex % 100].s90,
|
|
105
|
+
} }, participantFields.length === 0 && h("ls-icon", { name: "exclamation-circle", size: "16", style: { marginRight: '0.125rem' } }), participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`)))))), h("slot", { key: 'ba159f7a2d34de4926bb44ce1aca658cd470833d' })));
|
|
106
|
+
}
|
|
107
|
+
static get watchers() { return {
|
|
108
|
+
"editable": ["modeHandler"]
|
|
109
|
+
}; }
|
|
110
|
+
static get style() { return lsParticipantCardCss; }
|
|
111
|
+
}, [257, "ls-participant-card", {
|
|
112
|
+
"signer": [16],
|
|
113
|
+
"index": [2],
|
|
114
|
+
"editable": [1028],
|
|
115
|
+
"template": [16]
|
|
116
|
+
}, undefined, {
|
|
117
|
+
"editable": ["modeHandler"]
|
|
118
|
+
}]);
|
|
119
|
+
function defineCustomElement() {
|
|
120
|
+
if (typeof customElements === "undefined") {
|
|
121
|
+
return;
|
|
122
|
+
}
|
|
123
|
+
const components = ["ls-participant-card", "ls-icon", "ls-input-wrapper"];
|
|
124
|
+
components.forEach(tagName => { switch (tagName) {
|
|
125
|
+
case "ls-participant-card":
|
|
126
|
+
if (!customElements.get(tagName)) {
|
|
127
|
+
customElements.define(tagName, LsParticipantCard);
|
|
128
|
+
}
|
|
129
|
+
break;
|
|
130
|
+
case "ls-icon":
|
|
131
|
+
if (!customElements.get(tagName)) {
|
|
132
|
+
defineCustomElement$2();
|
|
133
|
+
}
|
|
134
|
+
break;
|
|
135
|
+
case "ls-input-wrapper":
|
|
136
|
+
if (!customElements.get(tagName)) {
|
|
137
|
+
defineCustomElement$1();
|
|
138
|
+
}
|
|
139
|
+
break;
|
|
140
|
+
} });
|
|
141
|
+
}
|
|
142
|
+
defineCustomElement();
|
|
143
|
+
|
|
144
|
+
export { LsParticipantCard as L, defineCustomElement as d };
|
|
145
|
+
//# sourceMappingURL=p-BO65LHPL.js.map
|
|
146
|
+
|
|
147
|
+
//# sourceMappingURL=p-BO65LHPL.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-BO65LHPL.js","mappings":";;;;;AAAA,MAAM,oBAAoB,GAAG,28MAA28M;;MCW39M,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AAEpB,IAAA,MAAM;AACN,IAAA,KAAK;IACY,QAAQ,GAAY,KAAK;AAC1C,IAAA,QAAQ;AAOhB,IAAA,MAAM;AAON,IAAA,MAAM;AAON,IAAA,MAAM;;;;AAKN,IAAA,KAAK,CAAC,IAAY,EAAA;AAChB,QAAA,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,EAAE;QACzC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC;;AAGzB,IAAA,UAAU;IAElB,QAAQ,CAAC,IAAI,EAAE,KAAK,EAAA;QAClB,IAAI,IAAI,CAAC,UAAU;AAAE,YAAA,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;AAElD,QAAA,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,MAAK;YAChC,MAAM,KAAK,GAAoB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAC3D,YAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;AACvB,YAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;SACxB,EAAE,KAAK,CAAC;;AAGX,IAAA,aAAa,CAAC,IAAe,EAAA;AAC3B,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;AACpD,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;;IAGtD,WAAW,CAAC,KAAK,EAAE,KAAK,EAAA;QACtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;QACjE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;;AAInE,IAAA,WAAW,CAAC,SAAS,EAAA;;QAEnB,IAAI,SAAS,EAAE;YACb,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;;;AAQjC,IAAA,cAAc;IAEd,MAAM,GAAA;AACJ,QAAA,MAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,EAAE;QAClI,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,KAAK,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;QAE9E,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,kBAAkB,IAAI,KAAK,GAAG,WAAW,GAAG,IAAI,CAAC,MAAM,EAAE,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC,EAC7G,KAAK,EAAE;AACL,gBAAA,UAAU,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAClE,gBAAA,MAAM,EAAE,CAAA,UAAA,EAAa,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG,CAAE,CAAA;AAC7E,gBAAA,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,KAAK,SAAS,GAAG,WAAW,GAAG,GAAG;aAClE,EACD,YAAY,EAAE,CAAC,IAAK,CAAC,CAAC,aAA6B,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,EAC5G,YAAY,EAAE,CAAC,IAAK,CAAC,CAAC,aAA6B,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,EACzG,UAAU,EAAE,MAAK;AACf,gBAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;aACrB,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,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAClE,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;aAC9D,EAAA,EAED,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,QAAQ,GAAG,WAAW,GAAG,KAAK,EAAI,CAAA,EAClI,cAAc,IAAI,IAAI,CAAC,MAAM,EAAE,WAAW,IAAI,EAAE,CAAC,CAC9C,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,mBAAmB,EAAA,EAC5B,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,KAAK,SAAS,KACnD,4DACE,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,MAAK;gBACZ,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;aACnE,EACD,KAAK,EAAE;AACL,gBAAA,yBAAyB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACjF,gBAAA,uBAAuB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAChF,aAAA,EAAA,EAED,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,IAAI,EAAG,CAAA,CACjC,CACP,EACA,IAAI,CAAC,MAAM,CAAC,WAAW,KAAK,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,KAAK,SAAS,KAC3F,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,MAAK;gBACZ,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;aACnE,EACD,KAAK,EAAE;AACL,gBAAA,yBAAyB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACjF,gBAAA,uBAAuB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAChF,aAAA,EAAA,EAED,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,EAAG,CAAA,CACnC,CACP,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ;aAC/B,EACD,KAAK,EAAE;AACL,gBAAA,yBAAyB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACjF,gBAAA,uBAAuB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;aAChF,EAAA,EAED,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,OAAO,GAAG,YAAY,EAAE,IAAI,EAAC,IAAI,GAAG,CAC/D,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC;aAChC,EACD,KAAK,EAAE;AACL,gBAAA,yBAAyB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACjF,gBAAA,uBAAuB,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAChF,aAAA,EAAA,EAED,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,IAAI,EAAA,CAAG,CAC9B,CACF,CACF,EACL,IAAI,CAAC,QAAQ,IACZ,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,wBAAwB,EAAA,EACjC,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,SAAS,IAClC,CAAkB,CAAA,kBAAA,EAAA,EAAA,MAAM,EAAC,IAAA,EAAA,WAAW,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,UAAU,GAAG,cAAc,GAAG,WAAW,EAAA,EACvG,CAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,kBAAkB,EACzB,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,QAAQ,EAAG,CAAC,CAAC,MAA4B,CAAC,KAAK,EAAE,CAAC,EAC9E,QAAQ,EAAE,KAAK,GAAG,IAAI,GAAG,KAAK,EAAA,EAE9B,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,UAAU,EAE9D,EAAA,UAAA,CAAA,EACT,CAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,QAAQ,EAE1D,EAAA,QAAA,CAAA,CACF,CACQ,KAEnB,CAAA,CAAA,kBAAA,EAAA,EAAkB,WAAW,EAAC,KAAK,EAAA,EACjC,CAAA,CAAA,OAAA,EAAA,EAAO,IAAI,EAAC,UAAU,EAAC,EAAE,EAAC,WAAW,EAAC,KAAK,EAAE,kBAAkB,EAAE,QAAQ,EAAC,IAAA,EAAA,KAAK,EAAC,SAAS,EAAA,CAAG,CAC3E,CACpB,EACD,CACE,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,MAAM,EACX,EAAE,EAAC,yBAAyB,EAC5B,IAAI,EAAC,wBAAwB,EAC7B,WAAW,EAAC,kCAAkC,EAC9C,YAAY,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAC9B,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,EAAG,CAAC,CAAC,MAA2B,CAAC,KAAK,EAAE,CAAC,EACxE,OAAO,EAAE,CAAC,IAAG;gBACX,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,OAAO,KAAK,EAAE;AAAE,oBAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;aACjE,EACD,CAAA,EACD,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,QAAQ,IAAI,CAAC,KAAK,IAC3C,CAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,EAAA,EAC7G,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,EAAI,CAAA,gBAEnD,IACP,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,QAAQ,IAAI,KAAK,IAC7C,CAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAE,aAAa,EACpB,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC;aAC1B,EAAA,EAED,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,EAAI,CAAA,mBAEvD,IACP,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,SAAS,IACrC,cACE,KAAK,EAAE,aAAa,EACpB,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC;aAChC,EAAA,EAED,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,EAAI,CAAA,EAEvD,gBAAA,CAAA,IACP,IAAI,CACJ,KAEN,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,uBAAuB,EAAA,EACjC,CAAA,CAAA,GAAA,EAAA,EACE,KAAK,EAAC,8BAA8B,EACpC,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,IAAI;aAC/D,EAAA,EAEA,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW,GAAG,GAAG,GAAG,SAAS,GAAG,QAAQ,CAAI,CAAA,EAAA,IAAI,CAAC,MAAM,CAAC,WAAW,GAAG,CAAC,EAAE,CAC3G,EACJ,CAAA,CAAA,GAAA,EAAA,EACE,KAAK,EAAC,uBAAuB,EAC7B,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AAC7D,gBAAA,aAAa,EAAE,YAAY;AAC5B,aAAA,EAEA,EAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,CACjC,EACH,IAAI,CAAC,MAAM,EAAE,QAAQ,KAAK,UAAU,KACnC,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE,mBAAmB,EAC1B,KAAK,EAAE;AACL,gBAAA,UAAU,EAAE,iBAAiB,CAAC,MAAM,KAAK,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG,GAAG,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;gBAC5J,KAAK,EAAE,iBAAiB,CAAC,MAAM,KAAK,CAAC,GAAG,OAAO,GAAG,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,GAAG;AACzG,aAAA,EAAA,EAEA,iBAAiB,CAAC,MAAM,KAAK,CAAC,IAAI,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,oBAAoB,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,EAAI,CAAA,EACrH,iBAAiB,CAAC,MAAM,KAAK,CAAC,GAAG,oBAAoB,GAAG,GAAG,iBAAiB,CAAC,MAAM,CAAA,CAAA,EAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,GAAG,OAAO,GAAG,QAAQ,CAAA,CAAE,CACzI,CACP,CACG,CACP,CACG,CACF,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-participant-card/ls-participant-card.css?tag=ls-participant-card&encapsulation=shadow","src/components/ls-participant-card/ls-participant-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.625rem;\n flex-direction: column;\n align-items: flex-start;\n gap: 0.5rem;\n align-self: stretch;\n}\n\n.top-card {\n border-radius: 1rem 1rem 0 0;\n}\n\n.full-card {\n border-radius: 1rem;\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.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\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: 36px;\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, Prop, h, Event, EventEmitter, Watch, Element } from '@stencil/core';\nimport { LSApiRole, LSApiRoleType } from '../../types/LSApiRole';\nimport { LSApiTemplate } from '../../types/LSApiTemplate';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\n\n@Component({\n tag: 'ls-participant-card',\n styleUrl: 'ls-participant-card.css',\n shadow: true,\n})\nexport class LsParticipantCard {\n @Element() component: HTMLElement;\n @Prop() signer: LSApiRole;\n @Prop() index: number;\n @Prop({ mutable: true }) editable: boolean = false;\n @Prop() template: LSApiTemplate;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n opened: EventEmitter<LSApiRole>;\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.signer = { ...this.signer, ...diff };\n this.debounce(this.signer, 500);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }, delay);\n }\n\n deleteHandler(role: LSApiRole) {\n this.update.emit([{ action: 'delete', data: role }]);\n this.mutate.emit([{ action: 'delete', data: role }]);\n }\n\n swapHandler(role1, role2) {\n this.update.emit([{ action: 'swap', data: role1, data2: role2 }]);\n this.mutate.emit([{ action: 'swap', data: role1, data2: role2 }]);\n }\n\n @Watch('editable')\n modeHandler(_editable) {\n // When opened fire an event to let the parent handle closing other controls\n if (_editable) {\n this.opened.emit(this.signer);\n }\n }\n\n @Event({\n bubbles: true,\n composed: true,\n })\n addParticipant: EventEmitter<{ type: LSApiRoleType; parent?: string | null }>;\n\n render() {\n const participantFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.signer.signerIndex) || [];\n const child = this.template.roles.find(r => r.signerParent === this.signer.id);\n\n return (\n <Host>\n <div\n class={'participant-card' + (child ? ' top-card' : this.signer?.signerParent ? ' bottom-card' : ' full-card')}\n style={{\n background: defaultRolePalette[this.signer?.signerIndex % 100].s10,\n border: `1px solid ${defaultRolePalette[this.signer?.signerIndex % 100].s60}`,\n marginTop: this.signer.roleType === 'WITNESS' ? '-0.813rem' : '0',\n }}\n onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.button-set')?.classList.remove('hidden')}\n onMouseLeave={e => (e.currentTarget as HTMLElement).querySelector('.button-set')?.classList.add('hidden')}\n onDblClick={() => {\n this.editable = true;\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.signer?.signerIndex % 100].s20,\n color: defaultRolePalette[this.signer?.signerIndex % 100].s90,\n }}\n >\n <ls-icon name={this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye'} />\n {'Participant ' + (this.signer?.signerIndex || '')}\n </div>\n <div class={'button-set hidden'}>\n {this.index > 0 && this.signer.roleType !== 'WITNESS' && (\n <div\n class=\"innerButton\"\n onClick={() => {\n this.swapHandler(this.signer, this.template.roles[this.index - 1]);\n }}\n style={{\n '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n }}\n >\n <ls-icon name=\"arrow-up\" size=\"18\" />\n </div>\n )}\n {this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (\n <div\n class=\"innerButton\"\n onClick={() => {\n this.swapHandler(this.signer, this.template.roles[this.index + 1]);\n }}\n style={{\n '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n }}\n >\n <ls-icon name=\"arrow-down\" size=\"18\" />\n </div>\n )}\n <div\n class=\"innerButton\"\n onClick={() => {\n this.editable = !this.editable;\n }}\n style={{\n '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n }}\n >\n <ls-icon name={this.editable ? 'check' : 'pencil-alt'} size=\"18\" />\n </div>\n <div\n class=\"innerButton\"\n onClick={() => {\n this.deleteHandler(this.signer);\n }}\n style={{\n '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n }}\n >\n <ls-icon name=\"trash\" size=\"18\" />\n </div>\n </div>\n </div>\n {this.editable ? (\n <div class={'participant-card-inner'}>\n {this.signer?.roleType !== 'WITNESS' ? (\n <ls-input-wrapper select leadingIcon={this.signer?.roleType === 'APPROVER' ? 'check-circle' : 'signature'}>\n <select\n name=\"roleType\"\n id=\"role-type\"\n class={'has-leading-icon'}\n onChange={e => this.alter({ roleType: (e.target as HTMLSelectElement).value })}\n disabled={child ? true : false}\n >\n <option value=\"APPROVER\" selected={this.signer?.roleType === 'APPROVER'}>\n Approver\n </option>\n <option value=\"SIGNER\" selected={this.signer?.roleType === 'SIGNER'}>\n Signer\n </option>\n </select>\n </ls-input-wrapper>\n ) : (\n <ls-input-wrapper leadingIcon=\"eye\">\n <input name=\"roleType\" id=\"role-type\" class={'has-leading-icon'} disabled value=\"Witness\" />\n </ls-input-wrapper>\n )}\n <input\n type=\"text\"\n id=\"participant-description\"\n name=\"participantDescription\"\n placeholder=\"Description, eg. Tenant 1, Agent\"\n defaultValue={this.signer.name}\n onInput={e => this.alter({ name: (e.target as HTMLInputElement).value })}\n onKeyUp={e => {\n if (e.key === 'Enter' || e.keyCode === 13) this.editable = false;\n }}\n />\n {this.signer?.roleType === 'SIGNER' && !child ? (\n <button class={'tertiary'} onClick={() => this.addParticipant.emit({ type: 'WITNESS', parent: this.signer.id })}>\n <ls-icon name=\"plus\" style={{ marginRight: '0.25rem' }} />\n Add Witness\n </button>\n ) : this.signer?.roleType === 'SIGNER' && child ? (\n <button\n class={'destructive'}\n onClick={() => {\n this.deleteHandler(child);\n }}\n >\n <ls-icon name=\"minus-sm\" style={{ marginRight: '0.25rem' }} />\n Remove Witness\n </button>\n ) : this.signer?.roleType === 'WITNESS' ? (\n <button\n class={'destructive'}\n onClick={() => {\n this.deleteHandler(this.signer);\n }}\n >\n <ls-icon name=\"minus-sm\" style={{ marginRight: '0.25rem' }} />\n Remove Witness\n </button>\n ) : null}\n </div>\n ) : (\n <div class={'participant-card-text'}>\n <p\n class=\"participant-text-description\"\n style={{\n color: defaultRolePalette[this.signer?.signerIndex % 100].s100,\n }}\n >\n {this.signer.name || `${this.signer.signerIndex > 100 ? 'Witness' : 'Signer'} ${this.signer.signerIndex + 1}`}\n </p>\n <p\n class=\"participant-text-type\"\n style={{\n color: defaultRolePalette[this.signer?.signerIndex % 100].s80,\n textTransform: 'capitalize',\n }}\n >\n {this.signer.roleType.toLowerCase()}\n </p>\n {this.signer?.roleType !== 'APPROVER' && (\n <div\n class={'role-label fields'}\n style={{\n background: participantFields.length === 0 ? defaultRolePalette[this.signer?.signerIndex % 100].s60 : defaultRolePalette[this.signer?.signerIndex % 100].s20,\n color: participantFields.length === 0 ? 'white' : defaultRolePalette[this.signer?.signerIndex % 100].s90,\n }}\n >\n {participantFields.length === 0 && <ls-icon name=\"exclamation-circle\" size=\"16\" style={{ marginRight: '0.125rem' }} />}\n {participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`}\n </div>\n )}\n </div>\n )}\n </div>\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|