legalesign-document-viewer 0.4.4 → 0.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-BpMnxZQ4.js → index-C4ibYtjE.js} +5 -5
- package/dist/cjs/{index-BpMnxZQ4.js.map → index-C4ibYtjE.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/ls-compose-manager.cjs.entry.js +3 -3
- package/dist/cjs/{ls-document-options_45.cjs.entry.js → ls-document-options_46.cjs.entry.js} +312 -171
- package/dist/cjs/ls-document-options_46.cjs.entry.js.map +1 -0
- package/dist/cjs/ls-document-viewer.cjs.js +2 -2
- package/dist/cjs/ls-field-properties-dropdown.cjs.entry.js +2 -2
- package/dist/cjs/ls-formfield.cjs.entry.js +4 -4
- package/dist/cjs/ls-number-input_5.cjs.entry.js +8 -8
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/ls-compose-manager/ls-compose-manager.js +2 -2
- package/dist/collection/components/ls-document-viewer/editorCalculator.js +2 -0
- package/dist/collection/components/ls-document-viewer/editorCalculator.js.map +1 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.css +37 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +32 -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.css +16 -4
- package/dist/collection/components/ls-editor-field/ls-editor-field.js +116 -16
- package/dist/collection/components/ls-editor-field/ls-editor-field.js.map +1 -1
- package/dist/collection/components/ls-editor-table/ls-editor-table.js +1 -1
- package/dist/collection/components/ls-feature-column/ls-feature-column.js +6 -6
- package/dist/collection/components/ls-field-alignment/ls-field-alignment.js +2 -2
- package/dist/collection/components/ls-field-content/ls-field-content.js +2 -2
- package/dist/collection/components/ls-field-dimensions/ls-field-dimensions.js +1 -1
- package/dist/collection/components/ls-field-distribute/ls-field-distribute.js +5 -5
- package/dist/collection/components/ls-field-footer/ls-field-footer.js +1 -1
- package/dist/collection/components/ls-field-format/ls-field-format.js +11 -11
- package/dist/collection/components/ls-field-placement/ls-field-placement.js +1 -1
- package/dist/collection/components/ls-field-properties/ls-field-properties.js +1 -1
- package/dist/collection/components/ls-field-properties-advanced/ls-field-properties-advanced.js +2 -2
- package/dist/collection/components/ls-field-properties-autosign/ls-field-properties-autosign.js +1 -1
- package/dist/collection/components/ls-field-properties-container/ls-field-properties-container.js +1 -1
- package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js +1 -1
- package/dist/collection/components/ls-field-properties-dropdown/ls-field-properties-dropdown.js +1 -1
- package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js +1 -1
- package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js +1 -1
- package/dist/collection/components/ls-field-properties-general/ls-field-properties-general.js +1 -1
- package/dist/collection/components/ls-field-properties-image/ls-field-properties-image.js +1 -1
- package/dist/collection/components/ls-field-properties-multiple/ls-field-properties-multiple.js +3 -3
- package/dist/collection/components/ls-field-properties-number/ls-field-properties-number.js +1 -1
- package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js +1 -1
- package/dist/collection/components/ls-field-properties-text/ls-field-properties-text.js +1 -1
- package/dist/collection/components/ls-field-size/ls-field-size.js +1 -1
- package/dist/collection/components/ls-field-type-display/ls-field-type-display.js +3 -3
- package/dist/collection/components/ls-formfield/inputs/ls-number-input/ls-number-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-select-input/ls-select-input.js +1 -1
- package/dist/collection/components/ls-formfield/inputs/ls-text-input/ls-text-input.js +2 -2
- package/dist/collection/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.js +1 -1
- package/dist/collection/components/ls-formfield/ls-formfield.js +2 -2
- package/dist/collection/components/ls-helper-bar/ls-helper-bar.js +2 -2
- package/dist/collection/components/ls-icon/ls-icon.js +1 -1
- package/dist/collection/components/ls-input-wrapper/ls-input-wrapper.js +1 -1
- package/dist/collection/components/ls-keyboard-shortcuts/ls-keyboard-shortcuts.js +1 -1
- package/dist/collection/components/ls-page-loader/ls-page-loader.js +2 -2
- package/dist/collection/components/ls-participant-card/ls-participant-card.js +8 -8
- package/dist/collection/components/ls-participant-manager/ls-participant-manager.js +2 -2
- package/dist/collection/components/ls-participant-select/ls-participant-select.js +9 -9
- package/dist/collection/components/ls-props-section/ls-props-section.js +1 -1
- package/dist/collection/components/ls-recipient-card/ls-recipient-card.css +15 -0
- package/dist/collection/components/ls-recipient-card/ls-recipient-card.js +29 -5
- package/dist/collection/components/ls-recipient-card/ls-recipient-card.js.map +1 -1
- package/dist/collection/components/ls-recipient-manager/ls-recipient-manager.js +1 -1
- package/dist/collection/components/ls-statusbar/ls-statusbar.js +3 -3
- package/dist/collection/components/ls-title-input/ls-title-input.css +320 -0
- package/dist/collection/components/ls-title-input/ls-title-input.js +130 -0
- package/dist/collection/components/ls-title-input/ls-title-input.js.map +1 -0
- package/dist/collection/components/ls-toggle/ls-toggle.js +2 -2
- package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js +3 -3
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js.map +1 -1
- package/dist/collection/components/ls-tooltip/ls-tooltip.js +1 -1
- package/dist/collection/components/ls-validation-manager/ls-validation-manager.js +2 -2
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js +25 -3
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js.map +1 -1
- package/dist/collection/types/ValidationError.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/ls-compose-manager.js +3 -3
- package/dist/components/ls-document-options.js +1 -1
- package/dist/components/ls-document-viewer.js +128 -97
- package/dist/components/ls-document-viewer.js.map +1 -1
- package/dist/components/ls-editor-field.js +1 -1
- package/dist/components/ls-editor-table.js +1 -1
- package/dist/components/ls-feature-column.js +1 -1
- package/dist/components/ls-field-alignment.js +1 -1
- package/dist/components/ls-field-content.js +1 -1
- package/dist/components/ls-field-dimensions.js +1 -1
- package/dist/components/ls-field-distribute.js +1 -1
- package/dist/components/ls-field-footer.js +1 -1
- package/dist/components/ls-field-format.js +1 -1
- package/dist/components/ls-field-placement.js +1 -1
- package/dist/components/ls-field-properties-advanced.js +1 -1
- package/dist/components/ls-field-properties-autosign.js +1 -1
- package/dist/components/ls-field-properties-container.js +1 -1
- package/dist/components/ls-field-properties-date.js +1 -1
- package/dist/components/ls-field-properties-dropdown.js +15 -15
- package/dist/components/ls-field-properties-email.js +1 -1
- package/dist/components/ls-field-properties-file.js +1 -1
- package/dist/components/ls-field-properties-general.js +1 -1
- package/dist/components/ls-field-properties-image.js +1 -1
- package/dist/components/ls-field-properties-multiple.js +1 -1
- package/dist/components/ls-field-properties-number.js +1 -1
- package/dist/components/ls-field-properties-signature.js +1 -1
- package/dist/components/ls-field-properties-text.js +1 -1
- package/dist/components/ls-field-properties.js +1 -1
- package/dist/components/ls-field-size.js +1 -1
- package/dist/components/ls-field-type-display.js +1 -1
- package/dist/components/ls-formfield.js +10 -10
- package/dist/components/ls-helper-bar.js +1 -1
- package/dist/components/ls-icon.js +1 -1
- package/dist/components/ls-input-wrapper.js +1 -1
- package/dist/components/ls-keyboard-shortcuts.js +1 -1
- package/dist/components/ls-number-input.js +1 -1
- package/dist/components/ls-page-loader.js +1 -1
- package/dist/components/ls-participant-card.js +1 -1
- package/dist/components/ls-participant-manager.js +1 -1
- package/dist/components/ls-participant-select.js +1 -1
- package/dist/components/ls-props-section.js +1 -1
- package/dist/components/ls-radio-input.js +1 -1
- package/dist/components/ls-recipient-card.js +1 -1
- package/dist/components/ls-recipient-manager.js +1 -1
- package/dist/components/ls-select-input.js +1 -1
- package/dist/components/ls-statusbar.js +1 -1
- package/dist/components/ls-text-input.js +1 -1
- package/dist/components/ls-textarea-input.js +1 -1
- package/dist/components/ls-title-input.d.ts +11 -0
- package/dist/components/ls-title-input.js +9 -0
- package/dist/components/ls-title-input.js.map +1 -0
- package/dist/components/ls-toggle.js +1 -1
- package/dist/components/ls-toolbar.js +1 -1
- package/dist/components/ls-toolbox-field.js +1 -1
- package/dist/components/ls-tooltip.js +1 -1
- package/dist/components/ls-validation-manager.js +1 -1
- package/dist/components/ls-validation-tag.js +1 -1
- package/dist/components/{p-FjzffTyc.js → p--zZz_own.js} +13 -13
- package/dist/components/{p-FjzffTyc.js.map → p--zZz_own.js.map} +1 -1
- package/dist/components/{p-C8ZQeYj-.js → p-6rlVwY5W.js} +68 -21
- package/dist/components/p-6rlVwY5W.js.map +1 -0
- package/dist/components/{p-DMgdq7Zj.js → p-8Uklt2-a.js} +15 -15
- package/dist/components/{p-DMgdq7Zj.js.map → p-8Uklt2-a.js.map} +1 -1
- package/dist/components/{p-Cqxe6wZe.js → p-B4SrLUIV.js} +7 -7
- package/dist/components/{p-Cqxe6wZe.js.map → p-B4SrLUIV.js.map} +1 -1
- package/dist/components/{p-DyU3O3tg.js → p-BE42_s-A.js} +19 -19
- package/dist/components/{p-DyU3O3tg.js.map → p-BE42_s-A.js.map} +1 -1
- package/dist/components/{p-B-j9D08q.js → p-BQBNj3wS.js} +5 -5
- package/dist/components/{p-B-j9D08q.js.map → p-BQBNj3wS.js.map} +1 -1
- package/dist/components/{p-CtV1B-_5.js → p-BQN3l4X7.js} +4 -4
- package/dist/components/{p-CtV1B-_5.js.map → p-BQN3l4X7.js.map} +1 -1
- package/dist/components/{p-CaBVuofO.js → p-BSoZFh0I.js} +4 -4
- package/dist/components/{p-CaBVuofO.js.map → p-BSoZFh0I.js.map} +1 -1
- package/dist/components/p-Ba9CMqrU.js +77 -0
- package/dist/components/p-Ba9CMqrU.js.map +1 -0
- package/dist/components/{p-CNc1l7mG.js → p-Bk5EZZj6.js} +10 -10
- package/dist/components/{p-CNc1l7mG.js.map → p-Bk5EZZj6.js.map} +1 -1
- package/dist/components/{p-CEhCcP_A.js → p-BnGihP6t.js} +5 -5
- package/dist/components/p-BnGihP6t.js.map +1 -0
- package/dist/components/{p-DCZnqvsu.js → p-ByNRBaHk.js} +8 -8
- package/dist/components/{p-DCZnqvsu.js.map → p-ByNRBaHk.js.map} +1 -1
- package/dist/components/{p-BiOHci04.js → p-C-jvthbB.js} +17 -17
- package/dist/components/{p-BiOHci04.js.map → p-C-jvthbB.js.map} +1 -1
- package/dist/components/{p-DKcMRnoh.js → p-C3Qs4SL0.js} +4 -4
- package/dist/components/{p-DKcMRnoh.js.map → p-C3Qs4SL0.js.map} +1 -1
- package/dist/components/{p-DKx68i7a.js → p-C5Wwr500.js} +17 -17
- package/dist/components/{p-DKx68i7a.js.map → p-C5Wwr500.js.map} +1 -1
- package/dist/components/{p-COypjAnE.js → p-C7jd-O6l.js} +9 -9
- package/dist/components/p-C7jd-O6l.js.map +1 -0
- package/dist/components/{p-D-yItxA4.js → p-CB2IouRT.js} +4 -4
- package/dist/components/{p-D-yItxA4.js.map → p-CB2IouRT.js.map} +1 -1
- package/dist/components/{p-BIqQK9GI.js → p-CO-U7TRb.js} +8 -8
- package/dist/components/{p-BIqQK9GI.js.map → p-CO-U7TRb.js.map} +1 -1
- package/dist/components/{p-B2TUFMT0.js → p-CRFtX_Cr.js} +7 -7
- package/dist/components/{p-B2TUFMT0.js.map → p-CRFtX_Cr.js.map} +1 -1
- package/dist/components/{p-HB8K0xP0.js → p-CSShMZoN.js} +8 -8
- package/dist/components/{p-HB8K0xP0.js.map → p-CSShMZoN.js.map} +1 -1
- package/dist/components/{p-B2etz1Ic.js → p-Cjs9opNb.js} +17 -17
- package/dist/components/{p-B2etz1Ic.js.map → p-Cjs9opNb.js.map} +1 -1
- package/dist/components/{p-BzY8ubZE.js → p-CnzdsJ7f.js} +8 -8
- package/dist/components/{p-BzY8ubZE.js.map → p-CnzdsJ7f.js.map} +1 -1
- package/dist/components/{p-QEWyXsBw.js → p-CtqzTrW1.js} +17 -17
- package/dist/components/{p-QEWyXsBw.js.map → p-CtqzTrW1.js.map} +1 -1
- package/dist/components/{p-DC0HL60H.js → p-CwVY532N.js} +4 -4
- package/dist/components/{p-DC0HL60H.js.map → p-CwVY532N.js.map} +1 -1
- package/dist/components/{p-D-U9fbV-.js → p-Cwm6iZnk.js} +12 -12
- package/dist/components/{p-D-U9fbV-.js.map → p-Cwm6iZnk.js.map} +1 -1
- package/dist/components/{p-CrVSg3t4.js → p-D3F0Jtj5.js} +6 -6
- package/dist/components/{p-CrVSg3t4.js.map → p-D3F0Jtj5.js.map} +1 -1
- package/dist/components/{p-DPtMBZYM.js → p-DC1C7wSu.js} +13 -13
- package/dist/components/{p-DPtMBZYM.js.map → p-DC1C7wSu.js.map} +1 -1
- package/dist/components/{p-B3axAGVs.js → p-DEWvb3CA.js} +8 -8
- package/dist/components/{p-B3axAGVs.js.map → p-DEWvb3CA.js.map} +1 -1
- package/dist/components/{p-DZ_KhOns.js → p-DKR6lJi9.js} +8 -8
- package/dist/components/{p-DZ_KhOns.js.map → p-DKR6lJi9.js.map} +1 -1
- package/dist/components/p-DMbfojtQ.js +150 -0
- package/dist/components/p-DMbfojtQ.js.map +1 -0
- package/dist/components/{p-DPVPaPb1.js → p-DMtkP3At.js} +4 -4
- package/dist/components/{p-DPVPaPb1.js.map → p-DMtkP3At.js.map} +1 -1
- package/dist/components/{p-B7S9E2ci.js → p-DSfRG8h-.js} +17 -17
- package/dist/components/{p-B7S9E2ci.js.map → p-DSfRG8h-.js.map} +1 -1
- package/dist/components/{p-DmszHmWG.js → p-DUSbyLyO.js} +30 -30
- package/dist/components/{p-DmszHmWG.js.map → p-DUSbyLyO.js.map} +1 -1
- package/dist/components/{p-Ji_SfsNu.js → p-Da5X5ldP.js} +5 -5
- package/dist/components/{p-Ji_SfsNu.js.map → p-Da5X5ldP.js.map} +1 -1
- package/dist/components/{p-NoKw4xu7.js → p-DeA6P5Nw.js} +5 -5
- package/dist/components/{p-NoKw4xu7.js.map → p-DeA6P5Nw.js.map} +1 -1
- package/dist/components/{p-DGuG1Bmj.js → p-DfaX9tao.js} +9 -9
- package/dist/components/{p-DGuG1Bmj.js.map → p-DfaX9tao.js.map} +1 -1
- package/dist/components/{p-CCt1S0nA.js → p-Dgc5eQou.js} +17 -17
- package/dist/components/{p-CCt1S0nA.js.map → p-Dgc5eQou.js.map} +1 -1
- package/dist/components/{p-CTGwIImt.js → p-Dh7zFd1I.js} +5 -5
- package/dist/components/{p-CTGwIImt.js.map → p-Dh7zFd1I.js.map} +1 -1
- package/dist/components/{p-BNX_U6jC.js → p-Dr_eGXsl.js} +11 -11
- package/dist/components/{p-BNX_U6jC.js.map → p-Dr_eGXsl.js.map} +1 -1
- package/dist/components/{p-raaSYxtA.js → p-DuLbniAl.js} +5 -5
- package/dist/components/{p-raaSYxtA.js.map → p-DuLbniAl.js.map} +1 -1
- package/dist/components/{p-CdFJ_FQz.js → p-Fw6kMqPe.js} +18 -18
- package/dist/components/{p-CdFJ_FQz.js.map → p-Fw6kMqPe.js.map} +1 -1
- package/dist/components/{p-G8kF15oY.js → p-K67Z4FW4.js} +12 -7
- package/dist/components/p-K67Z4FW4.js.map +1 -0
- package/dist/components/{p-CuyjSEEv.js → p-Nj0OCBoq.js} +12 -12
- package/dist/components/{p-CuyjSEEv.js.map → p-Nj0OCBoq.js.map} +1 -1
- package/dist/components/{p-R3_FOlEq.js → p-RnnpDT-h.js} +8 -8
- package/dist/components/{p-R3_FOlEq.js.map → p-RnnpDT-h.js.map} +1 -1
- package/dist/components/{p-DDNZkGBj.js → p-dMh2qwev.js} +17 -17
- package/dist/components/{p-DDNZkGBj.js.map → p-dMh2qwev.js.map} +1 -1
- package/dist/components/{p-DVtr8lsT.js → p-dsAPfCxI.js} +4 -4
- package/dist/components/{p-DVtr8lsT.js.map → p-dsAPfCxI.js.map} +1 -1
- package/dist/components/{p-cwpKMDgH.js → p-ecEYUtBb.js} +18 -18
- package/dist/components/{p-cwpKMDgH.js.map → p-ecEYUtBb.js.map} +1 -1
- package/dist/components/{p-9pxwrFws.js → p-oKJS53QI.js} +5 -5
- package/dist/components/{p-9pxwrFws.js.map → p-oKJS53QI.js.map} +1 -1
- package/dist/components/{p-BzxhEsKd.js → p-oLmlMT4P.js} +17 -17
- package/dist/components/{p-BzxhEsKd.js.map → p-oLmlMT4P.js.map} +1 -1
- package/dist/components/{p-BUfnTaTZ.js → p-oiSMxbl6.js} +9 -9
- package/dist/components/{p-BUfnTaTZ.js.map → p-oiSMxbl6.js.map} +1 -1
- package/dist/components/{p-DUBoFEsx.js → p-zC7rIWhO.js} +10 -10
- package/dist/components/{p-DUBoFEsx.js.map → p-zC7rIWhO.js.map} +1 -1
- package/dist/esm/{index-BzcAlD18.js → index-o0lmYfXA.js} +5 -5
- package/dist/esm/{index-BzcAlD18.js.map → index-o0lmYfXA.js.map} +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/ls-compose-manager.entry.js +3 -3
- package/dist/esm/{ls-document-options_45.entry.js → ls-document-options_46.entry.js} +312 -172
- package/dist/esm/ls-document-options_46.entry.js.map +1 -0
- package/dist/esm/ls-document-viewer.js +3 -3
- package/dist/esm/ls-field-properties-dropdown.entry.js +2 -2
- package/dist/esm/ls-formfield.entry.js +4 -4
- package/dist/esm/ls-number-input_5.entry.js +8 -8
- package/dist/ls-document-viewer/clsx-ChV9xqsO.js.map +1 -0
- package/dist/ls-document-viewer/defaultFieldIcons-Cp3IxvzK.js.map +1 -0
- package/dist/ls-document-viewer/defaultPalette-CwCWCxsI.js.map +1 -0
- package/dist/ls-document-viewer/editorUtils-NnO0Pp81.js.map +1 -0
- package/dist/ls-document-viewer/floating-ui.dom-DtWVTgos.js.map +1 -0
- package/dist/ls-document-viewer/index-BYWn8bjJ.js.map +1 -0
- package/dist/ls-document-viewer/index.esm.js.map +1 -1
- package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
- package/dist/ls-document-viewer/ls-document-viewer.esm.js.map +1 -1
- package/dist/ls-document-viewer/p-0f4af1a9.entry.js +2 -0
- package/dist/ls-document-viewer/{p-350754cb.entry.js → p-1e64ed2c.entry.js} +2 -2
- package/dist/ls-document-viewer/{p-350754cb.entry.js.map → p-1e64ed2c.entry.js.map} +1 -1
- package/dist/ls-document-viewer/{p-06c34a72.entry.js → p-a7817cc4.entry.js} +6 -6
- package/dist/ls-document-viewer/p-a7817cc4.entry.js.map +1 -0
- package/dist/ls-document-viewer/p-b1237a47.entry.js +2 -0
- package/dist/ls-document-viewer/p-f8d4e7a2.entry.js +2 -0
- package/dist/ls-document-viewer/{p-fbb241f1.entry.js.map → p-f8d4e7a2.entry.js.map} +1 -1
- package/dist/ls-document-viewer/p-o0lmYfXA.js +3 -0
- package/dist/ls-document-viewer/{p-BzcAlD18.js.map → p-o0lmYfXA.js.map} +1 -1
- package/dist/ls-document-viewer/tooltip-Cb8nDMs-.js.map +1 -0
- package/dist/types/components/ls-document-viewer/ls-document-viewer.d.ts +1 -0
- package/dist/types/components/ls-editor-field/ls-editor-field.d.ts +10 -0
- package/dist/types/components/ls-recipient-card/ls-recipient-card.d.ts +3 -0
- package/dist/types/components/ls-title-input/ls-title-input.d.ts +14 -0
- package/dist/types/components/ls-validation-tag/ls-validation-tag.d.ts +2 -0
- package/dist/types/components.d.ts +63 -0
- package/dist/types/types/ValidationError.d.ts +1 -2
- package/package.json +1 -1
- package/readme.md +276 -26
- package/dist/cjs/ls-document-options_45.cjs.entry.js.map +0 -1
- package/dist/components/p-B2ofj7BM.js +0 -127
- package/dist/components/p-B2ofj7BM.js.map +0 -1
- package/dist/components/p-C8ZQeYj-.js.map +0 -1
- package/dist/components/p-CEhCcP_A.js.map +0 -1
- package/dist/components/p-COypjAnE.js.map +0 -1
- package/dist/components/p-G8kF15oY.js.map +0 -1
- package/dist/esm/ls-document-options_45.entry.js.map +0 -1
- package/dist/ls-document-viewer/p-06c34a72.entry.js.map +0 -1
- package/dist/ls-document-viewer/p-3a4da534.entry.js +0 -2
- package/dist/ls-document-viewer/p-3c5fa1d7.entry.js +0 -2
- package/dist/ls-document-viewer/p-BzcAlD18.js +0 -3
- package/dist/ls-document-viewer/p-fbb241f1.entry.js +0 -2
- /package/dist/ls-document-viewer/{p-3c5fa1d7.entry.js.map → p-0f4af1a9.entry.js.map} +0 -0
- /package/dist/ls-document-viewer/{p-3a4da534.entry.js.map → p-b1237a47.entry.js.map} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BnGihP6t.js';
|
|
2
2
|
import { a as attachAllTooltips } from './p-Cb8nDMs-.js';
|
|
3
|
-
import { d as defineCustomElement$2 } from './p-
|
|
4
|
-
import { d as defineCustomElement$1 } from './p-
|
|
3
|
+
import { d as defineCustomElement$2 } from './p-BQN3l4X7.js';
|
|
4
|
+
import { d as defineCustomElement$1 } from './p-CwVY532N.js';
|
|
5
5
|
|
|
6
6
|
const lsFieldDimensionsCss = ":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)}";
|
|
7
7
|
|
|
@@ -10,8 +10,8 @@ const LsFieldDimensions = /*@__PURE__*/ proxyCustomElement(class LsFieldDimensio
|
|
|
10
10
|
super();
|
|
11
11
|
this.__registerHost();
|
|
12
12
|
this.__attachShadow();
|
|
13
|
-
this.mutate = createEvent(this, "mutate");
|
|
14
|
-
this.update = createEvent(this, "update");
|
|
13
|
+
this.mutate = createEvent(this, "mutate", 7);
|
|
14
|
+
this.update = createEvent(this, "update", 7);
|
|
15
15
|
}
|
|
16
16
|
get component() { return this; }
|
|
17
17
|
dataItem;
|
|
@@ -46,7 +46,7 @@ const LsFieldDimensions = /*@__PURE__*/ proxyCustomElement(class LsFieldDimensio
|
|
|
46
46
|
attachAllTooltips(this.component.shadowRoot);
|
|
47
47
|
}
|
|
48
48
|
render() {
|
|
49
|
-
return (h(Host, { key: '
|
|
49
|
+
return (h(Host, { key: '703a903db877ebc294ac3e2b957a29e031ef1a89' }, this.isMultiple(this.dataItem) && (h("div", { key: '5003976f90bd1abf305e7fdf49f5bdb2c8ac1175', class: 'ls-field-properties-section' }, h("div", { key: 'c701aeff233fd6909fe092180bf4e178ef836596', class: 'ls-field-properties-section-text' }, h("p", { key: '24bed1a118880004098274aa6fe322e50ba6bcb4', class: 'ls-field-properties-section-title' }, "Height and Width"), h("p", { key: '0004e228fccc0e8862de68b8a20c325c51783755', class: 'ls-field-properties-section-description' }, "Define the height and width of one or multiple fields")), h("div", { key: '54b5c2c34e71c2d89792563bb8a91ce91979425b', class: 'input-row' }, h("div", { key: '4ec93aba8780d313a231c3e373b72070d3cc8538', class: 'input-wrapper', "data-tooltip": "Set field width in pixels" }, h("ls-icon", { key: 'd1dc6e887a70faa598c69f49b79f82bd171c9e7b', id: "selectLeadingIcon", name: "field-match-width" }), h("input", { key: 'f30017f0d1c416c0fb2dc7dd12637da92b25f299', class: 'has-leading-icon', aria: "field-width", id: "field-width", onChange: e => this.alter({ width: e.target.value }) })), h("div", { key: '45c33926a667cd78d421d74f9a352614f8d853cc', class: 'input-wrapper', "data-tooltip": "Set field height in pixels" }, h("ls-icon", { key: 'dc4ad448b52fd19ef42bd9f81edd597fba232914', id: "selectLeadingIcon", name: "field-match-height" }), h("input", { key: 'b257839bf8395a4a7e4c46b4e8bda31f8a688088', class: 'has-leading-icon', aria: "field-height", id: "field-height", onChange: e => this.alter({ height: e.target.value }) }))))), this.isSingle(this.dataItem) && (h("div", { key: '880ee0a38cfa375a4bd8a0d8e6bd8651918be68e', class: 'field-set' }, h("div", { key: '661e3eadf9c75bc174a00fe463efaad733f19c17', class: 'ls-field-properties-section' }, h("div", { key: '69fa81433bf7d90d74b6d99afa6f96b6b4bb3b87', class: 'ls-field-properties-section-text' }, h("p", { key: '43aa0a76668e227c65e4ea36f7e9b5d04f68a46b', class: 'ls-field-properties-section-title' }, "Height and Width"), h("p", { key: 'aae729ee5421bf2b487c98b36adbae66eb9df344', class: 'ls-field-properties-section-description' }, "Define the height and width of one or multiple fields")), h("div", { key: '65da437f5b256a12487ba35bcb9c39376139287b', class: 'input-row' }, h("div", { key: '780b5587d9d066b816540d3e5d494b0100068c07', class: 'input-wrapper', "data-tooltip": "Set field width in pixels" }, h("ls-icon", { key: '94a6fcfd4df9ec9f45bd0aaad7854061eb6362c1', id: "selectLeadingIcon", name: "field-match-width" }), h("input", { key: '245e8b5c172c9e81996518cdb80ccc86461c485a', type: "number", class: 'has-leading-icon', aria: "field-width", id: "field-width", value: this.dataItem?.width, onChange: e => this.alter({ width: e.target.value }) })), h("div", { key: 'cb4e9a06b6eae5992c4a3d5ca69fa23d405c1c1b', class: 'input-wrapper', "data-tooltip": "Set field height in pixels" }, h("ls-icon", { key: '6122800c5cf670479ea0befb9a07454595ac5912', id: "selectLeadingIcon", name: "field-match-height" }), h("input", { key: 'fa15e1f81dc05f2234bac95a25cb609160aa5403', type: "number", class: 'has-leading-icon', aria: "field-height", id: "field-height", value: this.dataItem?.height, onChange: e => this.alter({ height: e.target.value }) })))), h("div", { key: '49a7ffea99dea746084b94414d9b3251de398a9e', class: 'ls-field-properties-section' }, h("div", { key: 'c78c62f08d282a3a529ba8338a42bbb444917783', class: 'ls-field-properties-section-text' }, h("p", { key: 'd18f1fe5a21bdd20a5e892cbe588eb297231b649', class: 'ls-field-properties-section-title' }, "Scale and Resize"), h("p", { key: 'af6e63b9235f1e59ade06038f09db0390893673d', class: 'ls-field-properties-section-description' }, "Multi-select fields and match their dimensions")), h("div", { key: '87123ee7df1fa48be4c2674baa40373f603cf634', class: 'button-group' }, h("button", { key: '5d03b2ad33e65d8fc51a18db6f25d90d907a0b00', disabled: true, "data-tooltip": "Select multiple Fields to to access scale controls" }, h("ls-icon", { key: '400caf2fc05248f2cde1a2175352ffc7a8d7c7b6', name: "field-scale" })), h("button", { key: 'ea84ecc2b43b2ebd1fbd1191ac785c5e8b3692a6', disabled: true, "data-tooltip": "Select multiple Fields to to access match width controls" }, h("ls-icon", { key: 'bf78211f51a4319e441cf956bf58344ecdaa66c6', name: "field-match-width" })), h("button", { key: 'a29160eb0320e88fdfd02f3a8502f82ee59ffd26', disabled: true, "data-tooltip": "Select multiple Fields to to access match height controls" }, h("ls-icon", { key: '8a1001f7d8a2f44d111447e222ba25c8cbe0085c', name: "field-match-height" })))))), h("ls-tooltip", { key: '2ff0d8ba9ce5ef8f6932a5062a88cd243485b71c', id: "ls-tooltip-master" })));
|
|
50
50
|
}
|
|
51
51
|
static get style() { return lsFieldDimensionsCss; }
|
|
52
52
|
}, [257, "ls-field-dimensions", {
|
|
@@ -78,6 +78,6 @@ function defineCustomElement() {
|
|
|
78
78
|
defineCustomElement();
|
|
79
79
|
|
|
80
80
|
export { LsFieldDimensions as L, defineCustomElement as d };
|
|
81
|
-
//# sourceMappingURL=p-
|
|
81
|
+
//# sourceMappingURL=p-ByNRBaHk.js.map
|
|
82
82
|
|
|
83
|
-
//# sourceMappingURL=p-
|
|
83
|
+
//# sourceMappingURL=p-ByNRBaHk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-DCZnqvsu.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-dimensions/ls-field-dimensions.css?tag=ls-field-dimensions&encapsulation=shadow","src/components/ls-field-dimensions/ls-field-dimensions.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n position: relative;\n}\n\n* {\n margin: 0;\n box-sizing: border-box\n}\n\n.field-set {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n}\n\n.ls-field-properties-section {\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.row {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n}\n\n.ls-field-properties-section-text {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n padding: 0.25rem;\n}\n\n.ls-field-properties-section-title {\n color: var(--gray-90, #5e6066);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-field-properties-section-description {\n overflow: hidden;\n color: var(--gray-80, #6c6e73);\n text-overflow: ellipsis;\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 0.75rem; /* 120% */\n}\n\n.input-row {\n display: flex;\n gap: 0.5rem;\n}\n\n.input-row .input-wrapper input {\n width: 9.313rem;\n max-width: 9.313rem;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 36px;\n}\n\n.input-wrapper {\n position: relative;\n width: 100%;\n}\n\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n width: 100%;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:disabled {\n background: var(--gray-10, #f7f8fa);\n cursor: not-allowed;\n color: var(--gray-50, #d8d9dc);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { Element } from '@stencil/core';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-field-dimensions',\n styleUrl: 'ls-field-dimensions.css',\n shadow: true,\n})\nexport class LsFieldDimensions {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement | LSApiElement[];\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n return (dt as LSApiElement[]).length === undefined;\n }\n\n isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n return typeof (dt as LSApiElement[]).length === 'number';\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n alter(diff: object) {\n console.log(diff);\n if (this.isMultiple(this.dataItem)) {\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n return { action: 'update', data: { ...c, ...diff } as LSApiElement };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n } else {\n const singleDiff = { action: 'update', data: { ...this.dataItem, ...diff } as LSApiElement } as LSMutateEvent;\n this.dataItem = singleDiff.data as LSApiElement;\n this.mutate.emit([singleDiff]);\n this.update.emit([singleDiff]);\n }\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host>\n {this.isMultiple(this.dataItem) && (\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Height and Width</p>\n <p class={'ls-field-properties-section-description'}>Define the height and width of one or multiple fields</p>\n </div>\n <div class={'input-row'}>\n <div class={'input-wrapper'} data-tooltip=\"Set field width in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-width\"></ls-icon>\n <input class={'has-leading-icon'} aria=\"field-width\" id=\"field-width\" onChange={e => this.alter({ width: (e.target as HTMLInputElement).value })} />\n </div>\n <div class={'input-wrapper'} data-tooltip=\"Set field height in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-height\"></ls-icon>\n <input class={'has-leading-icon'} aria=\"field-height\" id=\"field-height\" onChange={e => this.alter({ height: (e.target as HTMLInputElement).value })} />\n </div>\n </div>\n\n {/* <div>\n Top: <input value={''} onChange={e => this.alter({ top: (e.target as HTMLInputElement).value })} width=\"30\" />\n </div>\n <div>\n Left: <input value={''} onChange={e => this.alter({ left: (e.target as HTMLInputElement).value })} width=\"30\" />\n </div> */}\n </div>\n )}\n {this.isSingle(this.dataItem) && (\n <div class={'field-set'}>\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Height and Width</p>\n <p class={'ls-field-properties-section-description'}>Define the height and width of one or multiple fields</p>\n </div>\n <div class={'input-row'}>\n <div class={'input-wrapper'} data-tooltip=\"Set field width in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-width\"></ls-icon>\n <input\n type=\"number\"\n class={'has-leading-icon'}\n aria=\"field-width\"\n id=\"field-width\"\n value={this.dataItem?.width}\n onChange={e => this.alter({ width: (e.target as HTMLInputElement).value })}\n />\n </div>\n <div class={'input-wrapper'} data-tooltip=\"Set field height in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-height\"></ls-icon>\n <input\n type=\"number\"\n class={'has-leading-icon'}\n aria=\"field-height\"\n id=\"field-height\"\n value={this.dataItem?.height}\n onChange={e => this.alter({ height: (e.target as HTMLInputElement).value })}\n />\n </div>\n </div>\n </div>\n\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Scale and Resize</p>\n <p class={'ls-field-properties-section-description'}>Multi-select fields and match their dimensions</p>\n </div>\n <div class={'button-group'}>\n <button disabled data-tooltip=\"Select multiple Fields to to access scale controls\">\n <ls-icon name=\"field-scale\"></ls-icon>\n </button>\n <button disabled data-tooltip=\"Select multiple Fields to to access match width controls\">\n <ls-icon name=\"field-match-width\"></ls-icon>\n </button>\n <button disabled data-tooltip=\"Select multiple Fields to to access match height controls\">\n <ls-icon name=\"field-match-height\"></ls-icon>\n </button>\n </div>\n </div>\n </div>\n )}\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"p-ByNRBaHk.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-dimensions/ls-field-dimensions.css?tag=ls-field-dimensions&encapsulation=shadow","src/components/ls-field-dimensions/ls-field-dimensions.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n position: relative;\n}\n\n* {\n margin: 0;\n box-sizing: border-box\n}\n\n.field-set {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n}\n\n.ls-field-properties-section {\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.row {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n}\n\n.ls-field-properties-section-text {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n padding: 0.25rem;\n}\n\n.ls-field-properties-section-title {\n color: var(--gray-90, #5e6066);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-field-properties-section-description {\n overflow: hidden;\n color: var(--gray-80, #6c6e73);\n text-overflow: ellipsis;\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 0.75rem; /* 120% */\n}\n\n.input-row {\n display: flex;\n gap: 0.5rem;\n}\n\n.input-row .input-wrapper input {\n width: 9.313rem;\n max-width: 9.313rem;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 36px;\n}\n\n.input-wrapper {\n position: relative;\n width: 100%;\n}\n\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n width: 100%;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:disabled {\n background: var(--gray-10, #f7f8fa);\n cursor: not-allowed;\n color: var(--gray-50, #d8d9dc);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { Element } from '@stencil/core';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-field-dimensions',\n styleUrl: 'ls-field-dimensions.css',\n shadow: true,\n})\nexport class LsFieldDimensions {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement | LSApiElement[];\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n return (dt as LSApiElement[]).length === undefined;\n }\n\n isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n return typeof (dt as LSApiElement[]).length === 'number';\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n alter(diff: object) {\n console.log(diff);\n if (this.isMultiple(this.dataItem)) {\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n return { action: 'update', data: { ...c, ...diff } as LSApiElement };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n } else {\n const singleDiff = { action: 'update', data: { ...this.dataItem, ...diff } as LSApiElement } as LSMutateEvent;\n this.dataItem = singleDiff.data as LSApiElement;\n this.mutate.emit([singleDiff]);\n this.update.emit([singleDiff]);\n }\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host>\n {this.isMultiple(this.dataItem) && (\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Height and Width</p>\n <p class={'ls-field-properties-section-description'}>Define the height and width of one or multiple fields</p>\n </div>\n <div class={'input-row'}>\n <div class={'input-wrapper'} data-tooltip=\"Set field width in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-width\"></ls-icon>\n <input class={'has-leading-icon'} aria=\"field-width\" id=\"field-width\" onChange={e => this.alter({ width: (e.target as HTMLInputElement).value })} />\n </div>\n <div class={'input-wrapper'} data-tooltip=\"Set field height in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-height\"></ls-icon>\n <input class={'has-leading-icon'} aria=\"field-height\" id=\"field-height\" onChange={e => this.alter({ height: (e.target as HTMLInputElement).value })} />\n </div>\n </div>\n\n {/* <div>\n Top: <input value={''} onChange={e => this.alter({ top: (e.target as HTMLInputElement).value })} width=\"30\" />\n </div>\n <div>\n Left: <input value={''} onChange={e => this.alter({ left: (e.target as HTMLInputElement).value })} width=\"30\" />\n </div> */}\n </div>\n )}\n {this.isSingle(this.dataItem) && (\n <div class={'field-set'}>\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Height and Width</p>\n <p class={'ls-field-properties-section-description'}>Define the height and width of one or multiple fields</p>\n </div>\n <div class={'input-row'}>\n <div class={'input-wrapper'} data-tooltip=\"Set field width in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-width\"></ls-icon>\n <input\n type=\"number\"\n class={'has-leading-icon'}\n aria=\"field-width\"\n id=\"field-width\"\n value={this.dataItem?.width}\n onChange={e => this.alter({ width: (e.target as HTMLInputElement).value })}\n />\n </div>\n <div class={'input-wrapper'} data-tooltip=\"Set field height in pixels\">\n <ls-icon id=\"selectLeadingIcon\" name=\"field-match-height\"></ls-icon>\n <input\n type=\"number\"\n class={'has-leading-icon'}\n aria=\"field-height\"\n id=\"field-height\"\n value={this.dataItem?.height}\n onChange={e => this.alter({ height: (e.target as HTMLInputElement).value })}\n />\n </div>\n </div>\n </div>\n\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Scale and Resize</p>\n <p class={'ls-field-properties-section-description'}>Multi-select fields and match their dimensions</p>\n </div>\n <div class={'button-group'}>\n <button disabled data-tooltip=\"Select multiple Fields to to access scale controls\">\n <ls-icon name=\"field-scale\"></ls-icon>\n </button>\n <button disabled data-tooltip=\"Select multiple Fields to to access match width controls\">\n <ls-icon name=\"field-match-width\"></ls-icon>\n </button>\n <button disabled data-tooltip=\"Select multiple Fields to to access match height controls\">\n <ls-icon name=\"field-match-height\"></ls-icon>\n </button>\n </div>\n </div>\n </div>\n )}\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-
|
|
2
|
-
import { d as defineCustomElement$d } from './p-
|
|
3
|
-
import { d as defineCustomElement$c } from './p-
|
|
4
|
-
import { d as defineCustomElement$b } from './p-
|
|
5
|
-
import { d as defineCustomElement$a } from './p-
|
|
6
|
-
import { d as defineCustomElement$9 } from './p-
|
|
7
|
-
import { d as defineCustomElement$8 } from './p-
|
|
8
|
-
import { d as defineCustomElement$7 } from './p-
|
|
9
|
-
import { d as defineCustomElement$6 } from './p-
|
|
10
|
-
import { d as defineCustomElement$5 } from './p-
|
|
11
|
-
import { d as defineCustomElement$4 } from './p-
|
|
12
|
-
import { d as defineCustomElement$3 } from './p-
|
|
13
|
-
import { d as defineCustomElement$2 } from './p-
|
|
14
|
-
import { d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, c as Host } from './p-BnGihP6t.js';
|
|
2
|
+
import { d as defineCustomElement$d } from './p-6rlVwY5W.js';
|
|
3
|
+
import { d as defineCustomElement$c } from './p-DC1C7wSu.js';
|
|
4
|
+
import { d as defineCustomElement$b } from './p-ByNRBaHk.js';
|
|
5
|
+
import { d as defineCustomElement$a } from './p-DEWvb3CA.js';
|
|
6
|
+
import { d as defineCustomElement$9 } from './p-CnzdsJ7f.js';
|
|
7
|
+
import { d as defineCustomElement$8 } from './p-DfaX9tao.js';
|
|
8
|
+
import { d as defineCustomElement$7 } from './p-BSoZFh0I.js';
|
|
9
|
+
import { d as defineCustomElement$6 } from './p-B4SrLUIV.js';
|
|
10
|
+
import { d as defineCustomElement$5 } from './p-BQN3l4X7.js';
|
|
11
|
+
import { d as defineCustomElement$4 } from './p-DeA6P5Nw.js';
|
|
12
|
+
import { d as defineCustomElement$3 } from './p-C3Qs4SL0.js';
|
|
13
|
+
import { d as defineCustomElement$2 } from './p-D3F0Jtj5.js';
|
|
14
|
+
import { d as defineCustomElement$1 } from './p-CwVY532N.js';
|
|
15
15
|
|
|
16
16
|
const lsFieldPropertiesSignatureCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px;width:100%}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{display:flex;gap:0.5rem;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;font-weight:500;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.destructive{border:1px solid var(--red-60, #f04438);background-color:white;color:var(--red-60)}button.destructive:hover{border:1px solid var(--red-70, #d92d20);background:var(--red-10, #fff1f0)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
|
|
17
17
|
|
|
@@ -23,7 +23,7 @@ const LsFieldPropertiesSignature = /*@__PURE__*/ proxyCustomElement(class LsFiel
|
|
|
23
23
|
}
|
|
24
24
|
dataItem;
|
|
25
25
|
render() {
|
|
26
|
-
return (h(Host, { key: '
|
|
26
|
+
return (h(Host, { key: '5f4c56b08921c1fb55257a04665ff6be648ab385' }, h("ls-field-properties-container", { key: '4ddc0e655c8c006b09bd3be884bddab0dd5ed96d', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: '9bd52daefc5450f342b6129016182cc2bf603b44', class: 'field-set', slot: "content" }, h("ls-field-content", { key: 'abfd4bcf641fb2ebcbac45678523cba7b38fdfe3', dataItem: this.dataItem, showValidationTypes: false }), h("ls-field-properties-advanced", { key: '30bcc7c38d3f36a876d7aabf605409cf51d1b6ee', dataItem: this.dataItem })), h("div", { key: '517b703e3f917c4cd826a4dc6557446c6b71275c', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: 'f472cb3cade66229c524f0b866022b441ebdd54c', dataItem: this.dataItem })), h("div", { key: '0161a883ec8d648df3a5ef879adc28a7c34444d1', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: '5cdb53ee48b659f3c6f3314d59ebbc965b52b899', dataItem: this.dataItem }))), h("ls-field-footer", { key: '4ed0739a0aefe8ffe5384c68810c77fe55a7712a', dataItem: this.dataItem })));
|
|
27
27
|
}
|
|
28
28
|
static get style() { return lsFieldPropertiesSignatureCss; }
|
|
29
29
|
}, [257, "ls-field-properties-signature", {
|
|
@@ -110,6 +110,6 @@ function defineCustomElement() {
|
|
|
110
110
|
defineCustomElement();
|
|
111
111
|
|
|
112
112
|
export { LsFieldPropertiesSignature as L, defineCustomElement as d };
|
|
113
|
-
//# sourceMappingURL=p-
|
|
113
|
+
//# sourceMappingURL=p-C-jvthbB.js.map
|
|
114
114
|
|
|
115
|
-
//# sourceMappingURL=p-
|
|
115
|
+
//# sourceMappingURL=p-C-jvthbB.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-C-jvthbB.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,6BAA6B,GAAG,ktJAAktJ;;MCQ3uJ,0BAA0B,iBAAAA,kBAAA,CAAA,MAAA,0BAAA,SAAAC,CAAA,CAAA;;;;;;AAC7B,IAAA,QAAQ;IAEhB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAA+B,CAAA,+BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC,EAAA,EACzE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,SAAS,EAAA,EACrC,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,mBAAmB,EAAE,KAAK,EAAI,CAAA,EACzE,CAAA,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACrD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,YAAY,EAAA,EACxC,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5C,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,WAAW,EAAA,EACvC,CAAA,CAAA,oBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CAC3C,CACwB,EAChC,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,CACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-signature/ls-field-properties-signature.css?tag=ls-field-properties-signature&encapsulation=shadow","src/components/ls-field-properties-signature/ls-field-properties-signature.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n height: 100%;\n position: relative;\n}\n\n* {\n margin: 0;\n}\n\n.field-set {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 36px;\n width: 100%;\n}\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n display: flex;\n gap: 0.5rem;\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n font-weight: 500;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.secondary {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--white, #fff);\n color: var(--gray-90, #5e6066);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.secondary:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.destructive {\n border: 1px solid var(--red-60, #f04438);\n background-color: white;\n color: var(--red-60);\n}\n\nbutton.destructive:hover {\n border: 1px solid var(--red-70, #d92d20);\n background: var(--red-10, #fff1f0);\n}\n\n\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n tag: 'ls-field-properties-signature',\n styleUrl: 'ls-field-properties-signature.css',\n shadow: true,\n})\nexport class LsFieldPropertiesSignature {\n @Prop() dataItem: LSApiElement;\n\n render() {\n return (\n <Host>\n <ls-field-properties-container tabs={['content', 'placement', 'dimensions']}>\n <div class={'field-set'} slot=\"content\">\n <ls-field-content dataItem={this.dataItem} showValidationTypes={false} />\n <ls-field-properties-advanced dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"dimensions\">\n <ls-field-dimensions dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"placement\">\n <ls-field-placement dataItem={this.dataItem} />\n </div>\n </ls-field-properties-container>\n <ls-field-footer dataItem={this.dataItem} />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, c as Host } from './p-BnGihP6t.js';
|
|
2
2
|
|
|
3
3
|
const lsPropsSectionCss = "*{margin:0;box-sizing:border-box}.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;}";
|
|
4
4
|
|
|
@@ -12,7 +12,7 @@ const LsPropsSection = /*@__PURE__*/ proxyCustomElement(class LsPropsSection ext
|
|
|
12
12
|
sectionDescription;
|
|
13
13
|
row = false;
|
|
14
14
|
render() {
|
|
15
|
-
return (h(Host, { key: '
|
|
15
|
+
return (h(Host, { key: '4b24bc2ccb0ee11c0d9cc1770ec0d1b239b924d5' }, h("div", { key: 'a92e48cf867e686ac84c3f3ce3945d3fc4d73811', class: this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section' }, h("div", { key: '811c27c607c3611cc958a66fef19ae0fb124d6fd', class: 'ls-field-properties-section-text' }, h("p", { key: 'f4ccf988b97952f0d02cae2810dc134555807a5b', class: 'ls-field-properties-section-title' }, this.sectionTitle), this.sectionDescription && h("p", { key: 'a85216a0721e875f765ac82b46961ffe22788eb0', class: 'ls-field-properties-section-description' }, this.sectionDescription)), h("slot", { key: 'e22f8f4565c5190273f079f88f3f9b3c7826c912' }))));
|
|
16
16
|
}
|
|
17
17
|
static get style() { return lsPropsSectionCss; }
|
|
18
18
|
}, [257, "ls-props-section", {
|
|
@@ -36,6 +36,6 @@ function defineCustomElement() {
|
|
|
36
36
|
defineCustomElement();
|
|
37
37
|
|
|
38
38
|
export { LsPropsSection as L, defineCustomElement as d };
|
|
39
|
-
//# sourceMappingURL=p-
|
|
39
|
+
//# sourceMappingURL=p-C3Qs4SL0.js.map
|
|
40
40
|
|
|
41
|
-
//# sourceMappingURL=p-
|
|
41
|
+
//# sourceMappingURL=p-C3Qs4SL0.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-C3Qs4SL0.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,wmBAAwmB;;MCOrnB,cAAc,iBAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;;;;;;AACjB,IAAA,YAAY;AACZ,IAAA,kBAAkB;IAClB,GAAG,GAAa,KAAK;IAE7B,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,GAAG,GAAG,iCAAiC,GAAG,6BAA6B,EAAA,EACtF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,kCAAkC,EAAA,EAC5C,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAE,mCAAmC,IAAG,IAAI,CAAC,YAAY,CAAK,EACrE,IAAI,CAAC,kBAAkB,IAAI,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAE,yCAAyC,EAAA,EAAG,IAAI,CAAC,kBAAkB,CAAK,CAC1G,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-props-section/ls-props-section.css?tag=ls-props-section&encapsulation=shadow","src/components/ls-props-section/ls-props-section.tsx"],"sourcesContent":["* {\n margin: 0;\n box-sizing: border-box;\n}\n\n.ls-field-properties-section {\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.row {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n}\n\n.ls-field-properties-section-text {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n padding: 0.25rem;\n}\n\n.ls-field-properties-section-title {\n color: var(--gray-90, #5e6066);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-field-properties-section-description {\n overflow: hidden;\n color: var(--gray-80, #6c6e73);\n text-overflow: ellipsis;\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 0.75rem; /* 120% */\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'ls-props-section',\n styleUrl: 'ls-props-section.css',\n shadow: true,\n})\nexport class LsPropsSection {\n @Prop() sectionTitle: string;\n @Prop() sectionDescription?: string;\n @Prop() row?: boolean = false;\n\n render() {\n return (\n <Host>\n <div class={this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>{this.sectionTitle}</p>\n {this.sectionDescription && <p class={'ls-field-properties-section-description'}>{this.sectionDescription}</p>}\n </div>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-
|
|
2
|
-
import { d as defineCustomElement$d } from './p-
|
|
3
|
-
import { d as defineCustomElement$c } from './p-
|
|
4
|
-
import { d as defineCustomElement$b } from './p-
|
|
5
|
-
import { d as defineCustomElement$a } from './p-
|
|
6
|
-
import { d as defineCustomElement$9 } from './p-
|
|
7
|
-
import { d as defineCustomElement$8 } from './p-
|
|
8
|
-
import { d as defineCustomElement$7 } from './p-
|
|
9
|
-
import { d as defineCustomElement$6 } from './p-
|
|
10
|
-
import { d as defineCustomElement$5 } from './p-
|
|
11
|
-
import { d as defineCustomElement$4 } from './p-
|
|
12
|
-
import { d as defineCustomElement$3 } from './p-
|
|
13
|
-
import { d as defineCustomElement$2 } from './p-
|
|
14
|
-
import { d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, c as Host } from './p-BnGihP6t.js';
|
|
2
|
+
import { d as defineCustomElement$d } from './p-6rlVwY5W.js';
|
|
3
|
+
import { d as defineCustomElement$c } from './p-DC1C7wSu.js';
|
|
4
|
+
import { d as defineCustomElement$b } from './p-ByNRBaHk.js';
|
|
5
|
+
import { d as defineCustomElement$a } from './p-DEWvb3CA.js';
|
|
6
|
+
import { d as defineCustomElement$9 } from './p-CnzdsJ7f.js';
|
|
7
|
+
import { d as defineCustomElement$8 } from './p-DfaX9tao.js';
|
|
8
|
+
import { d as defineCustomElement$7 } from './p-BSoZFh0I.js';
|
|
9
|
+
import { d as defineCustomElement$6 } from './p-B4SrLUIV.js';
|
|
10
|
+
import { d as defineCustomElement$5 } from './p-BQN3l4X7.js';
|
|
11
|
+
import { d as defineCustomElement$4 } from './p-DeA6P5Nw.js';
|
|
12
|
+
import { d as defineCustomElement$3 } from './p-C3Qs4SL0.js';
|
|
13
|
+
import { d as defineCustomElement$2 } from './p-D3F0Jtj5.js';
|
|
14
|
+
import { d as defineCustomElement$1 } from './p-CwVY532N.js';
|
|
15
15
|
|
|
16
16
|
const lsFieldPropertiesGeneralCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px;width:100%}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{display:flex;gap:0.5rem;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;font-weight:500;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.destructive{border:1px solid var(--red-60, #f04438);background-color:white;color:var(--red-60)}button.destructive:hover{border:1px solid var(--red-70, #d92d20);background:var(--red-10, #fff1f0)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
|
|
17
17
|
|
|
@@ -23,7 +23,7 @@ const LsFieldPropertiesGeneral = /*@__PURE__*/ proxyCustomElement(class LsFieldP
|
|
|
23
23
|
}
|
|
24
24
|
dataItem;
|
|
25
25
|
render() {
|
|
26
|
-
return (h(Host, { key: '
|
|
26
|
+
return (h(Host, { key: 'c5a783c9c50191a03243eacba093df4bc12c01e9' }, h("ls-field-properties-container", { key: 'e982350c67800227aa7bb29e0af36539a34d4ed1', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: 'f47da6e521961f4946b5dcf757668915f3da7f45', class: 'field-set', slot: "content" }, h("ls-field-content", { key: '2eaecda4df966427b680166930e8ac55166cf6c1', dataItem: this.dataItem }), h("ls-field-properties-advanced", { key: '8c58fc6ee970a04ebdeaa5339885010797d47403', dataItem: this.dataItem })), h("div", { key: '7e8c06a26b03c2a38ddc7d5ac8c28fe2769f843f', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: '483075e06327527baecd7ad5eae6fdd213d47bae', dataItem: this.dataItem })), h("div", { key: 'a5a11197ce8a6f2cf6c8f634be5ff60e15e9f662', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: '8c972251f595ee3beadef8607f79578458ef8009', dataItem: this.dataItem }))), h("ls-field-footer", { key: '1a9dff5743fa48f22ce3729fa78f1f06971ba90f', dataItem: this.dataItem })));
|
|
27
27
|
}
|
|
28
28
|
static get style() { return lsFieldPropertiesGeneralCss; }
|
|
29
29
|
}, [257, "ls-field-properties-general", {
|
|
@@ -110,6 +110,6 @@ function defineCustomElement() {
|
|
|
110
110
|
defineCustomElement();
|
|
111
111
|
|
|
112
112
|
export { LsFieldPropertiesGeneral as L, defineCustomElement as d };
|
|
113
|
-
//# sourceMappingURL=p-
|
|
113
|
+
//# sourceMappingURL=p-C5Wwr500.js.map
|
|
114
114
|
|
|
115
|
-
//# sourceMappingURL=p-
|
|
115
|
+
//# sourceMappingURL=p-C5Wwr500.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-C5Wwr500.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,2BAA2B,GAAG,ktJAAktJ;;MCQzuJ,wBAAwB,iBAAAA,kBAAA,CAAA,MAAA,wBAAA,SAAAC,CAAA,CAAA;;;;;;AAC3B,IAAA,QAAQ;IAEhB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAA+B,CAAA,+BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC,EAAA,EACzE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,SAAS,EAAA,EACrC,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EAC7C,CAAA,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACrD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,YAAY,EAAA,EACxC,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5C,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,WAAW,EAAA,EACvC,CAAA,CAAA,oBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CAC3C,CACwB,EAChC,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,CACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-general/ls-field-properties-general.css?tag=ls-field-properties-general&encapsulation=shadow","src/components/ls-field-properties-general/ls-field-properties-general.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n height: 100%;\n position: relative;\n}\n\n* {\n margin: 0;\n}\n\n.field-set {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n width: 100%;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 36px;\n width: 100%;\n}\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n display: flex;\n gap: 0.5rem;\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n font-weight: 500;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.secondary {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--white, #fff);\n color: var(--gray-90, #5e6066);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.secondary:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\nbutton.destructive {\n border: 1px solid var(--red-60, #f04438);\n background-color: white;\n color: var(--red-60);\n}\n\nbutton.destructive:hover {\n border: 1px solid var(--red-70, #d92d20);\n background: var(--red-10, #fff1f0);\n}\n\n\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n tag: 'ls-field-properties-general',\n styleUrl: 'ls-field-properties-general.css',\n shadow: true,\n})\nexport class LsFieldPropertiesGeneral {\n @Prop() dataItem: LSApiElement;\n\n render() {\n return (\n <Host>\n <ls-field-properties-container tabs={['content', 'placement', 'dimensions']}>\n <div class={'field-set'} slot=\"content\">\n <ls-field-content dataItem={this.dataItem} />\n <ls-field-properties-advanced dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"dimensions\">\n <ls-field-dimensions dataItem={this.dataItem} />\n </div>\n <div class={'field-set'} slot=\"placement\">\n <ls-field-placement dataItem={this.dataItem} />\n </div>\n </ls-field-properties-container>\n <ls-field-footer dataItem={this.dataItem} />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BnGihP6t.js';
|
|
2
2
|
import { d as defaultRolePalette } from './p-CwCWCxsI.js';
|
|
3
3
|
import { a as attachAllTooltips } from './p-Cb8nDMs-.js';
|
|
4
|
-
import { d as defineCustomElement$2 } from './p-
|
|
5
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$2 } from './p-BQN3l4X7.js';
|
|
5
|
+
import { d as defineCustomElement$1 } from './p-CwVY532N.js';
|
|
6
6
|
|
|
7
7
|
const lsToolboxFieldCss = ".ls-toolbox-field{display:flex;padding:0.5rem;align-items:center;justify-content:center;gap:0.875rem;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:white;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}.ls-toolbox-field:hover{background:var(--gray-10, #f7f8fa);box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);border:1px solid var(--gray-30, #e0e2e5)}.warning-box{display:flex;padding:0.38rem;align-items:center;justify-content:center;border-radius:0.625rem;border:1px solid var(--red-40, #fca39a);background:var(--red-10, #fff1f0);color:var(--red-60, #f04438)}.toolbox-field-icon{display:flex;padding:0.5rem;align-items:center;border-radius:0.5rem;border:1px solid var(--signer-color);background:var(--signer-color-light);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);color:var(--signer-color)}.toolbox-field-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;width:100%;margin:0}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height: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)}";
|
|
8
8
|
|
|
@@ -11,7 +11,7 @@ const LsToolboxField = /*@__PURE__*/ proxyCustomElement(class LsToolboxField ext
|
|
|
11
11
|
super();
|
|
12
12
|
this.__registerHost();
|
|
13
13
|
this.__attachShadow();
|
|
14
|
-
this.fieldTypeSelected = createEvent(this, "fieldTypeSelected");
|
|
14
|
+
this.fieldTypeSelected = createEvent(this, "fieldTypeSelected", 7);
|
|
15
15
|
}
|
|
16
16
|
get component() { return this; }
|
|
17
17
|
/**
|
|
@@ -80,7 +80,7 @@ const LsToolboxField = /*@__PURE__*/ proxyCustomElement(class LsToolboxField ext
|
|
|
80
80
|
attachAllTooltips(this.component.shadowRoot);
|
|
81
81
|
}
|
|
82
82
|
render() {
|
|
83
|
-
return (h(Host, { key: '
|
|
83
|
+
return (h(Host, { key: '8db0540fc65597dfc99a9a560cfde441d55d219f', draggable: "true" }, h("div", { key: '110d6153b0b171447c0cef8ee67a9ff624a7fe1b', class: 'ls-toolbox-field', style: this.isSelected && {
|
|
84
84
|
background: defaultRolePalette[this.signer % 100].s10,
|
|
85
85
|
border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,
|
|
86
86
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
@@ -95,9 +95,9 @@ const LsToolboxField = /*@__PURE__*/ proxyCustomElement(class LsToolboxField ext
|
|
|
95
95
|
defaultWidth: this.defaultWidth,
|
|
96
96
|
fixedAspect: this.fixedAspect,
|
|
97
97
|
});
|
|
98
|
-
} }, h("div", { key: '
|
|
98
|
+
} }, h("div", { key: '111f63ac4327ccda47ac6db32ca48ec9e2f9161d', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }, "data-tooltip": this.tooltip, "data-tooltip-placement": "right" }, h("ls-icon", { key: '51a32e37745f9caa55018ce04ebc69efa83b45f0', name: this.icon, size: "20" })), h("p", { key: '20cca3db62b33e7993fee5e3a0f5317a8445ca56', class: "toolbox-field-label", style: this.isSelected && {
|
|
99
99
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
100
|
-
} }, this.label), this.redDot && (h("div", { key: '
|
|
100
|
+
} }, this.label), this.redDot && (h("div", { key: '725fc1bc7c95e0b1074f2c6c31e0414b5787ea47', class: 'warning-box', "data-tooltip": `${this.label} Field Required`, "data-tooltip-placement": "left" }, h("ls-icon", { key: '6e8ece4baa10be9fc3a1fd4163d9d5e927b0279a', name: "exclamation-circle", size: "18", solid: true }))), h("ls-icon", { key: '47097268cf0db6a0edcde55a2fea0760164a7a23', name: "drag-vertical", size: "16", color: "#787a80" })), h("ls-tooltip", { key: '494be0b07a6ba735061f751d8681cdfbc59c79d8', id: "ls-tooltip-master", tooltipText: "Something" })));
|
|
101
101
|
}
|
|
102
102
|
static get style() { return lsToolboxFieldCss; }
|
|
103
103
|
}, [257, "ls-toolbox-field", {
|
|
@@ -140,6 +140,6 @@ function defineCustomElement() {
|
|
|
140
140
|
defineCustomElement();
|
|
141
141
|
|
|
142
142
|
export { LsToolboxField as L, defineCustomElement as d };
|
|
143
|
-
//# sourceMappingURL=p-
|
|
143
|
+
//# sourceMappingURL=p-C7jd-O6l.js.map
|
|
144
144
|
|
|
145
|
-
//# sourceMappingURL=p-
|
|
145
|
+
//# sourceMappingURL=p-C7jd-O6l.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-C7jd-O6l.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-toolbox-field/ls-toolbox-field.css?tag=ls-toolbox-field&encapsulation=shadow","src/components/ls-toolbox-field/ls-toolbox-field.tsx"],"sourcesContent":[".ls-toolbox-field {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n justify-content: center;\n gap: 0.875rem;\n border-radius: 1rem;\n border: 1px solid var(--gray-20, #edeff2);\n background: white;\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\n.ls-toolbox-field:hover {\n background: var(--gray-10, #f7f8fa);\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid var(--gray-30, #e0e2e5);\n}\n\n.warning-box {\n display: flex;\n padding: 0.38rem;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid var(--red-40, #fca39a);\n background: var(--red-10, #fff1f0);\n color: var(--red-60, #f04438);\n}\n\n\n\n.toolbox-field-icon {\n display: flex;\n padding: 0.5rem;\n align-items: center;\n border-radius: 0.5rem;\n border: 1px solid var(--signer-color);\n background: var(--signer-color-light);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n color: var(--signer-color);\n}\n\n.toolbox-field-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n width: 100%;\n margin: 0;\n}\n\n/* Global Styles */\n\np {\n color: var(--gray-80, #6c6e73);\n font-family: var(--font-family);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n}\n\na {\n color: var(--primary-60, #4456f6);\n font-size: var(--text-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--text-sm-line-height);\n cursor: pointer;\n}\n\na:hover {\n text-decoration: underline;\n color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n all: unset;\n}\n\nselect {\n appearance: none;\n height: 36px;\n}\n\n.input-wrapper {\n position: relative;\n width: fit-content;\n}\n\n#selectorIcon {\n position: absolute;\n top: 50%;\n right: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n position: absolute;\n top: 50%;\n left: 0.675rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n border: 1px solid var(--gray-40, #d8d9dc);\n box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n padding: 0.5rem 0.75rem;\n font-family: var(--font-family);\n font-size: var(--text-sm);\n border-radius: 0.5rem;\n color: var(--gray-100, #45484d);\n font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n border-color: var(--gray-50, #c8c9cc);\n background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n border-color: var(--primary-60, #4456f6);\n background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n cursor: not-allowed;\n background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n appearance: none;\n position: relative;\n height: 1rem;\n width: 1rem;\n padding: 0.25rem;\n border-radius: var(--radius-sm);\n border: 1px solid #d1d5db;\n background-color: #ffffff;\n cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n background-color: var(--primary-60, #4456f6);\n border: none;\n}\n\ninput[type='checkbox']:checked::after {\n content: '';\n position: absolute;\n top: 45%;\n left: 50%;\n transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n width: 0.5rem;\n height: 0.25rem;\n border-bottom: 0.125rem solid white;\n border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 0.5rem;\n height: 0.125rem;\n background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n background-color: var(--primary-70, #2134dc);\n border: none;\n}\n\ninput[type='checkbox']:hover {\n border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n outline: none;\n box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n background-color: #f3f4f6;\n outline: none;\n cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n background-color: #e5e7eb;\n border: none;\n outline: none;\n cursor: not-allowed;\n}\n\n.checkbox-container {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.checkbox-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1rem;\n}\n\n.form-label {\n color: var(--gray-100, #45484d);\n font-size: 1rem;\n font-style: normal;\n font-weight: 500;\n line-height: 1.5rem;\n}\n\n.form-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n width: 100%;\n}\n\n.loading-box {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100vh;\n color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n border: 0;\n appearance: button;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-lg);\n background-color: var(--primary-60, #4456f6);\n color: white;\n text-transform: capitalize;\n min-height: 2.25rem;\n min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n border: 1px solid var(--gray-40, #d8d9dc);\n background-color: white;\n color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n border: 1px solid var(--gray-50, #c8c9cc);\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n display: flex;\n border-radius: 0.5rem;\n border: 1px solid var(--gray-30, #e0e2e5);\n background: var(--white, #ffffff);\n overflow: clip;\n}\n\n.button-group button {\n display: flex;\n background: transparent;\n border-radius: unset;\n padding: 0.25rem 0.75rem;\n min-width: 2.156rem;\n min-height: unset;\n color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","import { Component, Event, Host, Listen, Prop, Element, h, EventEmitter } from '@stencil/core';\nimport { Icon } from '../../types/Icon';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-toolbox-field',\n styleUrl: 'ls-toolbox-field.css',\n shadow: true,\n})\nexport class LsToolboxField {\n @Element() component: HTMLElement;\n /**\n * The field type of this toolbox item, e.g. 'signature'. Note these should always be lowercase.\n */\n @Prop() formElementType: string;\n @Prop() elementType: string;\n @Prop() validation: number = 0;\n @Prop() fixedAspect: number | null = null;\n @Prop() redDot: boolean = false;\n\n /**\n * The text to display for this field type.\n */\n @Prop() label: string;\n\n /**\n * The icon to display for this field type.\n */\n @Prop() icon: Icon;\n /**\n * The tooltip hint to describe to the field type\n */\n @Prop() tooltip: string;\n\n /**\n * The starting height of this control type in pixels.\n */\n @Prop() defaultHeight: number;\n /**\n * The starting width of this control type in pixels.\n */\n @Prop() defaultWidth: number;\n\n /**\n * The signer color of the element\n */\n @Prop() signer: number = 0;\n\n @Prop({ mutable: true }) isSelected: boolean = false;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n fieldTypeSelected: EventEmitter<{\n label: string;\n elementType: string;\n defaultHeight: number;\n defaultWidth: number;\n formElementType: string;\n validation: number;\n fixedAspect: number | null;\n }>;\n\n @Listen('dragstart')\n handleDragStart(event) {\n\n var canvas = document.createElement('div');\n canvas.style.position = 'absolute';\n canvas.style.left = '-100%';\n canvas.style.zIndex = '-100';\n canvas.style.height = this.defaultHeight +'px';\n canvas.style.width = this.defaultWidth +'px';\n canvas.style.backgroundColor = 'rgba(255, 255, 255, 1)';\n canvas.style.border = `1px dashed ${defaultRolePalette[this.signer % 100].s60}`;\n canvas.innerHTML = this.formElementType;\n document.body.appendChild(canvas); \n\n event.dataTransfer.setDragImage(canvas, -50, -20);\n\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n }),\n );\n event.dataTransfer.dropEffect = 'copy';\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'ArrowDown') {\n console.log('down arrow pressed');\n }\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host draggable=\"true\">\n <div\n class={'ls-toolbox-field'}\n style={\n this.isSelected && {\n background: defaultRolePalette[this.signer % 100].s10,\n border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,\n color: defaultRolePalette[this.signer % 100].s80,\n boxShadow: `0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06);`,\n }\n }\n onClick={() => {\n this.fieldTypeSelected.emit({\n label: this.label,\n formElementType: this.formElementType,\n elementType: this.elementType,\n validation: this.validation,\n defaultHeight: this.defaultHeight,\n defaultWidth: this.defaultWidth,\n fixedAspect: this.fixedAspect,\n });\n }}\n >\n <div\n class=\"toolbox-field-icon\"\n style={{ '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }}\n data-tooltip={this.tooltip}\n data-tooltip-placement=\"right\"\n >\n <ls-icon name={this.icon} size=\"20\" />\n </div>\n <p\n class=\"toolbox-field-label\"\n style={\n this.isSelected && {\n color: defaultRolePalette[this.signer % 100].s80,\n }\n }\n >\n {this.label}\n </p>\n {this.redDot && (\n <div class={'warning-box'} data-tooltip={`${this.label} Field Required`} data-tooltip-placement=\"left\">\n <ls-icon name=\"exclamation-circle\" size=\"18\" solid />\n </div>\n )}\n <ls-icon name=\"drag-vertical\" size=\"16\" color=\"#787a80\" />\n </div>\n <ls-tooltip id=\"ls-tooltip-master\" tooltipText=\"Something\" />\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, h, c as Host } from './p-BnGihP6t.js';
|
|
2
2
|
|
|
3
3
|
const lsEditorTableCss = ":host{display:block;z-index:100;position:absolute;top:0px;left:0px}table{background-color:azure;border:1px solid black}td{border:1px solid black}";
|
|
4
4
|
|
|
@@ -31,7 +31,7 @@ const LsEditorTable = /*@__PURE__*/ proxyCustomElement(class LsEditorTable exten
|
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
33
|
render() {
|
|
34
|
-
return (h(Host, { key: '
|
|
34
|
+
return (h(Host, { key: '55c508ab25969ad8649fb15ef7a0e20d3e212bde' }, h("table", { key: '8b9154ecc83d4a09b67a83441c6e73692380c72a', id: "ls-editor-table" }), h("slot", { key: 'f3eea5f381266897fcf5df9d08959076b5ba4385' })));
|
|
35
35
|
}
|
|
36
36
|
static get style() { return lsEditorTableCss; }
|
|
37
37
|
}, [257, "ls-editor-table", {
|
|
@@ -53,6 +53,6 @@ function defineCustomElement() {
|
|
|
53
53
|
defineCustomElement();
|
|
54
54
|
|
|
55
55
|
export { LsEditorTable as L, defineCustomElement as d };
|
|
56
|
-
//# sourceMappingURL=p-
|
|
56
|
+
//# sourceMappingURL=p-CB2IouRT.js.map
|
|
57
57
|
|
|
58
|
-
//# sourceMappingURL=p-
|
|
58
|
+
//# sourceMappingURL=p-CB2IouRT.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-CB2IouRT.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,mJAAmJ;;MCQ/J,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;;AAExB;;;AAGA;AACQ,IAAA,MAAM;IAEd,gBAAgB,GAAA;AACd,QAAA,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,iBAAiB,CAAsB;QAChG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,IAAG;YAE5F,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;YAC5C,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;YAC/C,UAAU,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE;AACrC,YAAA,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC;YAE/B,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;YAClD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK;AAC3C,YAAA,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC;YAElC,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;YAClD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK;AAC3C,YAAA,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC;AAElC,YAAA,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC;AAChC,SAAC,CAAC;;IAGJ,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAO,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,iBAAiB,EACnB,CAAA,EACR,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-editor-table/ls-editor-table.css?tag=ls-editor-table&encapsulation=shadow","src/components/ls-editor-table/ls-editor-table.tsx"],"sourcesContent":[":host {\n display: block;\n z-index: 100;\n position: absolute;\n top: 0px;\n left: 0px;\n}\n\ntable {\n background-color: azure;\n border: 1px solid black\n}\n\ntd {\n border: 1px solid black\n}\n","import { Component, Host, Prop, h, Element } from '@stencil/core';\nimport { LsDocumentViewer } from '../ls-document-viewer/ls-document-viewer';\n\n@Component({\n tag: 'ls-editor-table',\n styleUrl: 'ls-editor-table.css',\n shadow: true,\n})\nexport class LsEditorTable {\n @Element() component: HTMLElement;\n /**\n* The parent editor control.\n* {LsDocumentViewer}\n*/\n @Prop() editor: LsDocumentViewer;\n\n componentDidLoad() {\n var dataTable = this.component.shadowRoot.getElementById('ls-editor-table') as HTMLCanvasElement;\n Array.from(this.editor.component.shadowRoot.querySelectorAll('ls-editor-field')).forEach(fx => {\n\n const rowNode = document.createElement('tr');\n const idCellNode = document.createElement('td');\n idCellNode.innerText = fx.dataItem.id\n rowNode.appendChild(idCellNode);\n\n const valueCellNode = document.createElement('td');\n valueCellNode.innerText = fx.dataItem.value\n rowNode.appendChild(valueCellNode);\n\n const labelCellNode = document.createElement('td');\n labelCellNode.innerText = fx.dataItem.label\n rowNode.appendChild(labelCellNode);\n\n dataTable.appendChild(rowNode)\n })\n }\n\n render() {\n return (\n <Host>\n <table id=\"ls-editor-table\">\n </table>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|