legalesign-document-viewer 0.2.5 → 0.2.6

package/dist/collection/components/ls-editor-field/ls-editor-field.css

@@ -1,4 +1,248 @@
 :host {
+  /* Font Family */
+  --font-family: 'IBM Plex Sans', sans-serif;
+
+  /* Font Sizes & Line Heights */
+  --text-xs: 0.75rem;
+  --text-xs-line-height: 1rem;
+
+  --text-sm: 0.875rem;
+  --text-sm-line-height: 1.25rem;
+
+  --text-base: 1rem;
+  --text-base-line-height: 1.5rem;
+
+  --text-lg: 1.125rem;
+  --text-lg-line-height: 1.75rem;
+
+  --text-xl: 1.25rem;
+  --text-xl-line-height: 1.75rem;
+
+  --text-2xl: 1.5rem;
+  --text-2xl-line-height: 2rem;
+
+  --text-3xl: 1.875rem;
+  --text-3xl-line-height: 2.25rem;
+
+  --text-4xl: 2.25rem;
+  --text-4xl-line-height: 2.5rem;
+
+  --text-5xl: 3rem;
+  --text-5xl-line-height: 1;
+
+  --text-6xl: 3.75rem;
+  --text-6xl-line-height: 1;
+
+  --text-7xl: 4.5rem;
+  --text-7xl-line-height: 1;
+
+  --text-9xl: 8rem;
+  --text-9xl-line-height: 1;
+
+  /* Font Weights */
+  --font-weight-light: 300;
+  --font-weight-normal: 400;
+  --font-weight-medium: 500;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
+  --font-weight-black: 900;
+
+  /* Border Radius */
+  --radius-xs: 0.125rem;
+  --radius-sm: 0.25rem;
+  --radius-md: 0.375rem;
+  --radius-lg: 0.5rem;
+  --radius-xl: 0.75rem;
+  --radius-2xl: 1rem;
+
+  /* Colors */
+  --white: #ffffff;
+  --black: #000000;
+
+  --pink-10: #fff0f9;
+  --pink-20: #ffe5f5;
+  --pink-30: #fabee2;
+  --pink-40: #f5a2d4;
+  --pink-50: #fa78c6;
+  --pink-60: #f056b2;
+  --pink-70: #e043a2;
+  --pink-80: #cc2d8c;
+  --pink-90: #ad2376;
+  --pink-100: #7a1451;
+
+  --red-10: #fff0f0;
+  --red-20: #ffe1e0;
+  --red-30: #ffc9c7;
+  --red-40: #ffa19e;
+  --red-50: #ff706b;
+  --red-60: #f64a44;
+  --red-70: #dc2721;
+  --red-80: #c1140e;
+  --red-90: #990500;
+  --red-100: #7a1714;
+
+  --yellow-10: #fffcef;
+  --yellow-20: #fff3c2;
+  --yellow-30: #fcec9d;
+  --yellow-40: #ffe561;
+  --yellow-50: #fad232;
+  --yellow-60: #f0b618;
+  --yellow-70: #cc8904;
+  --yellow-80: #9e5913;
+  --yellow-90: #8a3f0e;
+  --yellow-100: #70350d;
+
+  --green-10: #effff9;
+  --green-20: #c5fde8;
+  --green-30: #9df5d4;
+  --green-40: #72f0c2;
+  --green-50: #57e5b1;
+  --green-60: #46dbaa;
+  --green-70: #33b88c;
+  --green-80: #15946a;
+  --green-90: #177559;
+  --green-100: #125241;
+
+  --teal-10: #effffc;
+  --teal-20: #c5fcf1;
+  --teal-30: #a5fae9;
+  --teal-40: #76f5db;
+  --teal-50: #54ebcd;
+  --teal-60: #46dbbd;
+  --teal-70: #33b8a2;
+  --teal-80: #148f7e;
+  --teal-90: #17756c;
+  --teal-100: #15524c;
+
+  --cyan-10: #efffff;
+  --cyan-20: #c5fcfc;
+  --cyan-30: #a0fafa;
+  --cyan-40: #76f5f5;
+  --cyan-50: #54ebeb;
+  --cyan-60: #46dbdb;
+  --cyan-70: #33b3b8;
+  --cyan-80: #11868f;
+  --cyan-90: #166a70;
+  --cyan-100: #11474d;
+
+  --lightblue-10: #effbff;
+  --lightblue-20: #c7f1ff;
+  --lightblue-30: #9de4fc;
+  --lightblue-40: #79dbfc;
+  --lightblue-50: #51d3ff;
+  --lightblue-60: #48c5f0;
+  --lightblue-70: #20a6d6;
+  --lightblue-80: #0b80b2;
+  --lightblue-90: #19648a;
+  --lightblue-100: #0c3e57;
+
+  --blue-10: #f0f6ff;
+  --blue-20: #e0ecff;
+  --blue-30: #bed4fa;
+  --blue-40: #a2bdf5;
+  --blue-50: #78a3fa;
+  --blue-60: #5684f0;
+  --blue-70: #4368e0;
+  --blue-80: #2d4dcc;
+  --blue-90: #233ead;
+  --blue-100: #14287a;
+
+  --purple-10: #f4f0ff;
+  --purple-20: #eee5ff;
+  --purple-30: #d6befa;
+  --purple-40: #c6a2f5;
+  --purple-50: #b078fa;
+  --purple-60: #9956f0;
+  --purple-70: #8743e0;
+  --purple-80: #722dcc;
+  --purple-90: #5f23ad;
+  --purple-100: #40147a;
+
+  --primary-10: #eff4ff;
+  --primary-20: #c7ddff;
+  --primary-30: #9dc3fc;
+  --primary-40: #79adfc;
+  --primary-50: #5185ff;
+  --primary-60: #4456f6;
+  --primary-70: #2134dc;
+  --primary-80: #0e20c1;
+  --primary-90: #000f99;
+  --primary-100: #0c1457;
+
+  --gray-10: #f7f8fa;
+  --gray-20: #edeff2;
+  --gray-30: #e0e2e5;
+  --gray-40: #d8d9dc;
+  --gray-50: #c8c9cc;
+  --gray-60: #afb0b2;
+  --gray-70: #939599;
+  --gray-80: #6f7176;
+  --gray-90: #5e6066;
+  --gray-100: #45484d;
+  --gray-110: #292c33;
+  --gray-120: #151923;
+  --gray-130: #0c1019;
+  --gray-140: #05080d;
+
+  --aubergine-10: #fcf0ff;
+  --aubergine-20: #fae5ff;
+  --aubergine-30: #eebefa;
+  --aubergine-40: #e4a2f5;
+  --aubergine-50: #e078fa;
+  --aubergine-60: #d156f0;
+  --aubergine-70: #c143e0;
+  --aubergine-80: #ac2dcc;
+  --aubergine-90: #9223ad;
+  --aubergine-100: #66147a;
+
+  --indigo-10: #f2f0ff;
+  --indigo-20: #e9e5ff;
+  --indigo-30: #c6befa;
+  --indigo-40: #ada2f5;
+  --indigo-50: #8978fa;
+  --indigo-60: #6b56f0;
+  --indigo-70: #5843e0;
+  --indigo-80: #422dcc;
+  --indigo-90: #3523ad;
+  --indigo-100: #21147a;
+
+  --lime-10: #fafff0;
+  --lime-20: #f6ffe5;
+  --lime-30: #e6fabe;
+  --lime-40: #d9f5a2;
+  --lime-50: #cffa78;
+  --lime-60: #bdf056;
+  --lime-70: #ace043;
+  --lime-80: #97cc2d;
+  --lime-90: #7fad23;
+  --lime-100: #587a14;
+
+  --trueGreen-10: #f0fff0;
+  --trueGreen-20: #e5ffe5;
+  --trueGreen-30: #befabe;
+  --trueGreen-40: #a2f5a2;
+  --trueGreen-50: #78fa78;
+  --trueGreen-60: #56f056;
+  --trueGreen-70: #43e043;
+  --trueGreen-80: #2dcc2d;
+  --trueGreen-90: #23ad23;
+  --trueGreen-100: #147a14;
+
+  --burnt-10: #fff6f0;
+  --burnt-20: #fff0e5;
+  --burnt-30: #fad6be;
+  --burnt-40: #f5c3a2;
+  --burnt-50: #faac78;
+  --burnt-60: #f09456;
+  --burnt-70: #e08243;
+  --burnt-80: #cc6d2d;
+  --burnt-90: #ad5a23;
+  --burnt-100: #7a3d14;
+
+  --shadow-base: 0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);
+  --shadow-lg: 0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
+  --active: 0px 1px 3px rgba(0, 15, 153, 0.25), 0px 1px 2px rgba(0, 15, 153, 0.06), 0px 0px 0px 4px #9dc3fc;
+
   display: block;
   position: absolute;
   margin: 0px;

package/dist/components/ls-document-viewer.js

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
 import { d as defaultRolePalette } from './p-C00GqV9f.js';
 import { a as alter, o as oob, m as matchData, g as getApiType } from './p-DqJ_uIFZ.js';
 import { d as defineCustomElement$B } from './p-BneR1hef.js';
-import { d as defineCustomElement$A } from './p-DasXNgMG.js';
+import { d as defineCustomElement$A } from './p-xCgJuAC2.js';
 import { d as defineCustomElement$z } from './p-C9AqDCzm.js';
 import { d as defineCustomElement$y } from './p-DVz19y7K.js';
 import { d as defineCustomElement$x } from './p-DzmtJl3e.js';

package/dist/components/ls-editor-field.js

@@ -1,4 +1,4 @@
-import { L as LsEditorField$1, d as defineCustomElement$1 } from './p-DasXNgMG.js';
+import { L as LsEditorField$1, d as defineCustomElement$1 } from './p-xCgJuAC2.js';
 
 const LsEditorField = LsEditorField$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-DasXNgMG.js → p-xCgJuAC2.js}

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, d as Host } from './p-DjfDnBZ1.js';
 import { b as getInputType } from './p-DqJ_uIFZ.js';
 import { d as defaultRolePalette } from './p-C00GqV9f.js';
 
-const lsEditorFieldCss = ":host{display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}";
+const lsEditorFieldCss = ":host{--font-family:'IBM Plex Sans', sans-serif;--text-xs:0.75rem;--text-xs-line-height:1rem;--text-sm:0.875rem;--text-sm-line-height:1.25rem;--text-base:1rem;--text-base-line-height:1.5rem;--text-lg:1.125rem;--text-lg-line-height:1.75rem;--text-xl:1.25rem;--text-xl-line-height:1.75rem;--text-2xl:1.5rem;--text-2xl-line-height:2rem;--text-3xl:1.875rem;--text-3xl-line-height:2.25rem;--text-4xl:2.25rem;--text-4xl-line-height:2.5rem;--text-5xl:3rem;--text-5xl-line-height:1;--text-6xl:3.75rem;--text-6xl-line-height:1;--text-7xl:4.5rem;--text-7xl-line-height:1;--text-9xl:8rem;--text-9xl-line-height:1;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--radius-xs:0.125rem;--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--white:#ffffff;--black:#000000;--pink-10:#fff0f9;--pink-20:#ffe5f5;--pink-30:#fabee2;--pink-40:#f5a2d4;--pink-50:#fa78c6;--pink-60:#f056b2;--pink-70:#e043a2;--pink-80:#cc2d8c;--pink-90:#ad2376;--pink-100:#7a1451;--red-10:#fff0f0;--red-20:#ffe1e0;--red-30:#ffc9c7;--red-40:#ffa19e;--red-50:#ff706b;--red-60:#f64a44;--red-70:#dc2721;--red-80:#c1140e;--red-90:#990500;--red-100:#7a1714;--yellow-10:#fffcef;--yellow-20:#fff3c2;--yellow-30:#fcec9d;--yellow-40:#ffe561;--yellow-50:#fad232;--yellow-60:#f0b618;--yellow-70:#cc8904;--yellow-80:#9e5913;--yellow-90:#8a3f0e;--yellow-100:#70350d;--green-10:#effff9;--green-20:#c5fde8;--green-30:#9df5d4;--green-40:#72f0c2;--green-50:#57e5b1;--green-60:#46dbaa;--green-70:#33b88c;--green-80:#15946a;--green-90:#177559;--green-100:#125241;--teal-10:#effffc;--teal-20:#c5fcf1;--teal-30:#a5fae9;--teal-40:#76f5db;--teal-50:#54ebcd;--teal-60:#46dbbd;--teal-70:#33b8a2;--teal-80:#148f7e;--teal-90:#17756c;--teal-100:#15524c;--cyan-10:#efffff;--cyan-20:#c5fcfc;--cyan-30:#a0fafa;--cyan-40:#76f5f5;--cyan-50:#54ebeb;--cyan-60:#46dbdb;--cyan-70:#33b3b8;--cyan-80:#11868f;--cyan-90:#166a70;--cyan-100:#11474d;--lightblue-10:#effbff;--lightblue-20:#c7f1ff;--lightblue-30:#9de4fc;--lightblue-40:#79dbfc;--lightblue-50:#51d3ff;--lightblue-60:#48c5f0;--lightblue-70:#20a6d6;--lightblue-80:#0b80b2;--lightblue-90:#19648a;--lightblue-100:#0c3e57;--blue-10:#f0f6ff;--blue-20:#e0ecff;--blue-30:#bed4fa;--blue-40:#a2bdf5;--blue-50:#78a3fa;--blue-60:#5684f0;--blue-70:#4368e0;--blue-80:#2d4dcc;--blue-90:#233ead;--blue-100:#14287a;--purple-10:#f4f0ff;--purple-20:#eee5ff;--purple-30:#d6befa;--purple-40:#c6a2f5;--purple-50:#b078fa;--purple-60:#9956f0;--purple-70:#8743e0;--purple-80:#722dcc;--purple-90:#5f23ad;--purple-100:#40147a;--primary-10:#eff4ff;--primary-20:#c7ddff;--primary-30:#9dc3fc;--primary-40:#79adfc;--primary-50:#5185ff;--primary-60:#4456f6;--primary-70:#2134dc;--primary-80:#0e20c1;--primary-90:#000f99;--primary-100:#0c1457;--gray-10:#f7f8fa;--gray-20:#edeff2;--gray-30:#e0e2e5;--gray-40:#d8d9dc;--gray-50:#c8c9cc;--gray-60:#afb0b2;--gray-70:#939599;--gray-80:#6f7176;--gray-90:#5e6066;--gray-100:#45484d;--gray-110:#292c33;--gray-120:#151923;--gray-130:#0c1019;--gray-140:#05080d;--aubergine-10:#fcf0ff;--aubergine-20:#fae5ff;--aubergine-30:#eebefa;--aubergine-40:#e4a2f5;--aubergine-50:#e078fa;--aubergine-60:#d156f0;--aubergine-70:#c143e0;--aubergine-80:#ac2dcc;--aubergine-90:#9223ad;--aubergine-100:#66147a;--indigo-10:#f2f0ff;--indigo-20:#e9e5ff;--indigo-30:#c6befa;--indigo-40:#ada2f5;--indigo-50:#8978fa;--indigo-60:#6b56f0;--indigo-70:#5843e0;--indigo-80:#422dcc;--indigo-90:#3523ad;--indigo-100:#21147a;--lime-10:#fafff0;--lime-20:#f6ffe5;--lime-30:#e6fabe;--lime-40:#d9f5a2;--lime-50:#cffa78;--lime-60:#bdf056;--lime-70:#ace043;--lime-80:#97cc2d;--lime-90:#7fad23;--lime-100:#587a14;--trueGreen-10:#f0fff0;--trueGreen-20:#e5ffe5;--trueGreen-30:#befabe;--trueGreen-40:#a2f5a2;--trueGreen-50:#78fa78;--trueGreen-60:#56f056;--trueGreen-70:#43e043;--trueGreen-80:#2dcc2d;--trueGreen-90:#23ad23;--trueGreen-100:#147a14;--burnt-10:#fff6f0;--burnt-20:#fff0e5;--burnt-30:#fad6be;--burnt-40:#f5c3a2;--burnt-50:#faac78;--burnt-60:#f09456;--burnt-70:#e08243;--burnt-80:#cc6d2d;--burnt-90:#ad5a23;--burnt-100:#7a3d14;--shadow-base:0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);--shadow-lg:0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);--active:0px 1px 3px rgba(0, 15, 153, 0.25), 0px 1px 2px rgba(0, 15, 153, 0.06), 0px 0px 0px 4px #9dc3fc;display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}";
 
 const LsEditorField = /*@__PURE__*/ proxyCustomElement(class LsEditorField extends H {
     constructor() {
@@ -157,6 +157,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsEditorField as L, defineCustomElement as d };
-//# sourceMappingURL=p-DasXNgMG.js.map
+//# sourceMappingURL=p-xCgJuAC2.js.map
 
-//# sourceMappingURL=p-DasXNgMG.js.map
+//# sourceMappingURL=p-xCgJuAC2.js.map

package/dist/components/p-xCgJuAC2.js.map

@@ -0,0 +1 @@
+{"file":"p-xCgJuAC2.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-editor-field/ls-editor-field.css?tag=ls-editor-field&encapsulation=shadow","src/components/ls-editor-field/ls-editor-field.tsx"],"sourcesContent":[":host {\n  /* Font Family */\n  --font-family: 'IBM Plex Sans', sans-serif;\n\n  /* Font Sizes & Line Heights */\n  --text-xs: 0.75rem;\n  --text-xs-line-height: 1rem;\n\n  --text-sm: 0.875rem;\n  --text-sm-line-height: 1.25rem;\n\n  --text-base: 1rem;\n  --text-base-line-height: 1.5rem;\n\n  --text-lg: 1.125rem;\n  --text-lg-line-height: 1.75rem;\n\n  --text-xl: 1.25rem;\n  --text-xl-line-height: 1.75rem;\n\n  --text-2xl: 1.5rem;\n  --text-2xl-line-height: 2rem;\n\n  --text-3xl: 1.875rem;\n  --text-3xl-line-height: 2.25rem;\n\n  --text-4xl: 2.25rem;\n  --text-4xl-line-height: 2.5rem;\n\n  --text-5xl: 3rem;\n  --text-5xl-line-height: 1;\n\n  --text-6xl: 3.75rem;\n  --text-6xl-line-height: 1;\n\n  --text-7xl: 4.5rem;\n  --text-7xl-line-height: 1;\n\n  --text-9xl: 8rem;\n  --text-9xl-line-height: 1;\n\n  /* Font Weights */\n  --font-weight-light: 300;\n  --font-weight-normal: 400;\n  --font-weight-medium: 500;\n  --font-weight-semibold: 600;\n  --font-weight-bold: 700;\n  --font-weight-black: 900;\n\n  /* Border Radius */\n  --radius-xs: 0.125rem;\n  --radius-sm: 0.25rem;\n  --radius-md: 0.375rem;\n  --radius-lg: 0.5rem;\n  --radius-xl: 0.75rem;\n  --radius-2xl: 1rem;\n\n  /* Colors */\n  --white: #ffffff;\n  --black: #000000;\n\n  --pink-10: #fff0f9;\n  --pink-20: #ffe5f5;\n  --pink-30: #fabee2;\n  --pink-40: #f5a2d4;\n  --pink-50: #fa78c6;\n  --pink-60: #f056b2;\n  --pink-70: #e043a2;\n  --pink-80: #cc2d8c;\n  --pink-90: #ad2376;\n  --pink-100: #7a1451;\n\n  --red-10: #fff0f0;\n  --red-20: #ffe1e0;\n  --red-30: #ffc9c7;\n  --red-40: #ffa19e;\n  --red-50: #ff706b;\n  --red-60: #f64a44;\n  --red-70: #dc2721;\n  --red-80: #c1140e;\n  --red-90: #990500;\n  --red-100: #7a1714;\n\n  --yellow-10: #fffcef;\n  --yellow-20: #fff3c2;\n  --yellow-30: #fcec9d;\n  --yellow-40: #ffe561;\n  --yellow-50: #fad232;\n  --yellow-60: #f0b618;\n  --yellow-70: #cc8904;\n  --yellow-80: #9e5913;\n  --yellow-90: #8a3f0e;\n  --yellow-100: #70350d;\n\n  --green-10: #effff9;\n  --green-20: #c5fde8;\n  --green-30: #9df5d4;\n  --green-40: #72f0c2;\n  --green-50: #57e5b1;\n  --green-60: #46dbaa;\n  --green-70: #33b88c;\n  --green-80: #15946a;\n  --green-90: #177559;\n  --green-100: #125241;\n\n  --teal-10: #effffc;\n  --teal-20: #c5fcf1;\n  --teal-30: #a5fae9;\n  --teal-40: #76f5db;\n  --teal-50: #54ebcd;\n  --teal-60: #46dbbd;\n  --teal-70: #33b8a2;\n  --teal-80: #148f7e;\n  --teal-90: #17756c;\n  --teal-100: #15524c;\n\n  --cyan-10: #efffff;\n  --cyan-20: #c5fcfc;\n  --cyan-30: #a0fafa;\n  --cyan-40: #76f5f5;\n  --cyan-50: #54ebeb;\n  --cyan-60: #46dbdb;\n  --cyan-70: #33b3b8;\n  --cyan-80: #11868f;\n  --cyan-90: #166a70;\n  --cyan-100: #11474d;\n\n  --lightblue-10: #effbff;\n  --lightblue-20: #c7f1ff;\n  --lightblue-30: #9de4fc;\n  --lightblue-40: #79dbfc;\n  --lightblue-50: #51d3ff;\n  --lightblue-60: #48c5f0;\n  --lightblue-70: #20a6d6;\n  --lightblue-80: #0b80b2;\n  --lightblue-90: #19648a;\n  --lightblue-100: #0c3e57;\n\n  --blue-10: #f0f6ff;\n  --blue-20: #e0ecff;\n  --blue-30: #bed4fa;\n  --blue-40: #a2bdf5;\n  --blue-50: #78a3fa;\n  --blue-60: #5684f0;\n  --blue-70: #4368e0;\n  --blue-80: #2d4dcc;\n  --blue-90: #233ead;\n  --blue-100: #14287a;\n\n  --purple-10: #f4f0ff;\n  --purple-20: #eee5ff;\n  --purple-30: #d6befa;\n  --purple-40: #c6a2f5;\n  --purple-50: #b078fa;\n  --purple-60: #9956f0;\n  --purple-70: #8743e0;\n  --purple-80: #722dcc;\n  --purple-90: #5f23ad;\n  --purple-100: #40147a;\n\n  --primary-10: #eff4ff;\n  --primary-20: #c7ddff;\n  --primary-30: #9dc3fc;\n  --primary-40: #79adfc;\n  --primary-50: #5185ff;\n  --primary-60: #4456f6;\n  --primary-70: #2134dc;\n  --primary-80: #0e20c1;\n  --primary-90: #000f99;\n  --primary-100: #0c1457;\n\n  --gray-10: #f7f8fa;\n  --gray-20: #edeff2;\n  --gray-30: #e0e2e5;\n  --gray-40: #d8d9dc;\n  --gray-50: #c8c9cc;\n  --gray-60: #afb0b2;\n  --gray-70: #939599;\n  --gray-80: #6f7176;\n  --gray-90: #5e6066;\n  --gray-100: #45484d;\n  --gray-110: #292c33;\n  --gray-120: #151923;\n  --gray-130: #0c1019;\n  --gray-140: #05080d;\n\n  --aubergine-10: #fcf0ff;\n  --aubergine-20: #fae5ff;\n  --aubergine-30: #eebefa;\n  --aubergine-40: #e4a2f5;\n  --aubergine-50: #e078fa;\n  --aubergine-60: #d156f0;\n  --aubergine-70: #c143e0;\n  --aubergine-80: #ac2dcc;\n  --aubergine-90: #9223ad;\n  --aubergine-100: #66147a;\n\n  --indigo-10: #f2f0ff;\n  --indigo-20: #e9e5ff;\n  --indigo-30: #c6befa;\n  --indigo-40: #ada2f5;\n  --indigo-50: #8978fa;\n  --indigo-60: #6b56f0;\n  --indigo-70: #5843e0;\n  --indigo-80: #422dcc;\n  --indigo-90: #3523ad;\n  --indigo-100: #21147a;\n\n  --lime-10: #fafff0;\n  --lime-20: #f6ffe5;\n  --lime-30: #e6fabe;\n  --lime-40: #d9f5a2;\n  --lime-50: #cffa78;\n  --lime-60: #bdf056;\n  --lime-70: #ace043;\n  --lime-80: #97cc2d;\n  --lime-90: #7fad23;\n  --lime-100: #587a14;\n\n  --trueGreen-10: #f0fff0;\n  --trueGreen-20: #e5ffe5;\n  --trueGreen-30: #befabe;\n  --trueGreen-40: #a2f5a2;\n  --trueGreen-50: #78fa78;\n  --trueGreen-60: #56f056;\n  --trueGreen-70: #43e043;\n  --trueGreen-80: #2dcc2d;\n  --trueGreen-90: #23ad23;\n  --trueGreen-100: #147a14;\n\n  --burnt-10: #fff6f0;\n  --burnt-20: #fff0e5;\n  --burnt-30: #fad6be;\n  --burnt-40: #f5c3a2;\n  --burnt-50: #faac78;\n  --burnt-60: #f09456;\n  --burnt-70: #e08243;\n  --burnt-80: #cc6d2d;\n  --burnt-90: #ad5a23;\n  --burnt-100: #7a3d14;\n\n  --shadow-base: 0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);\n  --shadow-lg: 0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);\n  --active: 0px 1px 3px rgba(0, 15, 153, 0.25), 0px 1px 2px rgba(0, 15, 153, 0.06), 0px 0px 0px 4px #9dc3fc;\n\n  display: block;\n  position: absolute;\n  margin: 0px;\n  padding: 0px 0px 0px 0px;\n  isolation: isolate;\n}\n\n.ls-editor-field-editable {\n  display: block;\n  font-family: inherit;\n  font-size: inherit;\n  overflow: hidden;\n\n  /* no extra spaces */\n  white-space: nowrap;\n  margin: 0;\n  padding: 0px 0px 0px 0px;\n  /* default widths */\n  min-width: 2em;\n  height: 100%;\n  width: 100%;\n}\n\n.ls-editor-field {\n  opacity: 0.7;\n}\n\n.ls-editor-field-editable:focus {\n  outline: none;\n}\n\n.ls-editor-field-draggable {\n  display: block;\n  font-family: inherit;\n  font-size: inherit;\n  overflow: hidden;\n\n  /* no extra spaces */\n  white-space: nowrap;\n\n  /* default widths */\n  min-width: 2px;\n  height: 98%;\n  width: 98%;\n}\n\n/* .is-selected {\n    border: 1px dotted rgb(193, 26, 26);\n} */\n\n.hidden-field {\n  display: none;\n}\n\ninput {\n  all: unset;\n}\n\n.draggable-input {\n  font-family: inherit;\n  font-size: inherit;\n  position: relative;\n  height: 95%;\n  width: 95%;\n}\n\n.editing-input {\n  caret-color: rgb(15 23 42);\n  caret-shape: auto;\n  height: 100%;\n  width: 100%;\n}","import { Component, Host, h, Element, State, Prop, Watch, Listen } from '@stencil/core';\nimport { LSApiElement } from '../../components';\nimport { getInputType } from '../ls-document-viewer/editorUtils';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n  tag: 'ls-editor-field',\n  styleUrl: 'ls-editor-field.css',\n  shadow: true,\n})\nexport class LsEditorField {\n  @Element() component: HTMLElement;\n  @Prop({ mutable: true }) dataItem: LSApiElement;\n  @Prop() selected: boolean;\n  @Prop() readonly: boolean;\n  @Prop() palette: string[];\n  @Prop() type: 'text' | 'signature' | 'date' | 'regex' | 'file' | 'number' | 'autodate';\n  @Prop() page: { height: number; width: number };\n  @State() isEditing: boolean = false;\n  @State() heldEdge: string = null;\n  @State() isEdgeDragging: boolean = false;\n  @State() innerValue: string;\n  private sizeObserver: ResizeObserver;\n\n  @Listen('keydown')\n  handleInput(e: KeyboardEvent) {\n    if (e.code === 'Enter') {\n      this.isEditing = false;\n      this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));\n    }\n  }\n\n  @Listen('mousemove', { capture: true })\n  handleMouseMove(e) {\n    if (this.readonly) return;\n    if (!e.clientX) return;\n\n    // Determine which edge is being moved over and what cursor to show.\n    if (Math.abs(e.offsetX) < 5) {\n      this.component.style.cursor = 'ew-resize';\n    } else if (Math.abs(e.offsetX - this.component.clientWidth) < 5) {\n      this.component.style.cursor = 'ew-resize';\n    } else if (Math.abs(e.offsetY) < 5) {\n      this.component.style.cursor = 'ns-resize';\n    } else if (Math.abs(e.offsetY - this.component.clientHeight) < 5) {\n      this.component.style.cursor = 'ns-resize';\n    } else {\n      this.component.style.cursor = 'move';\n    }\n  }\n\n  @Listen('dblclick', { capture: true })\n  handleDoubleClick() {\n    if (this.readonly) return;\n    this.isEditing = true;\n    this.heldEdge = null;\n    this.isEdgeDragging = false;\n    this.sizeObserver.disconnect();\n    this.innerValue = this.innerValue ? this.innerValue : this.dataItem?.value;\n\n    const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLInputElement;\n    console.log(editbox);\n\n    if (editbox) {\n      editbox.className = 'ls-editor-field-editable';\n      editbox.focus();\n    }\n  }\n\n  @Listen('dragstart', { capture: false, passive: false })\n  handleDragStart(event) {\n    console.log('dragstart ls-editor-field', event, this.type);\n    // Add the target element's id to the data transfer object\n    event.dataTransfer.setData(\n      'application/json',\n      JSON.stringify({\n        type: this.type,\n      }),\n    );\n    event.dataTransfer.dropEffect = 'move';\n  }\n\n  @Watch('selected')\n  watchSelectedHandler(_newValue: boolean, _oldValue: boolean) {\n    if (_newValue) {\n      this.component.style.background = `var(--${this.participantColor(this.dataItem?.signer)}-20)`;\n      this.component.style.opacity = '0.7';\n      this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n    } else {\n      this.component.style.background = 'transparent';\n      this.component.style.boxShadow = 'none';\n    }\n  }\n\n  onInputChange(e) {\n    // console.log(\"INPUT CHANGE\", e);\n    this.innerValue = e.target.value;\n  }\n\n  componentDidLoad() {\n    this.sizeObserver = new ResizeObserver(entries => {\n      for (const entry of entries) {\n        if (entry.contentRect) {\n          //          const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLElement;\n          const movebox = this.component.shadowRoot.getElementById('field-info') as HTMLElement;\n          // console.log(editbox)\n          // editbox.style.height = entry.contentRect.height + \"px\"\n          // editbox.style.width = entry.contentRect.width + \"px\"\n\n          movebox.style.height = entry.contentRect.height + 'px';\n          movebox.style.width = entry.contentRect.width + 'px';\n        }\n      }\n    });\n\n    this.sizeObserver.observe(this.component);\n\n    // New dropped components automatically need selecting.\n    if (this.selected) {\n      this.component.style.background = `var(--${this.participantColor(this.dataItem?.signer)}-20)`;\n      this.component.style.opacity = '0.7';\n      this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n    } else {\n      this.component.style.background = `transparent`;\n      this.component.style.boxShadow = 'none';\n    }\n  }\n\n  participantColor = (index: number) => {\n    return index > 200 ? defaultRolePalette[index - 200] : index > 100 ? defaultRolePalette[index - 100] : defaultRolePalette[index] || defaultRolePalette[0];\n  };\n\n  render() {\n    return (\n      <Host style={{ border: `2px solid var(--${this.participantColor(this.dataItem?.signer)}-60)` }}>\n        <div\n          class={{\n            'ls-editor-field': true,\n            'is-selected': this.selected,\n          }}\n        >\n          <input\n            id=\"editing-input\"\n            class={this.isEditing ? 'ls-editor-field-editable' : 'hidden-field'}\n            type={getInputType(this.dataItem.validation).inputType}\n            value={this.dataItem?.value || this.innerValue}\n            onChange={e => this.onInputChange(e)}\n          />\n          <div id=\"field-info\" class={this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable'}>\n            {this.innerValue || this.dataItem?.label || this.dataItem?.formElementType}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/ls-document-options_37.entry.js

@@ -25057,7 +25057,7 @@ const LsDocumentViewer = class {
 };
 LsDocumentViewer.style = lsDocumentViewerCss;
 
-const lsEditorFieldCss = ":host{display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}";
+const lsEditorFieldCss = ":host{--font-family:'IBM Plex Sans', sans-serif;--text-xs:0.75rem;--text-xs-line-height:1rem;--text-sm:0.875rem;--text-sm-line-height:1.25rem;--text-base:1rem;--text-base-line-height:1.5rem;--text-lg:1.125rem;--text-lg-line-height:1.75rem;--text-xl:1.25rem;--text-xl-line-height:1.75rem;--text-2xl:1.5rem;--text-2xl-line-height:2rem;--text-3xl:1.875rem;--text-3xl-line-height:2.25rem;--text-4xl:2.25rem;--text-4xl-line-height:2.5rem;--text-5xl:3rem;--text-5xl-line-height:1;--text-6xl:3.75rem;--text-6xl-line-height:1;--text-7xl:4.5rem;--text-7xl-line-height:1;--text-9xl:8rem;--text-9xl-line-height:1;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--radius-xs:0.125rem;--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--white:#ffffff;--black:#000000;--pink-10:#fff0f9;--pink-20:#ffe5f5;--pink-30:#fabee2;--pink-40:#f5a2d4;--pink-50:#fa78c6;--pink-60:#f056b2;--pink-70:#e043a2;--pink-80:#cc2d8c;--pink-90:#ad2376;--pink-100:#7a1451;--red-10:#fff0f0;--red-20:#ffe1e0;--red-30:#ffc9c7;--red-40:#ffa19e;--red-50:#ff706b;--red-60:#f64a44;--red-70:#dc2721;--red-80:#c1140e;--red-90:#990500;--red-100:#7a1714;--yellow-10:#fffcef;--yellow-20:#fff3c2;--yellow-30:#fcec9d;--yellow-40:#ffe561;--yellow-50:#fad232;--yellow-60:#f0b618;--yellow-70:#cc8904;--yellow-80:#9e5913;--yellow-90:#8a3f0e;--yellow-100:#70350d;--green-10:#effff9;--green-20:#c5fde8;--green-30:#9df5d4;--green-40:#72f0c2;--green-50:#57e5b1;--green-60:#46dbaa;--green-70:#33b88c;--green-80:#15946a;--green-90:#177559;--green-100:#125241;--teal-10:#effffc;--teal-20:#c5fcf1;--teal-30:#a5fae9;--teal-40:#76f5db;--teal-50:#54ebcd;--teal-60:#46dbbd;--teal-70:#33b8a2;--teal-80:#148f7e;--teal-90:#17756c;--teal-100:#15524c;--cyan-10:#efffff;--cyan-20:#c5fcfc;--cyan-30:#a0fafa;--cyan-40:#76f5f5;--cyan-50:#54ebeb;--cyan-60:#46dbdb;--cyan-70:#33b3b8;--cyan-80:#11868f;--cyan-90:#166a70;--cyan-100:#11474d;--lightblue-10:#effbff;--lightblue-20:#c7f1ff;--lightblue-30:#9de4fc;--lightblue-40:#79dbfc;--lightblue-50:#51d3ff;--lightblue-60:#48c5f0;--lightblue-70:#20a6d6;--lightblue-80:#0b80b2;--lightblue-90:#19648a;--lightblue-100:#0c3e57;--blue-10:#f0f6ff;--blue-20:#e0ecff;--blue-30:#bed4fa;--blue-40:#a2bdf5;--blue-50:#78a3fa;--blue-60:#5684f0;--blue-70:#4368e0;--blue-80:#2d4dcc;--blue-90:#233ead;--blue-100:#14287a;--purple-10:#f4f0ff;--purple-20:#eee5ff;--purple-30:#d6befa;--purple-40:#c6a2f5;--purple-50:#b078fa;--purple-60:#9956f0;--purple-70:#8743e0;--purple-80:#722dcc;--purple-90:#5f23ad;--purple-100:#40147a;--primary-10:#eff4ff;--primary-20:#c7ddff;--primary-30:#9dc3fc;--primary-40:#79adfc;--primary-50:#5185ff;--primary-60:#4456f6;--primary-70:#2134dc;--primary-80:#0e20c1;--primary-90:#000f99;--primary-100:#0c1457;--gray-10:#f7f8fa;--gray-20:#edeff2;--gray-30:#e0e2e5;--gray-40:#d8d9dc;--gray-50:#c8c9cc;--gray-60:#afb0b2;--gray-70:#939599;--gray-80:#6f7176;--gray-90:#5e6066;--gray-100:#45484d;--gray-110:#292c33;--gray-120:#151923;--gray-130:#0c1019;--gray-140:#05080d;--aubergine-10:#fcf0ff;--aubergine-20:#fae5ff;--aubergine-30:#eebefa;--aubergine-40:#e4a2f5;--aubergine-50:#e078fa;--aubergine-60:#d156f0;--aubergine-70:#c143e0;--aubergine-80:#ac2dcc;--aubergine-90:#9223ad;--aubergine-100:#66147a;--indigo-10:#f2f0ff;--indigo-20:#e9e5ff;--indigo-30:#c6befa;--indigo-40:#ada2f5;--indigo-50:#8978fa;--indigo-60:#6b56f0;--indigo-70:#5843e0;--indigo-80:#422dcc;--indigo-90:#3523ad;--indigo-100:#21147a;--lime-10:#fafff0;--lime-20:#f6ffe5;--lime-30:#e6fabe;--lime-40:#d9f5a2;--lime-50:#cffa78;--lime-60:#bdf056;--lime-70:#ace043;--lime-80:#97cc2d;--lime-90:#7fad23;--lime-100:#587a14;--trueGreen-10:#f0fff0;--trueGreen-20:#e5ffe5;--trueGreen-30:#befabe;--trueGreen-40:#a2f5a2;--trueGreen-50:#78fa78;--trueGreen-60:#56f056;--trueGreen-70:#43e043;--trueGreen-80:#2dcc2d;--trueGreen-90:#23ad23;--trueGreen-100:#147a14;--burnt-10:#fff6f0;--burnt-20:#fff0e5;--burnt-30:#fad6be;--burnt-40:#f5c3a2;--burnt-50:#faac78;--burnt-60:#f09456;--burnt-70:#e08243;--burnt-80:#cc6d2d;--burnt-90:#ad5a23;--burnt-100:#7a3d14;--shadow-base:0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);--shadow-lg:0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);--active:0px 1px 3px rgba(0, 15, 153, 0.25), 0px 1px 2px rgba(0, 15, 153, 0.06), 0px 0px 0px 4px #9dc3fc;display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}";
 
 const LsEditorField = class {
     constructor(hostRef) {