@aham.ro/ui-designer 0.1.7 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.d.ts +1 -2
  2. package/dist/stores/checklist.d.ts +2 -5
  3. package/dist/ui-designer.css +1 -1
  4. package/dist/ui-designer.js +154 -127
  5. package/dist/widgets/SideInfo.vue.d.ts +1 -3
  6. package/dist/widgets/header/types.d.ts +4 -0
  7. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -1,9 +1,8 @@
1
1
  import './designer.css';
2
2
  export { default as Designer } from './Designer.vue';
3
3
  export { default as TextScroller } from './widgets/TextScroller.vue';
4
- export type { MoreMenuItem, Template } from './widgets/header/types';
4
+ export type { ChecklistContext, ChecklistItem, MoreMenuItem, Template } from './widgets/header/types';
5
5
  export { useChecklistStore } from './stores/checklist';
6
- export type { ChecklistItem } from './stores/checklist';
7
6
  export { useScreensStore } from './stores/screens';
8
7
  export type { DynamicScreen, PredefinedScreen, Screen } from './stores/screens';
9
8
  export * from './widgets/components';
package/dist/stores/checklist.d.ts CHANGED
@@ -1,8 +1,5 @@
1
- export interface ChecklistItem {
2
- id: string;
3
- label: string;
4
- complete: boolean;
5
- }
1
+ import type { ChecklistItem } from '../widgets/header/types';
2
+ export type { ChecklistItem } from '../widgets/header/types';
6
3
  export declare const useChecklistStore: import("pinia").StoreDefinition<"checklist", {
7
4
  items: ChecklistItem[];
8
5
  }, {}, {
package/dist/ui-designer.css CHANGED
@@ -1,2 +1,2 @@
1
- @import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,0..200";.ui-designer{--designer-panel:var(--color-panel,#fff);--designer-panel-raised:var(--color-panel-raised,#f5f2ee);--designer-text:var(--color-text,#111);--designer-muted:var(--color-text-muted,#6b7280);--designer-border:var(--color-border,#ece9e4);--designer-shell:var(--color-background,#fafaf9);--designer-primary:var(--color-primary,#2563eb);--designer-space-xs:var(--space-xs,6px);--designer-space-sm:var(--space-sm,10px);--designer-space-md:var(--space-md,14px);--designer-font-xs:var(--font-xs,11px);--designer-font-sm:var(--font-sm,12.5px);--designer-font-lg:var(--font-lg,19px)}.ui-designer [data-overlayscrollbars]{--os-size:6px;--os-padding-perpendicular:2px;--os-track-border-radius:4px;--os-handle-border-radius:4px;--os-handle-bg:color-mix(in srgb, var(--designer-muted) 35%, transparent);--os-handle-bg-hover:var(--designer-muted);--os-handle-bg-active:var(--designer-primary)}.ui-designer [data-overlayscrollbars]>.os-scrollbar-horizontal{display:none}.text-scroller[data-v-8fac895b]{white-space:nowrap;min-width:0;display:block;overflow:hidden}.text-scroller-content[data-v-8fac895b]{text-overflow:ellipsis;vertical-align:top;min-width:100%;display:inline-block;overflow:hidden}.text-scroller.scrolling .text-scroller-content[data-v-8fac895b]{animation:text-scroller-loop-8fac895b var(--scroll-duration) linear;text-overflow:clip}@keyframes text-scroller-loop-8fac895b{0%,15%{transform:translate(0)}85%,to{transform:translateX(calc(-1 * var(--scroll-distance)))}}.component-list[data-v-29d47f96]{border-top:1px solid var(--designer-border);flex-direction:column;width:100%;min-width:0;min-height:0;display:flex;overflow:hidden}.component-head[data-v-29d47f96]{padding:12px var(--designer-space-sm) 8px;color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;flex:none}.component-content[data-v-29d47f96]{box-sizing:border-box;flex:auto;width:100%;min-width:0;height:0;min-height:0;padding:0 0 12px}.palette-search[data-v-29d47f96]{border:1px solid var(--designer-border);background:var(--designer-shell);color:var(--designer-muted);border-radius:7px;flex:none;align-items:center;gap:7px;margin:0 10px 10px;padding:7px 8px;display:flex}.palette-search input[data-v-29d47f96]{width:100%;min-width:0;color:var(--designer-text);font:inherit;font-size:var(--designer-font-sm);background:0 0;border:0;outline:0}.component-group+.component-group[data-v-29d47f96]{margin-top:14px}.component-groups[data-v-29d47f96]{box-sizing:border-box;width:100%;min-width:0;padding:0 10px}.component-content[data-v-29d47f96] [data-overlayscrollbars-contents]{box-sizing:border-box;width:100%;min-width:0}.component-content[data-v-29d47f96] [data-overlayscrollbars-viewport]{height:100%!important;overflow-y:scroll!important}.group-label[data-v-29d47f96]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;padding:0 4px 6px}.component-items[data-v-29d47f96]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5px;display:grid}.component-item[data-v-29d47f96]{border:1px solid var(--designer-border);background:var(--designer-panel);min-width:0;color:var(--designer-text);font:inherit;font-size:var(--designer-font-xs);text-align:left;cursor:pointer;border-radius:8px;flex-direction:column;align-items:flex-start;gap:5px;padding:7px;line-height:1.2;display:flex}.component-item[data-v-29d47f96]:hover{border-color:color-mix(in srgb, var(--designer-primary) 35%, var(--designer-border));background:var(--designer-panel-raised);transform:translateY(-1px)}.component-icon[data-v-29d47f96]{background:var(--designer-panel-raised);width:20px;height:20px;color:var(--designer-muted);border-radius:6px;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.component-item:hover .component-icon[data-v-29d47f96]{color:var(--designer-primary)}.component-label[data-v-29d47f96]{width:100%;max-width:100%}.component-empty[data-v-29d47f96]{color:var(--designer-muted);font-size:var(--designer-font-xs);text-align:center;grid-column:1/-1;padding:10px 4px}[data-overlayscrollbars].component-content[data-v-29d47f96]{flex:auto;height:0;min-height:0}.icon-button[data-v-b3b6390f]{border:1px solid var(--color-border,#ece9e4);border-radius:var(--radius-sm,10px);background-color:var(--color-panel,#fff);width:34px;height:34px;color:var(--color-text-muted,#6b7280);font:inherit;cursor:pointer;justify-content:center;align-items:center;padding:0;line-height:1;transition:color .15s,border-color .15s,background-color .15s;display:inline-flex}.icon-button[data-v-b3b6390f]:hover:not(:disabled){color:var(--color-primary,#2563eb);border-color:var(--color-primary,#2563eb);background-color:var(--color-panel-raised,#f5f2ee)}.icon-button[data-v-b3b6390f]:disabled{opacity:.5;cursor:not-allowed}.more-menu[data-v-923fea1e]{position:relative}.more-button[data-v-923fea1e]{border-radius:var(--radius-xs,6px);background-color:var(--color-panel,#fff);width:32px;height:32px;color:var(--color-text,#111);font:inherit;cursor:pointer;border:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}.more-button[aria-expanded=true][data-v-923fea1e]{background-color:var(--color-panel-raised,#f5f2ee)}.dropdown[data-v-923fea1e]{z-index:1000;border:1px solid var(--designer-border,#ece9e4);border-radius:var(--radius-sm,10px);background:var(--designer-panel,#fff);min-width:180px;color:var(--designer-text,#111);font-family:var(--font-base-family,system-ui, sans-serif);padding:4px;position:fixed;box-shadow:0 8px 24px #0000001f}.dropdown .icon[data-v-923fea1e]{letter-spacing:normal;text-transform:none;white-space:nowrap;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;font-feature-settings:"liga";font-variation-settings:"FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;direction:ltr;font-family:Material Symbols Outlined;font-size:20px;font-style:normal;font-weight:400;line-height:1}.menu-item[data-v-923fea1e]{align-items:center;gap:var(--designer-space-sm,10px);border-radius:var(--radius-xs,6px);width:100%;color:var(--designer-text,#111);font:inherit;font-size:var(--designer-font-sm,12.5px);text-align:left;cursor:pointer;background:0 0;border:0;padding:8px 10px;display:flex}.menu-item[data-v-923fea1e]:hover:not(:disabled){background:var(--designer-panel-raised,#f5f2ee)}.menu-item[data-v-923fea1e]:disabled{opacity:.5;cursor:not-allowed}.save-button[data-v-4a359870]{justify-content:center;align-items:center;gap:var(--space-xs,6px);min-height:32px;padding:6px var(--space-sm,10px);border:1px solid var(--color-primary,#2563eb);border-radius:var(--radius-sm,10px);background-color:var(--color-primary,#2563eb);color:var(--color-on-primary,#fff);font:inherit;font-size:var(--font-sm,12.5px);cursor:pointer;font-weight:500;display:inline-flex}.save-button[data-v-4a359870]:disabled{opacity:.6;cursor:not-allowed}.save-button[data-v-4a359870]:hover{background-color:var(--color-primary-hover,#1d4ed8);border-color:var(--color-primary-hover,#1d4ed8)}.spinner[data-v-4a359870]{border:1px solid;border-right-color:#0000;border-radius:50%;width:14px;height:14px;animation:.75s linear infinite save-button-spin-4a359870}@keyframes save-button-spin-4a359870{to{transform:rotate(360deg)}}header[data-v-b6ce5e30]{box-sizing:border-box;width:100%;height:60px;color:var(--designer-text);border-bottom:1px solid var(--designer-border);font-family:var(--font-base-family,inherit);align-items:center;display:flex}.branding[data-v-b6ce5e30]{height:100%;padding:0 var(--designer-space-md);align-items:center;min-width:0;display:flex}.branding .icon[data-v-b6ce5e30]{margin-right:var(--designer-space-xs);font-size:24px}.branding .title[data-v-b6ce5e30]{text-overflow:ellipsis;white-space:nowrap;max-width:min(60vw,620px);font-weight:500;font-size:var(--designer-font-lg);overflow:hidden}.subject[data-v-b6ce5e30]{align-items:center;gap:var(--designer-space-sm);min-width:0;height:100%;display:flex}.subject .document-name[data-v-b6ce5e30]{text-overflow:ellipsis;white-space:nowrap;max-width:min(35vw,360px);font-size:var(--designer-font-xs);background-color:var(--color-surface-disabled,color-mix(in srgb, var(--designer-text) 4%, var(--designer-panel)));border-radius:var(--radius-xs,6px);color:var(--color-info,var(--designer-primary));padding:4px 8px;font-weight:500;overflow:hidden}.subject .shared[data-v-b6ce5e30]{color:var(--designer-muted);font-size:var(--designer-font-md);cursor:default}.actions[data-v-b6ce5e30]{height:100%;padding:0 var(--designer-space-md);justify-content:flex-end;align-items:center;gap:var(--designer-space-sm);flex:1;display:flex}.icon[data-v-b6ce5e30]{white-space:nowrap;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;line-height:1;display:inline-flex}@media (width<=720px){.subject[data-v-b6ce5e30]{display:none}.actions[data-v-b6ce5e30]{padding-right:var(--designer-space-sm)}}.properties-panel[data-v-d42babf5]{min-height:0;color:var(--designer-text);flex-direction:column;display:flex}.properties-head[data-v-d42babf5]{min-height:52px;padding:0 var(--designer-space-md);border-bottom:1px solid var(--designer-border);font-size:var(--designer-font-sm);align-items:center;gap:8px;display:flex}.property-icon[data-v-d42babf5]{color:var(--designer-primary);font-size:16px}.properties-empty[data-v-d42babf5]{padding:22px var(--designer-space-md);color:var(--designer-muted);font-size:var(--designer-font-sm);line-height:1.5}.layers[data-v-d42babf5]{padding:12px var(--designer-space-md);border-top:1px solid var(--designer-border);margin-top:auto}.layers-title[data-v-d42babf5]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}.layer-empty[data-v-d42babf5]{color:var(--designer-muted);font-size:var(--designer-font-sm)}.side-info[data-v-31711f81]{border-top:1px solid var(--designer-border);height:auto;color:var(--designer-muted);font-size:var(--designer-font-sm);flex:none;padding:12px 14px 16px}.info-title[data-v-31711f81]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}.info-row[data-v-31711f81]{align-items:flex-start;gap:8px;line-height:1.4;display:flex}.info-row+.info-row[data-v-31711f81]{margin-top:7px}.info-dot[data-v-31711f81]{background:var(--color-accent-3,#c9973f);border-radius:50%;flex:none;width:7px;height:7px;margin-top:4px}.info-dot.complete[data-v-31711f81]{background:var(--color-success,#5aab72)}.template-list[data-v-927e0835]{box-sizing:border-box;border-bottom:1px solid var(--designer-border);width:100%;min-width:0;min-height:0;padding:12px 0 10px;overflow:hidden}.section-head[data-v-927e0835]{padding:0 var(--designer-space-sm) 8px;color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;align-items:center;display:flex}.section-head button[data-v-927e0835]{border:1px solid var(--designer-border);background:var(--designer-panel);width:19px;height:19px;color:var(--designer-muted);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.section-head button span[data-v-927e0835]{line-height:1;display:block;transform:translateY(-1px)}.template-tabs[data-v-927e0835]{flex-direction:column;flex:auto;width:100%;min-width:0;height:0;min-height:0;display:flex;overflow:hidden}.template-tab[data-v-927e0835]{box-sizing:border-box;width:calc(100% - 13px);min-width:0;color:var(--designer-muted);font:inherit;font-size:var(--designer-font-sm);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;gap:7px;margin:0 6px 3px;padding:10px 9px;display:flex}.template-tab[data-v-927e0835]:last-of-type{margin-bottom:0}.template-tab[data-v-927e0835]:hover,.template-tab.active[data-v-927e0835]{background:var(--designer-panel-raised);color:var(--designer-primary)}.tab-icon[data-v-927e0835]{width:14px;height:14px;color:var(--designer-muted);flex:none;font-size:14px}.tab-label[data-v-927e0835]{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.tab-label-input[data-v-927e0835]{box-sizing:border-box;border:1px solid var(--designer-border);background:var(--designer-shell);width:100%;color:var(--designer-text);font:inherit;border-radius:3px;outline:0;padding:1px 3px}.tab-channel[data-v-927e0835]{border:1px solid var(--designer-border);background:var(--designer-panel);color:var(--designer-muted);text-transform:uppercase;border-radius:4px;flex:none;padding:1px 4px;font-size:9px;line-height:1.1}.tab-version[data-v-927e0835]{color:var(--designer-muted);font-size:var(--designer-font-xs)}.tab-changed[data-v-927e0835]{background:var(--color-warning,#c9973f);border-radius:50%;flex:none;width:5px;height:5px;transform:translateY(1px)}.empty-list[data-v-927e0835]{color:var(--designer-muted);font-size:var(--designer-font-sm);margin:0;padding:10px 15px}[data-overlayscrollbars].template-tabs[data-v-927e0835]{flex:auto;width:100%;height:0;min-height:0}.template-tabs[data-v-927e0835] [data-overlayscrollbars-viewport]{height:100%!important;overflow-y:scroll!important}.template-tabs[data-v-927e0835] [data-overlayscrollbars-contents]{box-sizing:border-box;width:100%;min-width:0;padding:0 6px 8px 0}section[data-v-da3e0d0f]{box-sizing:border-box;flex-direction:column;height:100%;min-height:0;max-height:100vh;display:flex;position:relative;overflow:hidden}.contents[data-v-da3e0d0f]{box-sizing:border-box;flex:auto;height:auto;min-height:0;max-height:none;display:flex;overflow:hidden}.contents aside[data-v-da3e0d0f]{border-right:1px solid var(--designer-border);flex-direction:column;flex:0 0 200px;width:200px;min-height:0;max-height:100%;display:flex;overflow:hidden}.contents .sidebar-panels[data-v-da3e0d0f]{grid-template-rows:var(--screens-height) 9px minmax(0, calc(100% - var(--screens-height) - 9px));flex:1;min-height:0;display:grid}.contents .sidebar-panels>[data-v-da3e0d0f]{min-height:0}.contents .panel-resizer[data-v-da3e0d0f]{border:0;border-top:1px solid color-mix(in srgb, var(--designer-border) 55%, transparent);border-bottom:1px solid color-mix(in srgb, var(--designer-border) 55%, transparent);cursor:row-resize;background:0 0;justify-content:center;align-items:center;width:100%;padding:0;display:flex}.contents .panel-resizer span[data-v-da3e0d0f]{background:var(--designer-border);border-radius:3px;width:28px;height:3px}.contents .panel-resizer:hover span[data-v-da3e0d0f]{background:var(--designer-primary)}.contents .workspace[data-v-da3e0d0f]{flex:1;min-width:0;max-height:100%}.contents .properties[data-v-da3e0d0f]{border-left:1px solid var(--designer-border);flex:0 0 240px;width:240px;min-height:0;max-height:100%;overflow:auto}.container-component[data-v-42c23412]{box-sizing:border-box;min-width:0;color:var(--designer-text,#111)}.empty[data-v-42c23412]{border:1px dashed var(--designer-border,#d9d5cf);min-height:24px;color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.card-component[data-v-b06c1052]{box-sizing:border-box;min-width:0;color:var(--designer-text,#111);background:var(--designer-panel,#fff)}.empty[data-v-b06c1052]{border:1px dashed var(--designer-border,#d9d5cf);min-height:24px;color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.divider-component[data-v-a6e861b8]{width:100%;color:var(--designer-muted,#6b7280);align-items:center;gap:10px;font-size:.8em;display:flex}.divider-component[data-v-a6e861b8]:before,.divider-component[data-v-a6e861b8]:after{background:var(--designer-border,#e5e7eb);content:"";flex:1;height:1px}.layout-component[data-v-be209bd5]{min-width:0}.empty[data-v-be209bd5]{border:1px dashed var(--designer-border,#d9d5cf);color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.layout-ref-component[data-v-d41ee6eb]{min-width:0;padding-top:22px;position:relative}.badge[data-v-d41ee6eb]{color:var(--designer-primary,#2563eb);font-size:.72em;position:absolute;top:0;left:0}.empty[data-v-d41ee6eb]{border:1px dashed var(--designer-border,#d9d5cf);color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.field-component[data-v-c7f2e797]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-c7f2e797]{font-size:.85em;font-weight:600}.label b[data-v-c7f2e797]{color:#dc2626;margin-left:2px}input[data-v-c7f2e797]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-b5ed7071]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-b5ed7071]{font-size:.85em;font-weight:600}.label b[data-v-b5ed7071]{color:#dc2626;margin-left:2px}input[data-v-b5ed7071]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-ad9dff41]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-ad9dff41]{font-size:.85em;font-weight:600}.label b[data-v-ad9dff41]{color:#dc2626;margin-left:2px}.field-row[data-v-ad9dff41]{justify-content:space-between;gap:8px;display:flex}.field-row a[data-v-ad9dff41]{color:var(--designer-primary,#2563eb);font-size:.85em}input[data-v-ad9dff41]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-1914959e]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-1914959e]{font-size:.85em;font-weight:600}.otp-row[data-v-1914959e]{gap:6px;display:flex}.otp-box[data-v-1914959e]{border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);border-radius:6px;width:2em;height:2.3em}.checkbox-component[data-v-3d492d6d]{color:var(--designer-text,#111);cursor:default;align-items:center;gap:8px;display:inline-flex}.checkbox-component input[data-v-3d492d6d]{accent-color:var(--designer-primary,#2563eb)}.submit-button[data-v-9807299a]{width:100%;font:inherit;cursor:pointer;border:0;border-radius:7px;padding:10px 14px}.primary[data-v-9807299a]{background:var(--designer-primary,#2563eb);color:#fff}.secondary[data-v-9807299a]{border:1px solid var(--designer-border,#d9d5cf);color:inherit;background:0 0}.social-button[data-v-3045616f]{border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;cursor:pointer;border-radius:7px;justify-content:center;align-items:center;gap:9px;padding:9px 14px;display:flex}.social-icon[data-v-3045616f]{color:#fff;border-radius:4px;place-items:center;width:20px;height:20px;font-size:12px;font-weight:700;display:inline-grid}.text-link[data-v-8d18edb1]{color:var(--designer-primary,#2563eb);text-decoration:none}.text-link[data-v-8d18edb1]:hover{text-decoration:underline}.heading-component[data-v-1c78b10f]{color:var(--designer-text,#111);margin:0}.sm[data-v-1c78b10f]{font-size:1em}.md[data-v-1c78b10f]{font-size:1.2em}.lg[data-v-1c78b10f]{font-size:1.5em}.xl[data-v-1c78b10f]{font-size:1.9em}.text-component[data-v-3be0c0c9]{color:var(--designer-muted,#6b7280);white-space:pre-wrap;margin:0;line-height:1.5}.image-link[data-v-ecc98881]{max-width:100%;text-decoration:none;display:inline-block}.image-component[data-v-ecc98881]{box-sizing:border-box;background:var(--designer-panel-raised,#f5f2ee);min-height:20px;color:var(--designer-muted,#6b7280);place-items:center;display:grid;overflow:hidden}.image-component img[data-v-ecc98881]{object-fit:cover;width:100%;height:100%;display:block}.alert-component[data-v-bf171873]{border-radius:7px;gap:8px;padding:10px 12px;font-size:.9em;display:flex}.info[data-v-bf171873]{color:#1d4ed8;background:#eff6ff}.success[data-v-bf171873]{color:#047857;background:#ecfdf5}.error[data-v-bf171873]{color:#b91c1c;background:#fef2f2}.content-component[data-v-1c551f9d]{min-width:0}.empty[data-v-1c551f9d]{border:1px dashed var(--designer-border,#d9d5cf);min-height:46px;color:var(--designer-muted,#6b7280);text-align:center;padding:14px}.consent-card[data-v-9008f821]{border:1px solid var(--designer-border,#d9d5cf);border-radius:8px;align-items:center;gap:10px;padding:12px;display:flex}.icon[data-v-9008f821]{color:#15803d;background:#dcfce7;border-radius:50%;place-items:center;width:28px;height:28px;font-weight:700;display:grid}.consent-card div[data-v-9008f821]{gap:3px;display:grid}.consent-card span[data-v-9008f821]{color:var(--designer-muted,#6b7280);font-size:.85em}.scope-list[data-v-cdebac9d]{gap:8px;display:grid}.scope[data-v-cdebac9d]{align-items:center;gap:8px;display:flex}.scope>span[data-v-cdebac9d]:first-child{color:#15803d;font-weight:700}
1
+ @import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,0..200";.ui-designer{--designer-panel:var(--color-panel,#fff);--designer-panel-raised:var(--color-panel-raised,#f5f2ee);--designer-text:var(--color-text,#111);--designer-muted:var(--color-text-muted,#6b7280);--designer-border:var(--color-border,#ece9e4);--designer-shell:var(--color-background,#fafaf9);--designer-primary:var(--color-primary,#2563eb);--designer-space-xs:var(--space-xs,6px);--designer-space-sm:var(--space-sm,10px);--designer-space-md:var(--space-md,14px);--designer-font-xs:var(--font-xs,11px);--designer-font-sm:var(--font-sm,12.5px);--designer-font-lg:var(--font-lg,19px)}.ui-designer [data-overlayscrollbars]{--os-size:6px;--os-padding-perpendicular:2px;--os-track-border-radius:4px;--os-handle-border-radius:4px;--os-handle-bg:color-mix(in srgb, var(--designer-muted) 35%, transparent);--os-handle-bg-hover:var(--designer-muted);--os-handle-bg-active:var(--designer-primary)}.ui-designer [data-overlayscrollbars]>.os-scrollbar-horizontal{display:none}.text-scroller[data-v-8fac895b]{white-space:nowrap;min-width:0;display:block;overflow:hidden}.text-scroller-content[data-v-8fac895b]{text-overflow:ellipsis;vertical-align:top;min-width:100%;display:inline-block;overflow:hidden}.text-scroller.scrolling .text-scroller-content[data-v-8fac895b]{animation:text-scroller-loop-8fac895b var(--scroll-duration) linear;text-overflow:clip}@keyframes text-scroller-loop-8fac895b{0%,15%{transform:translate(0)}85%,to{transform:translateX(calc(-1 * var(--scroll-distance)))}}.component-list[data-v-931b78ec]{border-top:1px solid var(--designer-border);flex-direction:column;width:100%;min-width:0;min-height:0;display:flex;overflow:hidden}.component-head[data-v-931b78ec]{padding:12px var(--designer-space-sm) 8px;color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;flex:none}.component-content[data-v-931b78ec]{box-sizing:border-box;flex:auto;width:100%;min-width:0;height:0;min-height:0;padding:0 0 12px}.palette-search[data-v-931b78ec]{border:1px solid var(--designer-border);background:var(--designer-shell);color:var(--designer-muted);border-radius:7px;flex:none;align-items:center;gap:7px;margin:0 10px 10px;padding:7px 8px;display:flex}.palette-search input[data-v-931b78ec]{width:100%;min-width:0;color:var(--designer-text);font:inherit;font-size:var(--designer-font-sm);background:0 0;border:0;outline:0}.component-group+.component-group[data-v-931b78ec]{margin-top:14px}.component-groups[data-v-931b78ec]{box-sizing:border-box;width:100%;min-width:0;padding:0 10px}.component-content[data-v-931b78ec] [data-overlayscrollbars-contents]{box-sizing:border-box;width:100%;min-width:0}.component-content[data-v-931b78ec] [data-overlayscrollbars-viewport]{height:100%!important;overflow-y:scroll!important}.group-label[data-v-931b78ec]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;padding:0 4px 6px}.component-items[data-v-931b78ec]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5px;display:grid}.component-item[data-v-931b78ec]{border:1px solid var(--designer-border);background:var(--designer-panel);min-width:0;color:var(--designer-text);font:inherit;font-size:var(--designer-font-xs);text-align:left;cursor:pointer;border-radius:8px;flex-direction:column;align-items:flex-start;gap:5px;padding:7px;line-height:1.2;display:flex}.component-item[data-v-931b78ec]:hover{border-color:color-mix(in srgb, var(--designer-primary) 35%, var(--designer-border));background:var(--designer-panel-raised);transform:translateY(-1px)}.component-icon[data-v-931b78ec]{background:var(--designer-panel-raised);width:20px;height:20px;color:var(--designer-muted);border-radius:6px;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.component-item:hover .component-icon[data-v-931b78ec]{color:var(--designer-primary)}.component-label[data-v-931b78ec]{width:100%;max-width:100%}.component-empty[data-v-931b78ec]{box-sizing:border-box;width:100%;color:var(--designer-muted);font-size:var(--designer-font-xs);text-align:left;padding:10px 14px;display:block}[data-overlayscrollbars].component-content[data-v-931b78ec]{flex:auto;height:0;min-height:0}.icon-button[data-v-b3b6390f]{border:1px solid var(--color-border,#ece9e4);border-radius:var(--radius-sm,10px);background-color:var(--color-panel,#fff);width:34px;height:34px;color:var(--color-text-muted,#6b7280);font:inherit;cursor:pointer;justify-content:center;align-items:center;padding:0;line-height:1;transition:color .15s,border-color .15s,background-color .15s;display:inline-flex}.icon-button[data-v-b3b6390f]:hover:not(:disabled){color:var(--color-primary,#2563eb);border-color:var(--color-primary,#2563eb);background-color:var(--color-panel-raised,#f5f2ee)}.icon-button[data-v-b3b6390f]:disabled{opacity:.5;cursor:not-allowed}.more-menu[data-v-923fea1e]{position:relative}.more-button[data-v-923fea1e]{border-radius:var(--radius-xs,6px);background-color:var(--color-panel,#fff);width:32px;height:32px;color:var(--color-text,#111);font:inherit;cursor:pointer;border:none;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}.more-button[aria-expanded=true][data-v-923fea1e]{background-color:var(--color-panel-raised,#f5f2ee)}.dropdown[data-v-923fea1e]{z-index:1000;border:1px solid var(--designer-border,#ece9e4);border-radius:var(--radius-sm,10px);background:var(--designer-panel,#fff);min-width:180px;color:var(--designer-text,#111);font-family:var(--font-base-family,system-ui, sans-serif);padding:4px;position:fixed;box-shadow:0 8px 24px #0000001f}.dropdown .icon[data-v-923fea1e]{letter-spacing:normal;text-transform:none;white-space:nowrap;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;font-feature-settings:"liga";font-variation-settings:"FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;direction:ltr;font-family:Material Symbols Outlined;font-size:20px;font-style:normal;font-weight:400;line-height:1}.menu-item[data-v-923fea1e]{align-items:center;gap:var(--designer-space-sm,10px);border-radius:var(--radius-xs,6px);width:100%;color:var(--designer-text,#111);font:inherit;font-size:var(--designer-font-sm,12.5px);text-align:left;cursor:pointer;background:0 0;border:0;padding:8px 10px;display:flex}.menu-item[data-v-923fea1e]:hover:not(:disabled){background:var(--designer-panel-raised,#f5f2ee)}.menu-item[data-v-923fea1e]:disabled{opacity:.5;cursor:not-allowed}.save-button[data-v-4a359870]{justify-content:center;align-items:center;gap:var(--space-xs,6px);min-height:32px;padding:6px var(--space-sm,10px);border:1px solid var(--color-primary,#2563eb);border-radius:var(--radius-sm,10px);background-color:var(--color-primary,#2563eb);color:var(--color-on-primary,#fff);font:inherit;font-size:var(--font-sm,12.5px);cursor:pointer;font-weight:500;display:inline-flex}.save-button[data-v-4a359870]:disabled{opacity:.6;cursor:not-allowed}.save-button[data-v-4a359870]:hover{background-color:var(--color-primary-hover,#1d4ed8);border-color:var(--color-primary-hover,#1d4ed8)}.spinner[data-v-4a359870]{border:1px solid;border-right-color:#0000;border-radius:50%;width:14px;height:14px;animation:.75s linear infinite save-button-spin-4a359870}@keyframes save-button-spin-4a359870{to{transform:rotate(360deg)}}header[data-v-b6ce5e30]{box-sizing:border-box;width:100%;height:60px;color:var(--designer-text);border-bottom:1px solid var(--designer-border);font-family:var(--font-base-family,inherit);align-items:center;display:flex}.branding[data-v-b6ce5e30]{height:100%;padding:0 var(--designer-space-md);align-items:center;min-width:0;display:flex}.branding .icon[data-v-b6ce5e30]{margin-right:var(--designer-space-xs);font-size:24px}.branding .title[data-v-b6ce5e30]{text-overflow:ellipsis;white-space:nowrap;max-width:min(60vw,620px);font-weight:500;font-size:var(--designer-font-lg);overflow:hidden}.subject[data-v-b6ce5e30]{align-items:center;gap:var(--designer-space-sm);min-width:0;height:100%;display:flex}.subject .document-name[data-v-b6ce5e30]{text-overflow:ellipsis;white-space:nowrap;max-width:min(35vw,360px);font-size:var(--designer-font-xs);background-color:var(--color-surface-disabled,color-mix(in srgb, var(--designer-text) 4%, var(--designer-panel)));border-radius:var(--radius-xs,6px);color:var(--color-info,var(--designer-primary));padding:4px 8px;font-weight:500;overflow:hidden}.subject .shared[data-v-b6ce5e30]{color:var(--designer-muted);font-size:var(--designer-font-md);cursor:default}.actions[data-v-b6ce5e30]{height:100%;padding:0 var(--designer-space-md);justify-content:flex-end;align-items:center;gap:var(--designer-space-sm);flex:1;display:flex}.icon[data-v-b6ce5e30]{white-space:nowrap;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;line-height:1;display:inline-flex}@media (width<=720px){.subject[data-v-b6ce5e30]{display:none}.actions[data-v-b6ce5e30]{padding-right:var(--designer-space-sm)}}.properties-panel[data-v-d42babf5]{min-height:0;color:var(--designer-text);flex-direction:column;display:flex}.properties-head[data-v-d42babf5]{min-height:52px;padding:0 var(--designer-space-md);border-bottom:1px solid var(--designer-border);font-size:var(--designer-font-sm);align-items:center;gap:8px;display:flex}.property-icon[data-v-d42babf5]{color:var(--designer-primary);font-size:16px}.properties-empty[data-v-d42babf5]{padding:22px var(--designer-space-md);color:var(--designer-muted);font-size:var(--designer-font-sm);line-height:1.5}.layers[data-v-d42babf5]{padding:12px var(--designer-space-md);border-top:1px solid var(--designer-border);margin-top:auto}.layers-title[data-v-d42babf5]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}.layer-empty[data-v-d42babf5]{color:var(--designer-muted);font-size:var(--designer-font-sm)}.side-info[data-v-ee9b479a]{border-top:1px solid var(--designer-border);height:fit-content;min-height:0;max-height:150px;color:var(--designer-muted);font-size:var(--designer-font-sm);flex-direction:column;flex:0 auto;padding:12px 0 16px 14px;display:flex;overflow:hidden}.info-title[data-v-ee9b479a]{color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;padding-right:14px}.info-list[data-v-ee9b479a]{flex:0 auto;width:100%;min-width:0;min-height:0}.info-list.scrollable[data-v-ee9b479a]{flex:0 0 102px;height:102px;overflow:hidden}.info-list[data-v-ee9b479a] [data-overlayscrollbars-viewport]{max-height:150px!important;overflow-y:scroll!important}.info-list[data-v-ee9b479a] [data-overlayscrollbars-contents]{box-sizing:border-box;width:100%;min-width:0;padding:0 14px 8px 0}[data-overlayscrollbars].info-list[data-v-ee9b479a]{max-height:150px}.info-row[data-v-ee9b479a]{align-items:flex-start;gap:8px;line-height:1.4;display:flex}.info-row+.info-row[data-v-ee9b479a]{margin-top:7px}.info-dot[data-v-ee9b479a]{background:var(--color-accent-3,#c9973f);border-radius:50%;flex:none;width:7px;height:7px;margin-top:4px}.info-dot.complete[data-v-ee9b479a]{background:var(--color-success,#5aab72)}.template-list[data-v-927e0835]{box-sizing:border-box;border-bottom:1px solid var(--designer-border);width:100%;min-width:0;min-height:0;padding:12px 0 10px;overflow:hidden}.section-head[data-v-927e0835]{padding:0 var(--designer-space-sm) 8px;color:var(--designer-muted);font-size:var(--designer-font-xs);letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;align-items:center;display:flex}.section-head button[data-v-927e0835]{border:1px solid var(--designer-border);background:var(--designer-panel);width:19px;height:19px;color:var(--designer-muted);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.section-head button span[data-v-927e0835]{line-height:1;display:block;transform:translateY(-1px)}.template-tabs[data-v-927e0835]{flex-direction:column;flex:auto;width:100%;min-width:0;height:0;min-height:0;display:flex;overflow:hidden}.template-tab[data-v-927e0835]{box-sizing:border-box;width:calc(100% - 13px);min-width:0;color:var(--designer-muted);font:inherit;font-size:var(--designer-font-sm);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;gap:7px;margin:0 6px 3px;padding:10px 9px;display:flex}.template-tab[data-v-927e0835]:last-of-type{margin-bottom:0}.template-tab[data-v-927e0835]:hover,.template-tab.active[data-v-927e0835]{background:var(--designer-panel-raised);color:var(--designer-primary)}.tab-icon[data-v-927e0835]{width:14px;height:14px;color:var(--designer-muted);flex:none;font-size:14px}.tab-label[data-v-927e0835]{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.tab-label-input[data-v-927e0835]{box-sizing:border-box;border:1px solid var(--designer-border);background:var(--designer-shell);width:100%;color:var(--designer-text);font:inherit;border-radius:3px;outline:0;padding:1px 3px}.tab-channel[data-v-927e0835]{border:1px solid var(--designer-border);background:var(--designer-panel);color:var(--designer-muted);text-transform:uppercase;border-radius:4px;flex:none;padding:1px 4px;font-size:9px;line-height:1.1}.tab-version[data-v-927e0835]{color:var(--designer-muted);font-size:var(--designer-font-xs)}.tab-changed[data-v-927e0835]{background:var(--color-warning,#c9973f);border-radius:50%;flex:none;width:5px;height:5px;transform:translateY(1px)}.empty-list[data-v-927e0835]{color:var(--designer-muted);font-size:var(--designer-font-sm);margin:0;padding:10px 15px}[data-overlayscrollbars].template-tabs[data-v-927e0835]{flex:auto;width:100%;height:0;min-height:0}.template-tabs[data-v-927e0835] [data-overlayscrollbars-viewport]{height:100%!important;overflow-y:scroll!important}.template-tabs[data-v-927e0835] [data-overlayscrollbars-contents]{box-sizing:border-box;width:100%;min-width:0;padding:0 6px 8px 0}section[data-v-9c3240d0]{box-sizing:border-box;flex-direction:column;height:100%;min-height:0;max-height:100vh;display:flex;position:relative;overflow:hidden}.contents[data-v-9c3240d0]{box-sizing:border-box;flex:auto;height:auto;min-height:0;max-height:none;display:flex;overflow:hidden}.contents aside[data-v-9c3240d0]{border-right:1px solid var(--designer-border);flex-direction:column;flex:0 0 200px;width:200px;min-height:0;max-height:100%;display:flex;overflow:hidden}.contents .sidebar-panels[data-v-9c3240d0]{grid-template-rows:var(--screens-height) 9px minmax(0, calc(100% - var(--screens-height) - 9px));flex:1;min-height:0;display:grid}.contents .sidebar-panels>[data-v-9c3240d0]{min-height:0}.contents .panel-resizer[data-v-9c3240d0]{border:0;border-top:1px solid color-mix(in srgb, var(--designer-border) 55%, transparent);border-bottom:1px solid color-mix(in srgb, var(--designer-border) 55%, transparent);cursor:row-resize;background:0 0;justify-content:center;align-items:center;width:100%;padding:0;display:flex}.contents .panel-resizer span[data-v-9c3240d0]{background:var(--designer-border);border-radius:3px;width:28px;height:3px}.contents .panel-resizer:hover span[data-v-9c3240d0]{background:var(--designer-primary)}.contents .workspace[data-v-9c3240d0]{flex:1;min-width:0;max-height:100%}.contents .properties[data-v-9c3240d0]{border-left:1px solid var(--designer-border);flex:0 0 240px;width:240px;min-height:0;max-height:100%;overflow:auto}.container-component[data-v-42c23412]{box-sizing:border-box;min-width:0;color:var(--designer-text,#111)}.empty[data-v-42c23412]{border:1px dashed var(--designer-border,#d9d5cf);min-height:24px;color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.card-component[data-v-b06c1052]{box-sizing:border-box;min-width:0;color:var(--designer-text,#111);background:var(--designer-panel,#fff)}.empty[data-v-b06c1052]{border:1px dashed var(--designer-border,#d9d5cf);min-height:24px;color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.divider-component[data-v-a6e861b8]{width:100%;color:var(--designer-muted,#6b7280);align-items:center;gap:10px;font-size:.8em;display:flex}.divider-component[data-v-a6e861b8]:before,.divider-component[data-v-a6e861b8]:after{background:var(--designer-border,#e5e7eb);content:"";flex:1;height:1px}.layout-component[data-v-be209bd5]{min-width:0}.empty[data-v-be209bd5]{border:1px dashed var(--designer-border,#d9d5cf);color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.layout-ref-component[data-v-d41ee6eb]{min-width:0;padding-top:22px;position:relative}.badge[data-v-d41ee6eb]{color:var(--designer-primary,#2563eb);font-size:.72em;position:absolute;top:0;left:0}.empty[data-v-d41ee6eb]{border:1px dashed var(--designer-border,#d9d5cf);color:var(--designer-muted,#6b7280);text-align:center;padding:12px}.field-component[data-v-c7f2e797]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-c7f2e797]{font-size:.85em;font-weight:600}.label b[data-v-c7f2e797]{color:#dc2626;margin-left:2px}input[data-v-c7f2e797]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-b5ed7071]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-b5ed7071]{font-size:.85em;font-weight:600}.label b[data-v-b5ed7071]{color:#dc2626;margin-left:2px}input[data-v-b5ed7071]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-ad9dff41]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-ad9dff41]{font-size:.85em;font-weight:600}.label b[data-v-ad9dff41]{color:#dc2626;margin-left:2px}.field-row[data-v-ad9dff41]{justify-content:space-between;gap:8px;display:flex}.field-row a[data-v-ad9dff41]{color:var(--designer-primary,#2563eb);font-size:.85em}input[data-v-ad9dff41]{box-sizing:border-box;border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;border-radius:7px;padding:9px 10px}.field-component[data-v-1914959e]{color:var(--designer-text,#111);gap:6px;display:grid}.label[data-v-1914959e]{font-size:.85em;font-weight:600}.otp-row[data-v-1914959e]{gap:6px;display:flex}.otp-box[data-v-1914959e]{border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);border-radius:6px;width:2em;height:2.3em}.checkbox-component[data-v-3d492d6d]{color:var(--designer-text,#111);cursor:default;align-items:center;gap:8px;display:inline-flex}.checkbox-component input[data-v-3d492d6d]{accent-color:var(--designer-primary,#2563eb)}.submit-button[data-v-9807299a]{width:100%;font:inherit;cursor:pointer;border:0;border-radius:7px;padding:10px 14px}.primary[data-v-9807299a]{background:var(--designer-primary,#2563eb);color:#fff}.secondary[data-v-9807299a]{border:1px solid var(--designer-border,#d9d5cf);color:inherit;background:0 0}.social-button[data-v-3045616f]{border:1px solid var(--designer-border,#d9d5cf);background:var(--designer-panel,#fff);width:100%;color:inherit;font:inherit;cursor:pointer;border-radius:7px;justify-content:center;align-items:center;gap:9px;padding:9px 14px;display:flex}.social-icon[data-v-3045616f]{color:#fff;border-radius:4px;place-items:center;width:20px;height:20px;font-size:12px;font-weight:700;display:inline-grid}.text-link[data-v-8d18edb1]{color:var(--designer-primary,#2563eb);text-decoration:none}.text-link[data-v-8d18edb1]:hover{text-decoration:underline}.heading-component[data-v-1c78b10f]{color:var(--designer-text,#111);margin:0}.sm[data-v-1c78b10f]{font-size:1em}.md[data-v-1c78b10f]{font-size:1.2em}.lg[data-v-1c78b10f]{font-size:1.5em}.xl[data-v-1c78b10f]{font-size:1.9em}.text-component[data-v-3be0c0c9]{color:var(--designer-muted,#6b7280);white-space:pre-wrap;margin:0;line-height:1.5}.image-link[data-v-ecc98881]{max-width:100%;text-decoration:none;display:inline-block}.image-component[data-v-ecc98881]{box-sizing:border-box;background:var(--designer-panel-raised,#f5f2ee);min-height:20px;color:var(--designer-muted,#6b7280);place-items:center;display:grid;overflow:hidden}.image-component img[data-v-ecc98881]{object-fit:cover;width:100%;height:100%;display:block}.alert-component[data-v-bf171873]{border-radius:7px;gap:8px;padding:10px 12px;font-size:.9em;display:flex}.info[data-v-bf171873]{color:#1d4ed8;background:#eff6ff}.success[data-v-bf171873]{color:#047857;background:#ecfdf5}.error[data-v-bf171873]{color:#b91c1c;background:#fef2f2}.content-component[data-v-1c551f9d]{min-width:0}.empty[data-v-1c551f9d]{border:1px dashed var(--designer-border,#d9d5cf);min-height:46px;color:var(--designer-muted,#6b7280);text-align:center;padding:14px}.consent-card[data-v-9008f821]{border:1px solid var(--designer-border,#d9d5cf);border-radius:8px;align-items:center;gap:10px;padding:12px;display:flex}.icon[data-v-9008f821]{color:#15803d;background:#dcfce7;border-radius:50%;place-items:center;width:28px;height:28px;font-weight:700;display:grid}.consent-card div[data-v-9008f821]{gap:3px;display:grid}.consent-card span[data-v-9008f821]{color:var(--designer-muted,#6b7280);font-size:.85em}.scope-list[data-v-cdebac9d]{gap:8px;display:grid}.scope[data-v-cdebac9d]{align-items:center;gap:8px;display:flex}.scope>span[data-v-cdebac9d]:first-child{color:#15803d;font-weight:700}
2
2
  /*$vite$:1*/
package/dist/ui-designer.js CHANGED
@@ -1803,7 +1803,7 @@ var Gr = () => {
1803
1803
  })
1804
1804
  ]));
1805
1805
  }
1806
- }), [["__scopeId", "data-v-29d47f96"]]), si = [
1806
+ }), [["__scopeId", "data-v-931b78ec"]]), si = [
1807
1807
  "title",
1808
1808
  "aria-label",
1809
1809
  "disabled"
@@ -1985,35 +1985,62 @@ var Gr = () => {
1985
1985
  function Ei(e, t) {
1986
1986
  return v(), a("section", Ti, [...t[0] ||= [s("<div class=\"properties-head\" data-v-d42babf5><span class=\"property-icon icon\" data-v-d42babf5>radio_button_unchecked</span><strong data-v-d42babf5>No selection</strong></div><div class=\"properties-empty\" data-v-d42babf5>Select an element on the canvas, or add one from the left, to edit its properties here.</div><div class=\"layers\" data-v-d42babf5><div class=\"layers-title\" data-v-d42babf5>Layers</div><div class=\"layer-empty\" data-v-d42babf5>No layers yet.</div></div>", 3)]]);
1987
1987
  }
1988
- var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]]), Oi = { class: "side-info" }, ki = { class: "info-title" }, Ai = /*#__PURE__*/ $(/* @__PURE__ */ u({
1988
+ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]]), Oi = {
1989
+ key: 0,
1990
+ class: "side-info"
1991
+ }, ki = { class: "info-title" }, Ai = 102, ji = /*#__PURE__*/ $(/* @__PURE__ */ u({
1989
1992
  __name: "SideInfo",
1990
- props: { items: { default: () => [{
1991
- id: "configure-screen",
1992
- label: "Configure the selected screen",
1993
- complete: !1
1994
- }, {
1995
- id: "preview-screen",
1996
- label: "Preview before saving",
1997
- complete: !1
1998
- }] } },
1993
+ props: { items: {} },
1999
1994
  setup(t) {
2000
- let n = P();
2001
- return (r, i) => (v(), a("section", Oi, [o("div", ki, T(D(n)("checklist", "Checklist")), 1), (v(!0), a(e, null, b(t.items, (e) => (v(), a("div", {
1995
+ let s = t, c = P(), l = y(), u = y(0), d = n(() => (s.items?.length ?? 0) > 1 && u.value > Ai), m;
1996
+ function _() {
1997
+ u.value = l.value?.scrollHeight ?? 0;
1998
+ }
1999
+ return k(() => s.items, () => void f(_), { deep: !0 }), g(() => {
2000
+ f(() => {
2001
+ _(), m = new ResizeObserver(_), l.value && m.observe(l.value);
2002
+ });
2003
+ }), h(() => m?.disconnect()), (t, n) => s.items?.length ? (v(), a("section", Oi, [o("div", ki, T(D(c)("checklist", "Checklist")), 1), d.value ? (v(), r(D(qr), {
2004
+ key: 0,
2005
+ class: "info-list scrollable",
2006
+ options: {
2007
+ overflow: {
2008
+ x: "hidden",
2009
+ y: "scroll"
2010
+ },
2011
+ scrollbars: { autoHide: "never" }
2012
+ },
2013
+ defer: ""
2014
+ }, {
2015
+ default: j(() => [o("div", {
2016
+ ref_key: "listElement",
2017
+ ref: l
2018
+ }, [(v(!0), a(e, null, b(s.items, (e) => (v(), a("div", {
2019
+ key: e.id,
2020
+ class: "info-row"
2021
+ }, [o("span", { class: p(["info-dot", { complete: e.complete }]) }, null, 2), o("span", null, T(e.label), 1)]))), 128))], 512)]),
2022
+ _: 1
2023
+ })) : (v(), a("div", {
2024
+ key: 1,
2025
+ ref_key: "listElement",
2026
+ ref: l,
2027
+ class: "info-list"
2028
+ }, [(v(!0), a(e, null, b(s.items, (e) => (v(), a("div", {
2002
2029
  key: e.id,
2003
2030
  class: "info-row"
2004
- }, [o("span", { class: p(["info-dot", { complete: e.complete }]) }, null, 2), o("span", null, T(e.label), 1)]))), 128))]));
2031
+ }, [o("span", { class: p(["info-dot", { complete: e.complete }]) }, null, 2), o("span", null, T(e.label), 1)]))), 128))], 512))])) : i("", !0);
2005
2032
  }
2006
- }), [["__scopeId", "data-v-31711f81"]]), ji = { class: "template-list" }, Mi = { class: "section-head" }, Ni = ["title"], Pi = ["aria-label", "title"], Fi = ["onClick"], Ii = {
2033
+ }), [["__scopeId", "data-v-ee9b479a"]]), Mi = { class: "template-list" }, Ni = { class: "section-head" }, Pi = ["title"], Fi = ["aria-label", "title"], Ii = ["onClick"], Li = {
2007
2034
  class: "tab-icon icon",
2008
2035
  "aria-hidden": "true"
2009
- }, Li = ["onKeydown", "onBlur"], Ri = { class: "tab-channel" }, zi = { class: "tab-version" }, Bi = {
2036
+ }, Ri = ["onKeydown", "onBlur"], zi = { class: "tab-channel" }, Bi = { class: "tab-version" }, Vi = {
2010
2037
  key: 2,
2011
2038
  class: "tab-changed",
2012
2039
  "aria-label": "Unsaved changes"
2013
- }, Vi = {
2040
+ }, Hi = {
2014
2041
  key: 0,
2015
2042
  class: "empty-list"
2016
- }, Hi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2043
+ }, Ui = /*#__PURE__*/ $(/* @__PURE__ */ u({
2017
2044
  __name: "TemplateList",
2018
2045
  props: {
2019
2046
  templates: {},
@@ -2044,12 +2071,12 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2044
2071
  }
2045
2072
  return k(() => s.focusedTemplateId, (e) => {
2046
2073
  e && S(e);
2047
- }, { immediate: !0 }), (n, s) => (v(), a("section", ji, [o("div", Mi, [o("span", { title: D(d)("screens", "Screens") }, T(D(d)("screens", "Screens")), 9, Ni), o("button", {
2074
+ }, { immediate: !0 }), (n, s) => (v(), a("section", Mi, [o("div", Ni, [o("span", { title: D(d)("screens", "Screens") }, T(D(d)("screens", "Screens")), 9, Pi), o("button", {
2048
2075
  type: "button",
2049
2076
  "aria-label": D(d)("add-screen", "Add screen"),
2050
2077
  title: D(d)("add-screen", "Add screen"),
2051
2078
  onClick: s[0] ||= (e) => u("add")
2052
- }, [...s[4] ||= [o("span", { "aria-hidden": "true" }, "+", -1)]], 8, Pi)]), l(D(qr), {
2079
+ }, [...s[4] ||= [o("span", { "aria-hidden": "true" }, "+", -1)]], 8, Fi)]), l(D(qr), {
2053
2080
  class: "template-tabs",
2054
2081
  options: {
2055
2082
  overflow: {
@@ -2068,7 +2095,7 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2068
2095
  class: p(["template-tab", { active: t.focusedTemplateId ? e.id === t.focusedTemplateId : n === 0 }]),
2069
2096
  onClick: (t) => u("select", e.id)
2070
2097
  }, [
2071
- o("span", Ii, T(e.icon), 1),
2098
+ o("span", Li, T(e.icon), 1),
2072
2099
  h.value === e.id ? M((v(), a("input", {
2073
2100
  key: 0,
2074
2101
  ref_for: !0,
@@ -2081,7 +2108,7 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2081
2108
  onDblclick: s[3] ||= N(() => {}, ["stop"]),
2082
2109
  onKeydown: [ee(N((t) => w(e), ["prevent"]), ["enter"]), ee(N(E, ["prevent"]), ["esc"])],
2083
2110
  onBlur: (t) => w(e)
2084
- }, null, 40, Li)), [[O, g.value]]) : (v(), r(Yr, {
2111
+ }, null, 40, Ri)), [[O, g.value]]) : (v(), r(Yr, {
2085
2112
  key: 1,
2086
2113
  class: "tab-label",
2087
2114
  onDblclick: N((t) => e.type === "dynamic" && C(e), ["stop"])
@@ -2089,14 +2116,14 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2089
2116
  default: j(() => [c(T(e.name), 1)]),
2090
2117
  _: 2
2091
2118
  }, 1032, ["onDblclick"])),
2092
- o("span", Ri, T(e.channel.charAt(0).toUpperCase()), 1),
2093
- o("span", zi, T(e.version), 1),
2094
- e.changed ? (v(), a("span", Bi)) : i("", !0)
2095
- ], 10, Fi))), 128)), t.templates?.length ? i("", !0) : (v(), a("p", Vi, "No screens yet."))]),
2119
+ o("span", zi, T(e.channel.charAt(0).toUpperCase()), 1),
2120
+ o("span", Bi, T(e.version), 1),
2121
+ e.changed ? (v(), a("span", Vi)) : i("", !0)
2122
+ ], 10, Ii))), 128)), t.templates?.length ? i("", !0) : (v(), a("p", Hi, "No screens yet."))]),
2096
2123
  _: 1
2097
2124
  })]));
2098
2125
  }
2099
- }), [["__scopeId", "data-v-927e0835"]]), Ui = { class: "ui-designer" }, Wi = { class: "contents" }, Gi = "aham-ui-designer-screens-height", Ki = /*#__PURE__*/ $(/* @__PURE__ */ u({
2126
+ }), [["__scopeId", "data-v-927e0835"]]), Wi = { class: "ui-designer" }, Gi = { class: "contents" }, Ki = "aham-ui-designer-screens-height", qi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2100
2127
  __name: "Designer",
2101
2128
  props: {
2102
2129
  value: {},
@@ -2109,12 +2136,15 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2109
2136
  "screenRename"
2110
2137
  ],
2111
2138
  setup(e, { emit: t }) {
2112
- let n = e, r = t, i = y(), s = y([]), c = y(), u = y(50), d = !1;
2113
- k(() => n.options?.templates, (e) => {
2114
- s.value = e ? [...e] : [], !c.value && s.value[0] && (c.value = s.value[0].id);
2139
+ let r = e, i = t, s = y(), c = y([]), u = y(), d = y(50), f = !1, p = n(() => r.options?.checklist?.map((e) => ({
2140
+ ...e,
2141
+ complete: e.check ? e.check({ templates: c.value }) : e.complete
2142
+ })));
2143
+ k(() => r.options?.templates, (e) => {
2144
+ c.value = e ? [...e] : [], !u.value && c.value[0] && (u.value = c.value[0].id);
2115
2145
  }, { immediate: !0 });
2116
- function f() {
2117
- let e = s.value.filter((e) => e.icon === "view_column").length, t = `layout-${Date.now()}`, n = {
2146
+ function _() {
2147
+ let e = c.value.filter((e) => e.icon === "view_column").length, t = `layout-${Date.now()}`, n = {
2118
2148
  id: t,
2119
2149
  name: e ? `New Layout ${e + 1}` : "New Layout",
2120
2150
  version: "1",
@@ -2123,71 +2153,71 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2123
2153
  changed: !0,
2124
2154
  type: "dynamic"
2125
2155
  };
2126
- s.value.push(n), c.value = t, r("screenAdd", n), r("screenSelect", n);
2156
+ c.value.push(n), u.value = t, i("screenAdd", n), i("screenSelect", n);
2127
2157
  }
2128
- function p(e, t) {
2129
- let n = s.value.find((t) => t.id === e);
2130
- n && (n.name = t, r("screenRename", e, t));
2158
+ function b(e, t) {
2159
+ let n = c.value.find((t) => t.id === e);
2160
+ n && (n.name = t, i("screenRename", e, t));
2131
2161
  }
2132
- function _(e) {
2133
- let t = s.value.find((t) => t.id === e);
2134
- t && (c.value = e, r("screenSelect", t));
2162
+ function x(e) {
2163
+ let t = c.value.find((t) => t.id === e);
2164
+ t && (u.value = e, i("screenSelect", t));
2135
2165
  }
2136
- function b(e) {
2137
- r("moreSelect", e);
2166
+ function C(e) {
2167
+ i("moreSelect", e);
2138
2168
  }
2139
- function x() {
2140
- d && (d = !1, document.body.style.removeProperty("cursor"), document.removeEventListener("pointermove", C), document.removeEventListener("pointerup", x));
2169
+ function w() {
2170
+ f && (f = !1, document.body.style.removeProperty("cursor"), document.removeEventListener("pointermove", T), document.removeEventListener("pointerup", w));
2141
2171
  }
2142
- function C(e) {
2143
- let t = i.value?.getBoundingClientRect();
2172
+ function T(e) {
2173
+ let t = s.value?.getBoundingClientRect();
2144
2174
  if (!t) return;
2145
2175
  let n = (e.clientY - t.top) / t.height * 100;
2146
- u.value = Math.min(80, Math.max(20, n));
2176
+ d.value = Math.min(80, Math.max(20, n));
2147
2177
  }
2148
- function w(e) {
2149
- d = !0, document.body.style.cursor = "row-resize", document.addEventListener("pointermove", C), document.addEventListener("pointerup", x), e.currentTarget.setPointerCapture?.(e.pointerId);
2178
+ function E(e) {
2179
+ f = !0, document.body.style.cursor = "row-resize", document.addEventListener("pointermove", T), document.addEventListener("pointerup", w), e.currentTarget.setPointerCapture?.(e.pointerId);
2150
2180
  }
2151
2181
  return g(() => {
2152
- let e = Number(localStorage.getItem(Gi));
2153
- Number.isFinite(e) && (u.value = Math.min(80, Math.max(20, e)));
2154
- }), k(u, (e) => {
2155
- localStorage.setItem(Gi, String(e));
2156
- }), h(x), (t, n) => {
2182
+ let e = Number(localStorage.getItem(Ki));
2183
+ Number.isFinite(e) && (d.value = Math.min(80, Math.max(20, e)));
2184
+ }), k(d, (e) => {
2185
+ localStorage.setItem(Ki, String(e));
2186
+ }), h(w), (t, n) => {
2157
2187
  let r = S("Workspace");
2158
- return v(), a("section", Ui, [l(Ci, {
2188
+ return v(), a("section", Wi, [l(Ci, {
2159
2189
  subject: e.options?.subject ?? "",
2160
2190
  shared: e.options?.shared,
2161
2191
  "theme-changeable": e.options?.theme?.changeable,
2162
2192
  "more-items": e.options?.moreItems,
2163
- onMoreSelect: b
2193
+ onMoreSelect: C
2164
2194
  }, null, 8, [
2165
2195
  "subject",
2166
2196
  "shared",
2167
2197
  "theme-changeable",
2168
2198
  "more-items"
2169
- ]), o("div", Wi, [
2199
+ ]), o("div", Gi, [
2170
2200
  o("aside", null, [o("div", {
2171
2201
  ref_key: "sidebarPanels",
2172
- ref: i,
2202
+ ref: s,
2173
2203
  class: "sidebar-panels",
2174
- style: m({ "--screens-height": `${u.value}%` })
2204
+ style: m({ "--screens-height": `${d.value}%` })
2175
2205
  }, [
2176
- l(Hi, {
2177
- templates: s.value,
2178
- "focused-template-id": c.value,
2179
- onAdd: f,
2180
- onRename: p,
2181
- onSelect: _
2206
+ l(Ui, {
2207
+ templates: c.value,
2208
+ "focused-template-id": u.value,
2209
+ onAdd: _,
2210
+ onRename: b,
2211
+ onSelect: x
2182
2212
  }, null, 8, ["templates", "focused-template-id"]),
2183
2213
  o("button", {
2184
2214
  type: "button",
2185
2215
  class: "panel-resizer",
2186
2216
  "aria-label": "Resize screens and components panels",
2187
- onPointerdown: w
2217
+ onPointerdown: E
2188
2218
  }, [...n[0] ||= [o("span", { "aria-hidden": "true" }, null, -1)]], 32),
2189
2219
  l(oi)
2190
- ], 4), l(Ai, { items: e.options?.checklist }, null, 8, ["items"])]),
2220
+ ], 4), l(ji, { items: p.value }, null, 8, ["items"])]),
2191
2221
  l(r, {
2192
2222
  class: "workspace",
2193
2223
  subject: e.options?.subject ?? ""
@@ -2196,15 +2226,12 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2196
2226
  ])]);
2197
2227
  };
2198
2228
  }
2199
- }), [["__scopeId", "data-v-da3e0d0f"]]), qi = te("checklist", {
2229
+ }), [["__scopeId", "data-v-9c3240d0"]]), Ji = te("checklist", {
2200
2230
  state: () => ({ items: [{
2201
- id: "configure-screen",
2202
- label: "Configure the selected screen",
2203
- complete: !1
2204
- }, {
2205
- id: "preview-screen",
2206
- label: "Preview before saving",
2207
- complete: !1
2231
+ id: "all-screens-completed",
2232
+ label: "All screens completed",
2233
+ complete: !1,
2234
+ check: ({ templates: e }) => e.length > 0 && e.every((e) => !e.changed)
2208
2235
  }] }),
2209
2236
  actions: {
2210
2237
  setComplete(e, t = !0) {
@@ -2217,7 +2244,7 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2217
2244
  });
2218
2245
  }
2219
2246
  }
2220
- }), Ji = te("screens", {
2247
+ }), Yi = te("screens", {
2221
2248
  state: () => ({
2222
2249
  screens: [],
2223
2250
  screen: null
@@ -2252,10 +2279,10 @@ var Di = /*#__PURE__*/ $(wi, [["render", Ei], ["__scopeId", "data-v-d42babf5"]])
2252
2279
  });
2253
2280
  //#endregion
2254
2281
  //#region src/widgets/components/types.ts
2255
- function Yi(e) {
2282
+ function Xi(e) {
2256
2283
  if (e !== void 0 && e !== "") return typeof e == "number" || /^-?\d+(?:\.\d+)?$/.test(String(e)) ? `${e}px` : String(e);
2257
2284
  }
2258
- function Xi(e) {
2285
+ function Zi(e) {
2259
2286
  let t = {};
2260
2287
  for (let n of [
2261
2288
  "width",
@@ -2266,10 +2293,10 @@ function Xi(e) {
2266
2293
  "borderWidth",
2267
2294
  "radius"
2268
2295
  ]) {
2269
- let r = Yi(e[n]);
2296
+ let r = Xi(e[n]);
2270
2297
  r && (t[n === "radius" ? "borderRadius" : n] = r);
2271
2298
  }
2272
- if (e.background && (t.background = e.background), e.layout === "grid" ? (t.display = "grid", t.gridTemplateColumns = e.columns || "1fr 1fr", t.alignItems = e.align || "stretch") : e.layout === "block" ? t.display = "block" : (t.display = "flex", t.flexDirection = e.direction || "column", t.alignItems = e.align || "stretch", t.justifyContent = e.justify || "flex-start"), e.layout !== "block" && e.gap !== void 0 && (t.gap = Yi(e.gap) || "0"), e.borderStyle && e.borderStyle !== "none" && (t.border = `${Yi(e.borderWidth) || "1px"} ${e.borderStyle} ${e.borderColor || "currentColor"}`), e.position) {
2299
+ if (e.background && (t.background = e.background), e.layout === "grid" ? (t.display = "grid", t.gridTemplateColumns = e.columns || "1fr 1fr", t.alignItems = e.align || "stretch") : e.layout === "block" ? t.display = "block" : (t.display = "flex", t.flexDirection = e.direction || "column", t.alignItems = e.align || "stretch", t.justifyContent = e.justify || "flex-start"), e.layout !== "block" && e.gap !== void 0 && (t.gap = Xi(e.gap) || "0"), e.borderStyle && e.borderStyle !== "none" && (t.border = `${Xi(e.borderWidth) || "1px"} ${e.borderStyle} ${e.borderColor || "currentColor"}`), e.position) {
2273
2300
  t.position = e.position;
2274
2301
  for (let n of [
2275
2302
  "left",
@@ -2277,7 +2304,7 @@ function Xi(e) {
2277
2304
  "right",
2278
2305
  "bottom"
2279
2306
  ]) {
2280
- let r = Yi(e[n]);
2307
+ let r = Xi(e[n]);
2281
2308
  r && (t[n] = r);
2282
2309
  }
2283
2310
  }
@@ -2285,7 +2312,7 @@ function Xi(e) {
2285
2312
  }
2286
2313
  //#endregion
2287
2314
  //#region src/widgets/components/Container.vue
2288
- var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2315
+ var Qi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2289
2316
  __name: "Container",
2290
2317
  props: {
2291
2318
  width: {},
@@ -2310,13 +2337,13 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2310
2337
  bottom: {}
2311
2338
  },
2312
2339
  setup(e) {
2313
- let t = e, r = n(() => Xi(t));
2340
+ let t = e, r = n(() => Zi(t));
2314
2341
  return (e, t) => (v(), a("div", {
2315
2342
  class: "container-component",
2316
2343
  style: m(r.value)
2317
2344
  }, [x(e.$slots, "default", {}, () => [t[0] ||= o("div", { class: "empty" }, "Drop components here", -1)], !0)], 4));
2318
2345
  }
2319
- }), [["__scopeId", "data-v-42c23412"]]), Qi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2346
+ }), [["__scopeId", "data-v-42c23412"]]), $i = /*#__PURE__*/ $(/* @__PURE__ */ u({
2320
2347
  __name: "Card",
2321
2348
  props: {
2322
2349
  shadow: {
@@ -2346,7 +2373,7 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2346
2373
  },
2347
2374
  setup(e) {
2348
2375
  let t = e, r = n(() => ({
2349
- ...Xi(t),
2376
+ ...Zi(t),
2350
2377
  boxShadow: t.shadow ? "var(--shadow-soft, 0 8px 24px rgb(0 0 0 / 10%))" : "none"
2351
2378
  }));
2352
2379
  return (e, t) => (v(), a("div", {
@@ -2354,7 +2381,7 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2354
2381
  style: m(r.value)
2355
2382
  }, [x(e.$slots, "default", {}, () => [t[0] ||= o("div", { class: "empty" }, "Drop components here", -1)], !0)], 4));
2356
2383
  }
2357
- }), [["__scopeId", "data-v-b06c1052"]]), $i = /* @__PURE__ */ u({
2384
+ }), [["__scopeId", "data-v-b06c1052"]]), ea = /* @__PURE__ */ u({
2358
2385
  __name: "Spacer",
2359
2386
  props: { height: { default: 20 } },
2360
2387
  setup(e) {
@@ -2364,13 +2391,13 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2364
2391
  "aria-hidden": "true"
2365
2392
  }, null, 4));
2366
2393
  }
2367
- }), ea = { class: "divider-component" }, ta = { key: 0 }, na = /*#__PURE__*/ $(/* @__PURE__ */ u({
2394
+ }), ta = { class: "divider-component" }, na = { key: 0 }, ra = /*#__PURE__*/ $(/* @__PURE__ */ u({
2368
2395
  __name: "Divider",
2369
2396
  props: { label: { default: "or" } },
2370
2397
  setup(e) {
2371
- return (t, n) => (v(), a("div", ea, [e.label ? (v(), a("span", ta, T(e.label), 1)) : i("", !0)]));
2398
+ return (t, n) => (v(), a("div", ta, [e.label ? (v(), a("span", na, T(e.label), 1)) : i("", !0)]));
2372
2399
  }
2373
- }), [["__scopeId", "data-v-a6e861b8"]]), ra = /*#__PURE__*/ $(/* @__PURE__ */ u({
2400
+ }), [["__scopeId", "data-v-a6e861b8"]]), ia = /*#__PURE__*/ $(/* @__PURE__ */ u({
2374
2401
  __name: "Layout",
2375
2402
  props: {
2376
2403
  direction: { default: "column" },
@@ -2389,16 +2416,16 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2389
2416
  style: m(r.value)
2390
2417
  }, [x(e.$slots, "default", {}, () => [t[0] ||= o("div", { class: "empty" }, "Drop components here", -1)], !0)], 4));
2391
2418
  }
2392
- }), [["__scopeId", "data-v-be209bd5"]]), ia = { class: "layout-ref-component" }, aa = { class: "badge" }, oa = { key: 0 }, sa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2419
+ }), [["__scopeId", "data-v-be209bd5"]]), aa = { class: "layout-ref-component" }, oa = { class: "badge" }, sa = { key: 0 }, ca = /*#__PURE__*/ $(/* @__PURE__ */ u({
2393
2420
  __name: "LayoutRef",
2394
2421
  props: {
2395
2422
  layoutKey: { default: "" },
2396
2423
  label: { default: "Layout" }
2397
2424
  },
2398
2425
  setup(e) {
2399
- return (t, n) => (v(), a("div", ia, [o("div", aa, [c("◆ " + T(e.label), 1), e.layoutKey ? (v(), a("span", oa, " · " + T(e.layoutKey), 1)) : i("", !0)]), x(t.$slots, "default", {}, () => [n[0] ||= o("div", { class: "empty" }, "Drop components here", -1)], !0)]));
2426
+ return (t, n) => (v(), a("div", aa, [o("div", oa, [c("◆ " + T(e.label), 1), e.layoutKey ? (v(), a("span", sa, " · " + T(e.layoutKey), 1)) : i("", !0)]), x(t.$slots, "default", {}, () => [n[0] ||= o("div", { class: "empty" }, "Drop components here", -1)], !0)]));
2400
2427
  }
2401
- }), [["__scopeId", "data-v-d41ee6eb"]]), ca = { class: "field-component" }, la = { class: "label" }, ua = { key: 0 }, da = ["value", "placeholder"], fa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2428
+ }), [["__scopeId", "data-v-d41ee6eb"]]), la = { class: "field-component" }, ua = { class: "label" }, da = { key: 0 }, fa = ["value", "placeholder"], pa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2402
2429
  __name: "EmailInput",
2403
2430
  props: {
2404
2431
  label: { default: "Email" },
@@ -2410,14 +2437,14 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2410
2437
  modelValue: {}
2411
2438
  },
2412
2439
  setup(e) {
2413
- return (t, n) => (v(), a("label", ca, [o("span", la, [c(T(e.label), 1), e.required ? (v(), a("b", ua, "*")) : i("", !0)]), o("input", {
2440
+ return (t, n) => (v(), a("label", la, [o("span", ua, [c(T(e.label), 1), e.required ? (v(), a("b", da, "*")) : i("", !0)]), o("input", {
2414
2441
  value: e.modelValue,
2415
2442
  type: "email",
2416
2443
  placeholder: e.placeholder,
2417
2444
  readonly: ""
2418
- }, null, 8, da)]));
2445
+ }, null, 8, fa)]));
2419
2446
  }
2420
- }), [["__scopeId", "data-v-c7f2e797"]]), pa = { class: "field-component" }, ma = { class: "label" }, ha = { key: 0 }, ga = ["value", "placeholder"], _a = /*#__PURE__*/ $(/* @__PURE__ */ u({
2447
+ }), [["__scopeId", "data-v-c7f2e797"]]), ma = { class: "field-component" }, ha = { class: "label" }, ga = { key: 0 }, _a = ["value", "placeholder"], va = /*#__PURE__*/ $(/* @__PURE__ */ u({
2421
2448
  __name: "TextInput",
2422
2449
  props: {
2423
2450
  label: { default: "Full name" },
@@ -2429,14 +2456,14 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2429
2456
  modelValue: {}
2430
2457
  },
2431
2458
  setup(e) {
2432
- return (t, n) => (v(), a("label", pa, [o("span", ma, [c(T(e.label), 1), e.required ? (v(), a("b", ha, "*")) : i("", !0)]), o("input", {
2459
+ return (t, n) => (v(), a("label", ma, [o("span", ha, [c(T(e.label), 1), e.required ? (v(), a("b", ga, "*")) : i("", !0)]), o("input", {
2433
2460
  value: e.modelValue,
2434
2461
  type: "text",
2435
2462
  placeholder: e.placeholder,
2436
2463
  readonly: ""
2437
- }, null, 8, ga)]));
2464
+ }, null, 8, _a)]));
2438
2465
  }
2439
- }), [["__scopeId", "data-v-b5ed7071"]]), va = { class: "field-component" }, ya = { class: "field-row" }, ba = { class: "label" }, xa = { key: 0 }, Sa = ["value", "placeholder"], Ca = /*#__PURE__*/ $(/* @__PURE__ */ u({
2466
+ }), [["__scopeId", "data-v-b5ed7071"]]), ya = { class: "field-component" }, ba = { class: "field-row" }, xa = { class: "label" }, Sa = { key: 0 }, Ca = ["value", "placeholder"], wa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2440
2467
  __name: "PasswordInput",
2441
2468
  props: {
2442
2469
  label: { default: "Password" },
@@ -2452,7 +2479,7 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2452
2479
  modelValue: {}
2453
2480
  },
2454
2481
  setup(e) {
2455
- return (t, n) => (v(), a("label", va, [o("span", ya, [o("span", ba, [c(T(e.label), 1), e.required ? (v(), a("b", xa, "*")) : i("", !0)]), e.showForgot ? (v(), a("a", {
2482
+ return (t, n) => (v(), a("label", ya, [o("span", ba, [o("span", xa, [c(T(e.label), 1), e.required ? (v(), a("b", Sa, "*")) : i("", !0)]), e.showForgot ? (v(), a("a", {
2456
2483
  key: 0,
2457
2484
  href: "#",
2458
2485
  onClick: n[0] ||= N(() => {}, ["prevent"])
@@ -2461,9 +2488,9 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2461
2488
  type: "password",
2462
2489
  placeholder: e.placeholder,
2463
2490
  readonly: ""
2464
- }, null, 8, Sa)]));
2491
+ }, null, 8, Ca)]));
2465
2492
  }
2466
- }), [["__scopeId", "data-v-ad9dff41"]]), wa = { class: "field-component" }, Ta = { class: "label" }, Ea = { class: "otp-row" }, Da = /*#__PURE__*/ $(/* @__PURE__ */ u({
2493
+ }), [["__scopeId", "data-v-ad9dff41"]]), Ta = { class: "field-component" }, Ea = { class: "label" }, Da = { class: "otp-row" }, Oa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2467
2494
  __name: "OtpInput",
2468
2495
  props: {
2469
2496
  label: { default: "Verification code" },
@@ -2471,12 +2498,12 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2471
2498
  },
2472
2499
  setup(t) {
2473
2500
  let r = t, i = n(() => Array.from({ length: Math.max(1, r.digits) }));
2474
- return (n, r) => (v(), a("div", wa, [o("span", Ta, T(t.label), 1), o("div", Ea, [(v(!0), a(e, null, b(i.value, (e, t) => (v(), a("span", {
2501
+ return (n, r) => (v(), a("div", Ta, [o("span", Ea, T(t.label), 1), o("div", Da, [(v(!0), a(e, null, b(i.value, (e, t) => (v(), a("span", {
2475
2502
  key: t,
2476
2503
  class: "otp-box"
2477
2504
  }))), 128))])]));
2478
2505
  }
2479
- }), [["__scopeId", "data-v-1914959e"]]), Oa = { class: "checkbox-component" }, ka = ["checked"], Aa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2506
+ }), [["__scopeId", "data-v-1914959e"]]), ka = { class: "checkbox-component" }, Aa = ["checked"], ja = /*#__PURE__*/ $(/* @__PURE__ */ u({
2480
2507
  __name: "Checkbox",
2481
2508
  props: {
2482
2509
  label: { default: "Remember me" },
@@ -2487,13 +2514,13 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2487
2514
  modelValue: { type: Boolean }
2488
2515
  },
2489
2516
  setup(e) {
2490
- return (t, n) => (v(), a("label", Oa, [o("input", {
2517
+ return (t, n) => (v(), a("label", ka, [o("input", {
2491
2518
  type: "checkbox",
2492
2519
  checked: e.modelValue ?? e.checked,
2493
2520
  readonly: ""
2494
- }, null, 8, ka), o("span", null, T(e.label), 1)]));
2521
+ }, null, 8, Aa), o("span", null, T(e.label), 1)]));
2495
2522
  }
2496
- }), [["__scopeId", "data-v-3d492d6d"]]), ja = /*#__PURE__*/ $(/* @__PURE__ */ u({
2523
+ }), [["__scopeId", "data-v-3d492d6d"]]), Ma = /*#__PURE__*/ $(/* @__PURE__ */ u({
2497
2524
  __name: "SubmitButton",
2498
2525
  props: {
2499
2526
  text: { default: "Sign in" },
@@ -2505,10 +2532,10 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2505
2532
  class: p(["submit-button", e.style])
2506
2533
  }, T(e.text), 3));
2507
2534
  }
2508
- }), [["__scopeId", "data-v-9807299a"]]), Ma = {
2535
+ }), [["__scopeId", "data-v-9807299a"]]), Na = {
2509
2536
  type: "button",
2510
2537
  class: "social-button"
2511
- }, Na = /*#__PURE__*/ $(/* @__PURE__ */ u({
2538
+ }, Pa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2512
2539
  __name: "SocialButton",
2513
2540
  props: {
2514
2541
  provider: { default: "google" },
@@ -2533,16 +2560,16 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2533
2560
  color: "#111"
2534
2561
  }
2535
2562
  }, i = n(() => r[t.provider]);
2536
- return (t, n) => (v(), a("button", Ma, [o("span", {
2563
+ return (t, n) => (v(), a("button", Na, [o("span", {
2537
2564
  class: "social-icon",
2538
2565
  style: m({ background: i.value.color })
2539
2566
  }, T(i.value.letter), 5), c(T(e.text), 1)]));
2540
2567
  }
2541
- }), [["__scopeId", "data-v-3045616f"]]), Pa = [
2568
+ }), [["__scopeId", "data-v-3045616f"]]), Fa = [
2542
2569
  "href",
2543
2570
  "target",
2544
2571
  "rel"
2545
- ], Fa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2572
+ ], Ia = /*#__PURE__*/ $(/* @__PURE__ */ u({
2546
2573
  __name: "TextLink",
2547
2574
  props: {
2548
2575
  text: { default: "Forgot password?" },
@@ -2555,9 +2582,9 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2555
2582
  href: e.href,
2556
2583
  target: e.target,
2557
2584
  rel: e.target === "_blank" ? "noopener noreferrer" : void 0
2558
- }, T(e.text), 9, Pa));
2585
+ }, T(e.text), 9, Fa));
2559
2586
  }
2560
- }), [["__scopeId", "data-v-8d18edb1"]]), Ia = /*#__PURE__*/ $(/* @__PURE__ */ u({
2587
+ }), [["__scopeId", "data-v-8d18edb1"]]), La = /*#__PURE__*/ $(/* @__PURE__ */ u({
2561
2588
  __name: "Heading",
2562
2589
  props: {
2563
2590
  text: { default: "Welcome back" },
@@ -2570,17 +2597,17 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2570
2597
  _: 1
2571
2598
  }, 8, ["class"]));
2572
2599
  }
2573
- }), [["__scopeId", "data-v-1c78b10f"]]), La = { class: "text-component" }, Ra = /*#__PURE__*/ $(/* @__PURE__ */ u({
2600
+ }), [["__scopeId", "data-v-1c78b10f"]]), Ra = { class: "text-component" }, za = /*#__PURE__*/ $(/* @__PURE__ */ u({
2574
2601
  __name: "Text",
2575
2602
  props: { text: { default: "Enter your details to continue." } },
2576
2603
  setup(e) {
2577
- return (t, n) => (v(), a("p", La, T(e.text), 1));
2604
+ return (t, n) => (v(), a("p", Ra, T(e.text), 1));
2578
2605
  }
2579
- }), [["__scopeId", "data-v-3be0c0c9"]]), za = [
2606
+ }), [["__scopeId", "data-v-3be0c0c9"]]), Ba = [
2580
2607
  "href",
2581
2608
  "target",
2582
2609
  "rel"
2583
- ], Ba = ["src", "alt"], Va = { key: 1 }, Ha = ["src", "alt"], Ua = { key: 1 }, Wa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2610
+ ], Va = ["src", "alt"], Ha = { key: 1 }, Ua = ["src", "alt"], Wa = { key: 1 }, Ga = /*#__PURE__*/ $(/* @__PURE__ */ u({
2584
2611
  __name: "Image",
2585
2612
  props: {
2586
2613
  src: { default: "" },
@@ -2611,7 +2638,7 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2611
2638
  key: 0,
2612
2639
  src: e.src,
2613
2640
  alt: e.alt
2614
- }, null, 8, Ba)) : (v(), a("span", Va, T(e.alt), 1))], 4)], 8, za)) : (v(), a("div", {
2641
+ }, null, 8, Va)) : (v(), a("span", Ha, T(e.alt), 1))], 4)], 8, Ba)) : (v(), a("div", {
2615
2642
  key: 1,
2616
2643
  class: "image-component",
2617
2644
  style: m(i.value)
@@ -2619,36 +2646,36 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2619
2646
  key: 0,
2620
2647
  src: e.src,
2621
2648
  alt: e.alt
2622
- }, null, 8, Ha)) : (v(), a("span", Ua, T(e.alt), 1))], 4));
2649
+ }, null, 8, Ua)) : (v(), a("span", Wa, T(e.alt), 1))], 4));
2623
2650
  }
2624
- }), [["__scopeId", "data-v-ecc98881"]]), Ga = { "aria-hidden": "true" }, Ka = /*#__PURE__*/ $(/* @__PURE__ */ u({
2651
+ }), [["__scopeId", "data-v-ecc98881"]]), Ka = { "aria-hidden": "true" }, qa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2625
2652
  __name: "Alert",
2626
2653
  props: {
2627
2654
  tone: { default: "info" },
2628
2655
  text: { default: "Check your inbox for the reset link." }
2629
2656
  },
2630
2657
  setup(e) {
2631
- return (t, n) => (v(), a("div", { class: p(["alert-component", e.tone]) }, [o("span", Ga, T(e.tone === "error" ? "⚠" : e.tone === "success" ? "✓" : "ⓘ"), 1), o("span", null, T(e.text), 1)], 2));
2658
+ return (t, n) => (v(), a("div", { class: p(["alert-component", e.tone]) }, [o("span", Ka, T(e.tone === "error" ? "⚠" : e.tone === "success" ? "✓" : "ⓘ"), 1), o("span", null, T(e.text), 1)], 2));
2632
2659
  }
2633
- }), [["__scopeId", "data-v-bf171873"]]), qa = { class: "content-component" }, Ja = { class: "empty" }, Ya = /*#__PURE__*/ $(/* @__PURE__ */ u({
2660
+ }), [["__scopeId", "data-v-bf171873"]]), Ja = { class: "content-component" }, Ya = { class: "empty" }, Xa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2634
2661
  __name: "Content",
2635
2662
  props: { note: { default: "Page content goes here" } },
2636
2663
  setup(e) {
2637
- return (t, n) => (v(), a("div", qa, [x(t.$slots, "default", {}, () => [o("div", Ja, T(e.note), 1)], !0)]));
2664
+ return (t, n) => (v(), a("div", Ja, [x(t.$slots, "default", {}, () => [o("div", Ya, T(e.note), 1)], !0)]));
2638
2665
  }
2639
- }), [["__scopeId", "data-v-1c551f9d"]]), Xa = { class: "consent-card" }, Za = /*#__PURE__*/ $(/* @__PURE__ */ u({
2666
+ }), [["__scopeId", "data-v-1c551f9d"]]), Za = { class: "consent-card" }, Qa = /*#__PURE__*/ $(/* @__PURE__ */ u({
2640
2667
  __name: "ConsentCard",
2641
2668
  props: {
2642
2669
  appName: { default: "Acme Analytics" },
2643
2670
  requestedBy: { default: "acme.io" }
2644
2671
  },
2645
2672
  setup(e) {
2646
- return (t, n) => (v(), a("div", Xa, [n[0] ||= o("span", {
2673
+ return (t, n) => (v(), a("div", Za, [n[0] ||= o("span", {
2647
2674
  class: "icon",
2648
2675
  "aria-hidden": "true"
2649
2676
  }, "✓", -1), o("div", null, [o("strong", null, T(e.appName), 1), o("span", null, "wants to access your account · " + T(e.requestedBy), 1)])]));
2650
2677
  }
2651
- }), [["__scopeId", "data-v-9008f821"]]), Qa = { class: "scope-list" }, $a = /*#__PURE__*/ $(/* @__PURE__ */ u({
2678
+ }), [["__scopeId", "data-v-9008f821"]]), $a = { class: "scope-list" }, eo = /*#__PURE__*/ $(/* @__PURE__ */ u({
2652
2679
  __name: "ScopeList",
2653
2680
  props: { scopes: { default: () => [
2654
2681
  "Read your profile",
@@ -2657,11 +2684,11 @@ var Zi = /*#__PURE__*/ $(/* @__PURE__ */ u({
2657
2684
  ] } },
2658
2685
  setup(t) {
2659
2686
  let r = t, i = n(() => Array.isArray(r.scopes) ? r.scopes : r.scopes.split("\n").filter(Boolean));
2660
- return (t, n) => (v(), a("div", Qa, [(v(!0), a(e, null, b(i.value, (e) => (v(), a("div", {
2687
+ return (t, n) => (v(), a("div", $a, [(v(!0), a(e, null, b(i.value, (e) => (v(), a("div", {
2661
2688
  key: e,
2662
2689
  class: "scope"
2663
2690
  }, [n[0] ||= o("span", { "aria-hidden": "true" }, "✓", -1), o("span", null, T(e), 1)]))), 128))]));
2664
2691
  }
2665
2692
  }), [["__scopeId", "data-v-cdebac9d"]]);
2666
2693
  //#endregion
2667
- export { Ka as Alert, Qi as Card, Aa as Checkbox, Za as ConsentCard, Zi as Container, Ya as Content, Ki as Designer, na as Divider, fa as EmailInput, Ia as Heading, Wa as Image, ra as Layout, sa as LayoutRef, Da as OtpInput, Ca as PasswordInput, $a as ScopeList, Na as SocialButton, $i as Spacer, ja as SubmitButton, Ra as Text, _a as TextInput, Fa as TextLink, Yr as TextScroller, qi as useChecklistStore, Ji as useScreensStore };
2694
+ export { qa as Alert, $i as Card, ja as Checkbox, Qa as ConsentCard, Qi as Container, Xa as Content, qi as Designer, ra as Divider, pa as EmailInput, La as Heading, Ga as Image, ia as Layout, ca as LayoutRef, Oa as OtpInput, wa as PasswordInput, eo as ScopeList, Pa as SocialButton, ea as Spacer, Ma as SubmitButton, za as Text, va as TextInput, Ia as TextLink, Yr as TextScroller, Ji as useChecklistStore, Yi as useScreensStore };
package/dist/widgets/SideInfo.vue.d.ts CHANGED
@@ -2,8 +2,6 @@ import type { ChecklistItem } from './header/types';
2
2
  type __VLS_Props = {
3
3
  items?: ChecklistItem[];
4
4
  };
5
- declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
6
- items: ChecklistItem[];
7
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
5
+ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
8
6
  declare const _default: typeof __VLS_export;
9
7
  export default _default;
package/dist/widgets/header/types.d.ts CHANGED
@@ -17,4 +17,8 @@ export interface ChecklistItem {
17
17
  id: string;
18
18
  label: string;
19
19
  complete: boolean;
20
+ check?: (context: ChecklistContext) => boolean;
21
+ }
22
+ export interface ChecklistContext {
23
+ templates: readonly Template[];
20
24
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aham.ro/ui-designer",
3
- "version": "0.1.7",
3
+ "version": "0.1.8",
4
4
  "description": "Vue components for the UI designer for IAM and email templates.",
5
5
  "type": "module",
6
6
  "files": [