@pictogrammers/components 0.4.5 → 0.4.7

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 (61) hide show
  1. package/package.json +1 -1
  2. package/pg/buttonMenu/README.md +5 -12
  3. package/pg/inputPixelEditor/inputPixelEditor.ts +7 -9
  4. package/pg/menuItem/menuItem.css +4 -1
  5. package/pg/overlaySubMenu/overlaySubMenu.css +0 -1
  6. package/pg/tree/README.md +11 -3
  7. package/pg/tree/__examples__/basic/basic.ts +3 -9
  8. package/pg/tree/tree.ts +12 -2
  9. package/pgAnnoy.js +1 -1
  10. package/pgApp.js +1 -1
  11. package/pgAvatar.js +1 -1
  12. package/pgButton.js +1 -1
  13. package/pgButtonGroup.js +1 -1
  14. package/pgButtonLink.js +1 -1
  15. package/pgButtonMenu.js +1 -1
  16. package/pgButtonToggle.js +1 -1
  17. package/pgCard.js +1 -1
  18. package/pgCardUser.js +1 -1
  19. package/pgColor.js +1 -1
  20. package/pgDatabase.js +1 -1
  21. package/pgDropdown.js +1 -1
  22. package/pgGrid.js +1 -1
  23. package/pgHeader.js +1 -1
  24. package/pgIcon.js +1 -1
  25. package/pgInputCheck.js +1 -1
  26. package/pgInputCheckList.js +1 -1
  27. package/pgInputFileLocal.js +1 -1
  28. package/pgInputHexRgb.js +1 -1
  29. package/pgInputPixelEditor.js +1 -1
  30. package/pgInputRange.js +1 -1
  31. package/pgInputSelect.js +1 -1
  32. package/pgInputText.js +1 -1
  33. package/pgInputTextIcon.js +1 -1
  34. package/pgInputUserSelect.js +1 -1
  35. package/pgListTag.js +1 -1
  36. package/pgMarkdown.js +1 -1
  37. package/pgMenu.js +1 -1
  38. package/pgMenuDivider.js +1 -1
  39. package/pgMenuIcon.js +1 -1
  40. package/pgMenuItem.js +1 -1
  41. package/pgMenuItemIcon.js +1 -1
  42. package/pgModalAlert.js +1 -1
  43. package/pgModification.js +1 -1
  44. package/pgNav.js +1 -1
  45. package/pgOverlay.js +1 -1
  46. package/pgOverlayContextMenu.js +1 -1
  47. package/pgOverlayMenu.js +1 -1
  48. package/pgOverlaySelectMenu.js +1 -1
  49. package/pgOverlaySubMenu.js +1 -1
  50. package/pgPicker.js +1 -1
  51. package/pgPreview.js +1 -1
  52. package/pgScroll.js +1 -1
  53. package/pgSearch.js +1 -1
  54. package/pgTab.js +1 -1
  55. package/pgTabs.js +1 -1
  56. package/pgToast.js +1 -1
  57. package/pgToasts.js +1 -1
  58. package/pgTooltip.js +1 -1
  59. package/pgTree.js +1 -1
  60. package/pgTreeButtonIcon.js +1 -1
  61. package/pgTreeItem.js +1 -1
package/pgTree.js CHANGED
@@ -1 +1 @@
1
- (()=>{"use strict";var e={84:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},122:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27white%27 /></svg>"},273:(e,t,n)=>{n.d(t,{A:()=>y});var i=n(601),s=n.n(i),a=n(314),r=n.n(a),o=n(417),d=n.n(o),l=new URL(n(630),n.b),c=new URL(n(122),n.b),h=new URL(n(432),n.b),p=new URL(n(84),n.b),m=r()(s()),g=d()(l),u=d()(c),b=d()(h),v=d()(p);m.push([e.id,`:host {\n display: contents;\n --y: calc(var(--x) + 1);\n}\n\n.hide {\n display: none !important;\n}\n\n[part=iconButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n padding: 0;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n}\n\n[part=labelButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n flex: 1;\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n margin: -0.25rem -0.25rem -0.25rem -0.25rem;\n padding: 0 0.25rem 0 0.25rem;\n}\n\n[part=label] {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n}\n\n[part=input] {\n display: flex;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n border-radius: 0.125rem;\n flex: 1;\n outline: 0;\n padding: 0 0.25rem;\n margin: -0.125rem -0.625rem -0.125rem -0.25rem;\n border-width: var(--pg-tree-item-border-width, 0);\n border-style: solid;\n border-color: var(--pg-tree-item-border-color, #453C4F);\n}\n\n[part=item] {\n display: grid;\n background: var(--pg-tree-item-background, transparent);\n border-radius: 0.25rem;\n padding: 0.25rem;\n gap: 0 0.5rem;\n user-select: none;\n padding-left: calc((var(--x) * 0.5rem) + 0.25rem);\n transition: background-color 0.1s ease-out;\n}\n\n[part=item] {\n grid-template-columns: min-content min-content minmax(0, 1fr) min-content;\n grid-template-rows: auto;\n}\n[part=item] [part=selected] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=toggle] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=iconButton] {\n grid-row: 1;\n grid-column: 2;\n}\n[part=item] [part=labelButton] {\n grid-row: 1;\n grid-column: 3;\n}\n[part=item] [part=actions] {\n grid-row: 1;\n grid-column: 4;\n}\n[part=item] [part=dropabove] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-start;\n transform: translateY(-0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n[part=item] [part=dropon] {\n grid-row: 1;\n grid-column: 1 / 5;\n margin: 0.125rem -0.25rem;\n z-index: 1;\n}\n[part=item]:not(.items) [part=dropon] {\n display: none;\n}\n[part=item].items.expanded [part=dropbelow] {\n display: none;\n}\n[part=item] [part=dropbelow] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-end;\n transform: translateY(0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n\n[part=item]:not(.selected):not(.dragging):hover {\n background: var(--pg-tree-selected-secondary, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected:not(.dragging):hover {\n background: var(--pg-tree-selected-secondary-hover, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected,\n[part=item].items.selected {\n background-color: var(--pg-tree-selected-secondary);\n}\n[part=item].items.selected:not(.expanded):not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${g}) !important;\n}\n\n[part=item].items.selected.expanded:not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${u}) !important;\n}\n\n[part=item].items [part=selected] {\n display: none;\n}\n\n[part=item]:not(.items) [part=selected] {\n visibility: hidden;\n display: flex;\n width: 1rem;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n border-radius: 0.125rem;\n background: var(--pg-tree-selected-primary);\n}\n\n[part=item]:not(.dragging):not(.items).selected [part=selected] {\n visibility: visible;\n}\n\n[part=actions] {\n display: flex;\n gap: 0.25rem;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n}\n\n[part=items] {\n display: none;\n flex-direction: column;\n --x: calc(var(--y) + 1);\n gap: 0.25rem;\n}\n[part=items].expanded {\n display: flex;\n}\n\n[part=toggle] {\n display: none;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n padding: 0 0 0 1rem;\n width: 1rem;\n border: 0;\n background-repeat: no-repeat;\n background-position: center;\n background-color: transparent;\n}\n\n[part=toggle]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}\n\n[part=item].items:not(.expanded) [part=toggle] {\n display: flex;\n background-image: url(${b});\n}\n\n[part=item].items.expanded [part=toggle] {\n display: flex;\n background-image: url(${v});\n}\n\n[part=dropabove].drop::before,\n[part=dropbelow].drop::before {\n content: ' ';\n height: 0.25rem;\n background-color: rgb(79, 143, 249);\n border-radius: 0.125rem;\n display: flex;\n margin-top: 0.375rem;\n}\n\n[part=dropon].drop {\n margin: -0.25rem !important;\n border: 4px solid rgb(79, 143, 249);\n border-radius: 0.25rem;\n}\n\n[part=item].dragging::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n border: 2px dashed rgb(79, 143, 249);\n}\n[part=items].dragging {\n --pg-_is-index-dragging: true;\n}\n[part=item].dragging [part=dropabove],\n[part=item].dragging [part=dropon],\n[part=item].dragging [part=dropbelow] {\n display: none;\n}\n\n@container style(--pg-_is-dragging: false) {\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n\n@container style(--pg-_is-index-dragging: true) {\n [part=item]::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n }\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n`,""]);var f=new CSSStyleSheet;f.replaceSync(m.toString());const y=f},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",i=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),i&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),i&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,i,s,a){"string"==typeof e&&(e=[[null,e,void 0]]);var r={};if(i)for(var o=0;o<this.length;o++){var d=this[o][0];null!=d&&(r[d]=!0)}for(var l=0;l<e.length;l++){var c=[].concat(e[l]);i&&r[c[0]]||(void 0!==a&&(void 0===c[5]||(c[1]="@layer".concat(c[5].length>0?" ".concat(c[5]):""," {").concat(c[1],"}")),c[5]=a),n&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=n):c[2]=n),s&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=s):c[4]="".concat(s)),t.push(c))}},t}},417:e=>{e.exports=function(e,t){return t||(t={}),e?(e=String(e.__esModule?e.default:e),/^['"].*['"]$/.test(e)&&(e=e.slice(1,-1)),t.hash&&(e+=t.hash),/["'() \t\n]|(%20)/.test(e)||t.needQuotes?'"'.concat(e.replace(/"/g,'\\"').replace(/\n/g,"\\n"),'"'):e):e}},432:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},513:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),s=n.n(i),a=n(314),r=n.n(a)()(s());r.push([e.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(r.toString());const d=o},543:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),s=n.n(i),a=n(314),r=n.n(a)()(s());r.push([e.id,":host {\n display: contents;\n --pg-tree-selected-primary: #453C4F;\n --pg-tree-selected-secondary: var(--pg-tree-item-background-selected, rgb(69, 60, 79, 0.1));\n --pg-tree-selected-secondary-hover: var(--pg-tree-item-background-selected, rgb(69, 60, 79, 0.2));\n}\n/*\n--pg-tree-item-background-selected\n*/\n:host(:focus-within) {\n --pg-tree-selected-primary: rgb(79, 143, 249);\n --pg-tree-selected-secondary: rgba(79, 143, 249, 0.15);\n --pg-tree-selected-secondary-hover: rgba(79, 143, 249, 0.25);\n}\n\n[part=items] {\n display: flex;\n flex-direction: column;\n background: var(--pg-tree-background, transparent);\n padding: 0.25rem;\n gap: 0.25rem;\n --x: 0;\n --pg-_is-dragging: false;\n}\n\n[part=items].dragging {\n --pg-_is-dragging: true;\n}",""]);var o=new CSSStyleSheet;o.replaceSync(r.toString());const d=o},601:e=>{e.exports=function(e){return e[1]}},630:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27white%27 /></svg>"}},t={};function n(i){var s=t[i];if(void 0!==s)return s.exports;var a=t[i]={id:i,exports:{}};return e[i](a,a.exports,n),a.exports}n.m=e,n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.b="undefined"!=typeof document&&document.baseURI||self.location.href;const i=Symbol("addObserver"),s=Symbol("removeObserver"),a=Symbol("getObservers"),r=Symbol("isProxy"),o=Symbol("getTarget"),d=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function c(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case r:return!0;case o:return t;case a:return l.has(e);case i:return(t,n)=>{l.has(e)?l.get(e).has(t)?l.get(e).get(t).push(n):l.get(e).set(t,[n]):l.set(e,new Map([[t,[n]]]))};case s:return t=>{l.has(e)&&(l.get(e).delete(t),0===l.get(e).size&&l.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?c(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(d.includes(n))return l.has(t)?function(){const e=Array.prototype[n].apply(t,arguments);return l.get(t).forEach(((e,i)=>{e.forEach((e=>{e(t,n,arguments)}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return c(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(l.has(e)){l.get(e).forEach(((e,i)=>{e.forEach((e=>{e(t,n)}))}))}return Reflect.set(e,t,n)}})}window.observers=l;const h="fill",p="pop",m="push",g="reverse",u="shift",b="sort",v="splice",f="unshift";class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const y=Symbol("init"),x=Symbol("template"),w=Symbol("style"),$=Symbol("parent");function E(e){return e[r]&&e[o]}function L(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function k(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function S(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var i,s;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[$]||t.prototype[$][t.prototype[$].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[$]=[t.prototype],t.prototype[w]=e.style?[e.style]:[],t.prototype[x]=e.template||""):(t.prototype[$].push(t.prototype),t.prototype[w].push(e.style),t.prototype[x]=(i=t.prototype[x],(s=e.template||null)&&s.match(/<parent\/>/)?s.replace(/<parent\/>/,i):`${i}${s||""}`));const a=t.prototype.connectedCallback||(()=>{}),r=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[y]||void 0!==e.template||void 0!==e.style)if(this[y]){if(this[y]&&e.style);else if(this[y]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[x]||"";const n=document.importNode(e.content,!0),i=this.attachShadow({mode:"open"});i.adoptedStyleSheets=t.prototype[w].map((e=>{if(e instanceof CSSStyleSheet)return e;var t=new CSSStyleSheet;return t.replaceSync(e.toString()),t})),i.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const i=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),s=()=>{this[$].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[k(t)]=!0,e)),{}):{})}))};0===i.length?(this[y]=!0,a.call(this),s()):Promise.all(i).then((()=>{this[y]=!0,a.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));s()}))},t.prototype.disconnectedCallback=function(){r.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[k(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function C(e){return!!e&&e.constructor===Array}function D(e,t){e[y]&&e[$].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function I(e){return null===e?"null":C(e)?"array":typeof e}function O(e){return function(t,n){const i=n.name,s=Symbol(i),o=Symbol(`${i}:type`),d=Symbol(`${i}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,i,{get:()=>"object"===this[o]||"array"===this[o]?this[s][r]?this[s]:c(this[s]):this[s],set:t=>{const n=I(e?e(t):t);if("index"!==i&&this[o]!==n&&"null"!==this[o]&&"null"!==n)throw new Error(`@Prop() ${i} with type '${this[o]}' cannot be set to ${n}.`);if("array"===this[o]){if(!C(t))throw new PropError(`Array "${i}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,i)?.set);if(this[s]===t)throw new Error("Setting an array to itself is not allowed.");const e=c(this[s]);if(e[a]){const n=t[r]?E(t):t;e.splice(0,this[s].length,...n)}else this[s]=t}else this[s]=e?e(t):t,D(this,i)}})})),function(t){if(void 0===t&&"index"!==i)throw new Error(`@Prop() ${i} must have an initial value defined.`);if(void 0!==t&&"index"===i)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${i} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=L(i);t[i]||(e.observedAttributes.push(n),t[i]=s)}return this[o]=I(t),"array"===this[o]?(this[s]=t,new Proxy(t,{get:(e,t)=>t===P?this[d]:(console.log("errr???"),Reflect.get(this[s],t)),set:(e,t,n)=>{if(t===P)return this[d]=n,!0;const a=Reflect.set(e,t,n);return"length"===t&&this[s].length===n||D(this,i),this[s]=n,a}})):(this[s]=e?e(this.getAttribute(i)??t):this.getAttribute(i)??t,this[s])}}}function B(){return function(e,t){const n=t.name,i=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${i}]`))}})}))}}Symbol("hasProxy");const P=Symbol("meta");function A({container:e,items:t,type:n,create:s,connect:a,disconnect:r,update:o}){function d(e,a){const r=n(e),o=document.createElement(L(r.name),r),d=r.observedAttributes??[],l=function(e,t){const n=new Set(e);return t.filter((e=>n.has(e)))}(Object.keys(e),d);return d.includes("index")&&(o.index=a),-1!==l.indexOf("index")&&l.splice(l.indexOf("index"),1),l.forEach((t=>{o[t]=e[t]})),s&&s(o,c(e)),t[a][i](o,((e,t)=>{o[e]=t})),o}t.forEach(((t,n)=>{const i=d(t,n);e.appendChild(i),a&&a(i,c(t))})),t[i](e,((n,i,s)=>{switch(i){case h:const[n,i,o]=s;for(let s=i||0;s<(o||t.length);s++)Object.keys(n).forEach((t=>{e.children[s][t]=n[t]}));break;case p:const l=e.children.length;l>0&&e.children[l-1].remove();break;case m:const y=e.children.length;[...s].forEach(((t,n)=>{const i=d(t,y+n);e.appendChild(i),a&&a(i,c(t))}));break;case g:for(var r=1;r<e.children.length;r++)e.insertBefore(e.children[r],e.children[0]);break;case u:e.children.length&&e.children[0].remove();for(let t=0;t<e.children.length;t++)e.children[t].index=t;break;case b:throw new Error("ToDo... write sort.");case v:const[x,w,...$]=s;if(w>0)for(let t=x;t<w+x;t++)e.children[t].remove();let E=$.length||0;if(E>0){const t=$.map(((e,t)=>d(e,x+t)));0===x?e.prepend(...t):e.children[x-1].after(...t);for(let t=x-w+E;t<e.children.length;t++)e.children[t].index=t;t.forEach((e=>{a&&a(e,$[r])}))}else for(let t=x;t<e.children.length;t++)e.children[t].index=t;break;case f:const L=e.children.length&&e.children[0],k=[...s].length;[...s].forEach(((t,n)=>{L?L.before(d(t,n)):e.appendChild(d(t,n))}));for(let t=k;t<e.children.length;t++)e.children[t].index=t}}))}var T=n(513),j=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},z=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};const R=(()=>{let e,t,n,i,s,a,r=[S({selector:"pg-tree-button-icon",style:T.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],o=[],d=HTMLElement,l=[],c=[],h=[],p=[],m=[],g=[],u=[],b=[];(class extends d{static{t=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[O()],i=[O()],s=[B()],a=[B()],j(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:v},l,c),j(null,null,i,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:v},h,p),j(null,null,s,{kind:"field",name:"$button",static:!1,private:!1,access:{has:e=>"$button"in e,get:e=>e.$button,set:(e,t)=>{e.$button=t}},metadata:v},m,g),j(null,null,a,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:v},u,b),j(null,e={value:t},r,{kind:"class",name:t.name,metadata:v},null,o),t=e.value,v&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),z(t,o)}index=z(this,l,void 0);icon=(z(this,c),z(this,h,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(z(this,p),z(this,m,void 0));$icon=(z(this,g),z(this,u,void 0));connectedCallback(){this.$button.addEventListener("click",this.#e.bind(this))}#e(e){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(e){e.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),z(this,b)}});return t})();var K=n(273),M=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},F=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};const U=(()=>{let e,t,n,i,s,a,r,o,d,l,c,h,p,m,g,u,b,v,f,y,x,w=[S({selector:"pg-tree-item",style:K.A,template:'<div part="item" draggable="true"> <div part="selected"></div> <button part="toggle"></button> <button part="iconButton"> <pg-icon part="icon"></pg-icon> </button> <input part="input" type="text" class="hide"/> <button part="labelButton"> <span part="label"></span> </button> <div part="actions"></div> <div part="dropabove"></div> <div part="dropon"></div> <div part="dropbelow"></div> </div> <div part="items"></div>'})],$=[],E=HTMLElement,L=[],k=[],C=[],D=[],I=[],P=[],T=[],j=[],z=[],U=[],N=[],H=[],_=[],V=[],q=[],W=[],Y=[],Z=[],Q=[],G=[],J=[],X=[],ee=[],te=[],ne=[],ie=[],se=[],ae=[],re=[],oe=[],de=[],le=[],ce=[],he=[],pe=[],me=[],ge=[],ue=[];var be=class extends E{static{t=this}static{const S="function"==typeof Symbol&&Symbol.metadata?Object.create(E[Symbol.metadata]??null):void 0;n=[O()],i=[O()],s=[O()],a=[O()],r=[O()],o=[O()],d=[O()],l=[B()],c=[B()],h=[B()],p=[B()],m=[B()],g=[B()],u=[B()],b=[B()],v=[B()],f=[B()],y=[B()],x=[B()],M(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:S},L,k),M(null,null,i,{kind:"field",name:"label",static:!1,private:!1,access:{has:e=>"label"in e,get:e=>e.label,set:(e,t)=>{e.label=t}},metadata:S},C,D),M(null,null,s,{kind:"field",name:"selected",static:!1,private:!1,access:{has:e=>"selected"in e,get:e=>e.selected,set:(e,t)=>{e.selected=t}},metadata:S},I,P),M(null,null,a,{kind:"field",name:"expanded",static:!1,private:!1,access:{has:e=>"expanded"in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:S},T,j),M(null,null,r,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:S},z,U),M(null,null,o,{kind:"field",name:"actions",static:!1,private:!1,access:{has:e=>"actions"in e,get:e=>e.actions,set:(e,t)=>{e.actions=t}},metadata:S},N,H),M(null,null,d,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:S},_,V),M(null,null,l,{kind:"field",name:"$toggle",static:!1,private:!1,access:{has:e=>"$toggle"in e,get:e=>e.$toggle,set:(e,t)=>{e.$toggle=t}},metadata:S},q,W),M(null,null,c,{kind:"field",name:"$item",static:!1,private:!1,access:{has:e=>"$item"in e,get:e=>e.$item,set:(e,t)=>{e.$item=t}},metadata:S},Y,Z),M(null,null,h,{kind:"field",name:"$input",static:!1,private:!1,access:{has:e=>"$input"in e,get:e=>e.$input,set:(e,t)=>{e.$input=t}},metadata:S},Q,G),M(null,null,p,{kind:"field",name:"$iconButton",static:!1,private:!1,access:{has:e=>"$iconButton"in e,get:e=>e.$iconButton,set:(e,t)=>{e.$iconButton=t}},metadata:S},J,X),M(null,null,m,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:S},ee,te),M(null,null,g,{kind:"field",name:"$label",static:!1,private:!1,access:{has:e=>"$label"in e,get:e=>e.$label,set:(e,t)=>{e.$label=t}},metadata:S},ne,ie),M(null,null,u,{kind:"field",name:"$labelButton",static:!1,private:!1,access:{has:e=>"$labelButton"in e,get:e=>e.$labelButton,set:(e,t)=>{e.$labelButton=t}},metadata:S},se,ae),M(null,null,b,{kind:"field",name:"$actions",static:!1,private:!1,access:{has:e=>"$actions"in e,get:e=>e.$actions,set:(e,t)=>{e.$actions=t}},metadata:S},re,oe),M(null,null,v,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:S},de,le),M(null,null,f,{kind:"field",name:"$dropabove",static:!1,private:!1,access:{has:e=>"$dropabove"in e,get:e=>e.$dropabove,set:(e,t)=>{e.$dropabove=t}},metadata:S},ce,he),M(null,null,y,{kind:"field",name:"$dropon",static:!1,private:!1,access:{has:e=>"$dropon"in e,get:e=>e.$dropon,set:(e,t)=>{e.$dropon=t}},metadata:S},pe,me),M(null,null,x,{kind:"field",name:"$dropbelow",static:!1,private:!1,access:{has:e=>"$dropbelow"in e,get:e=>e.$dropbelow,set:(e,t)=>{e.$dropbelow=t}},metadata:S},ge,ue),M(null,e={value:t},w,{kind:"class",name:t.name,metadata:S},null,$),be=t=e.value,S&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:S}),F(t,$)}index=F(this,L,void 0);label=(F(this,k),F(this,C,""));selected=(F(this,D),F(this,I,!1));expanded=(F(this,P),F(this,T,!1));icon=(F(this,j),F(this,z,{path:"M0 0h24v24H0V0zm2 2v20h20V2H2z"}));actions=(F(this,U),F(this,N,[]));items=(F(this,H),F(this,_,[]));$toggle=(F(this,V),F(this,q,void 0));$item=(F(this,W),F(this,Y,void 0));$input=(F(this,Z),F(this,Q,void 0));$iconButton=(F(this,G),F(this,J,void 0));$icon=(F(this,X),F(this,ee,void 0));$label=(F(this,te),F(this,ne,void 0));$labelButton=(F(this,ie),F(this,se,void 0));$actions=(F(this,ae),F(this,re,void 0));$items=(F(this,oe),F(this,de,void 0));$dropabove=(F(this,le),F(this,ce,void 0));$dropon=(F(this,he),F(this,pe,void 0));$dropbelow=(F(this,me),F(this,ge,void 0));connectedCallback(){this.$toggle.addEventListener("click",this.#t.bind(this)),this.$item.addEventListener("action",this.#n.bind(this)),this.$item.addEventListener("pointerenter",this.#i.bind(this)),this.$item.addEventListener("pointerleave",this.#s.bind(this)),this.$item.addEventListener("dragstart",this.#a.bind(this)),this.$item.addEventListener("dragend",this.#r.bind(this)),this.$labelButton.addEventListener("dblclick",this.#o.bind(this)),this.$labelButton.addEventListener("click",this.#e.bind(this)),this.$labelButton.addEventListener("keydown",this.#d.bind(this)),this.$iconButton.addEventListener("dblclick",this.#l.bind(this)),this.$iconButton.addEventListener("click",this.#c.bind(this)),this.$iconButton.addEventListener("keydown",this.#h.bind(this)),this.$item.addEventListener("contextmenu",this.#p.bind(this)),this.$input.addEventListener("blur",this.#m.bind(this)),this.$input.addEventListener("keydown",this.#g.bind(this)),this.$items.addEventListener("action",this.#u.bind(this)),this.$items.addEventListener("move",this.#b.bind(this)),this.$items.addEventListener("toggle",this.#v.bind(this)),this.$items.addEventListener("select",this.#f.bind(this)),this.$items.addEventListener("rename",this.#y.bind(this)),this.$items.addEventListener("up",this.#x.bind(this)),this.$items.addEventListener("down",this.#w.bind(this)),this.$items.addEventListener("itemdragstart",this.#$.bind(this)),this.$items.addEventListener("itemdragend",this.#E.bind(this)),this.$items.addEventListener("itemdropenter",this.#L.bind(this)),this.$dropabove.addEventListener("dragenter",this.#k.bind(this)),this.$dropabove.addEventListener("dragleave",this.#S.bind(this)),this.$dropabove.addEventListener("dragover",this.#C.bind(this)),this.$dropabove.addEventListener("drop",this.#D.bind(this)),this.$dropon.addEventListener("dragenter",this.#I.bind(this)),this.$dropon.addEventListener("dragleave",this.#O.bind(this)),this.$dropon.addEventListener("dragover",this.#C.bind(this)),this.$dropon.addEventListener("drop",this.#B.bind(this)),this.$dropbelow.addEventListener("dragenter",this.#P.bind(this)),this.$dropbelow.addEventListener("dragleave",this.#A.bind(this)),this.$dropbelow.addEventListener("dragover",this.#C.bind(this)),this.$dropbelow.addEventListener("drop",this.#T.bind(this)),A({container:this.$actions,items:this.actions,type:e=>R}),this.expanded&&this.#j()}disconnectedCallback(){console.log("disconnect",this.index)}#z=(F(this,ue),!0);#j(){this.#z&&(A({container:this.$items,items:this.items,type:e=>be}),this.#z=!1)}render(e){e.label&&(this.$label.textContent=this.label),e.icon&&this.icon&&(this.$icon.path=this.icon.path),e.selected&&this.$item.classList.toggle("selected",this.selected),e.items&&this.$item.classList.toggle("items",0!==this.items.length),e.expanded&&(this.expanded&&this.#j(),this.$item.classList.toggle("expanded",this.expanded),this.$items.classList.toggle("expanded",this.expanded))}#t(){this.dispatchEvent(new CustomEvent("toggle",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#l(e){const{ctrlKey:t,shiftKey:n}=e;t||n||this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icondoubleclick",indexes:[this.index]}}))}#c(){this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icon",indexes:[this.index]}}))}#e(e){if(this.#R)return void(this.#R=!1);const{ctrlKey:t,shiftKey:n}=e;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"label",indexes:[this.index],ctrlKey:t,shiftKey:n}}))}#d(e){"Enter"===e.key&&(this.#K(),e.preventDefault())}#i(){this.dispatchEvent(new CustomEvent("enter",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#s(){this.dispatchEvent(new CustomEvent("leave",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#n(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{indexes:[this.index],actionIndex:e.detail.index}}))}#u(e){e.detail.indexes.unshift(this.index)}#b(e){e.detail.indexes.unshift(this.index)}#v(e){e.detail.indexes.unshift(this.index)}#y(e){e.detail.indexes.unshift(this.index)}#x(e){e.detail.indexes.unshift(this.index)}#w(e){e.detail.indexes.unshift(this.index)}#f(e){e.detail.indexes.unshift(this.index)}#L(e){e.detail.indexes.unshift(this.index)}#p(e){e.preventDefault()}#K(){this.$labelButton.classList.add("hide"),this.$actions.classList.add("hide"),this.$input.classList.remove("hide"),this.$input.value=this.label,this.$input.select(),this.#R=!0,this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"rename",indexes:[this.index]}}))}#R=!1;#o(e){const{ctrlKey:t,shiftKey:n}=e;t||n||(this.#K(),e.preventDefault())}#m(){this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$labelButton.click(),this.dispatchEvent(new CustomEvent("rename",{bubbles:!0,composed:!0,detail:{indexes:[this.index],label:this.$input.value}}))}#h(e){switch(e.key){case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault()}}#g(e){switch(e.key){case"Enter":this.#m();break;case"Escape":this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$input.value=this.label,this.$labelButton.click();break;case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault()}}#M;#a(e){let t=0;this.dispatchEvent(new CustomEvent("itemdragstart",{bubbles:!0,composed:!0,detail:{ctrlKey:e.ctrlKey,shiftKey:e.shiftKey,indexes:[this.index],callback:e=>{t=e}}})),this.$item.classList.toggle("dragging",!0),this.$items.classList.toggle("dragging",!0);const n=window.devicePixelRatio,i=document.createElement("canvas");document.body.append(i),i.width=100*n,i.height=40*n,i.style.width=i.width/n+"px";var s=i.getContext("2d");if(s){const e=`${t}`;s.font=`bold ${16*n}px Segoe UI`;const i=s.measureText(e);s.fillStyle="#453C4F",s.beginPath(),s.roundRect(20*n,0,(i.width+12)*n,28*n,8+2*n),s.fill(),s.fillStyle="#FFF",s.beginPath(),s.roundRect(22*n,2*n,(i.width+12-4)*n,24*n,8),s.fill(),s.fillStyle="#453C4F",s.fillText(e,30*n,20*n)}e.dataTransfer.setDragImage(i,0,0),this.#M=i}#r(e){this.dispatchEvent(new CustomEvent("itemdragend",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$item.classList.toggle("dragging",!1),this.$items.classList.toggle("dragging",!1),this.#M.remove()}#$(e){e.detail.indexes.unshift(this.index)}#E(e){e.detail.indexes.unshift(this.index)}#k(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),e.dataTransfer.setData("text","test"),e.dataTransfer.effectAllowed="move"}#S(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#F;#I(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),this.#F=setTimeout((()=>{this.#t()}),1500)}#O(e){clearTimeout(this.#F),console.log("darg leave"),e.target.classList.toggle("drop",!1)}#P(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0)}#A(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#C(e){e.preventDefault(),e.dataTransfer.dropEffect="move"}#D(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"before"}}))}#B(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"on"}}))}#T(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"after"}}))}};return be=t})();var N=n(543),H=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},_=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};(()=>{let e,t,n,i,s=[S({selector:"pg-tree",style:N.A,template:'<div part="items"></div>'})],a=[],r=HTMLElement,o=[],d=[],l=[],c=[];(class extends r{static{t=this}static{const h="function"==typeof Symbol&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;n=[O()],i=[B()],H(null,null,n,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:h},o,d),H(null,null,i,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:h},l,c),H(null,e={value:t},s,{kind:"class",name:t.name,metadata:h},null,a),t=e.value,h&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:h}),_(t,a)}items=_(this,o,[]);$items=(_(this,d),_(this,l,void 0));#U=(_(this,c),new Map);connectedCallback(){A({container:this.$items,items:this.items,type:e=>U}),this.$items.addEventListener("action",(e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{detail:{actionIndex:e.detail.actionIndex,item:this.#N(e.detail.indexes)}}))})),this.$items.addEventListener("move",(e=>{const{indexes:t,position:n}=e.detail;e.stopPropagation(),this.dispatchEvent(new CustomEvent("move",{detail:{item:this.#N(e.detail.indexes),position:n}}))})),this.$items.addEventListener("toggle",(e=>{const{indexes:t}=e.detail;let n=this.#H(t);n.expanded=!n.expanded})),this.$items.addEventListener("select",(e=>{e.stopPropagation();const{indexes:t,type:n,ctrlKey:i,shiftKey:s}=e.detail,a=this.#H(t),r=this.#U.size,o=E(a);i||!r||this.#U.has(o)||(this.#U.forEach((e=>this.#H(e).selected=!1)),this.#U.clear()),a.selected="rename"===n||!a.selected,a.selected?this.#U.set(o,t):this.#U.delete(o),this.dispatchEvent(new CustomEvent("select",{detail:{items:[...this.#U.values()].map((e=>this.#N(e)))}}))})),this.$items.addEventListener("keydown",(e=>{"Delete"===e.key&&(this.#U.forEach((e=>{this.#_(e)})),this.#U.clear())})),this.$items.addEventListener("itemdragstart",(e=>{const{indexes:t,callback:n,ctrlKey:i,shiftKey:s}=e.detail;console.log("drag valid",t);const a=this.#H(t),r=E(a);!i&&this.#U.size&&(this.#U.forEach((e=>this.#H(e).selected=!1)),this.#U.clear()),a.selected=!0,this.#U.set(r,t);let o=0;this.#U.forEach((e=>{const t=this.#H(e);o=this.#V(t,o)})),n(o),this.$items.classList.toggle("dragging",!0)})),this.$items.addEventListener("itemdragend",(e=>{this.$items.classList.toggle("dragging",!1)})),this.$items.addEventListener("itemdropenter",this.#q.bind(this))}#V(e,t){return t+=1,e.items&&e.items.length>0&&e.items.forEach((e=>{t=this.#V(e,t)})),t}#q(e){const{indexes:t,callback:n}=e.detail,i=this.#W();console.log("valid???",t,i);const s=t.join(",");n(!i.some((e=>s.startsWith(e))),(t=>{e.dataTransfer.effectAllowed=t}))}#_(e){const t=e[e.length-1],n=e.slice(0,e.length-1).reduce(((e,t)=>e.items[t]),this);n.items.splice(t,1)}#H(e){return e.reduce(((e,t)=>e.items[t]),this)}#N(e){return{indexes:e,remove:()=>{this.#_(e),this.#U.clear()},getData:()=>this.#H(e),getParentData:()=>{const t=e.slice(0,e.length-1);return 0===t.length?this:this.#H(t)},move:(t,n)=>{console.log(t,n);const i=t.indexes[t.indexes.length-1],s=t.indexes.slice(0,t.indexes.length-1),a=this.#H(e);this.#_(e),"on"===n?(this.#H(t.indexes).items.push(a),this.#H(t.indexes).expanded=!0):0===s.length?this.items.splice("after"===n?i+1:i,0,a):this.#H(s).items.splice("after"===n?i+1:i,0,a),this.#U.clear(),this.$items.classList.toggle("dragging",!1)}}}render(e){e.items&&console.log("yay",this.items.map((e=>e)))}unselect(e){}#W(){const e=[];return this.#U.forEach((t=>{e.push(t.join(","))})),e}})})()})();
1
+ (()=>{"use strict";var e={84:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},122:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27white%27 /></svg>"},273:(e,t,n)=>{n.d(t,{A:()=>y});var i=n(601),s=n.n(i),a=n(314),r=n.n(a),o=n(417),d=n.n(o),l=new URL(n(630),n.b),c=new URL(n(122),n.b),h=new URL(n(432),n.b),p=new URL(n(84),n.b),m=r()(s()),g=d()(l),u=d()(c),b=d()(h),v=d()(p);m.push([e.id,`:host {\n display: contents;\n --y: calc(var(--x) + 1);\n}\n\n.hide {\n display: none !important;\n}\n\n[part=iconButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n padding: 0;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n}\n\n[part=labelButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n flex: 1;\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n margin: -0.25rem -0.25rem -0.25rem -0.25rem;\n padding: 0 0.25rem 0 0.25rem;\n}\n\n[part=label] {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n}\n\n[part=input] {\n display: flex;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n border-radius: 0.125rem;\n flex: 1;\n outline: 0;\n padding: 0 0.25rem;\n margin: -0.125rem -0.625rem -0.125rem -0.25rem;\n border-width: var(--pg-tree-item-border-width, 0);\n border-style: solid;\n border-color: var(--pg-tree-item-border-color, #453C4F);\n}\n\n[part=item] {\n display: grid;\n background: var(--pg-tree-item-background, transparent);\n border-radius: 0.25rem;\n padding: 0.25rem;\n gap: 0 0.5rem;\n user-select: none;\n padding-left: calc((var(--x) * 0.5rem) + 0.25rem);\n transition: background-color 0.1s ease-out;\n}\n\n[part=item] {\n grid-template-columns: min-content min-content minmax(0, 1fr) min-content;\n grid-template-rows: auto;\n}\n[part=item] [part=selected] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=toggle] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=iconButton] {\n grid-row: 1;\n grid-column: 2;\n}\n[part=item] [part=labelButton] {\n grid-row: 1;\n grid-column: 3;\n}\n[part=item] [part=actions] {\n grid-row: 1;\n grid-column: 4;\n}\n[part=item] [part=dropabove] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-start;\n transform: translateY(-0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n[part=item] [part=dropon] {\n grid-row: 1;\n grid-column: 1 / 5;\n margin: 0.125rem -0.25rem;\n z-index: 1;\n}\n[part=item]:not(.items) [part=dropon] {\n display: none;\n}\n[part=item].items.expanded [part=dropbelow] {\n display: none;\n}\n[part=item] [part=dropbelow] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-end;\n transform: translateY(0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n\n[part=item]:not(.selected):not(.dragging):hover {\n background: var(--pg-tree-selected-secondary, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected:not(.dragging):hover {\n background: var(--pg-tree-selected-secondary-hover, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected,\n[part=item].items.selected {\n background-color: var(--pg-tree-selected-secondary);\n}\n[part=item].items.selected:not(.expanded):not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${g}) !important;\n}\n\n[part=item].items.selected.expanded:not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${u}) !important;\n}\n\n[part=item].items [part=selected] {\n display: none;\n}\n\n[part=item]:not(.items) [part=selected] {\n visibility: hidden;\n display: flex;\n width: 1rem;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n border-radius: 0.125rem;\n background: var(--pg-tree-selected-primary);\n}\n\n[part=item]:not(.dragging):not(.items).selected [part=selected] {\n visibility: visible;\n}\n\n[part=actions] {\n display: flex;\n gap: 0.25rem;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n}\n\n[part=items] {\n display: none;\n flex-direction: column;\n --x: calc(var(--y) + 1);\n gap: 0.25rem;\n}\n[part=items].expanded {\n display: flex;\n}\n\n[part=toggle] {\n display: none;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n padding: 0 0 0 1rem;\n width: 1rem;\n border: 0;\n background-repeat: no-repeat;\n background-position: center;\n background-color: transparent;\n}\n\n[part=toggle]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}\n\n[part=item].items:not(.expanded) [part=toggle] {\n display: flex;\n background-image: url(${b});\n}\n\n[part=item].items.expanded [part=toggle] {\n display: flex;\n background-image: url(${v});\n}\n\n[part=dropabove].drop::before,\n[part=dropbelow].drop::before {\n content: ' ';\n height: 0.25rem;\n background-color: rgb(79, 143, 249);\n border-radius: 0.125rem;\n display: flex;\n margin-top: 0.375rem;\n}\n\n[part=dropon].drop {\n margin: -0.25rem !important;\n border: 4px solid rgb(79, 143, 249);\n border-radius: 0.25rem;\n}\n\n[part=item].dragging::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n border: 2px dashed rgb(79, 143, 249);\n}\n[part=items].dragging {\n --pg-_is-index-dragging: true;\n}\n[part=item].dragging [part=dropabove],\n[part=item].dragging [part=dropon],\n[part=item].dragging [part=dropbelow] {\n display: none;\n}\n\n@container style(--pg-_is-dragging: false) {\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n\n@container style(--pg-_is-index-dragging: true) {\n [part=item]::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n }\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n`,""]);var f=new CSSStyleSheet;f.replaceSync(m.toString());const y=f},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",i=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),i&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),i&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,i,s,a){"string"==typeof e&&(e=[[null,e,void 0]]);var r={};if(i)for(var o=0;o<this.length;o++){var d=this[o][0];null!=d&&(r[d]=!0)}for(var l=0;l<e.length;l++){var c=[].concat(e[l]);i&&r[c[0]]||(void 0!==a&&(void 0===c[5]||(c[1]="@layer".concat(c[5].length>0?" ".concat(c[5]):""," {").concat(c[1],"}")),c[5]=a),n&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=n):c[2]=n),s&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=s):c[4]="".concat(s)),t.push(c))}},t}},417:e=>{e.exports=function(e,t){return t||(t={}),e?(e=String(e.__esModule?e.default:e),/^['"].*['"]$/.test(e)&&(e=e.slice(1,-1)),t.hash&&(e+=t.hash),/["'() \t\n]|(%20)/.test(e)||t.needQuotes?'"'.concat(e.replace(/"/g,'\\"').replace(/\n/g,"\\n"),'"'):e):e}},432:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},513:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),s=n.n(i),a=n(314),r=n.n(a)()(s());r.push([e.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(r.toString());const d=o},543:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),s=n.n(i),a=n(314),r=n.n(a)()(s());r.push([e.id,":host {\n display: contents;\n --pg-tree-selected-primary: #453C4F;\n --pg-tree-selected-secondary: var(--pg-tree-item-background-selected, rgb(69, 60, 79, 0.1));\n --pg-tree-selected-secondary-hover: var(--pg-tree-item-background-selected, rgb(69, 60, 79, 0.2));\n}\n/*\n--pg-tree-item-background-selected\n*/\n:host(:focus-within) {\n --pg-tree-selected-primary: rgb(79, 143, 249);\n --pg-tree-selected-secondary: rgba(79, 143, 249, 0.15);\n --pg-tree-selected-secondary-hover: rgba(79, 143, 249, 0.25);\n}\n\n[part=items] {\n display: flex;\n flex-direction: column;\n background: var(--pg-tree-background, transparent);\n padding: 0.25rem;\n gap: 0.25rem;\n --x: 0;\n --pg-_is-dragging: false;\n}\n\n[part=items].dragging {\n --pg-_is-dragging: true;\n}",""]);var o=new CSSStyleSheet;o.replaceSync(r.toString());const d=o},601:e=>{e.exports=function(e){return e[1]}},630:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27white%27 /></svg>"}},t={};function n(i){var s=t[i];if(void 0!==s)return s.exports;var a=t[i]={id:i,exports:{}};return e[i](a,a.exports,n),a.exports}n.m=e,n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.b="undefined"!=typeof document&&document.baseURI||self.location.href;const i=Symbol("addObserver"),s=Symbol("removeObserver"),a=Symbol("getObservers"),r=Symbol("swapObserver"),o=Symbol("isProxy"),d=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function h(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case o:return!0;case d:return t;case a:return c.has(e);case r:return(t,n)=>{const i=c.get(e);i.forEach(((s,a)=>{if(a.getRootNode().host===t){const t=i.get(a);c.has(n)?c.get(n).has(a)?c.get(n).get(a).push(i.get(a)):c.get(n).set(a,i.get(a)):c.set(n,new Map([[a,t]])),c.delete(e),t.forEach((e=>{e(null,p.swap,[n])}))}}))};case i:return(t,n)=>{c.has(e)?c.get(e).has(t)?c.get(e).get(t).push(n):c.get(e).set(t,[n]):c.set(e,new Map([[t,[n]]]))};case s:return t=>{c.has(e)&&(c.get(e).delete(t),0===c.get(e).size&&c.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?h(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(t)?function(){const e=Array.prototype[n].apply(t,arguments);return c.get(t).forEach(((e,i)=>{e.forEach((e=>{e(t,n,arguments)}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return h(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(c.has(e)){c.get(e).forEach(((e,i)=>{e.forEach((e=>{e(t,n)}))}))}return Reflect.set(e,t,n)}})}window.observers=c;const p={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const m=Symbol("init"),g=Symbol("template"),u=Symbol("style"),b=Symbol("parent");function v(e){return e[o]&&e[d]}function f(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function y(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function x(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var i,s;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[b]||t.prototype[b][t.prototype[b].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[b]=[t.prototype],t.prototype[u]=e.style?[e.style]:[],t.prototype[g]=e.template||""):(t.prototype[b].push(t.prototype),t.prototype[u].push(e.style),t.prototype[g]=(i=t.prototype[g],(s=e.template||null)&&s.match(/<parent\/>/)?s.replace(/<parent\/>/,i):`${i}${s||""}`));const a=t.prototype.connectedCallback||(()=>{}),r=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[m]||void 0!==e.template||void 0!==e.style)if(this[m]){if(this[m]&&e.style);else if(this[m]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[g]||"";const n=document.importNode(e.content,!0),i=this.attachShadow({mode:"open"});i.adoptedStyleSheets=t.prototype[u].map((e=>{if(e instanceof CSSStyleSheet)return e;var t=new CSSStyleSheet;return t.replaceSync(e.toString()),t})),i.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const i=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),s=()=>{this[b].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[y(t)]=!0,e)),{}):{})}))};0===i.length?(this[m]=!0,a.call(this),s()):Promise.all(i).then((()=>{this[m]=!0,a.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));s()}))},t.prototype.disconnectedCallback=function(){r.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[y(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function w(e){return!!e&&e.constructor===Array}function E(e,t){e[m]&&e[b].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function $(e){return null===e?"null":w(e)?"array":typeof e}function L(e){return function(t,n){const i=n.name,s=Symbol(i),l=Symbol(`${i}:type`),c=Symbol(`${i}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,i,{get:()=>"object"===this[l]||"array"===this[l]?this[s][o]?this[s]:h(this[s]):this[s],set:t=>{const n=$(e?e(t):t);if("index"!==i&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${i} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!w(t))throw new PropError(`Array "${i}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,i)?.set);if(this[s]===t)throw new Error("Setting an array to itself is not allowed.");const e=h(this[s]);if(e[a]){const n=t[o]?t[d]:t;e[r](this,n),this[s]=t,console.log(">>> trigger render???",this,i)}else this[s]=t}else this[s]=e?e(t):t,E(this,i)}})})),function(t){if(void 0===t&&"index"!==i)throw new Error(`@Prop() ${i} must have an initial value defined.`);if(void 0!==t&&"index"===i)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${i} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=f(i);t[i]||(e.observedAttributes.push(n),t[i]=s)}return this[l]=$(t),"array"===this[l]?(this[s]=t,new Proxy(t,{get:(e,t)=>t===S?this[c]:(console.log("errr???"),Reflect.get(this[s],t)),set:(e,t,n)=>{if(t===S)return this[c]=n,!0;const a=Reflect.set(e,t,n);return"length"===t&&this[s].length===n||E(this,i),this[s]=n,a}})):(this[s]=e?e(this.getAttribute(i)??t):this.getAttribute(i)??t,this[s])}}}function k(){return function(e,t){const n=t.name,i=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${i}]`))}})}))}}Symbol("hasProxy");const S=Symbol("meta");function C({container:e,items:t,type:n,create:s,connect:a,disconnect:r,update:o}){function d(e,a){const r=n(e),o=document.createElement(f(r.name),r),d=r.observedAttributes??[],l=function(e,t){const n=new Set(e);return t.filter((e=>n.has(e)))}(Object.keys(e),d);return d.includes("index")&&(o.index=a),-1!==l.indexOf("index")&&l.splice(l.indexOf("index"),1),l.forEach((t=>{o[t]=e[t]})),s&&s(o,h(e)),t[a][i](o,((e,t)=>{o[e]=t})),o}t.forEach(((t,n)=>{const i=d(t,n);e.appendChild(i),a&&a(i,h(t))})),t[i](e,((n,i,s)=>{if(i===p.swap){const e=t.length;t=h(s[0]),i=p.splice,s=[0,e,...s[0]]}switch(i){case p.fill:const[n,i,o]=s;for(let s=i||0;s<(o||t.length);s++)Object.keys(n).forEach((t=>{e.children[s][t]=n[t]}));break;case p.pop:const l=e.children.length;l>0&&e.children[l-1].remove();break;case p.push:const c=e.children.length;[...s].forEach(((t,n)=>{const i=d(t,c+n);e.appendChild(i),a&&a(i,h(t))}));break;case p.reverse:for(var r=1;r<e.children.length;r++)e.insertBefore(e.children[r],e.children[0]);break;case p.shift:e.children.length&&e.children[0].remove();for(let t=0;t<e.children.length;t++)e.children[t].index=t;break;case p.sort:throw new Error("ToDo... write sort.");case p.splice:const[m,g,...u]=s;if(g>0)for(let t=m;t<g+m;t++)e.children[t].remove();let b=u.length||0;if(b>0){const t=u.map(((e,t)=>d(e,m+t)));0===m?e.prepend(...t):e.children[m-1].after(...t);for(let t=m-g+b;t<e.children.length;t++)e.children[t].index=t;t.forEach((e=>{a&&a(e,u[r])}))}else for(let t=m;t<e.children.length;t++)e.children[t].index=t;break;case p.unshift:const v=e.children.length&&e.children[0],f=[...s].length;[...s].forEach(((t,n)=>{v?v.before(d(t,n)):e.appendChild(d(t,n))}));for(let t=f;t<e.children.length;t++)e.children[t].index=t}}))}var D=n(513),I=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},O=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};const P=(()=>{let e,t,n,i,s,a,r=[x({selector:"pg-tree-button-icon",style:D.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],o=[],d=HTMLElement,l=[],c=[],h=[],p=[],m=[],g=[],u=[],b=[];(class extends d{static{t=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[L()],i=[L()],s=[k()],a=[k()],I(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:v},l,c),I(null,null,i,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:v},h,p),I(null,null,s,{kind:"field",name:"$button",static:!1,private:!1,access:{has:e=>"$button"in e,get:e=>e.$button,set:(e,t)=>{e.$button=t}},metadata:v},m,g),I(null,null,a,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:v},u,b),I(null,e={value:t},r,{kind:"class",name:t.name,metadata:v},null,o),t=e.value,v&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),O(t,o)}index=O(this,l,void 0);icon=(O(this,c),O(this,h,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(O(this,p),O(this,m,void 0));$icon=(O(this,g),O(this,u,void 0));connectedCallback(){this.$button.addEventListener("click",this.#e.bind(this))}#e(e){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(e){e.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),O(this,b)}});return t})();var B=n(273),A=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},T=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};const j=(()=>{let e,t,n,i,s,a,r,o,d,l,c,h,p,m,g,u,b,v,f,y,w,E=[x({selector:"pg-tree-item",style:B.A,template:'<div part="item" draggable="true"> <div part="selected"></div> <button part="toggle"></button> <button part="iconButton"> <pg-icon part="icon"></pg-icon> </button> <input part="input" type="text" class="hide"/> <button part="labelButton"> <span part="label"></span> </button> <div part="actions"></div> <div part="dropabove"></div> <div part="dropon"></div> <div part="dropbelow"></div> </div> <div part="items"></div>'})],$=[],S=HTMLElement,D=[],I=[],O=[],j=[],z=[],R=[],K=[],M=[],F=[],U=[],N=[],H=[],_=[],V=[],q=[],W=[],Y=[],Z=[],Q=[],G=[],J=[],X=[],ee=[],te=[],ne=[],ie=[],se=[],ae=[],re=[],oe=[],de=[],le=[],ce=[],he=[],pe=[],me=[],ge=[],ue=[];var be=class extends S{static{t=this}static{const x="function"==typeof Symbol&&Symbol.metadata?Object.create(S[Symbol.metadata]??null):void 0;n=[L()],i=[L()],s=[L()],a=[L()],r=[L()],o=[L()],d=[L()],l=[k()],c=[k()],h=[k()],p=[k()],m=[k()],g=[k()],u=[k()],b=[k()],v=[k()],f=[k()],y=[k()],w=[k()],A(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:x},D,I),A(null,null,i,{kind:"field",name:"label",static:!1,private:!1,access:{has:e=>"label"in e,get:e=>e.label,set:(e,t)=>{e.label=t}},metadata:x},O,j),A(null,null,s,{kind:"field",name:"selected",static:!1,private:!1,access:{has:e=>"selected"in e,get:e=>e.selected,set:(e,t)=>{e.selected=t}},metadata:x},z,R),A(null,null,a,{kind:"field",name:"expanded",static:!1,private:!1,access:{has:e=>"expanded"in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:x},K,M),A(null,null,r,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:x},F,U),A(null,null,o,{kind:"field",name:"actions",static:!1,private:!1,access:{has:e=>"actions"in e,get:e=>e.actions,set:(e,t)=>{e.actions=t}},metadata:x},N,H),A(null,null,d,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:x},_,V),A(null,null,l,{kind:"field",name:"$toggle",static:!1,private:!1,access:{has:e=>"$toggle"in e,get:e=>e.$toggle,set:(e,t)=>{e.$toggle=t}},metadata:x},q,W),A(null,null,c,{kind:"field",name:"$item",static:!1,private:!1,access:{has:e=>"$item"in e,get:e=>e.$item,set:(e,t)=>{e.$item=t}},metadata:x},Y,Z),A(null,null,h,{kind:"field",name:"$input",static:!1,private:!1,access:{has:e=>"$input"in e,get:e=>e.$input,set:(e,t)=>{e.$input=t}},metadata:x},Q,G),A(null,null,p,{kind:"field",name:"$iconButton",static:!1,private:!1,access:{has:e=>"$iconButton"in e,get:e=>e.$iconButton,set:(e,t)=>{e.$iconButton=t}},metadata:x},J,X),A(null,null,m,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:x},ee,te),A(null,null,g,{kind:"field",name:"$label",static:!1,private:!1,access:{has:e=>"$label"in e,get:e=>e.$label,set:(e,t)=>{e.$label=t}},metadata:x},ne,ie),A(null,null,u,{kind:"field",name:"$labelButton",static:!1,private:!1,access:{has:e=>"$labelButton"in e,get:e=>e.$labelButton,set:(e,t)=>{e.$labelButton=t}},metadata:x},se,ae),A(null,null,b,{kind:"field",name:"$actions",static:!1,private:!1,access:{has:e=>"$actions"in e,get:e=>e.$actions,set:(e,t)=>{e.$actions=t}},metadata:x},re,oe),A(null,null,v,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:x},de,le),A(null,null,f,{kind:"field",name:"$dropabove",static:!1,private:!1,access:{has:e=>"$dropabove"in e,get:e=>e.$dropabove,set:(e,t)=>{e.$dropabove=t}},metadata:x},ce,he),A(null,null,y,{kind:"field",name:"$dropon",static:!1,private:!1,access:{has:e=>"$dropon"in e,get:e=>e.$dropon,set:(e,t)=>{e.$dropon=t}},metadata:x},pe,me),A(null,null,w,{kind:"field",name:"$dropbelow",static:!1,private:!1,access:{has:e=>"$dropbelow"in e,get:e=>e.$dropbelow,set:(e,t)=>{e.$dropbelow=t}},metadata:x},ge,ue),A(null,e={value:t},E,{kind:"class",name:t.name,metadata:x},null,$),be=t=e.value,x&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:x}),T(t,$)}index=T(this,D,void 0);label=(T(this,I),T(this,O,""));selected=(T(this,j),T(this,z,!1));expanded=(T(this,R),T(this,K,!1));icon=(T(this,M),T(this,F,{path:"M0 0h24v24H0V0zm2 2v20h20V2H2z"}));actions=(T(this,U),T(this,N,[]));items=(T(this,H),T(this,_,[]));$toggle=(T(this,V),T(this,q,void 0));$item=(T(this,W),T(this,Y,void 0));$input=(T(this,Z),T(this,Q,void 0));$iconButton=(T(this,G),T(this,J,void 0));$icon=(T(this,X),T(this,ee,void 0));$label=(T(this,te),T(this,ne,void 0));$labelButton=(T(this,ie),T(this,se,void 0));$actions=(T(this,ae),T(this,re,void 0));$items=(T(this,oe),T(this,de,void 0));$dropabove=(T(this,le),T(this,ce,void 0));$dropon=(T(this,he),T(this,pe,void 0));$dropbelow=(T(this,me),T(this,ge,void 0));connectedCallback(){this.$toggle.addEventListener("click",this.#t.bind(this)),this.$item.addEventListener("action",this.#n.bind(this)),this.$item.addEventListener("pointerenter",this.#i.bind(this)),this.$item.addEventListener("pointerleave",this.#s.bind(this)),this.$item.addEventListener("dragstart",this.#a.bind(this)),this.$item.addEventListener("dragend",this.#r.bind(this)),this.$labelButton.addEventListener("dblclick",this.#o.bind(this)),this.$labelButton.addEventListener("click",this.#e.bind(this)),this.$labelButton.addEventListener("keydown",this.#d.bind(this)),this.$iconButton.addEventListener("dblclick",this.#l.bind(this)),this.$iconButton.addEventListener("click",this.#c.bind(this)),this.$iconButton.addEventListener("keydown",this.#h.bind(this)),this.$item.addEventListener("contextmenu",this.#p.bind(this)),this.$input.addEventListener("blur",this.#m.bind(this)),this.$input.addEventListener("keydown",this.#g.bind(this)),this.$items.addEventListener("action",this.#u.bind(this)),this.$items.addEventListener("move",this.#b.bind(this)),this.$items.addEventListener("toggle",this.#v.bind(this)),this.$items.addEventListener("select",this.#f.bind(this)),this.$items.addEventListener("rename",this.#y.bind(this)),this.$items.addEventListener("up",this.#x.bind(this)),this.$items.addEventListener("down",this.#w.bind(this)),this.$items.addEventListener("itemdragstart",this.#E.bind(this)),this.$items.addEventListener("itemdragend",this.#$.bind(this)),this.$items.addEventListener("itemdropenter",this.#L.bind(this)),this.$dropabove.addEventListener("dragenter",this.#k.bind(this)),this.$dropabove.addEventListener("dragleave",this.#S.bind(this)),this.$dropabove.addEventListener("dragover",this.#C.bind(this)),this.$dropabove.addEventListener("drop",this.#D.bind(this)),this.$dropon.addEventListener("dragenter",this.#I.bind(this)),this.$dropon.addEventListener("dragleave",this.#O.bind(this)),this.$dropon.addEventListener("dragover",this.#C.bind(this)),this.$dropon.addEventListener("drop",this.#P.bind(this)),this.$dropbelow.addEventListener("dragenter",this.#B.bind(this)),this.$dropbelow.addEventListener("dragleave",this.#A.bind(this)),this.$dropbelow.addEventListener("dragover",this.#C.bind(this)),this.$dropbelow.addEventListener("drop",this.#T.bind(this)),C({container:this.$actions,items:this.actions,type:e=>P}),this.expanded&&this.#j()}disconnectedCallback(){console.log("disconnect",this.index)}#z=(T(this,ue),!0);#j(){this.#z&&(C({container:this.$items,items:this.items,type:e=>be}),this.#z=!1)}render(e){e.label&&(this.$label.textContent=this.label),e.icon&&this.icon&&(this.$icon.path=this.icon.path),e.selected&&this.$item.classList.toggle("selected",this.selected),e.items&&this.$item.classList.toggle("items",0!==this.items.length),e.expanded&&(this.expanded&&this.#j(),this.$item.classList.toggle("expanded",this.expanded),this.$items.classList.toggle("expanded",this.expanded))}#t(){this.dispatchEvent(new CustomEvent("toggle",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#l(e){const{ctrlKey:t,shiftKey:n}=e;t||n||this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icondoubleclick",indexes:[this.index]}}))}#c(){this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icon",indexes:[this.index]}}))}#e(e){if(this.#R)return void(this.#R=!1);const{ctrlKey:t,shiftKey:n}=e;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"label",indexes:[this.index],ctrlKey:t,shiftKey:n}}))}#d(e){"Enter"===e.key&&(this.#K(),e.preventDefault())}#i(){this.dispatchEvent(new CustomEvent("enter",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#s(){this.dispatchEvent(new CustomEvent("leave",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#n(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{indexes:[this.index],actionIndex:e.detail.index}}))}#u(e){e.detail.indexes.unshift(this.index)}#b(e){e.detail.indexes.unshift(this.index)}#v(e){e.detail.indexes.unshift(this.index)}#y(e){e.detail.indexes.unshift(this.index)}#x(e){e.detail.indexes.unshift(this.index)}#w(e){e.detail.indexes.unshift(this.index)}#f(e){e.detail.indexes.unshift(this.index)}#L(e){e.detail.indexes.unshift(this.index)}#p(e){e.preventDefault()}#K(){this.$labelButton.classList.add("hide"),this.$actions.classList.add("hide"),this.$input.classList.remove("hide"),this.$input.value=this.label,this.$input.select(),this.#R=!0,this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"rename",indexes:[this.index]}}))}#R=!1;#o(e){const{ctrlKey:t,shiftKey:n}=e;t||n||(this.#K(),e.preventDefault())}#m(){this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$labelButton.click(),this.dispatchEvent(new CustomEvent("rename",{bubbles:!0,composed:!0,detail:{indexes:[this.index],label:this.$input.value}}))}#h(e){switch(e.key){case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault()}}#g(e){switch(e.key){case"Enter":this.#m();break;case"Escape":this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$input.value=this.label,this.$labelButton.click();break;case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault()}}#M;#a(e){let t=0;this.dispatchEvent(new CustomEvent("itemdragstart",{bubbles:!0,composed:!0,detail:{ctrlKey:e.ctrlKey,shiftKey:e.shiftKey,indexes:[this.index],callback:e=>{t=e}}})),this.$item.classList.toggle("dragging",!0),this.$items.classList.toggle("dragging",!0);const n=window.devicePixelRatio,i=document.createElement("canvas");document.body.append(i),i.width=100*n,i.height=40*n,i.style.width=i.width/n+"px";var s=i.getContext("2d");if(s){const e=`${t}`;s.font=`bold ${16*n}px Segoe UI`;const i=s.measureText(e);s.fillStyle="#453C4F",s.beginPath(),s.roundRect(20*n,0,(i.width+12)*n,28*n,8+2*n),s.fill(),s.fillStyle="#FFF",s.beginPath(),s.roundRect(22*n,2*n,(i.width+12-4)*n,24*n,8),s.fill(),s.fillStyle="#453C4F",s.fillText(e,30*n,20*n)}e.dataTransfer.setDragImage(i,0,0),this.#M=i}#r(e){this.dispatchEvent(new CustomEvent("itemdragend",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$item.classList.toggle("dragging",!1),this.$items.classList.toggle("dragging",!1),this.#M.remove()}#E(e){e.detail.indexes.unshift(this.index)}#$(e){e.detail.indexes.unshift(this.index)}#k(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),e.dataTransfer.setData("text","test"),e.dataTransfer.effectAllowed="move"}#S(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#F;#I(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),this.#F=setTimeout((()=>{this.#t()}),1500)}#O(e){clearTimeout(this.#F),console.log("darg leave"),e.target.classList.toggle("drop",!1)}#B(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0)}#A(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#C(e){e.preventDefault(),e.dataTransfer.dropEffect="move"}#D(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"before"}}))}#P(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"on"}}))}#T(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"after"}}))}};return be=t})();var z=n(543),R=function(e,t,n,i,s,a){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");a.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&s.unshift(o)}else(o=r(b))&&("field"===d?s.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},K=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};(()=>{let e,t,n,i,s=[x({selector:"pg-tree",style:z.A,template:'<div part="items"></div>'})],a=[],r=HTMLElement,o=[],d=[],l=[],c=[];(class extends r{static{t=this}static{const h="function"==typeof Symbol&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;n=[L()],i=[k()],R(null,null,n,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:h},o,d),R(null,null,i,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:h},l,c),R(null,e={value:t},s,{kind:"class",name:t.name,metadata:h},null,a),t=e.value,h&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:h}),K(t,a)}items=K(this,o,[]);$items=(K(this,d),K(this,l,void 0));#U=(K(this,c),new Map);connectedCallback(){C({container:this.$items,items:this.items,type:e=>j}),this.$items.addEventListener("action",(e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{detail:{actionIndex:e.detail.actionIndex,item:this.#N(e.detail.indexes)}}))})),this.$items.addEventListener("move",(e=>{const{indexes:t,position:n}=e.detail;e.stopPropagation(),this.dispatchEvent(new CustomEvent("move",{detail:{item:this.#N(e.detail.indexes),position:n}}))})),this.$items.addEventListener("rename",(e=>{const{indexes:t,label:n}=e.detail;e.stopPropagation(),this.dispatchEvent(new CustomEvent("rename",{detail:{item:this.#N(t),label:n}}))})),this.$items.addEventListener("toggle",(e=>{const{indexes:t}=e.detail;let n=this.#H(t);n.expanded=!n.expanded})),this.$items.addEventListener("select",(e=>{e.stopPropagation();const{indexes:t,type:n,ctrlKey:i,shiftKey:s}=e.detail,a=this.#H(t),r=this.#U.size,o=v(a);i||!r||this.#U.has(o)||(this.#U.forEach((e=>this.#H(e).selected=!1)),this.#U.clear()),a.selected="rename"===n||!a.selected,a.selected?this.#U.set(o,t):this.#U.delete(o),this.dispatchEvent(new CustomEvent("select",{detail:{items:[...this.#U.values()].map((e=>this.#N(e)))}}))})),this.$items.addEventListener("keydown",(e=>{"Delete"===e.key&&(this.#U.forEach((e=>{this.#_(e)})),this.#U.clear())})),this.$items.addEventListener("itemdragstart",(e=>{const{indexes:t,callback:n,ctrlKey:i,shiftKey:s}=e.detail;console.log("drag valid",t);const a=this.#H(t),r=v(a);!i&&this.#U.size&&(this.#U.forEach((e=>this.#H(e).selected=!1)),this.#U.clear()),a.selected=!0,this.#U.set(r,t);let o=0;this.#U.forEach((e=>{const t=this.#H(e);o=this.#V(t,o)})),n(o),this.$items.classList.toggle("dragging",!0)})),this.$items.addEventListener("itemdragend",(e=>{this.$items.classList.toggle("dragging",!1)})),this.$items.addEventListener("itemdropenter",this.#q.bind(this))}#V(e,t){return t+=1,e.items&&e.items.length>0&&e.items.forEach((e=>{t=this.#V(e,t)})),t}#q(e){const{indexes:t,callback:n}=e.detail,i=this.#W();console.log("valid???",t,i);const s=t.join(",");n(!i.some((e=>s.startsWith(e))),(t=>{e.dataTransfer.effectAllowed=t}))}#_(e){const t=e[e.length-1],n=e.slice(0,e.length-1).reduce(((e,t)=>e.items[t]),this);n.items.splice(t,1)}#H(e){return e.reduce(((e,t)=>e.items[t]),this)}#N(e){return{indexes:e,remove:()=>{this.#_(e),this.#U.clear()},getData:()=>this.#H(e),getParentData:()=>{const t=e.slice(0,e.length-1);return 0===t.length?this:this.#H(t)},move:(t,n)=>{console.log(t,n);const i=t.indexes[t.indexes.length-1],s=t.indexes.slice(0,t.indexes.length-1),a=this.#H(e);this.#_(e),"on"===n?(this.#H(t.indexes).items.push(a),this.#H(t.indexes).expanded=!0):0===s.length?this.items.splice("after"===n?i+1:i,0,a):this.#H(s).items.splice("after"===n?i+1:i,0,a),this.#U.clear(),this.$items.classList.toggle("dragging",!1)}}}render(e){e.items&&console.log("yay",this.items.map((e=>e)))}unselect(e){}#W(){const e=[];return this.#U.forEach((t=>{e.push(t.join(","))})),e}})})()})();
@@ -1 +1 @@
1
- (()=>{"use strict";var t={314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r="",n=void 0!==e[5];return e[4]&&(r+="@supports (".concat(e[4],") {")),e[2]&&(r+="@media ".concat(e[2]," {")),n&&(r+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),r+=t(e),n&&(r+="}"),e[2]&&(r+="}"),e[4]&&(r+="}"),r})).join("")},e.i=function(t,r,n,o,i){"string"==typeof t&&(t=[[null,t,void 0]]);var s={};if(n)for(var a=0;a<this.length;a++){var c=this[a][0];null!=c&&(s[c]=!0)}for(var l=0;l<t.length;l++){var u=[].concat(t[l]);n&&s[u[0]]||(void 0!==i&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=i),r&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=r):u[2]=r),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),e.push(u))}},e}},513:(t,e,r)=>{r.d(e,{A:()=>c});var n=r(601),o=r.n(n),i=r(314),s=r.n(i)()(o());s.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var a=new CSSStyleSheet;a.replaceSync(s.toString());const c=a},601:t=>{t.exports=function(t){return t[1]}}},e={};function r(n){var o=e[n];if(void 0!==o)return o.exports;var i=e[n]={id:n,exports:{}};return t[n](i,i.exports,r),i.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var n in e)r.o(e,n)&&!r.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const n=Symbol("addObserver"),o=Symbol("removeObserver"),i=Symbol("getObservers"),s=Symbol("isProxy"),a=Symbol("getTarget"),c=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function u(t){return new Proxy(t,{get(e,r){if("symbol"==typeof r){switch(r){case s:return!0;case a:return e;case i:return l.has(t);case n:return(e,r)=>{l.has(t)?l.get(t).has(e)?l.get(t).get(e).push(r):l.get(t).set(e,[r]):l.set(t,new Map([[e,[r]]]))};case o:return e=>{l.has(t)&&(l.get(t).delete(e),0===l.get(t).size&&l.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,r)}throw new Error("Unsupported symbol")}if(r in e){if(!Number.isNaN(Number(r)))return"object"==typeof e[r]?u(e[r]):e[r];if("copyWithin"===r)throw new Error("Unsupported array method copyWithin");if(c.includes(r))return l.has(e)?function(){const t=Array.prototype[r].apply(e,arguments);return l.get(e).forEach(((t,n)=>{t.forEach((t=>{t(e,r,arguments)}))})),t}:Reflect.get(e,r);if(e[r]instanceof Array)return u(e[r])}return Reflect.get(e,r)},set(t,e,r){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,r);if(l.has(t)){l.get(t).forEach(((t,n)=>{t.forEach((t=>{t(e,r)}))}))}return Reflect.set(t,e,r)}})}window.observers=l;class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const p=Symbol("init"),d=Symbol("template"),h=Symbol("style"),f=Symbol("parent");function y(t){return t.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function m(t){return t.replace(/-([a-z])/g,(t=>t[1].toUpperCase()))}function b(t={}){return function(e,r){if("class"!==r.kind)throw new Error("@Component() can only decorate a class");var n,o;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[f]||e.prototype[f][e.prototype[f].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[f]=[e.prototype],e.prototype[h]=t.style?[t.style]:[],e.prototype[d]=t.template||""):(e.prototype[f].push(e.prototype),e.prototype[h].push(t.style),e.prototype[d]=(n=e.prototype[d],(o=t.template||null)&&o.match(/<parent\/>/)?o.replace(/<parent\/>/,n):`${n}${o||""}`));const i=e.prototype.connectedCallback||(()=>{}),s=e.prototype.disconnectedCallback||(()=>{});e.prototype.connectedCallback=function(){if(this[p]||void 0!==t.template||void 0!==t.style)if(this[p]){if(this[p]&&t.style);else if(this[p]&&t.selector&&!t.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===t.useShadow)throw new Error("unsupported");{const t=document.createElement("template");t.innerHTML=e.prototype[d]||"";const r=document.importNode(t.content,!0),n=this.attachShadow({mode:"open"});n.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),n.appendChild(r)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const r=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&r.add(t.localName);const n=Array.from(r.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),o=()=>{this[f].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[m(e)]=!0,t)),{}):{})}))};0===n.length?(this[p]=!0,i.call(this),o()):Promise.all(n).then((()=>{this[p]=!0,i.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));o()}))},e.prototype.disconnectedCallback=function(){s.call(this)},e.prototype.attributeChangedCallback=function(t,e,r){this[m(t)]=r},r.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${r.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function v(t){return!!t&&t.constructor===Array}function g(t,e){t[p]&&t[f].map((r=>{r.render&&r.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":v(t)?"array":typeof t}function S(t){return function(e,r){const n=r.name,o=Symbol(n),c=Symbol(`${n}:type`),l=Symbol(`${n}:meta`);return r.addInitializer((function(){Reflect.defineProperty(this,n,{get:()=>"object"===this[c]||"array"===this[c]?this[o][s]?this[o]:u(this[o]):this[o],set:e=>{const r=w(t?t(e):e);if("index"!==n&&this[c]!==r&&"null"!==this[c]&&"null"!==r)throw new Error(`@Prop() ${n} with type '${this[c]}' cannot be set to ${r}.`);if("array"===this[c]){if(!v(e))throw new PropError(`Array "${n}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,n)?.set);if(this[o]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[o]);if(t[i]){const r=e[s]?(l=e)[s]&&l[a]:e;t.splice(0,this[o].length,...r)}else this[o]=e}else this[o]=t?t(e):e,g(this,n);var l}})})),function(e){if(void 0===e&&"index"!==n)throw new Error(`@Prop() ${n} must have an initial value defined.`);if(void 0!==e&&"index"===n)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${n} boolean must initialize to false.`);if(!r.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,r=y(n);e[n]||(t.observedAttributes.push(r),e[n]=o)}return this[c]=w(e),"array"===this[c]?(this[o]=e,new Proxy(e,{get:(t,e)=>e===x?this[l]:(console.log("errr???"),Reflect.get(this[o],e)),set:(t,e,r)=>{if(e===x)return this[l]=r,!0;const i=Reflect.set(t,e,r);return"length"===e&&this[o].length===r||g(this,n),this[o]=r,i}})):(this[o]=t?t(this.getAttribute(n)??e):this.getAttribute(n)??e,this[o])}}}function E(){return function(t,e){const r=e.name,n=r.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,r,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${n}]`))}})}))}}Symbol("hasProxy");const x=Symbol("meta");var $=r(513),P=function(t,e,r,n,o,i){function s(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var a,c=n.kind,l="getter"===c?"get":"setter"===c?"set":"value",u=!e&&t?n.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,n.name):{}),d=!1,h=r.length-1;h>=0;h--){var f={};for(var y in n)f[y]="access"===y?{}:n[y];for(var y in n.access)f.access[y]=n.access[y];f.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");i.push(s(t||null))};var m=(0,r[h])("accessor"===c?{get:p.get,set:p.set}:p[l],f);if("accessor"===c){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(a=s(m.get))&&(p.get=a),(a=s(m.set))&&(p.set=a),(a=s(m.init))&&o.unshift(a)}else(a=s(m))&&("field"===c?o.unshift(a):p[l]=a)}u&&Object.defineProperty(u,n.name,p),d=!0},k=function(t,e,r){for(var n=arguments.length>2,o=0;o<e.length;o++)r=n?e[o].call(t,r):e[o].call(t);return n?r:void 0};(()=>{let t,e,r,n,o,i,s=[b({selector:"pg-tree-button-icon",style:$.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],a=[],c=HTMLElement,l=[],u=[],p=[],d=[],h=[],f=[],y=[],m=[];(class extends c{static{e=this}static{const b="function"==typeof Symbol&&Symbol.metadata?Object.create(c[Symbol.metadata]??null):void 0;r=[S()],n=[S()],o=[E()],i=[E()],P(null,null,r,{kind:"field",name:"index",static:!1,private:!1,access:{has:t=>"index"in t,get:t=>t.index,set:(t,e)=>{t.index=e}},metadata:b},l,u),P(null,null,n,{kind:"field",name:"icon",static:!1,private:!1,access:{has:t=>"icon"in t,get:t=>t.icon,set:(t,e)=>{t.icon=e}},metadata:b},p,d),P(null,null,o,{kind:"field",name:"$button",static:!1,private:!1,access:{has:t=>"$button"in t,get:t=>t.$button,set:(t,e)=>{t.$button=e}},metadata:b},h,f),P(null,null,i,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:t=>"$icon"in t,get:t=>t.$icon,set:(t,e)=>{t.$icon=e}},metadata:b},y,m),P(null,t={value:e},s,{kind:"class",name:e.name,metadata:b},null,a),e=t.value,b&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:b}),k(e,a)}index=k(this,l,void 0);icon=(k(this,u),k(this,p,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(k(this,d),k(this,h,void 0));$icon=(k(this,f),k(this,y,void 0));connectedCallback(){this.$button.addEventListener("click",this.#t.bind(this))}#t(t){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(t){t.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),k(this,m)}})})()})();
1
+ (()=>{"use strict";var t={314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r="",n=void 0!==e[5];return e[4]&&(r+="@supports (".concat(e[4],") {")),e[2]&&(r+="@media ".concat(e[2]," {")),n&&(r+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),r+=t(e),n&&(r+="}"),e[2]&&(r+="}"),e[4]&&(r+="}"),r})).join("")},e.i=function(t,r,n,o,i){"string"==typeof t&&(t=[[null,t,void 0]]);var s={};if(n)for(var a=0;a<this.length;a++){var c=this[a][0];null!=c&&(s[c]=!0)}for(var l=0;l<t.length;l++){var p=[].concat(t[l]);n&&s[p[0]]||(void 0!==i&&(void 0===p[5]||(p[1]="@layer".concat(p[5].length>0?" ".concat(p[5]):""," {").concat(p[1],"}")),p[5]=i),r&&(p[2]?(p[1]="@media ".concat(p[2]," {").concat(p[1],"}"),p[2]=r):p[2]=r),o&&(p[4]?(p[1]="@supports (".concat(p[4],") {").concat(p[1],"}"),p[4]=o):p[4]="".concat(o)),e.push(p))}},e}},513:(t,e,r)=>{r.d(e,{A:()=>c});var n=r(601),o=r.n(n),i=r(314),s=r.n(i)()(o());s.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var a=new CSSStyleSheet;a.replaceSync(s.toString());const c=a},601:t=>{t.exports=function(t){return t[1]}}},e={};function r(n){var o=e[n];if(void 0!==o)return o.exports;var i=e[n]={id:n,exports:{}};return t[n](i,i.exports,r),i.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var n in e)r.o(e,n)&&!r.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const n=Symbol("addObserver"),o=Symbol("removeObserver"),i=Symbol("getObservers"),s=Symbol("swapObserver"),a=Symbol("isProxy"),c=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],p=new Map;function u(t){return new Proxy(t,{get(e,r){if("symbol"==typeof r){switch(r){case a:return!0;case c:return e;case i:return p.has(t);case s:return(e,r)=>{const n=p.get(t);n.forEach(((o,i)=>{if(i.getRootNode().host===e){const e=n.get(i);p.has(r)?p.get(r).has(i)?p.get(r).get(i).push(n.get(i)):p.get(r).set(i,n.get(i)):p.set(r,new Map([[i,e]])),p.delete(t),e.forEach((t=>{t(null,h.swap,[r])}))}}))};case n:return(e,r)=>{p.has(t)?p.get(t).has(e)?p.get(t).get(e).push(r):p.get(t).set(e,[r]):p.set(t,new Map([[e,[r]]]))};case o:return e=>{p.has(t)&&(p.get(t).delete(e),0===p.get(t).size&&p.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,r)}throw new Error("Unsupported symbol")}if(r in e){if(!Number.isNaN(Number(r)))return"object"==typeof e[r]?u(e[r]):e[r];if("copyWithin"===r)throw new Error("Unsupported array method copyWithin");if(l.includes(r))return p.has(e)?function(){const t=Array.prototype[r].apply(e,arguments);return p.get(e).forEach(((t,n)=>{t.forEach((t=>{t(e,r,arguments)}))})),t}:Reflect.get(e,r);if(e[r]instanceof Array)return u(e[r])}return Reflect.get(e,r)},set(t,e,r){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,r);if(p.has(t)){p.get(t).forEach(((t,n)=>{t.forEach((t=>{t(e,r)}))}))}return Reflect.set(t,e,r)}})}window.observers=p;const h={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),f=Symbol("template"),y=Symbol("style"),m=Symbol("parent");function b(t){return t.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function g(t){return t.replace(/-([a-z])/g,(t=>t[1].toUpperCase()))}function v(t={}){return function(e,r){if("class"!==r.kind)throw new Error("@Component() can only decorate a class");var n,o;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[m]||e.prototype[m][e.prototype[m].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[m]=[e.prototype],e.prototype[y]=t.style?[t.style]:[],e.prototype[f]=t.template||""):(e.prototype[m].push(e.prototype),e.prototype[y].push(t.style),e.prototype[f]=(n=e.prototype[f],(o=t.template||null)&&o.match(/<parent\/>/)?o.replace(/<parent\/>/,n):`${n}${o||""}`));const i=e.prototype.connectedCallback||(()=>{}),s=e.prototype.disconnectedCallback||(()=>{});e.prototype.connectedCallback=function(){if(this[d]||void 0!==t.template||void 0!==t.style)if(this[d]){if(this[d]&&t.style);else if(this[d]&&t.selector&&!t.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===t.useShadow)throw new Error("unsupported");{const t=document.createElement("template");t.innerHTML=e.prototype[f]||"";const r=document.importNode(t.content,!0),n=this.attachShadow({mode:"open"});n.adoptedStyleSheets=e.prototype[y].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),n.appendChild(r)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const r=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&r.add(t.localName);const n=Array.from(r.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),o=()=>{this[m].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[g(e)]=!0,t)),{}):{})}))};0===n.length?(this[d]=!0,i.call(this),o()):Promise.all(n).then((()=>{this[d]=!0,i.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));o()}))},e.prototype.disconnectedCallback=function(){s.call(this)},e.prototype.attributeChangedCallback=function(t,e,r){this[g(t)]=r},r.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${r.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function w(t){return!!t&&t.constructor===Array}function S(t,e){t[d]&&t[m].map((r=>{r.render&&r.render.call(t,{[e]:!0})}))}function E(t){return null===t?"null":w(t)?"array":typeof t}function x(t){return function(e,r){const n=r.name,o=Symbol(n),l=Symbol(`${n}:type`),p=Symbol(`${n}:meta`);return r.addInitializer((function(){Reflect.defineProperty(this,n,{get:()=>"object"===this[l]||"array"===this[l]?this[o][a]?this[o]:u(this[o]):this[o],set:e=>{const r=E(t?t(e):e);if("index"!==n&&this[l]!==r&&"null"!==this[l]&&"null"!==r)throw new Error(`@Prop() ${n} with type '${this[l]}' cannot be set to ${r}.`);if("array"===this[l]){if(!w(e))throw new PropError(`Array "${n}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,n)?.set);if(this[o]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[o]);if(t[i]){const r=e[a]?e[c]:e;t[s](this,r),this[o]=e,console.log(">>> trigger render???",this,n)}else this[o]=e}else this[o]=t?t(e):e,S(this,n)}})})),function(e){if(void 0===e&&"index"!==n)throw new Error(`@Prop() ${n} must have an initial value defined.`);if(void 0!==e&&"index"===n)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${n} boolean must initialize to false.`);if(!r.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,r=b(n);e[n]||(t.observedAttributes.push(r),e[n]=o)}return this[l]=E(e),"array"===this[l]?(this[o]=e,new Proxy(e,{get:(t,e)=>e===P?this[p]:(console.log("errr???"),Reflect.get(this[o],e)),set:(t,e,r)=>{if(e===P)return this[p]=r,!0;const i=Reflect.set(t,e,r);return"length"===e&&this[o].length===r||S(this,n),this[o]=r,i}})):(this[o]=t?t(this.getAttribute(n)??e):this.getAttribute(n)??e,this[o])}}}function $(){return function(t,e){const r=e.name,n=r.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,r,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${n}]`))}})}))}}Symbol("hasProxy");const P=Symbol("meta");var k=r(513),C=function(t,e,r,n,o,i){function s(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var a,c=n.kind,l="getter"===c?"get":"setter"===c?"set":"value",p=!e&&t?n.static?t:t.prototype:null,u=e||(p?Object.getOwnPropertyDescriptor(p,n.name):{}),h=!1,d=r.length-1;d>=0;d--){var f={};for(var y in n)f[y]="access"===y?{}:n[y];for(var y in n.access)f.access[y]=n.access[y];f.addInitializer=function(t){if(h)throw new TypeError("Cannot add initializers after decoration has completed");i.push(s(t||null))};var m=(0,r[d])("accessor"===c?{get:u.get,set:u.set}:u[l],f);if("accessor"===c){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(a=s(m.get))&&(u.get=a),(a=s(m.set))&&(u.set=a),(a=s(m.init))&&o.unshift(a)}else(a=s(m))&&("field"===c?o.unshift(a):u[l]=a)}p&&Object.defineProperty(p,n.name,u),h=!0},A=function(t,e,r){for(var n=arguments.length>2,o=0;o<e.length;o++)r=n?e[o].call(t,r):e[o].call(t);return n?r:void 0};(()=>{let t,e,r,n,o,i,s=[v({selector:"pg-tree-button-icon",style:k.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],a=[],c=HTMLElement,l=[],p=[],u=[],h=[],d=[],f=[],y=[],m=[];(class extends c{static{e=this}static{const b="function"==typeof Symbol&&Symbol.metadata?Object.create(c[Symbol.metadata]??null):void 0;r=[x()],n=[x()],o=[$()],i=[$()],C(null,null,r,{kind:"field",name:"index",static:!1,private:!1,access:{has:t=>"index"in t,get:t=>t.index,set:(t,e)=>{t.index=e}},metadata:b},l,p),C(null,null,n,{kind:"field",name:"icon",static:!1,private:!1,access:{has:t=>"icon"in t,get:t=>t.icon,set:(t,e)=>{t.icon=e}},metadata:b},u,h),C(null,null,o,{kind:"field",name:"$button",static:!1,private:!1,access:{has:t=>"$button"in t,get:t=>t.$button,set:(t,e)=>{t.$button=e}},metadata:b},d,f),C(null,null,i,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:t=>"$icon"in t,get:t=>t.$icon,set:(t,e)=>{t.$icon=e}},metadata:b},y,m),C(null,t={value:e},s,{kind:"class",name:e.name,metadata:b},null,a),e=t.value,b&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:b}),A(e,a)}index=A(this,l,void 0);icon=(A(this,p),A(this,u,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(A(this,h),A(this,d,void 0));$icon=(A(this,f),A(this,y,void 0));connectedCallback(){this.$button.addEventListener("click",this.#t.bind(this))}#t(t){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(t){t.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),A(this,m)}})})()})();
package/pgTreeItem.js CHANGED
@@ -1 +1 @@
1
- (()=>{"use strict";var e={84:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},122:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27white%27 /></svg>"},273:(e,t,n)=>{n.d(t,{A:()=>y});var i=n(601),a=n.n(i),r=n(314),s=n.n(r),o=n(417),d=n.n(o),l=new URL(n(630),n.b),c=new URL(n(122),n.b),h=new URL(n(432),n.b),p=new URL(n(84),n.b),m=s()(a()),g=d()(l),u=d()(c),b=d()(h),v=d()(p);m.push([e.id,`:host {\n display: contents;\n --y: calc(var(--x) + 1);\n}\n\n.hide {\n display: none !important;\n}\n\n[part=iconButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n padding: 0;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n}\n\n[part=labelButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n flex: 1;\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n margin: -0.25rem -0.25rem -0.25rem -0.25rem;\n padding: 0 0.25rem 0 0.25rem;\n}\n\n[part=label] {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n}\n\n[part=input] {\n display: flex;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n border-radius: 0.125rem;\n flex: 1;\n outline: 0;\n padding: 0 0.25rem;\n margin: -0.125rem -0.625rem -0.125rem -0.25rem;\n border-width: var(--pg-tree-item-border-width, 0);\n border-style: solid;\n border-color: var(--pg-tree-item-border-color, #453C4F);\n}\n\n[part=item] {\n display: grid;\n background: var(--pg-tree-item-background, transparent);\n border-radius: 0.25rem;\n padding: 0.25rem;\n gap: 0 0.5rem;\n user-select: none;\n padding-left: calc((var(--x) * 0.5rem) + 0.25rem);\n transition: background-color 0.1s ease-out;\n}\n\n[part=item] {\n grid-template-columns: min-content min-content minmax(0, 1fr) min-content;\n grid-template-rows: auto;\n}\n[part=item] [part=selected] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=toggle] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=iconButton] {\n grid-row: 1;\n grid-column: 2;\n}\n[part=item] [part=labelButton] {\n grid-row: 1;\n grid-column: 3;\n}\n[part=item] [part=actions] {\n grid-row: 1;\n grid-column: 4;\n}\n[part=item] [part=dropabove] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-start;\n transform: translateY(-0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n[part=item] [part=dropon] {\n grid-row: 1;\n grid-column: 1 / 5;\n margin: 0.125rem -0.25rem;\n z-index: 1;\n}\n[part=item]:not(.items) [part=dropon] {\n display: none;\n}\n[part=item].items.expanded [part=dropbelow] {\n display: none;\n}\n[part=item] [part=dropbelow] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-end;\n transform: translateY(0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n\n[part=item]:not(.selected):not(.dragging):hover {\n background: var(--pg-tree-selected-secondary, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected:not(.dragging):hover {\n background: var(--pg-tree-selected-secondary-hover, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected,\n[part=item].items.selected {\n background-color: var(--pg-tree-selected-secondary);\n}\n[part=item].items.selected:not(.expanded):not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${g}) !important;\n}\n\n[part=item].items.selected.expanded:not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${u}) !important;\n}\n\n[part=item].items [part=selected] {\n display: none;\n}\n\n[part=item]:not(.items) [part=selected] {\n visibility: hidden;\n display: flex;\n width: 1rem;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n border-radius: 0.125rem;\n background: var(--pg-tree-selected-primary);\n}\n\n[part=item]:not(.dragging):not(.items).selected [part=selected] {\n visibility: visible;\n}\n\n[part=actions] {\n display: flex;\n gap: 0.25rem;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n}\n\n[part=items] {\n display: none;\n flex-direction: column;\n --x: calc(var(--y) + 1);\n gap: 0.25rem;\n}\n[part=items].expanded {\n display: flex;\n}\n\n[part=toggle] {\n display: none;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n padding: 0 0 0 1rem;\n width: 1rem;\n border: 0;\n background-repeat: no-repeat;\n background-position: center;\n background-color: transparent;\n}\n\n[part=toggle]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}\n\n[part=item].items:not(.expanded) [part=toggle] {\n display: flex;\n background-image: url(${b});\n}\n\n[part=item].items.expanded [part=toggle] {\n display: flex;\n background-image: url(${v});\n}\n\n[part=dropabove].drop::before,\n[part=dropbelow].drop::before {\n content: ' ';\n height: 0.25rem;\n background-color: rgb(79, 143, 249);\n border-radius: 0.125rem;\n display: flex;\n margin-top: 0.375rem;\n}\n\n[part=dropon].drop {\n margin: -0.25rem !important;\n border: 4px solid rgb(79, 143, 249);\n border-radius: 0.25rem;\n}\n\n[part=item].dragging::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n border: 2px dashed rgb(79, 143, 249);\n}\n[part=items].dragging {\n --pg-_is-index-dragging: true;\n}\n[part=item].dragging [part=dropabove],\n[part=item].dragging [part=dropon],\n[part=item].dragging [part=dropbelow] {\n display: none;\n}\n\n@container style(--pg-_is-dragging: false) {\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n\n@container style(--pg-_is-index-dragging: true) {\n [part=item]::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n }\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n`,""]);var f=new CSSStyleSheet;f.replaceSync(m.toString());const y=f},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",i=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),i&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),i&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,i,a,r){"string"==typeof e&&(e=[[null,e,void 0]]);var s={};if(i)for(var o=0;o<this.length;o++){var d=this[o][0];null!=d&&(s[d]=!0)}for(var l=0;l<e.length;l++){var c=[].concat(e[l]);i&&s[c[0]]||(void 0!==r&&(void 0===c[5]||(c[1]="@layer".concat(c[5].length>0?" ".concat(c[5]):""," {").concat(c[1],"}")),c[5]=r),n&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=n):c[2]=n),a&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=a):c[4]="".concat(a)),t.push(c))}},t}},417:e=>{e.exports=function(e,t){return t||(t={}),e?(e=String(e.__esModule?e.default:e),/^['"].*['"]$/.test(e)&&(e=e.slice(1,-1)),t.hash&&(e+=t.hash),/["'() \t\n]|(%20)/.test(e)||t.needQuotes?'"'.concat(e.replace(/"/g,'\\"').replace(/\n/g,"\\n"),'"'):e):e}},432:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},513:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),a=n.n(i),r=n(314),s=n.n(r)()(a());s.push([e.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(s.toString());const d=o},601:e=>{e.exports=function(e){return e[1]}},630:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27white%27 /></svg>"}},t={};function n(i){var a=t[i];if(void 0!==a)return a.exports;var r=t[i]={id:i,exports:{}};return e[i](r,r.exports,n),r.exports}n.m=e,n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.b="undefined"!=typeof document&&document.baseURI||self.location.href;const i=Symbol("addObserver"),a=Symbol("removeObserver"),r=Symbol("getObservers"),s=Symbol("isProxy"),o=Symbol("getTarget"),d=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function c(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case s:return!0;case o:return t;case r:return l.has(e);case i:return(t,n)=>{l.has(e)?l.get(e).has(t)?l.get(e).get(t).push(n):l.get(e).set(t,[n]):l.set(e,new Map([[t,[n]]]))};case a:return t=>{l.has(e)&&(l.get(e).delete(t),0===l.get(e).size&&l.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?c(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(d.includes(n))return l.has(t)?function(){const e=Array.prototype[n].apply(t,arguments);return l.get(t).forEach(((e,i)=>{e.forEach((e=>{e(t,n,arguments)}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return c(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(l.has(e)){l.get(e).forEach(((e,i)=>{e.forEach((e=>{e(t,n)}))}))}return Reflect.set(e,t,n)}})}window.observers=l;const h="fill",p="pop",m="push",g="reverse",u="shift",b="sort",v="splice",f="unshift";class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const y=Symbol("init"),w=Symbol("template"),x=Symbol("style"),$=Symbol("parent");function E(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function L(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function k(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var i,a;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[$]||t.prototype[$][t.prototype[$].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[$]=[t.prototype],t.prototype[x]=e.style?[e.style]:[],t.prototype[w]=e.template||""):(t.prototype[$].push(t.prototype),t.prototype[x].push(e.style),t.prototype[w]=(i=t.prototype[w],(a=e.template||null)&&a.match(/<parent\/>/)?a.replace(/<parent\/>/,i):`${i}${a||""}`));const r=t.prototype.connectedCallback||(()=>{}),s=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[y]||void 0!==e.template||void 0!==e.style)if(this[y]){if(this[y]&&e.style);else if(this[y]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[w]||"";const n=document.importNode(e.content,!0),i=this.attachShadow({mode:"open"});i.adoptedStyleSheets=t.prototype[x].map((e=>{if(e instanceof CSSStyleSheet)return e;var t=new CSSStyleSheet;return t.replaceSync(e.toString()),t})),i.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const i=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),a=()=>{this[$].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[L(t)]=!0,e)),{}):{})}))};0===i.length?(this[y]=!0,r.call(this),a()):Promise.all(i).then((()=>{this[y]=!0,r.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));a()}))},t.prototype.disconnectedCallback=function(){s.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[L(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function S(e){return!!e&&e.constructor===Array}function C(e,t){e[y]&&e[$].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function D(e){return null===e?"null":S(e)?"array":typeof e}function B(e){return function(t,n){const i=n.name,a=Symbol(i),d=Symbol(`${i}:type`),l=Symbol(`${i}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,i,{get:()=>"object"===this[d]||"array"===this[d]?this[a][s]?this[a]:c(this[a]):this[a],set:t=>{const n=D(e?e(t):t);if("index"!==i&&this[d]!==n&&"null"!==this[d]&&"null"!==n)throw new Error(`@Prop() ${i} with type '${this[d]}' cannot be set to ${n}.`);if("array"===this[d]){if(!S(t))throw new PropError(`Array "${i}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,i)?.set);if(this[a]===t)throw new Error("Setting an array to itself is not allowed.");const e=c(this[a]);if(e[r]){const n=t[s]?(l=t)[s]&&l[o]:t;e.splice(0,this[a].length,...n)}else this[a]=t}else this[a]=e?e(t):t,C(this,i);var l}})})),function(t){if(void 0===t&&"index"!==i)throw new Error(`@Prop() ${i} must have an initial value defined.`);if(void 0!==t&&"index"===i)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${i} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=E(i);t[i]||(e.observedAttributes.push(n),t[i]=a)}return this[d]=D(t),"array"===this[d]?(this[a]=t,new Proxy(t,{get:(e,t)=>t===A?this[l]:(console.log("errr???"),Reflect.get(this[a],t)),set:(e,t,n)=>{if(t===A)return this[l]=n,!0;const r=Reflect.set(e,t,n);return"length"===t&&this[a].length===n||C(this,i),this[a]=n,r}})):(this[a]=e?e(this.getAttribute(i)??t):this.getAttribute(i)??t,this[a])}}}function O(){return function(e,t){const n=t.name,i=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${i}]`))}})}))}}Symbol("hasProxy");const A=Symbol("meta");function P({container:e,items:t,type:n,create:a,connect:r,disconnect:s,update:o}){function d(e,r){const s=n(e),o=document.createElement(E(s.name),s),d=s.observedAttributes??[],l=function(e,t){const n=new Set(e);return t.filter((e=>n.has(e)))}(Object.keys(e),d);return d.includes("index")&&(o.index=r),-1!==l.indexOf("index")&&l.splice(l.indexOf("index"),1),l.forEach((t=>{o[t]=e[t]})),a&&a(o,c(e)),t[r][i](o,((e,t)=>{o[e]=t})),o}t.forEach(((t,n)=>{const i=d(t,n);e.appendChild(i),r&&r(i,c(t))})),t[i](e,((n,i,a)=>{switch(i){case h:const[n,i,o]=a;for(let a=i||0;a<(o||t.length);a++)Object.keys(n).forEach((t=>{e.children[a][t]=n[t]}));break;case p:const l=e.children.length;l>0&&e.children[l-1].remove();break;case m:const y=e.children.length;[...a].forEach(((t,n)=>{const i=d(t,y+n);e.appendChild(i),r&&r(i,c(t))}));break;case g:for(var s=1;s<e.children.length;s++)e.insertBefore(e.children[s],e.children[0]);break;case u:e.children.length&&e.children[0].remove();for(let t=0;t<e.children.length;t++)e.children[t].index=t;break;case b:throw new Error("ToDo... write sort.");case v:const[w,x,...$]=a;if(x>0)for(let t=w;t<x+w;t++)e.children[t].remove();let E=$.length||0;if(E>0){const t=$.map(((e,t)=>d(e,w+t)));0===w?e.prepend(...t):e.children[w-1].after(...t);for(let t=w-x+E;t<e.children.length;t++)e.children[t].index=t;t.forEach((e=>{r&&r(e,$[s])}))}else for(let t=w;t<e.children.length;t++)e.children[t].index=t;break;case f:const L=e.children.length&&e.children[0],k=[...a].length;[...a].forEach(((t,n)=>{L?L.before(d(t,n)):e.appendChild(d(t,n))}));for(let t=k;t<e.children.length;t++)e.children[t].index=t}}))}var T=n(513),I=function(e,t,n,i,a,r){function s(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");r.push(s(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=s(b.get))&&(h.get=o),(o=s(b.set))&&(h.set=o),(o=s(b.init))&&a.unshift(o)}else(o=s(b))&&("field"===d?a.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},R=function(e,t,n){for(var i=arguments.length>2,a=0;a<t.length;a++)n=i?t[a].call(e,n):t[a].call(e);return i?n:void 0};const z=(()=>{let e,t,n,i,a,r,s=[k({selector:"pg-tree-button-icon",style:T.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],o=[],d=HTMLElement,l=[],c=[],h=[],p=[],m=[],g=[],u=[],b=[];(class extends d{static{t=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[B()],i=[B()],a=[O()],r=[O()],I(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:v},l,c),I(null,null,i,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:v},h,p),I(null,null,a,{kind:"field",name:"$button",static:!1,private:!1,access:{has:e=>"$button"in e,get:e=>e.$button,set:(e,t)=>{e.$button=t}},metadata:v},m,g),I(null,null,r,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:v},u,b),I(null,e={value:t},s,{kind:"class",name:t.name,metadata:v},null,o),t=e.value,v&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),R(t,o)}index=R(this,l,void 0);icon=(R(this,c),R(this,h,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(R(this,p),R(this,m,void 0));$icon=(R(this,g),R(this,u,void 0));connectedCallback(){this.$button.addEventListener("click",this.#e.bind(this))}#e(e){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(e){e.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),R(this,b)}});return t})();var j=n(273),K=function(e,t,n,i,a,r){function s(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");r.push(s(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=s(b.get))&&(h.get=o),(o=s(b.set))&&(h.set=o),(o=s(b.init))&&a.unshift(o)}else(o=s(b))&&("field"===d?a.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},M=function(e,t,n){for(var i=arguments.length>2,a=0;a<t.length;a++)n=i?t[a].call(e,n):t[a].call(e);return i?n:void 0};(()=>{let e,t,n,i,a,r,s,o,d,l,c,h,p,m,g,u,b,v,f,y,w,x=[k({selector:"pg-tree-item",style:j.A,template:'<div part="item" draggable="true"> <div part="selected"></div> <button part="toggle"></button> <button part="iconButton"> <pg-icon part="icon"></pg-icon> </button> <input part="input" type="text" class="hide"/> <button part="labelButton"> <span part="label"></span> </button> <div part="actions"></div> <div part="dropabove"></div> <div part="dropon"></div> <div part="dropbelow"></div> </div> <div part="items"></div>'})],$=[],E=HTMLElement,L=[],S=[],C=[],D=[],A=[],T=[],I=[],R=[],F=[],U=[],N=[],H=[],_=[],V=[],q=[],Y=[],W=[],Z=[],Q=[],G=[],J=[],X=[],ee=[],te=[],ne=[],ie=[],ae=[],re=[],se=[],oe=[],de=[],le=[],ce=[],he=[],pe=[],me=[],ge=[],ue=[];var be=class extends E{static{t=this}static{const k="function"==typeof Symbol&&Symbol.metadata?Object.create(E[Symbol.metadata]??null):void 0;n=[B()],i=[B()],a=[B()],r=[B()],s=[B()],o=[B()],d=[B()],l=[O()],c=[O()],h=[O()],p=[O()],m=[O()],g=[O()],u=[O()],b=[O()],v=[O()],f=[O()],y=[O()],w=[O()],K(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:k},L,S),K(null,null,i,{kind:"field",name:"label",static:!1,private:!1,access:{has:e=>"label"in e,get:e=>e.label,set:(e,t)=>{e.label=t}},metadata:k},C,D),K(null,null,a,{kind:"field",name:"selected",static:!1,private:!1,access:{has:e=>"selected"in e,get:e=>e.selected,set:(e,t)=>{e.selected=t}},metadata:k},A,T),K(null,null,r,{kind:"field",name:"expanded",static:!1,private:!1,access:{has:e=>"expanded"in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:k},I,R),K(null,null,s,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:k},F,U),K(null,null,o,{kind:"field",name:"actions",static:!1,private:!1,access:{has:e=>"actions"in e,get:e=>e.actions,set:(e,t)=>{e.actions=t}},metadata:k},N,H),K(null,null,d,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:k},_,V),K(null,null,l,{kind:"field",name:"$toggle",static:!1,private:!1,access:{has:e=>"$toggle"in e,get:e=>e.$toggle,set:(e,t)=>{e.$toggle=t}},metadata:k},q,Y),K(null,null,c,{kind:"field",name:"$item",static:!1,private:!1,access:{has:e=>"$item"in e,get:e=>e.$item,set:(e,t)=>{e.$item=t}},metadata:k},W,Z),K(null,null,h,{kind:"field",name:"$input",static:!1,private:!1,access:{has:e=>"$input"in e,get:e=>e.$input,set:(e,t)=>{e.$input=t}},metadata:k},Q,G),K(null,null,p,{kind:"field",name:"$iconButton",static:!1,private:!1,access:{has:e=>"$iconButton"in e,get:e=>e.$iconButton,set:(e,t)=>{e.$iconButton=t}},metadata:k},J,X),K(null,null,m,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:k},ee,te),K(null,null,g,{kind:"field",name:"$label",static:!1,private:!1,access:{has:e=>"$label"in e,get:e=>e.$label,set:(e,t)=>{e.$label=t}},metadata:k},ne,ie),K(null,null,u,{kind:"field",name:"$labelButton",static:!1,private:!1,access:{has:e=>"$labelButton"in e,get:e=>e.$labelButton,set:(e,t)=>{e.$labelButton=t}},metadata:k},ae,re),K(null,null,b,{kind:"field",name:"$actions",static:!1,private:!1,access:{has:e=>"$actions"in e,get:e=>e.$actions,set:(e,t)=>{e.$actions=t}},metadata:k},se,oe),K(null,null,v,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:k},de,le),K(null,null,f,{kind:"field",name:"$dropabove",static:!1,private:!1,access:{has:e=>"$dropabove"in e,get:e=>e.$dropabove,set:(e,t)=>{e.$dropabove=t}},metadata:k},ce,he),K(null,null,y,{kind:"field",name:"$dropon",static:!1,private:!1,access:{has:e=>"$dropon"in e,get:e=>e.$dropon,set:(e,t)=>{e.$dropon=t}},metadata:k},pe,me),K(null,null,w,{kind:"field",name:"$dropbelow",static:!1,private:!1,access:{has:e=>"$dropbelow"in e,get:e=>e.$dropbelow,set:(e,t)=>{e.$dropbelow=t}},metadata:k},ge,ue),K(null,e={value:t},x,{kind:"class",name:t.name,metadata:k},null,$),be=t=e.value,k&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:k}),M(t,$)}index=M(this,L,void 0);label=(M(this,S),M(this,C,""));selected=(M(this,D),M(this,A,!1));expanded=(M(this,T),M(this,I,!1));icon=(M(this,R),M(this,F,{path:"M0 0h24v24H0V0zm2 2v20h20V2H2z"}));actions=(M(this,U),M(this,N,[]));items=(M(this,H),M(this,_,[]));$toggle=(M(this,V),M(this,q,void 0));$item=(M(this,Y),M(this,W,void 0));$input=(M(this,Z),M(this,Q,void 0));$iconButton=(M(this,G),M(this,J,void 0));$icon=(M(this,X),M(this,ee,void 0));$label=(M(this,te),M(this,ne,void 0));$labelButton=(M(this,ie),M(this,ae,void 0));$actions=(M(this,re),M(this,se,void 0));$items=(M(this,oe),M(this,de,void 0));$dropabove=(M(this,le),M(this,ce,void 0));$dropon=(M(this,he),M(this,pe,void 0));$dropbelow=(M(this,me),M(this,ge,void 0));connectedCallback(){this.$toggle.addEventListener("click",this.#t.bind(this)),this.$item.addEventListener("action",this.#n.bind(this)),this.$item.addEventListener("pointerenter",this.#i.bind(this)),this.$item.addEventListener("pointerleave",this.#a.bind(this)),this.$item.addEventListener("dragstart",this.#r.bind(this)),this.$item.addEventListener("dragend",this.#s.bind(this)),this.$labelButton.addEventListener("dblclick",this.#o.bind(this)),this.$labelButton.addEventListener("click",this.#e.bind(this)),this.$labelButton.addEventListener("keydown",this.#d.bind(this)),this.$iconButton.addEventListener("dblclick",this.#l.bind(this)),this.$iconButton.addEventListener("click",this.#c.bind(this)),this.$iconButton.addEventListener("keydown",this.#h.bind(this)),this.$item.addEventListener("contextmenu",this.#p.bind(this)),this.$input.addEventListener("blur",this.#m.bind(this)),this.$input.addEventListener("keydown",this.#g.bind(this)),this.$items.addEventListener("action",this.#u.bind(this)),this.$items.addEventListener("move",this.#b.bind(this)),this.$items.addEventListener("toggle",this.#v.bind(this)),this.$items.addEventListener("select",this.#f.bind(this)),this.$items.addEventListener("rename",this.#y.bind(this)),this.$items.addEventListener("up",this.#w.bind(this)),this.$items.addEventListener("down",this.#x.bind(this)),this.$items.addEventListener("itemdragstart",this.#$.bind(this)),this.$items.addEventListener("itemdragend",this.#E.bind(this)),this.$items.addEventListener("itemdropenter",this.#L.bind(this)),this.$dropabove.addEventListener("dragenter",this.#k.bind(this)),this.$dropabove.addEventListener("dragleave",this.#S.bind(this)),this.$dropabove.addEventListener("dragover",this.#C.bind(this)),this.$dropabove.addEventListener("drop",this.#D.bind(this)),this.$dropon.addEventListener("dragenter",this.#B.bind(this)),this.$dropon.addEventListener("dragleave",this.#O.bind(this)),this.$dropon.addEventListener("dragover",this.#C.bind(this)),this.$dropon.addEventListener("drop",this.#A.bind(this)),this.$dropbelow.addEventListener("dragenter",this.#P.bind(this)),this.$dropbelow.addEventListener("dragleave",this.#T.bind(this)),this.$dropbelow.addEventListener("dragover",this.#C.bind(this)),this.$dropbelow.addEventListener("drop",this.#I.bind(this)),P({container:this.$actions,items:this.actions,type:e=>z}),this.expanded&&this.#R()}disconnectedCallback(){console.log("disconnect",this.index)}#z=(M(this,ue),!0);#R(){this.#z&&(P({container:this.$items,items:this.items,type:e=>be}),this.#z=!1)}render(e){e.label&&(this.$label.textContent=this.label),e.icon&&this.icon&&(this.$icon.path=this.icon.path),e.selected&&this.$item.classList.toggle("selected",this.selected),e.items&&this.$item.classList.toggle("items",0!==this.items.length),e.expanded&&(this.expanded&&this.#R(),this.$item.classList.toggle("expanded",this.expanded),this.$items.classList.toggle("expanded",this.expanded))}#t(){this.dispatchEvent(new CustomEvent("toggle",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#l(e){const{ctrlKey:t,shiftKey:n}=e;t||n||this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icondoubleclick",indexes:[this.index]}}))}#c(){this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icon",indexes:[this.index]}}))}#e(e){if(this.#j)return void(this.#j=!1);const{ctrlKey:t,shiftKey:n}=e;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"label",indexes:[this.index],ctrlKey:t,shiftKey:n}}))}#d(e){"Enter"===e.key&&(this.#K(),e.preventDefault())}#i(){this.dispatchEvent(new CustomEvent("enter",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#a(){this.dispatchEvent(new CustomEvent("leave",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#n(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{indexes:[this.index],actionIndex:e.detail.index}}))}#u(e){e.detail.indexes.unshift(this.index)}#b(e){e.detail.indexes.unshift(this.index)}#v(e){e.detail.indexes.unshift(this.index)}#y(e){e.detail.indexes.unshift(this.index)}#w(e){e.detail.indexes.unshift(this.index)}#x(e){e.detail.indexes.unshift(this.index)}#f(e){e.detail.indexes.unshift(this.index)}#L(e){e.detail.indexes.unshift(this.index)}#p(e){e.preventDefault()}#K(){this.$labelButton.classList.add("hide"),this.$actions.classList.add("hide"),this.$input.classList.remove("hide"),this.$input.value=this.label,this.$input.select(),this.#j=!0,this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"rename",indexes:[this.index]}}))}#j=!1;#o(e){const{ctrlKey:t,shiftKey:n}=e;t||n||(this.#K(),e.preventDefault())}#m(){this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$labelButton.click(),this.dispatchEvent(new CustomEvent("rename",{bubbles:!0,composed:!0,detail:{indexes:[this.index],label:this.$input.value}}))}#h(e){switch(e.key){case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault()}}#g(e){switch(e.key){case"Enter":this.#m();break;case"Escape":this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$input.value=this.label,this.$labelButton.click();break;case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault()}}#M;#r(e){let t=0;this.dispatchEvent(new CustomEvent("itemdragstart",{bubbles:!0,composed:!0,detail:{ctrlKey:e.ctrlKey,shiftKey:e.shiftKey,indexes:[this.index],callback:e=>{t=e}}})),this.$item.classList.toggle("dragging",!0),this.$items.classList.toggle("dragging",!0);const n=window.devicePixelRatio,i=document.createElement("canvas");document.body.append(i),i.width=100*n,i.height=40*n,i.style.width=i.width/n+"px";var a=i.getContext("2d");if(a){const e=`${t}`;a.font=`bold ${16*n}px Segoe UI`;const i=a.measureText(e);a.fillStyle="#453C4F",a.beginPath(),a.roundRect(20*n,0,(i.width+12)*n,28*n,8+2*n),a.fill(),a.fillStyle="#FFF",a.beginPath(),a.roundRect(22*n,2*n,(i.width+12-4)*n,24*n,8),a.fill(),a.fillStyle="#453C4F",a.fillText(e,30*n,20*n)}e.dataTransfer.setDragImage(i,0,0),this.#M=i}#s(e){this.dispatchEvent(new CustomEvent("itemdragend",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$item.classList.toggle("dragging",!1),this.$items.classList.toggle("dragging",!1),this.#M.remove()}#$(e){e.detail.indexes.unshift(this.index)}#E(e){e.detail.indexes.unshift(this.index)}#k(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),e.dataTransfer.setData("text","test"),e.dataTransfer.effectAllowed="move"}#S(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#F;#B(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),this.#F=setTimeout((()=>{this.#t()}),1500)}#O(e){clearTimeout(this.#F),console.log("darg leave"),e.target.classList.toggle("drop",!1)}#P(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0)}#T(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#C(e){e.preventDefault(),e.dataTransfer.dropEffect="move"}#D(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"before"}}))}#A(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"on"}}))}#I(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"after"}}))}};be=t})()})();
1
+ (()=>{"use strict";var e={84:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},122:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 11,17L 13,17L 19,11L 17,9L 12,14L 7,9L 5,11%27 fill=%27white%27 /></svg>"},273:(e,t,n)=>{n.d(t,{A:()=>y});var i=n(601),a=n.n(i),s=n(314),r=n.n(s),o=n(417),d=n.n(o),l=new URL(n(630),n.b),c=new URL(n(122),n.b),h=new URL(n(432),n.b),p=new URL(n(84),n.b),m=r()(a()),g=d()(l),u=d()(c),b=d()(h),v=d()(p);m.push([e.id,`:host {\n display: contents;\n --y: calc(var(--x) + 1);\n}\n\n.hide {\n display: none !important;\n}\n\n[part=iconButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n padding: 0;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n}\n\n[part=labelButton] {\n display: flex;\n background: transparent;\n border: 0;\n color: var(--pg-tree-item-color, #453C4F);\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n flex: 1;\n align-items: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n margin: -0.25rem -0.25rem -0.25rem -0.25rem;\n padding: 0 0.25rem 0 0.25rem;\n}\n\n[part=label] {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n}\n\n[part=input] {\n display: flex;\n font-family: var(--pg-font-family);\n font-size: var(--pg-tree-item-font-size, 1rem);\n border-radius: 0.125rem;\n flex: 1;\n outline: 0;\n padding: 0 0.25rem;\n margin: -0.125rem -0.625rem -0.125rem -0.25rem;\n border-width: var(--pg-tree-item-border-width, 0);\n border-style: solid;\n border-color: var(--pg-tree-item-border-color, #453C4F);\n}\n\n[part=item] {\n display: grid;\n background: var(--pg-tree-item-background, transparent);\n border-radius: 0.25rem;\n padding: 0.25rem;\n gap: 0 0.5rem;\n user-select: none;\n padding-left: calc((var(--x) * 0.5rem) + 0.25rem);\n transition: background-color 0.1s ease-out;\n}\n\n[part=item] {\n grid-template-columns: min-content min-content minmax(0, 1fr) min-content;\n grid-template-rows: auto;\n}\n[part=item] [part=selected] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=toggle] {\n grid-row: 1;\n grid-column: 1;\n}\n[part=item] [part=iconButton] {\n grid-row: 1;\n grid-column: 2;\n}\n[part=item] [part=labelButton] {\n grid-row: 1;\n grid-column: 3;\n}\n[part=item] [part=actions] {\n grid-row: 1;\n grid-column: 4;\n}\n[part=item] [part=dropabove] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-start;\n transform: translateY(-0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n[part=item] [part=dropon] {\n grid-row: 1;\n grid-column: 1 / 5;\n margin: 0.125rem -0.25rem;\n z-index: 1;\n}\n[part=item]:not(.items) [part=dropon] {\n display: none;\n}\n[part=item].items.expanded [part=dropbelow] {\n display: none;\n}\n[part=item] [part=dropbelow] {\n grid-row: 1;\n grid-column: 1 / 5;\n align-self: flex-end;\n transform: translateY(0.875rem);\n height: 1rem;\n margin: 0 -0.25rem 0 -0.25rem;\n z-index: 1;\n}\n\n[part=item]:not(.selected):not(.dragging):hover {\n background: var(--pg-tree-selected-secondary, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected:not(.dragging):hover {\n background: var(--pg-tree-selected-secondary-hover, rgb(69, 60, 79, 0.1));\n}\n[part=item].selected,\n[part=item].items.selected {\n background-color: var(--pg-tree-selected-secondary);\n}\n[part=item].items.selected:not(.expanded):not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${g}) !important;\n}\n\n[part=item].items.selected.expanded:not(.dragging) [part=toggle] {\n border-radius: 0.125rem;\n background-color: var(--pg-tree-selected-primary);\n background-image: url(${u}) !important;\n}\n\n[part=item].items [part=selected] {\n display: none;\n}\n\n[part=item]:not(.items) [part=selected] {\n visibility: hidden;\n display: flex;\n width: 1rem;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n border-radius: 0.125rem;\n background: var(--pg-tree-selected-primary);\n}\n\n[part=item]:not(.dragging):not(.items).selected [part=selected] {\n visibility: visible;\n}\n\n[part=actions] {\n display: flex;\n gap: 0.25rem;\n --pg-icon-color: var(--pg-tree-item-color, #453C4F);\n}\n\n[part=items] {\n display: none;\n flex-direction: column;\n --x: calc(var(--y) + 1);\n gap: 0.25rem;\n}\n[part=items].expanded {\n display: flex;\n}\n\n[part=toggle] {\n display: none;\n margin-left: -0.125rem;\n margin-right: -0.375rem;\n margin-top: -0.125rem;\n margin-bottom: -0.125rem;\n padding: 0 0 0 1rem;\n width: 1rem;\n border: 0;\n background-repeat: no-repeat;\n background-position: center;\n background-color: transparent;\n}\n\n[part=toggle]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}\n\n[part=item].items:not(.expanded) [part=toggle] {\n display: flex;\n background-image: url(${b});\n}\n\n[part=item].items.expanded [part=toggle] {\n display: flex;\n background-image: url(${v});\n}\n\n[part=dropabove].drop::before,\n[part=dropbelow].drop::before {\n content: ' ';\n height: 0.25rem;\n background-color: rgb(79, 143, 249);\n border-radius: 0.125rem;\n display: flex;\n margin-top: 0.375rem;\n}\n\n[part=dropon].drop {\n margin: -0.25rem !important;\n border: 4px solid rgb(79, 143, 249);\n border-radius: 0.25rem;\n}\n\n[part=item].dragging::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n border: 2px dashed rgb(79, 143, 249);\n}\n[part=items].dragging {\n --pg-_is-index-dragging: true;\n}\n[part=item].dragging [part=dropabove],\n[part=item].dragging [part=dropon],\n[part=item].dragging [part=dropbelow] {\n display: none;\n}\n\n@container style(--pg-_is-dragging: false) {\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n\n@container style(--pg-_is-index-dragging: true) {\n [part=item]::after {\n content: ' ';\n display: flex;\n grid-column: 1 / 5;\n grid-row: 1;\n border-radius: 0.25rem;\n background: rgba(255, 255, 255, 0.5);\n user-select: none;\n margin: -0.25rem;\n }\n [part=dropabove],\n [part=dropon],\n [part=dropbelow] {\n display: none;\n }\n}\n`,""]);var f=new CSSStyleSheet;f.replaceSync(m.toString());const y=f},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",i=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),i&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),i&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,i,a,s){"string"==typeof e&&(e=[[null,e,void 0]]);var r={};if(i)for(var o=0;o<this.length;o++){var d=this[o][0];null!=d&&(r[d]=!0)}for(var l=0;l<e.length;l++){var c=[].concat(e[l]);i&&r[c[0]]||(void 0!==s&&(void 0===c[5]||(c[1]="@layer".concat(c[5].length>0?" ".concat(c[5]):""," {").concat(c[1],"}")),c[5]=s),n&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=n):c[2]=n),a&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=a):c[4]="".concat(a)),t.push(c))}},t}},417:e=>{e.exports=function(e,t){return t||(t={}),e?(e=String(e.__esModule?e.default:e),/^['"].*['"]$/.test(e)&&(e=e.slice(1,-1)),t.hash&&(e+=t.hash),/["'() \t\n]|(%20)/.test(e)||t.needQuotes?'"'.concat(e.replace(/"/g,'\\"').replace(/\n/g,"\\n"),'"'):e):e}},432:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27rgb%2869 60 79%29%27 /></svg>"},513:(e,t,n)=>{n.d(t,{A:()=>d});var i=n(601),a=n.n(i),s=n(314),r=n.n(s)()(a());r.push([e.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n background: transparent;\n border: 0;\n padding: 0.125rem;\n margin: -0.125rem;\n border-radius: 0.125rem;\n}\n\n[part="button"]:hover {\n box-shadow: 0 0 0.125rem rgba(0, 0, 0, 0.25);\n background-color: rgba(255, 255, 255, 0.5);\n border-radius: 0.125rem;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(r.toString());const d=o},601:e=>{e.exports=function(e){return e[1]}},630:e=>{e.exports="data:image/svg+xml; utf8, <svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path d=%27M 17,13L 17,11L 11,5L 9,7L 14,12L 9,17L 11,19%27 fill=%27white%27 /></svg>"}},t={};function n(i){var a=t[i];if(void 0!==a)return a.exports;var s=t[i]={id:i,exports:{}};return e[i](s,s.exports,n),s.exports}n.m=e,n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.b="undefined"!=typeof document&&document.baseURI||self.location.href;const i=Symbol("addObserver"),a=Symbol("removeObserver"),s=Symbol("getObservers"),r=Symbol("swapObserver"),o=Symbol("isProxy"),d=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function h(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case o:return!0;case d:return t;case s:return c.has(e);case r:return(t,n)=>{const i=c.get(e);i.forEach(((a,s)=>{if(s.getRootNode().host===t){const t=i.get(s);c.has(n)?c.get(n).has(s)?c.get(n).get(s).push(i.get(s)):c.get(n).set(s,i.get(s)):c.set(n,new Map([[s,t]])),c.delete(e),t.forEach((e=>{e(null,p.swap,[n])}))}}))};case i:return(t,n)=>{c.has(e)?c.get(e).has(t)?c.get(e).get(t).push(n):c.get(e).set(t,[n]):c.set(e,new Map([[t,[n]]]))};case a:return t=>{c.has(e)&&(c.get(e).delete(t),0===c.get(e).size&&c.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?h(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(t)?function(){const e=Array.prototype[n].apply(t,arguments);return c.get(t).forEach(((e,i)=>{e.forEach((e=>{e(t,n,arguments)}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return h(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(c.has(e)){c.get(e).forEach(((e,i)=>{e.forEach((e=>{e(t,n)}))}))}return Reflect.set(e,t,n)}})}window.observers=c;const p={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const m=Symbol("init"),g=Symbol("template"),u=Symbol("style"),b=Symbol("parent");function v(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function f(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function y(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var i,a;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[b]||t.prototype[b][t.prototype[b].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[b]=[t.prototype],t.prototype[u]=e.style?[e.style]:[],t.prototype[g]=e.template||""):(t.prototype[b].push(t.prototype),t.prototype[u].push(e.style),t.prototype[g]=(i=t.prototype[g],(a=e.template||null)&&a.match(/<parent\/>/)?a.replace(/<parent\/>/,i):`${i}${a||""}`));const s=t.prototype.connectedCallback||(()=>{}),r=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[m]||void 0!==e.template||void 0!==e.style)if(this[m]){if(this[m]&&e.style);else if(this[m]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[g]||"";const n=document.importNode(e.content,!0),i=this.attachShadow({mode:"open"});i.adoptedStyleSheets=t.prototype[u].map((e=>{if(e instanceof CSSStyleSheet)return e;var t=new CSSStyleSheet;return t.replaceSync(e.toString()),t})),i.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const i=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),a=()=>{this[b].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[f(t)]=!0,e)),{}):{})}))};0===i.length?(this[m]=!0,s.call(this),a()):Promise.all(i).then((()=>{this[m]=!0,s.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));a()}))},t.prototype.disconnectedCallback=function(){r.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[f(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function w(e){return!!e&&e.constructor===Array}function x(e,t){e[m]&&e[b].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function $(e){return null===e?"null":w(e)?"array":typeof e}function E(e){return function(t,n){const i=n.name,a=Symbol(i),l=Symbol(`${i}:type`),c=Symbol(`${i}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,i,{get:()=>"object"===this[l]||"array"===this[l]?this[a][o]?this[a]:h(this[a]):this[a],set:t=>{const n=$(e?e(t):t);if("index"!==i&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${i} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!w(t))throw new PropError(`Array "${i}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,i)?.set);if(this[a]===t)throw new Error("Setting an array to itself is not allowed.");const e=h(this[a]);if(e[s]){const n=t[o]?t[d]:t;e[r](this,n),this[a]=t,console.log(">>> trigger render???",this,i)}else this[a]=t}else this[a]=e?e(t):t,x(this,i)}})})),function(t){if(void 0===t&&"index"!==i)throw new Error(`@Prop() ${i} must have an initial value defined.`);if(void 0!==t&&"index"===i)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${i} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=v(i);t[i]||(e.observedAttributes.push(n),t[i]=a)}return this[l]=$(t),"array"===this[l]?(this[a]=t,new Proxy(t,{get:(e,t)=>t===k?this[c]:(console.log("errr???"),Reflect.get(this[a],t)),set:(e,t,n)=>{if(t===k)return this[c]=n,!0;const s=Reflect.set(e,t,n);return"length"===t&&this[a].length===n||x(this,i),this[a]=n,s}})):(this[a]=e?e(this.getAttribute(i)??t):this.getAttribute(i)??t,this[a])}}}function L(){return function(e,t){const n=t.name,i=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${i}]`))}})}))}}Symbol("hasProxy");const k=Symbol("meta");function S({container:e,items:t,type:n,create:a,connect:s,disconnect:r,update:o}){function d(e,s){const r=n(e),o=document.createElement(v(r.name),r),d=r.observedAttributes??[],l=function(e,t){const n=new Set(e);return t.filter((e=>n.has(e)))}(Object.keys(e),d);return d.includes("index")&&(o.index=s),-1!==l.indexOf("index")&&l.splice(l.indexOf("index"),1),l.forEach((t=>{o[t]=e[t]})),a&&a(o,h(e)),t[s][i](o,((e,t)=>{o[e]=t})),o}t.forEach(((t,n)=>{const i=d(t,n);e.appendChild(i),s&&s(i,h(t))})),t[i](e,((n,i,a)=>{if(i===p.swap){const e=t.length;t=h(a[0]),i=p.splice,a=[0,e,...a[0]]}switch(i){case p.fill:const[n,i,o]=a;for(let a=i||0;a<(o||t.length);a++)Object.keys(n).forEach((t=>{e.children[a][t]=n[t]}));break;case p.pop:const l=e.children.length;l>0&&e.children[l-1].remove();break;case p.push:const c=e.children.length;[...a].forEach(((t,n)=>{const i=d(t,c+n);e.appendChild(i),s&&s(i,h(t))}));break;case p.reverse:for(var r=1;r<e.children.length;r++)e.insertBefore(e.children[r],e.children[0]);break;case p.shift:e.children.length&&e.children[0].remove();for(let t=0;t<e.children.length;t++)e.children[t].index=t;break;case p.sort:throw new Error("ToDo... write sort.");case p.splice:const[m,g,...u]=a;if(g>0)for(let t=m;t<g+m;t++)e.children[t].remove();let b=u.length||0;if(b>0){const t=u.map(((e,t)=>d(e,m+t)));0===m?e.prepend(...t):e.children[m-1].after(...t);for(let t=m-g+b;t<e.children.length;t++)e.children[t].index=t;t.forEach((e=>{s&&s(e,u[r])}))}else for(let t=m;t<e.children.length;t++)e.children[t].index=t;break;case p.unshift:const v=e.children.length&&e.children[0],f=[...a].length;[...a].forEach(((t,n)=>{v?v.before(d(t,n)):e.appendChild(d(t,n))}));for(let t=f;t<e.children.length;t++)e.children[t].index=t}}))}var C=n(513),D=function(e,t,n,i,a,s){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");s.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&a.unshift(o)}else(o=r(b))&&("field"===d?a.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},O=function(e,t,n){for(var i=arguments.length>2,a=0;a<t.length;a++)n=i?t[a].call(e,n):t[a].call(e);return i?n:void 0};const B=(()=>{let e,t,n,i,a,s,r=[y({selector:"pg-tree-button-icon",style:C.A,template:'<button part="button"> <pg-icon part="icon"></pg-icon> </button>'})],o=[],d=HTMLElement,l=[],c=[],h=[],p=[],m=[],g=[],u=[],b=[];(class extends d{static{t=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[E()],i=[E()],a=[L()],s=[L()],D(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:v},l,c),D(null,null,i,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:v},h,p),D(null,null,a,{kind:"field",name:"$button",static:!1,private:!1,access:{has:e=>"$button"in e,get:e=>e.$button,set:(e,t)=>{e.$button=t}},metadata:v},m,g),D(null,null,s,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:v},u,b),D(null,e={value:t},r,{kind:"class",name:t.name,metadata:v},null,o),t=e.value,v&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),O(t,o)}index=O(this,l,void 0);icon=(O(this,c),O(this,h,"M0 0h24v24H0V0zm2 2v20h20V2H2z"));$button=(O(this,p),O(this,m,void 0));$icon=(O(this,g),O(this,u,void 0));connectedCallback(){this.$button.addEventListener("click",this.#e.bind(this))}#e(e){this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{index:this.index}}))}render(e){e.icon&&(this.$icon.path=this.icon)}constructor(){super(...arguments),O(this,b)}});return t})();var A=n(273),P=function(e,t,n,i,a,s){function r(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var o,d=i.kind,l="getter"===d?"get":"setter"===d?"set":"value",c=!t&&e?i.static?e:e.prototype:null,h=t||(c?Object.getOwnPropertyDescriptor(c,i.name):{}),p=!1,m=n.length-1;m>=0;m--){var g={};for(var u in i)g[u]="access"===u?{}:i[u];for(var u in i.access)g.access[u]=i.access[u];g.addInitializer=function(e){if(p)throw new TypeError("Cannot add initializers after decoration has completed");s.push(r(e||null))};var b=(0,n[m])("accessor"===d?{get:h.get,set:h.set}:h[l],g);if("accessor"===d){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(o=r(b.get))&&(h.get=o),(o=r(b.set))&&(h.set=o),(o=r(b.init))&&a.unshift(o)}else(o=r(b))&&("field"===d?a.unshift(o):h[l]=o)}c&&Object.defineProperty(c,i.name,h),p=!0},T=function(e,t,n){for(var i=arguments.length>2,a=0;a<t.length;a++)n=i?t[a].call(e,n):t[a].call(e);return i?n:void 0};(()=>{let e,t,n,i,a,s,r,o,d,l,c,h,p,m,g,u,b,v,f,w,x,$=[y({selector:"pg-tree-item",style:A.A,template:'<div part="item" draggable="true"> <div part="selected"></div> <button part="toggle"></button> <button part="iconButton"> <pg-icon part="icon"></pg-icon> </button> <input part="input" type="text" class="hide"/> <button part="labelButton"> <span part="label"></span> </button> <div part="actions"></div> <div part="dropabove"></div> <div part="dropon"></div> <div part="dropbelow"></div> </div> <div part="items"></div>'})],k=[],C=HTMLElement,D=[],O=[],I=[],R=[],z=[],j=[],M=[],K=[],F=[],U=[],N=[],H=[],_=[],V=[],q=[],Y=[],W=[],Z=[],Q=[],G=[],J=[],X=[],ee=[],te=[],ne=[],ie=[],ae=[],se=[],re=[],oe=[],de=[],le=[],ce=[],he=[],pe=[],me=[],ge=[],ue=[];var be=class extends C{static{t=this}static{const y="function"==typeof Symbol&&Symbol.metadata?Object.create(C[Symbol.metadata]??null):void 0;n=[E()],i=[E()],a=[E()],s=[E()],r=[E()],o=[E()],d=[E()],l=[L()],c=[L()],h=[L()],p=[L()],m=[L()],g=[L()],u=[L()],b=[L()],v=[L()],f=[L()],w=[L()],x=[L()],P(null,null,n,{kind:"field",name:"index",static:!1,private:!1,access:{has:e=>"index"in e,get:e=>e.index,set:(e,t)=>{e.index=t}},metadata:y},D,O),P(null,null,i,{kind:"field",name:"label",static:!1,private:!1,access:{has:e=>"label"in e,get:e=>e.label,set:(e,t)=>{e.label=t}},metadata:y},I,R),P(null,null,a,{kind:"field",name:"selected",static:!1,private:!1,access:{has:e=>"selected"in e,get:e=>e.selected,set:(e,t)=>{e.selected=t}},metadata:y},z,j),P(null,null,s,{kind:"field",name:"expanded",static:!1,private:!1,access:{has:e=>"expanded"in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:y},M,K),P(null,null,r,{kind:"field",name:"icon",static:!1,private:!1,access:{has:e=>"icon"in e,get:e=>e.icon,set:(e,t)=>{e.icon=t}},metadata:y},F,U),P(null,null,o,{kind:"field",name:"actions",static:!1,private:!1,access:{has:e=>"actions"in e,get:e=>e.actions,set:(e,t)=>{e.actions=t}},metadata:y},N,H),P(null,null,d,{kind:"field",name:"items",static:!1,private:!1,access:{has:e=>"items"in e,get:e=>e.items,set:(e,t)=>{e.items=t}},metadata:y},_,V),P(null,null,l,{kind:"field",name:"$toggle",static:!1,private:!1,access:{has:e=>"$toggle"in e,get:e=>e.$toggle,set:(e,t)=>{e.$toggle=t}},metadata:y},q,Y),P(null,null,c,{kind:"field",name:"$item",static:!1,private:!1,access:{has:e=>"$item"in e,get:e=>e.$item,set:(e,t)=>{e.$item=t}},metadata:y},W,Z),P(null,null,h,{kind:"field",name:"$input",static:!1,private:!1,access:{has:e=>"$input"in e,get:e=>e.$input,set:(e,t)=>{e.$input=t}},metadata:y},Q,G),P(null,null,p,{kind:"field",name:"$iconButton",static:!1,private:!1,access:{has:e=>"$iconButton"in e,get:e=>e.$iconButton,set:(e,t)=>{e.$iconButton=t}},metadata:y},J,X),P(null,null,m,{kind:"field",name:"$icon",static:!1,private:!1,access:{has:e=>"$icon"in e,get:e=>e.$icon,set:(e,t)=>{e.$icon=t}},metadata:y},ee,te),P(null,null,g,{kind:"field",name:"$label",static:!1,private:!1,access:{has:e=>"$label"in e,get:e=>e.$label,set:(e,t)=>{e.$label=t}},metadata:y},ne,ie),P(null,null,u,{kind:"field",name:"$labelButton",static:!1,private:!1,access:{has:e=>"$labelButton"in e,get:e=>e.$labelButton,set:(e,t)=>{e.$labelButton=t}},metadata:y},ae,se),P(null,null,b,{kind:"field",name:"$actions",static:!1,private:!1,access:{has:e=>"$actions"in e,get:e=>e.$actions,set:(e,t)=>{e.$actions=t}},metadata:y},re,oe),P(null,null,v,{kind:"field",name:"$items",static:!1,private:!1,access:{has:e=>"$items"in e,get:e=>e.$items,set:(e,t)=>{e.$items=t}},metadata:y},de,le),P(null,null,f,{kind:"field",name:"$dropabove",static:!1,private:!1,access:{has:e=>"$dropabove"in e,get:e=>e.$dropabove,set:(e,t)=>{e.$dropabove=t}},metadata:y},ce,he),P(null,null,w,{kind:"field",name:"$dropon",static:!1,private:!1,access:{has:e=>"$dropon"in e,get:e=>e.$dropon,set:(e,t)=>{e.$dropon=t}},metadata:y},pe,me),P(null,null,x,{kind:"field",name:"$dropbelow",static:!1,private:!1,access:{has:e=>"$dropbelow"in e,get:e=>e.$dropbelow,set:(e,t)=>{e.$dropbelow=t}},metadata:y},ge,ue),P(null,e={value:t},$,{kind:"class",name:t.name,metadata:y},null,k),be=t=e.value,y&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:y}),T(t,k)}index=T(this,D,void 0);label=(T(this,O),T(this,I,""));selected=(T(this,R),T(this,z,!1));expanded=(T(this,j),T(this,M,!1));icon=(T(this,K),T(this,F,{path:"M0 0h24v24H0V0zm2 2v20h20V2H2z"}));actions=(T(this,U),T(this,N,[]));items=(T(this,H),T(this,_,[]));$toggle=(T(this,V),T(this,q,void 0));$item=(T(this,Y),T(this,W,void 0));$input=(T(this,Z),T(this,Q,void 0));$iconButton=(T(this,G),T(this,J,void 0));$icon=(T(this,X),T(this,ee,void 0));$label=(T(this,te),T(this,ne,void 0));$labelButton=(T(this,ie),T(this,ae,void 0));$actions=(T(this,se),T(this,re,void 0));$items=(T(this,oe),T(this,de,void 0));$dropabove=(T(this,le),T(this,ce,void 0));$dropon=(T(this,he),T(this,pe,void 0));$dropbelow=(T(this,me),T(this,ge,void 0));connectedCallback(){this.$toggle.addEventListener("click",this.#t.bind(this)),this.$item.addEventListener("action",this.#n.bind(this)),this.$item.addEventListener("pointerenter",this.#i.bind(this)),this.$item.addEventListener("pointerleave",this.#a.bind(this)),this.$item.addEventListener("dragstart",this.#s.bind(this)),this.$item.addEventListener("dragend",this.#r.bind(this)),this.$labelButton.addEventListener("dblclick",this.#o.bind(this)),this.$labelButton.addEventListener("click",this.#e.bind(this)),this.$labelButton.addEventListener("keydown",this.#d.bind(this)),this.$iconButton.addEventListener("dblclick",this.#l.bind(this)),this.$iconButton.addEventListener("click",this.#c.bind(this)),this.$iconButton.addEventListener("keydown",this.#h.bind(this)),this.$item.addEventListener("contextmenu",this.#p.bind(this)),this.$input.addEventListener("blur",this.#m.bind(this)),this.$input.addEventListener("keydown",this.#g.bind(this)),this.$items.addEventListener("action",this.#u.bind(this)),this.$items.addEventListener("move",this.#b.bind(this)),this.$items.addEventListener("toggle",this.#v.bind(this)),this.$items.addEventListener("select",this.#f.bind(this)),this.$items.addEventListener("rename",this.#y.bind(this)),this.$items.addEventListener("up",this.#w.bind(this)),this.$items.addEventListener("down",this.#x.bind(this)),this.$items.addEventListener("itemdragstart",this.#$.bind(this)),this.$items.addEventListener("itemdragend",this.#E.bind(this)),this.$items.addEventListener("itemdropenter",this.#L.bind(this)),this.$dropabove.addEventListener("dragenter",this.#k.bind(this)),this.$dropabove.addEventListener("dragleave",this.#S.bind(this)),this.$dropabove.addEventListener("dragover",this.#C.bind(this)),this.$dropabove.addEventListener("drop",this.#D.bind(this)),this.$dropon.addEventListener("dragenter",this.#O.bind(this)),this.$dropon.addEventListener("dragleave",this.#B.bind(this)),this.$dropon.addEventListener("dragover",this.#C.bind(this)),this.$dropon.addEventListener("drop",this.#A.bind(this)),this.$dropbelow.addEventListener("dragenter",this.#P.bind(this)),this.$dropbelow.addEventListener("dragleave",this.#T.bind(this)),this.$dropbelow.addEventListener("dragover",this.#C.bind(this)),this.$dropbelow.addEventListener("drop",this.#I.bind(this)),S({container:this.$actions,items:this.actions,type:e=>B}),this.expanded&&this.#R()}disconnectedCallback(){console.log("disconnect",this.index)}#z=(T(this,ue),!0);#R(){this.#z&&(S({container:this.$items,items:this.items,type:e=>be}),this.#z=!1)}render(e){e.label&&(this.$label.textContent=this.label),e.icon&&this.icon&&(this.$icon.path=this.icon.path),e.selected&&this.$item.classList.toggle("selected",this.selected),e.items&&this.$item.classList.toggle("items",0!==this.items.length),e.expanded&&(this.expanded&&this.#R(),this.$item.classList.toggle("expanded",this.expanded),this.$items.classList.toggle("expanded",this.expanded))}#t(){this.dispatchEvent(new CustomEvent("toggle",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#l(e){const{ctrlKey:t,shiftKey:n}=e;t||n||this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icondoubleclick",indexes:[this.index]}}))}#c(){this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"icon",indexes:[this.index]}}))}#e(e){if(this.#j)return void(this.#j=!1);const{ctrlKey:t,shiftKey:n}=e;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"label",indexes:[this.index],ctrlKey:t,shiftKey:n}}))}#d(e){"Enter"===e.key&&(this.#M(),e.preventDefault())}#i(){this.dispatchEvent(new CustomEvent("enter",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#a(){this.dispatchEvent(new CustomEvent("leave",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}}))}#n(e){e.stopPropagation(),this.dispatchEvent(new CustomEvent("action",{bubbles:!0,composed:!0,detail:{indexes:[this.index],actionIndex:e.detail.index}}))}#u(e){e.detail.indexes.unshift(this.index)}#b(e){e.detail.indexes.unshift(this.index)}#v(e){e.detail.indexes.unshift(this.index)}#y(e){e.detail.indexes.unshift(this.index)}#w(e){e.detail.indexes.unshift(this.index)}#x(e){e.detail.indexes.unshift(this.index)}#f(e){e.detail.indexes.unshift(this.index)}#L(e){e.detail.indexes.unshift(this.index)}#p(e){e.preventDefault()}#M(){this.$labelButton.classList.add("hide"),this.$actions.classList.add("hide"),this.$input.classList.remove("hide"),this.$input.value=this.label,this.$input.select(),this.#j=!0,this.dispatchEvent(new CustomEvent("select",{bubbles:!0,composed:!0,detail:{type:"rename",indexes:[this.index]}}))}#j=!1;#o(e){const{ctrlKey:t,shiftKey:n}=e;t||n||(this.#M(),e.preventDefault())}#m(){this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$labelButton.click(),this.dispatchEvent(new CustomEvent("rename",{bubbles:!0,composed:!0,detail:{indexes:[this.index],label:this.$input.value}}))}#h(e){switch(e.key){case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),e.preventDefault()}}#g(e){switch(e.key){case"Enter":this.#m();break;case"Escape":this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),this.$input.value=this.label,this.$labelButton.click();break;case"ArrowUp":this.dispatchEvent(new CustomEvent("up",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault();break;case"ArrowDown":this.dispatchEvent(new CustomEvent("down",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$labelButton.classList.remove("hide"),this.$actions.classList.remove("hide"),this.$input.classList.add("hide"),e.preventDefault()}}#K;#s(e){let t=0;this.dispatchEvent(new CustomEvent("itemdragstart",{bubbles:!0,composed:!0,detail:{ctrlKey:e.ctrlKey,shiftKey:e.shiftKey,indexes:[this.index],callback:e=>{t=e}}})),this.$item.classList.toggle("dragging",!0),this.$items.classList.toggle("dragging",!0);const n=window.devicePixelRatio,i=document.createElement("canvas");document.body.append(i),i.width=100*n,i.height=40*n,i.style.width=i.width/n+"px";var a=i.getContext("2d");if(a){const e=`${t}`;a.font=`bold ${16*n}px Segoe UI`;const i=a.measureText(e);a.fillStyle="#453C4F",a.beginPath(),a.roundRect(20*n,0,(i.width+12)*n,28*n,8+2*n),a.fill(),a.fillStyle="#FFF",a.beginPath(),a.roundRect(22*n,2*n,(i.width+12-4)*n,24*n,8),a.fill(),a.fillStyle="#453C4F",a.fillText(e,30*n,20*n)}e.dataTransfer.setDragImage(i,0,0),this.#K=i}#r(e){this.dispatchEvent(new CustomEvent("itemdragend",{bubbles:!0,composed:!0,detail:{indexes:[this.index]}})),this.$item.classList.toggle("dragging",!1),this.$items.classList.toggle("dragging",!1),this.#K.remove()}#$(e){e.detail.indexes.unshift(this.index)}#E(e){e.detail.indexes.unshift(this.index)}#k(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),e.dataTransfer.setData("text","test"),e.dataTransfer.effectAllowed="move"}#S(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#F;#O(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0),this.#F=setTimeout((()=>{this.#t()}),1500)}#B(e){clearTimeout(this.#F),console.log("darg leave"),e.target.classList.toggle("drop",!1)}#P(e){this.dispatchEvent(new CustomEvent("itemdropenter",{bubbles:!0,composed:!0,detail:{indexes:[this.index],callback:t=>{t&&(e.dataTransfer.dropEffect="move")}}})),e.target.classList.toggle("drop",!0)}#T(e){console.log("darg leave"),e.target.classList.toggle("drop",!1)}#C(e){e.preventDefault(),e.dataTransfer.dropEffect="move"}#D(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"before"}}))}#A(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"on"}}))}#I(e){e.target.classList.toggle("drop",!1),this.dispatchEvent(new CustomEvent("move",{bubbles:!0,composed:!0,detail:{indexes:[this.index],position:"after"}}))}};be=t})()})();