@verdocs/web-sdk 6.8.6 → 6.8.7

package/dist/components/p-eZKhg-2i.js

@@ -0,0 +1,156 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CUAGH_8P.js';
+import { VerdocsEndpoint, getTemplate } from '@verdocs/js-sdk';
+import { S as SDKError } from './p-C1sRVZWv.js';
+import { S as Store } from './p-bS8INhRF.js';
+import { d as defineCustomElement$2 } from './p-CdmWI0-q.js';
+import { d as defineCustomElement$1 } from './p-CNKACBaL.js';
+
+const verdocsTemplateBuildTabsCss = "verdocs-template-build-tabs{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end;-ms-flex:0 0 50px;flex:0 0 50px;width:100%;background:#ffffff;color:#72757d;border-bottom:1px solid #dddddd;-webkit-filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));font-family:var(--verdocs-primary-font, \"Inter\", \"Barlow\", sans-serif)}verdocs-template-build-tabs .tab{position:relative;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:50px;padding:0 4px;background:#e7e7e7;font-weight:700;font-size:12px;cursor:pointer}@media (min-width: 768px){verdocs-template-build-tabs .tab{padding:0 8px 0 24px;font-size:14px}}verdocs-template-build-tabs .tab svg{position:absolute;top:0;right:-19px;z-index:10;pointer-events:none;display:none}@media (min-width: 768px){verdocs-template-build-tabs .tab svg{display:block}}verdocs-template-build-tabs .tab.active{background:#ffffff;color:#707ae5}verdocs-template-build-tabs .tab.disabled{cursor:default;color:#d1d5db}";
+
+const VerdocsTemplateBuildTabs = /*@__PURE__*/ proxyCustomElement(class VerdocsTemplateBuildTabs extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.sdkError = createEvent(this, "sdkError");
+        this.stepChanged = createEvent(this, "stepChanged");
+        this.templateListenerId = null;
+        /**
+         * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.
+         */
+        this.endpoint = VerdocsEndpoint.getDefault();
+        /**
+         * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.
+         * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.
+         * If it is not specified, `step` will be ignored and the create step will be shown.
+         */
+        this.templateId = null;
+        /**
+         * The step in the creation process to display.
+         */
+        this.step = 'preview';
+        this.loading = true;
+        this.template = null;
+    }
+    disconnectedCallback() {
+        this.unlistenToTemplate();
+    }
+    async listenToTemplate() {
+        this.unlistenToTemplate();
+        Store.subscribe('templates', this.templateId, () => getTemplate(this.endpoint, this.templateId), false, (template) => {
+            this.template = template;
+            this.loading = false;
+        });
+    }
+    unlistenToTemplate() {
+        if (this.templateListenerId) {
+            Store.store.delListener(this.templateListenerId);
+            this.templateListenerId = null;
+        }
+    }
+    onTemplateIdChanged(newTemplateId) {
+        console.log('[BUILD_TABS] Template ID changed', newTemplateId);
+        this.listenToTemplate();
+    }
+    onStepChanged(newStep) {
+        console.log('[BUILD_TABS] Step changed', newStep);
+    }
+    async componentWillLoad() {
+        var _a, _b, _c;
+        try {
+            this.endpoint.loadSession();
+            if (!this.endpoint.session) {
+                console.log('[BUILD_TABS] Unable to start builder session, must be authenticated');
+                return;
+            }
+            if (!this.templateId) {
+                this.step = 'attachments';
+                console.log('[BUILD_TABS] Missing required template ID, forcing view to attachments');
+                return;
+            }
+            this.listenToTemplate();
+        }
+        catch (e) {
+            console.log('[BUILD_TABS] Error loading template', e);
+            (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
+        }
+    }
+    handleSelect(tab) {
+        var _a;
+        if (tab.disabled || tab.id === this.step) {
+            return;
+        }
+        this.step = tab.id;
+        (_a = this.stepChanged) === null || _a === void 0 ? void 0 : _a.emit(tab.id);
+    }
+    render() {
+        var _a, _b, _c;
+        if (this.loading) {
+            return (h(Host, null, h("verdocs-loader", null)));
+        }
+        if (!this.endpoint.session) {
+            return (h(Host, null, h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
+        }
+        const canEditRoles = (((_a = this.template) === null || _a === void 0 ? void 0 : _a.documents) || []).length > 0;
+        const canEditFields = canEditRoles && (((_b = this.template) === null || _b === void 0 ? void 0 : _b.roles) || []).length > 0;
+        const canPreview = canEditFields && (((_c = this.template) === null || _c === void 0 ? void 0 : _c.fields) || []).length > 0;
+        const tabs = [
+            { id: 'attachments', label: 'Attachments', disabled: false },
+            { id: 'roles', label: 'Workflow', disabled: !canEditRoles },
+            { id: 'fields', label: 'Fields', disabled: !canEditFields },
+            { id: 'preview', label: 'Preview & Send', disabled: !canPreview },
+        ];
+        return (h(Host, null, tabs.map(tab => {
+            const isActive = tab.id === this.step;
+            const classes = ['tab'];
+            if (isActive)
+                classes.push('active');
+            if (tab.disabled)
+                classes.push('disabled');
+            return (h("div", { class: classes.join(' '), onClick: () => this.handleSelect(tab) }, h("span", null, tab.label), h("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", width: "19", height: "50", viewBox: "0 0 19 50" }, h("polygon", { points: "0,0 19,25 0,50", fill: isActive ? '#ffffff' : '#e7e7e7' }))));
+        })));
+    }
+    static get watchers() { return {
+        "templateId": ["onTemplateIdChanged"],
+        "step": ["onStepChanged"]
+    }; }
+    static get style() { return verdocsTemplateBuildTabsCss; }
+}, [256, "verdocs-template-build-tabs", {
+        "endpoint": [16],
+        "templateId": [1537, "template-id"],
+        "step": [1537],
+        "loading": [32],
+        "template": [32]
+    }, undefined, {
+        "templateId": ["onTemplateIdChanged"],
+        "step": ["onStepChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["verdocs-template-build-tabs", "verdocs-component-error", "verdocs-loader"];
+    components.forEach(tagName => { switch (tagName) {
+        case "verdocs-template-build-tabs":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, VerdocsTemplateBuildTabs);
+            }
+            break;
+        case "verdocs-component-error":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "verdocs-loader":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { VerdocsTemplateBuildTabs as V, defineCustomElement as d };
+//# sourceMappingURL=p-eZKhg-2i.js.map
+
+//# sourceMappingURL=p-eZKhg-2i.js.map

package/dist/components/p-eZKhg-2i.js.map

@@ -0,0 +1 @@
+{"file":"p-eZKhg-2i.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.scss?tag=verdocs-template-build-tabs","src/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-build-tabs {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-end;\n  flex: 0 0 50px;\n  width: 100%;\n  background: #ffffff;\n  color: #72757d;\n  border-bottom: 1px solid #dddddd;\n  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));\n  font-family: $verdocs-primary-font;\n\n  .tab {\n    position: relative;\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n    height: 50px;\n    padding: 0 4px;\n    background: #e7e7e7;\n    font-weight: 700;\n    font-size: 12px;\n    cursor: pointer;\n\n    @media (min-width: 768px) {\n      padding: 0 8px 0 24px;\n      font-size: 14px;\n    }\n\n    svg {\n      position: absolute;\n      top: 0;\n      right: -19px;\n      z-index: 10;\n      pointer-events: none;\n      display: none;\n\n      @media (min-width: 768px) {\n        display: block;\n      }\n    }\n\n    &.active {\n      background: #ffffff;\n      color: #707ae5;\n    }\n\n    &.disabled {\n      cursor: default;\n      color: #d1d5db;\n    }\n  }\n}\n","import {getTemplate, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Event, EventEmitter, Host, Watch, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nexport type TVerdocsBuildStep = 'attachments' | 'roles' | 'fields' | 'preview';\n\ninterface IBuildTab {\n  id: TVerdocsBuildStep;\n  label: string;\n  disabled: boolean;\n}\n\n/**\n * Display a set of tabs for the template builder.\n */\n@Component({\n  tag: 'verdocs-template-build-tabs',\n  styleUrl: 'verdocs-template-build-tabs.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateBuildTabs {\n  private templateListenerId = null;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\n   * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\n   * If it is not specified, `step` will be ignored and the create step will be shown.\n   */\n  @Prop({reflect: true, mutable: true}) templateId: string | null = null;\n\n  /**\n   * The step in the creation process to display.\n   */\n  @Prop({reflect: true, mutable: true}) step: TVerdocsBuildStep = 'preview';\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the user selects a different step.\n   */\n  @Event({composed: true}) stepChanged: EventEmitter<TVerdocsBuildStep>;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  disconnectedCallback() {\n    this.unlistenToTemplate();\n  }\n\n  async listenToTemplate() {\n    this.unlistenToTemplate();\n    Store.subscribe(\n      'templates',\n      this.templateId,\n      () => getTemplate(this.endpoint, this.templateId),\n      false,\n      (template: ITemplate) => {\n        this.template = template;\n        this.loading = false;\n      },\n    );\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  @Watch('templateId')\n  onTemplateIdChanged(newTemplateId: string) {\n    console.log('[BUILD_TABS] Template ID changed', newTemplateId);\n    this.listenToTemplate();\n  }\n\n  @Watch('step')\n  onStepChanged(newStep: TVerdocsBuildStep) {\n    console.log('[BUILD_TABS] Step changed', newStep);\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n      if (!this.endpoint.session) {\n        console.log('[BUILD_TABS] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      if (!this.templateId) {\n        this.step = 'attachments';\n        console.log('[BUILD_TABS] Missing required template ID, forcing view to attachments');\n        return;\n      }\n\n      this.listenToTemplate();\n    } catch (e) {\n      console.log('[BUILD_TABS] Error loading template', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  handleSelect(tab: IBuildTab) {\n    if (tab.disabled || tab.id === this.step) {\n      return;\n    }\n    this.step = tab.id;\n    this.stepChanged?.emit(tab.id);\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host>\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    if (!this.endpoint.session) {\n      return (\n        <Host>\n          <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n        </Host>\n      );\n    }\n\n    const canEditRoles = (this.template?.documents || []).length > 0;\n    const canEditFields = canEditRoles && (this.template?.roles || []).length > 0;\n    const canPreview = canEditFields && (this.template?.fields || []).length > 0;\n\n    const tabs: IBuildTab[] = [\n      {id: 'attachments', label: 'Attachments', disabled: false},\n      {id: 'roles', label: 'Workflow', disabled: !canEditRoles},\n      {id: 'fields', label: 'Fields', disabled: !canEditFields},\n      {id: 'preview', label: 'Preview & Send', disabled: !canPreview},\n    ];\n\n    return (\n      <Host>\n        {tabs.map(tab => {\n          const isActive = tab.id === this.step;\n          const classes = ['tab'];\n          if (isActive) classes.push('active');\n          if (tab.disabled) classes.push('disabled');\n          return (\n            <div class={classes.join(' ')} onClick={() => this.handleSelect(tab)}>\n              <span>{tab.label}</span>\n              <svg aria-hidden=\"true\" xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"50\" viewBox=\"0 0 19 50\">\n                <polygon points=\"0,0 19,25 0,50\" fill={isActive ? '#ffffff' : '#e7e7e7'} />\n              </svg>\n            </div>\n          );\n        })}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/verdocs-build.js

@@ -2,49 +2,45 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
 import { VerdocsEndpoint, getTemplate } from '@verdocs/js-sdk';
 import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-bS8INhRF.js';
-import { d as defineCustomElement$G } from './p-C_yyK5xE.js';
-import { d as defineCustomElement$F } from './p-rboJNAPD.js';
-import { d as defineCustomElement$E } from './p-BvV9rOTP.js';
-import { d as defineCustomElement$D } from './p-CdmWI0-q.js';
-import { d as defineCustomElement$C } from './p-tSwumenv.js';
-import { d as defineCustomElement$B } from './p-Ba_mXs1J.js';
-import { d as defineCustomElement$A } from './p-CjDMm6od.js';
-import { d as defineCustomElement$z } from './p-CFi6VKgU.js';
-import { d as defineCustomElement$y } from './p-DzM2oGUr.js';
-import { d as defineCustomElement$x } from './p-BZRJWqKI.js';
-import { d as defineCustomElement$w } from './p-Dj_oFCRK.js';
-import { d as defineCustomElement$v } from './p-By2QlfRC.js';
-import { d as defineCustomElement$u } from './p-DLV8jNf8.js';
-import { d as defineCustomElement$t } from './p-CWGxLuye.js';
-import { d as defineCustomElement$s } from './p-Bafj7hI1.js';
-import { d as defineCustomElement$r } from './p-tyY7kKNB.js';
-import { d as defineCustomElement$q } from './p-mFB74--W.js';
-import { d as defineCustomElement$p } from './p-BC5N3FIA.js';
-import { d as defineCustomElement$o } from './p-CnPaJH5T.js';
-import { d as defineCustomElement$n } from './p-CNKACBaL.js';
-import { d as defineCustomElement$m } from './p-C4BOQLSR.js';
-import { d as defineCustomElement$l } from './p-o9BQIoXw.js';
-import { d as defineCustomElement$k } from './p-DUYRis3A.js';
-import { d as defineCustomElement$j } from './p-CYRfkDZa.js';
-import { d as defineCustomElement$i } from './p-DzEqts-G.js';
-import { d as defineCustomElement$h } from './p-C1AtapGD.js';
-import { d as defineCustomElement$g } from './p-D1tvdWaA.js';
-import { d as defineCustomElement$f } from './p-lE3_dyeh.js';
-import { d as defineCustomElement$e } from './p-j7Gj43ri.js';
-import { d as defineCustomElement$d } from './p-e7e4Os6T.js';
-import { d as defineCustomElement$c } from './p-C5fwD53I.js';
-import { d as defineCustomElement$b } from './p-hDK3S4nn.js';
-import { d as defineCustomElement$a } from './p-DmyvK-Tr.js';
-import { d as defineCustomElement$9 } from './p-Cal5IvqT.js';
-import { d as defineCustomElement$8 } from './p-BYDdRCru.js';
-import { d as defineCustomElement$7 } from './p-CherENoi.js';
-import { d as defineCustomElement$6 } from './p-DaWDoIag.js';
-import { d as defineCustomElement$5 } from './p-Cp7g7TMK.js';
+import { d as defineCustomElement$C } from './p-C_yyK5xE.js';
+import { d as defineCustomElement$B } from './p-BvV9rOTP.js';
+import { d as defineCustomElement$A } from './p-CdmWI0-q.js';
+import { d as defineCustomElement$z } from './p-tSwumenv.js';
+import { d as defineCustomElement$y } from './p-Ba_mXs1J.js';
+import { d as defineCustomElement$x } from './p-CjDMm6od.js';
+import { d as defineCustomElement$w } from './p-CFi6VKgU.js';
+import { d as defineCustomElement$v } from './p-DzM2oGUr.js';
+import { d as defineCustomElement$u } from './p-BZRJWqKI.js';
+import { d as defineCustomElement$t } from './p-Dj_oFCRK.js';
+import { d as defineCustomElement$s } from './p-By2QlfRC.js';
+import { d as defineCustomElement$r } from './p-DLV8jNf8.js';
+import { d as defineCustomElement$q } from './p-CWGxLuye.js';
+import { d as defineCustomElement$p } from './p-Bafj7hI1.js';
+import { d as defineCustomElement$o } from './p-tyY7kKNB.js';
+import { d as defineCustomElement$n } from './p-mFB74--W.js';
+import { d as defineCustomElement$m } from './p-BC5N3FIA.js';
+import { d as defineCustomElement$l } from './p-CnPaJH5T.js';
+import { d as defineCustomElement$k } from './p-CNKACBaL.js';
+import { d as defineCustomElement$j } from './p-C4BOQLSR.js';
+import { d as defineCustomElement$i } from './p-o9BQIoXw.js';
+import { d as defineCustomElement$h } from './p-DUYRis3A.js';
+import { d as defineCustomElement$g } from './p-CYRfkDZa.js';
+import { d as defineCustomElement$f } from './p-DzEqts-G.js';
+import { d as defineCustomElement$e } from './p-C1AtapGD.js';
+import { d as defineCustomElement$d } from './p-D1tvdWaA.js';
+import { d as defineCustomElement$c } from './p-lE3_dyeh.js';
+import { d as defineCustomElement$b } from './p-C5fwD53I.js';
+import { d as defineCustomElement$a } from './p-eZKhg-2i.js';
+import { d as defineCustomElement$9 } from './p-DmyvK-Tr.js';
+import { d as defineCustomElement$8 } from './p-Cal5IvqT.js';
+import { d as defineCustomElement$7 } from './p-_cxVjdiK.js';
+import { d as defineCustomElement$6 } from './p-CherENoi.js';
+import { d as defineCustomElement$5 } from './p-DaWDoIag.js';
 import { d as defineCustomElement$4 } from './p--qy4LrSt.js';
 import { d as defineCustomElement$3 } from './p-xrtrbzOw.js';
 import { d as defineCustomElement$2 } from './p-DmEw4Bbl.js';
 
-const verdocsBuildCss = "verdocs-build{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--verdocs-primary-font, \"Inter\", \"Barlow\", sans-serif)}verdocs-build .content{-ms-flex:1;flex:1;gap:20px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column}verdocs-build verdocs-template-attachments,verdocs-build verdocs-template-roles{margin:20px}verdocs-build verdocs-template-fields{border-top:1px solid #777777}verdocs-build verdocs-template-attachments{padding:20px;background:#ffffff}verdocs-build verdocs-template-fields{width:100%}verdocs-build verdocs-preview{-ms-flex:1;flex:1}verdocs-build .preview-container{-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;width:100%;background-color:#eeeeee;max-height:100%}@media all and (max-width: 450px){verdocs-build .preview-container{-ms-flex-direction:column;flex-direction:column}}verdocs-build .preview-send-wrapper{display:-ms-flexbox;display:flex;-ms-flex:0 0 300px;flex:0 0 300px;background-color:#ffffff;-webkit-box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157);box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157)}@media all and (max-width: 450px){verdocs-build .preview-send-wrapper{-ms-flex:0;flex:0}}verdocs-build .preview-preview-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;overflow-y:scroll}";
+const verdocsBuildCss = "verdocs-build{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--verdocs-primary-font, \"Inter\", \"Barlow\", sans-serif)}verdocs-build .content{-ms-flex:1;flex:1;gap:20px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column}verdocs-build verdocs-template-attachments,verdocs-build verdocs-template-roles{display:block;width:500px;max-width:95%;-webkit-box-sizing:border-box;box-sizing:border-box;margin:20px}verdocs-build verdocs-template-fields{border-top:1px solid #777777}verdocs-build verdocs-template-attachments{padding:20px;background:#ffffff}verdocs-build verdocs-template-fields{width:100%}verdocs-build verdocs-preview{-ms-flex:1;flex:1}verdocs-build .preview-container{-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;width:100%;background-color:#eeeeee;max-height:100%}@media all and (max-width: 450px){verdocs-build .preview-container{-ms-flex-direction:column;flex-direction:column}}verdocs-build .preview-send-wrapper{display:-ms-flexbox;display:flex;-ms-flex:0 0 300px;flex:0 0 300px;background-color:#ffffff;-webkit-box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157);box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157)}@media all and (max-width: 450px){verdocs-build .preview-send-wrapper{-ms-flex:0;flex:0}}verdocs-build .preview-preview-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;overflow-y:scroll}";
 
 const VerdocsBuild$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsBuild extends H {
     constructor(registerHost) {
@@ -147,10 +143,12 @@ const VerdocsBuild$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsBuild exten
     }
     async handleRolesUpdated(e) {
         var _a;
+        console.log('[BUILD] Roloes updated', e);
         (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
     }
     async handleTemplateUpdated(e) {
         var _a;
+        console.log('[BUILD] Template updated', e);
         (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
     }
     handleAttachmentsNext() {
@@ -175,7 +173,7 @@ const VerdocsBuild$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsBuild exten
         if (!this.endpoint.session) {
             return (h(Host, null, h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
         }
-        return (h(Host, null, h("div", { class: "content" }, h("verdocs-template-build-tabs", { endpoint: this.endpoint, templateId: this.templateId, step: this.step, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, onStepChanged: e => this.handleStepChanged(e.detail) }), this.step === 'attachments' && (h("verdocs-template-attachments", { templateId: this.templateId, endpoint: this.endpoint, onExit: () => this.handleCancel(), onNext: () => this.handleAttachmentsNext(), onTemplateUpdated: e => this.handleTemplateUpdated(e) })), this.step === 'roles' && (h("verdocs-template-roles", { templateId: this.templateId, endpoint: this.endpoint, onExit: () => this.handleCancel(), onNext: () => this.handleRolesNext(), onRolesUpdated: e => this.handleRolesUpdated(e) })), this.step === 'settings' && h("verdocs-template-settings", { templateId: this.templateId, endpoint: this.endpoint, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), this.step === 'fields' && h("verdocs-template-fields", { templateId: this.templateId, endpoint: this.endpoint, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), this.step === 'preview' && (h("div", { class: "preview-container" }, h("div", { class: "preview-send-wrapper" }, h("verdocs-send", { templateId: this.templateId, endpoint: this.endpoint, onSend: e => { var _a; return (_a = this.send) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, style: { width: '100%' } })), h("div", { class: "preview-preview-wrapper" }, h("verdocs-preview", { templateId: this.templateId, endpoint: this.endpoint, style: { display: 'flex', flex: '1', maxWidth: '1000px' } })))))));
+        return (h(Host, null, h("div", { class: "content" }, h("verdocs-template-build-tabs", { endpoint: this.endpoint, templateId: this.templateId, step: this.step, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, onStepChanged: e => this.handleStepChanged(e.detail) }), this.step === 'attachments' && (h("verdocs-template-attachments", { templateId: this.templateId, endpoint: this.endpoint, onExit: () => this.handleCancel(), onNext: () => this.handleAttachmentsNext(), onTemplateUpdated: e => this.handleTemplateUpdated(e) })), this.step === 'roles' && (h("verdocs-template-roles", { templateId: this.templateId, endpoint: this.endpoint, onExit: () => this.handleCancel(), onNext: () => this.handleRolesNext(), onRolesUpdated: e => this.handleRolesUpdated(e) })), this.step === 'fields' && h("verdocs-template-fields", { templateId: this.templateId, endpoint: this.endpoint, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), this.step === 'preview' && (h("div", { class: "preview-container" }, h("div", { class: "preview-send-wrapper" }, h("verdocs-send", { templateId: this.templateId, endpoint: this.endpoint, onSend: e => { var _a; return (_a = this.send) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, style: { width: '100%' } })), h("div", { class: "preview-preview-wrapper" }, h("verdocs-preview", { templateId: this.templateId, endpoint: this.endpoint, style: { display: 'flex', flex: '1', maxWidth: '1000px' } })))))));
     }
     get el() { return this; }
     static get watchers() { return {
@@ -197,7 +195,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-build", "verdocs-button", "verdocs-button-panel", "verdocs-checkbox", "verdocs-component-error", "verdocs-contact-picker", "verdocs-dialog", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-file-chooser", "verdocs-flag", "verdocs-help-icon", "verdocs-loader", "verdocs-menu-panel", "verdocs-ok-dialog", "verdocs-portal", "verdocs-preview", "verdocs-progress-bar", "verdocs-select-input", "verdocs-send", "verdocs-spinner", "verdocs-switch", "verdocs-tabs", "verdocs-template-attachments", "verdocs-template-build-tabs", "verdocs-template-document-page", "verdocs-template-field-properties", "verdocs-template-fields", "verdocs-template-role-properties", "verdocs-template-roles", "verdocs-template-settings", "verdocs-text-input", "verdocs-toolbar-icon", "verdocs-upload-dialog"];
+    const components = ["verdocs-build", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-contact-picker", "verdocs-dialog", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-file-chooser", "verdocs-flag", "verdocs-help-icon", "verdocs-loader", "verdocs-menu-panel", "verdocs-ok-dialog", "verdocs-portal", "verdocs-preview", "verdocs-progress-bar", "verdocs-select-input", "verdocs-send", "verdocs-spinner", "verdocs-template-attachments", "verdocs-template-build-tabs", "verdocs-template-document-page", "verdocs-template-field-properties", "verdocs-template-fields", "verdocs-template-role-properties", "verdocs-template-roles", "verdocs-text-input", "verdocs-toolbar-icon", "verdocs-upload-dialog"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-build":
             if (!customElements.get(tagName)) {
@@ -205,191 +203,171 @@ function defineCustomElement$1() {
             }
             break;
         case "verdocs-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$G();
-            }
-            break;
-        case "verdocs-button-panel":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$F();
-            }
-            break;
-        case "verdocs-checkbox":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$E();
-            }
-            break;
-        case "verdocs-component-error":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$D();
-            }
-            break;
-        case "verdocs-contact-picker":
             if (!customElements.get(tagName)) {
                 defineCustomElement$C();
             }
             break;
-        case "verdocs-dialog":
+        case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$B();
             }
             break;
-        case "verdocs-field-attachment":
+        case "verdocs-component-error":
             if (!customElements.get(tagName)) {
                 defineCustomElement$A();
             }
             break;
-        case "verdocs-field-checkbox":
+        case "verdocs-contact-picker":
             if (!customElements.get(tagName)) {
                 defineCustomElement$z();
             }
             break;
-        case "verdocs-field-date":
+        case "verdocs-dialog":
             if (!customElements.get(tagName)) {
                 defineCustomElement$y();
             }
             break;
-        case "verdocs-field-dropdown":
+        case "verdocs-field-attachment":
             if (!customElements.get(tagName)) {
                 defineCustomElement$x();
             }
             break;
-        case "verdocs-field-initial":
+        case "verdocs-field-checkbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$w();
             }
             break;
-        case "verdocs-field-radio":
+        case "verdocs-field-date":
             if (!customElements.get(tagName)) {
                 defineCustomElement$v();
             }
             break;
-        case "verdocs-field-signature":
+        case "verdocs-field-dropdown":
             if (!customElements.get(tagName)) {
                 defineCustomElement$u();
             }
             break;
-        case "verdocs-field-textarea":
+        case "verdocs-field-initial":
             if (!customElements.get(tagName)) {
                 defineCustomElement$t();
             }
             break;
-        case "verdocs-field-textbox":
+        case "verdocs-field-radio":
             if (!customElements.get(tagName)) {
                 defineCustomElement$s();
             }
             break;
-        case "verdocs-field-timestamp":
+        case "verdocs-field-signature":
             if (!customElements.get(tagName)) {
                 defineCustomElement$r();
             }
             break;
-        case "verdocs-file-chooser":
+        case "verdocs-field-textarea":
             if (!customElements.get(tagName)) {
                 defineCustomElement$q();
             }
             break;
-        case "verdocs-flag":
+        case "verdocs-field-textbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$p();
             }
             break;
-        case "verdocs-help-icon":
+        case "verdocs-field-timestamp":
             if (!customElements.get(tagName)) {
                 defineCustomElement$o();
             }
             break;
-        case "verdocs-loader":
+        case "verdocs-file-chooser":
             if (!customElements.get(tagName)) {
                 defineCustomElement$n();
             }
             break;
-        case "verdocs-menu-panel":
+        case "verdocs-flag":
             if (!customElements.get(tagName)) {
                 defineCustomElement$m();
             }
             break;
-        case "verdocs-ok-dialog":
+        case "verdocs-help-icon":
             if (!customElements.get(tagName)) {
                 defineCustomElement$l();
             }
             break;
-        case "verdocs-portal":
+        case "verdocs-loader":
             if (!customElements.get(tagName)) {
                 defineCustomElement$k();
             }
             break;
-        case "verdocs-preview":
+        case "verdocs-menu-panel":
             if (!customElements.get(tagName)) {
                 defineCustomElement$j();
             }
             break;
-        case "verdocs-progress-bar":
+        case "verdocs-ok-dialog":
             if (!customElements.get(tagName)) {
                 defineCustomElement$i();
             }
             break;
-        case "verdocs-select-input":
+        case "verdocs-portal":
             if (!customElements.get(tagName)) {
                 defineCustomElement$h();
             }
             break;
-        case "verdocs-send":
+        case "verdocs-preview":
             if (!customElements.get(tagName)) {
                 defineCustomElement$g();
             }
             break;
-        case "verdocs-spinner":
+        case "verdocs-progress-bar":
             if (!customElements.get(tagName)) {
                 defineCustomElement$f();
             }
             break;
-        case "verdocs-switch":
+        case "verdocs-select-input":
             if (!customElements.get(tagName)) {
                 defineCustomElement$e();
             }
             break;
-        case "verdocs-tabs":
+        case "verdocs-send":
             if (!customElements.get(tagName)) {
                 defineCustomElement$d();
             }
             break;
-        case "verdocs-template-attachments":
+        case "verdocs-spinner":
             if (!customElements.get(tagName)) {
                 defineCustomElement$c();
             }
             break;
-        case "verdocs-template-build-tabs":
+        case "verdocs-template-attachments":
             if (!customElements.get(tagName)) {
                 defineCustomElement$b();
             }
             break;
-        case "verdocs-template-document-page":
+        case "verdocs-template-build-tabs":
             if (!customElements.get(tagName)) {
                 defineCustomElement$a();
             }
             break;
-        case "verdocs-template-field-properties":
+        case "verdocs-template-document-page":
             if (!customElements.get(tagName)) {
                 defineCustomElement$9();
             }
             break;
-        case "verdocs-template-fields":
+        case "verdocs-template-field-properties":
             if (!customElements.get(tagName)) {
                 defineCustomElement$8();
             }
             break;
-        case "verdocs-template-role-properties":
+        case "verdocs-template-fields":
             if (!customElements.get(tagName)) {
                 defineCustomElement$7();
             }
             break;
-        case "verdocs-template-roles":
+        case "verdocs-template-role-properties":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }
             break;
-        case "verdocs-template-settings":
+        case "verdocs-template-roles":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }

package/dist/components/verdocs-build.js.map

@@ -1 +1 @@
-{"file":"verdocs-build.js","mappings":"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","names":["VerdocsBuild","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-build/verdocs-build.scss?tag=verdocs-build","src/components/embeds/verdocs-build/verdocs-build.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-build {\n  display: flex;\n  flex-direction: column;\n  font-family: $verdocs-primary-font;\n\n  .content {\n    flex: 1;\n    gap: 20px;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    //box-shadow: 0 0 7px -3px #000000cc;\n  }\n\n  verdocs-template-attachments,\n  verdocs-template-roles {\n    margin: 20px;\n  }\n\n  verdocs-template-fields {\n    border-top: 1px solid #777777;\n  }\n\n  verdocs-template-attachments {\n    padding: 20px;\n    background: #ffffff;\n  }\n\n  verdocs-template-fields {\n    width: 100%;\n  }\n\n  verdocs-preview {\n    flex: 1;\n  }\n\n  .preview-container {\n    flex-direction: row;\n    display: flex;\n    width: 100%;\n    background-color: #eeeeee;\n    max-height: 100%;\n\n    @media all and (max-width: 450px) {\n      flex-direction: column;\n    }\n  }\n\n  .preview-send-wrapper {\n    display: flex;\n    flex: 0 0 300px;\n    background-color: #ffffff;\n    box-shadow: 1px 1px 6px -2px #0000007f;\n\n    @media all and (max-width: 450px) {\n      flex: 0;\n    }\n  }\n\n  .preview-preview-wrapper {\n    display: flex;\n    flex: 1;\n    justify-content: center;\n    overflow-y: scroll;\n  }\n}\n","import {getTemplate, ICreateEnvelopeRecipientFromTemplate, IRole, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Element, Event, EventEmitter, Host, Watch, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nexport type TVerdocsBuildStep = 'attachments' | 'roles' | 'settings' | 'fields' | 'preview';\n\n/**\n * Display a template building experience. Several event callbacks provide status updates to the\n * parent application to support interface updates.\n *\n * ```ts\n * <verdocs-build\n *   templateId={TEMPLATE_ID} step=\"preview\"\n *   onSend={({detail}) => { console.log('Sent envelope from template', detail) }}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }}\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-build',\n  styleUrl: 'verdocs-build.scss',\n  shadow: false,\n})\nexport class VerdocsBuild {\n  private templateListenerId = null;\n\n  @Element() el!: any;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\n   * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\n   * If it is not specified, `step` will be ignored and the create step will be shown.\n   */\n  @Prop({reflect: true, mutable: true}) templateId: string | null = null;\n\n  /**\n   * The step in the creation process to display.\n   */\n  @Prop({reflect: true, mutable: true}) step: TVerdocsBuildStep = 'preview';\n\n  /**\n   * Event fired if the user clicks Cancel.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the user selects a different step.\n   */\n  @Event({composed: true}) stepChanged: EventEmitter<TVerdocsBuildStep>;\n\n  /**\n   * The user completed the Send form and clicked send.\n   */\n  @Event({composed: true}) send: EventEmitter<{recipients: ICreateEnvelopeRecipientFromTemplate[]; name: string; template_id: string}>;\n\n  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when the template is created by the upload step.\n   */\n  @Event({composed: true}) templateCreated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when roles are updated in the roles step.\n   */\n  @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  @Watch('templateId')\n  onTemplateIdChanged(newTemplateId: string, oldTemplateId: string) {\n    if (!oldTemplateId && newTemplateId && this.step === 'attachments') {\n      this.step = 'preview';\n    }\n\n    this.loadTemplate(newTemplateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  @Watch('step')\n  onStepChanged() {\n    // We reload the template here even if only the step changed in case\n    // we were out of sync before\n    this.loadTemplate(this.templateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n      if (!this.endpoint.session) {\n        console.log('[BUILD] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      if (!this.templateId) {\n        console.log(`[BUILD] No template ID, activating upload mode`);\n        this.step = 'attachments';\n        this.loading = false;\n        return;\n      }\n\n      try {\n        this.loadTemplate(this.templateId).catch(e => console.log('[BUILD] Unable to load template', e));\n      } catch (e) {\n        console.log('[BUILD] Error loading template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    } catch (e) {\n      console.log('[BUILD] Error with builder session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  async loadTemplate(templateId: string) {\n    if (templateId) {\n      Store.subscribe(\n        'templates',\n        this.templateId,\n        () => getTemplate(this.endpoint, this.templateId),\n        false,\n        (template: ITemplate) => {\n          this.template = template;\n          this.loading = false;\n        },\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    console.log('[BUILD] Disconnected');\n    this.unlistenToTemplate();\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  handleCancel() {\n    this.step = 'preview';\n    this.cancel?.emit();\n  }\n\n  async handleTemplateCreated(templateId: string) {\n    await this.loadTemplate(templateId);\n    this.templateId = templateId;\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  async handleRolesUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  async handleTemplateUpdated(e: any) {\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  handleAttachmentsNext() {\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  handleRolesNext() {\n    this.step = 'fields';\n    this.stepChanged?.emit('fields');\n  }\n\n  handleStepChanged(step: TVerdocsBuildStep) {\n    this.step = step;\n    this.stepChanged?.emit(step);\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    if (!this.endpoint.session) {\n      return (\n        <Host>\n          <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <div class=\"content\">\n          <verdocs-template-build-tabs\n            endpoint={this.endpoint}\n            templateId={this.templateId}\n            step={this.step}\n            onSdkError={e => this.sdkError?.emit(e.detail)}\n            onStepChanged={e => this.handleStepChanged(e.detail)}\n          />\n\n          {this.step === 'attachments' && (\n            <verdocs-template-attachments\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleAttachmentsNext()}\n              onTemplateUpdated={e => this.handleTemplateUpdated(e)}\n            />\n          )}\n\n          {this.step === 'roles' && (\n            <verdocs-template-roles\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleRolesNext()}\n              onRolesUpdated={e => this.handleRolesUpdated(e)}\n            />\n          )}\n\n          {this.step === 'settings' && <verdocs-template-settings templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'fields' && <verdocs-template-fields templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'preview' && (\n            <div class=\"preview-container\">\n              <div class=\"preview-send-wrapper\">\n                <verdocs-send templateId={this.templateId} endpoint={this.endpoint} onSend={e => this.send?.emit(e.detail)} style={{width: '100%'}} />\n              </div>\n              <div class=\"preview-preview-wrapper\">\n                <verdocs-preview templateId={this.templateId} endpoint={this.endpoint} style={{display: 'flex', flex: '1', maxWidth: '1000px'}} />\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"verdocs-build.js","mappings":"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","names":["VerdocsBuild","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-build/verdocs-build.scss?tag=verdocs-build","src/components/embeds/verdocs-build/verdocs-build.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-build {\n  display: flex;\n  flex-direction: column;\n  font-family: $verdocs-primary-font;\n\n  .content {\n    flex: 1;\n    gap: 20px;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    //box-shadow: 0 0 7px -3px #000000cc;\n  }\n\n  verdocs-template-attachments,\n  verdocs-template-roles {\n    display: block;\n    width: 500px;\n    max-width: 95%;\n    box-sizing: border-box;\n    margin: 20px;\n  }\n\n  verdocs-template-fields {\n    border-top: 1px solid #777777;\n  }\n\n  verdocs-template-attachments {\n    padding: 20px;\n    background: #ffffff;\n  }\n\n  verdocs-template-fields {\n    width: 100%;\n  }\n\n  verdocs-preview {\n    flex: 1;\n  }\n\n  .preview-container {\n    flex-direction: row;\n    display: flex;\n    width: 100%;\n    background-color: #eeeeee;\n    max-height: 100%;\n\n    @media all and (max-width: 450px) {\n      flex-direction: column;\n    }\n  }\n\n  .preview-send-wrapper {\n    display: flex;\n    flex: 0 0 300px;\n    background-color: #ffffff;\n    box-shadow: 1px 1px 6px -2px #0000007f;\n\n    @media all and (max-width: 450px) {\n      flex: 0;\n    }\n  }\n\n  .preview-preview-wrapper {\n    display: flex;\n    flex: 1;\n    justify-content: center;\n    overflow-y: scroll;\n  }\n}\n","import {getTemplate, ICreateEnvelopeRecipientFromTemplate, IRole, ITemplate, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, Prop, h, Element, Event, EventEmitter, Host, Watch, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nexport type TVerdocsBuildStep = 'attachments' | 'roles' | 'fields' | 'preview';\n\n/**\n * Display a template building experience. Several event callbacks provide status updates to the\n * parent application to support interface updates.\n *\n * ```ts\n * <verdocs-build\n *   templateId={TEMPLATE_ID} step=\"preview\"\n *   onSend={({detail}) => { console.log('Sent envelope from template', detail) }}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }}\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-build',\n  styleUrl: 'verdocs-build.scss',\n  shadow: false,\n})\nexport class VerdocsBuild {\n  private templateListenerId = null;\n\n  @Element() el!: any;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\n   * If the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\n   * If it is not specified, `step` will be ignored and the create step will be shown.\n   */\n  @Prop({reflect: true, mutable: true}) templateId: string | null = null;\n\n  /**\n   * The step in the creation process to display.\n   */\n  @Prop({reflect: true, mutable: true}) step: TVerdocsBuildStep = 'preview';\n\n  /**\n   * Event fired if the user clicks Cancel.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the user selects a different step.\n   */\n  @Event({composed: true}) stepChanged: EventEmitter<TVerdocsBuildStep>;\n\n  /**\n   * The user completed the Send form and clicked send.\n   */\n  @Event({composed: true}) send: EventEmitter<{recipients: ICreateEnvelopeRecipientFromTemplate[]; name: string; template_id: string}>;\n\n  /**\n   * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) templateUpdated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when the template is created by the upload step.\n   */\n  @Event({composed: true}) templateCreated: EventEmitter<{endpoint: VerdocsEndpoint; template: ITemplate; event: string}>;\n\n  /**\n   * Event fired when roles are updated in the roles step.\n   */\n  @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n  @State() loading = true;\n  @State() template: ITemplate | null = null;\n\n  @Watch('templateId')\n  onTemplateIdChanged(newTemplateId: string, oldTemplateId: string) {\n    if (!oldTemplateId && newTemplateId && this.step === 'attachments') {\n      this.step = 'preview';\n    }\n\n    this.loadTemplate(newTemplateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  @Watch('step')\n  onStepChanged() {\n    // We reload the template here even if only the step changed in case\n    // we were out of sync before\n    this.loadTemplate(this.templateId).catch((e: any) => console.log('Unknown Error', e));\n  }\n\n  async componentWillLoad() {\n    try {\n      this.endpoint.loadSession();\n      if (!this.endpoint.session) {\n        console.log('[BUILD] Unable to start builder session, must be authenticated');\n        return;\n      }\n\n      if (!this.templateId) {\n        console.log(`[BUILD] No template ID, activating upload mode`);\n        this.step = 'attachments';\n        this.loading = false;\n        return;\n      }\n\n      try {\n        this.loadTemplate(this.templateId).catch(e => console.log('[BUILD] Unable to load template', e));\n      } catch (e) {\n        console.log('[BUILD] Error loading template', e);\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    } catch (e) {\n      console.log('[BUILD] Error with builder session', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n  }\n\n  async loadTemplate(templateId: string) {\n    if (templateId) {\n      Store.subscribe(\n        'templates',\n        this.templateId,\n        () => getTemplate(this.endpoint, this.templateId),\n        false,\n        (template: ITemplate) => {\n          this.template = template;\n          this.loading = false;\n        },\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    console.log('[BUILD] Disconnected');\n    this.unlistenToTemplate();\n  }\n\n  unlistenToTemplate() {\n    if (this.templateListenerId) {\n      Store.store.delListener(this.templateListenerId);\n      this.templateListenerId = null;\n    }\n  }\n\n  handleCancel() {\n    this.step = 'preview';\n    this.cancel?.emit();\n  }\n\n  async handleTemplateCreated(templateId: string) {\n    await this.loadTemplate(templateId);\n    this.templateId = templateId;\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  async handleRolesUpdated(e: any) {\n    console.log('[BUILD] Roloes updated', e);\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  async handleTemplateUpdated(e: any) {\n    console.log('[BUILD] Template updated', e);\n    this.templateUpdated?.emit(e.detail);\n  }\n\n  handleAttachmentsNext() {\n    this.step = 'roles';\n    this.stepChanged?.emit('roles');\n  }\n\n  handleRolesNext() {\n    this.step = 'fields';\n    this.stepChanged?.emit('fields');\n  }\n\n  handleStepChanged(step: TVerdocsBuildStep) {\n    this.step = step;\n    this.stepChanged?.emit(step);\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host class=\"loading\">\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    if (!this.endpoint.session) {\n      return (\n        <Host>\n          <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <div class=\"content\">\n          <verdocs-template-build-tabs\n            endpoint={this.endpoint}\n            templateId={this.templateId}\n            step={this.step}\n            onSdkError={e => this.sdkError?.emit(e.detail)}\n            onStepChanged={e => this.handleStepChanged(e.detail)}\n          />\n\n          {this.step === 'attachments' && (\n            <verdocs-template-attachments\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleAttachmentsNext()}\n              onTemplateUpdated={e => this.handleTemplateUpdated(e)}\n            />\n          )}\n\n          {this.step === 'roles' && (\n            <verdocs-template-roles\n              templateId={this.templateId}\n              endpoint={this.endpoint}\n              onExit={() => this.handleCancel()}\n              onNext={() => this.handleRolesNext()}\n              onRolesUpdated={e => this.handleRolesUpdated(e)}\n            />\n          )}\n\n          {this.step === 'fields' && <verdocs-template-fields templateId={this.templateId} endpoint={this.endpoint} onTemplateUpdated={e => this.handleTemplateUpdated(e)} />}\n\n          {this.step === 'preview' && (\n            <div class=\"preview-container\">\n              <div class=\"preview-send-wrapper\">\n                <verdocs-send templateId={this.templateId} endpoint={this.endpoint} onSend={e => this.send?.emit(e.detail)} style={{width: '100%'}} />\n              </div>\n              <div class=\"preview-preview-wrapper\">\n                <verdocs-preview templateId={this.templateId} endpoint={this.endpoint} style={{display: 'flex', flex: '1', maxWidth: '1000px'}} />\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}