kritzel-stencil 0.4.8 → 0.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +9 -1
- package/dist/cjs/kritzel-active-users_47.cjs.entry.js +1386 -1250
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{schema.constants-gDeS7USU.js → schema.constants-ByNZ_qAj.js} +61 -0
- package/dist/cjs/stencil.cjs.js +1 -1
- package/dist/collection/classes/objects/image.class.js +9 -0
- package/dist/collection/classes/objects/path.class.js +9 -0
- package/dist/collection/classes/objects/shape.class.js +9 -0
- package/dist/collection/classes/providers/sync/broadcast-sync-provider.class.js +1 -0
- package/dist/collection/classes/providers/sync/hocuspocus-sync-provider.class.js +2 -0
- package/dist/collection/classes/providers/sync/in-memory-sync-provider.class.js +1 -0
- package/dist/collection/classes/providers/sync/indexeddb-sync-provider.class.js +1 -0
- package/dist/collection/classes/providers/sync/websocket-sync-provider.class.js +2 -0
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +197 -67
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +136 -169
- package/dist/collection/components/ui/kritzel-export/kritzel-export.js +1 -1
- package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.js +1 -1
- package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.js +1 -1
- package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.js +90 -4
- package/dist/collection/components/ui/kritzel-settings/kritzel-settings.js +1 -1
- package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.js +2 -2
- package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
- package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.js +1 -1
- package/dist/collection/constants/version.js +1 -1
- package/dist/collection/helpers/object.helper.js +11 -0
- package/dist/collection/index.js +1 -0
- package/dist/collection/interfaces/object-export.interface.js +1 -0
- package/dist/collection/interfaces/sync-config.interface.js +21 -1
- package/dist/components/index.js +10 -3
- package/dist/components/kritzel-awareness-cursors.js +1 -1
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-editor.js +175 -78
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/kritzel-export.js +1 -1
- package/dist/components/kritzel-loading-overlay.js +1 -1
- package/dist/components/kritzel-login-dialog.js +1 -1
- package/dist/components/kritzel-menu-item.js +1 -1
- package/dist/components/kritzel-menu.js +1 -1
- package/dist/components/kritzel-more-menu.js +1 -1
- package/dist/components/kritzel-portal.js +1 -1
- package/dist/components/kritzel-settings.js +1 -1
- package/dist/components/kritzel-share-dialog.js +1 -1
- package/dist/components/kritzel-split-button.js +1 -1
- package/dist/components/kritzel-utility-panel.js +1 -1
- package/dist/components/kritzel-workspace-manager.js +1 -1
- package/dist/components/kritzel-zoom-panel.js +1 -1
- package/dist/components/{p-DwY5pghH.js → p-6rQICkGr.js} +1 -1
- package/dist/components/{p-BknTMcbz.js → p-8ScektIm.js} +1 -1
- package/dist/components/{p-DkY7pIg5.js → p-BRGufCki.js} +95 -6
- package/dist/components/{p-BKOsmXB5.js → p-BqWiEmYI.js} +1 -1
- package/dist/components/{p-BLOPBDUF.js → p-C2CeSrTm.js} +1 -1
- package/dist/components/{p-DDbO5q-e.js → p-CXJZxJvp.js} +4 -4
- package/dist/components/{p-7Rt7ml3v.js → p-Cj0NElII.js} +1 -1
- package/dist/components/{p-BVEGQLBD.js → p-CoY7emAj.js} +1 -1
- package/dist/components/{p-DgA865Tp.js → p-D7H8oxZb.js} +2 -2
- package/dist/components/{p-Dd-pMvlr.js → p-DPONTran.js} +11 -0
- package/dist/components/{p-BMRln59F.js → p-DW7WW4EN.js} +2 -2
- package/dist/components/{p-D8TOEhPY.js → p-DuVkk58V.js} +2 -2
- package/dist/components/{p-OLfoATNk.js → p-U9FjWrp-.js} +1 -1
- package/dist/components/{p-D8bHNNEm.js → p-ZPPtEla5.js} +1227 -1218
- package/dist/components/{p-COjsYPir.js → p-dVfh-Sy9.js} +1 -1
- package/dist/components/{p-0H4HOJjy.js → p-lQ7nfhOy.js} +10 -1
- package/dist/esm/index.js +9 -2
- package/dist/esm/kritzel-active-users_47.entry.js +1386 -1250
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{schema.constants-Rpm1NA9u.js → schema.constants-1t45c2_U.js} +61 -1
- package/dist/esm/stencil.js +1 -1
- package/dist/stencil/index.esm.js +9 -2
- package/dist/stencil/{p-Rpm1NA9u.js → p-1t45c2_U.js} +61 -1
- package/dist/stencil/{p-8c1b7b08.entry.js → p-f5f088ea.entry.js} +1386 -1250
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/classes/objects/image.class.d.ts +3 -0
- package/dist/types/classes/objects/path.class.d.ts +3 -0
- package/dist/types/classes/objects/shape.class.d.ts +3 -0
- package/dist/types/classes/providers/sync/broadcast-sync-provider.class.d.ts +1 -0
- package/dist/types/classes/providers/sync/hocuspocus-sync-provider.class.d.ts +1 -0
- package/dist/types/classes/providers/sync/in-memory-sync-provider.class.d.ts +1 -0
- package/dist/types/classes/providers/sync/indexeddb-sync-provider.class.d.ts +1 -0
- package/dist/types/classes/providers/sync/websocket-sync-provider.class.d.ts +1 -0
- package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +15 -3
- package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +16 -34
- package/dist/types/components/ui/kritzel-more-menu/kritzel-more-menu.d.ts +10 -1
- package/dist/types/components.d.ts +27 -26
- package/dist/types/constants/version.d.ts +1 -1
- package/dist/types/helpers/object.helper.d.ts +4 -0
- package/dist/types/index.d.ts +1 -0
- package/dist/types/interfaces/menu-item.interface.d.ts +1 -1
- package/dist/types/interfaces/object-export.interface.d.ts +20 -0
- package/dist/types/interfaces/sync-config.interface.d.ts +5 -0
- package/dist/types/interfaces/sync-provider.interface.d.ts +5 -0
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelLoadingOverlay$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelLoadingOverlay$1, d as defineCustomElement$1 } from './p-CoY7emAj.js';
|
|
2
2
|
|
|
3
3
|
const KritzelLoadingOverlay = KritzelLoadingOverlay$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelLoginDialog$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelLoginDialog$1, d as defineCustomElement$1 } from './p-Cj0NElII.js';
|
|
2
2
|
|
|
3
3
|
const KritzelLoginDialog = KritzelLoginDialog$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { b as KritzelMenuItem$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { b as KritzelMenuItem$1, d as defineCustomElement$1 } from './p-BqWiEmYI.js';
|
|
2
2
|
|
|
3
3
|
const KritzelMenuItem = KritzelMenuItem$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelMoreMenu$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelMoreMenu$1, d as defineCustomElement$1 } from './p-BRGufCki.js';
|
|
2
2
|
|
|
3
3
|
const KritzelMoreMenu = KritzelMoreMenu$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelSettings$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelSettings$1, d as defineCustomElement$1 } from './p-D7H8oxZb.js';
|
|
2
2
|
|
|
3
3
|
const KritzelSettings = KritzelSettings$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelShareDialog$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelShareDialog$1, d as defineCustomElement$1 } from './p-DW7WW4EN.js';
|
|
2
2
|
|
|
3
3
|
const KritzelShareDialog = KritzelShareDialog$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelSplitButton$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelSplitButton$1, d as defineCustomElement$1 } from './p-DuVkk58V.js';
|
|
2
2
|
|
|
3
3
|
const KritzelSplitButton = KritzelSplitButton$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelUtilityPanel$1, d as defineCustomElement$1 } from './p-6rQICkGr.js';
|
|
2
2
|
|
|
3
3
|
const KritzelUtilityPanel = KritzelUtilityPanel$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelWorkspaceManager$1, d as defineCustomElement$1 } from './p-CXJZxJvp.js';
|
|
2
2
|
|
|
3
3
|
const KritzelWorkspaceManager = KritzelWorkspaceManager$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { K as KritzelZoomPanel$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { K as KritzelZoomPanel$1, d as defineCustomElement$1 } from './p-U9FjWrp-.js';
|
|
2
2
|
|
|
3
3
|
const KritzelZoomPanel = KritzelZoomPanel$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -33,7 +33,7 @@ const KritzelUtilityPanel = /*@__PURE__*/ proxyCustomElement(class KritzelUtilit
|
|
|
33
33
|
this.redo.emit();
|
|
34
34
|
}
|
|
35
35
|
render() {
|
|
36
|
-
return (h(Host, { key: '
|
|
36
|
+
return (h(Host, { key: '001ee010d714513a4b5027f84cac4586c64e2260' }, h("button", { key: '6ba6cbf100e2ad9f81de6416b85f981cd1467f1c', class: "utility-button", "data-testid": "utility-undo", disabled: !this.undoState?.canUndo, onClick: event => this.handleUndo(event), "aria-label": this.terms['utility.undo'] ?? 'Undo' }, h("kritzel-icon", { key: 'b246d3964623e57e9458e5f0266a2f9e0565c646', name: "undo" })), h("button", { key: '1f5015fbd2fd84508bc8b8f295d35960bf31af5b', class: "utility-button", "data-testid": "utility-redo", disabled: !this.undoState?.canRedo, onClick: event => this.handleRedo(event), "aria-label": this.terms['utility.redo'] ?? 'Redo' }, h("kritzel-icon", { key: 'b3694d884707c6844a0036610990cdcfa74c6931', name: "redo" })), h("div", { key: '4f8f4725213d1453af11dc3b4c9ff271f1933df5', class: "utility-separator" }), h("button", { key: '5eba2c56dd96698538a48a8ea9f32fcf8b4d8402', class: "utility-button", "data-testid": "utility-delete", onClick: () => this.delete.emit(), "aria-label": this.terms['utility.delete'] ?? 'Delete selected items' }, h("kritzel-icon", { key: '268a186e4e7eaa1ea874ef23e72df511f86b0343', name: "delete" }))));
|
|
37
37
|
}
|
|
38
38
|
static get style() { return kritzelUtilityPanelCss(); }
|
|
39
39
|
}, [513, "kritzel-utility-panel", {
|
|
@@ -14,7 +14,7 @@ import { d as defineCustomElement$6 } from './p-BzrxIesp.js';
|
|
|
14
14
|
import { d as defineCustomElement$5 } from './p-BFYtCsZu.js';
|
|
15
15
|
import { d as defineCustomElement$4 } from './p-Ckm1Aq0V.js';
|
|
16
16
|
import { d as defineCustomElement$2 } from './p-DrQRChp3.js';
|
|
17
|
-
import { d as defineCustomElement$1 } from './p-
|
|
17
|
+
import { d as defineCustomElement$1 } from './p-6rQICkGr.js';
|
|
18
18
|
|
|
19
19
|
const kritzelControlsCss = () => `:host{display:flex;flex-direction:column;user-select:none;max-width:100%;z-index:1}:host(.mobile){--kritzel-controls-control-hover-background-color:transparent;--kritzel-controls-control-active-background-color:transparent}.kritzel-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--kritzel-controls-gap, 8px);height:100%;padding:var(--kritzel-controls-padding, 8px);background-color:var(--kritzel-controls-background-color, #ffffff);border-radius:var(--kritzel-controls-border-radius, 16px);box-shadow:var(--kritzel-controls-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-controls-border, 1px solid #ebebeb);z-index:1;position:relative;max-width:100%;overflow:hidden}.kritzel-tools-scroll{display:flex;flex-direction:row;align-items:center;gap:var(--kritzel-controls-gap, 8px);overflow-x:auto;overflow-y:hidden;flex:1 1 auto;min-width:0;padding:4px;margin:-4px;scrollbar-width:none;-ms-overflow-style:none}.kritzel-tools-scroll::-webkit-scrollbar{display:none}.scroll-indicator-left,.scroll-indicator-right{position:absolute;top:0;bottom:0;width:32px;pointer-events:none;opacity:0;transition:opacity 0.2s ease-out;z-index:1}.scroll-indicator-left{left:0;background:linear-gradient(to right, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:var(--kritzel-controls-border-radius, 16px) 0 0 var(--kritzel-controls-border-radius, 16px)}.scroll-indicator-right{right:0;background:linear-gradient(to left, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:0 var(--kritzel-controls-border-radius, 16px) var(--kritzel-controls-border-radius, 16px) 0}.scroll-indicator-left.visible,.scroll-indicator-right.visible{opacity:1}.kritzel-control{display:flex;justify-content:center;align-items:center;color:var(--kritzel-controls-control-color, #000000);border-radius:var(--kritzel-controls-control-border-radius, 12px);padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:focus,.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control.selected:focus{background-color:var(--kritzel-controls-control-selected-background-color, #007bffe3) !important}.kritzel-control-separator{width:1px;height:24px;background-color:var(--kritzel-controls-separator-color, #ebebeb);margin:0 4px}.kritzel-control-split{position:relative;display:flex;align-items:center;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:var(--kritzel-controls-control-color, #000000)}.kritzel-control-split .kritzel-control-main{display:flex;justify-content:center;align-items:center;padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:inherit}.kritzel-control-split.selected .kritzel-control-main{border-radius:var(--kritzel-controls-control-border-radius, 12px) 0 0 var(--kritzel-controls-control-border-radius, 12px)}.kritzel-control-split .kritzel-control-dropdown{display:flex;justify-content:center;align-items:center;align-self:stretch;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:0 var(--kritzel-controls-control-border-radius, 12px) var(--kritzel-controls-control-border-radius, 12px) 0;color:inherit;width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none;transition:width 0.15s ease-out, padding 0.15s ease-out, opacity 0.15s ease-out}.kritzel-control-split .kritzel-control-dropdown.visible{width:auto;padding:0 6px;opacity:1;pointer-events:auto}.kritzel-control-split .kritzel-control-main:focus,.kritzel-control-split .kritzel-control-main:hover,.kritzel-control-split .kritzel-control-dropdown:focus,.kritzel-control-split .kritzel-control-dropdown:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control-split .kritzel-control-main:active,.kritzel-control-split .kritzel-control-dropdown:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control-split.selected{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control-split.selected .kritzel-control-main:hover,.kritzel-control-split.selected .kritzel-control-dropdown:hover{background-color:rgba(255, 255, 255, 0.15)}.kritzel-submenu-content{display:flex;flex-direction:column;gap:var(--kritzel-submenu-gap, 4px);min-width:140px}.kritzel-submenu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:8px;color:var(--kritzel-controls-control-color, #000000);font-size:14px;text-align:left;white-space:nowrap;-webkit-tap-highlight-color:transparent}.kritzel-submenu-item:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-submenu-item.active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF);color:var(--kritzel-controls-control-selected-color, #ffffff)}.kritzel-submenu-item.active:hover{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF)}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:0;opacity:0;overflow:hidden;pointer-events:none;margin-left:calc(-1 * var(--kritzel-controls-gap, 8px));transition:width 0.2s ease-out, opacity 0.2s ease-out, margin-left 0.2s ease-out}.kritzel-config-container.visible{width:40px;opacity:1;pointer-events:auto;margin-left:0;overflow:visible}.config-gradient-left{position:absolute;top:0;bottom:0;left:-32px;width:32px;background:linear-gradient(to right, transparent, var(--kritzel-controls-background-color, #ffffff));pointer-events:none;z-index:1;opacity:0;transition:opacity 0.2s ease-out}.config-gradient-left.visible{opacity:1}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{z-index:10001}`;
|
|
20
20
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
|
|
2
2
|
import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
|
|
3
3
|
import { d as defineCustomElement$4 } from './p-CdR76C4L.js';
|
|
4
|
-
import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-
|
|
5
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-BqWiEmYI.js';
|
|
5
|
+
import { d as defineCustomElement$1 } from './p-C2CeSrTm.js';
|
|
6
6
|
|
|
7
7
|
const kritzelMoreMenuCss = () => `:host{display:inline-flex;z-index:1}.more-menu-wrapper{display:inline-flex;padding:var(--kritzel-more-menu-padding, 4px);background-color:var(--kritzel-more-menu-background-color, #ffffff);border-radius:var(--kritzel-more-menu-border-radius, 12px);box-shadow:var(--kritzel-more-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-more-menu-border, 1px solid #ebebeb);opacity:0;pointer-events:none;transition:opacity 0.2s ease-out}.more-menu-wrapper.visible{opacity:1;pointer-events:auto}:host(.mobile){--kritzel-more-menu-button-hover-background-color:transparent;--kritzel-more-menu-button-active-background-color:transparent}.more-menu-button{display:flex;align-items:center;justify-content:center;width:var(--kritzel-more-menu-button-width, 40px);height:var(--kritzel-more-menu-button-height, 40px);padding:0;border:none;border-radius:var(--kritzel-more-menu-inner-border-radius, 12px);background-color:transparent;cursor:var(--kritzel-global-pointer-cursor, pointer);box-shadow:none;transition:background-color 150ms ease;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:var(--kritzel-more-menu-button-color, currentColor)}.more-menu-button:hover{background-color:var(--kritzel-more-menu-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.more-menu-button:focus-visible{background-color:var(--kritzel-more-menu-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.more-menu-button:active{background-color:var(--kritzel-more-menu-button-active-background-color, hsl(0, 0%, 0%, 4.3%))}`;
|
|
8
8
|
|
|
@@ -46,6 +46,14 @@ const KritzelMoreMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMoreMenu e
|
|
|
46
46
|
itemSelect;
|
|
47
47
|
menuAnchor = null;
|
|
48
48
|
isTouchDevice = KritzelDevicesHelper.isTouchDevice();
|
|
49
|
+
visibleItems = [];
|
|
50
|
+
visibilityResolveVersion = 0;
|
|
51
|
+
onItemsChange() {
|
|
52
|
+
void this.resolveVisibleItems();
|
|
53
|
+
}
|
|
54
|
+
componentWillLoad() {
|
|
55
|
+
void this.resolveVisibleItems();
|
|
56
|
+
}
|
|
49
57
|
toggleMenu = (event) => {
|
|
50
58
|
event.stopPropagation();
|
|
51
59
|
if (this.menuAnchor) {
|
|
@@ -54,13 +62,84 @@ const KritzelMoreMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMoreMenu e
|
|
|
54
62
|
else {
|
|
55
63
|
window.dispatchEvent(new CustomEvent('kritzel-dismiss-menus'));
|
|
56
64
|
this.menuAnchor = this.host;
|
|
65
|
+
this.visibleItems = this.filterVisibleItemsSync(this.items ?? []);
|
|
66
|
+
void this.resolveVisibleItems();
|
|
57
67
|
}
|
|
58
68
|
};
|
|
59
69
|
closeMenu = () => {
|
|
60
70
|
this.menuAnchor = null;
|
|
61
71
|
};
|
|
62
|
-
|
|
63
|
-
|
|
72
|
+
async evaluateVisibility(visibility) {
|
|
73
|
+
if (typeof visibility === 'function') {
|
|
74
|
+
try {
|
|
75
|
+
return (await visibility()) !== false;
|
|
76
|
+
}
|
|
77
|
+
catch {
|
|
78
|
+
return false;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
return visibility !== false;
|
|
82
|
+
}
|
|
83
|
+
evaluateVisibilitySync(visibility) {
|
|
84
|
+
if (typeof visibility === 'function') {
|
|
85
|
+
try {
|
|
86
|
+
const result = visibility();
|
|
87
|
+
return result instanceof Promise ? null : result !== false;
|
|
88
|
+
}
|
|
89
|
+
catch {
|
|
90
|
+
return false;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
return visibility !== false;
|
|
94
|
+
}
|
|
95
|
+
filterVisibleItemsSync(items) {
|
|
96
|
+
return items.reduce((visibleItems, item) => {
|
|
97
|
+
const isVisible = this.evaluateVisibilitySync(item.isVisible);
|
|
98
|
+
if (isVisible === null || !isVisible) {
|
|
99
|
+
return visibleItems;
|
|
100
|
+
}
|
|
101
|
+
if (!item.children?.length) {
|
|
102
|
+
visibleItems.push(item);
|
|
103
|
+
return visibleItems;
|
|
104
|
+
}
|
|
105
|
+
visibleItems.push({
|
|
106
|
+
...item,
|
|
107
|
+
children: this.filterVisibleItemsSync(item.children),
|
|
108
|
+
});
|
|
109
|
+
return visibleItems;
|
|
110
|
+
}, []);
|
|
111
|
+
}
|
|
112
|
+
async filterVisibleItems(items) {
|
|
113
|
+
const resolved = await Promise.all(items.map(async (item) => {
|
|
114
|
+
const isVisible = await this.evaluateVisibility(item.isVisible);
|
|
115
|
+
if (!isVisible) {
|
|
116
|
+
return null;
|
|
117
|
+
}
|
|
118
|
+
if (!item.children?.length) {
|
|
119
|
+
return item;
|
|
120
|
+
}
|
|
121
|
+
return {
|
|
122
|
+
...item,
|
|
123
|
+
children: await this.filterVisibleItems(item.children),
|
|
124
|
+
};
|
|
125
|
+
}));
|
|
126
|
+
return resolved.filter((item) => !!item);
|
|
127
|
+
}
|
|
128
|
+
async resolveVisibleItems() {
|
|
129
|
+
const version = ++this.visibilityResolveVersion;
|
|
130
|
+
const items = this.items ?? [];
|
|
131
|
+
const resolvedItems = await this.filterVisibleItems(items);
|
|
132
|
+
if (version !== this.visibilityResolveVersion) {
|
|
133
|
+
return;
|
|
134
|
+
}
|
|
135
|
+
this.visibleItems = resolvedItems;
|
|
136
|
+
}
|
|
137
|
+
resolveMenuLabels(items) {
|
|
138
|
+
return items.map(item => ({
|
|
139
|
+
...item,
|
|
140
|
+
label: this.terms[item.label] ?? item.label,
|
|
141
|
+
children: item.children ? this.resolveMenuLabels(item.children) : undefined,
|
|
142
|
+
}));
|
|
64
143
|
}
|
|
65
144
|
handleMenuItemSelect = (event) => {
|
|
66
145
|
const { item, parent } = event.detail;
|
|
@@ -71,8 +150,13 @@ const KritzelMoreMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMoreMenu e
|
|
|
71
150
|
this.closeMenu();
|
|
72
151
|
};
|
|
73
152
|
render() {
|
|
74
|
-
return (h(Host, { key: '
|
|
153
|
+
return (h(Host, { key: 'dbfe312eccd24901ffc68179ef93ba0a94a765c5', class: { mobile: this.isTouchDevice }, style: { display: this.visible ? '' : 'none' } }, h("div", { key: '33bd535bb58ae32a32d44133a109fdd3667b4947', class: { 'more-menu-wrapper': true, visible: this.visible } }, h("button", { key: '23dbae51d73b92b181721bdef4a44049ec6484c5', class: "more-menu-button", "data-testid": "more-menu-button", onClick: this.toggleMenu, "aria-label": this.terms['moreMenu.ariaLabel'] ?? 'More options' }, h("kritzel-icon", { key: 'bda7c092b57af366b5d6b882cbab991cd9bb77ba', name: this.icon, size: this.iconSize })), h("kritzel-portal", { key: '2959ac3e6e0a5598c735ce7a01619bda8753039f', anchor: this.menuAnchor, offsetY: this.offsetY, onClose: this.closeMenu }, h("kritzel-menu", { key: 'a5481a1bc02dc059dc0ad188b93b9eaf9b56e98f', items: this.resolveMenuLabels(this.visibleItems), onItemSelect: this.handleMenuItemSelect })))));
|
|
75
154
|
}
|
|
155
|
+
static get watchers() { return {
|
|
156
|
+
"items": [{
|
|
157
|
+
"onItemsChange": 0
|
|
158
|
+
}]
|
|
159
|
+
}; }
|
|
76
160
|
static get style() { return kritzelMoreMenuCss(); }
|
|
77
161
|
}, [513, "kritzel-more-menu", {
|
|
78
162
|
"visible": [4],
|
|
@@ -82,7 +166,12 @@ const KritzelMoreMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMoreMenu e
|
|
|
82
166
|
"offsetY": [2, "offset-y"],
|
|
83
167
|
"terms": [16],
|
|
84
168
|
"menuAnchor": [32],
|
|
85
|
-
"isTouchDevice": [32]
|
|
169
|
+
"isTouchDevice": [32],
|
|
170
|
+
"visibleItems": [32]
|
|
171
|
+
}, undefined, {
|
|
172
|
+
"items": [{
|
|
173
|
+
"onItemsChange": 0
|
|
174
|
+
}]
|
|
86
175
|
}]);
|
|
87
176
|
function defineCustomElement() {
|
|
88
177
|
if (typeof customElements === "undefined") {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
|
|
2
2
|
import { d as defineCustomElement$3 } from './p-CdR76C4L.js';
|
|
3
3
|
import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
|
|
4
|
-
import { d as defineCustomElement$2 } from './p-
|
|
4
|
+
import { d as defineCustomElement$2 } from './p-C2CeSrTm.js';
|
|
5
5
|
|
|
6
6
|
const kritzelMenuItemCss = () => `:host{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--kritzel-menu-item-padding, 8px);box-sizing:border-box;gap:16px;height:var(--kritzel-menu-item-height, 40px);min-height:var(--kritzel-menu-item-min-height, 40px);font-family:sans-serif;font-size:var(--kritzel-menu-item-font-size, 14px);color:var(--kritzel-menu-item-color, #333333);border-radius:var(--kritzel-menu-item-border-radius, 12px);-webkit-tap-highlight-color:transparent}:host:focus:not(:focus-visible){outline:none}:host(:hover) .menu-item-overlay,:host(:focus-within) .menu-item-overlay{background-color:var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.selected){background-color:var(--kritzel-menu-item-selected-background-color, #007aff);color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .action-button{color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected.editing){background-color:var(--kritzel-menu-item-selected-background-color, #007aff)}:host(.selected) .edit-input{color:var(--kritzel-menu-item-selected-color, #ffffff);caret-color:var(--kritzel-menu-item-input-caret-color-on-selected, #ffffff);border-color:var(--kritzel-menu-item-input-border-color-on-selected, #ffffff)}:host(.selected) .action-button kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-selected-color, #ffffff)}kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-color, #333333)}:host(.selected) kritzel-icon{--kritzel-icon-color:var(--kritzel-menu-item-selected-color, #ffffff)}:host(.selected) .edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color-on-selected, rgba(255, 255, 255, 0.3));color:var(--kritzel-menu-item-input-selection-text-color-on-selected, #ffffff)}:host(.editing){background-color:var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.disabled){opacity:0.5;pointer-events:none !important}:host(.child-open){background-color:var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%))}:host(.child-open.selected){background-color:var(--kritzel-menu-item-selected-background-color, #007aff)}.menu-item-overlay{position:absolute;inset:0;background-color:transparent;z-index:0;pointer-events:none;border-radius:var(--kritzel-menu-item-border-radius, 12px)}.menu-item-content{display:flex;align-items:center;gap:8px;position:relative;z-index:1;height:100%}.menu-item-content span{display:flex;align-items:center;line-height:0}.left{justify-content:flex-start;flex:1;min-width:0}.left>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right{justify-content:flex-end}.edit-input{flex:1;height:var(--kritzel-menu-item-input-height, 24px);padding:0;background-color:transparent;border-radius:0;border:none;border-bottom:var(--kritzel-menu-item-input-border, 1px solid #ccc);font-size:var(--kritzel-menu-item-font-size, 14px);width:100%;min-width:0;box-sizing:border-box;outline:none;color:inherit}.edit-input{caret-color:var(--kritzel-menu-item-input-caret-color, currentColor)}.edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color, #007bff);color:var(--kritzel-menu-item-input-selection-text-color, #ffffff)}.action-button{padding:4px;border-radius:8px;border:none;cursor:var(--kritzel-global-pointer-cursor, pointer);display:flex;align-items:center;justify-content:center;background-color:transparent;background:transparent;-webkit-tap-highlight-color:transparent}.action-button:hover,.action-button:focus{background-color:var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.action-button.disabled{pointer-events:none;opacity:0.5}`;
|
|
7
7
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
|
|
2
|
-
import { O as ObjectHelper } from './p-
|
|
2
|
+
import { O as ObjectHelper } from './p-DPONTran.js';
|
|
3
3
|
import { K as KritzelHTMLHelper } from './p-WUdQqYnu.js';
|
|
4
4
|
|
|
5
5
|
const KritzelPortal = /*@__PURE__*/ proxyCustomElement(class KritzelPortal extends H {
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
|
|
2
2
|
import { K as KritzelWorkspace } from './p-DAwPPDMS.js';
|
|
3
|
-
import { O as ObjectHelper } from './p-
|
|
3
|
+
import { O as ObjectHelper } from './p-DPONTran.js';
|
|
4
4
|
import { d as defineCustomElement$5 } from './p-CdR76C4L.js';
|
|
5
|
-
import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-
|
|
6
|
-
import { d as defineCustomElement$2 } from './p-
|
|
7
|
-
import { d as defineCustomElement$1 } from './p-
|
|
5
|
+
import { d as defineCustomElement$3, a as defineCustomElement$4 } from './p-BqWiEmYI.js';
|
|
6
|
+
import { d as defineCustomElement$2 } from './p-C2CeSrTm.js';
|
|
7
|
+
import { d as defineCustomElement$1 } from './p-DuVkk58V.js';
|
|
8
8
|
|
|
9
9
|
const kritzelWorkspaceManagerCss = () => `:host{display:flex;flex-direction:column;z-index:1}.manager{opacity:0;pointer-events:none;transition:opacity 0.2s ease-out}.manager.visible{opacity:1;pointer-events:auto}`;
|
|
10
10
|
|
|
@@ -53,7 +53,7 @@ const KritzelLoginDialog = /*@__PURE__*/ proxyCustomElement(class KritzelLoginDi
|
|
|
53
53
|
this.dialogClosed.emit();
|
|
54
54
|
};
|
|
55
55
|
render() {
|
|
56
|
-
return (h(Host, { key: '
|
|
56
|
+
return (h(Host, { key: '561b4e76017e71d99f05cd33ed9f6e3769bb9aec' }, h("kritzel-dialog", { key: '74b904f67496debebf7a1854e3e3dd193f14a445', dialogTitle: this.dialogTitle, isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, size: "small", contained: true }, h("div", { key: 'dcc2a024349fcdfcad7c7c6d5b7754e5ae990ae3', class: "login-content" }, this.subtitle && (h("p", { key: 'fdc927c84294a2ac92aec90001c3da373cc5f082', class: "login-subtitle" }, this.subtitle)), h("div", { key: 'a6e74ff9b3211df195b05edd2be0ce69d1b128df', class: "login-providers" }, this.providers.map(provider => (h("button", { key: provider.name, class: {
|
|
57
57
|
'provider-button': true,
|
|
58
58
|
'is-loading': this.loadingProvider === provider.name,
|
|
59
59
|
'is-disabled': this.loadingProvider !== null && this.loadingProvider !== provider.name,
|
|
@@ -19,7 +19,7 @@ const KritzelLoadingOverlay = /*@__PURE__*/ proxyCustomElement(class KritzelLoad
|
|
|
19
19
|
*/
|
|
20
20
|
text = 'Loading...';
|
|
21
21
|
render() {
|
|
22
|
-
return (h(Host, { key: '
|
|
22
|
+
return (h(Host, { key: 'ce2edf698db335518979f597ad32fa259c3055b9' }, h("div", { key: '7cf019929b72d18fdd1cea55157dc5b5fc2ea151', class: { 'loading-overlay': true, visible: this.visible }, "aria-hidden": this.visible ? 'false' : 'true' }, h("span", { key: '86b7cb040bcfb1abb2161a38f9cff153d5aa6c18', class: "loading-spinner" }), this.text)));
|
|
23
23
|
}
|
|
24
24
|
static get style() { return kritzelLoadingOverlayCss(); }
|
|
25
25
|
}, [513, "kritzel-loading-overlay", {
|
|
@@ -12,7 +12,7 @@ import { d as defineCustomElement$1 } from './p-BzJEwFtn.js';
|
|
|
12
12
|
* This file is auto-generated by the version bump scripts.
|
|
13
13
|
* Do not modify manually.
|
|
14
14
|
*/
|
|
15
|
-
const KRITZEL_VERSION = '0.4.
|
|
15
|
+
const KRITZEL_VERSION = '0.4.9';
|
|
16
16
|
|
|
17
17
|
const kritzelSettingsCss = () => `:host{display:contents}kritzel-dialog{--kritzel-dialog-body-padding:0;--kritzel-dialog-width-large:800px;--kritzel-dialog-height-large:500px}.footer-button{padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px}.cancel-button{border:1px solid #ebebeb;background:#fff;color:inherit}.cancel-button:hover{background:#f5f5f5}.settings-tab-panel{display:none}.settings-tab-panel.is-active{display:block}.settings-content{padding:0}.settings-content h3{margin:0 0 16px 0;font-size:18px;font-weight:600;color:var(--kritzel-settings-content-heading-color, #333333)}.settings-content p{margin:0;font-size:14px;color:var(--kritzel-settings-content-text-color, #666666);line-height:1.5}.settings-group{display:flex;flex-direction:column;gap:24px}.settings-item{display:flex;flex-direction:column;gap:8px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-label{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.settings-description{font-size:12px;color:var(--kritzel-settings-description-color, #888888);margin:0;line-height:1.4}.shortcuts-list{display:flex;flex-direction:column;gap:24px}.shortcuts-category{display:flex;flex-direction:column;gap:8px}.shortcuts-category-title{font-size:14px;font-weight:600;color:var(--kritzel-settings-label-color, #333333);margin:0 0 4px 0}.shortcuts-group{display:flex;flex-direction:column;gap:4px}.shortcut-item{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-item-bg, rgba(0, 0, 0, 0.02))}.shortcut-label{font-size:14px;color:var(--kritzel-settings-content-text-color, #666666)}.shortcut-key{font-family:monospace;font-size:12px;padding:2px 8px;border-radius:4px;background:var(--kritzel-settings-shortcut-key-bg, #f0f0f0);color:var(--kritzel-settings-shortcut-key-color, #333333);border:1px solid var(--kritzel-settings-shortcut-key-border, #ddd)}`;
|
|
18
18
|
|
|
@@ -228,7 +228,7 @@ const KritzelSettings = /*@__PURE__*/ proxyCustomElement(class KritzelSettings e
|
|
|
228
228
|
return (h("div", { class: "settings-categories-wrapper" }, h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'general' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.general.title', 'General Settings')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.theme.label', 'Theme')), h("p", { class: "settings-description" }, this.t('settings.general.theme.description', 'Select a registered color theme for the editor interface.')), h("kritzel-dropdown", { options: this.availableThemes.map(t => ({ value: t, label: t })), value: this.theme, onValueChanged: this.handleThemeChange })), this.availableLocales.length > 0 && (h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.language.label', 'Language')), h("p", { class: "settings-description" }, this.t('settings.general.language.description', 'Select the display language for the editor interface.')), h("kritzel-dropdown", { options: this.availableLocales.map(l => ({ value: l.code, label: l.label })), value: this.locale, onValueChanged: this.handleLocaleChange }))), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale')), h("p", { class: "settings-description" }, this.t('settings.general.lockDrawingScale.description', 'When enabled, drawn objects maintain a fixed visual size regardless of the current zoom level.')), h("kritzel-slide-toggle", { checked: this.lockDrawingScale, label: this.t('settings.general.lockDrawingScale.label', 'Lock Drawing Scale'), onCheckedChange: this.handleLockDrawingScaleChange }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'viewport' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.viewport.title', 'Viewport Settings')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.minZoom.label', 'Minimum Zoom Level')), h("p", { class: "settings-description" }, this.t('settings.viewport.minZoom.description', 'Sets the minimum zoom level. Lower values allow zooming out further to see more of the canvas.')), h("kritzel-numeric-input", { value: this.scaleMin, min: 0.0001, max: 1, step: 0.0001, onValueChange: this.handleScaleMinChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.maxZoom.label', 'Maximum Zoom Level')), h("p", { class: "settings-description" }, this.t('settings.viewport.maxZoom.description', 'Sets the maximum zoom level. Higher values allow zooming in closer for detailed work.')), h("kritzel-numeric-input", { value: this.scaleMax, min: 1, max: 1000, step: 1, onValueChange: this.handleScaleMaxChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryLeft.label', 'Viewport Boundary Left')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryLeft.description', 'Left boundary in world coordinates. Set to limit how far left the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryLeft, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryLeftChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryRight.label', 'Viewport Boundary Right')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryRight.description', 'Right boundary in world coordinates. Set to limit how far right the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryRight, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryRightChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryTop.label', 'Viewport Boundary Top')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryTop.description', 'Top boundary in world coordinates. Set to limit how far up the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryTop, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryTopChange })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.viewport.boundaryBottom.label', 'Viewport Boundary Bottom')), h("p", { class: "settings-description" }, this.t('settings.viewport.boundaryBottom.description', 'Bottom boundary in world coordinates. Set to limit how far down the viewport can pan.')), h("kritzel-numeric-input", { value: this.viewportBoundaryBottom, step: 100, placeholder: this.t('settings.viewport.boundaryPlaceholder', 'Infinite'), onValueChange: this.handleViewportBoundaryBottomChange }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'shortcuts' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.shortcuts.title', 'Keyboard Shortcuts')), h("div", { class: "shortcuts-list" }, Array.from(this.groupShortcutsByCategory()).map(([category, shortcuts]) => (h("div", { class: "shortcuts-category", key: category }, h("h4", { class: "shortcuts-category-title" }, category), h("div", { class: "shortcuts-group" }, shortcuts.map(shortcut => (h("div", { class: "shortcut-item", key: shortcut.key + shortcut.label }, h("span", { class: "shortcut-label" }, shortcut.label), h("kbd", { class: "shortcut-key" }, this.formatKeyCombo(shortcut)))))))))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'developer' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.developer.title', 'Developer Options')), h("div", { class: "settings-group" }, h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showViewportInfo.description', 'Display viewport debug information such as position, zoom level, and boundaries.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showViewportInfo, label: this.t('settings.developer.showViewportInfo.label', 'Show Viewport Info'), onCheckedChange: this.handleDebugInfoChange('showViewportInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showObjectInfo.label', 'Show Object Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showObjectInfo.description', 'Display debug information about objects on the canvas.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showObjectInfo, label: this.t('settings.developer.showObjectInfo.label', 'Show Object Info'), onCheckedChange: this.handleDebugInfoChange('showObjectInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showSyncProviderInfo.description', 'Display debug information about the sync provider connection status.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showSyncProviderInfo, label: this.t('settings.developer.showSyncProviderInfo.label', 'Show Sync Provider Info'), onCheckedChange: this.handleDebugInfoChange('showSyncProviderInfo') })), h("div", { class: "settings-item" }, h("label", { class: "settings-label" }, this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info')), h("p", { class: "settings-description" }, this.t('settings.developer.showMigrationInfo.description', 'Display debug information about data migrations.')), h("kritzel-slide-toggle", { checked: this.debugInfo.showMigrationInfo, label: this.t('settings.developer.showMigrationInfo.label', 'Show Migration Info'), onCheckedChange: this.handleDebugInfoChange('showMigrationInfo') }))))), h("div", { class: { 'settings-tab-panel': true, 'is-active': this.selectedCategoryId === 'about' } }, h("div", { class: "settings-content" }, h("h3", null, this.t('settings.about.title', 'About')), h("p", null, this.t('settings.about.description', 'Kritzel - A drawing application')), h("p", { class: "version-info" }, "Version ", KRITZEL_VERSION), h("p", { class: "version-info" }, "App-State Schema v", CURRENT_APP_STATE_SCHEMA_VERSION), h("p", { class: "version-info" }, "Workspace Schema v", CURRENT_WORKSPACE_SCHEMA_VERSION)))));
|
|
229
229
|
}
|
|
230
230
|
render() {
|
|
231
|
-
return (h(Host, { key: '
|
|
231
|
+
return (h(Host, { key: 'b8a899abd3dd55bc3493b7d124ac5505e2284036' }, h("kritzel-dialog", { key: '8d47f3548271e24a8a280a30139f04b2e4b4ec2b', isOpen: this.isDialogOpen, dialogTitle: this.t('settings.dialogTitle', 'Settings'), size: "large", contained: true, onDialogClose: this.closeDialog }, h("kritzel-master-detail", { key: 'a5213307761b84b8f5f67cb35409ab1c0c1fa57b', items: this.categories, selectedItemId: this.selectedCategoryId, onItemSelect: this.handleCategorySelect }, this.renderCategoryContent()))));
|
|
232
232
|
}
|
|
233
233
|
static get watchers() { return {
|
|
234
234
|
"settings": [{
|
|
@@ -15,6 +15,17 @@ class ObjectHelper {
|
|
|
15
15
|
static isClass(object, className) {
|
|
16
16
|
return !!object && object.__class__ === className;
|
|
17
17
|
}
|
|
18
|
+
static isKritzelExportable(object) {
|
|
19
|
+
if (!object || typeof object !== 'object') {
|
|
20
|
+
return false;
|
|
21
|
+
}
|
|
22
|
+
const candidate = object;
|
|
23
|
+
if (typeof candidate.getSupportedExportFormats !== 'function' || typeof candidate.exportAs !== 'function') {
|
|
24
|
+
return false;
|
|
25
|
+
}
|
|
26
|
+
const formats = candidate.getSupportedExportFormats();
|
|
27
|
+
return Array.isArray(formats) && formats.length > 0;
|
|
28
|
+
}
|
|
18
29
|
}
|
|
19
30
|
|
|
20
31
|
export { ObjectHelper as O };
|
|
@@ -3204,9 +3204,9 @@ const KritzelShareDialog = /*@__PURE__*/ proxyCustomElement(class KritzelShareDi
|
|
|
3204
3204
|
this.dialogClosed.emit();
|
|
3205
3205
|
};
|
|
3206
3206
|
render() {
|
|
3207
|
-
return (h(Host, { key: '
|
|
3207
|
+
return (h(Host, { key: '75deaa66e6a6f640506985a8b3a2746892b5da07' }, h("kritzel-dialog", { key: '237413c9302e3756c5f7653e69326fac80d9e181', dialogTitle: this.terms['share.dialogTitle'] ?? 'Share Workspace', size: "small", isOpen: this.isDialogOpen, onDialogClose: this.closeDialog, contained: true }, h("div", { key: '295394b851cc2210fece6f3e297dfbc0c516b0f7', class: "share-content" }, h("div", { key: 'df64d71f9c7a7064d36db6d0a196071f1e8835a9', class: "share-section" }, h("div", { key: '9db4902a5edd917efb5ad6c183f0862b12313635', class: "share-row" }, h("div", { key: '8ead1d363d3430a4e65fa3b5835401b0e20006db', class: "share-label-group" }, h("label", { key: '2f3c28a3909eab86a123ba6cf7386b79894717c5', class: "share-label" }, this.terms['share.linkSharing.label'] ?? 'Link sharing'), h("p", { key: '3167ae1ed6ff52abc531eafdd905f1397807f551', class: "share-description" }, this.internalIsPublic
|
|
3208
3208
|
? (this.terms['share.linkSharing.enabledDescription'] ?? 'Anyone with the link can access this workspace.')
|
|
3209
|
-
: (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: '
|
|
3209
|
+
: (this.terms['share.linkSharing.disabledDescription'] ?? 'Link sharing is disabled. Only you can access this workspace.'))), h("kritzel-slide-toggle", { key: '3ff608b262e2ff3fa779f7d1e9a4ee3c0b9a16c0', checked: this.internalIsPublic, onCheckedChange: this.handleToggleChange, label: this.terms['share.linkSharing.toggleLabel'] ?? 'Enable link sharing' }))), this.internalIsPublic && (h("div", { key: '355261384b0ed386f3b48c041bcf0039db0534c1', class: "share-section" }, h("div", { key: 'ad3d975c650757d0b6dbd5317c9bac4f98029e0c', class: "share-url-container" }, h("input", { key: '0da2cc9cb30f1da8bcab3aa82c679b8d685641bd', type: "text", class: "share-url-input", value: this.getShareUrl(), readOnly: true, onClick: (e) => e.target.select() }), h("button", { key: 'aee232b7a70b524d52a4b4cf9074c099d29a5300', class: { 'copy-button': true, 'copy-success': this.copySuccess }, onClick: this.handleCopyUrl, title: this.copySuccess ? (this.terms['share.copyLink.copied'] ?? 'Copied!') : (this.terms['share.copyLink.title'] ?? 'Copy link') }, h("kritzel-icon", { key: 'c151baf7b890dbf51c4f4831d60b0ebb1a5d05fa', name: this.copySuccess ? 'check' : 'copy', size: 18 }))), this.qrCodeDataUrl && (h("div", { key: '63b43efe3dc5929054af9e5ee7f64d093864b3b0', class: "share-qr-container" }, h("img", { key: '9d3b0418eb80ff8c7e9106ad86d7cc211d017504', class: "share-qr-image", src: this.qrCodeDataUrl, alt: "QR code for share link" })))))))));
|
|
3210
3210
|
}
|
|
3211
3211
|
static get watchers() { return {
|
|
3212
3212
|
"isPublic": [{
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, c as createEvent, h, d as Host, t as transformTag } from './p-B43upypT.js';
|
|
2
2
|
import { K as KritzelDevicesHelper } from './p-jGOpkGDl.js';
|
|
3
3
|
import { d as defineCustomElement$4 } from './p-CdR76C4L.js';
|
|
4
|
-
import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-
|
|
5
|
-
import { d as defineCustomElement$1 } from './p-
|
|
4
|
+
import { d as defineCustomElement$2, a as defineCustomElement$3 } from './p-BqWiEmYI.js';
|
|
5
|
+
import { d as defineCustomElement$1 } from './p-C2CeSrTm.js';
|
|
6
6
|
|
|
7
7
|
const kritzelSplitButtonCss = () => `:host{position:relative;display:flex;align-items:center;font-family:sans-serif;z-index:1;padding:var(--kritzel-split-button-padding, 4px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);box-shadow:var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-split-button-border, 1px solid #ebebeb);gap:var(--kritzel-split-button-gap, 4px)}:host(.mobile){--kritzel-split-button-hover-background-color:transparent}button{border:none;background-color:transparent;padding:0;margin:0;font-family:inherit;font-size:inherit;color:var(--kritzel-split-button-color, #000000);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:var(--kritzel-global-pointer-cursor, pointer);text-align:center;display:flex;align-items:center;justify-content:center;pointer-events:all;-webkit-tap-highlight-color:transparent}.split-main-button,.split-menu-button{height:auto;display:flex;align-items:center;padding:var(--kritzel-split-button-padding, 8px);background-color:var(--kritzel-split-button-background-color, #ffffff);border-radius:var(--kritzel-split-button-border-radius, 12px);font-size:var(--kritzel-split-button-font-size, 14px)}.split-main-button:hover,.split-menu-button:hover{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button:focus,.split-menu-button:focus{background-color:var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.split-main-button{gap:var(--kritzel-split-button-gap, 4px)}.split-menu-button{border-left:none;justify-content:center}.split-divider{width:var(--kritzel-split-button-divider-width, 1px);height:24px;background-color:var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%))}:disabled{pointer-events:none;opacity:0.5}`;
|
|
8
8
|
|
|
@@ -39,7 +39,7 @@ const KritzelZoomPanel = /*@__PURE__*/ proxyCustomElement(class KritzelZoomPanel
|
|
|
39
39
|
return Number.isFinite(this.zoomPercent) ? Math.max(1, Math.round(this.zoomPercent)) : 100;
|
|
40
40
|
}
|
|
41
41
|
render() {
|
|
42
|
-
return (h(Host, { key: '
|
|
42
|
+
return (h(Host, { key: 'aa4a0194b7ba89a32e369ae5ce9a8c148c05574f' }, h("div", { key: 'c88d4b299210d2aff28e07815bcbd4864ff13afd', class: { panel: true, visible: this.visible } }, h("button", { key: 'bf2c78d32ba31c25dcfed0b1f87fbfaee776acc1', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomOut'] ?? 'Zoom out', disabled: this.disabled, onClick: this.handleZoomOut }, h("kritzel-icon", { key: '3d350d003ed9d0b4548929d0765aae5da82c41b0', name: "minus" })), h("span", { key: 'da6454d4c28b5bdde41300c21b6593d91ce08085', class: "zoom-level", "aria-live": "polite" }, this.normalizedZoomPercent, "%"), h("button", { key: 'cf314fb20dcff5b3e728eae2129978cb12942947', class: "zoom-button", type: "button", "aria-label": this.terms['zoom.zoomIn'] ?? 'Zoom in', disabled: this.disabled, onClick: this.handleZoomIn }, h("kritzel-icon", { key: '71ca263815fd1774d5511118d8217863adcac64b', name: "plus" })))));
|
|
43
43
|
}
|
|
44
44
|
static get style() { return kritzelZoomPanelCss(); }
|
|
45
45
|
}, [513, "kritzel-zoom-panel", {
|