kritzel-stencil 0.0.133 → 0.0.134
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-DCHCVnOl.js → index-DILpAbYp.js} +12 -5
- package/dist/cjs/index-DILpAbYp.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/kritzel-color_22.cjs.entry.js +58 -71
- package/dist/collection/classes/commands/add-selection-group.command.js +6 -3
- package/dist/collection/classes/commands/add-selection-group.command.js.map +1 -1
- package/dist/collection/classes/commands/move-selection-group.command.js +5 -0
- package/dist/collection/classes/commands/move-selection-group.command.js.map +1 -1
- package/dist/collection/classes/core/core.class.js +3 -1
- package/dist/collection/classes/core/core.class.js.map +1 -1
- package/dist/collection/classes/core/history.class.js +1 -0
- package/dist/collection/classes/core/history.class.js.map +1 -1
- package/dist/collection/classes/core/viewport.class.js +0 -6
- package/dist/collection/classes/core/viewport.class.js.map +1 -1
- package/dist/collection/classes/handlers/key.handler.js +42 -58
- package/dist/collection/classes/handlers/key.handler.js.map +1 -1
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +10 -3
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js.map +1 -1
- package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.js +1 -2
- package/dist/collection/components/ui/kritzel-context-menu/kritzel-context-menu.js.map +1 -1
- package/dist/collection/interfaces/shortcut.interface.js +2 -0
- package/dist/collection/interfaces/shortcut.interface.js.map +1 -0
- package/dist/components/index.js +1 -1
- package/dist/components/kritzel-context-menu.js +1 -1
- package/dist/components/kritzel-editor.js +2 -2
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/{p-CwH-bwjb.js → p-CZzYv_iN.js} +69 -74
- package/dist/components/p-CZzYv_iN.js.map +1 -0
- package/dist/components/{p-BGdsAz54.js → p-DOPuq6gn.js} +3 -4
- package/dist/components/p-DOPuq6gn.js.map +1 -0
- package/dist/esm/{index-DY3KqYWc.js → index-BrCE-Ctm.js} +12 -5
- package/dist/esm/index-BrCE-Ctm.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/kritzel-color_22.entry.js +58 -71
- package/dist/stencil/index.esm.js +1 -1
- package/dist/stencil/p-092c9a05.entry.js +2 -0
- package/dist/stencil/p-092c9a05.entry.js.map +1 -0
- package/dist/stencil/p-BrCE-Ctm.js +2 -0
- package/dist/stencil/p-BrCE-Ctm.js.map +1 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/classes/commands/add-selection-group.command.d.ts +2 -1
- package/dist/types/classes/handlers/key.handler.d.ts +2 -0
- package/dist/types/interfaces/shortcut.interface.d.ts +8 -0
- package/package.json +1 -1
- package/dist/cjs/index-DCHCVnOl.js.map +0 -1
- package/dist/components/p-BGdsAz54.js.map +0 -1
- package/dist/components/p-CwH-bwjb.js.map +0 -1
- package/dist/esm/index-DY3KqYWc.js.map +0 -1
- package/dist/stencil/p-DY3KqYWc.js +0 -2
- package/dist/stencil/p-DY3KqYWc.js.map +0 -1
- package/dist/stencil/p-dc534b01.entry.js +0 -2
- package/dist/stencil/p-dc534b01.entry.js.map +0 -1
|
@@ -23,7 +23,6 @@ const KritzelContextMenu = /*@__PURE__*/ proxyCustomElement(class KritzelContext
|
|
|
23
23
|
close;
|
|
24
24
|
processedItems = [];
|
|
25
25
|
handleOutsideClick(event) {
|
|
26
|
-
event.preventDefault();
|
|
27
26
|
const path = event.composedPath();
|
|
28
27
|
if (!path.includes(this.host)) {
|
|
29
28
|
this.close.emit();
|
|
@@ -58,7 +57,7 @@ const KritzelContextMenu = /*@__PURE__*/ proxyCustomElement(class KritzelContext
|
|
|
58
57
|
return defaultValue;
|
|
59
58
|
}
|
|
60
59
|
render() {
|
|
61
|
-
return (h(Host, { key: '
|
|
60
|
+
return (h(Host, { key: '908711e45cb4ea41f25c4f66a9d3b03c847f886e' }, h("div", { key: '7dcb6e5654ecafebc1fc1a2efb9fa1b8678236c4', class: "menu-container" }, this.processedItems.map(({ item, isDisabled }, index) => (h("button", { key: `${item.label}-${index}`, class: { 'menu-item': true, 'disabled': isDisabled }, onClick: () => this.handleItemClick(item, isDisabled), disabled: isDisabled }, item.icon && h("kritzel-icon", { name: item.icon, size: 16 }), h("span", { class: "label" }, item.label)))))));
|
|
62
61
|
}
|
|
63
62
|
static get watchers() { return {
|
|
64
63
|
"items": ["onItemsChanged"]
|
|
@@ -91,6 +90,6 @@ function defineCustomElement() {
|
|
|
91
90
|
}
|
|
92
91
|
|
|
93
92
|
export { KritzelContextMenu as K, defineCustomElement as d };
|
|
94
|
-
//# sourceMappingURL=p-
|
|
93
|
+
//# sourceMappingURL=p-DOPuq6gn.js.map
|
|
95
94
|
|
|
96
|
-
//# sourceMappingURL=p-
|
|
95
|
+
//# sourceMappingURL=p-DOPuq6gn.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-DOPuq6gn.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,yxCAAyxC;;MCc1yC,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AAGrB,IAAA,KAAK;IAEb,cAAc,GAAA;QACZ,IAAI,CAAC,eAAe,EAAE;;AAGhB,IAAA,OAAO;AAEN,IAAA,cAAc;AACd,IAAA,KAAK;IAEG,cAAc,GAAwB,EAAE;AAGzD,IAAA,kBAAkB,CAAC,KAAiB,EAAA;AAClC,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE;QACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AAC7B,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;;;IAIrB,iBAAiB,GAAA;QACf,IAAI,CAAC,eAAe,EAAE;;IAGhB,eAAe,CAAC,IAAqB,EAAE,UAAmB,EAAA;QAChE,IAAI,CAAC,UAAU,EAAE;AACf,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC;;;AAI1B,IAAA,MAAM,eAAe,GAAA;QAC3B,MAAM,SAAS,GAAwB,EAAE;AAEzC,QAAA,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;AAC7B,YAAA,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC;YACjE,IAAI,SAAS,EAAE;AACb,gBAAA,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;gBACpE,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;;;AAIxC,QAAA,IAAI,CAAC,cAAc,GAAG,SAAS;;AAGzB,IAAA,MAAM,gBAAgB,CAAC,KAAoG,EAAE,YAAqB,EAAA;AACxJ,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC9B,YAAA,OAAO,KAAK;;AAEd,QAAA,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;AAC/B,YAAA,OAAO,MAAM,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;;AAEzD,QAAA,OAAO,YAAY;;IAGrB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,KAAK,MACnD,CACE,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAC,KAAK,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,EAC7B,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,EACpD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,UAAU,CAAC,EACrD,QAAQ,EAAE,UAAU,EAAA,EAEnB,IAAI,CAAC,IAAI,IAAI,CAAA,CAAA,cAAA,EAAA,EAAc,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAiB,CAAA,EACtE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACV,CAAC,CACE,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ui/kritzel-context-menu/kritzel-context-menu.css?tag=kritzel-context-menu&encapsulation=shadow","src/components/ui/kritzel-context-menu/kritzel-context-menu.tsx"],"sourcesContent":[":host {\r\n display: block; \r\n}\r\n\r\n.menu-container {\r\n display: flex;\r\n flex-direction: column;\r\n background-color: var(--kritzel-context-menu-background-color, #ffffff);\r\n border-radius: var(--kritzel-context-menu-border-radius, 12px);\r\n box-shadow: var(--kritzel-context-menu-box-shadow, 0 1px 6px rgba(0, 0, 0, 0.12));\r\n border: var(--kritzel-context-menu-border, 1px solid #ebebeb);\r\n padding: var(--kritzel-context-menu-padding,4px);\r\n}\r\n\r\n.menu-item {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--kritzel-context-menu-item-gap, 8px);\r\n background: none;\r\n border: none;\r\n text-align: left;\r\n padding: var(--kritzel-context-menu-item-padding, 8px);\r\n border-radius: var(--kritzel-context-menu-item-border-radius, 12px);\r\n cursor: pointer;\r\n font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n color: var(--kritzel-context-menu-item-color, #333333);\r\n white-space: nowrap;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.menu-item:not(.disabled):hover {\r\n background-color: var(--kritzel-context-menu-item-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.menu-item:not(.disabled):active {\r\n background-color: var(--kritzel-context-menu-item-active-background-color, hsl(0, 0%, 0%, 8.6%));\r\n}\r\n\r\n.menu-item.disabled {\r\n color: var(--kritzel-context-menu-item-disabled-color, #aaaaaa);\r\n cursor: default;\r\n}\r\n\r\n.menu-item kritzel-icon {\r\n opacity: 0.8;\r\n flex-shrink: 0;\r\n}\r\n\r\n.menu-item.disabled kritzel-icon {\r\n opacity: 0.4;\r\n}\r\n\r\n.label {\r\n flex-grow: 1;\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter, State, Watch, Listen, Element } from '@stencil/core';\r\nimport { ContextMenuItem } from '../../../interfaces/context-menu-item.interface';\r\nimport { KritzelBaseObject } from '../../../classes/objects/base-object.class';\r\n\r\ninterface ProcessedMenuItem {\r\n item: ContextMenuItem;\r\n isDisabled: boolean;\r\n}\r\n\r\n@Component({\r\n tag: 'kritzel-context-menu',\r\n styleUrl: 'kritzel-context-menu.css',\r\n shadow: true,\r\n})\r\nexport class KritzelContextMenu {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() items: ContextMenuItem[];\r\n @Watch('items')\r\n onItemsChanged() {\r\n this.updateMenuItems();\r\n }\r\n\r\n @Prop() objects: KritzelBaseObject[];\r\n\r\n @Event() actionSelected: EventEmitter<ContextMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() private processedItems: ProcessedMenuItem[] = [];\r\n\r\n @Listen('pointerdown', { target: 'window' })\r\n handleOutsideClick(event: MouseEvent) {\r\n const path = event.composedPath();\r\n if (!path.includes(this.host)) {\r\n this.close.emit();\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateMenuItems();\r\n }\r\n\r\n private handleItemClick(item: ContextMenuItem, isDisabled: boolean) {\r\n if (!isDisabled) {\r\n this.actionSelected.emit(item);\r\n }\r\n }\r\n\r\n private async updateMenuItems() {\r\n const processed: ProcessedMenuItem[] = [];\r\n\r\n for (const item of this.items) {\r\n const isVisible = await this.evaluateProperty(item.visible, true);\r\n if (isVisible) {\r\n const isDisabled = await this.evaluateProperty(item.disabled, false);\r\n processed.push({ item, isDisabled });\r\n }\r\n }\r\n\r\n this.processedItems = processed;\r\n }\r\n\r\n private async evaluateProperty(value: boolean | ((obj: KritzelBaseObject, objs: KritzelBaseObject[]) => boolean | Promise<boolean>), defaultValue: boolean): Promise<boolean> {\r\n if (typeof value === 'boolean') {\r\n return value;\r\n }\r\n if (typeof value === 'function') {\r\n return await Promise.resolve(value(null, this.objects));\r\n }\r\n return defaultValue;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div class=\"menu-container\">\r\n {this.processedItems.map(({ item, isDisabled }, index) => (\r\n <button\r\n key={`${item.label}-${index}`}\r\n class={{ 'menu-item': true, 'disabled': isDisabled }}\r\n onClick={() => this.handleItemClick(item, isDisabled)}\r\n disabled={isDisabled}\r\n >\r\n {item.icon && <kritzel-icon name={item.icon} size={16}></kritzel-icon>}\r\n <span class=\"label\">{item.label}</span>\r\n </button>\r\n ))}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -1430,6 +1430,11 @@ class MoveSelectionGroupCommand extends KritzelBaseCommand {
|
|
|
1430
1430
|
execute() {
|
|
1431
1431
|
if (this.skipExecution) {
|
|
1432
1432
|
this.skipExecution = false;
|
|
1433
|
+
// Skip execution, but still update objects
|
|
1434
|
+
this._core.store.state.selectionGroup.objects.forEach(object => {
|
|
1435
|
+
this._core.store.state.objectsMap.update(object);
|
|
1436
|
+
this._core.updateObjectInDatabase(object);
|
|
1437
|
+
});
|
|
1433
1438
|
return;
|
|
1434
1439
|
}
|
|
1435
1440
|
this._core.store.setState('selectionGroup', this.selectionGroup);
|
|
@@ -1902,19 +1907,21 @@ class KrtizelSelectionBox extends KritzelBaseObject {
|
|
|
1902
1907
|
|
|
1903
1908
|
class AddSelectionGroupCommand extends KritzelBaseCommand {
|
|
1904
1909
|
selectionGroup;
|
|
1905
|
-
|
|
1910
|
+
previousSelectionGroup;
|
|
1911
|
+
constructor(core, initiator, selectionGroup, previousSelectionGroup, skipHistory = false) {
|
|
1906
1912
|
super(core, initiator, skipHistory);
|
|
1907
1913
|
this.selectionGroup = selectionGroup;
|
|
1914
|
+
this.previousSelectionGroup = previousSelectionGroup || null;
|
|
1908
1915
|
}
|
|
1909
1916
|
execute() {
|
|
1910
|
-
this._core.store.state.objectsMap.remove(object => object instanceof KrtizelSelectionBox);
|
|
1917
|
+
this._core.store.state.objectsMap.remove(object => object instanceof KrtizelSelectionBox || object instanceof KritzelSelectionGroup);
|
|
1911
1918
|
this._core.store.state.objectsMap.insert(this.selectionGroup);
|
|
1912
1919
|
this._core.store.setState('selectionGroup', this.selectionGroup);
|
|
1913
1920
|
this._core.store.setState('selectionBox', null);
|
|
1914
1921
|
}
|
|
1915
1922
|
undo() {
|
|
1916
1923
|
this._core.store.state.objectsMap.remove(object => object.id === this.selectionGroup.id);
|
|
1917
|
-
this._core.store.setState('selectionGroup',
|
|
1924
|
+
this._core.store.setState('selectionGroup', this.previousSelectionGroup);
|
|
1918
1925
|
this._core.store.setState('selectionBox', null);
|
|
1919
1926
|
}
|
|
1920
1927
|
}
|
|
@@ -2727,6 +2734,6 @@ class KritzelImageTool extends KritzelBaseTool {
|
|
|
2727
2734
|
}
|
|
2728
2735
|
|
|
2729
2736
|
export { AddSelectionGroupCommand as A, BatchCommand as B, DEFAULT_BRUSH_CONFIG as D, KritzelBrushTool as K, ObjectHelper as O, RemoveSelectionGroupCommand as R, UpdateObjectCommand as U, KritzelTextTool as a, KritzelMouseButton as b, KritzelSelectionTool as c, KritzelEraserTool as d, DEFAULT_TEXT_CONFIG as e, KritzelImageTool as f, KritzelWorkspace as g, KritzelKeyboardHelper as h, KritzelEventHelper as i, KritzelBaseHandler as j, KritzelToolRegistry as k, KritzelSelectionGroup as l, KritzelBaseCommand as m, KrtizelSelectionBox as n, KritzelReviver as o, RemoveObjectCommand as p, AddObjectCommand as q, KritzelBaseTool as r, KritzelText as s, KritzelPath as t, KritzelImage as u };
|
|
2730
|
-
//# sourceMappingURL=index-
|
|
2737
|
+
//# sourceMappingURL=index-BrCE-Ctm.js.map
|
|
2731
2738
|
|
|
2732
|
-
//# sourceMappingURL=index-
|
|
2739
|
+
//# sourceMappingURL=index-BrCE-Ctm.js.map
|