npm - kritzel-stencil - Versions diffs - 0.0.165 → 0.0.167 - Mend

kritzel-stencil 0.0.165 → 0.0.167

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 (66) hide show

package/dist/components/{p-BuS7MM1j.js.map → p-BmdYFhLx.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-BuS7MM1j.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-split-button/kritzel-split-button.css?tag=kritzel-split-button&encapsulation=shadow","src/components/shared/kritzel-split-button/kritzel-split-button.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n font-family: sans-serif;\r\n z-index: 1;\r\n padding: var(--kritzel-split-button-padding, 4px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n box-shadow: var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-split-button-border, 1px solid #ebebeb);\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n:host(.mobile){\r\n --kritzel-split-button-hover-background-color: transparent;\r\n}\r\n\r\nbutton {\r\n border: none;\r\n background-color: transparent;\r\n padding: 0;\r\n margin: 0;\r\n font-family: inherit;\r\n font-size: inherit;\r\n color: inherit;\r\n -webkit-appearance: none;\r\n -moz-appearance: none;\r\n appearance: none;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n text-align: center;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: all;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.split-main-button,\r\n.split-menu-button {\r\n height: auto;\r\n display: flex;\r\n align-items: center;\r\n padding: var(--kritzel-split-button-padding, 8px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n font-size: var(--kritzel-split-button-font-size, 14px);\r\n}\r\n\r\n.split-main-button:hover,\r\n.split-menu-button:hover {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button:focus,\r\n.split-menu-button:focus {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button {\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n.split-menu-button {\r\n border-left: none;\r\n justify-content: center;\r\n}\r\n\r\n.split-divider {\r\n width: var(--kritzel-split-button-divider-width, 1px);\r\n height: 24px;\r\n background-color: var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, h, Prop, State, Event, EventEmitter, Host, Element, Method } from '@stencil/core';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-split-button',\r\n styleUrl: 'kritzel-split-button.css',\r\n shadow: true,\r\n})\r\nexport class KritzelSplitButton {\r\n @Element() host!: HTMLElement;\r\n\r\n @Prop() buttonIcon: string = 'plus';\r\n @Prop() dropdownIcon: string = 'chevron-down';\r\n @Prop() items: IKritzelMenuItem[] = [];\r\n @Prop() mainButtonDisabled = false;\r\n @Prop() menuButtonDisabled = false;\r\n\r\n @Event() mainButtonClick: EventEmitter<void>;\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() menuOpen: EventEmitter<void>;\r\n @Event() menuClose: EventEmitter<void>;\r\n\r\n @State() isMenuOpen = false;\r\n @State() isTouchDevice: boolean = KritzelDevicesHelper.isTouchDevice();\r\n @State() anchorElement: HTMLElement;\r\n @State() menuScrollTop: number = 0;\r\n\r\n splitMenuButtonRef: HTMLButtonElement;\r\n menuRef: HTMLKritzelMenuElement;\r\n\r\n @Method()\r\n async open() {\r\n if (this.isMenuOpen) return;\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n }\r\n\r\n @Method()\r\n async focusMenu() {\r\n if (this.menuRef) {\r\n await this.menuRef.setFocus();\r\n }\r\n }\r\n\r\n private handleButtonClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.mainButtonClick.emit();\r\n };\r\n\r\n private toggleMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n if (this.isMenuOpen) {\r\n this.closeMenu();\r\n } else {\r\n this.openMenu(event);\r\n }\r\n };\r\n\r\n private openMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n\r\n requestAnimationFrame(() => {\r\n this.menuRef?.setScrollTop(this.menuScrollTop);\r\n });\r\n };\r\n\r\n private closeMenu = () => {\r\n this.isMenuOpen = false;\r\n this.anchorElement = null;\r\n this.splitMenuButtonRef?.blur();\r\n this.menuClose.emit();\r\n };\r\n\r\n private handleItemSelect = event => {\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleItemSave = event => {\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleItemCancel = event => {\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleItemToggleChildMenu = event => {\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleItemCloseChildMenu = event => {\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleScroll = event => {\r\n this.menuScrollTop = (event.target as HTMLElement).scrollTop;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host class={{ mobile: this.isTouchDevice }}>\r\n <button class=\"split-main-button\" tabIndex={0} onClick={this.handleButtonClick} disabled={this.mainButtonDisabled}>\r\n {this.buttonIcon && <kritzel-icon name={this.buttonIcon}></kritzel-icon>}\r\n </button>\r\n\r\n <div class=\"split-divider\"></div>\r\n\r\n <button ref={el => (this.splitMenuButtonRef = el)} class=\"split-menu-button\" tabIndex={0} onClick={this.toggleMenu} disabled={this.menuButtonDisabled}>\r\n <kritzel-icon name={this.dropdownIcon}></kritzel-icon>\r\n </button>\r\n\r\n <kritzel-portal anchor={this.anchorElement} offsetY={4} onClose={this.closeMenu}>\r\n <kritzel-menu\r\n ref={el => (this.menuRef = el)}\r\n items={this.items}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleItemSave}\r\n onItemCancel={this.handleItemCancel}\r\n onItemToggleChildMenu={this.handleItemToggleChildMenu}\r\n onItemCloseChildMenu={this.handleItemCloseChildMenu}\r\n onClose={this.closeMenu}\r\n onScroll={this.handleScroll}\r\n ></kritzel-menu>\r\n </kritzel-portal>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BmdYFhLx.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-split-button/kritzel-split-button.css?tag=kritzel-split-button&encapsulation=shadow","src/components/shared/kritzel-split-button/kritzel-split-button.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n font-family: sans-serif;\r\n z-index: 1;\r\n padding: var(--kritzel-split-button-padding, 4px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n box-shadow: var(--kritzel-split-button-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-split-button-border, 1px solid #ebebeb);\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n:host(.mobile){\r\n --kritzel-split-button-hover-background-color: transparent;\r\n}\r\n\r\nbutton {\r\n border: none;\r\n background-color: transparent;\r\n padding: 0;\r\n margin: 0;\r\n font-family: inherit;\r\n font-size: inherit;\r\n color: inherit;\r\n -webkit-appearance: none;\r\n -moz-appearance: none;\r\n appearance: none;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n text-align: center;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: all;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.split-main-button,\r\n.split-menu-button {\r\n height: auto;\r\n display: flex;\r\n align-items: center;\r\n padding: var(--kritzel-split-button-padding, 8px);\r\n background-color: var(--kritzel-split-button-background-color, #ffffff);\r\n border-radius: var(--kritzel-split-button-border-radius, 12px);\r\n font-size: var(--kritzel-split-button-font-size, 14px);\r\n}\r\n\r\n.split-main-button:hover,\r\n.split-menu-button:hover {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button:focus,\r\n.split-menu-button:focus {\r\n background-color: var(--kritzel-split-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.split-main-button {\r\n gap: var(--kritzel-split-button-gap, 4px);\r\n}\r\n\r\n.split-menu-button {\r\n border-left: none;\r\n justify-content: center;\r\n}\r\n\r\n.split-divider {\r\n width: var(--kritzel-split-button-divider-width, 1px);\r\n height: 24px;\r\n background-color: var(--kritzel-split-button-divider-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, h, Prop, State, Event, EventEmitter, Host, Element, Method } from '@stencil/core';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-split-button',\r\n styleUrl: 'kritzel-split-button.css',\r\n shadow: true,\r\n})\r\nexport class KritzelSplitButton {\r\n @Element() host!: HTMLElement;\r\n\r\n @Prop() buttonIcon: string = 'plus';\r\n @Prop() dropdownIcon: string = 'chevron-down';\r\n @Prop() items: IKritzelMenuItem[] = [];\r\n @Prop() mainButtonDisabled = false;\r\n @Prop() menuButtonDisabled = false;\r\n\r\n @Event() mainButtonClick: EventEmitter<void>;\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() menuOpen: EventEmitter<void>;\r\n @Event() menuClose: EventEmitter<void>;\r\n\r\n @State() isMenuOpen = false;\r\n @State() isTouchDevice: boolean = KritzelDevicesHelper.isTouchDevice();\r\n @State() anchorElement: HTMLElement;\r\n @State() menuScrollTop: number = 0;\r\n\r\n splitMenuButtonRef: HTMLButtonElement;\r\n menuRef: HTMLKritzelMenuElement;\r\n\r\n @Method()\r\n async open() {\r\n if (this.isMenuOpen) return;\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n }\r\n\r\n @Method()\r\n async focusMenu() {\r\n if (this.menuRef) {\r\n await this.menuRef.setFocus();\r\n }\r\n }\r\n\r\n private handleButtonClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.mainButtonClick.emit();\r\n };\r\n\r\n private toggleMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n if (this.isMenuOpen) {\r\n this.closeMenu();\r\n } else {\r\n this.openMenu(event);\r\n }\r\n };\r\n\r\n private openMenu = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.isMenuOpen = true;\r\n this.anchorElement = this.host;\r\n this.menuOpen.emit();\r\n\r\n requestAnimationFrame(() => {\r\n this.menuRef?.setScrollTop(this.menuScrollTop);\r\n });\r\n };\r\n\r\n private closeMenu = () => {\r\n this.isMenuOpen = false;\r\n this.anchorElement = null;\r\n this.splitMenuButtonRef?.blur();\r\n this.menuClose.emit();\r\n };\r\n\r\n private handleItemSelect = event => {\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleItemSave = event => {\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleItemCancel = event => {\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleItemToggleChildMenu = event => {\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleItemCloseChildMenu = event => {\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleScroll = event => {\r\n this.menuScrollTop = (event.target as HTMLElement).scrollTop;\r\n }\r\n\r\n render() {\r\n return (\r\n <Host class={{ mobile: this.isTouchDevice }}>\r\n <button class=\"split-main-button\" tabIndex={0} onClick={this.handleButtonClick} disabled={this.mainButtonDisabled}>\r\n {this.buttonIcon && <kritzel-icon name={this.buttonIcon}></kritzel-icon>}\r\n </button>\r\n\r\n <div class=\"split-divider\"></div>\r\n\r\n <button ref={el => (this.splitMenuButtonRef = el)} class=\"split-menu-button\" tabIndex={0} onClick={this.toggleMenu} disabled={this.menuButtonDisabled}>\r\n <kritzel-icon name={this.dropdownIcon}></kritzel-icon>\r\n </button>\r\n\r\n <kritzel-portal anchor={this.anchorElement} offsetY={4} onClose={this.closeMenu}>\r\n <kritzel-menu\r\n ref={el => (this.menuRef = el)}\r\n items={this.items}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleItemSave}\r\n onItemCancel={this.handleItemCancel}\r\n onItemToggleChildMenu={this.handleItemToggleChildMenu}\r\n onItemCloseChildMenu={this.handleItemCloseChildMenu}\r\n onClose={this.closeMenu}\r\n onScroll={this.handleScroll}\r\n ></kritzel-menu>\r\n </kritzel-portal>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-DguzZn_x.js → p-BoazmhlG.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CwkUrTy1.js';
 import { d as defineCustomElement$3 } from './p-Cv4BGNPb.js';
 import { K as KritzelDevicesHelper } from './p-l10It7Nm.js';
-import { d as defineCustomElement$2 } from './p-OFrACpZf.js';
+import { d as defineCustomElement$2 } from './p-aeYt0bPO.js';
 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)}: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-bg, #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-bg, #007aff)}:host(.selected) .edit-input{color:var(--kritzel-menu-item-selected-color, #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) .edit-input::selection{background-color:var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16))}: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-bg, #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%}.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:1px solid var(--kritzel-menu-item-input-border, #ccc);font-size:var(--kritzel-context-menu-item-font-size, 14px);width:100%;min-width:0;box-sizing:border-box;outline:none}.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-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}";
@@ -155,7 +155,7 @@ function defineCustomElement$1() {
     } });
 }
-const kritzelMenuCss = ":host{position:relative;display:flex;flex-direction:column;background-color:var(--kritzel-menu-background-color, #ffffff);width:var(--kritzel-menu-width, 200px);padding:var(--kritzel-menu-padding, 8px);border-radius:var(--kritzel-menu-border-radius, 12px);box-shadow:var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-menu-border, 1px solid #ebebeb);z-index:2;gap:var(--kritzel-menu-gap, 4px);overflow-y:auto;scrollbar-color:#ebebeb transparent;scrollbar-width:thin;max-height:300px}.has-open-child-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:3}";
+const kritzelMenuCss = ":host{position:relative;display:flex;flex-direction:column;background-color:var(--kritzel-menu-background-color, #ffffff);width:var(--kritzel-menu-width, 200px);padding:var(--kritzel-menu-padding, 8px);border-radius:var(--kritzel-menu-border-radius, 12px);box-shadow:var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-menu-border, 1px solid #ebebeb);z-index:2;gap:var(--kritzel-menu-gap, 4px);overflow-y:auto;scrollbar-color:#ebebeb transparent;scrollbar-width:thin;max-height:var(--kritzel-portal-max-height, 300px);box-sizing:border-box}.has-open-child-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:3}";
 const KritzelMenu = /*@__PURE__*/ proxyCustomElement(class KritzelMenu extends H {
     constructor(registerHost) {
@@ -267,6 +267,6 @@ function defineCustomElement() {
 }
 export { KritzelMenu as K, defineCustomElement as a, KritzelMenuItem as b, defineCustomElement$1 as d };
-//# sourceMappingURL=p-DguzZn_x.js.map
+//# sourceMappingURL=p-BoazmhlG.js.map
-//# sourceMappingURL=p-DguzZn_x.js.map
+//# sourceMappingURL=p-BoazmhlG.js.map

package/dist/components/{p-DguzZn_x.js.map → p-BoazmhlG.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-DguzZn_x.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-menu-item/kritzel-menu-item.css?tag=kritzel-menu-item&encapsulation=shadow","src/components/shared/kritzel-menu-item/kritzel-menu-item.tsx","src/components/shared/kritzel-menu/kritzel-menu.css?tag=kritzel-menu&encapsulation=shadow","src/components/shared/kritzel-menu/kritzel-menu.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n padding: var(--kritzel-menu-item-padding, 8px);\r\n box-sizing: border-box;\r\n gap: 16px;\r\n height: var(--kritzel-menu-item-height, 40px);\r\n min-height: var(--kritzel-menu-item-min-height, 40px);\r\n font-family: sans-serif;\r\n font-size: var(--kritzel-menu-item-font-size, 14px);\r\n color: var(--kritzel-menu-item-color, #333333);\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n:host(:hover) .menu-item-overlay,\r\n:host(:focus-within) .menu-item-overlay {\r\n background-color: var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected.editing) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n:host(.selected) .edit-input {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button kritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\nkritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-color, #333333);\r\n}\r\n\r\n:host(.selected) .edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16));\r\n}\r\n\r\n:host(.editing) {\r\n background-color: var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.disabled) {\r\n opacity: 0.5;\r\n pointer-events: none !important;\r\n}\r\n\r\n:host(.child-open) {\r\n background-color: var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.child-open.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n.menu-item-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background-color: transparent;\r\n z-index: 0;\r\n pointer-events: none;\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n.menu-item-content {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n position: relative;\r\n z-index: 1;\r\n height: 100%;\r\n}\r\n\r\n.left {\r\n justify-content: flex-start;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.left > div {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n}\r\n\r\n.right {\r\n justify-content: flex-end;\r\n}\r\n\r\n.edit-input {\r\n flex: 1;\r\n height: var(--kritzel-menu-item-input-height, 24px);\r\n padding: 0;\r\n background-color: transparent;\r\n border-radius: 0;\r\n border: none;\r\n border-bottom: 1px solid var(--kritzel-menu-item-input-border, #ccc);\r\n font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n width: 100%;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n outline: none;\r\n}\r\n\r\n.edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, #007bff);\r\n color: var(--kritzel-menu-item-input-selection-text-color, #ffffff);\r\n}\r\n\r\n.action-button {\r\n padding: 4px;\r\n border-radius: 8px;\r\n border: none;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background-color: transparent;\r\n background: transparent;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.action-button:hover,\r\n.action-button:focus {\r\n background-color: var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.action-button.disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, Host, Prop, h, Element, State, Watch, Event, EventEmitter } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\n\r\n@Component({\r\n tag: 'kritzel-menu-item',\r\n styleUrl: 'kritzel-menu-item.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenuItem {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() item: IKritzelMenuItem;\r\n @Watch('item')\r\n onItemChange(newValue: IKritzelMenuItem, oldValue: IKritzelMenuItem) {\r\n if (newValue !== oldValue) {\r\n this.isDirty = false;\r\n }\r\n }\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n\r\n @State()\r\n isDirty: boolean = false;\r\n\r\n private inputRef: HTMLInputElement;\r\n\r\n private focusInput() {\r\n if (this.item.isEditing && this.inputRef && !this.isDirty) {\r\n this.inputRef.focus();\r\n\r\n if (KritzelDevicesHelper.isIOS()) {\r\n const length = this.inputRef.value.length;\r\n this.inputRef.setSelectionRange(length, length);\r\n } else {\r\n this.inputRef.select();\r\n }\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.setDeviceSpecificStyles();\r\n this.focusInput();\r\n }\r\n\r\n componentDidUpdate() {\r\n this.focusInput();\r\n }\r\n\r\n private setDeviceSpecificStyles = () => {\r\n const isTouchDevice = KritzelDevicesHelper.isTouchDevice();\r\n if (isTouchDevice) {\r\n this.host.style.setProperty('--kritzel-menu-item-overlay-background-color', 'transparent');\r\n this.host.style.setProperty('--kritzel-menu-item-button-hover-background-color', 'transparent');\r\n }\r\n };\r\n\r\n private handleItemSelect = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit({ item: this.item, parent: this.parent });\r\n };\r\n\r\n private handleInputChange = (event: Event) => {\r\n event.stopPropagation();\r\n const target = event.target as HTMLInputElement;\r\n this.item.label = target.value;\r\n this.isDirty = true;\r\n };\r\n\r\n private handleSave = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemSave.emit(this.item);\r\n };\r\n\r\n private handleCancel = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemCancel.emit(this.item);\r\n };\r\n\r\n private handleMenuToggle = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit({ item: this.item, childMenuAnchor: event.target as HTMLElement });\r\n };\r\n\r\n private handleMenuClose = () => {\r\n this.itemCloseChildMenu.emit(this.item);\r\n };\r\n\r\n private renderViewMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <div>{this.item.label}</div>\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n {this.item.children &&\r\n this.item.children.length > 0 && [\r\n <button id=\"child-menu-toggle\" class=\"action-button\" onClick={this.handleMenuToggle} disabled={this.item.isDisabled}>\r\n <kritzel-icon name=\"ellipsis-vertical\" size={16}></kritzel-icon>\r\n </button>,\r\n <kritzel-portal anchor={this.item.childMenuAnchor} offsetY={4} onClose={this.handleMenuClose}>\r\n <kritzel-menu\r\n items={this.item.children}\r\n parent={this.item}\r\n onItemSelect={event => this.itemSelect.emit(event.detail)}\r\n onItemSave={event => this.itemSave.emit(event.detail)}\r\n onItemCancel={event => this.itemCancel.emit(event.detail)}\r\n onClose={this.handleMenuClose}\r\n ></kritzel-menu>\r\n </kritzel-portal>,\r\n ]}\r\n </div>,\r\n ];\r\n }\r\n\r\n private renderEditMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <input\r\n ref={el => (this.inputRef = el)}\r\n type=\"text\"\r\n class=\"edit-input\"\r\n value={this.item.label}\r\n onInput={this.handleInputChange}\r\n />\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n <div tabIndex={0} class=\"action-button\" onClick={this.handleCancel}>\r\n <kritzel-icon name=\"x\" size={16}></kritzel-icon>\r\n </div>\r\n <div\r\n tabIndex={!this.isDirty && !this.item.isNewItem ? -1 : 0}\r\n class={{ 'action-button': true, 'disabled': !this.isDirty && !this.item.isNewItem }}\r\n onClick={this.handleSave}\r\n >\r\n <kritzel-icon name=\"check\" size={16}></kritzel-icon>\r\n </div>\r\n </div>,\r\n ];\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n tabIndex={this.item.isDisabled ? -1 : 0}\r\n class={{\r\n 'selected': this.item.isSelected,\r\n 'editing': this.item.isEditing,\r\n 'disabled': this.item.isDisabled,\r\n 'child-open': this.item.isChildMenuOpen,\r\n }}\r\n onClick={this.handleItemSelect}\r\n >\r\n <div class=\"menu-item-overlay\"></div>\r\n {this.item.isEditing ? this.renderEditMode() : this.renderViewMode()}\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: var(--kritzel-menu-background-color, #ffffff);\r\n width: var(--kritzel-menu-width, 200px);\r\n padding: var(--kritzel-menu-padding, 8px);\r\n border-radius: var(--kritzel-menu-border-radius, 12px);\r\n box-shadow: var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-menu-border, 1px solid #ebebeb);\r\n z-index: 2;\r\n gap: var(--kritzel-menu-gap, 4px);\r\n overflow-y: auto;\r\n scrollbar-color: #ebebeb transparent;\r\n scrollbar-width: thin;\r\n max-height: 300px;\r\n}\r\n\r\n\r\n.has-open-child-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 3;\r\n}\r\n","import { Component, Host, Prop, h, State, Event, EventEmitter, Element, Method } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-menu',\r\n styleUrl: 'kritzel-menu.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenu {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() items: IKritzelMenuItem[];\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() selectedIndex: number \| null = null;\r\n\r\n @Method()\r\n async setScrollTop(scrollTop: number) {\r\n this.host.scrollTop = scrollTop;\r\n this.host.scrollTo({ top: scrollTop, behavior: 'auto' });\r\n }\r\n\r\n @Method()\r\n async setFocus() {\r\n const firstItem = this.host.shadowRoot.querySelector('kritzel-menu-item');\r\n if (firstItem) {\r\n firstItem.focus();\r\n }\r\n }\r\n\r\n get openChildMenuItem() {\r\n return this.items.find(item => item.isChildMenuOpen);\r\n }\r\n\r\n get editingMenuItem() {\r\n return this.items.find(item => item.isEditing);\r\n }\r\n\r\n private onOverlayClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(this.openChildMenuItem);\r\n };\r\n\r\n private handleItemSelect = (event: CustomEvent<{ item: IKritzelMenuItem; parent: IKritzelMenuItem }>) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleSave = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleCancel = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleToggleChildMenu = (event: CustomEvent<{ item: IKritzelMenuItem; childMenuAnchor: HTMLElement }>) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleCloseChildMenu = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n render() {\r\n return (\r\n <Host tabIndex={0} onClick={e => e.stopPropagation()}>\r\n {this.openChildMenuItem && <div class=\"has-open-child-overlay\" onClick={this.onOverlayClick}></div>}\r\n {this.items.map(item => (\r\n <kritzel-menu-item\r\n key={item.id}\r\n item={item}\r\n parent={this.parent}\r\n style={{ pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleSave}\r\n onItemCancel={this.handleCancel}\r\n onItemToggleChildMenu={this.handleToggleChildMenu}\r\n onItemCloseChildMenu={this.handleCloseChildMenu}\r\n ></kritzel-menu-item>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-BoazmhlG.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/kritzel-menu-item/kritzel-menu-item.css?tag=kritzel-menu-item&encapsulation=shadow","src/components/shared/kritzel-menu-item/kritzel-menu-item.tsx","src/components/shared/kritzel-menu/kritzel-menu.css?tag=kritzel-menu&encapsulation=shadow","src/components/shared/kritzel-menu/kritzel-menu.tsx"],"sourcesContent":[":host {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n padding: var(--kritzel-menu-item-padding, 8px);\r\n box-sizing: border-box;\r\n gap: 16px;\r\n height: var(--kritzel-menu-item-height, 40px);\r\n min-height: var(--kritzel-menu-item-min-height, 40px);\r\n font-family: sans-serif;\r\n font-size: var(--kritzel-menu-item-font-size, 14px);\r\n color: var(--kritzel-menu-item-color, #333333);\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n:host(:hover) .menu-item-overlay,\r\n:host(:focus-within) .menu-item-overlay {\r\n background-color: var(--kritzel-menu-item-overlay-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected.editing) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n:host(.selected) .edit-input {\r\n color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\n:host(.selected) .action-button kritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-selected-color, #ffffff);\r\n}\r\n\r\nkritzel-icon {\r\n --kritzel-icon-color: var(--kritzel-menu-item-color, #333333);\r\n}\r\n\r\n:host(.selected) .edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, rgba(255, 255, 255, 0.16));\r\n}\r\n\r\n:host(.editing) {\r\n background-color: var(--kritzel-menu-item-editing-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.disabled) {\r\n opacity: 0.5;\r\n pointer-events: none !important;\r\n}\r\n\r\n:host(.child-open) {\r\n background-color: var(--kritzel-menu-item-child-open-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n:host(.child-open.selected) {\r\n background-color: var(--kritzel-menu-item-selected-bg, #007aff);\r\n}\r\n\r\n.menu-item-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background-color: transparent;\r\n z-index: 0;\r\n pointer-events: none;\r\n border-radius: var(--kritzel-menu-item-border-radius, 12px);\r\n}\r\n\r\n.menu-item-content {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n position: relative;\r\n z-index: 1;\r\n height: 100%;\r\n}\r\n\r\n.left {\r\n justify-content: flex-start;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.left > div {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n}\r\n\r\n.right {\r\n justify-content: flex-end;\r\n}\r\n\r\n.edit-input {\r\n flex: 1;\r\n height: var(--kritzel-menu-item-input-height, 24px);\r\n padding: 0;\r\n background-color: transparent;\r\n border-radius: 0;\r\n border: none;\r\n border-bottom: 1px solid var(--kritzel-menu-item-input-border, #ccc);\r\n font-size: var(--kritzel-context-menu-item-font-size, 14px);\r\n width: 100%;\r\n min-width: 0;\r\n box-sizing: border-box;\r\n outline: none;\r\n}\r\n\r\n.edit-input::selection {\r\n background-color: var(--kritzel-menu-item-input-selection-color, #007bff);\r\n color: var(--kritzel-menu-item-input-selection-text-color, #ffffff);\r\n}\r\n\r\n.action-button {\r\n padding: 4px;\r\n border-radius: 8px;\r\n border: none;\r\n cursor: var(--kritzel-pointer-cursor, pointer);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background-color: transparent;\r\n background: transparent;\r\n -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.action-button:hover,\r\n.action-button:focus {\r\n background-color: var(--kritzel-menu-item-button-hover-background-color, hsl(0, 0%, 0%, 4.3%));\r\n}\r\n\r\n.action-button.disabled {\r\n pointer-events: none;\r\n opacity: 0.5;\r\n}\r\n","import { Component, Host, Prop, h, Element, State, Watch, Event, EventEmitter } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\nimport { KritzelDevicesHelper } from '../../../helpers/devices.helper';\r\n\r\n@Component({\r\n tag: 'kritzel-menu-item',\r\n styleUrl: 'kritzel-menu-item.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenuItem {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() item: IKritzelMenuItem;\r\n @Watch('item')\r\n onItemChange(newValue: IKritzelMenuItem, oldValue: IKritzelMenuItem) {\r\n if (newValue !== oldValue) {\r\n this.isDirty = false;\r\n }\r\n }\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n\r\n @State()\r\n isDirty: boolean = false;\r\n\r\n private inputRef: HTMLInputElement;\r\n\r\n private focusInput() {\r\n if (this.item.isEditing && this.inputRef && !this.isDirty) {\r\n this.inputRef.focus();\r\n\r\n if (KritzelDevicesHelper.isIOS()) {\r\n const length = this.inputRef.value.length;\r\n this.inputRef.setSelectionRange(length, length);\r\n } else {\r\n this.inputRef.select();\r\n }\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n this.setDeviceSpecificStyles();\r\n this.focusInput();\r\n }\r\n\r\n componentDidUpdate() {\r\n this.focusInput();\r\n }\r\n\r\n private setDeviceSpecificStyles = () => {\r\n const isTouchDevice = KritzelDevicesHelper.isTouchDevice();\r\n if (isTouchDevice) {\r\n this.host.style.setProperty('--kritzel-menu-item-overlay-background-color', 'transparent');\r\n this.host.style.setProperty('--kritzel-menu-item-button-hover-background-color', 'transparent');\r\n }\r\n };\r\n\r\n private handleItemSelect = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit({ item: this.item, parent: this.parent });\r\n };\r\n\r\n private handleInputChange = (event: Event) => {\r\n event.stopPropagation();\r\n const target = event.target as HTMLInputElement;\r\n this.item.label = target.value;\r\n this.isDirty = true;\r\n };\r\n\r\n private handleSave = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemSave.emit(this.item);\r\n };\r\n\r\n private handleCancel = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.host.focus();\r\n this.itemCancel.emit(this.item);\r\n };\r\n\r\n private handleMenuToggle = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit({ item: this.item, childMenuAnchor: event.target as HTMLElement });\r\n };\r\n\r\n private handleMenuClose = () => {\r\n this.itemCloseChildMenu.emit(this.item);\r\n };\r\n\r\n private renderViewMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <div>{this.item.label}</div>\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n {this.item.children &&\r\n this.item.children.length > 0 && [\r\n <button id=\"child-menu-toggle\" class=\"action-button\" onClick={this.handleMenuToggle} disabled={this.item.isDisabled}>\r\n <kritzel-icon name=\"ellipsis-vertical\" size={16}></kritzel-icon>\r\n </button>,\r\n <kritzel-portal anchor={this.item.childMenuAnchor} offsetY={4} onClose={this.handleMenuClose}>\r\n <kritzel-menu\r\n items={this.item.children}\r\n parent={this.item}\r\n onItemSelect={event => this.itemSelect.emit(event.detail)}\r\n onItemSave={event => this.itemSave.emit(event.detail)}\r\n onItemCancel={event => this.itemCancel.emit(event.detail)}\r\n onClose={this.handleMenuClose}\r\n ></kritzel-menu>\r\n </kritzel-portal>,\r\n ]}\r\n </div>,\r\n ];\r\n }\r\n\r\n private renderEditMode() {\r\n return [\r\n <div class=\"menu-item-content left\">\r\n <input\r\n ref={el => (this.inputRef = el)}\r\n type=\"text\"\r\n class=\"edit-input\"\r\n value={this.item.label}\r\n onInput={this.handleInputChange}\r\n />\r\n </div>,\r\n <div class=\"menu-item-content right\">\r\n <div tabIndex={0} class=\"action-button\" onClick={this.handleCancel}>\r\n <kritzel-icon name=\"x\" size={16}></kritzel-icon>\r\n </div>\r\n <div\r\n tabIndex={!this.isDirty && !this.item.isNewItem ? -1 : 0}\r\n class={{ 'action-button': true, 'disabled': !this.isDirty && !this.item.isNewItem }}\r\n onClick={this.handleSave}\r\n >\r\n <kritzel-icon name=\"check\" size={16}></kritzel-icon>\r\n </div>\r\n </div>,\r\n ];\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n tabIndex={this.item.isDisabled ? -1 : 0}\r\n class={{\r\n 'selected': this.item.isSelected,\r\n 'editing': this.item.isEditing,\r\n 'disabled': this.item.isDisabled,\r\n 'child-open': this.item.isChildMenuOpen,\r\n }}\r\n onClick={this.handleItemSelect}\r\n >\r\n <div class=\"menu-item-overlay\"></div>\r\n {this.item.isEditing ? this.renderEditMode() : this.renderViewMode()}\r\n </Host>\r\n );\r\n }\r\n}\r\n",":host {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: var(--kritzel-menu-background-color, #ffffff);\r\n width: var(--kritzel-menu-width, 200px);\r\n padding: var(--kritzel-menu-padding, 8px);\r\n border-radius: var(--kritzel-menu-border-radius, 12px);\r\n box-shadow: var(--kritzel-menu-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));\r\n border: var(--kritzel-menu-border, 1px solid #ebebeb);\r\n z-index: 2;\r\n gap: var(--kritzel-menu-gap, 4px);\r\n overflow-y: auto;\r\n scrollbar-color: #ebebeb transparent;\r\n scrollbar-width: thin;\r\n max-height: var(--kritzel-portal-max-height, 300px);\r\n box-sizing: border-box;\r\n}\r\n\r\n\r\n.has-open-child-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 3;\r\n}\r\n","import { Component, Host, Prop, h, State, Event, EventEmitter, Element, Method } from '@stencil/core';\r\nimport { IKritzelMenuItem, IKritzelMenuItemSelectEvent, IKritzelMenuItemToggleChildMenuEvent } from '../../../interfaces/menu-item.interface';\r\n\r\n@Component({\r\n tag: 'kritzel-menu',\r\n styleUrl: 'kritzel-menu.css',\r\n shadow: true,\r\n})\r\nexport class KritzelMenu {\r\n @Element() host: HTMLElement;\r\n\r\n @Prop() items: IKritzelMenuItem[];\r\n @Prop() parent: IKritzelMenuItem = null;\r\n\r\n @Event() itemSelect: EventEmitter<IKritzelMenuItemSelectEvent>;\r\n @Event() itemSave: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemCancel: EventEmitter<IKritzelMenuItem>;\r\n @Event() itemToggleChildMenu: EventEmitter<IKritzelMenuItemToggleChildMenuEvent>;\r\n @Event() itemCloseChildMenu: EventEmitter<IKritzelMenuItem>;\r\n @Event() close: EventEmitter<void>;\r\n\r\n @State() selectedIndex: number \| null = null;\r\n\r\n @Method()\r\n async setScrollTop(scrollTop: number) {\r\n this.host.scrollTop = scrollTop;\r\n this.host.scrollTo({ top: scrollTop, behavior: 'auto' });\r\n }\r\n\r\n @Method()\r\n async setFocus() {\r\n const firstItem = this.host.shadowRoot.querySelector('kritzel-menu-item');\r\n if (firstItem) {\r\n firstItem.focus();\r\n }\r\n }\r\n\r\n get openChildMenuItem() {\r\n return this.items.find(item => item.isChildMenuOpen);\r\n }\r\n\r\n get editingMenuItem() {\r\n return this.items.find(item => item.isEditing);\r\n }\r\n\r\n private onOverlayClick = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(this.openChildMenuItem);\r\n };\r\n\r\n private handleItemSelect = (event: CustomEvent<{ item: IKritzelMenuItem; parent: IKritzelMenuItem }>) => {\r\n event.stopPropagation();\r\n this.itemSelect.emit(event.detail);\r\n };\r\n\r\n private handleSave = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemSave.emit(event.detail);\r\n };\r\n\r\n private handleCancel = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCancel.emit(event.detail);\r\n };\r\n\r\n private handleToggleChildMenu = (event: CustomEvent<{ item: IKritzelMenuItem; childMenuAnchor: HTMLElement }>) => {\r\n event.stopPropagation();\r\n this.itemToggleChildMenu.emit(event.detail);\r\n };\r\n\r\n private handleCloseChildMenu = (event: CustomEvent<IKritzelMenuItem>) => {\r\n event.stopPropagation();\r\n this.itemCloseChildMenu.emit(event.detail);\r\n };\r\n\r\n render() {\r\n return (\r\n <Host tabIndex={0} onClick={e => e.stopPropagation()}>\r\n {this.openChildMenuItem && <div class=\"has-open-child-overlay\" onClick={this.onOverlayClick}></div>}\r\n {this.items.map(item => (\r\n <kritzel-menu-item\r\n key={item.id}\r\n item={item}\r\n parent={this.parent}\r\n style={{ pointerEvents: this.editingMenuItem && !item.isEditing ? 'none' : 'auto' }}\r\n onItemSelect={this.handleItemSelect}\r\n onItemSave={this.handleSave}\r\n onItemCancel={this.handleCancel}\r\n onItemToggleChildMenu={this.handleToggleChildMenu}\r\n onItemCloseChildMenu={this.handleCloseChildMenu}\r\n ></kritzel-menu-item>\r\n ))}\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-Dz2XHHqa.js → p-Bwv1dxAB.js} RENAMED Viewed

@@ -14639,9 +14639,10 @@ class KritzelBrushTool extends KritzelBaseTool {
     color = '#000000';
     size = 6;
     palettes = {
-        pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],
+        pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#800080'],
         highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],
     };
+    _currentPathId = null;
     constructor(core) {
         super(core);
     }
@@ -14663,6 +14664,7 @@ class KritzelBrushTool extends KritzelBaseTool {
                     strokeWidth: this.size,
                 });
                 path.isCompleted = false;
+                this._currentPathId = path.id;
                 this._core.store.state.objects.insert(path);
             }
         }
@@ -14681,6 +14683,7 @@ class KritzelBrushTool extends KritzelBaseTool {
                     strokeWidth: this.size,
                 });
                 path.isCompleted = false;
+                this._currentPathId = path.id;
                 this._core.store.state.objects.insert(path);
             }
         }
@@ -14690,8 +14693,9 @@ class KritzelBrushTool extends KritzelBaseTool {
             event.preventDefault();
         }
         if (event.pointerType === 'mouse') {
-            if (this._core.store.state.isDrawing) {
-                const currentPath = this._core.store.currentPath;
+            if (this._core.store.state.isDrawing && this._currentPathId) {
+                const matchingObjects = this._core.store.state.objects.filter(o => o.id === this._currentPathId);
+                const currentPath = matchingObjects.length > 0 ? matchingObjects[0] : null;
                 if (currentPath) {
                     const x = event.clientX - this._core.store.offsetX;
                     const y = event.clientY - this._core.store.offsetY;
@@ -14714,23 +14718,26 @@ class KritzelBrushTool extends KritzelBaseTool {
         if (event.pointerType === 'touch') {
             const activePointers = Array.from(this._core.store.state.pointers.values());
             if (activePointers.length === 1) {
-                const currentPath = this._core.store.currentPath;
-                if (currentPath) {
-                    const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
-                    const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
-                    const updatedPath = KritzelPath.create(this._core, {
-                        points: [...currentPath.points, [x, y]],
-                        translateX: -this._core.store.state.translateX,
-                        translateY: -this._core.store.state.translateY,
-                        scale: this._core.store.state.scale,
-                        fill: this.color,
-                        strokeWidth: this.size,
-                    });
-                    updatedPath.id = currentPath.id;
-                    updatedPath.workspaceId = currentPath.workspaceId;
-                    updatedPath.zIndex = currentPath.zIndex;
-                    updatedPath.isCompleted = false;
-                    this._core.store.state.objects.update(updatedPath);
+                if (this._currentPathId) {
+                    const matchingObjects = this._core.store.state.objects.filter(o => o.id === this._currentPathId);
+                    const currentPath = matchingObjects.length > 0 ? matchingObjects[0] : null;
+                    if (currentPath) {
+                        const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+                        const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+                        const updatedPath = KritzelPath.create(this._core, {
+                            points: [...currentPath.points, [x, y]],
+                            translateX: -this._core.store.state.translateX,
+                            translateY: -this._core.store.state.translateY,
+                            scale: this._core.store.state.scale,
+                            fill: this.color,
+                            strokeWidth: this.size,
+                        });
+                        updatedPath.id = currentPath.id;
+                        updatedPath.workspaceId = currentPath.workspaceId;
+                        updatedPath.zIndex = currentPath.zIndex;
+                        updatedPath.isCompleted = false;
+                        this._core.store.state.objects.update(updatedPath);
+                    }
                 }
             }
         }
@@ -14742,22 +14749,30 @@ class KritzelBrushTool extends KritzelBaseTool {
         if (event.pointerType === 'mouse') {
             if (this._core.store.state.isDrawing) {
                 this._core.store.state.isDrawing = false;
-                const currentPath = this._core.store.currentPath;
-                if (currentPath) {
-                    currentPath.isCompleted = true;
-                    this._core.store.state.objects.update(currentPath);
-                    this._core.engine.emitObjectsChange();
+                if (this._currentPathId) {
+                    const matchingObjects = this._core.store.state.objects.filter(o => o.id === this._currentPathId);
+                    const currentPath = matchingObjects.length > 0 ? matchingObjects[0] : null;
+                    if (currentPath) {
+                        currentPath.isCompleted = true;
+                        this._core.store.state.objects.update(currentPath);
+                        this._core.engine.emitObjectsChange();
+                    }
+                    this._currentPathId = null;
                 }
             }
         }
         if (event.pointerType === 'touch') {
             if (this._core.store.state.isDrawing) {
                 this._core.store.state.isDrawing = false;
-                const currentPath = this._core.store.currentPath;
-                if (currentPath) {
-                    currentPath.isCompleted = true;
-                    this._core.store.state.objects.update(currentPath);
-                    this._core.engine.emitObjectsChange();
+                if (this._currentPathId) {
+                    const matchingObjects = this._core.store.state.objects.filter(o => o.id === this._currentPathId);
+                    const currentPath = matchingObjects.length > 0 ? matchingObjects[0] : null;
+                    if (currentPath) {
+                        currentPath.isCompleted = true;
+                        this._core.store.state.objects.update(currentPath);
+                        this._core.engine.emitObjectsChange();
+                    }
+                    this._currentPathId = null;
                 }
             }
         }
@@ -14869,6 +14884,6 @@ class KritzelTextTool extends KritzelBaseTool {
 }
 export { EditorView as E, KritzelText as K, Schema as S, TextSelection as T, KritzelPath as a, KritzelBrushTool as b, KritzelTextTool as c, KritzelKeyboardHelper as d, KritzelBaseObject as e, KritzelGeometryHelper as f, KritzelBaseTool as g, KritzelEventHelper as h, KritzelToolRegistry as i, addListNodes as j, EditorState as k, keymap as l, baseKeymap as m, schema as s };
-//# sourceMappingURL=p-Dz2XHHqa.js.map
+//# sourceMappingURL=p-Bwv1dxAB.js.map
-//# sourceMappingURL=p-Dz2XHHqa.js.map
+//# sourceMappingURL=p-Bwv1dxAB.js.map