legalesign-document-viewer 0.3.5 → 0.3.7

package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.css

@@ -0,0 +1,302 @@
+: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%;
+}
+
+/* Global Styles */
+
+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);
+}

package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js

@@ -0,0 +1,48 @@
+import { Host, h } from "@stencil/core";
+export class LsFieldPropertiesDate {
+    dataItem;
+    render() {
+        return (h(Host, { key: 'a66a5bc1933fee5a910c34677a6147b86c737ca4' }, h("ls-field-properties-container", { key: 'f57bfe0b3e45712f8224fdf749d5fd507d9e1f27', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: '17d227b74a594b7ae703cc7c257a792251ec1161', class: 'field-set', slot: "content" }, h("ls-field-content", { key: 'f66832002000c7295cddb2c221b2327627fea837', dataItem: this.dataItem }), h("ls-field-properties-advanced", { key: '82c2ffcaa8f27ef40357c69ef45cd6f069a871f2', dataItem: this.dataItem })), h("div", { key: '0e352209c050ba1a26505a10838a85499cb8151e', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: '3a7969955a9e655f1b15d39bae9515ac7427e0dd', dataItem: this.dataItem })), h("div", { key: '675e2643f49817a39894d9a6656d14b80eec2093', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: '5d5d396a27a8872a0c6e1cc9d1fa5b80d6ed9f2e', dataItem: this.dataItem }))), h("ls-field-footer", { key: '28e346b537e4dda1e0ac610685f9afd142733770', dataItem: this.dataItem })));
+    }
+    static get is() { return "ls-field-properties-date"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["ls-field-properties-date.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["ls-field-properties-date.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "dataItem": {
+                "type": "unknown",
+                "attribute": "data-item",
+                "mutable": false,
+                "complexType": {
+                    "original": "LSApiElement",
+                    "resolved": "{ id: string; align: string; ax?: number; ay?: number; bx?: number; by?: number; left?: number; top?: number; height?: number; width?: number; elementType: string; fieldOrder?: number; fontName: string; fontSize: number; hideBorder?: boolean; label?: string; labelExtra?: string; helpText?: string; optional?: boolean; options?: string; page?: number; role?: LSApiRole; substantive?: boolean; validation?: number; value?: string; logicGroup?: string; logicAction?: number; mapTo?: string; signer: number; link?: string; formElementType?: \"number\" | \"image\" | \"text\" | \"signature\" | \"date\" | \"regex\" | \"file\" | \"autodate\" | \"autosign\" | \"initials\" | \"email\" | \"checkbox\" | \"dropdown\"; roleObject?: LSApiRole; cstyle?: any; divStyle?: any; objectHeight?: string; pageDimensions?: { height: number; width: number; }; templateId?: string; }",
+                    "references": {
+                        "LSApiElement": {
+                            "location": "import",
+                            "path": "../../components",
+                            "id": "src/components.d.ts::LSApiElement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=ls-field-properties-date.js.map

package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ls-field-properties-date.js","sourceRoot":"","sources":["../../../src/components/ls-field-properties-date/ls-field-properties-date.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,qBAAqB;IACxB,QAAQ,CAAe;IAE/B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,sFAA+B,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC;gBACzE,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,SAAS;oBACrC,yEAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI;oBAC7C,qFAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACrD;gBACN,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,YAAY;oBACxC,4EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5C;gBACN,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,WAAW;oBACvC,2EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC3C,CACwB;YAChC,wEAAiB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACvC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-date',\n  styleUrl: 'ls-field-properties-date.css',\n  shadow: true,\n})\nexport class LsFieldPropertiesDate {\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"]}

package/dist/collection/components/ls-field-properties-dropdown/ls-field-properties-dropdown.css

@@ -0,0 +1,3 @@
+:host {
+  display: block;
+}

package/dist/collection/components/ls-field-properties-dropdown/ls-field-properties-dropdown.js

@@ -0,0 +1,48 @@
+import { Host, h } from "@stencil/core";
+export class LsFieldPropertiesDropdown {
+    dataItem;
+    render() {
+        return (h(Host, { key: 'a87eaed9f4598203388c83a0955cdd4c00b779d5' }, h("ls-field-properties-container", { key: 'aebc4e4b1adccce9f0caeffd34a505baeb273feb', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: '19faac072d0688638d09521d273e97dbf1d9cb6c', class: 'field-set', slot: "content" }, h("ls-field-content", { key: '156d5270ecb24a5d3e7d02ac7848075440f13130', dataItem: this.dataItem }), h("ls-field-properties-advanced", { key: '5bb0d2f292b311f759a45ecc681154061b74a762', dataItem: this.dataItem })), h("div", { key: 'd34a829edf09efd7d6ec1aa6f6f22adbd34ff76e', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: 'e27301a0bb1ec9f88fd0b8bd9311f851635a2f1b', dataItem: this.dataItem })), h("div", { key: 'f376b48c4db4cd0ccb3f61802ecdc5d592ac1343', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: '7f23a3c6a778d054a657214cb1581eb3503c8066', dataItem: this.dataItem }))), h("ls-field-footer", { key: '65e316b9d068a41c9900135996c22d9d54d88c7d', dataItem: this.dataItem })));
+    }
+    static get is() { return "ls-field-properties-dropdown"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["ls-field-properties-dropdown.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["ls-field-properties-dropdown.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "dataItem": {
+                "type": "unknown",
+                "attribute": "data-item",
+                "mutable": false,
+                "complexType": {
+                    "original": "LSApiElement",
+                    "resolved": "{ id: string; align: string; ax?: number; ay?: number; bx?: number; by?: number; left?: number; top?: number; height?: number; width?: number; elementType: string; fieldOrder?: number; fontName: string; fontSize: number; hideBorder?: boolean; label?: string; labelExtra?: string; helpText?: string; optional?: boolean; options?: string; page?: number; role?: LSApiRole; substantive?: boolean; validation?: number; value?: string; logicGroup?: string; logicAction?: number; mapTo?: string; signer: number; link?: string; formElementType?: \"number\" | \"image\" | \"text\" | \"signature\" | \"date\" | \"regex\" | \"file\" | \"autodate\" | \"autosign\" | \"initials\" | \"email\" | \"checkbox\" | \"dropdown\"; roleObject?: LSApiRole; cstyle?: any; divStyle?: any; objectHeight?: string; pageDimensions?: { height: number; width: number; }; templateId?: string; }",
+                    "references": {
+                        "LSApiElement": {
+                            "location": "import",
+                            "path": "../../components",
+                            "id": "src/components.d.ts::LSApiElement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=ls-field-properties-dropdown.js.map

package/dist/collection/components/ls-field-properties-dropdown/ls-field-properties-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ls-field-properties-dropdown.js","sourceRoot":"","sources":["../../../src/components/ls-field-properties-dropdown/ls-field-properties-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,yBAAyB;IAC5B,QAAQ,CAAe;IAE/B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,sFAA+B,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC;gBACzE,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,SAAS;oBACrC,yEAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI;oBAC7C,qFAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACrD;gBACN,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,YAAY;oBACxC,4EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5C;gBACN,4DAAK,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,WAAW;oBACvC,2EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC3C,CACwB;YAChC,wEAAiB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CACvC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-dropdown',\n  styleUrl: 'ls-field-properties-dropdown.css',\n  shadow: true,\n})\nexport class LsFieldPropertiesDropdown {\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"]}