legalesign-document-viewer 0.1.2 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ls-document-options_35.cjs.entry.js +109 -51
- package/dist/cjs/ls-document-options_35.cjs.entry.js.map +1 -1
- package/dist/cjs/ls-document-viewer.cjs.js +1 -1
- package/dist/collection/components/ls-document-viewer/defaultPalette.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/editorCalculator.js +2 -2
- package/dist/collection/components/ls-document-viewer/editorCalculator.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.css +11 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +8 -6
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js.map +1 -1
- package/dist/collection/components/ls-editor-field/ls-editor-field.js +6 -3
- package/dist/collection/components/ls-editor-field/ls-editor-field.js.map +1 -1
- package/dist/collection/components/ls-field-placement/ls-field-placement.css +27 -9
- package/dist/collection/components/ls-field-placement/ls-field-placement.js +1 -1
- package/dist/collection/components/ls-field-placement/ls-field-placement.js.map +1 -1
- package/dist/collection/components/ls-field-properties/ls-field-properties.css +1 -0
- package/dist/collection/components/ls-field-properties/ls-field-properties.js +1 -1
- package/dist/collection/components/ls-field-properties-autosign/ls-field-properties-autosign.js +1 -1
- package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.css +173 -10
- package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js +36 -1
- package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js.map +1 -1
- package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.css +178 -4
- package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js +36 -1
- package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js.map +1 -1
- package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.css +178 -3
- package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js +36 -1
- package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js.map +1 -1
- package/dist/collection/components/ls-field-properties-general/ls-field-properties-general.js +1 -1
- package/dist/collection/components/ls-field-properties-image/ls-field-properties-image.js +1 -1
- package/dist/collection/components/ls-field-properties-multiple/ls-field-properties-multiple.js +1 -1
- package/dist/collection/components/ls-field-properties-number/ls-field-properties-number.js +1 -1
- package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.css +49 -4
- package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js +12 -1
- package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js.map +1 -1
- package/dist/collection/components/ls-field-properties-text/ls-field-properties-text.js +1 -1
- package/dist/collection/components/ls-field-size/ls-field-size.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-number-input/ls-number-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-select-input/ls-select-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-text-input/ls-text-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.js +1 -1
- package/dist/collection/components/ls-formfield/ls-formfield.js +2 -2
- package/dist/collection/components/ls-icon/ls-icon.js +1 -1
- package/dist/collection/components/ls-participant-manager/ls-participant-manager.js +2 -2
- package/dist/collection/components/ls-participant-select/ls-participant-select.js +4 -4
- package/dist/collection/components/ls-statusbar/ls-statusbar.js +3 -3
- package/dist/collection/components/ls-toggle/ls-toggle.js +1 -1
- package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.css +3 -4
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js +25 -1
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js.map +1 -1
- package/dist/components/ls-document-options.js +1 -1
- package/dist/components/ls-document-viewer.js +45 -43
- package/dist/components/ls-document-viewer.js.map +1 -1
- package/dist/components/ls-editor-field.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-dimensions.js +1 -1
- package/dist/components/ls-field-distribute.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-autosign.js +1 -1
- package/dist/components/ls-field-properties-date.js +1 -1
- 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-formfield.js +1 -1
- package/dist/components/ls-icon.js +1 -1
- package/dist/components/ls-number-input.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-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/{p-B9qKX3S0.js → p-6hZjNCO9.js} +5 -5
- package/dist/components/{p-B9qKX3S0.js.map → p-6hZjNCO9.js.map} +1 -1
- package/dist/components/{p-B1X25Dz_.js → p-B2NrT7P4.js} +5 -5
- package/dist/components/{p-B1X25Dz_.js.map → p-B2NrT7P4.js.map} +1 -1
- package/dist/components/{p-DC7lKZUf.js → p-B3WqeRix.js} +5 -5
- package/dist/components/{p-DC7lKZUf.js.map → p-B3WqeRix.js.map} +1 -1
- package/dist/components/{p-CF583nkL.js → p-BBfc4kkx.js} +7 -7
- package/dist/components/{p-CF583nkL.js.map → p-BBfc4kkx.js.map} +1 -1
- package/dist/components/{p-CEGQ-SIb.js → p-BDgNCPwS.js} +4 -4
- package/dist/components/{p-CEGQ-SIb.js.map → p-BDgNCPwS.js.map} +1 -1
- package/dist/components/{p-BxXqIouU.js → p-BEtorVYP.js} +5 -5
- package/dist/components/{p-BxXqIouU.js.map → p-BEtorVYP.js.map} +1 -1
- package/dist/components/p-BHOXtRwH.js +74 -0
- package/dist/components/p-BHOXtRwH.js.map +1 -0
- package/dist/components/{p-BlTHDG0s.js → p-BIp2Inn2.js} +3 -3
- package/dist/components/{p-BlTHDG0s.js.map → p-BIp2Inn2.js.map} +1 -1
- package/dist/components/{p-8QmwtD0L.js → p-BM12bWfu.js} +9 -6
- package/dist/components/p-BM12bWfu.js.map +1 -0
- package/dist/components/{p-D2smwTu5.js → p-B_eQ2Gz-.js} +7 -7
- package/dist/components/{p-D2smwTu5.js.map → p-B_eQ2Gz-.js.map} +1 -1
- package/dist/components/{p-Ct78kJaE.js → p-Bl6sK4Wf.js} +5 -5
- package/dist/components/{p-Ct78kJaE.js.map → p-Bl6sK4Wf.js.map} +1 -1
- package/dist/components/{p-DtHDNV_x.js → p-BoA6mH9f.js} +3 -3
- package/dist/components/{p-DtHDNV_x.js.map → p-BoA6mH9f.js.map} +1 -1
- package/dist/components/{p-CgRZ91kw.js → p-BuHDdmKo.js} +3 -3
- package/dist/components/{p-CgRZ91kw.js.map → p-BuHDdmKo.js.map} +1 -1
- package/dist/components/p-C-B8sqqJ.js +77 -0
- package/dist/components/p-C-B8sqqJ.js.map +1 -0
- package/dist/components/p-C00GqV9f.js.map +1 -1
- package/dist/components/p-CTKLmmO3.js +72 -0
- package/dist/components/p-CTKLmmO3.js.map +1 -0
- package/dist/components/{p-RoGGAmRf.js → p-CToSoYU7.js} +4 -4
- package/dist/components/{p-RoGGAmRf.js.map → p-CToSoYU7.js.map} +1 -1
- package/dist/components/{p-CnIzN0a9.js → p-Ciz2QmDr.js} +5 -5
- package/dist/components/{p-CnIzN0a9.js.map → p-Ciz2QmDr.js.map} +1 -1
- package/dist/components/{p-D3p38qOI.js → p-D4hGTY-V.js} +4 -4
- package/dist/components/{p-D3p38qOI.js.map → p-D4hGTY-V.js.map} +1 -1
- package/dist/components/{p-py-rQZsT.js → p-D8LhlUeT.js} +3 -3
- package/dist/components/{p-py-rQZsT.js.map → p-D8LhlUeT.js.map} +1 -1
- package/dist/components/{p-D3GPRslH.js → p-DBphBrvt.js} +10 -10
- package/dist/components/{p-D3GPRslH.js.map → p-DBphBrvt.js.map} +1 -1
- package/dist/components/{p-B1Q1LddX.js → p-DFgg8jhU.js} +5 -5
- package/dist/components/{p-B1Q1LddX.js.map → p-DFgg8jhU.js.map} +1 -1
- package/dist/components/{p-BI9SKPKN.js → p-DKmDGdr_.js} +3 -3
- package/dist/components/{p-BI9SKPKN.js.map → p-DKmDGdr_.js.map} +1 -1
- package/dist/components/{p-DTWaVEKo.js → p-DQthTAGK.js} +17 -17
- package/dist/components/p-DQthTAGK.js.map +1 -0
- package/dist/components/{p-pHw5Xziq.js → p-DS45bzgL.js} +3 -3
- package/dist/components/{p-pHw5Xziq.js.map → p-DS45bzgL.js.map} +1 -1
- package/dist/components/p-DT0wHPjN.js +77 -0
- package/dist/components/p-DT0wHPjN.js.map +1 -0
- package/dist/components/{p-GHcj9VUq.js → p-DXP-R4_o.js} +4 -4
- package/dist/components/{p-GHcj9VUq.js.map → p-DXP-R4_o.js.map} +1 -1
- package/dist/components/{p-D7KC-w81.js → p-DlfoNwRm.js} +10 -10
- package/dist/components/{p-D7KC-w81.js.map → p-DlfoNwRm.js.map} +1 -1
- package/dist/components/{p-CpK4mw5O.js → p-Eq1IwvY5.js} +3 -3
- package/dist/components/{p-CpK4mw5O.js.map → p-Eq1IwvY5.js.map} +1 -1
- package/dist/components/{p-D1o9mMCC.js → p-PVKJexBt.js} +9 -9
- package/dist/components/{p-D1o9mMCC.js.map → p-PVKJexBt.js.map} +1 -1
- package/dist/components/p-R3D1POuE.js +77 -0
- package/dist/components/p-R3D1POuE.js.map +1 -0
- package/dist/components/p-X9ibhDjX.js +91 -0
- package/dist/components/p-X9ibhDjX.js.map +1 -0
- package/dist/components/{p-CjicL5jA.js → p-YpxkkST1.js} +3 -3
- package/dist/components/{p-CjicL5jA.js.map → p-YpxkkST1.js.map} +1 -1
- package/dist/components/{p-IGbuOsUA.js → p-aHGDKnIY.js} +4 -4
- package/dist/components/{p-IGbuOsUA.js.map → p-aHGDKnIY.js.map} +1 -1
- package/dist/components/{p-Cs6tf1FE.js → p-cFB-6W0U.js} +3 -3
- package/dist/components/{p-Cs6tf1FE.js.map → p-cFB-6W0U.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ls-document-options_35.entry.js +109 -51
- package/dist/esm/ls-document-options_35.entry.js.map +1 -1
- package/dist/esm/ls-document-viewer.js +1 -1
- package/dist/ls-document-viewer/{editorUtils-DbS95k5h.js.map → editorUtils-ClLXAGwA.js.map} +1 -1
- package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
- package/dist/ls-document-viewer/{p-85c0f6fa.entry.js → p-9946fb79.entry.js} +5 -5
- package/dist/ls-document-viewer/p-9946fb79.entry.js.map +1 -0
- package/dist/types/components/ls-document-viewer/ls-document-viewer.d.ts +1 -0
- package/dist/types/components/ls-field-properties-date/ls-field-properties-date.d.ts +2 -0
- package/dist/types/components/ls-field-properties-email/ls-field-properties-email.d.ts +2 -0
- package/dist/types/components/ls-field-properties-file/ls-field-properties-file.d.ts +2 -0
- package/dist/types/components/ls-field-properties-signature/ls-field-properties-signature.d.ts +1 -0
- package/dist/types/components/ls-toolbox-field/ls-toolbox-field.d.ts +4 -0
- package/dist/types/components.d.ts +34 -0
- package/package.json +1 -1
- package/dist/components/p-8QmwtD0L.js.map +0 -1
- package/dist/components/p-BNKSb1yR.js +0 -49
- package/dist/components/p-BNKSb1yR.js.map +0 -1
- package/dist/components/p-C93Q3D_9.js +0 -49
- package/dist/components/p-C93Q3D_9.js.map +0 -1
- package/dist/components/p-CTraMHE_.js +0 -49
- package/dist/components/p-CTraMHE_.js.map +0 -1
- package/dist/components/p-D4wPRNKc.js +0 -86
- package/dist/components/p-D4wPRNKc.js.map +0 -1
- package/dist/components/p-DTWaVEKo.js.map +0 -1
- package/dist/components/p-Dxupmj0q.js +0 -63
- package/dist/components/p-Dxupmj0q.js.map +0 -1
- package/dist/components/p-RFw2Bsri.js +0 -72
- package/dist/components/p-RFw2Bsri.js.map +0 -1
- package/dist/ls-document-viewer/ls-document-viewer.entry.esm.js.map +0 -1
- package/dist/ls-document-viewer/ls-document-viewer.entry.js +0 -24928
- package/dist/ls-document-viewer/ls-document-viewer.entry.js.map +0 -1
- package/dist/ls-document-viewer/p-85c0f6fa.entry.js.map +0 -1
|
@@ -19847,7 +19847,7 @@ function addField(frame, data) {
|
|
|
19847
19847
|
node.style.left = Math.floor(data.left * this.zoom) + 'px';
|
|
19848
19848
|
node.style.height = Math.floor(data.height * this.zoom) + 'px';
|
|
19849
19849
|
node.style.width = Math.floor(data.width * this.zoom) + 'px';
|
|
19850
|
-
node.style.fontSize = Math.floor(data.fontSize) + 'pt';
|
|
19850
|
+
node.style.fontSize = Math.floor(data.fontSize * this.zoom) + 'pt';
|
|
19851
19851
|
node.style.alignContent = data.align;
|
|
19852
19852
|
node.style.fontFamily = data.fontName;
|
|
19853
19853
|
node.dataItem = data;
|
|
@@ -19859,7 +19859,7 @@ function moveField(item, data) {
|
|
|
19859
19859
|
item.style.left = Math.floor(data.left * this.zoom) + 'px';
|
|
19860
19860
|
item.style.height = Math.floor(data.height * this.zoom) + 'px';
|
|
19861
19861
|
item.style.width = Math.floor(data.width * this.zoom) + 'px';
|
|
19862
|
-
item.style.fontSize = Math.floor(data.fontSize) + 'pt';
|
|
19862
|
+
item.style.fontSize = Math.floor(data.fontSize * this.zoom) + 'pt';
|
|
19863
19863
|
item.style.fontFamily = data.fontName;
|
|
19864
19864
|
item.style.textAlign = data.align;
|
|
19865
19865
|
item.dataItem = data;
|
|
@@ -24507,7 +24507,7 @@ class LsDocumentAdapter {
|
|
|
24507
24507
|
}
|
|
24508
24508
|
}
|
|
24509
24509
|
|
|
24510
|
-
const lsDocumentViewerCss = "*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:row;width:100vw;height:100vh;margin:0px;padding:0px}.leftBox{border-radius:16px;border:1px solid var(--gray-30, #edeff2);background:var(--white, #fff);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);width:21.25rem;margin:1rem;min-width:21.25rem;max-height:100%}.left-box-inner{position:relative;display:flex;height:100%;padding:0.75rem;gap:0.75rem}.rightBox{width:200px;border:1px gray solid;width:470px;min-width:390px;padding:4px;font-family:inherit}.toolbox{display:flex;flex-direction:column;width:100%;height:100%;border-radius:8px;border:1px solid var(--gray-30, #e0e2e5);background:var(--gray-10, #f7f8fa);padding:0.75rem;gap:1rem;overflow-y:auto}.ls-editor-infobox{padding:2px 8px 2px 8px}#pdf-canvas{top:0px;left:0px;width:100px;height:100px}#ls-mid-area{display:flex;flex-direction:column;width:100%}.document-frame-wrapper{position:relative;padding:0 1.25rem;height:100%;display:flex;flex-direction:column;justify-content:start;align-items:center;overflow:auto}.spacer{min-height:5.5rem;width:100%}#ls-document-frame{position:relative;height:98vh;max-width:100%;max-height:100%;margin:0px;padding:2px;scrollbar-width:auto;scrollbar-color:auto}.prevButton{position:relative;bottom:30px}.nextButton{position:relative;bottom:30px}.fieldBox{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#ls-editor-form{display:flex;width:100vw;max-height:calc(100vh - 2.25rem);position:relative;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.hidden{visibility:hidden;display:none;width:0px}.toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.fields-box{display:flex;flex-direction:column;gap:0.75rem}.page-header{display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.properties-header{display:flex;padding:1rem;gap:0.75rem;align-items:center;border-bottom:1px solid var(--gray-20, #edeff2)}.properties-header-title{color:var(--gray-100, #45484d);width:100%;font-size:1.5rem;font-style:normal;font-weight:500;line-height:2rem;}.properties-header-icon{display:flex;padding:0.5rem;border-radius:0.625rem;background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}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}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
|
|
24510
|
+
const lsDocumentViewerCss = "*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:row;width:100vw;height:100vh;margin:0px;padding:0px}#my-field-panel{position:relative;height:calc(100% - 4.313rem)}.leftBox{border-radius:16px;border:1px solid var(--gray-30, #edeff2);background:var(--white, #fff);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);width:21.25rem;margin:1rem;min-width:21.25rem;max-height:100%}.left-box-inner{position:relative;display:flex;height:100%;padding:0.75rem;gap:0.75rem}.rightBox{width:200px;border:1px gray solid;width:470px;min-width:390px;padding:4px;font-family:inherit}.toolbox{display:flex;flex-direction:column;width:100%;height:100%;border-radius:8px;border:1px solid var(--gray-30, #e0e2e5);background:var(--gray-10, #f7f8fa);padding:0.75rem;gap:1rem;overflow-y:auto}.ls-editor-infobox{padding:2px 8px 2px 8px}#pdf-canvas{top:0px;left:0px;width:100px;height:100px}#ls-mid-area{display:flex;flex-direction:column;width:100%}.document-frame-wrapper{position:relative;padding:0 1.25rem;height:100%;display:flex;flex-direction:column;justify-content:start;align-items:center;overflow-y:auto}.spacer{min-height:5.5rem;width:100%}#ls-document-frame{position:relative;height:98vh;max-width:100%;max-height:100%;margin:0px;padding:2px;scrollbar-width:auto;scrollbar-color:auto}.prevButton{position:relative;bottom:30px}.nextButton{position:relative;bottom:30px}.fieldBox{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#ls-editor-form{display:flex;width:100vw;max-height:calc(100vh - 2.25rem);position:relative;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.hidden{visibility:hidden;display:none;width:0px}.toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.fields-box{display:flex;flex-direction:column;gap:0.75rem}.page-header{display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.properties-header{display:flex;padding:1rem;gap:0.75rem;align-items:center;border-bottom:1px solid var(--gray-20, #edeff2)}.properties-header-title{color:var(--gray-100, #45484d);width:100%;font-size:1.5rem;font-style:normal;font-weight:500;line-height:2rem;}.properties-header-icon{display:flex;padding:0.5rem;border-radius:0.625rem;background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}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}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.field-properties-outer{position:relative;height:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
|
|
24511
24511
|
|
|
24512
24512
|
pdfExports.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.5.207/pdf.worker.min.js';
|
|
24513
24513
|
const LsDocumentViewer = class {
|
|
@@ -24673,7 +24673,7 @@ const LsDocumentViewer = class {
|
|
|
24673
24673
|
console.log(event);
|
|
24674
24674
|
if (this.token)
|
|
24675
24675
|
event.detail.forEach(me => this.adapter.handleEvent(me, this.token).then(result => {
|
|
24676
|
-
if (me.action ===
|
|
24676
|
+
if (me.action === 'create')
|
|
24677
24677
|
matchData.bind(this)(result);
|
|
24678
24678
|
}));
|
|
24679
24679
|
}
|
|
@@ -24691,9 +24691,8 @@ const LsDocumentViewer = class {
|
|
|
24691
24691
|
if (propPanel)
|
|
24692
24692
|
propPanel.dataItem = event.detail;
|
|
24693
24693
|
}
|
|
24694
|
-
// Send selection changes to bars and panels
|
|
24694
|
+
// Send role selection changes to bars and panels
|
|
24695
24695
|
roleHandler(event) {
|
|
24696
|
-
console.log(event.detail);
|
|
24697
24696
|
this.signer = event.detail;
|
|
24698
24697
|
}
|
|
24699
24698
|
//
|
|
@@ -24907,8 +24906,11 @@ const LsDocumentViewer = class {
|
|
|
24907
24906
|
if (this.token && !this._template)
|
|
24908
24907
|
this.load();
|
|
24909
24908
|
}
|
|
24909
|
+
signerColor = (index) => {
|
|
24910
|
+
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
24911
|
+
};
|
|
24910
24912
|
render() {
|
|
24911
|
-
return (index.h(index.Host, { key: '
|
|
24913
|
+
return (index.h(index.Host, { key: '5211ee24231dedce593a1b638daa121267cfbf75' }, index.h(index.h.Fragment, null, index.h("div", { key: '5f0b68c90b8935e4d9a0a37f70b1e36d669d2c02', class: "page-header" }, index.h("p", { key: 'dcd2efb1551dc8e7082e2fa25a11055125527b83', class: "header-text-1" }, "Template Creation"), index.h("p", { key: '59c33765a7ec5ff160fe5a058acdc18e017a162c' }, "/"), index.h("p", { key: '108722e31b9560fea2b42f197f98203e03c07b26', class: "header-text-2" }, "Template Name")), index.h("form", { key: '2681b25088e5f78e5169e4eccc32d8e7b9651887', id: "ls-editor-form" }, this.showtoolbox === true ? (index.h("div", { class: "leftBox" }, index.h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, index.h("ls-feature-column", { onManage: manager => {
|
|
24912
24914
|
if (manager.detail === 'document') {
|
|
24913
24915
|
var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
|
|
24914
24916
|
documentManager.template = this._template;
|
|
@@ -24918,10 +24920,10 @@ const LsDocumentViewer = class {
|
|
|
24918
24920
|
participantManager.template = this._template;
|
|
24919
24921
|
}
|
|
24920
24922
|
this.manager = manager.detail;
|
|
24921
|
-
} }), index.h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, index.h("div", { class: "ls-editor-infobox" }, index.h("h2", { class: "toolbox-section-title" }, "Participant Fields"), index.h("p", { class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { class: "fields-box" }, index.h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature" }), index.h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials" }), index.h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender" }), index.h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date" }), index.h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol" }), index.h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text" }), index.h("div", { class: 'expand-fields-row' }, index.h("ls-icon", { name: this.expandfields ? 'expand' : 'collapse', size: "20", solid: true, onClick: () => (this.expandfields = !this.expandfields) }), index.h("p", null, "More Field Types")), this.expandfields && (index.h("div", { class: "fields-box" }, index.h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag" }), index.h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check" }), index.h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "signature" }), index.h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code" }), index.h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph" }), index.h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload" }))))), index.h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), index.h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' })), this.showrightpanel && !this.displayTable && (index.h("div", { class: this.selected && this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, index.h("div", { class: 'properties-header' }, index.h("div", { class: 'properties-header-icon' }, index.h("ls-icon", { name: "pre-filled-content" })), index.h("h1", { class: 'properties-header-title' }, "Field Properties"), index.h("button", { class: 'tertiaryGrey', onClick: e => {
|
|
24923
|
+
} }), index.h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, index.h("div", { class: "ls-editor-infobox" }, index.h("h2", { class: "toolbox-section-title" }, "Participant Fields"), index.h("p", { class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { class: "fields-box" }, index.h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text", color: this.signerColor(this.signer) }), index.h("div", { class: 'expand-fields-row' }, index.h("ls-icon", { name: this.expandfields ? 'expand' : 'collapse', size: "20", solid: true, onClick: () => (this.expandfields = !this.expandfields) }), index.h("p", null, "More Field Types")), this.expandfields && (index.h("div", { class: "fields-box" }, index.h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "signature", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph", color: this.signerColor(this.signer) }), index.h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload", color: this.signerColor(this.signer) }))))), index.h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), index.h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' })), this.showrightpanel && !this.displayTable && (index.h("div", { class: this.selected && this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, index.h("div", { class: 'properties-header' }, index.h("div", { class: 'properties-header-icon' }, index.h("ls-icon", { name: "pre-filled-content" })), index.h("h1", { class: 'properties-header-title' }, "Field Properties"), index.h("button", { class: 'tertiaryGrey', onClick: e => {
|
|
24922
24924
|
this.selected = [];
|
|
24923
24925
|
e.preventDefault();
|
|
24924
|
-
} }, index.h("ls-icon", { name: "x", size: "20" }))), index.h("ls-field-properties", { id: "my-field-panel" }), index.h("slot", null))))) : (index.h(index.h.Fragment, null)), index.h("div", { key: '
|
|
24926
|
+
} }, index.h("ls-icon", { name: "x", size: "20" }))), index.h("ls-field-properties", { id: "my-field-panel" }), index.h("slot", null))))) : (index.h(index.h.Fragment, null)), index.h("div", { key: '31cd692fde3f164d578b7ddc362cb1e663a51b4d', id: "ls-mid-area" }, index.h("ls-toolbar", { key: 'f696e4f47618440e27d8233aa2d5ac931374afb5', id: "ls-toolbar", dataItem: this.selected ? this.selected.map(s => s.dataItem) : null, template: this._template }), index.h("div", { key: '18e06d7f77ad6d31e8fbc98ff2a01c1d3ec47361', class: 'document-frame-wrapper' }, index.h("div", { key: '67565650c5f50326f944ef09787ee6a72c10d203', class: 'spacer' }), index.h("div", { key: '7cf6ab23d1553d8dc9910546f8085f7558cbefcd', id: "ls-document-frame" }, index.h("canvas", { key: 'f8d2d988a2b668224e63982029c55a102b5b7729', id: "pdf-canvas", class: this.displayTable ? 'hidden' : '' }), index.h("ls-editor-table", { key: 'c33d5c80ef5ae794d85be860524b809d84ea108b', editor: this, class: this.displayTable ? '' : 'hidden' }), index.h("div", { key: 'd0cef83695bc3e2afceadcea12fb5563788489a9', id: "ls-box-selector" }))), index.h("ls-statusbar", { key: '5b814c90c929b917b9f8f0bfe1c6476294b4dfb1', editor: this }))))));
|
|
24925
24927
|
}
|
|
24926
24928
|
static get watchers() { return {
|
|
24927
24929
|
"mode": ["modeHandler"],
|
|
@@ -25007,6 +25009,7 @@ const LsEditorField = class {
|
|
|
25007
25009
|
}
|
|
25008
25010
|
else {
|
|
25009
25011
|
this.component.style.background = 'transparent';
|
|
25012
|
+
this.component.style.boxShadow = 'none';
|
|
25010
25013
|
}
|
|
25011
25014
|
}
|
|
25012
25015
|
onInputChange(e) {
|
|
@@ -25034,18 +25037,20 @@ const LsEditorField = class {
|
|
|
25034
25037
|
this.component.style.opacity = '0.7';
|
|
25035
25038
|
this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';
|
|
25036
25039
|
}
|
|
25037
|
-
else
|
|
25040
|
+
else {
|
|
25038
25041
|
this.component.style.background = `transparent`;
|
|
25042
|
+
this.component.style.boxShadow = 'none';
|
|
25043
|
+
}
|
|
25039
25044
|
}
|
|
25040
25045
|
participantColor = (index) => {
|
|
25041
25046
|
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
25042
25047
|
};
|
|
25043
25048
|
render() {
|
|
25044
25049
|
console.log('Rendering ls-editor-field', this.dataItem);
|
|
25045
|
-
return (index.h(index.Host, { key: '
|
|
25050
|
+
return (index.h(index.Host, { key: 'ddff7fdaa6832313753e0fb32b085425bddb9962', style: { border: `2px solid var(--${this.participantColor(this.dataItem?.signer)}-60)` } }, index.h("div", { key: '43c0e90e8d68462a34fdb4d31a90cf08a5c87994', class: {
|
|
25046
25051
|
'ls-editor-field': true,
|
|
25047
25052
|
'is-selected': this.selected,
|
|
25048
|
-
} }, index.h("input", { key: '
|
|
25053
|
+
} }, index.h("input", { key: 'f7e8a0aadcb0c08c0c1b1f89f8b2cee4fddb362e', id: "editing-input", class: this.isEditing ? 'ls-editor-field-editable' : 'hidden-field', type: getInputType(this.dataItem.validation).inputType, value: this.dataItem?.value || this.innerValue, onChange: e => this.onInputChange(e) }), index.h("div", { key: 'f0446b10d267911421007a39634665fd3fc52e46', id: "field-info", class: this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable' }, this.innerValue || this.dataItem?.label || this.dataItem?.formElementType))));
|
|
25049
25054
|
}
|
|
25050
25055
|
static get watchers() { return {
|
|
25051
25056
|
"selected": ["watchSelectedHandler"]
|
|
@@ -25424,7 +25429,7 @@ const LsFieldFormat = class {
|
|
|
25424
25429
|
};
|
|
25425
25430
|
LsFieldFormat.style = lsFieldFormatCss;
|
|
25426
25431
|
|
|
25427
|
-
const lsFieldPlacementCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0;box-sizing:border-box}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.input-row{display:flex;gap:0.5rem}.input-row .input-wrapper input{width:9.313rem;max-width:9.313rem}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}.input-wrapper{position:relative;width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;width:100%;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;color:var(--gray-80, #6c6e73)}.button-group button:disabled{background:var(--gray-10, #f7f8fa);cursor:not-allowed;color:var(--gray-50, #d8d9dc)}.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)}";
|
|
25432
|
+
const lsFieldPlacementCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0;box-sizing:border-box}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.multi-button-group-row{display:flex;gap:0.5rem}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.input-row{display:flex;gap:0.5rem}.input-row .input-wrapper input{width:9.313rem;max-width:9.313rem}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}.input-wrapper{position:relative;width:100%}#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)}#selectLeadingIconDisabled{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-50, #d8d9dc)}.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:not(:disabled),select:focus:not(:disabled),textarea:focus:not(:disabled){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:not(:disabled),select:active:not(:disabled),textarea:active:not(:disabled){border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa);color:var(--gray-50, #d8d9dc);box-shadow:none}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip;width:100%}.button-group button{display:flex;width:100%;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;color:var(--gray-80, #6c6e73)}.button-group button:disabled{background:var(--gray-10, #f7f8fa);cursor:not-allowed;color:var(--gray-50, #d8d9dc)}.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)}";
|
|
25428
25433
|
|
|
25429
25434
|
const LsFieldPlacement = class {
|
|
25430
25435
|
constructor(hostRef) {
|
|
@@ -25461,7 +25466,7 @@ const LsFieldPlacement = class {
|
|
|
25461
25466
|
}
|
|
25462
25467
|
}
|
|
25463
25468
|
render() {
|
|
25464
|
-
return (index.h(index.Host, { key: '
|
|
25469
|
+
return (index.h(index.Host, { key: '6a0f7b6a8c5dc94cde14c81ee6be2397b27e3be5' }, this.isMultiple(this.dataItem) && (index.h("div", { key: '99ef4a60bb31d91649288da9f8c78fb9dbe15196', class: 'ls-field-properties-section' }, index.h("div", { key: '9399eeb98d0ecaae3f16ea5535a2041308113db2' }, "Top: ", index.h("input", { key: '995214d8614f4dc6166d43419c0f6837b2e937e6', value: '', onChange: e => this.alter({ top: e.target.value }), width: "30" })), index.h("div", { key: '857a4248fc0be62c2de1496cc46777477cc7ab34' }, "Left: ", index.h("input", { key: 'e49db0de0b0044227668f8fa651bb4aab8d31145', value: '', onChange: e => this.alter({ left: e.target.value }), width: "30" })))), this.isSingle(this.dataItem) && (index.h("div", { key: 'a31cbbb2991fe43f312a42a1b8d4d6b9d069db32', class: 'field-set' }, index.h("div", { key: '2388774b0c3c078fc8e72ed328dcfd256437098b', class: 'ls-field-properties-section' }, index.h("div", { key: '39a346434ba2439c692623a71cc69567359c432f', class: 'ls-field-properties-section-text' }, index.h("p", { key: '74d47b7f6db5be09b56ae08e102591689a27044c', class: 'ls-field-properties-section-title' }, "Location"), index.h("p", { key: 'bbd451ef39808d320c6bb57cba1570af4410708a', class: 'ls-field-properties-section-description' }, "Use coordinates to move your fields on the page")), index.h("div", { key: '6630c43f54b472aafb962516e2588df47d80c196', class: 'input-row' }, index.h("div", { key: '78ffbda8a8576a9806d8052020af8a5dc287785a', class: 'input-wrapper' }, index.h("ls-icon", { key: '7d20243698615ceaf080fd4fbb8d9acef287cce7', id: "selectLeadingIcon", name: "x-letter" }), index.h("input", { key: '5101713e0a86e315c9e9bb6b4b4d12c4f163bab2', type: "number", class: 'has-leading-icon', aria: "top-location", id: "top-location", value: this.dataItem?.top, onChange: e => this.alter({ top: e.target.value }) })), index.h("div", { key: '52062eaa3342d2ff605cb3ae88a0f4e5b3970ef1', class: 'input-wrapper' }, index.h("ls-icon", { key: 'e164c0b662367ed76c437f677ec491c7b987ede5', id: "selectLeadingIcon", name: "y" }), index.h("input", { key: '0f75d89d266ec35a37504209da986c6886ccffa1', type: "number", class: 'has-leading-icon', aria: "left-location", id: "left-location", value: this.dataItem?.left, onChange: e => this.alter({ left: e.target.value }), width: "30" })))), index.h("div", { key: '9cdc2157455ad96575bf44adaa6ce651409f4af9', class: 'ls-field-properties-section' }, index.h("div", { key: '21d853b2adfd9c603b7a44ea186bec339722805e', class: 'ls-field-properties-section-text' }, index.h("p", { key: '8447f40ba847665b408ee9d5e843ac380e5576ab', class: 'ls-field-properties-section-title' }, "Distribution"), index.h("p", { key: 'f81f48bebb40c4ee7b3a02a8f1d42606306b4b4c', class: 'ls-field-properties-section-description' }, "Multi-select fields and evenly space them out")), index.h("div", { key: '9963c2c0a7b1cf29f833344dd909f3bc2f11350b', class: 'button-group' }, index.h("button", { key: 'e1f9e3ffbd836d9d0829a2caefccd5b6a9f6e2f0', disabled: true }, index.h("ls-icon", { key: 'e259983fc064b02148b977901a8f8ec6fd08ed86', name: "field-distribute-vertically" })), index.h("button", { key: '14e31e45a360b4621886fa6ba5fc7fac6bd657a7', disabled: true }, index.h("ls-icon", { key: 'c045fcc5a5f7330b0a578c12630e0b078181b948', name: "field-distribute-horizontally" })))), index.h("div", { key: '9a84503f0b4e779d731cca2c153ac81f6b9f2588', class: 'ls-field-properties-section' }, index.h("div", { key: 'e531166182eea81dff63f27c0590b70889b0a982', class: 'ls-field-properties-section-text' }, index.h("p", { key: '43a8c468645308af2b50427efc5cba290d40ba82', class: 'ls-field-properties-section-title' }, "Scale and Gap"), index.h("p", { key: '01f2a1dcd782b9556aa750ed7ec76a81feb379a7', class: 'ls-field-properties-section-description' }, "Define the exact gap between multi-select fields.")), index.h("div", { key: '51503e9dd0e20b1ac514e06f44c3e8196d309279', class: 'input-row' }, index.h("div", { key: '5d5e2e4bbc76334243b1b83e9c9e47cf7dafef02', class: 'input-wrapper' }, index.h("ls-icon", { key: 'c85652c6cb40c6af1c9c5fa8aa050e462e2629a7', id: "selectLeadingIconDisabled", name: "field-distribute-vertically" }), index.h("input", { key: '463d16d911ca88612bc6c922dbdb96d848f332b4', type: "number", value: "0", class: 'has-leading-icon', aria: "vertical-gap", id: "vertical-gap", disabled: true })), index.h("div", { key: '6aa81eee5a4ef286e4caea458b7559b1d7073018', class: 'input-wrapper' }, index.h("ls-icon", { key: 'd39f4bc6fcdebe4c2c1133daceccda27a067c813', id: "selectLeadingIconDisabled", name: "field-distribute-horizontally" }), index.h("input", { key: '9c8389f6edc9329dbcfb8092fd63037f686b9cb4', type: "number", value: "0", class: 'has-leading-icon', aria: "horizontal-gap", id: "horizontal-gap", disabled: true }))))))));
|
|
25465
25470
|
}
|
|
25466
25471
|
};
|
|
25467
25472
|
LsFieldPlacement.style = lsFieldPlacementCss;
|
|
@@ -25502,7 +25507,7 @@ const LsFieldProperties = class {
|
|
|
25502
25507
|
return index.h("ls-field-properties-multiple", { dataItem: this.dataItem });
|
|
25503
25508
|
}
|
|
25504
25509
|
render() {
|
|
25505
|
-
return (index.h(index.Host, { key: '
|
|
25510
|
+
return (index.h(index.Host, { key: '309f411a7efb7960a8e207eb32c178f3d68d775e' }, this.dataItem && this.renderFields(), index.h("slot", { key: '3cfe6de10eaa41e4d7ce72ba825d2202316b9b86' })));
|
|
25506
25511
|
}
|
|
25507
25512
|
};
|
|
25508
25513
|
LsFieldProperties.style = lsFieldPropertiesCss;
|
|
@@ -25515,46 +25520,85 @@ const LsFieldPropertiesAutosign = class {
|
|
|
25515
25520
|
}
|
|
25516
25521
|
dataItem;
|
|
25517
25522
|
render() {
|
|
25518
|
-
return (index.h(index.Host, { key: '
|
|
25523
|
+
return (index.h(index.Host, { key: 'b92e0d9344c0443598e16dfb603c8bb9c33e86f9' }, index.h("div", { key: 'cf3191dbbdb254d9a571e7a5a213d6ccd5fb22da', class: "ls-field-properties-section" }, "Self Sign Field"), index.h("div", { key: 'e55e1bc4078c5fa0d1697402d790e53f49ffc7e4' }, "Label: ", index.h("input", { key: '3d519f647bafeb12c028e199ec4f7897da82129d', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: '6113d5217406e9bb172449a4c0ab93432ac3d059', dataItem: this.dataItem }), index.h("slot", { key: 'd1d085d0099e3d9185e677a9511e39d3d9df37b9' })));
|
|
25519
25524
|
}
|
|
25520
25525
|
};
|
|
25521
25526
|
LsFieldPropertiesAutosign.style = lsFieldPropertiesAutosignCss;
|
|
25522
25527
|
|
|
25523
|
-
const lsFieldPropertiesDateCss = ":host{display:
|
|
25528
|
+
const lsFieldPropertiesDateCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.properties-container{display:flex;flex-direction:column;height:100%}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-field-type-wrapper{position:relative;border-radius:0.875rem;padding:0.25rem}.ls-field-type-inner{border-radius:0.625rem;background:var(--white, #fff);display:flex;padding:0.25rem 0.5rem 0.25rem 0.25rem;align-items:center;gap:0.875rem;align-self:stretch}.ls-field-type-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.ls-field-type-name{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;}.tabs-container{display:grid;grid-template-columns:repeat(3, 1fr);width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem;border-radius:0.625rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;color:var(--gray-80, #6c6e73)}.ls-tab.active{background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.ls-tab:not(.active):hover{background:var(--gray-10, #f7f8fa)}.button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #f0f1f2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}.scrolling-container{overflow-y:auto;padding:0 1rem;margin:0 -1rem;height:calc(100% - 10.938rem)}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}.full-width{width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{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)}";
|
|
25524
25529
|
|
|
25525
25530
|
const LsFieldPropertiesDate = class {
|
|
25526
25531
|
constructor(hostRef) {
|
|
25527
25532
|
index.registerInstance(this, hostRef);
|
|
25528
25533
|
}
|
|
25529
25534
|
dataItem;
|
|
25535
|
+
fieldSet = 'content';
|
|
25536
|
+
signerColor = (index) => {
|
|
25537
|
+
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
25538
|
+
};
|
|
25530
25539
|
render() {
|
|
25531
|
-
return (index.h(index.Host, { key: '
|
|
25540
|
+
return (index.h(index.Host, { key: '28e26ac6bcf4f5ec3e469ca42d539953ed757e32' }, index.h("div", { key: '899362fdb9f354535b59274df592562c632472e8', class: 'tabs-container' }, index.h("button", { key: 'e8c62f54808b383b06b10779ee09c0a647e3a862', class: this.fieldSet === 'content' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'content') }, "Content"), index.h("button", { key: '24712078c0e55c4ad33b055296d1dc6bbeab1def', class: this.fieldSet === 'placement' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'placement') }, "Placement"), index.h("button", { key: 'c43695c3affe8d3d8e7864f6a31d5b75b9c5fe0f', class: this.fieldSet === 'dimensions' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'dimensions') }, "Dimensions")), index.h("div", { key: '7dedaac7e3acfe1ea869fc07ccacf6918319876a', class: 'scrolling-container' }, this.fieldSet === 'placement' ? (index.h("ls-field-placement", { dataItem: this.dataItem })) : this.fieldSet === 'dimensions' ? (index.h("div", { class: 'field-set' }, index.h("ls-field-dimensions", { dataItem: this.dataItem }))) : (index.h("div", { class: 'field-set' }, index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { class: 'ls-field-properties-section-description' }, "The Field you currently have selected")), index.h("div", { class: 'ls-field-type-wrapper', style: {
|
|
25541
|
+
border: `1px dashed var(--${this.signerColor(this.dataItem?.signer)}-30)`,
|
|
25542
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25543
|
+
} }, index.h("div", { class: 'ls-field-type-inner' }, index.h("div", { class: 'ls-field-type-icon', style: {
|
|
25544
|
+
border: `1px solid var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25545
|
+
color: `var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25546
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25547
|
+
} }, index.h("ls-icon", { name: "calender", size: "20" })), index.h("p", { class: 'ls-field-type-name' }, "Date")))), index.h("div", { class: 'ls-field-properties-section row' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", null)), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { value: this.dataItem?.label, width: "30", placeholder: "eg. Sign Here" })), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Content Format"), index.h("p", { class: 'ls-field-properties-section-description' }, "Select the specific format you want the Recipient to enter..")), index.h("div", { class: 'input-wrapper' }, index.h("ls-icon", { id: "selectorIcon", name: "selector" }), index.h("select", null, validationTypes
|
|
25548
|
+
.filter(type => type.formType === 'date')
|
|
25549
|
+
.map(type => (index.h("option", { selected: this.dataItem?.validation === type.id, value: type.value }, type.description))))))))), index.h("div", { key: 'b8aa134277c9c97dbe055c9c4a0d063674d902f0', class: 'button-footer' }, index.h("button", { key: '1e48e484cdfa1979401ff7c2d569e09a95b4e6ce', class: 'secondary' }, index.h("ls-icon", { key: 'e813c24682528c0c43a44b56437b8b605d142126', name: "field-duplicate", size: "20" }), "Duplicate"), index.h("button", { key: '31e153b6a547c20d9a9750f8e7773d16815b57ca', class: 'destructive' }, index.h("ls-icon", { key: '747b02f9578f2e6ca14fa1020925504c98be6cf7', name: "trash", size: "20" }), "Delete")), index.h("slot", { key: 'cf1fe9517aadac9fbfaa606121b0a10e904628ea' })));
|
|
25532
25550
|
}
|
|
25533
25551
|
};
|
|
25534
25552
|
LsFieldPropertiesDate.style = lsFieldPropertiesDateCss;
|
|
25535
25553
|
|
|
25536
|
-
const lsFieldPropertiesEmailCss = ":host{display:
|
|
25554
|
+
const lsFieldPropertiesEmailCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.properties-container{display:flex;flex-direction:column;height:100%}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-field-type-wrapper{position:relative;border-radius:0.875rem;padding:0.25rem}.ls-field-type-inner{border-radius:0.625rem;background:var(--white, #fff);display:flex;padding:0.25rem 0.5rem 0.25rem 0.25rem;align-items:center;gap:0.875rem;align-self:stretch}.ls-field-type-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.ls-field-type-name{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;}.tabs-container{display:grid;grid-template-columns:repeat(3, 1fr);width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem;border-radius:0.625rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;color:var(--gray-80, #6c6e73)}.ls-tab.active{background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.ls-tab:not(.active):hover{background:var(--gray-10, #f7f8fa)}.button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #f0f1f2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}.scrolling-container{overflow-y:auto;padding:0 1rem;margin:0 -1rem;height:calc(100% - 10.938rem)}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}.full-width{width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{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)}";
|
|
25537
25555
|
|
|
25538
25556
|
const LsFieldPropertiesEmail = class {
|
|
25539
25557
|
constructor(hostRef) {
|
|
25540
25558
|
index.registerInstance(this, hostRef);
|
|
25541
25559
|
}
|
|
25542
25560
|
dataItem;
|
|
25561
|
+
fieldSet = 'content';
|
|
25562
|
+
signerColor = (index) => {
|
|
25563
|
+
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
25564
|
+
};
|
|
25543
25565
|
render() {
|
|
25544
|
-
return (index.h(index.Host, { key: '
|
|
25566
|
+
return (index.h(index.Host, { key: '366b730ea9a1096ab6098ae9b2bb98ca9e11d29a' }, index.h("div", { key: '8e6839f5c298a391fcae2e79ce03478ad469d64f', class: 'tabs-container' }, index.h("button", { key: '88756cc3cae04027c89fce3760223308bf55ebcf', class: this.fieldSet === 'content' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'content') }, "Content"), index.h("button", { key: '41d1e59547bb3d5f7bba58a067d87f4672387a2a', class: this.fieldSet === 'placement' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'placement') }, "Placement"), index.h("button", { key: 'e958ed78f39d46ea879a51d21fb902006904470b', class: this.fieldSet === 'dimensions' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'dimensions') }, "Dimensions")), index.h("div", { key: '53164cca19d076f7d49d263b53abd11bbea7e982', class: 'scrolling-container' }, this.fieldSet === 'placement' ? (index.h("ls-field-placement", { dataItem: this.dataItem })) : this.fieldSet === 'dimensions' ? (index.h("div", { class: 'field-set' }, index.h("ls-field-dimensions", { dataItem: this.dataItem }))) : (index.h("div", { class: 'field-set' }, index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { class: 'ls-field-properties-section-description' }, "The Field you currently have selected")), index.h("div", { class: 'ls-field-type-wrapper', style: {
|
|
25567
|
+
border: `1px dashed var(--${this.signerColor(this.dataItem?.signer)}-30)`,
|
|
25568
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25569
|
+
} }, index.h("div", { class: 'ls-field-type-inner' }, index.h("div", { class: 'ls-field-type-icon', style: {
|
|
25570
|
+
border: `1px solid var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25571
|
+
color: `var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25572
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25573
|
+
} }, index.h("ls-icon", { name: "at-symbol", size: "20" })), index.h("p", { class: 'ls-field-type-name' }, "Email")))), index.h("div", { class: 'ls-field-properties-section row' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", null)), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { value: this.dataItem?.label, width: "30", placeholder: "eg. Sign Here" })), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Content Format"), index.h("p", { class: 'ls-field-properties-section-description' }, "Select the specific format you want the Recipient to enter..")), index.h("div", { class: 'input-wrapper' }, index.h("ls-icon", { id: "selectorIcon", name: "selector" }), index.h("select", null, validationTypes
|
|
25574
|
+
.filter(type => type.formType === 'email')
|
|
25575
|
+
.map(type => (index.h("option", { selected: this.dataItem?.validation === type.id, value: type.value }, type.description))))))))), index.h("div", { key: 'b497ae9483f55bbd6111b63a3e3b75c9660d4937', class: 'button-footer' }, index.h("button", { key: '0c0d68dd36200ea19ce9eaf11075599d0fe50b43', class: 'secondary' }, index.h("ls-icon", { key: 'c2c54a3b8a744c494e684592f0a6d7d08c2843d8', name: "field-duplicate", size: "20" }), "Duplicate"), index.h("button", { key: 'd88a0eb280d075c4adad2abdd548897e82fcbae6', class: 'destructive' }, index.h("ls-icon", { key: '31ddc278180530e8a1b9452249b1b784d77b56ce', name: "trash", size: "20" }), "Delete")), index.h("slot", { key: '0e166025806021ba078d0d0eec65c1f41ef20789' })));
|
|
25545
25576
|
}
|
|
25546
25577
|
};
|
|
25547
25578
|
LsFieldPropertiesEmail.style = lsFieldPropertiesEmailCss;
|
|
25548
25579
|
|
|
25549
|
-
const lsFieldPropertiesFileCss = ":host{display:
|
|
25580
|
+
const lsFieldPropertiesFileCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.properties-container{display:flex;flex-direction:column;height:100%}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-field-type-wrapper{position:relative;border-radius:0.875rem;padding:0.25rem}.ls-field-type-inner{border-radius:0.625rem;background:var(--white, #fff);display:flex;padding:0.25rem 0.5rem 0.25rem 0.25rem;align-items:center;gap:0.875rem;align-self:stretch}.ls-field-type-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.ls-field-type-name{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;}.tabs-container{display:grid;grid-template-columns:repeat(3, 1fr);width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem;border-radius:0.625rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;color:var(--gray-80, #6c6e73)}.ls-tab.active{background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.ls-tab:not(.active):hover{background:var(--gray-10, #f7f8fa)}.button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #f0f1f2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}.scrolling-container{overflow-y:auto;padding:0 1rem;margin:0 -1rem;height:calc(100% - 10.938rem)}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}.full-width{width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{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)}";
|
|
25550
25581
|
|
|
25551
25582
|
const LsFieldPropertiesFile = class {
|
|
25552
25583
|
constructor(hostRef) {
|
|
25553
25584
|
index.registerInstance(this, hostRef);
|
|
25554
25585
|
}
|
|
25555
25586
|
dataItem;
|
|
25587
|
+
fieldSet = 'content';
|
|
25588
|
+
signerColor = (index) => {
|
|
25589
|
+
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
25590
|
+
};
|
|
25556
25591
|
render() {
|
|
25557
|
-
return (index.h(index.Host, { key: '
|
|
25592
|
+
return (index.h(index.Host, { key: '979c8b325bf4675630a746fac203cf0b45811896' }, index.h("div", { key: '79f61e9f1afbac6e2dd5b9395ea01d89b771a6a7', class: 'tabs-container' }, index.h("button", { key: '36fe49eac7cb389333f2cd73b732845ec7617024', class: this.fieldSet === 'content' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'content') }, "Content"), index.h("button", { key: 'd7c6d114aa43a8b1d287ced8663712ac76c4b9f7', class: this.fieldSet === 'placement' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'placement') }, "Placement"), index.h("button", { key: '7d94a07973d9927e3289a81ab1cc14b9890b6d26', class: this.fieldSet === 'dimensions' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'dimensions') }, "Dimensions")), index.h("div", { key: 'f351044ba72e63b37f1d55292fc2e29eb527df65', class: 'scrolling-container' }, this.fieldSet === 'placement' ? (index.h("ls-field-placement", { dataItem: this.dataItem })) : this.fieldSet === 'dimensions' ? (index.h("div", { class: 'field-set' }, index.h("ls-field-dimensions", { dataItem: this.dataItem }))) : (index.h("div", { class: 'field-set' }, index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { class: 'ls-field-properties-section-description' }, "The Field you currently have selected")), index.h("div", { class: 'ls-field-type-wrapper', style: {
|
|
25593
|
+
border: `1px dashed var(--${this.signerColor(this.dataItem?.signer)}-30)`,
|
|
25594
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25595
|
+
} }, index.h("div", { class: 'ls-field-type-inner' }, index.h("div", { class: 'ls-field-type-icon', style: {
|
|
25596
|
+
border: `1px solid var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25597
|
+
color: `var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25598
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25599
|
+
} }, index.h("ls-icon", { name: "upload", size: "20" })), index.h("p", { class: 'ls-field-type-name' }, "File")))), index.h("div", { class: 'ls-field-properties-section row' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", null)), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { value: this.dataItem?.label, width: "30", placeholder: "eg. Sign Here" })), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Content Format"), index.h("p", { class: 'ls-field-properties-section-description' }, "Select the specific format you want the Recipient to enter..")), index.h("div", { class: 'input-wrapper' }, index.h("ls-icon", { id: "selectorIcon", name: "selector" }), index.h("select", null, validationTypes
|
|
25600
|
+
.filter(type => type.formType === 'file')
|
|
25601
|
+
.map(type => (index.h("option", { selected: this.dataItem?.validation === type.id, value: type.value }, type.description))))))))), index.h("div", { key: 'e6d801473e74d51783c11e507ee5d5fc81310c21', class: 'button-footer' }, index.h("button", { key: 'd17ea5d20f26c43015cfe3441040f4bb59640c8f', class: 'secondary' }, index.h("ls-icon", { key: '419df479abff15f4d6812b010d1b9373083959e3', name: "field-duplicate", size: "20" }), "Duplicate"), index.h("button", { key: 'c5d41606e3bf716e10d6b117a32164ce4ecb026a', class: 'destructive' }, index.h("ls-icon", { key: 'fe495b8b5c5fe40bd33066ae2a19896374817fc1', name: "trash", size: "20" }), "Delete"))));
|
|
25558
25602
|
}
|
|
25559
25603
|
};
|
|
25560
25604
|
LsFieldPropertiesFile.style = lsFieldPropertiesFileCss;
|
|
@@ -25567,7 +25611,7 @@ const LsFieldPropertiesGeneral = class {
|
|
|
25567
25611
|
}
|
|
25568
25612
|
dataItem;
|
|
25569
25613
|
render() {
|
|
25570
|
-
return (index.h(index.Host, { key: '
|
|
25614
|
+
return (index.h(index.Host, { key: 'e87b03ad929cc1dea1d030fd612a310d5173c838' }, index.h("div", { key: 'cf2d750d5aa86e737e54b2c7175e0f9af84b5fde', class: "ls-field-properties-section" }, "General Field"), index.h("div", { key: '4f18444c661c88c4b79510d5b0b7258285c15858' }, "Label: ", index.h("input", { key: '532c0119c5bbbda70844d91616c4ee50b8d783f7', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: '9f38fd900b3133eec3bcb0f8d36cc576f33dfa41', dataItem: this.dataItem }), index.h("slot", { key: '15467859e256ec22ec6201002cce2605bf4d3f27' })));
|
|
25571
25615
|
}
|
|
25572
25616
|
};
|
|
25573
25617
|
LsFieldPropertiesGeneral.style = lsFieldPropertiesGeneralCss;
|
|
@@ -25580,7 +25624,7 @@ const LsFieldPropertiesImage = class {
|
|
|
25580
25624
|
}
|
|
25581
25625
|
dataItem;
|
|
25582
25626
|
render() {
|
|
25583
|
-
return (index.h(index.Host, { key: '
|
|
25627
|
+
return (index.h(index.Host, { key: 'c690e84f0aaa5c21f912350d9edf2ff1805ee7c8' }, index.h("div", { key: 'bb1c3cd8c3a50f62010689e22b043bcce518a365', class: "ls-field-properties-section" }, "Image Properties"), index.h("div", { key: '8805a1f3f16fcd8a662622af4c153a40cd9fa113' }, "Label: ", index.h("input", { key: 'fdacaeeb623483d8ff9a1485223eb2e88d3a6f47', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: 'f666dd08fe2c5d1e013bb36bf441e32be69b0b04', dataItem: this.dataItem }), index.h("slot", { key: 'fda720e8f6e3cdabd50a9e41e40172a34681c300' })));
|
|
25584
25628
|
}
|
|
25585
25629
|
};
|
|
25586
25630
|
LsFieldPropertiesImage.style = lsFieldPropertiesImageCss;
|
|
@@ -25593,7 +25637,7 @@ const LsFieldPropertiesMultiple = class {
|
|
|
25593
25637
|
}
|
|
25594
25638
|
dataItem;
|
|
25595
25639
|
render() {
|
|
25596
|
-
return (index.h(index.Host, { key: '
|
|
25640
|
+
return (index.h(index.Host, { key: 'b4efff7bf847390c74406f2cdb74ce1494760913' }, index.h("div", { key: 'bab7582267affd8d2869f1644c277cafbf7193ca' }, this.dataItem.length, " items"), index.h("ls-field-dimensions", { key: '0b49d95f9a49b3a5f99b8ce03c7f7b9761507d9e', dataItem: this.dataItem }), index.h("slot", { key: 'acb018458e9772db9107c024f982a3b575976c06' })));
|
|
25597
25641
|
}
|
|
25598
25642
|
};
|
|
25599
25643
|
LsFieldPropertiesMultiple.style = lsFieldPropertiesMultipleCss;
|
|
@@ -25606,12 +25650,12 @@ const LsFieldPropertiesNumber = class {
|
|
|
25606
25650
|
}
|
|
25607
25651
|
dataItem;
|
|
25608
25652
|
render() {
|
|
25609
|
-
return (index.h(index.Host, { key: '
|
|
25653
|
+
return (index.h(index.Host, { key: '38689e88511a48f76700b6690b6f16bbdcf5c275' }, index.h("div", { key: 'e0256e1b6323656b6f8b7b088a1ef11ba5c64bf5', class: "ls-field-properties-section" }, "Number Field"), index.h("div", { key: '5c7465ccfd35e26ac079ad9daf55a53aefd46e26' }, "Label: ", index.h("input", { key: '62437f98d0d2998c304caeb5dd86f1c750d13681', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: 'c023c4022d367594fe0ccc564343f8190327300d', dataItem: this.dataItem }), index.h("slot", { key: '29dfa45d57e3b9b6532dbf2730567b71fd1c0096' })));
|
|
25610
25654
|
}
|
|
25611
25655
|
};
|
|
25612
25656
|
LsFieldPropertiesNumber.style = lsFieldPropertiesNumberCss;
|
|
25613
25657
|
|
|
25614
|
-
const lsFieldPropertiesSignatureCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0}.properties-container{display:flex;flex-direction:column;height:100%}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-field-type-wrapper{position:relative;border-radius:0.875rem;border:1px dashed var(--primary-30, #9dc3fc);background:var(--primary-10, #eff4ff);padding:0.25rem}.ls-field-type-inner{border-radius:0.625rem;background:var(--white, #fff);display:flex;padding:0.25rem 0.5rem 0.25rem 0.25rem;align-items:center;gap:0.875rem;align-self:stretch}.ls-field-type-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--blue-60, #5684f0);background:var(--blue-10, #f0f6ff);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);color:var(--blue-60, #5684f0)}.ls-field-type-name{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;}.tabs-container{display:grid;grid-template-columns:repeat(3, 1fr);width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem
|
|
25658
|
+
const lsFieldPropertiesSignatureCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.properties-container{display:flex;flex-direction:column;height:100%}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-field-type-wrapper{position:relative;border-radius:0.875rem;border:1px dashed var(--primary-30, #9dc3fc);background:var(--primary-10, #eff4ff);padding:0.25rem}.ls-field-type-inner{border-radius:0.625rem;background:var(--white, #fff);display:flex;padding:0.25rem 0.5rem 0.25rem 0.25rem;align-items:center;gap:0.875rem;align-self:stretch}.ls-field-type-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--blue-60, #5684f0);background:var(--blue-10, #f0f6ff);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);color:var(--blue-60, #5684f0)}.ls-field-type-name{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;}.tabs-container{display:grid;grid-template-columns:repeat(3, 1fr);width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem;border-radius:0.625rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;color:var(--gray-80, #6c6e73)}.ls-tab.active{background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.ls-tab:not(.active):hover{background:var(--gray-10, #f7f8fa)}.button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #f0f1f2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}.scrolling-container{overflow-y:auto;padding:0 1rem;margin:0 -1rem;height:calc(100% - 10.938rem)}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}.full-width{width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{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)}";
|
|
25615
25659
|
|
|
25616
25660
|
const LsFieldPropertiesSignature = class {
|
|
25617
25661
|
constructor(hostRef) {
|
|
@@ -25619,8 +25663,18 @@ const LsFieldPropertiesSignature = class {
|
|
|
25619
25663
|
}
|
|
25620
25664
|
dataItem;
|
|
25621
25665
|
fieldSet = 'content';
|
|
25666
|
+
signerColor = (index) => {
|
|
25667
|
+
return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
25668
|
+
};
|
|
25622
25669
|
render() {
|
|
25623
|
-
return (index.h(index.Host, { key: '
|
|
25670
|
+
return (index.h(index.Host, { key: 'df0094f1092e955e6dd14b91a7e67e7c03b18ee2' }, index.h("div", { key: '93e2fc1e8d557cebcd9c898ed318a5c63b01719f', class: 'tabs-container' }, index.h("button", { key: '5ac877ef74986931e2f2c3d1521f14f09776dadd', class: this.fieldSet === 'content' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'content') }, "Content"), index.h("button", { key: '10e426f98422863ce40b7026ad3af7fda567615f', class: this.fieldSet === 'placement' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'placement') }, "Placement"), index.h("button", { key: 'a452edbb8356e27c53637d90bb30175c4ec78303', class: this.fieldSet === 'dimensions' ? 'ls-tab active' : 'ls-tab', onClick: () => (this.fieldSet = 'dimensions') }, "Dimensions")), index.h("div", { key: 'b91ec8aa31925a648ce5c94243e2056c05f4bbf1', class: 'scrolling-container' }, this.fieldSet === 'placement' ? (index.h("ls-field-placement", { dataItem: this.dataItem })) : this.fieldSet === 'dimensions' ? (index.h("div", { class: 'field-set' }, index.h("ls-field-dimensions", { dataItem: this.dataItem }))) : (index.h("div", { class: 'field-set' }, index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { class: 'ls-field-properties-section-description' }, "The Field you currently have selected")), index.h("div", { class: 'ls-field-type-wrapper', style: {
|
|
25671
|
+
border: `1px dashed var(--${this.signerColor(this.dataItem?.signer)}-30)`,
|
|
25672
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25673
|
+
} }, index.h("div", { class: 'ls-field-type-inner' }, index.h("div", { class: 'ls-field-type-icon', style: {
|
|
25674
|
+
border: `1px solid var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25675
|
+
color: `var(--${this.signerColor(this.dataItem?.signer)}-60)`,
|
|
25676
|
+
background: `var(--${this.signerColor(this.dataItem?.signer)}-10)`,
|
|
25677
|
+
} }, index.h("ls-icon", { name: "signature", size: "20" })), index.h("p", { class: 'ls-field-type-name' }, "Signature")))), index.h("div", { class: 'ls-field-properties-section row' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", null)), index.h("div", { class: 'ls-field-properties-section' }, index.h("div", { class: 'ls-field-properties-section-text' }, index.h("p", { class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { value: this.dataItem?.label, width: "30", placeholder: "eg. Sign Here" }))))), index.h("div", { key: '386d082d5cc813c9c195ecc7ece0855b86e0cd7c', class: 'button-footer' }, index.h("button", { key: '35d6174b961aa32db31047c7b401553ccb82f579', class: 'secondary' }, index.h("ls-icon", { key: 'f901fbf9aa48417f2ea0a2a8fc527fa6e90cca33', name: "field-duplicate", size: "20" }), "Duplicate"), index.h("button", { key: '8be34a33298fde349fa6a7d42e8c4d5c44eb756d', class: 'destructive' }, index.h("ls-icon", { key: 'a56208fc1ae308a1f8eace45c0a5c5d5d35a12d7', name: "trash", size: "20" }), "Delete")), index.h("slot", { key: '5facdb89f9df774f31a1218b268746b418f8e3c3' })));
|
|
25624
25678
|
}
|
|
25625
25679
|
};
|
|
25626
25680
|
LsFieldPropertiesSignature.style = lsFieldPropertiesSignatureCss;
|
|
@@ -25633,7 +25687,7 @@ const LsFieldPropertiesText = class {
|
|
|
25633
25687
|
}
|
|
25634
25688
|
dataItem;
|
|
25635
25689
|
render() {
|
|
25636
|
-
return (index.h(index.Host, { key: '
|
|
25690
|
+
return (index.h(index.Host, { key: 'a4db8b126a38153d494b6a2e4005d08b93455f21' }, index.h("div", { key: '220eac7c15bf25713e9d7688410fb7a19fd08a0e', class: "ls-field-properties-section" }, "Text Field"), index.h("div", { key: 'e93bac0aac9e1db6e73c59a5ccedc74ebc6112de' }, "Label: ", index.h("input", { key: '23fa2aaa09a4923ff6d15647b6ed5c868d769388', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: '4bf078ffa799a5ca66f95de683957675d7dcb406', dataItem: this.dataItem }), index.h("slot", { key: '91fd6d676d88d718f84aca7a9b3742f8a5523053' })));
|
|
25637
25691
|
}
|
|
25638
25692
|
};
|
|
25639
25693
|
LsFieldPropertiesText.style = lsFieldPropertiesTextCss;
|
|
@@ -25660,7 +25714,7 @@ const LsFieldSize = class {
|
|
|
25660
25714
|
this.update.emit(diffs);
|
|
25661
25715
|
}
|
|
25662
25716
|
render() {
|
|
25663
|
-
return (index.h(index.Host, { key: '
|
|
25717
|
+
return (index.h(index.Host, { key: '370469e2e9bbfb5d9c1b034aa5a6056c125b1563' }, index.h("div", { key: 'b5807f2770fd9cfd9fc257aec00c113ffb3e22b4', class: "flex rounded-[10px] focus:outline-hidden focus:ring-4 focus:ring-offset-0 focus:ring-primary-30" }, index.h("button", { key: '31f39a39290f7edf4669f30ffe20cd5056aa07e6', "aria-label": "Make selected fields the same width as the first selected field.", class: "ls-round-button", onClick: () => this.alter({ width: this.dataItem[0].width }), "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same width as the first selected field.", "data-tooltip-place": "top" }, index.h("svg", { key: '50e12865b2fb41cce603a8017793dda5283efaef', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '281ec1021546c1701f6984c5d47f0812c11ecff7', d: "M14 9V6C14 5.44772 13.5523 5 13 5H11C10.4477 5 10 5.44772 10 6V9M14 15.0104V18C14 18.5523 13.5523 19 13 19H11C10.4477 19 10 18.5523 10 18V15.0104M6.00751 15.0104L4.00751 12M4.00751 12L6.00751 9M4.00751 12H20.0013M18.0013 15.0104L20.0013 12M20.0013 12L18.0013 9", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("button", { key: '2ddfd3aafb6d8f45f9807a71e892ff8faf2485b9', class: "ls-round-button", onClick: () => this.alter({ height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height as the first selected field.", "data-tooltip-place": "top" }, index.h("svg", { key: 'e39193ff14ed9dd817268fab706d662df75b68de', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'a2d6c9aefe4da11be709b88d9745e646273885c9', d: "M9.00439 10.0042H6.00439C5.45211 10.0042 5.00439 10.4519 5.00439 11.0042V13.0042C5.00439 13.5565 5.45211 14.0042 6.00439 14.0042H9.00439M15.0148 10.0042H18.0044C18.5567 10.0042 19.0044 10.4519 19.0044 11.0042V13.0042C19.0044 13.5565 18.5567 14.0042 18.0044 14.0042H15.0148M15.0148 17.9967L12.0044 19.9967M12.0044 19.9967L9.00439 17.9968M12.0044 19.9967V4.00293M15.0148 6.00299L12.0044 4.00293M12.0044 4.00293L9.00439 6.00293", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("button", { key: '692649a6564f3df46d04360108fecf1bad055bb7', class: "ls-round-button", onClick: () => this.alter({ width: this.dataItem[0].width, height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height and width as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height and width as the first selected field.", "data-tooltip-place": "top" }, index.h("svg", { key: '7905e0ab8fd9d51fe6823ada2dbe50a6f5c0e51e', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '51fef530c0a273c0850cd859ae3db3af51213110', d: "M4 8V4M4 4H8M4 4L8 8M20 8V4M20 4H16M20 4L16 8M4 16V20M4 20H8M4 20L8 16M20 16V20M20 20H16M20 20L16 16M8 8H10M8 8V10M16 8H14M16 8V10M8 16H10M8 16V14M16 16V14M16 16H14", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("slot", { key: 'e5a1ccbd3d3fac7280a9273ca2c19ed672ca1d89' })));
|
|
25664
25718
|
}
|
|
25665
25719
|
};
|
|
25666
25720
|
LsFieldSize.style = lsFieldSizeCss;
|
|
@@ -25708,10 +25762,10 @@ const LsFormfield = class {
|
|
|
25708
25762
|
render() {
|
|
25709
25763
|
const { name, fieldId, label, as, value, placeholder, descriptionText, errorText, aria, infoTooltipText, disabled, extraLabel, valid, dirty, count, countMax, buttonClick, buttonIcon, fieldIcon, labelIcon, } = this;
|
|
25710
25764
|
const countClass = value && value.toString().length > countMax ? 'formfield-count-error' : 'formfield-count';
|
|
25711
|
-
return (index.h("host", { key: '
|
|
25765
|
+
return (index.h("host", { key: '1a31b37448b48d4d89b7c73e8ac26e951b3eacc1', class: "formfield-host" }, label?.length > 1 || extraLabel !== 'none' && (index.h("div", { key: 'e652e0b4d24b3c79c722ffbdcc7487478285db5f', class: "formfield-top-elements" }, index.h("div", { key: '384366ebbf68834977299e5e6e676343e06bbe01', class: "formfield-left-side" }, labelIcon && index.h("ls-icon", { key: 'c8d197bbeca42e72a9c69faa4cef98274be8b1f1', name: labelIcon }), index.h("label", { key: 'bae645add69fe37ac8cde9eef4c0b38566ed7bd4', htmlFor: name, class: "formfield-label" }, label), infoTooltipText && index.h("ls-icon", { key: '1d7a22559e0cbaa31cd9634f003a24b5e4533f67', name: 'information-circle' })), extraLabel === 'optional' ? (index.h("ls-label", { text: "Optional", colour: "gray", type: "low" })) : extraLabel === 'required' ? (index.h("ls-label", { text: "Required", colour: "gray", type: "low" })) : (''))), as === 'text' ? (index.h("ls-text-input", { id: fieldId, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon, onInput: (event) => this.handleChange(event) })) : as === 'select' ? (index.h("ls-select-input", { id: name, name: name, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon }, index.h("slot", null))) : as === 'radio' ? (index.h("ls-radio-input", { radioId: label, label: value?.toString(), icon: fieldIcon, name: name, disabled: disabled })) : as === 'textarea' ? (index.h("ls-textarea-input", { id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'password' ? (index.h("ls-text-input", { type: "password", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'displayonly' ? (index.h("ls-text-input", { type: "displayonly", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'number' ? (index.h("ls-number-input", { type: "ls", id: name, name: name, value: Number(value), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : (index.h("p", null, "placeholder")), errorText ||
|
|
25712
25766
|
count ||
|
|
25713
25767
|
countMax ||
|
|
25714
|
-
(descriptionText && (index.h("div", { key: '
|
|
25768
|
+
(descriptionText && (index.h("div", { key: '28d90f818b3d0b80d5d2f2af79dcdf84c4f169b8', class: "formfield-bottom-elements" }, errorText && !valid ? index.h("p", { class: "formfield-error-text" }, errorText) : descriptionText ? index.h("p", { class: "formfield-description-text" }, descriptionText) : '', count && (index.h("div", { key: '36d89672d85a3a702fdef0be12e85864e8592e83', class: "formfield-count-container" }, index.h("p", { key: 'a936d3309ba99a82378596b6c6b01a1b63b6508e', class: countClass }, value?.toString()?.length), countMax > 0 && (index.h("div", { key: '11436b2e9bfd90c1bf9bb0c092d575b04312ad6f', class: countClass }, index.h("p", { key: 'c294b63dc89642ec8d18871ab7929225d34a252a' }, "/"), index.h("p", { key: '12e3ae9fa67ce3a12fecd935b0db5d66661f7082' }, countMax))))))))));
|
|
25715
25769
|
}
|
|
25716
25770
|
static get watchers() { return {
|
|
25717
25771
|
"value": ["valueWatcher"]
|
|
@@ -32722,7 +32776,7 @@ const LsIcon = class {
|
|
|
32722
32776
|
console.warn('Icons in src/components/ls-icon/icons.ts should be identical to the enum type in src/types/Icon.ts. Please add all icons to the enum type.');
|
|
32723
32777
|
}
|
|
32724
32778
|
render() {
|
|
32725
|
-
return (index.h("host", { key: '
|
|
32779
|
+
return (index.h("host", { key: '50d59c76f04664a23e2ba5c2c841f600efec02c1' }, icons
|
|
32726
32780
|
?.filter((icon) => icon.name === this.name)
|
|
32727
32781
|
?.map((icon) => (index.h("div", { key: icon?.name, class: 'iconContainer', style: {
|
|
32728
32782
|
height: `${this.size}px`,
|
|
@@ -32773,7 +32827,7 @@ const LsNumberInput = class {
|
|
|
32773
32827
|
? 'invalid'
|
|
32774
32828
|
: 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
|
|
32775
32829
|
const plusMinusClass = clsx(disabled ? 'button-disabled' : 'button');
|
|
32776
|
-
return (index.h("host", { key: '
|
|
32830
|
+
return (index.h("host", { key: '794d35ed6560fe1ec5798e54ef29306978d03d50', class: type === 'ls' && 'host' }, type === 'ls' && (index.h("button", { key: '4f87d8841c7888ef60dc49f1858611c60830c5e1', class: plusMinusClass, onClick: () => handleMinus(), disabled: disabled }, index.h("ls-icon", { key: 'd21f4db0b255d2615dec43e8b0ea0acc83e8f8fe', id: 'buttonIcon', name: 'minus-sm' }))), index.h("div", { key: 'd5e398cf289a86f6bbe4634347e1cf199e9fe1de', class: 'input-container' }, fieldIcon && (index.h("ls-icon", { key: '8ba911402323ee7c7eb91124f3fa3a988f439e1f', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("input", { key: '203390784de95eaf47fe1b2f8e44d0370dd08ddd', type: 'number', class: inputClass, id: name, name: name, value: value, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled, onInput: (event) => handleChange(event) }), index.h("div", { key: '432584cb1e38877df70256a331a62478b386d6cb', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'acada7eab9b490d2505fcd2c0d1bb08ba0ae7d8f', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && type !== 'ls' && (index.h("button", { key: 'dbc5e58f0d8310445d4717b110ec6ee59c349513', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: 'a5974c1990792c95f1aa6d260ba53720ac33afdb', id: 'buttonIcon', name: buttonIcon }))))), type === 'ls' && (index.h("button", { key: 'a9a50f10982d7d357f0ea69eea951a534b7e5dec', class: plusMinusClass, onClick: handlePlus, disabled: disabled }, index.h("ls-icon", { key: '1553817d47191ba8eacfc68cabe0896613f2d7e5', id: 'buttonIcon', name: 'plus-sm' })))));
|
|
32777
32831
|
}
|
|
32778
32832
|
};
|
|
32779
32833
|
LsNumberInput.style = lsNumberInputCss;
|
|
@@ -32829,7 +32883,7 @@ const LsParticipantManager = class {
|
|
|
32829
32883
|
return index > 200 ? 'gray' : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
32830
32884
|
};
|
|
32831
32885
|
render() {
|
|
32832
|
-
return (index.h(index.Host, { key: '
|
|
32886
|
+
return (index.h(index.Host, { key: '846505f31da41d85e4aae5119637975ce94f736d' }, index.h("div", { key: 'fee2a1a3cc304c61a915a9583372263148acc4cc', class: "ls-editor-infobox" }, index.h("h2", { key: '706f3d3c7a15d132fd4e449d4dc6544076f27ab6', class: "toolbox-section-title" }, "Participants"), index.h("p", { key: '57fa9b430561cb6439ef5c60141d5d9ffbd115ee', class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { key: 'e21c5e1ce563b6acc7c3135581ae23d45fcff829', class: "participant-list" }, this.template?.roles.map((r, index$1) => {
|
|
32833
32887
|
return (index.h("div", { class: "participant-card", onClick: () => {
|
|
32834
32888
|
this.selectedHandler(r);
|
|
32835
32889
|
}, style: {
|
|
@@ -32848,7 +32902,7 @@ const LsParticipantManager = class {
|
|
|
32848
32902
|
} }, r.name || `${r.signerIndex > 100 ? 'Witness' : 'Signer'} ${index$1 + 1}`), index.h("p", { class: "participant-text-type", style: {
|
|
32849
32903
|
color: `var(--${this.participantColor(r?.signerIndex)}-80)`,
|
|
32850
32904
|
} }, r.signerIndex > 100 ? 'Witness' : 'Signer'))));
|
|
32851
|
-
})), index.h("div", { key: '
|
|
32905
|
+
})), index.h("div", { key: '8d8b004e6e30e748a63c63b4315fdd58d1748aab', class: 'add-participant-button' }, index.h("button", { key: '41312ffdafec9bca1a0e3ef7b0e554d74739f957', onClick: () => this.createHandler() }, index.h("ls-icon", { key: '03cbcf950e7a61b7a35083034dfe160e6537d7b2', name: "user-add", size: "20", color: "var(--gray-100, #45484D);" }), index.h("p", { key: '2644a582f45a54ca06661d21cc47d81cb224c94d' }, "Add Participant"))), index.h("slot", { key: '2eb37c729f03886331c2bb0fe28c77bb26b2e232' })));
|
|
32852
32906
|
}
|
|
32853
32907
|
};
|
|
32854
32908
|
LsParticipantManager.style = lsParticipantManagerCss;
|
|
@@ -32902,18 +32956,18 @@ const LsParticipantSelect = class {
|
|
|
32902
32956
|
return index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];
|
|
32903
32957
|
};
|
|
32904
32958
|
render() {
|
|
32905
|
-
return (index.h(index.Host, { key: '
|
|
32959
|
+
return (index.h(index.Host, { key: 'adc06aa02f40eb9f365bd054fdbc17ec37ff8716' }, index.h("div", { key: 'c9c48044bdd4b590145f459ab299e76accef6ffa', class: "dropdown" }, index.h("div", { key: '9895a30c6a2e6962feedfd09436d7f6b45c2e6be', class: "dropdown-header", onClick: this.toggleDropdown }, index.h("svg", { key: '216a68483c4ba3463e9bd49a7c228e57b00fa2a7', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'e09aa4f1fd4f13dc58bf4c0849f1fd78cb80dda8', d: "M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z", fill: "#78A3FA", stroke: "#F7F8FA" }), index.h("path", { key: 'f2fdb78217f014be89293f38d858154d0913e5a5', d: "M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z", fill: "#46DBAA", stroke: "#F7F8FA" }), index.h("path", { key: '6d67903da3a1d5ccadb81e6d52cd745d7de2267b', d: "M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z", fill: "#FAD232", stroke: "#F7F8FA" }), index.h("path", { key: 'ae2f8081640fe8f320a8445b451ab75c51ff7415', d: "M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75", stroke: "#939599", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })), index.h("p", { key: '5e9fe963642411d4e55a96d5582836400f3dd374', class: 'placing-fields-text' }, "Placing Fields for"), index.h("div", { key: '8ffffe29c80d7c4eb1891659c709378a9c3f6fc9', class: 'selected-role-label', style: {
|
|
32906
32960
|
background: `var(--${this.participantColor(this.selectedRole?.signerIndex)}-20)`,
|
|
32907
32961
|
color: `var(--${this.participantColor(this.selectedRole?.signerIndex)}-90)`,
|
|
32908
|
-
} }, index.h("ls-icon", { key: '
|
|
32962
|
+
} }, index.h("ls-icon", { key: 'adf53e3bfec038ea29501a9a345660e05e2df96b', size: "18", name: this.selectedRole?.signerIndex === 0 ? 'user' : this.selectedRole?.signerIndex > 100 ? 'eye' : 'signature' }), this.selectedRole.name || `Participant ${this.selectedRole.signerIndex}`), index.h("button", { key: 'c5ad6fe12825485d2b07d2e24ff96914cc1c8713', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, index.h("ls-icon", { key: '2f8b34f2f213b794e8c08d56834de53608e86ae6', name: "chevron-down" }))), this.isOpen && (index.h("div", { key: '025633acc266061aae0ff2e71c1a8288d8419aa0', class: "dropdown-list" }, index.h("div", { key: 'c3bb123591c89ca9ddc165e45974c463e416cf0c', class: this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item', onClick: () => this.selectRole({ signerIndex: 0, name: 'Sender' }), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle') }, index.h("div", { key: '7b7e2539026fcc467985871a8a3ec5090a990690', class: 'role-icon', style: {
|
|
32909
32963
|
background: `var(--${defaultRolePalette[0]}-40)`,
|
|
32910
32964
|
color: `var(--${defaultRolePalette[0]}-80)`,
|
|
32911
|
-
} }, index.h("ls-icon", { key: '
|
|
32965
|
+
} }, index.h("ls-icon", { key: 'f5c41d6441598e8e5521b03b68036fca4334deb6', name: "user" })), index.h("div", { key: '9ff52f210dbc37b22ad8fbfc11ca5c97f4e93e0f', class: 'role-text' }, index.h("p", { key: '4264fc560cd02f2f4b569be4ae3b4dba7a27984f', class: 'role-name' }, 'Sender'), index.h("p", { key: '916b0b78771ad2f57286ac851da0024b2090046e', class: 'role-type' }, "You")), index.h("ls-icon", { key: 'ee7a56441d57d661c79981b51aee2e6f4fbc30e6', class: 'check-icon', name: this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle', solid: this.selectedRole?.signerIndex === 0 })), this.roles.map(r => (index.h("div", { class: r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item', onClick: () => this.selectRole(r), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget
|
|
32912
32966
|
.querySelector('.check-icon')
|
|
32913
32967
|
?.setAttribute('name', r.signerIndex !== this.selectedRole?.signerIndex ? 'base-circle' : 'check-circle') }, index.h("div", { class: 'role-icon', style: {
|
|
32914
32968
|
background: r.signerIndex > 100 ? `var(--${this.participantColor(r?.signerIndex)}-30)` : `var(--${this.participantColor(r?.signerIndex)}-40)`,
|
|
32915
32969
|
color: `var(--${this.participantColor(r?.signerIndex)}-90)`,
|
|
32916
|
-
} }, index.h("ls-icon", { name: r.signerIndex > 100 ? 'eye' : 'signature' })), index.h("div", { class: 'role-text' }, index.h("p", { class: 'role-name' }, r.name || `Participant ${r.signerIndex}`), index.h("p", { class: 'role-type' }, r.signerIndex > 200 ? 'Approver' : r.signerIndex > 100 ? 'Witness' : 'Signer')), index.h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex }))))))), index.h("slot", { key: '
|
|
32970
|
+
} }, index.h("ls-icon", { name: r.signerIndex > 100 ? 'eye' : 'signature' })), index.h("div", { class: 'role-text' }, index.h("p", { class: 'role-name' }, r.name || `Participant ${r.signerIndex}`), index.h("p", { class: 'role-type' }, r.signerIndex > 200 ? 'Approver' : r.signerIndex > 100 ? 'Witness' : 'Signer')), index.h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex }))))))), index.h("slot", { key: '3051c3214e714789a52a94b06044deb2e6b61066' })));
|
|
32917
32971
|
}
|
|
32918
32972
|
};
|
|
32919
32973
|
LsParticipantSelect.style = lsParticipantSelectCss;
|
|
@@ -32934,7 +32988,7 @@ const LsRadioInput = class {
|
|
|
32934
32988
|
render() {
|
|
32935
32989
|
const { label, radioId, icon, name, disabled, checked, customStyle, } = this;
|
|
32936
32990
|
const radioLabelClass = clsx('radioLabel', disabled && 'disabled', checked && 'checked');
|
|
32937
|
-
return (index.h("label", { key: '
|
|
32991
|
+
return (index.h("label", { key: '621ef21ba0ad35eea192888b38baa71cb0b7b5c0', htmlFor: radioId, tabIndex: 0, class: radioLabelClass, style: customStyle }, index.h("input", { key: '81ab1231ce9321fc949126ec4f3b41e1a45a7229', type: 'radio', class: 'inputClass', id: radioId, name: name, value: label, disabled: disabled, tabIndex: 0, checked: checked }), index.h("div", { key: '96b420d8564684aebc9e26240e9435adeb89f295', class: 'spanContainer' }, index.h("span", { key: 'd5ae7c5e0b47868453aef50429609060fc0d6989' }, icon && index.h("ls-icon", { key: 'c40866a3d56e08c08cb5c44e0a296902fb96df9e', name: icon, size: "16" })), index.h("span", { key: '4efebbaf9020a29f8c2b439d45f772b902f7019d' }, label))));
|
|
32938
32992
|
}
|
|
32939
32993
|
};
|
|
32940
32994
|
LsRadioInput.style = lsRadioInputCss;
|
|
@@ -32971,7 +33025,7 @@ const LsSelectInput = class {
|
|
|
32971
33025
|
: displayOnly
|
|
32972
33026
|
? 'displayOnly'
|
|
32973
33027
|
: 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
|
|
32974
|
-
return (index.h("host", { key: '
|
|
33028
|
+
return (index.h("host", { key: '23a3bd28d346226d7c5c6797a8fb8235bc826ca3', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: 'e3e62e3955940b53fbfe77109de407049ddc33ca', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("select", { key: '538f2ffec923748499d56619db951587421bb0cc', class: inputClass, id: name, name: name, "aria-label": aria, required: required, disabled: disabled }, index.h("slot", { key: '703df2c5108e0e968be453c13db77da508f4675f' })), index.h("div", { key: '3ff197806e02d925e5d677b472a2502784cac157', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '4eb47121bc35a79ae4fb3b763c38b8d5a68f62ed', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon ? (index.h("button", { class: 'button', onClick: buttonClick }, index.h("ls-icon", { id: 'buttonIcon', name: buttonIcon }))) : (index.h("ls-icon", { id: disabled ? 'select-arrow-disabled' : 'select-arrow', name: 'chevron-down' })))));
|
|
32975
33029
|
}
|
|
32976
33030
|
};
|
|
32977
33031
|
LsSelectInput.style = lsSelectInputCss;
|
|
@@ -33017,11 +33071,11 @@ const LsStatusbar = class {
|
|
|
33017
33071
|
}
|
|
33018
33072
|
render() {
|
|
33019
33073
|
console.log('editor', this.editor);
|
|
33020
|
-
return (index.h(index.Host, { key: '
|
|
33074
|
+
return (index.h(index.Host, { key: '29e74976e7444161b89f0fa80ba142eff3032d63' }, index.h("div", { key: '4503a9ff460e9266d8432e1ad8d0927753fc46c6', class: "status-bar-section" }, index.h("button", { key: 'bca26ed3b8d5b788b0a4359e5d5ddd793a3e98a7', onClick: () => this.setZoom(this.editor.zoom * 0.8) }, index.h("ls-icon", { key: 'f249a5e2adcf4395caf67dbd584ca463084a4830', name: "zoom-out" })), index.h("div", { key: 'aa832c008d5f55566c3bb2986fe39dc32158f8cf' }, index.h("input", { key: '12562098a3495a8b5daefaaa56241ce7ac72cae2', type: "range", min: "1", max: "300", value: this.zoom * 100, class: "slider", id: "zoomRange", onInput: () => this.handleZoomInput() })), index.h("button", { key: '2d37fb2a3dd4834ac8eab5471e6d5382a5cbe4b2', onClick: () => this.setZoom(this.editor.zoom / 0.8) }, index.h("ls-icon", { key: '885fb40cafe1d04a5fc2282f0488167e3787104b', name: "zoom-in" }))), index.h("div", { key: '3fb58e160add6ec615df61d7c31727ffba1073d3', class: "status-bar-section" }, index.h("button", { key: '26b3681201915faecfa5c54093dc7f6f4c2e2bae', onClick: () => this.fitWidth() }, index.h("ls-icon", { key: 'cde71d2e228468736d6f61d8dbb9a985d56ed87b', name: "fit-width" })), index.h("button", { key: '03ce74b5f0669a43ee1630b6c99eb583f5572d6a', onClick: () => this.fitHeight() }, index.h("ls-icon", { key: 'c7ca92cc5ca9ea331f933b523fd451d9cca494bf', name: "fit-height" }))), index.h("div", { key: 'd6677fed47861805989c4a52cfbfcf6754857864', class: "status-bar-section" }, index.h("button", { key: '0d5a5616e15f68911efce0573507337491c7e304', onClick: () => {
|
|
33021
33075
|
this.editor.pagePrev();
|
|
33022
|
-
} }, index.h("ls-icon", { key: '
|
|
33076
|
+
} }, index.h("ls-icon", { key: '599d5eee4d7aae6719972efd8c150a90d3a61245', name: "chevron-left" })), index.h("p", { key: 'afbbd26449146e65a5f44e21bf49095da39bc59d' }, "1 / 2"), index.h("button", { key: 'b751678f28ac886ff4aba3df87d7368e1b80d504', onClick: () => {
|
|
33023
33077
|
this.editor.pageNext();
|
|
33024
|
-
} }, index.h("ls-icon", { key: '
|
|
33078
|
+
} }, index.h("ls-icon", { key: '95175e526b2e7361d94d6ae1d1b704b402ae17ba', name: "chevron-right" }))), index.h("slot", { key: '35082524ac623c9146016b6c7fb344365e48625c' })));
|
|
33025
33079
|
}
|
|
33026
33080
|
};
|
|
33027
33081
|
LsStatusbar.style = lsStatusbarCss;
|
|
@@ -33061,7 +33115,7 @@ const LsTextInput = class {
|
|
|
33061
33115
|
: dirty && !valid
|
|
33062
33116
|
? 'invalid'
|
|
33063
33117
|
: 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
|
|
33064
|
-
return (index.h(index.Host, { key: '
|
|
33118
|
+
return (index.h(index.Host, { key: 'ece2114bb17097f9748baf7b5ba7816c940b0da3', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '42566241f476a8d076379977825a021568d2eaff', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), type === 'password' ? (index.h("input", { type: showPassword && 'password', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled })) : type === 'displayonly' ? (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: true })) : (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled })), index.h("div", { key: 'f23fd439c838e6433856b1a8c844f3885c1afcd5', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'dcad35ca05b968901cb7477aeede0d6267b23d41', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: '76fc749f7551b089f38cb7def68dac0b62ed350e', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: '52f58af15ca770863e09bb4c46f4017304a5effb', id: 'buttonIcon', name: buttonIcon }))), type === 'password' && !buttonIcon && (index.h("ls-icon-button", { key: '73f521570c8846caa8ca5f5e2b50bf9602544782', id: 'password-icon', icon: showPassword ? 'eye' : 'eye-off', onClick: handlePassword })))));
|
|
33065
33119
|
}
|
|
33066
33120
|
};
|
|
33067
33121
|
LsTextInput.style = lsTextInputCss;
|
|
@@ -33097,7 +33151,7 @@ const LsTextareaInput = class {
|
|
|
33097
33151
|
: displayOnly
|
|
33098
33152
|
? 'displayOnly'
|
|
33099
33153
|
: 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
|
|
33100
|
-
return (index.h("host", { key: '
|
|
33154
|
+
return (index.h("host", { key: '33417515941cf937c4734d99c744cac2050c1517', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '3d0d5ffe3a48a0bcdd034d7956b32536e645fa43', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("textarea", { key: '7bed853348e26ea3436cd98b3f8fe44ac644a70f', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled }), index.h("div", { key: '7ac04c2c6fea8dd58d54573bd242be1dd9603f53', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'd01bd35115a651fe7cbd752dfbdf49625cdcc1a1', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: '43dc1db404f654aaa6d38d7cb71b1b0eebae6fb2', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: 'facf4fbde3b718a93d7198ed4f77bd293b8df5f5', id: 'buttonIcon', name: buttonIcon }))))));
|
|
33101
33155
|
}
|
|
33102
33156
|
};
|
|
33103
33157
|
LsTextareaInput.style = lsTextareaInputCss;
|
|
@@ -33109,7 +33163,7 @@ const LsToggle = class {
|
|
|
33109
33163
|
index.registerInstance(this, hostRef);
|
|
33110
33164
|
}
|
|
33111
33165
|
render() {
|
|
33112
|
-
return (index.h(index.Host, { key: '
|
|
33166
|
+
return (index.h(index.Host, { key: '14aa511f200cbc949d135b07cb07a70b7edfbdcf' }, index.h("label", { key: 'f994ca1531ab9080830b74c751965475308f3572', class: "switch" }, index.h("input", { key: 'be377728a99b1163f6d61e8d3ffe12d2f9da205a', type: "checkbox" }), index.h("span", { key: 'a8498a99718af2a5be833eef6b6d95d76aae29ff', class: "slider round" })), index.h("slot", { key: 'bd760e7276a77d97bba2799beff818aef974d2ee' })));
|
|
33113
33167
|
}
|
|
33114
33168
|
};
|
|
33115
33169
|
LsToggle.style = lsToggleCss;
|
|
@@ -33152,12 +33206,12 @@ const LsToolbar = class {
|
|
|
33152
33206
|
this.update.emit(diffs);
|
|
33153
33207
|
}
|
|
33154
33208
|
render() {
|
|
33155
|
-
return (index.h(index.Host, { key: '
|
|
33209
|
+
return (index.h(index.Host, { key: '8692ee74e68449714b38624068b752b6161d5797' }, this.dataItem && this.dataItem.length > 1 ? (index.h("div", { class: 'rowbox' }, index.h("ls-field-format", { dataItem: this?.dataItem }), index.h("ls-field-alignment", { dataItem: this.dataItem }), index.h("ls-field-distribute", { dataItem: this.dataItem }), index.h("ls-field-size", { dataItem: this.dataItem }))) : (index.h("div", { class: 'rowbox' }, this.dataItem && this.dataItem.length === 1 ? (index.h("ls-field-format", { dataItem: this?.dataItem })) : (index.h("ls-participant-select", { roles: this.template?.roles, dataItem: this?.dataItem })))), index.h("slot", { key: '7790e788903c493268ab783df10ebce9662afc84' })));
|
|
33156
33210
|
}
|
|
33157
33211
|
};
|
|
33158
33212
|
LsToolbar.style = lsToolbarCss;
|
|
33159
33213
|
|
|
33160
|
-
const lsToolboxFieldCss = ":host{display:flex;padding:0.5rem;align-items:center;justify-content:center;gap:0.875rem;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #fff);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.toolbox-field-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--
|
|
33214
|
+
const lsToolboxFieldCss = ":host{display:flex;padding:0.5rem;align-items:center;justify-content:center;gap:0.875rem;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #fff);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.toolbox-field-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--signer-color);background:var(--signer-color-light);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);color:var(--signer-color)}.toolbox-field-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;width:100%;margin:0}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
|
|
33161
33215
|
|
|
33162
33216
|
const LsToolboxField = class {
|
|
33163
33217
|
constructor(hostRef) {
|
|
@@ -33185,6 +33239,10 @@ const LsToolboxField = class {
|
|
|
33185
33239
|
* The starting width of this control type in pixels.
|
|
33186
33240
|
*/
|
|
33187
33241
|
defaultWidth;
|
|
33242
|
+
/**
|
|
33243
|
+
* The signer color of the element
|
|
33244
|
+
*/
|
|
33245
|
+
color = 'primary';
|
|
33188
33246
|
handleDragStart(event) {
|
|
33189
33247
|
// Add the target element's id to the data transfer object
|
|
33190
33248
|
event.dataTransfer.setData('application/json', JSON.stringify({
|
|
@@ -33202,7 +33260,7 @@ const LsToolboxField = class {
|
|
|
33202
33260
|
}
|
|
33203
33261
|
}
|
|
33204
33262
|
render() {
|
|
33205
|
-
return (index.h(index.Host, { key: '
|
|
33263
|
+
return (index.h(index.Host, { key: '14ad8062f22a1d3eb0130dbd26bf06c522c6b4e6', draggable: "true" }, index.h("div", { key: 'd4da463a5786f80d87d472ab19e812c4d4395f35', class: "toolbox-field-icon", style: { '--signer-color-light': `var(--${this.color}-10)`, '--signer-color': `var(--${this.color}-60)` } }, index.h("ls-icon", { key: 'a2453e407f4681bfc14ea9b4d01d54d8ae00a47f', name: this.icon, size: "20" })), index.h("p", { key: '61b6673d2b2af3a80e049bcccf01be4c94eabbe7', class: "toolbox-field-label" }, this.label), index.h("ls-icon", { key: '53a1e91ee1ddc89e1e6835c7e96efb56583fbce5', name: "drag-vertical", size: "16", color: "#787a80" })));
|
|
33206
33264
|
}
|
|
33207
33265
|
};
|
|
33208
33266
|
LsToolboxField.style = lsToolboxFieldCss;
|