@pictogrammers/components 0.4.3 → 0.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/package.json +1 -1
  2. package/pg/button/button.css +2 -2
  3. package/pg/inputPixelEditor/inputPixelEditor.ts +0 -2
  4. package/pgButton.js +1 -1
  5. package/pgButtonMenu.js +1 -1
  6. package/pgButtonToggle.js +1 -1
  7. package/pgInputPixelEditor.js +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pictogrammers/components",
3
3
  "type": "module",
4
- "version": "0.4.3",
4
+ "version": "0.4.4",
5
5
  "license": "MIT",
6
6
  "author": "Austin Andrews",
7
7
  "scripts": {
package/pg/button/button.css CHANGED
@@ -30,7 +30,7 @@
30
30
  position: relative;
31
31
  }
32
32
 
33
- [part="button"]:focus {
33
+ [part="button"]:focus-visible {
34
34
  position: relative;
35
35
  }
36
36
 
@@ -44,7 +44,7 @@
44
44
  border-radius: var(--pg-button-border-radius, 0.25rem);
45
45
  box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));
46
46
  }
47
- [part="button"]:focus::before {
47
+ [part="button"]:focus-visible::before {
48
48
  pointer-events: none;
49
49
  content: '';
50
50
  position: absolute;
package/pg/inputPixelEditor/inputPixelEditor.ts CHANGED
@@ -435,7 +435,6 @@ export default class PgInputPixelEditor extends HTMLElement {
435
435
  switch (this.#inputMode) {
436
436
  case InputMode.Pixel:
437
437
  this.#setPixel(newX, newY, color);
438
- this.#data[this.#layer][newY][newX] = color;
439
438
  break;
440
439
  }
441
440
  console.log(this.#inputMode, newX, newY);
@@ -562,7 +561,6 @@ export default class PgInputPixelEditor extends HTMLElement {
562
561
  case InputMode.Pixel:
563
562
  for (var point of points) {
564
563
  this.#setPixel(point[0], point[1], color);
565
- data[this.#layer][point[1]][point[0]] = color;
566
564
  }
567
565
  break;
568
566
  case InputMode.Line:
package/pgButton.js CHANGED
@@ -1 +1 @@
1
- (()=>{"use strict";var t={119:(t,e,n)=>{n.d(e,{A:()=>c});var r=n(601),o=n.n(r),a=n(314),i=n.n(a)()(o());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const c=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",r=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),r&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),r&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,r,o,a){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(r)for(var s=0;s<this.length;s++){var c=this[s][0];null!=c&&(i[c]=!0)}for(var l=0;l<t.length;l++){var u=[].concat(t[l]);r&&i[u[0]]||(void 0!==a&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=a),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}}},e={};function n(r){var o=e[r];if(void 0!==o)return o.exports;var a=e[r]={id:r,exports:{}};return t[r](a,a.exports,n),a.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var r in e)n.o(e,r)&&!n.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const r=Symbol("addObserver"),o=Symbol("removeObserver"),a=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),c=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case a:return l.has(t);case r:return(e,n)=>{l.has(t)?l.get(t).has(e)?l.get(t).get(e).push(n):l.get(t).set(e,[n]):l.set(t,new Map([[e,[n]]]))};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,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(c.includes(n))return l.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return l.get(e).forEach(((t,r)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(l.has(t)){l.get(t).forEach(((t,r)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}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"),b=Symbol("parent");function f(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 g(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var r,o;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[b]||e.prototype[b][e.prototype[b].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[b]=[e.prototype],e.prototype[h]=t.style?[t.style]:[],e.prototype[d]=t.template||""):(e.prototype[b].push(e.prototype),e.prototype[h].push(t.style),e.prototype[d]=(r=e.prototype[d],(o=t.template||null)&&o.match(/<parent\/>/)?o.replace(/<parent\/>/,r):`${r}${o||""}`));const a=e.prototype.connectedCallback||(()=>{}),i=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 n=document.importNode(t.content,!0),r=this.attachShadow({mode:"open"});r.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),r.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const r=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),o=()=>{this[b].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[m(e)]=!0,t)),{}):{})}))};0===r.length?(this[p]=!0,a.call(this),o()):Promise.all(r).then((()=>{this[p]=!0,a.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));o()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[m(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function y(t){return!!t&&t.constructor===Array}function v(t,e){t[p]&&t[b].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":y(t)?"array":typeof t}function S(t){return function(e,n){const r=n.name,o=Symbol(r),c=Symbol(`${r}:type`),l=Symbol(`${r}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,r,{get:()=>"object"===this[c]||"array"===this[c]?this[o][i]?this[o]:u(this[o]):this[o],set:e=>{const n=w(t?t(e):e);if("index"!==r&&this[c]!==n&&"null"!==this[c]&&"null"!==n)throw new Error(`@Prop() ${r} with type '${this[c]}' cannot be set to ${n}.`);if("array"===this[c]){if(!y(e))throw new PropError(`Array "${r}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,r)?.set);if(this[o]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[o]);if(t[a]){const n=e[i]?(l=e)[i]&&l[s]:e;t.splice(0,this[o].length,...n)}else this[o]=e}else this[o]=t?t(e):e,v(this,r);var l}})})),function(e){if(void 0===e&&"index"!==r)throw new Error(`@Prop() ${r} must have an initial value defined.`);if(void 0!==e&&"index"===r)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${r} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=f(r);e[r]||(t.observedAttributes.push(n),e[r]=o)}return this[c]=w(e),"array"===this[c]?(this[o]=e,new Proxy(e,{get:(t,e)=>e===$?this[l]:(console.log("errr???"),Reflect.get(this[o],e)),set:(t,e,n)=>{if(e===$)return this[l]=n,!0;const a=Reflect.set(t,e,n);return"length"===e&&this[o].length===n||v(this,r),this[o]=n,a}})):(this[o]=t?t(this.getAttribute(r)??e):this.getAttribute(r)??e,this[o])}}}function x(){return function(t,e){const n=e.name,r=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${r}]`))}})}))}}function E(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const $=Symbol("meta");var k=n(119),C=function(t,e,n,r,o,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,c=r.kind,l="getter"===c?"get":"setter"===c?"set":"value",u=!e&&t?r.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,r.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in r)b[f]="access"===f?{}:r[f];for(var f in r.access)b.access[f]=r.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===c?{get:p.get,set:p.set}:p[l],b);if("accessor"===c){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&o.unshift(s)}else(s=i(m))&&("field"===c?o.unshift(s):p[l]=s)}u&&Object.defineProperty(u,r.name,p),d=!0},F=function(t,e,n){for(var r=arguments.length>2,o=0;o<e.length;o++)n=r?e[o].call(t,n):e[o].call(t);return r?n:void 0};(()=>{let t,e,n,r,o,a,i,s,c,l,u=[g({selector:"pg-button",style:k.A,template:'<button part="button"> <slot></slot> </button>'})],p=[],d=HTMLElement,h=[],b=[],f=[],m=[],y=[],v=[],w=[],$=[],P=[],A=[],O=[],R=[],j=[],z=[],L=[],T=[];(class extends d{static{e=this}static{const g="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S(E)],r=[S(E)],o=[S(E)],a=[S(E)],i=[S(E)],s=[x()],c=[x()],l=[x()],C(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:g},h,b),C(null,null,r,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:g},f,m),C(null,null,o,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:g},y,v),C(null,null,a,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:g},w,$),C(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:g},P,A),C(null,null,s,{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:g},O,R),C(null,null,c,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:g},j,z),C(null,null,l,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:g},L,T),C(null,t={value:e},u,{kind:"class",name:e.name,metadata:g},null,p),e=t.value,g&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:g}),F(e,p)}active=F(this,h,!1);block=(F(this,b),F(this,f,!1));start=(F(this,m),F(this,y,!1));center=(F(this,v),F(this,w,!1));end=(F(this,$),F(this,P,!1));$button=(F(this,A),F(this,O,void 0));$number=(F(this,R),F(this,j,void 0));$bar=(F(this,z),F(this,L,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),F(this,T)}})})()})();
1
+ (()=>{"use strict";var t={119:(t,e,n)=>{n.d(e,{A:()=>l});var r=n(601),o=n.n(r),a=n(314),i=n.n(a)()(o());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus-visible {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus-visible::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",r=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),r&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),r&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,r,o,a){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(r)for(var s=0;s<this.length;s++){var l=this[s][0];null!=l&&(i[l]=!0)}for(var c=0;c<t.length;c++){var u=[].concat(t[c]);r&&i[u[0]]||(void 0!==a&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=a),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}}},e={};function n(r){var o=e[r];if(void 0!==o)return o.exports;var a=e[r]={id:r,exports:{}};return t[r](a,a.exports,n),a.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var r in e)n.o(e,r)&&!n.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const r=Symbol("addObserver"),o=Symbol("removeObserver"),a=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case a:return c.has(t);case r:return(e,n)=>{c.has(t)?c.get(t).has(e)?c.get(t).get(e).push(n):c.get(t).set(e,[n]):c.set(t,new Map([[e,[n]]]))};case o:return e=>{c.has(t)&&(c.get(t).delete(e),0===c.get(t).size&&c.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return c.get(e).forEach(((t,r)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(c.has(t)){c.get(t).forEach(((t,r)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}window.observers=c;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"),b=Symbol("parent");function f(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 g(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var r,o;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[b]||e.prototype[b][e.prototype[b].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[b]=[e.prototype],e.prototype[h]=t.style?[t.style]:[],e.prototype[d]=t.template||""):(e.prototype[b].push(e.prototype),e.prototype[h].push(t.style),e.prototype[d]=(r=e.prototype[d],(o=t.template||null)&&o.match(/<parent\/>/)?o.replace(/<parent\/>/,r):`${r}${o||""}`));const a=e.prototype.connectedCallback||(()=>{}),i=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 n=document.importNode(t.content,!0),r=this.attachShadow({mode:"open"});r.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),r.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const r=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),o=()=>{this[b].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[m(e)]=!0,t)),{}):{})}))};0===r.length?(this[p]=!0,a.call(this),o()):Promise.all(r).then((()=>{this[p]=!0,a.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));o()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[m(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function y(t){return!!t&&t.constructor===Array}function v(t,e){t[p]&&t[b].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":y(t)?"array":typeof t}function S(t){return function(e,n){const r=n.name,o=Symbol(r),l=Symbol(`${r}:type`),c=Symbol(`${r}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,r,{get:()=>"object"===this[l]||"array"===this[l]?this[o][i]?this[o]:u(this[o]):this[o],set:e=>{const n=w(t?t(e):e);if("index"!==r&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${r} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!y(e))throw new PropError(`Array "${r}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,r)?.set);if(this[o]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[o]);if(t[a]){const n=e[i]?(c=e)[i]&&c[s]:e;t.splice(0,this[o].length,...n)}else this[o]=e}else this[o]=t?t(e):e,v(this,r);var c}})})),function(e){if(void 0===e&&"index"!==r)throw new Error(`@Prop() ${r} must have an initial value defined.`);if(void 0!==e&&"index"===r)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${r} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=f(r);e[r]||(t.observedAttributes.push(n),e[r]=o)}return this[l]=w(e),"array"===this[l]?(this[o]=e,new Proxy(e,{get:(t,e)=>e===$?this[c]:(console.log("errr???"),Reflect.get(this[o],e)),set:(t,e,n)=>{if(e===$)return this[c]=n,!0;const a=Reflect.set(t,e,n);return"length"===e&&this[o].length===n||v(this,r),this[o]=n,a}})):(this[o]=t?t(this.getAttribute(r)??e):this.getAttribute(r)??e,this[o])}}}function x(){return function(t,e){const n=e.name,r=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${r}]`))}})}))}}function E(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const $=Symbol("meta");var k=n(119),C=function(t,e,n,r,o,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=r.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?r.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,r.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in r)b[f]="access"===f?{}:r[f];for(var f in r.access)b.access[f]=r.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===l?{get:p.get,set:p.set}:p[c],b);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&o.unshift(s)}else(s=i(m))&&("field"===l?o.unshift(s):p[c]=s)}u&&Object.defineProperty(u,r.name,p),d=!0},F=function(t,e,n){for(var r=arguments.length>2,o=0;o<e.length;o++)n=r?e[o].call(t,n):e[o].call(t);return r?n:void 0};(()=>{let t,e,n,r,o,a,i,s,l,c,u=[g({selector:"pg-button",style:k.A,template:'<button part="button"> <slot></slot> </button>'})],p=[],d=HTMLElement,h=[],b=[],f=[],m=[],y=[],v=[],w=[],$=[],P=[],A=[],O=[],R=[],j=[],z=[],L=[],T=[];(class extends d{static{e=this}static{const g="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S(E)],r=[S(E)],o=[S(E)],a=[S(E)],i=[S(E)],s=[x()],l=[x()],c=[x()],C(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:g},h,b),C(null,null,r,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:g},f,m),C(null,null,o,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:g},y,v),C(null,null,a,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:g},w,$),C(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:g},P,A),C(null,null,s,{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:g},O,R),C(null,null,l,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:g},j,z),C(null,null,c,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:g},L,T),C(null,t={value:e},u,{kind:"class",name:e.name,metadata:g},null,p),e=t.value,g&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:g}),F(e,p)}active=F(this,h,!1);block=(F(this,b),F(this,f,!1));start=(F(this,m),F(this,y,!1));center=(F(this,v),F(this,w,!1));end=(F(this,$),F(this,P,!1));$button=(F(this,A),F(this,O,void 0));$number=(F(this,R),F(this,j,void 0));$bar=(F(this,z),F(this,L,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),F(this,T)}})})()})();
package/pgButtonMenu.js CHANGED
@@ -1 +1 @@
1
- (()=>{"use strict";var t={119:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",a=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),a&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),a&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,a,r,o){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(a)for(var s=0;s<this.length;s++){var l=this[s][0];null!=l&&(i[l]=!0)}for(var c=0;c<t.length;c++){var u=[].concat(t[c]);a&&i[u[0]]||(void 0!==o&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=o),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),r&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=r):u[4]="".concat(r)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}},685:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,":host {\n display: inline-flex;\n}\n\nspan {\n align-self: center;\n display: flex;\n}\n\n[part=collapse] {\n display: none;\n}",""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},697:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="overlay"] {\n margin: 0;\n padding: 0;\n border: 0;\n background: transparent;\n --pg-menu-box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.25);\n top: calc(anchor(bottom) - 0.25rem);\n left: anchor(left);\n min-width: calc(anchor-size(width) + calc(2 * var(--pg-menu-padding, 0.25rem)));\n translate: var(--pg-overlay-menu-_x, 0) var(--pg-overlay-menu-_y, 0);\n overflow: visible;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s}},e={};function n(a){var r=e[a];if(void 0!==r)return r.exports;var o=e[a]={id:a,exports:{}};return t[a](o,o.exports,n),o.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var a in e)n.o(e,a)&&!n.o(t,a)&&Object.defineProperty(t,a,{enumerable:!0,get:e[a]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const a=Symbol("addObserver"),r=Symbol("removeObserver"),o=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case o:return c.has(t);case a:return(e,n)=>{c.has(t)?c.get(t).has(e)?c.get(t).get(e).push(n):c.get(t).set(e,[n]):c.set(t,new Map([[e,[n]]]))};case r:return e=>{c.has(t)&&(c.get(t).delete(e),0===c.get(t).size&&c.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return c.get(e).forEach(((t,a)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(c.has(t)){c.get(t).forEach(((t,a)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}window.observers=c;class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),p=Symbol("template"),h=Symbol("style"),f=Symbol("parent");function m(t){return t.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function b(t){return t.replace(/-([a-z])/g,(t=>t[1].toUpperCase()))}function v(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var a,r;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[p]=t.template||""):(e.prototype[f].push(e.prototype),e.prototype[h].push(t.style),e.prototype[p]=(a=e.prototype[p],(r=t.template||null)&&r.match(/<parent\/>/)?r.replace(/<parent\/>/,a):`${a}${r||""}`));const o=e.prototype.connectedCallback||(()=>{}),i=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[p]||"";const n=document.importNode(t.content,!0),a=this.attachShadow({mode:"open"});a.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),a.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const a=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),r=()=>{this[f].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[b(e)]=!0,t)),{}):{})}))};0===a.length?(this[d]=!0,o.call(this),r()):Promise.all(a).then((()=>{this[d]=!0,o.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));r()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[b(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function g(t){return!!t&&t.constructor===Array}function y(t,e){t[d]&&t[f].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":g(t)?"array":typeof t}function S(t){return function(e,n){const a=n.name,r=Symbol(a),l=Symbol(`${a}:type`),c=Symbol(`${a}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,a,{get:()=>"object"===this[l]||"array"===this[l]?this[r][i]?this[r]:u(this[r]):this[r],set:e=>{const n=w(t?t(e):e);if("index"!==a&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${a} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!g(e))throw new PropError(`Array "${a}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,a)?.set);if(this[r]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[r]);if(t[o]){const n=e[i]?(c=e)[i]&&c[s]:e;t.splice(0,this[r].length,...n)}else this[r]=e}else this[r]=t?t(e):e,y(this,a);var c}})})),function(e){if(void 0===e&&"index"!==a)throw new Error(`@Prop() ${a} must have an initial value defined.`);if(void 0!==e&&"index"===a)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${a} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=m(a);e[a]||(t.observedAttributes.push(n),e[a]=r)}return this[l]=w(e),"array"===this[l]?(this[r]=e,new Proxy(e,{get:(t,e)=>e===x?this[c]:(console.log("errr???"),Reflect.get(this[r],e)),set:(t,e,n)=>{if(e===x)return this[c]=n,!0;const o=Reflect.set(t,e,n);return"length"===e&&this[r].length===n||y(this,a),this[r]=n,o}})):(this[r]=t?t(this.getAttribute(a)??e):this.getAttribute(a)??e,this[r])}}}function $(){return function(t,e){const n=e.name,a=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${a}]`))}})}))}}function k(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const x=Symbol("meta");var E=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},O=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};const C=new Set,P=new Map;const j=(()=>{let t,e,n=[v()],a=[],r=HTMLElement;(class extends r{static{e=this}static{const o="function"==typeof Symbol&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;E(null,t={value:e},n,{kind:"class",name:e.name,metadata:o},null,a),e=t.value,o&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:o}),O(e,a)}static open(t={}){var e=document.createElement(this.name);return Object.assign(e,t),document.body.appendChild(e),C.add(e),new Promise((t=>{P.set(e,t)}))}close(t){this.remove(),C.delete(this);const e=P.get(this);e&&e(t),P.delete(this)}});return e})();var L=n(697),F=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},A=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};let T=(()=>{let t,e,n,a,r,o,i,s,l=[v({selector:"pg-overlay-menu",template:'<div part="overlay"> <pg-menu part="menu"></pg-menu> </div>',style:L.A})],c=[],u=j,d=[],p=[],h=[],f=[],m=[],b=[],g=[],y=[],w=[],k=[],x=[],E=[];(class extends u{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(u[Symbol.metadata]??null):void 0;n=[$()],a=[$()],r=[S()],o=[S()],i=[S()],s=[S()],F(null,null,n,{kind:"field",name:"$overlay",static:!1,private:!1,access:{has:t=>"$overlay"in t,get:t=>t.$overlay,set:(t,e)=>{t.$overlay=e}},metadata:v},d,p),F(null,null,a,{kind:"field",name:"$menu",static:!1,private:!1,access:{has:t=>"$menu"in t,get:t=>t.$menu,set:(t,e)=>{t.$menu=e}},metadata:v},h,f),F(null,null,r,{kind:"field",name:"source",static:!1,private:!1,access:{has:t=>"source"in t,get:t=>t.source,set:(t,e)=>{t.source=e}},metadata:v},m,b),F(null,null,o,{kind:"field",name:"default",static:!1,private:!1,access:{has:t=>"default"in t,get:t=>t.default,set:(t,e)=>{t.default=e}},metadata:v},g,y),F(null,null,i,{kind:"field",name:"items",static:!1,private:!1,access:{has:t=>"items"in t,get:t=>t.items,set:(t,e)=>{t.items=e}},metadata:v},w,k),F(null,null,s,{kind:"field",name:"value",static:!1,private:!1,access:{has:t=>"value"in t,get:t=>t.value,set:(t,e)=>{t.value=e}},metadata:v},x,E),F(null,t={value:e},l,{kind:"class",name:e.name,metadata:v},null,c),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),A(e,c)}$overlay=A(this,d,void 0);$menu=(A(this,p),A(this,h,void 0));source=(A(this,f),A(this,m,null));default=(A(this,b),A(this,g,null));items=(A(this,y),A(this,w,[]));value=(A(this,k),A(this,x,null));render(t){}connectedCallback(){this.$menu.items=this.items,this.$menu.addEventListener("select",this.#t.bind(this)),this.$overlay.popover="auto",null!==this.source&&this.$overlay.showPopover({source:this.source}),this.$overlay.addEventListener("toggle",this.#e.bind(this));this.source?.getBoundingClientRect();const t=null===this.value||"object"!=typeof this.value?this.value:this.value.value,e=null===this.value?0:this.items.findIndex((e=>e.value===t));this.$menu.focus(e)}#e(t){"closed"===t.newState&&(this.close(),this.source?.focus())}disconnectedCallback(){}#t(t){t.detail.item.index=t.detail.index,this.close(t.detail.item),this.source?.focus()}constructor(){super(...arguments),A(this,E)}});return e})();const z=T;var R=n(119),M=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},I=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};(()=>{let t,e,n,a,r,o,i,s,l,c,u=[v({selector:"pg-button",style:R.A,template:'<button part="button"> <slot></slot> </button>'})],d=[],p=HTMLElement,h=[],f=[],m=[],b=[],g=[],y=[],w=[],x=[],E=[],O=[],C=[],P=[],j=[],L=[],F=[],A=[];(class extends p{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(p[Symbol.metadata]??null):void 0;n=[S(k)],a=[S(k)],r=[S(k)],o=[S(k)],i=[S(k)],s=[$()],l=[$()],c=[$()],M(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},h,f),M(null,null,a,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:v},m,b),M(null,null,r,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:v},g,y),M(null,null,o,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:v},w,x),M(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:v},E,O),M(null,null,s,{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:v},C,P),M(null,null,l,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:v},j,L),M(null,null,c,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:v},F,A),M(null,t={value:e},u,{kind:"class",name:e.name,metadata:v},null,d),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),I(e,d)}active=I(this,h,!1);block=(I(this,f),I(this,m,!1));start=(I(this,b),I(this,g,!1));center=(I(this,y),I(this,w,!1));end=(I(this,x),I(this,E,!1));$button=(I(this,O),I(this,C,void 0));$number=(I(this,P),I(this,j,void 0));$bar=(I(this,L),I(this,F,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),I(this,A)}})})();var N=n(685),D=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},H=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};const Z="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z";(()=>{let t,e,n,a,r,o,i,s,l,c=[v({selector:"pg-button-menu",style:N.A,template:'<pg-button part="button"> <span part="label"></span> <pg-icon part="icon" path="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></pg-icon> </pg-button>'})],u=[],d=HTMLElement,p=[],h=[],f=[],m=[],b=[],g=[],y=[],w=[],k=[],x=[],E=[],O=[],C=[],P=[];(class extends d{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S()],a=[S()],r=[S()],o=[S()],i=[$()],s=[$()],l=[$()],D(null,null,n,{kind:"field",name:"items",static:!1,private:!1,access:{has:t=>"items"in t,get:t=>t.items,set:(t,e)=>{t.items=e}},metadata:v},p,h),D(null,null,a,{kind:"field",name:"value",static:!1,private:!1,access:{has:t=>"value"in t,get:t=>t.value,set:(t,e)=>{t.value=e}},metadata:v},f,m),D(null,null,r,{kind:"field",name:"label",static:!1,private:!1,access:{has:t=>"label"in t,get:t=>t.label,set:(t,e)=>{t.label=e}},metadata:v},b,g),D(null,null,o,{kind:"field",name:"default",static:!1,private:!1,access:{has:t=>"default"in t,get:t=>t.default,set:(t,e)=>{t.default=e}},metadata:v},y,w),D(null,null,i,{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:v},k,x),D(null,null,s,{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:v},E,O),D(null,null,l,{kind:"field",name:"$label",static:!1,private:!1,access:{has:t=>"$label"in t,get:t=>t.$label,set:(t,e)=>{t.$label=e}},metadata:v},C,P),D(null,t={value:e},c,{kind:"class",name:e.name,metadata:v},null,u),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),H(e,u)}items=H(this,p,[]);value=(H(this,h),H(this,f,null));label=(H(this,m),H(this,b,""));default=(H(this,g),H(this,y,null));$button=(H(this,w),H(this,k,void 0));$icon=(H(this,x),H(this,E,void 0));$label=(H(this,O),H(this,C,void 0));connectedCallback(){this.$button.addEventListener("click",this.#n.bind(this))}render(t){t.label&&(this.$label.textContent=this.label)}#a=(H(this,P),!1);async#n(){if(this.#a=!this.#a,this.$icon.path=this.#a?"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z":Z,!this.#a)return;const t=await z.open({source:this,default:this.default??this.items[0],value:this.items.find((t=>t.value===this.value))??null,items:this.items});this.$icon.path=Z,void 0!==t&&this.dispatchEvent(new CustomEvent("change",{detail:{value:t.value}})),this.#a=!1}})})()})();
1
+ (()=>{"use strict";var t={119:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus-visible {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus-visible::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",a=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),a&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),a&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,a,r,o){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(a)for(var s=0;s<this.length;s++){var l=this[s][0];null!=l&&(i[l]=!0)}for(var c=0;c<t.length;c++){var u=[].concat(t[c]);a&&i[u[0]]||(void 0!==o&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=o),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),r&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=r):u[4]="".concat(r)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}},685:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,":host {\n display: inline-flex;\n}\n\nspan {\n align-self: center;\n display: flex;\n}\n\n[part=collapse] {\n display: none;\n}",""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},697:(t,e,n)=>{n.d(e,{A:()=>l});var a=n(601),r=n.n(a),o=n(314),i=n.n(o)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="overlay"] {\n margin: 0;\n padding: 0;\n border: 0;\n background: transparent;\n --pg-menu-box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.25);\n top: calc(anchor(bottom) - 0.25rem);\n left: anchor(left);\n min-width: calc(anchor-size(width) + calc(2 * var(--pg-menu-padding, 0.25rem)));\n translate: var(--pg-overlay-menu-_x, 0) var(--pg-overlay-menu-_y, 0);\n overflow: visible;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s}},e={};function n(a){var r=e[a];if(void 0!==r)return r.exports;var o=e[a]={id:a,exports:{}};return t[a](o,o.exports,n),o.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var a in e)n.o(e,a)&&!n.o(t,a)&&Object.defineProperty(t,a,{enumerable:!0,get:e[a]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const a=Symbol("addObserver"),r=Symbol("removeObserver"),o=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case o:return c.has(t);case a:return(e,n)=>{c.has(t)?c.get(t).has(e)?c.get(t).get(e).push(n):c.get(t).set(e,[n]):c.set(t,new Map([[e,[n]]]))};case r:return e=>{c.has(t)&&(c.get(t).delete(e),0===c.get(t).size&&c.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return c.get(e).forEach(((t,a)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(c.has(t)){c.get(t).forEach(((t,a)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}window.observers=c;class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),p=Symbol("template"),h=Symbol("style"),f=Symbol("parent");function m(t){return t.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function b(t){return t.replace(/-([a-z])/g,(t=>t[1].toUpperCase()))}function v(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var a,r;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[p]=t.template||""):(e.prototype[f].push(e.prototype),e.prototype[h].push(t.style),e.prototype[p]=(a=e.prototype[p],(r=t.template||null)&&r.match(/<parent\/>/)?r.replace(/<parent\/>/,a):`${a}${r||""}`));const o=e.prototype.connectedCallback||(()=>{}),i=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[p]||"";const n=document.importNode(t.content,!0),a=this.attachShadow({mode:"open"});a.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),a.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const a=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),r=()=>{this[f].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[b(e)]=!0,t)),{}):{})}))};0===a.length?(this[d]=!0,o.call(this),r()):Promise.all(a).then((()=>{this[d]=!0,o.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));r()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[b(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function g(t){return!!t&&t.constructor===Array}function y(t,e){t[d]&&t[f].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":g(t)?"array":typeof t}function S(t){return function(e,n){const a=n.name,r=Symbol(a),l=Symbol(`${a}:type`),c=Symbol(`${a}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,a,{get:()=>"object"===this[l]||"array"===this[l]?this[r][i]?this[r]:u(this[r]):this[r],set:e=>{const n=w(t?t(e):e);if("index"!==a&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${a} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!g(e))throw new PropError(`Array "${a}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,a)?.set);if(this[r]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[r]);if(t[o]){const n=e[i]?(c=e)[i]&&c[s]:e;t.splice(0,this[r].length,...n)}else this[r]=e}else this[r]=t?t(e):e,y(this,a);var c}})})),function(e){if(void 0===e&&"index"!==a)throw new Error(`@Prop() ${a} must have an initial value defined.`);if(void 0!==e&&"index"===a)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${a} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=m(a);e[a]||(t.observedAttributes.push(n),e[a]=r)}return this[l]=w(e),"array"===this[l]?(this[r]=e,new Proxy(e,{get:(t,e)=>e===x?this[c]:(console.log("errr???"),Reflect.get(this[r],e)),set:(t,e,n)=>{if(e===x)return this[c]=n,!0;const o=Reflect.set(t,e,n);return"length"===e&&this[r].length===n||y(this,a),this[r]=n,o}})):(this[r]=t?t(this.getAttribute(a)??e):this.getAttribute(a)??e,this[r])}}}function $(){return function(t,e){const n=e.name,a=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${a}]`))}})}))}}function k(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const x=Symbol("meta");var E=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},O=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};const C=new Set,P=new Map;const j=(()=>{let t,e,n=[v()],a=[],r=HTMLElement;(class extends r{static{e=this}static{const o="function"==typeof Symbol&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;E(null,t={value:e},n,{kind:"class",name:e.name,metadata:o},null,a),e=t.value,o&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:o}),O(e,a)}static open(t={}){var e=document.createElement(this.name);return Object.assign(e,t),document.body.appendChild(e),C.add(e),new Promise((t=>{P.set(e,t)}))}close(t){this.remove(),C.delete(this);const e=P.get(this);e&&e(t),P.delete(this)}});return e})();var L=n(697),F=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},A=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};let T=(()=>{let t,e,n,a,r,o,i,s,l=[v({selector:"pg-overlay-menu",template:'<div part="overlay"> <pg-menu part="menu"></pg-menu> </div>',style:L.A})],c=[],u=j,d=[],p=[],h=[],f=[],m=[],b=[],g=[],y=[],w=[],k=[],x=[],E=[];(class extends u{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(u[Symbol.metadata]??null):void 0;n=[$()],a=[$()],r=[S()],o=[S()],i=[S()],s=[S()],F(null,null,n,{kind:"field",name:"$overlay",static:!1,private:!1,access:{has:t=>"$overlay"in t,get:t=>t.$overlay,set:(t,e)=>{t.$overlay=e}},metadata:v},d,p),F(null,null,a,{kind:"field",name:"$menu",static:!1,private:!1,access:{has:t=>"$menu"in t,get:t=>t.$menu,set:(t,e)=>{t.$menu=e}},metadata:v},h,f),F(null,null,r,{kind:"field",name:"source",static:!1,private:!1,access:{has:t=>"source"in t,get:t=>t.source,set:(t,e)=>{t.source=e}},metadata:v},m,b),F(null,null,o,{kind:"field",name:"default",static:!1,private:!1,access:{has:t=>"default"in t,get:t=>t.default,set:(t,e)=>{t.default=e}},metadata:v},g,y),F(null,null,i,{kind:"field",name:"items",static:!1,private:!1,access:{has:t=>"items"in t,get:t=>t.items,set:(t,e)=>{t.items=e}},metadata:v},w,k),F(null,null,s,{kind:"field",name:"value",static:!1,private:!1,access:{has:t=>"value"in t,get:t=>t.value,set:(t,e)=>{t.value=e}},metadata:v},x,E),F(null,t={value:e},l,{kind:"class",name:e.name,metadata:v},null,c),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),A(e,c)}$overlay=A(this,d,void 0);$menu=(A(this,p),A(this,h,void 0));source=(A(this,f),A(this,m,null));default=(A(this,b),A(this,g,null));items=(A(this,y),A(this,w,[]));value=(A(this,k),A(this,x,null));render(t){}connectedCallback(){this.$menu.items=this.items,this.$menu.addEventListener("select",this.#t.bind(this)),this.$overlay.popover="auto",null!==this.source&&this.$overlay.showPopover({source:this.source}),this.$overlay.addEventListener("toggle",this.#e.bind(this));this.source?.getBoundingClientRect();const t=null===this.value||"object"!=typeof this.value?this.value:this.value.value,e=null===this.value?0:this.items.findIndex((e=>e.value===t));this.$menu.focus(e)}#e(t){"closed"===t.newState&&(this.close(),this.source?.focus())}disconnectedCallback(){}#t(t){t.detail.item.index=t.detail.index,this.close(t.detail.item),this.source?.focus()}constructor(){super(...arguments),A(this,E)}});return e})();const z=T;var R=n(119),M=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},I=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};(()=>{let t,e,n,a,r,o,i,s,l,c,u=[v({selector:"pg-button",style:R.A,template:'<button part="button"> <slot></slot> </button>'})],d=[],p=HTMLElement,h=[],f=[],m=[],b=[],g=[],y=[],w=[],x=[],E=[],O=[],C=[],P=[],j=[],L=[],F=[],A=[];(class extends p{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(p[Symbol.metadata]??null):void 0;n=[S(k)],a=[S(k)],r=[S(k)],o=[S(k)],i=[S(k)],s=[$()],l=[$()],c=[$()],M(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},h,f),M(null,null,a,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:v},m,b),M(null,null,r,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:v},g,y),M(null,null,o,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:v},w,x),M(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:v},E,O),M(null,null,s,{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:v},C,P),M(null,null,l,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:v},j,L),M(null,null,c,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:v},F,A),M(null,t={value:e},u,{kind:"class",name:e.name,metadata:v},null,d),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),I(e,d)}active=I(this,h,!1);block=(I(this,f),I(this,m,!1));start=(I(this,b),I(this,g,!1));center=(I(this,y),I(this,w,!1));end=(I(this,x),I(this,E,!1));$button=(I(this,O),I(this,C,void 0));$number=(I(this,P),I(this,j,void 0));$bar=(I(this,L),I(this,F,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),I(this,A)}})})();var N=n(685),D=function(t,e,n,a,r,o){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=a.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?a.static?t:t.prototype:null,d=e||(u?Object.getOwnPropertyDescriptor(u,a.name):{}),p=!1,h=n.length-1;h>=0;h--){var f={};for(var m in a)f[m]="access"===m?{}:a[m];for(var m in a.access)f.access[m]=a.access[m];f.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");o.push(i(t||null))};var b=(0,n[h])("accessor"===l?{get:d.get,set:d.set}:d[c],f);if("accessor"===l){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=i(b.get))&&(d.get=s),(s=i(b.set))&&(d.set=s),(s=i(b.init))&&r.unshift(s)}else(s=i(b))&&("field"===l?r.unshift(s):d[c]=s)}u&&Object.defineProperty(u,a.name,d),p=!0},H=function(t,e,n){for(var a=arguments.length>2,r=0;r<e.length;r++)n=a?e[r].call(t,n):e[r].call(t);return a?n:void 0};const Z="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z";(()=>{let t,e,n,a,r,o,i,s,l,c=[v({selector:"pg-button-menu",style:N.A,template:'<pg-button part="button"> <span part="label"></span> <pg-icon part="icon" path="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></pg-icon> </pg-button>'})],u=[],d=HTMLElement,p=[],h=[],f=[],m=[],b=[],g=[],y=[],w=[],k=[],x=[],E=[],O=[],C=[],P=[];(class extends d{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S()],a=[S()],r=[S()],o=[S()],i=[$()],s=[$()],l=[$()],D(null,null,n,{kind:"field",name:"items",static:!1,private:!1,access:{has:t=>"items"in t,get:t=>t.items,set:(t,e)=>{t.items=e}},metadata:v},p,h),D(null,null,a,{kind:"field",name:"value",static:!1,private:!1,access:{has:t=>"value"in t,get:t=>t.value,set:(t,e)=>{t.value=e}},metadata:v},f,m),D(null,null,r,{kind:"field",name:"label",static:!1,private:!1,access:{has:t=>"label"in t,get:t=>t.label,set:(t,e)=>{t.label=e}},metadata:v},b,g),D(null,null,o,{kind:"field",name:"default",static:!1,private:!1,access:{has:t=>"default"in t,get:t=>t.default,set:(t,e)=>{t.default=e}},metadata:v},y,w),D(null,null,i,{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:v},k,x),D(null,null,s,{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:v},E,O),D(null,null,l,{kind:"field",name:"$label",static:!1,private:!1,access:{has:t=>"$label"in t,get:t=>t.$label,set:(t,e)=>{t.$label=e}},metadata:v},C,P),D(null,t={value:e},c,{kind:"class",name:e.name,metadata:v},null,u),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),H(e,u)}items=H(this,p,[]);value=(H(this,h),H(this,f,null));label=(H(this,m),H(this,b,""));default=(H(this,g),H(this,y,null));$button=(H(this,w),H(this,k,void 0));$icon=(H(this,x),H(this,E,void 0));$label=(H(this,O),H(this,C,void 0));connectedCallback(){this.$button.addEventListener("click",this.#n.bind(this))}render(t){t.label&&(this.$label.textContent=this.label)}#a=(H(this,P),!1);async#n(){if(this.#a=!this.#a,this.$icon.path=this.#a?"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z":Z,!this.#a)return;const t=await z.open({source:this,default:this.default??this.items[0],value:this.items.find((t=>t.value===this.value))??null,items:this.items});this.$icon.path=Z,void 0!==t&&this.dispatchEvent(new CustomEvent("change",{detail:{value:t.value}})),this.#a=!1}})})()})();
package/pgButtonToggle.js CHANGED
@@ -1 +1 @@
1
- (()=>{"use strict";var t={111:(t,e,n)=>{n.d(e,{A:()=>l});var o=n(601),r=n.n(o),a=n(314),i=n.n(a)()(r());i.push([t.id,":host {\n display: inline-flex;\n}\n\n::slotted(*) {\n align-self: center;\n display: flex;\n}",""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},119:(t,e,n)=>{n.d(e,{A:()=>l});var o=n(601),r=n.n(o),a=n(314),i=n.n(a)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",o=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),o&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),o&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,o,r,a){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(o)for(var s=0;s<this.length;s++){var l=this[s][0];null!=l&&(i[l]=!0)}for(var c=0;c<t.length;c++){var u=[].concat(t[c]);o&&i[u[0]]||(void 0!==a&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=a),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),r&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=r):u[4]="".concat(r)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}}},e={};function n(o){var r=e[o];if(void 0!==r)return r.exports;var a=e[o]={id:o,exports:{}};return t[o](a,a.exports,n),a.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var o in e)n.o(e,o)&&!n.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const o=Symbol("addObserver"),r=Symbol("removeObserver"),a=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case a:return c.has(t);case o:return(e,n)=>{c.has(t)?c.get(t).has(e)?c.get(t).get(e).push(n):c.get(t).set(e,[n]):c.set(t,new Map([[e,[n]]]))};case r:return e=>{c.has(t)&&(c.get(t).delete(e),0===c.get(t).size&&c.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return c.get(e).forEach(((t,o)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(c.has(t)){c.get(t).forEach(((t,o)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}window.observers=c;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"),b=Symbol("parent");function f(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 v(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var o,r;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[b]||e.prototype[b][e.prototype[b].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[b]=[e.prototype],e.prototype[h]=t.style?[t.style]:[],e.prototype[d]=t.template||""):(e.prototype[b].push(e.prototype),e.prototype[h].push(t.style),e.prototype[d]=(o=e.prototype[d],(r=t.template||null)&&r.match(/<parent\/>/)?r.replace(/<parent\/>/,o):`${o}${r||""}`));const a=e.prototype.connectedCallback||(()=>{}),i=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 n=document.importNode(t.content,!0),o=this.attachShadow({mode:"open"});o.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),o.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const o=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),r=()=>{this[b].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[m(e)]=!0,t)),{}):{})}))};0===o.length?(this[p]=!0,a.call(this),r()):Promise.all(o).then((()=>{this[p]=!0,a.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));r()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[m(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function g(t){return!!t&&t.constructor===Array}function y(t,e){t[p]&&t[b].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":g(t)?"array":typeof t}function S(t){return function(e,n){const o=n.name,r=Symbol(o),l=Symbol(`${o}:type`),c=Symbol(`${o}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,o,{get:()=>"object"===this[l]||"array"===this[l]?this[r][i]?this[r]:u(this[r]):this[r],set:e=>{const n=w(t?t(e):e);if("index"!==o&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${o} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!g(e))throw new PropError(`Array "${o}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,o)?.set);if(this[r]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[r]);if(t[a]){const n=e[i]?(c=e)[i]&&c[s]:e;t.splice(0,this[r].length,...n)}else this[r]=e}else this[r]=t?t(e):e,y(this,o);var c}})})),function(e){if(void 0===e&&"index"!==o)throw new Error(`@Prop() ${o} must have an initial value defined.`);if(void 0!==e&&"index"===o)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${o} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=f(o);e[o]||(t.observedAttributes.push(n),e[o]=r)}return this[l]=w(e),"array"===this[l]?(this[r]=e,new Proxy(e,{get:(t,e)=>e===k?this[c]:(console.log("errr???"),Reflect.get(this[r],e)),set:(t,e,n)=>{if(e===k)return this[c]=n,!0;const a=Reflect.set(t,e,n);return"length"===e&&this[r].length===n||y(this,o),this[r]=n,a}})):(this[r]=t?t(this.getAttribute(o)??e):this.getAttribute(o)??e,this[r])}}}function $(){return function(t,e){const n=e.name,o=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${o}]`))}})}))}}function x(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const k=Symbol("meta");var E=n(119),C=function(t,e,n,o,r,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=o.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?o.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,o.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in o)b[f]="access"===f?{}:o[f];for(var f in o.access)b.access[f]=o.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===l?{get:p.get,set:p.set}:p[c],b);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&r.unshift(s)}else(s=i(m))&&("field"===l?r.unshift(s):p[c]=s)}u&&Object.defineProperty(u,o.name,p),d=!0},P=function(t,e,n){for(var o=arguments.length>2,r=0;r<e.length;r++)n=o?e[r].call(t,n):e[r].call(t);return o?n:void 0};(()=>{let t,e,n,o,r,a,i,s,l,c,u=[v({selector:"pg-button",style:E.A,template:'<button part="button"> <slot></slot> </button>'})],p=[],d=HTMLElement,h=[],b=[],f=[],m=[],g=[],y=[],w=[],k=[],F=[],O=[],A=[],j=[],R=[],z=[],T=[],L=[];(class extends d{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S(x)],o=[S(x)],r=[S(x)],a=[S(x)],i=[S(x)],s=[$()],l=[$()],c=[$()],C(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},h,b),C(null,null,o,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:v},f,m),C(null,null,r,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:v},g,y),C(null,null,a,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:v},w,k),C(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:v},F,O),C(null,null,s,{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:v},A,j),C(null,null,l,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:v},R,z),C(null,null,c,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:v},T,L),C(null,t={value:e},u,{kind:"class",name:e.name,metadata:v},null,p),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),P(e,p)}active=P(this,h,!1);block=(P(this,b),P(this,f,!1));start=(P(this,m),P(this,g,!1));center=(P(this,y),P(this,w,!1));end=(P(this,k),P(this,F,!1));$button=(P(this,O),P(this,A,void 0));$number=(P(this,j),P(this,R,void 0));$bar=(P(this,z),P(this,T,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),P(this,L)}})})();var F=n(111),O=function(t,e,n,o,r,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=o.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?o.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,o.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in o)b[f]="access"===f?{}:o[f];for(var f in o.access)b.access[f]=o.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===l?{get:p.get,set:p.set}:p[c],b);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&r.unshift(s)}else(s=i(m))&&("field"===l?r.unshift(s):p[c]=s)}u&&Object.defineProperty(u,o.name,p),d=!0},A=function(t,e,n){for(var o=arguments.length>2,r=0;r<e.length;r++)n=o?e[r].call(t,n):e[r].call(t);return o?n:void 0};const j=[!0,"true",""];(()=>{let t,e,n,o,r,a,i=[v({selector:"pg-button-toggle",style:F.A,template:'<pg-button part="button"> <slot part="expand" name="active"></slot> <slot part="collapse" name="inactive"></slot> </pg-button>'})],s=[],l=HTMLElement,c=[],u=[],p=[],d=[],h=[],b=[],f=[],m=[];(class extends l{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(l[Symbol.metadata]??null):void 0;n=[S()],o=[$()],r=[$()],a=[$()],O(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},c,u),O(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:v},p,d),O(null,null,r,{kind:"field",name:"$expand",static:!1,private:!1,access:{has:t=>"$expand"in t,get:t=>t.$expand,set:(t,e)=>{t.$expand=e}},metadata:v},h,b),O(null,null,a,{kind:"field",name:"$collapse",static:!1,private:!1,access:{has:t=>"$collapse"in t,get:t=>t.$collapse,set:(t,e)=>{t.$collapse=e}},metadata:v},f,m),O(null,t={value:e},i,{kind:"class",name:e.name,metadata:v},null,s),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),A(e,s)}active=A(this,c,!1);$button=(A(this,u),A(this,p,void 0));$expand=(A(this,d),A(this,h,void 0));$collapse=(A(this,b),A(this,f,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.active=!j.includes(this.active),this.dispatchEvent(new CustomEvent("click",{detail:{active:this.active}}))}))}render(t){t.active&&(this.$button.active=j.includes(this.active),this.$expand.style.display=this.$button.active?"initial":"none",this.$collapse.style.display=this.$button.active?"none":"initial")}constructor(){super(...arguments),A(this,m)}})})()})();
1
+ (()=>{"use strict";var t={111:(t,e,n)=>{n.d(e,{A:()=>l});var o=n(601),r=n.n(o),a=n(314),i=n.n(a)()(r());i.push([t.id,":host {\n display: inline-flex;\n}\n\n::slotted(*) {\n align-self: center;\n display: flex;\n}",""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},119:(t,e,n)=>{n.d(e,{A:()=>l});var o=n(601),r=n.n(o),a=n(314),i=n.n(a)()(r());i.push([t.id,':host {\n display: contents;\n}\n\n[part="button"] {\n display: flex;\n align-items: center;\n align-content: center;\n font-family: var(--pg-font-family);\n font-size: var(--pg-button-font-size, 1rem);\n line-height: var(--pg-button-line-height, 1.5rem);\n border: 1px solid var(--pg-button-border-color, #453C4F);\n background-color: var(--pg-button-background-color, #FFFFFF);\n color: var(--pg-button-color, #453C4F);\n padding: var(--pg-button-padding, 0.25rem 0.5rem);\n border-radius: var(--pg-button-border-radius, 0.25rem);\n outline: none;\n --pg-icon-color: var(--pg-button-color, #453C4F);\n}\n\n[part="button"]:hover {\n border: 1px solid var(--pg-button-hover-border-color, #453C4F);\n background-color: var(--pg-button-hover-background-color, #453C4F);\n color: var(--pg-button-hover-color, #FFFFFF);\n --pg-icon-color: var(--pg-button-hover-color, #FFFFFF);\n}\n\n[part="button"]:active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n position: relative;\n}\n\n[part="button"]:focus-visible {\n position: relative;\n}\n\n[part="button"]:active::before {\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.6));\n}\n[part="button"]:focus-visible::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: var(--pg-button-border-radius, 0.25rem);\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\n[part="button"].start {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].center {\n border-radius: 0;\n margin-right: -1px;\n}\n\n[part="button"].end {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n[part="button"].active {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: rgba(69, 60, 79, 0.1);\n color: var(--pg-button-color, #453C4F);\n}\n[part="button"].active:hover {\n box-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.5) inset;\n background-color: var(--pg-button-color, #453C4F);\n color: var(--pg-button-hover-color, #fff);\n}\n\n[part="button"].block {\n flex: 1;\n}\n\n::slotted {\n align-self: center;\n}',""]);var s=new CSSStyleSheet;s.replaceSync(i.toString());const l=s},314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",o=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),o&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),o&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,o,r,a){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(o)for(var s=0;s<this.length;s++){var l=this[s][0];null!=l&&(i[l]=!0)}for(var c=0;c<t.length;c++){var u=[].concat(t[c]);o&&i[u[0]]||(void 0!==a&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=a),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),r&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=r):u[4]="".concat(r)),e.push(u))}},e}},601:t=>{t.exports=function(t){return t[1]}}},e={};function n(o){var r=e[o];if(void 0!==r)return r.exports;var a=e[o]={id:o,exports:{}};return t[o](a,a.exports,n),a.exports}n.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return n.d(e,{a:e}),e},n.d=(t,e)=>{for(var o in e)n.o(e,o)&&!n.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},n.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const o=Symbol("addObserver"),r=Symbol("removeObserver"),a=Symbol("getObservers"),i=Symbol("isProxy"),s=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],c=new Map;function u(t){return new Proxy(t,{get(e,n){if("symbol"==typeof n){switch(n){case i:return!0;case s:return e;case a:return c.has(t);case o:return(e,n)=>{c.has(t)?c.get(t).has(e)?c.get(t).get(e).push(n):c.get(t).set(e,[n]):c.set(t,new Map([[e,[n]]]))};case r:return e=>{c.has(t)&&(c.get(t).delete(e),0===c.get(t).size&&c.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,n)}throw new Error("Unsupported symbol")}if(n in e){if(!Number.isNaN(Number(n)))return"object"==typeof e[n]?u(e[n]):e[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(l.includes(n))return c.has(e)?function(){const t=Array.prototype[n].apply(e,arguments);return c.get(e).forEach(((t,o)=>{t.forEach((t=>{t(e,n,arguments)}))})),t}:Reflect.get(e,n);if(e[n]instanceof Array)return u(e[n])}return Reflect.get(e,n)},set(t,e,n){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,n);if(c.has(t)){c.get(t).forEach(((t,o)=>{t.forEach((t=>{t(e,n)}))}))}return Reflect.set(t,e,n)}})}window.observers=c;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"),b=Symbol("parent");function f(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 v(t={}){return function(e,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var o,r;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[b]||e.prototype[b][e.prototype[b].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[b]=[e.prototype],e.prototype[h]=t.style?[t.style]:[],e.prototype[d]=t.template||""):(e.prototype[b].push(e.prototype),e.prototype[h].push(t.style),e.prototype[d]=(o=e.prototype[d],(r=t.template||null)&&r.match(/<parent\/>/)?r.replace(/<parent\/>/,o):`${o}${r||""}`));const a=e.prototype.connectedCallback||(()=>{}),i=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 n=document.importNode(t.content,!0),o=this.attachShadow({mode:"open"});o.adoptedStyleSheets=e.prototype[h].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),o.appendChild(n)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&n.add(t.localName);const o=Array.from(n.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),r=()=>{this[b].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[m(e)]=!0,t)),{}):{})}))};0===o.length?(this[p]=!0,a.call(this),r()):Promise.all(o).then((()=>{this[p]=!0,a.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));r()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,n){this[m(t)]=n},n.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${n.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function g(t){return!!t&&t.constructor===Array}function y(t,e){t[p]&&t[b].map((n=>{n.render&&n.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":g(t)?"array":typeof t}function S(t){return function(e,n){const o=n.name,r=Symbol(o),l=Symbol(`${o}:type`),c=Symbol(`${o}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,o,{get:()=>"object"===this[l]||"array"===this[l]?this[r][i]?this[r]:u(this[r]):this[r],set:e=>{const n=w(t?t(e):e);if("index"!==o&&this[l]!==n&&"null"!==this[l]&&"null"!==n)throw new Error(`@Prop() ${o} with type '${this[l]}' cannot be set to ${n}.`);if("array"===this[l]){if(!g(e))throw new PropError(`Array "${o}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,o)?.set);if(this[r]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[r]);if(t[a]){const n=e[i]?(c=e)[i]&&c[s]:e;t.splice(0,this[r].length,...n)}else this[r]=e}else this[r]=t?t(e):e,y(this,o);var c}})})),function(e){if(void 0===e&&"index"!==o)throw new Error(`@Prop() ${o} must have an initial value defined.`);if(void 0!==e&&"index"===o)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${o} boolean must initialize to false.`);if(!n.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,n=f(o);e[o]||(t.observedAttributes.push(n),e[o]=r)}return this[l]=w(e),"array"===this[l]?(this[r]=e,new Proxy(e,{get:(t,e)=>e===k?this[c]:(console.log("errr???"),Reflect.get(this[r],e)),set:(t,e,n)=>{if(e===k)return this[c]=n,!0;const a=Reflect.set(t,e,n);return"length"===e&&this[r].length===n||y(this,o),this[r]=n,a}})):(this[r]=t?t(this.getAttribute(o)??e):this.getAttribute(o)??e,this[r])}}}function $(){return function(t,e){const n=e.name,o=n.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,n,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${o}]`))}})}))}}function x(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const k=Symbol("meta");var E=n(119),C=function(t,e,n,o,r,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=o.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?o.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,o.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in o)b[f]="access"===f?{}:o[f];for(var f in o.access)b.access[f]=o.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===l?{get:p.get,set:p.set}:p[c],b);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&r.unshift(s)}else(s=i(m))&&("field"===l?r.unshift(s):p[c]=s)}u&&Object.defineProperty(u,o.name,p),d=!0},P=function(t,e,n){for(var o=arguments.length>2,r=0;r<e.length;r++)n=o?e[r].call(t,n):e[r].call(t);return o?n:void 0};(()=>{let t,e,n,o,r,a,i,s,l,c,u=[v({selector:"pg-button",style:E.A,template:'<button part="button"> <slot></slot> </button>'})],p=[],d=HTMLElement,h=[],b=[],f=[],m=[],g=[],y=[],w=[],k=[],F=[],O=[],A=[],j=[],R=[],z=[],T=[],L=[];(class extends d{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;n=[S(x)],o=[S(x)],r=[S(x)],a=[S(x)],i=[S(x)],s=[$()],l=[$()],c=[$()],C(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},h,b),C(null,null,o,{kind:"field",name:"block",static:!1,private:!1,access:{has:t=>"block"in t,get:t=>t.block,set:(t,e)=>{t.block=e}},metadata:v},f,m),C(null,null,r,{kind:"field",name:"start",static:!1,private:!1,access:{has:t=>"start"in t,get:t=>t.start,set:(t,e)=>{t.start=e}},metadata:v},g,y),C(null,null,a,{kind:"field",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:v},w,k),C(null,null,i,{kind:"field",name:"end",static:!1,private:!1,access:{has:t=>"end"in t,get:t=>t.end,set:(t,e)=>{t.end=e}},metadata:v},F,O),C(null,null,s,{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:v},A,j),C(null,null,l,{kind:"field",name:"$number",static:!1,private:!1,access:{has:t=>"$number"in t,get:t=>t.$number,set:(t,e)=>{t.$number=e}},metadata:v},R,z),C(null,null,c,{kind:"field",name:"$bar",static:!1,private:!1,access:{has:t=>"$bar"in t,get:t=>t.$bar,set:(t,e)=>{t.$bar=e}},metadata:v},T,L),C(null,t={value:e},u,{kind:"class",name:e.name,metadata:v},null,p),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),P(e,p)}active=P(this,h,!1);block=(P(this,b),P(this,f,!1));start=(P(this,m),P(this,g,!1));center=(P(this,y),P(this,w,!1));end=(P(this,k),P(this,F,!1));$button=(P(this,O),P(this,A,void 0));$number=(P(this,j),P(this,R,void 0));$bar=(P(this,z),P(this,T,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.dispatchEvent(new CustomEvent("click"))}))}render(t){t.active&&this.$button.classList.toggle("active",this.active),t.start&&this.$button.classList.toggle("start",this.start),t.end&&this.$button.classList.toggle("end",this.end),t.center&&this.$button.classList.toggle("center",this.center),t.block&&this.$button.classList.toggle("block",this.block)}getBoundingClientRect(){return this.$button.getBoundingClientRect()}constructor(){super(...arguments),P(this,L)}})})();var F=n(111),O=function(t,e,n,o,r,a){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var s,l=o.kind,c="getter"===l?"get":"setter"===l?"set":"value",u=!e&&t?o.static?t:t.prototype:null,p=e||(u?Object.getOwnPropertyDescriptor(u,o.name):{}),d=!1,h=n.length-1;h>=0;h--){var b={};for(var f in o)b[f]="access"===f?{}:o[f];for(var f in o.access)b.access[f]=o.access[f];b.addInitializer=function(t){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(t||null))};var m=(0,n[h])("accessor"===l?{get:p.get,set:p.set}:p[c],b);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(s=i(m.get))&&(p.get=s),(s=i(m.set))&&(p.set=s),(s=i(m.init))&&r.unshift(s)}else(s=i(m))&&("field"===l?r.unshift(s):p[c]=s)}u&&Object.defineProperty(u,o.name,p),d=!0},A=function(t,e,n){for(var o=arguments.length>2,r=0;r<e.length;r++)n=o?e[r].call(t,n):e[r].call(t);return o?n:void 0};const j=[!0,"true",""];(()=>{let t,e,n,o,r,a,i=[v({selector:"pg-button-toggle",style:F.A,template:'<pg-button part="button"> <slot part="expand" name="active"></slot> <slot part="collapse" name="inactive"></slot> </pg-button>'})],s=[],l=HTMLElement,c=[],u=[],p=[],d=[],h=[],b=[],f=[],m=[];(class extends l{static{e=this}static{const v="function"==typeof Symbol&&Symbol.metadata?Object.create(l[Symbol.metadata]??null):void 0;n=[S()],o=[$()],r=[$()],a=[$()],O(null,null,n,{kind:"field",name:"active",static:!1,private:!1,access:{has:t=>"active"in t,get:t=>t.active,set:(t,e)=>{t.active=e}},metadata:v},c,u),O(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:v},p,d),O(null,null,r,{kind:"field",name:"$expand",static:!1,private:!1,access:{has:t=>"$expand"in t,get:t=>t.$expand,set:(t,e)=>{t.$expand=e}},metadata:v},h,b),O(null,null,a,{kind:"field",name:"$collapse",static:!1,private:!1,access:{has:t=>"$collapse"in t,get:t=>t.$collapse,set:(t,e)=>{t.$collapse=e}},metadata:v},f,m),O(null,t={value:e},i,{kind:"class",name:e.name,metadata:v},null,s),e=t.value,v&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:v}),A(e,s)}active=A(this,c,!1);$button=(A(this,u),A(this,p,void 0));$expand=(A(this,d),A(this,h,void 0));$collapse=(A(this,b),A(this,f,void 0));connectedCallback(){this.$button.addEventListener("click",(t=>{t.stopPropagation(),this.active=!j.includes(this.active),this.dispatchEvent(new CustomEvent("click",{detail:{active:this.active}}))}))}render(t){t.active&&(this.$button.active=j.includes(this.active),this.$expand.style.display=this.$button.active?"initial":"none",this.$collapse.style.display=this.$button.active?"none":"initial")}constructor(){super(...arguments),A(this,m)}})})()})();
package/pgInputPixelEditor.js CHANGED
@@ -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 i="",s=void 0!==e[5];return e[4]&&(i+="@supports (".concat(e[4],") {")),e[2]&&(i+="@media ".concat(e[2]," {")),s&&(i+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),i+=t(e),s&&(i+="}"),e[2]&&(i+="}"),e[4]&&(i+="}"),i})).join("")},e.i=function(t,i,s,n,r){"string"==typeof t&&(t=[[null,t,void 0]]);var a={};if(s)for(var o=0;o<this.length;o++){var h=this[o][0];null!=h&&(a[h]=!0)}for(var l=0;l<t.length;l++){var c=[].concat(t[l]);s&&a[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),i&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=i):c[2]=i),n&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=n):c[4]="".concat(n)),e.push(c))}},e}},601:t=>{t.exports=function(t){return t[1]}},713:(t,e,i)=>{i.d(e,{A:()=>h});var s=i(601),n=i.n(s),r=i(314),a=i.n(r)()(n());a.push([t.id,':host {\n display: inline-flex;\n}\n\n[part="wrapper"] {\n display: flex;\n position: relative;\n outline: 0;\n}\n\n[part="wrapper"]:focus-visible::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: 0.125rem;\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\ncanvas {\n touch-action: none;\n user-select: none;\n outline: 0;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(a.toString());const h=o}},e={};function i(s){var n=e[s];if(void 0!==n)return n.exports;var r=e[s]={id:s,exports:{}};return t[s](r,r.exports,i),r.exports}i.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return i.d(e,{a:e}),e},i.d=(t,e)=>{for(var s in e)i.o(e,s)&&!i.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:e[s]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const s=Symbol("addObserver"),n=Symbol("removeObserver"),r=Symbol("getObservers"),a=Symbol("isProxy"),o=Symbol("getTarget"),h=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function c(t){return new Proxy(t,{get(e,i){if("symbol"==typeof i){switch(i){case a:return!0;case o:return e;case r:return l.has(t);case s:return(e,i)=>{l.has(t)?l.get(t).has(e)?l.get(t).get(e).push(i):l.get(t).set(e,[i]):l.set(t,new Map([[e,[i]]]))};case n: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,i)}throw new Error("Unsupported symbol")}if(i in e){if(!Number.isNaN(Number(i)))return"object"==typeof e[i]?c(e[i]):e[i];if("copyWithin"===i)throw new Error("Unsupported array method copyWithin");if(h.includes(i))return l.has(e)?function(){const t=Array.prototype[i].apply(e,arguments);return l.get(e).forEach(((t,s)=>{t.forEach((t=>{t(e,i,arguments)}))})),t}:Reflect.get(e,i);if(e[i]instanceof Array)return c(e[i])}return Reflect.get(e,i)},set(t,e,i){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,i);if(l.has(t)){l.get(t).forEach(((t,s)=>{t.forEach((t=>{t(e,i)}))}))}return Reflect.set(t,e,i)}})}window.observers=l;class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),p=Symbol("template"),y=Symbol("style"),u=Symbol("parent");function f(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 m(t={}){return function(e,i){if("class"!==i.kind)throw new Error("@Component() can only decorate a class");var s,n;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[u]||e.prototype[u][e.prototype[u].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[u]=[e.prototype],e.prototype[y]=t.style?[t.style]:[],e.prototype[p]=t.template||""):(e.prototype[u].push(e.prototype),e.prototype[y].push(t.style),e.prototype[p]=(s=e.prototype[p],(n=t.template||null)&&n.match(/<parent\/>/)?n.replace(/<parent\/>/,s):`${s}${n||""}`));const r=e.prototype.connectedCallback||(()=>{}),a=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[p]||"";const i=document.importNode(t.content,!0),s=this.attachShadow({mode:"open"});s.adoptedStyleSheets=e.prototype[y].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),s.appendChild(i)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const i=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&i.add(t.localName);const s=Array.from(i.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),n=()=>{this[u].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[g(e)]=!0,t)),{}):{})}))};0===s.length?(this[d]=!0,r.call(this),n()):Promise.all(s).then((()=>{this[d]=!0,r.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));n()}))},e.prototype.disconnectedCallback=function(){a.call(this)},e.prototype.attributeChangedCallback=function(t,e,i){this[g(t)]=i},i.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${i.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function x(t){return!!t&&t.constructor===Array}function v(t,e){t[d]&&t[u].map((i=>{i.render&&i.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":x(t)?"array":typeof t}function b(t){return function(e,i){const s=i.name,n=Symbol(s),h=Symbol(`${s}:type`),l=Symbol(`${s}:meta`);return i.addInitializer((function(){Reflect.defineProperty(this,s,{get:()=>"object"===this[h]||"array"===this[h]?this[n][a]?this[n]:c(this[n]):this[n],set:e=>{const i=w(t?t(e):e);if("index"!==s&&this[h]!==i&&"null"!==this[h]&&"null"!==i)throw new Error(`@Prop() ${s} with type '${this[h]}' cannot be set to ${i}.`);if("array"===this[h]){if(!x(e))throw new PropError(`Array "${s}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,s)?.set);if(this[n]===e)throw new Error("Setting an array to itself is not allowed.");const t=c(this[n]);if(t[r]){const i=e[a]?(l=e)[a]&&l[o]:e;t.splice(0,this[n].length,...i)}else this[n]=e}else this[n]=t?t(e):e,v(this,s);var l}})})),function(e){if(void 0===e&&"index"!==s)throw new Error(`@Prop() ${s} must have an initial value defined.`);if(void 0!==e&&"index"===s)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${s} boolean must initialize to false.`);if(!i.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,i=f(s);e[s]||(t.observedAttributes.push(i),e[s]=n)}return this[h]=w(e),"array"===this[h]?(this[n]=e,new Proxy(e,{get:(t,e)=>e===E?this[l]:(console.log("errr???"),Reflect.get(this[n],e)),set:(t,e,i)=>{if(e===E)return this[l]=i,!0;const r=Reflect.set(t,e,i);return"length"===e&&this[n].length===i||v(this,s),this[n]=i,r}})):(this[n]=t?t(this.getAttribute(s)??e):this.getAttribute(s)??e,this[n])}}}function L(t){return parseInt(`${t}`,10)}function C(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const E=Symbol("meta");var S=i(713);function P(t){const e=[];for(let i=0;i<t.length;i++){e.push([]);for(let s=0;s<t[0].length;s++)e[i].push(t[i][s])}return e}function M(t,e,i,s){return function(t,e,i){return Math.sqrt(Math.pow(e*i,2)+Math.pow(t,2))}(t,e,s)<=i}function z(t,e,i,s){return function(t,e,i,s){return M(t,e,i,s)&&!(M(t+1,e,i,s)&&M(t-1,e,i,s)&&M(t,e+1,i,s)&&M(t,e-1,i,s))}(t=-.5*(i-2*(t+.5)),e=-.5*(s-2*(e+.5)),i/2,i/s)}function $(t,e,i,s){return Math.abs(t-i)===Math.abs(e-s)&&Math.abs(t-i)?(console.log("circle",Math.abs(t-i),Math.abs(e-s)),function(t,e,i,s){const n=Math.abs(t-i),r=Math.abs(e-s),a=Math.min(t,i),o=Math.min(e,s),h=[];for(let t=0;t<r;t++)for(let e=0;e<n;e++)z(e,t,n,r)&&h.push({x:e+a,y:t+o});return h}(t,e,i+1,s+1)):function(t,e,i,s){const n=[];var r,a=Math.abs(i-t),o=Math.abs(s-e),h=1&o,l=4*(1-a)*o*o,c=4*(h+1)*a*a,d=l+c+h*a*a;t>i&&(t=i,i+=a),e>s&&(e=s),s=(e+=o+1>>1)-h,a*=8*a,h=8*o*o;do{n.push({x:i,y:e}),n.push({x:t,y:e}),n.push({x:t,y:s}),n.push({x:i,y:s}),(r=2*d)<=c&&(e++,s--,d+=c+=a),(r>=l||2*d>c)&&(t++,i--,d+=l+=h)}while(t<=i);for(;e-s<=o;)n.push({x:t-1,y:e}),n.push({x:i+1,y:e++}),n.push({x:t-1,y:s}),n.push({x:i+1,y:s--});return n}(t,e,i,s)}const k="#FFFFFF";function R(t,e,i,s){const n=[],r=Math.abs(i-t),a=Math.abs(s-e),o=t<i?1:-1,h=e<s?1:-1;let l=r-a;for(;n.push({x:t,y:e}),t!==i||e!==s;){var c=2*l;c>-a&&(l-=a,t+=o),c<r&&(l+=r,e+=h)}return n}function A(t,e,i,s){const n=[],r=Math.min(t,i),a=Math.min(e,s);for(var o=Math.abs(i-t)+1,h=Math.abs(s-e)+1,l=a;l<a+h;l++)for(var c=r;c<r+o;c++)n.push({x:c,y:l});return n}function O(t,e,i,s){const n=[],r=Math.min(t,i),a=Math.min(e,s);for(var o=Math.abs(i-t),h=Math.abs(s-e),l=a;l<=a+h;l++)n.push({x:r,y:l}),n.push({x:r+o,y:l});for(var c=r+1;c<=r+o-1;c++)n.push({x:c,y:a}),n.push({x:c,y:a+h});return n}function H(t,e){let i=[];for(let s=0;s<e;s++){const e=[];for(let i=0;i<t;i++)e.push(0);i.push(e)}return i}function I(t,e){for(let i=0;i<t.length;i++)for(let s=0;s<t[0].length;s++)e(s,i,t[i][s])}function Y(t,e,i){return e*i+t}function X(t,e){const i=document.createElement("canvas");return i.width=t,i.height=e,[i,i.getContext("2d")]}const U=[{name:"Circle Outer",width:22,height:22,color:"#F00",opacity:1,lines:[[7,1],[15,1],[15,2],[17,2],[17,3],[18,3],[18,4],[19,4],[19,5],[20,5],[20,7],[21,7],[21,15],[20,15],[20,17],[19,17],[19,18],[18,18],[18,19],[17,19],[17,20],[15,20],[15,21],[7,21],[7,20],[5,20],[5,19],[4,19],[4,18],[3,18],[3,17],[2,17],[2,15],[1,15],[1,7],[2,7],[2,5],[3,5],[3,4],[4,4],[4,3],[5,3],[5,2],[7,2],[7,1]]},{name:"Circle Inner",width:22,height:22,color:"#00F",opacity:1,lines:[[8,3],[14,3],[14,4],[16,4],[16,5],[17,5],[17,6],[18,6],[18,8],[19,8],[19,14],[18,14],[18,16],[17,16],[17,17],[16,17],[16,18],[14,18],[14,19],[8,19],[8,18],[6,18],[6,17],[5,17],[5,16],[4,16],[4,14],[3,14],[3,8],[4,8],[4,6],[5,6],[5,5],[6,5],[6,4],[8,4],[8,3]]},{name:"Square",width:22,height:22,color:"#9932cc",opacity:1,dashed:[4,4],lines:[[2,2],[20,2],[20,20],[2,20],[2,2]]},{name:"Square",width:22,height:22,color:"#9932cc",opacity:.1,dashed:[4,4],dashOffset:4,lines:[[2,2],[20,2],[20,20],[2,20],[2,2]]}],j=new Map;function D(t,e,i,s){const n=`${t}:${e}:${i}:${s}`;if(j.has(n))return j.get(n);let r=U.filter((i=>i.width===t&&i.height===e));0===r.length&&t%2==0&&e%2==0&&(r=[{name:"Horizontal",color:"#00F",opacity:1,lines:[[0,e/2],[t,e/2]]},{name:"Vertical",color:"#00F",opacity:1,lines:[[t/2,0],[t/2,e]]}]);const a=i+s,o=t*a-s,h=e*a-s,l=document.createElement("canvas"),c=l.getContext("2d");if(l.width=o,l.height=h,0!==s){c.fillStyle="#BBB";for(let e=1;e<t;e++)c.fillRect(e*a-s,0,1,h);for(let t=1;t<e;t++)c.fillRect(0,t*a-s,o,1)}return r.forEach((t=>{c.lineDashOffset=t.dashOffset||0,c.setLineDash(t.dashed||[1]),c.strokeStyle=t.color,c.globalAlpha=t.opacity,c.lineWidth=1,c.fillStyle="transparent",c.beginPath(),t.lines.forEach(((t,e)=>{0===e?c.moveTo(t[0]*(i+s)-.5,t[1]*(i+s)-.5):c.lineTo(t[0]*(i+s)-.5,t[1]*(i+s)-.5)})),c.stroke()})),j.set(n,l),l}var T,K=function(t,e,i,s,n,r){function a(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var o,h=s.kind,l="getter"===h?"get":"setter"===h?"set":"value",c=!e&&t?s.static?t:t.prototype:null,d=e||(c?Object.getOwnPropertyDescriptor(c,s.name):{}),p=!1,y=i.length-1;y>=0;y--){var u={};for(var f in s)u[f]="access"===f?{}:s[f];for(var f in s.access)u.access[f]=s.access[f];u.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");r.push(a(t||null))};var g=(0,i[y])("accessor"===h?{get:d.get,set:d.set}:d[l],u);if("accessor"===h){if(void 0===g)continue;if(null===g||"object"!=typeof g)throw new TypeError("Object expected");(o=a(g.get))&&(d.get=o),(o=a(g.set))&&(d.set=o),(o=a(g.init))&&n.unshift(o)}else(o=a(g))&&("field"===h?n.unshift(o):d[l]=o)}c&&Object.defineProperty(c,s.name,d),p=!0},G=function(t,e,i){for(var s=arguments.length>2,n=0;n<e.length;n++)i=s?e[n].call(t,i):e[n].call(t);return s?i:void 0};function F([t,e,i,s]){return`rgba(${t}, ${e}, ${i}, ${s})`}!function(t){t[t.Group=0]="Group",t[t.Pixel=1]="Pixel",t[t.ColorUpdate=2]="ColorUpdate",t[t.ColorAdd=3]="ColorAdd",t[t.ColorRemove=4]="ColorRemove",t[t.LayerAdd=5]="LayerAdd",t[t.LayerRemove=6]="LayerRemove",t[t.LayerName=7]="LayerName",t[t.LayerLock=8]="LayerLock",t[t.LayerUnlock=9]="LayerUnlock",t[t.LayerExport=10]="LayerExport",t[t.LayerVisible=11]="LayerVisible",t[t.LayerOpacity=12]="LayerOpacity"}(T||(T={}));(()=>{let t,e,i,s,n,r,a,o,h,l=[m({selector:"pg-input-pixel-editor",style:S.A,template:'<div part="wrapper" tabindex="0"> <canvas part="canvas" draggable="false"></canvas> </div>'})],c=[],d=HTMLElement,p=[],y=[],u=[],f=[],g=[],x=[],v=[],w=[],E=[],M=[],z=[],U=[],j=[],N=[];(class extends d{static{e=this}static{const m="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;i=[b(L)],s=[b(L)],n=[b(L)],r=[b(L)],a=[b(C)],o=[b()],h=[function(t,e){const i=e.name,s=i.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,i,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${s}]`))}})}))}],K(null,null,i,{kind:"field",name:"width",static:!1,private:!1,access:{has:t=>"width"in t,get:t=>t.width,set:(t,e)=>{t.width=e}},metadata:m},p,y),K(null,null,s,{kind:"field",name:"height",static:!1,private:!1,access:{has:t=>"height"in t,get:t=>t.height,set:(t,e)=>{t.height=e}},metadata:m},u,f),K(null,null,n,{kind:"field",name:"size",static:!1,private:!1,access:{has:t=>"size"in t,get:t=>t.size,set:(t,e)=>{t.size=e}},metadata:m},g,x),K(null,null,r,{kind:"field",name:"gridSize",static:!1,private:!1,access:{has:t=>"gridSize"in t,get:t=>t.gridSize,set:(t,e)=>{t.gridSize=e}},metadata:m},v,w),K(null,null,a,{kind:"field",name:"transparent",static:!1,private:!1,access:{has:t=>"transparent"in t,get:t=>t.transparent,set:(t,e)=>{t.transparent=e}},metadata:m},E,M),K(null,null,o,{kind:"field",name:"placeholder",static:!1,private:!1,access:{has:t=>"placeholder"in t,get:t=>t.placeholder,set:(t,e)=>{t.placeholder=e}},metadata:m},z,U),K(null,null,h,{kind:"field",name:"$canvas",static:!1,private:!1,access:{has:t=>"$canvas"in t,get:t=>t.$canvas,set:(t,e)=>{t.$canvas=e}},metadata:m},j,N),K(null,t={value:e},l,{kind:"class",name:e.name,metadata:m},null,c),e=t.value,m&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:m}),G(e,c)}width=G(this,p,10);height=(G(this,y),G(this,u,10));size=(G(this,f),G(this,g,10));gridSize=(G(this,x),G(this,v,1));transparent=(G(this,w),G(this,E,!1));placeholder=(G(this,M),G(this,z,""));$canvas=(G(this,U),G(this,j,void 0));#t=(G(this,N),0);#e=!1;#i=!1;#s=-1;#n=-1;#r=-1;#a=-1;#o=-1;#h=0;#l=[];#c=!1;#d=!1;#p=!1;#y=[];#u=[];#f=[];#g;#m=[[0,0,0,0],[0,0,0,1]];#x;#v;#w;#b;#L;#C;#E;#S;connectedCallback(){const t=this.$canvas.getContext("2d");null!==t&&(this.#g=t,this.$canvas.addEventListener("contextmenu",this.handleContextMenu.bind(this)),this.$canvas.addEventListener("doubleclick",this.handleDoubleClick.bind(this)),this.$canvas.addEventListener("pointerdown",this.handlePointerDown.bind(this)),this.$canvas.addEventListener("pointerenter",this.handlePointerEnter.bind(this)),this.$canvas.addEventListener("pointerleave",this.handlePointerLeave.bind(this)),this.$canvas.addEventListener("keydown",this.handleKeyDown.bind(this)),this.$canvas.addEventListener("keyup",this.handleKeyUp.bind(this)))}render(t){(t.width||t.height||t.size||t.transparent)&&this.#P()}#M=!0;#P(){const t=this.size+this.gridSize,e=this.width*t-this.gridSize,i=this.height*t-this.gridSize;if(this.$canvas.width=e,this.$canvas.height=i,this.#g.clearRect(0,0,e,i),[this.#x,this.#v]=X(e,i),[this.#w,this.#b]=X(e,i),[this.#L,this.#C]=X(e,i),[this.#E,this.#S]=X(e,i),this.transparent)for(let e=0;e<this.height;e++)for(let i=0;i<this.width;i++)this.#v.fillStyle=k,this.#v.fillRect(i*t,e*t,this.size+1,this.size+1),this.#v.fillStyle="#DDD",this.#v.fillRect(i*t+Math.ceil(this.size/2),e*t,Math.floor(this.size/2),Math.floor(this.size/2)),this.#v.fillRect(i*t,e*t+Math.floor(this.size/2),Math.ceil(this.size/2),Math.ceil(this.size/2));else this.#v.clearRect(0,0,e,i);this.#M?(this.#h=0,this.#l=[{name:"Layer 1",export:!0,locked:!1,visible:!0,opacity:1}],this.#y=[H(this.width,this.height)],this.#M=!1,this.#u=[],this.#f=[]):this.#z(),this.#$()}#z(){const t=this.#y.toReversed(),e=t.length;for(let i=0;i<this.height;i++){if(i>=t[0].length)for(let i=0;i<e;i++)t[i].push(new Array(this.width).fill(0));for(let s=0;s<this.width;s++){if(s>=t[0][i].length)for(let s=0;s<e;s++)t[s][i].push(0);for(let n=0;n<e;n++)if(0!==t[n][i][s]){this.#k(s,i,t[n][i][s]);break}}}}#R(){const t=this.#y.map((t=>function(t,e={}){let i,s,n,r=1,a=0,o=0;if(e.width){if(i=t,s=e.width,n=i.length/s,n%1!=0)throw new Error(`Invalid bitmask width. ${n} = ${i.length} / ${s}`)}else{if(!(t[0]instanceof Array))throw new Error("options.width is required for 1 dimensional array.");i=t.flat(),s=t[0].length,n=t.length}e.scale&&(r=e.scale),e.offsetX&&(a=e.offsetX),e.offsetY&&(o=e.offsetY);const h=s+2,l=Array(h*(n+2)).fill(0);function c(t,e){return(e+1)*h+(t+1)}for(let t=0;t<n;++t)for(let e=0;e<s;++e)l[c(e,t)]=i[Y(e,t,s)];const d=s*(n+1),p=Array(d+(s+1)*n).fill(0).map((()=>({x:0,y:0,next:void 0})));function y(t,e){return e*s+t}function u(t,e){return d+e*(s+1)+t}const f=new Set;function g(t,e,i){t.x=e,t.y=i,f.add(t)}function m(t){for(var e=t.next;void 0!==e&&e!==t;e=e.next)f.delete(e);void 0!==e&&f.add(t)}for(let t=0;t<n;++t)for(let e=0;e<s;++e)if(1==l[c(e,t)]){if(0==l[c(e-1,t)]){const i=p[u(e,t)];g(i,e,t+1),l[c(e-1,t-1)]?i.next=p[y(e-1,t)]:l[c(e,t-1)]?i.next=p[u(e,t-1)]:i.next=p[y(e,t)],m(i)}if(0==l[c(e+1,t)]){const i=p[u(e+1,t)];g(i,e+1,t),l[c(e+1,t+1)]?i.next=p[y(e+1,t+1)]:l[c(e,t+1)]?i.next=p[u(e+1,t+1)]:i.next=p[y(e,t+1)],m(i)}if(0==l[c(e,t-1)]){const i=p[y(e,t)];g(i,e,t),l[c(e+1,t-1)]?i.next=p[u(e+1,t-1)]:l[c(e+1,t)]?i.next=p[y(e+1,t)]:i.next=p[u(e+1,t)],m(i)}if(0==l[c(e,t+1)]){const i=p[y(e,t+1)];g(i,e+1,t+1),l[c(e-1,t+1)]?i.next=p[u(e,t+1)]:l[c(e-1,t)]?i.next=p[y(e-1,t+1)]:i.next=p[u(e,t)],m(i)}}for(const t of f){let e=t;do{e.next&&(e.next.type=e.x==e?.next?.x?"V":"H",e=e.next)}while(e!==t)}for(let t of f){let e=t;do{if(e.type!=e.next?.type)for(;e.next?.type==e.next?.next?.type;)e.next===t&&(f.delete(t),t=e.next.next,f.add(t)),e.next=e.next?.next;e=e.next}while(e!==t)}let x="";for(const t of f){x+=`M${t.x*r},${t.y*r}`;for(var v=t.next;v!=t;v=v?.next)"H"==v?.type?x+=`H${v?.x*r+a}`:"V"==v?.type&&(x+=`V${v?.y*r+o}`);x+="Z"}return x}(t,{scale:1})));console.log("change:",t),this.dispatchEvent(new CustomEvent("change",{detail:{value:t}}))}#A=0;#O(){clearInterval(this.#A),this.#A=window.setTimeout(this.#R.bind(this),1e3)}#k(t,e,i){if(t>=this.width||t<0)return;if(e>=this.height||e<0)return;const s=this.size+this.gridSize;this.#g.clearRect(t*s,e*s,this.size,this.size),this.#b.clearRect(t*s,e*s,this.size,this.size),this.#C.clearRect(t*s,e*s,this.size,this.size),0!==this.#m[i][3]&&(this.#b.fillStyle=k,this.#b.fillRect(t*s-this.gridSize+1,e*s-this.gridSize+1,this.size+2*this.gridSize-2,this.size+2*this.gridSize-2),this.#b.fillStyle=F(this.#m[i]),this.#b.fillRect(t*s+1,e*s+1,this.size-2,this.size-2)),0!==this.#m[i][3]&&(this.#C.fillStyle=F(this.#m[i]),this.#C.fillRect(t*s,e*s,this.size,this.size)),this.#g.drawImage(this.#x,t*s,e*s,this.size+2,this.size+2,t*s,e*s,this.size+2,this.size+2),this.#g.drawImage(this.#i?this.#w:this.#L,t*s,e*s,this.size+2,this.size+2,t*s,e*s,this.size+2,this.size+2),this.#y[this.#h][e][t]=i,this.#O()}#H(){for(let t=0;t<this.height;t++)for(let e=0;e<this.width;e++)this.#k(e,t,this.#y[this.#h][t][e])}#I(t,e,i){const s=this.size+this.gridSize,n=this.width*s-this.gridSize,r=this.height*s-this.gridSize,{minX:a,maxX:o,minY:h,maxY:l}=t.reduce(((t,s)=>({minX:Math.min(t.minX,s.x,e),maxX:Math.max(t.maxX,s.x,e),minY:Math.min(t.minY,s.y,i),maxY:Math.max(t.maxY,s.y,i)})),{minX:this.width,maxX:0,minY:this.height,maxY:0}),c=a*s,d=h*s,p=(o-a+1)*s,y=(l-h+1)*s;this.#g.clearRect(c,d,p,y),this.#g.drawImage(this.#x,c,d,p,y,c,d,p,y),this.#g.drawImage(this.#w,c,d,p,y,c,d,p,y),this.#S.clearRect(0,0,n,r),t.forEach((({x:t,y:e})=>{this.#S.fillStyle=k,this.#S.beginPath(),this.#S.arc(t*s+5,e*s+5,3,0,2*Math.PI),this.#S.closePath(),this.#S.fill(),this.#S.fillStyle="#1B79C8",this.#S.beginPath(),this.#S.arc(t*s+5,e*s+5,2,0,2*Math.PI),this.#S.closePath(),this.#S.fill()})),this.#g.drawImage(this.#E,c,d,p,y,c,d,p,y),this.dispatchEvent(new CustomEvent("debug",{detail:{x:c,y:d,width:p,height:y,canvas:this.$canvas,context:this.#g,editLayer:this.#w,noEditLayer:this.#L,baseLayer:this.#x,previewLayer:this.#E}}))}handleKeyDown(t){switch(console.log(t.shiftKey,t.ctrlKey,t.altKey,t.key),t.key){case" ":console.log("space");break;case"Escape":console.log("escape")}}handleKeyUp(t){}handleContextMenu(t){t?.preventDefault()}handleDoubleClick(t){t?.preventDefault()}#Y;#X;handlePointerDown(t){if(1!==t.buttons&&32!==t.buttons)return t.preventDefault(),void t.stopPropagation();this.#p=t.altKey,this.#c=t.ctrlKey,this.#d=t.shiftKey;const e=this.$canvas.getBoundingClientRect(),i=this.size+this.gridSize;let s=Math.floor((t.clientX-e.left)/i),n=Math.floor((t.clientY-e.top)/i);if(s===this.#a&&n===this.#o)return;s>=this.width&&(s=this.width-1),n>=this.height&&(n=this.height-1),this.#e=!0,this.#s=this.#y[this.#h][n][s],this.#n=s,this.#r=n,this.#a=s,this.#o=n;const r=32===t.buttons?0:1;if(0===this.#t)this.#k(s,n,r),this.#y[this.#h][n][s]=r;console.log(this.#t,s,n),this.#Y=this.handlePointerMove.bind(this),document.addEventListener("pointermove",this.#Y),this.#X=this.handlePointerUp.bind(this),document.addEventListener("pointerup",this.#X)}#U=!1;handlePointerUpGlobal(){this.#U&&(this.handlePointerUp({clientX:100,clientY:100}),this.cleanupPointerGlobal())}cleanupPointerGlobal(){document.removeEventListener("pointermove",this.#Y),document.removeEventListener("pointerup",this.#X)}handlePointerUp(t){const e=this.$canvas.getBoundingClientRect(),i=this.size+this.gridSize;let s=Math.floor((t.clientX-e.left)/i),n=Math.floor((t.clientY-e.top)/i);if(s===this.#n&&n===this.#r&&1===this.#s){if(0===this.#t)this.#k(s,n,0),this.#y[this.#h][n][s]=0}else switch(this.#t){case 1:R(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 2:A(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 3:O(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 4:case 5:$(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}))}this.#a=-1,this.#o=-1,this.#e=!1,this.cleanupPointerGlobal()}handlePointerMove(t){const e=this.$canvas;if(this.#e){this.#p=t.altKey,this.#c=t.ctrlKey,this.#d=t.shiftKey;const s=this.#y,n=e.getBoundingClientRect(),r=this.size+this.gridSize,a=[],o=this.#n,h=this.#r,l=this.#a,c=this.#o;if("function"==typeof t.getCoalescedEvents){const e=t.getCoalescedEvents();for(const t of e){let e=Math.floor((t.clientX-n.left)/r),i=Math.floor((t.clientY-n.top)/r);e===l&&i===c||a.push([e,i])}}else{let e=Math.floor((t.clientX-n.left)/r),i=Math.floor((t.clientY-n.top)/r);if(e===l&&i===c)return;a.push([e,i])}const d=32===t.buttons?0:1;if(0===a.length)return;const[p,y]=a.at(-1);switch(this.#a=p,this.#o=y,this.#t){case 0:for(var i of a)this.#k(i[0],i[1],d),s[this.#h][i[1]][i[0]]=d;break;case 1:this.#I(R(o,h,p,y),l,c);break;case 2:this.#I(A(o,h,p,y),l,c);break;case 3:this.#I(O(o,h,p,y),l,c);break;case 4:case 5:this.#I($(o,h,p,y),l,c)}}}handlePointerEnter(t){this.#e||this.#i||(this.#i=!0,this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#i?this.#w:this.#L,0,0)),this.#U=!1}handlePointerLeave(t){this.#e?this.#i&&(this.#U=!0):(this.#i=!1,this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#i?this.#w:this.#L,0,0))}#$(){this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#L,0,0)}mergeColor(t,e){}clear(){const t=H(this.width,this.height);!function(t,e){const i=[],s=t[0].length,n=t.length,r=e[0].length,a=e.length,o=Math.max(s,r),h=Math.max(n,a);for(let s=0;s<h;s++)for(let n=0;n<o;n++){const r=e&&e[s]&&e[s][n],a=t&&t[s]&&t[s][n];r!==a&&i.push([n,s,a,r])}}(this.#y[this.#h],t);this.#u.push({type:T.Group,data:{name:"Clear"}}),this.#u.push({type:T.Pixel,data:{pixels:[],layer:this.#h}}),this.#y=[H(this.width,this.height)],this.#$()}reset(){this.#M=!0,this.#P()}clearHistory(){this.#u=[],this.#f=[]}applyTemplate(t){this.#y=[t],this.#H()}flipHorizontal(){const t=P(this.#y[this.#h]),e=t[0].length-1;I(this.#y[this.#h],((i,s)=>{t[s][i]=this.#y[this.#h][s][e-i]})),this.#y[this.#h]=t}flipVertical(){const t=P(this.#y[this.#h]),e=t.length-1;I(this.#y[this.#h],((i,s)=>{t[this.#h][s][i]=this.#y[e-s][i]})),this.#y[this.#h]=t}move(t,e){const i=H(this.width,this.height);for(let t=0;t<this.height;t++)i[t].fill(0);I(this.#y[this.#h],((s,n)=>{n-e<0||s-t<0||n-e>=this.height||s-t>=this.width||(i[n][s]=this.#y[this.#h][n-e][s-t])})),this.#y[this.#h]=i}invert(){this.#m.length>2||(I(this.#y[this.#h],((t,e)=>{this.#y[this.#h][e][t]=0===this.#y[this.#h][e][t]?1:0})),this.#H())}applyGuides(){const t=D(this.width,this.height,this.size,this.gridSize);this.#v.drawImage(t,0,0)}clearGuides(){}undo(){const t=this.#u.pop();if(t&&t.type===T.Pixel)this.#f.push(t),t.data.pixels.forEach((t=>{const[e,i]=t;this.#y[this.#h][i][e]=t[2]}))}redo(){}rotateClockwise(){this.#j(!1)}rotateCounterclockwise(){this.#j(!0)}#j(t=!1){const e=P(this.#y[this.#h]);if(t){const t=this.#y[0].map(((t,e)=>this.#y.map((t=>t[t.length-1-e]))));for(let i=0;i<this.height;i++)for(let s=0;s<this.width;s++)e[i][s]=t[this.#h][i][s]}else{const t=this.#y[0].map(((t,e)=>this.#y.map((t=>t[e])).reverse()));for(let i=0;i<this.height;i++)for(let s=0;s<this.width;s++)e[i][s]=t[this.#h][i][s]}this.#y[this.#h]=e}hasUndo(){return 0!==this.#u.length}hasRedo(){return 0!==this.#f.length}inputModePixel(){this.#t=0}inputModeLine(){this.#t=1}inputModeRectangle(){this.#t=2}inputModeRectangleOutline(){this.#t=3}inputModeEllipse(){this.#t=4}inputModeEllipseOutline(){this.#t=5}async save(t={}){const e={width:this.width,height:this.height,transparent:this.transparent,colors:this.#m,layers:this.#l,data:this.#y};!0===t.history&&(e.undo=this.#u,e.redo=this.#f);for(let t=0;t<e.data.length;t++)for(let i=e.data[t].length-1;i>=0;i--)if(i>=this.height)e.data[t].pop();else for(let s=e.data[t][i].length-1;s>=0;s--)s>=this.width&&e.data[t][i].pop();return e}async open(t){if("object"!=typeof t)return["json must be type object"];const e=[],i=Object.keys(t);["width","height","transparent","colors","layers","data"].forEach((t=>{i.includes(t)||e.push(`JSON key '${t}' required.`)})),this.width=t.width,this.height=t.height,this.transparent=t.transparent,this.#m=t.colors,this.#l=t.layers,this.#y=t.data,t.undo&&(this.#u=t.undo),t.redo&&(this.#f=t.redo),this.#P()}})})()})();
1
+ (()=>{"use strict";var t={314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var i="",s=void 0!==e[5];return e[4]&&(i+="@supports (".concat(e[4],") {")),e[2]&&(i+="@media ".concat(e[2]," {")),s&&(i+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),i+=t(e),s&&(i+="}"),e[2]&&(i+="}"),e[4]&&(i+="}"),i})).join("")},e.i=function(t,i,s,n,r){"string"==typeof t&&(t=[[null,t,void 0]]);var a={};if(s)for(var o=0;o<this.length;o++){var h=this[o][0];null!=h&&(a[h]=!0)}for(var l=0;l<t.length;l++){var c=[].concat(t[l]);s&&a[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),i&&(c[2]?(c[1]="@media ".concat(c[2]," {").concat(c[1],"}"),c[2]=i):c[2]=i),n&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=n):c[4]="".concat(n)),e.push(c))}},e}},601:t=>{t.exports=function(t){return t[1]}},713:(t,e,i)=>{i.d(e,{A:()=>h});var s=i(601),n=i.n(s),r=i(314),a=i.n(r)()(n());a.push([t.id,':host {\n display: inline-flex;\n}\n\n[part="wrapper"] {\n display: flex;\n position: relative;\n outline: 0;\n}\n\n[part="wrapper"]:focus-visible::before {\n pointer-events: none;\n content: \'\';\n position: absolute;\n top: -1px;\n right: -1px;\n bottom: -1px;\n left: -1px;\n border-radius: 0.125rem;\n box-shadow: 0 0 0 3px var(--pg-focus-color, rgb(79, 143, 249, 0.5));\n}\n\ncanvas {\n touch-action: none;\n user-select: none;\n outline: 0;\n}',""]);var o=new CSSStyleSheet;o.replaceSync(a.toString());const h=o}},e={};function i(s){var n=e[s];if(void 0!==n)return n.exports;var r=e[s]={id:s,exports:{}};return t[s](r,r.exports,i),r.exports}i.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return i.d(e,{a:e}),e},i.d=(t,e)=>{for(var s in e)i.o(e,s)&&!i.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:e[s]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const s=Symbol("addObserver"),n=Symbol("removeObserver"),r=Symbol("getObservers"),a=Symbol("isProxy"),o=Symbol("getTarget"),h=["fill","pop","push","reverse","shift","sort","splice","unshift"],l=new Map;function c(t){return new Proxy(t,{get(e,i){if("symbol"==typeof i){switch(i){case a:return!0;case o:return e;case r:return l.has(t);case s:return(e,i)=>{l.has(t)?l.get(t).has(e)?l.get(t).get(e).push(i):l.get(t).set(e,[i]):l.set(t,new Map([[e,[i]]]))};case n: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,i)}throw new Error("Unsupported symbol")}if(i in e){if(!Number.isNaN(Number(i)))return"object"==typeof e[i]?c(e[i]):e[i];if("copyWithin"===i)throw new Error("Unsupported array method copyWithin");if(h.includes(i))return l.has(e)?function(){const t=Array.prototype[i].apply(e,arguments);return l.get(e).forEach(((t,s)=>{t.forEach((t=>{t(e,i,arguments)}))})),t}:Reflect.get(e,i);if(e[i]instanceof Array)return c(e[i])}return Reflect.get(e,i)},set(t,e,i){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,i);if(l.has(t)){l.get(t).forEach(((t,s)=>{t.forEach((t=>{t(e,i)}))}))}return Reflect.set(t,e,i)}})}window.observers=l;class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),p=Symbol("template"),u=Symbol("style"),y=Symbol("parent");function f(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 m(t={}){return function(e,i){if("class"!==i.kind)throw new Error("@Component() can only decorate a class");var s,n;Reflect.defineProperty(e,"name",{value:t.selector,writable:!1,configurable:!1}),!e.prototype[y]||e.prototype[y][e.prototype[y].length-1]instanceof Object.getPrototypeOf(e)?e.prototype instanceof HTMLElement&&(e.prototype[y]=[e.prototype],e.prototype[u]=t.style?[t.style]:[],e.prototype[p]=t.template||""):(e.prototype[y].push(e.prototype),e.prototype[u].push(t.style),e.prototype[p]=(s=e.prototype[p],(n=t.template||null)&&n.match(/<parent\/>/)?n.replace(/<parent\/>/,s):`${s}${n||""}`));const r=e.prototype.connectedCallback||(()=>{}),a=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[p]||"";const i=document.importNode(t.content,!0),s=this.attachShadow({mode:"open"});s.adoptedStyleSheets=e.prototype[u].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),s.appendChild(i)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const i=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&i.add(t.localName);const s=Array.from(i.values()).map((t=>customElements.get(t)?Promise.resolve():customElements.whenDefined(t))),n=()=>{this[y].map((t=>{t.render&&t.render.call(this,e.observedAttributes?e.observedAttributes.reduce(((t,e)=>(t[g(e)]=!0,t)),{}):{})}))};0===s.length?(this[d]=!0,r.call(this),n()):Promise.all(s).then((()=>{this[d]=!0,r.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));n()}))},e.prototype.disconnectedCallback=function(){a.call(this)},e.prototype.attributeChangedCallback=function(t,e,i){this[g(t)]=i},i.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${i.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function x(t){return!!t&&t.constructor===Array}function v(t,e){t[d]&&t[y].map((i=>{i.render&&i.render.call(t,{[e]:!0})}))}function w(t){return null===t?"null":x(t)?"array":typeof t}function b(t){return function(e,i){const s=i.name,n=Symbol(s),h=Symbol(`${s}:type`),l=Symbol(`${s}:meta`);return i.addInitializer((function(){Reflect.defineProperty(this,s,{get:()=>"object"===this[h]||"array"===this[h]?this[n][a]?this[n]:c(this[n]):this[n],set:e=>{const i=w(t?t(e):e);if("index"!==s&&this[h]!==i&&"null"!==this[h]&&"null"!==i)throw new Error(`@Prop() ${s} with type '${this[h]}' cannot be set to ${i}.`);if("array"===this[h]){if(!x(e))throw new PropError(`Array "${s}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,s)?.set);if(this[n]===e)throw new Error("Setting an array to itself is not allowed.");const t=c(this[n]);if(t[r]){const i=e[a]?(l=e)[a]&&l[o]:e;t.splice(0,this[n].length,...i)}else this[n]=e}else this[n]=t?t(e):e,v(this,s);var l}})})),function(e){if(void 0===e&&"index"!==s)throw new Error(`@Prop() ${s} must have an initial value defined.`);if(void 0!==e&&"index"===s)throw new Error("@Prop() index must not have an initial value defined.");if(!0===e)throw new Error(`@Prop() ${s} boolean must initialize to false.`);if(!i.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,i=f(s);e[s]||(t.observedAttributes.push(i),e[s]=n)}return this[h]=w(e),"array"===this[h]?(this[n]=e,new Proxy(e,{get:(t,e)=>e===E?this[l]:(console.log("errr???"),Reflect.get(this[n],e)),set:(t,e,i)=>{if(e===E)return this[l]=i,!0;const r=Reflect.set(t,e,i);return"length"===e&&this[n].length===i||v(this,s),this[n]=i,r}})):(this[n]=t?t(this.getAttribute(s)??e):this.getAttribute(s)??e,this[n])}}}function L(t){return parseInt(`${t}`,10)}function C(t){return""===t||!0===t||null!==t&&!1!==t&&(t||!0)}Symbol("hasProxy");const E=Symbol("meta");var S=i(713);function P(t){const e=[];for(let i=0;i<t.length;i++){e.push([]);for(let s=0;s<t[0].length;s++)e[i].push(t[i][s])}return e}function M(t,e,i,s){return function(t,e,i){return Math.sqrt(Math.pow(e*i,2)+Math.pow(t,2))}(t,e,s)<=i}function z(t,e,i,s){return function(t,e,i,s){return M(t,e,i,s)&&!(M(t+1,e,i,s)&&M(t-1,e,i,s)&&M(t,e+1,i,s)&&M(t,e-1,i,s))}(t=-.5*(i-2*(t+.5)),e=-.5*(s-2*(e+.5)),i/2,i/s)}function $(t,e,i,s){return Math.abs(t-i)===Math.abs(e-s)&&Math.abs(t-i)?(console.log("circle",Math.abs(t-i),Math.abs(e-s)),function(t,e,i,s){const n=Math.abs(t-i),r=Math.abs(e-s),a=Math.min(t,i),o=Math.min(e,s),h=[];for(let t=0;t<r;t++)for(let e=0;e<n;e++)z(e,t,n,r)&&h.push({x:e+a,y:t+o});return h}(t,e,i+1,s+1)):function(t,e,i,s){const n=[];var r,a=Math.abs(i-t),o=Math.abs(s-e),h=1&o,l=4*(1-a)*o*o,c=4*(h+1)*a*a,d=l+c+h*a*a;t>i&&(t=i,i+=a),e>s&&(e=s),s=(e+=o+1>>1)-h,a*=8*a,h=8*o*o;do{n.push({x:i,y:e}),n.push({x:t,y:e}),n.push({x:t,y:s}),n.push({x:i,y:s}),(r=2*d)<=c&&(e++,s--,d+=c+=a),(r>=l||2*d>c)&&(t++,i--,d+=l+=h)}while(t<=i);for(;e-s<=o;)n.push({x:t-1,y:e}),n.push({x:i+1,y:e++}),n.push({x:t-1,y:s}),n.push({x:i+1,y:s--});return n}(t,e,i,s)}const k="#FFFFFF";function R(t,e,i,s){const n=[],r=Math.abs(i-t),a=Math.abs(s-e),o=t<i?1:-1,h=e<s?1:-1;let l=r-a;for(;n.push({x:t,y:e}),t!==i||e!==s;){var c=2*l;c>-a&&(l-=a,t+=o),c<r&&(l+=r,e+=h)}return n}function A(t,e,i,s){const n=[],r=Math.min(t,i),a=Math.min(e,s);for(var o=Math.abs(i-t)+1,h=Math.abs(s-e)+1,l=a;l<a+h;l++)for(var c=r;c<r+o;c++)n.push({x:c,y:l});return n}function O(t,e,i,s){const n=[],r=Math.min(t,i),a=Math.min(e,s);for(var o=Math.abs(i-t),h=Math.abs(s-e),l=a;l<=a+h;l++)n.push({x:r,y:l}),n.push({x:r+o,y:l});for(var c=r+1;c<=r+o-1;c++)n.push({x:c,y:a}),n.push({x:c,y:a+h});return n}function H(t,e){let i=[];for(let s=0;s<e;s++){const e=[];for(let i=0;i<t;i++)e.push(0);i.push(e)}return i}function I(t,e){for(let i=0;i<t.length;i++)for(let s=0;s<t[0].length;s++)e(s,i,t[i][s])}function Y(t,e,i){return e*i+t}function X(t,e){const i=document.createElement("canvas");return i.width=t,i.height=e,[i,i.getContext("2d")]}const U=[{name:"Circle Outer",width:22,height:22,color:"#F00",opacity:1,lines:[[7,1],[15,1],[15,2],[17,2],[17,3],[18,3],[18,4],[19,4],[19,5],[20,5],[20,7],[21,7],[21,15],[20,15],[20,17],[19,17],[19,18],[18,18],[18,19],[17,19],[17,20],[15,20],[15,21],[7,21],[7,20],[5,20],[5,19],[4,19],[4,18],[3,18],[3,17],[2,17],[2,15],[1,15],[1,7],[2,7],[2,5],[3,5],[3,4],[4,4],[4,3],[5,3],[5,2],[7,2],[7,1]]},{name:"Circle Inner",width:22,height:22,color:"#00F",opacity:1,lines:[[8,3],[14,3],[14,4],[16,4],[16,5],[17,5],[17,6],[18,6],[18,8],[19,8],[19,14],[18,14],[18,16],[17,16],[17,17],[16,17],[16,18],[14,18],[14,19],[8,19],[8,18],[6,18],[6,17],[5,17],[5,16],[4,16],[4,14],[3,14],[3,8],[4,8],[4,6],[5,6],[5,5],[6,5],[6,4],[8,4],[8,3]]},{name:"Square",width:22,height:22,color:"#9932cc",opacity:1,dashed:[4,4],lines:[[2,2],[20,2],[20,20],[2,20],[2,2]]},{name:"Square",width:22,height:22,color:"#9932cc",opacity:.1,dashed:[4,4],dashOffset:4,lines:[[2,2],[20,2],[20,20],[2,20],[2,2]]}],j=new Map;function D(t,e,i,s){const n=`${t}:${e}:${i}:${s}`;if(j.has(n))return j.get(n);let r=U.filter((i=>i.width===t&&i.height===e));0===r.length&&t%2==0&&e%2==0&&(r=[{name:"Horizontal",color:"#00F",opacity:1,lines:[[0,e/2],[t,e/2]]},{name:"Vertical",color:"#00F",opacity:1,lines:[[t/2,0],[t/2,e]]}]);const a=i+s,o=t*a-s,h=e*a-s,l=document.createElement("canvas"),c=l.getContext("2d");if(l.width=o,l.height=h,0!==s){c.fillStyle="#BBB";for(let e=1;e<t;e++)c.fillRect(e*a-s,0,1,h);for(let t=1;t<e;t++)c.fillRect(0,t*a-s,o,1)}return r.forEach((t=>{c.lineDashOffset=t.dashOffset||0,c.setLineDash(t.dashed||[1]),c.strokeStyle=t.color,c.globalAlpha=t.opacity,c.lineWidth=1,c.fillStyle="transparent",c.beginPath(),t.lines.forEach(((t,e)=>{0===e?c.moveTo(t[0]*(i+s)-.5,t[1]*(i+s)-.5):c.lineTo(t[0]*(i+s)-.5,t[1]*(i+s)-.5)})),c.stroke()})),j.set(n,l),l}var T,K=function(t,e,i,s,n,r){function a(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var o,h=s.kind,l="getter"===h?"get":"setter"===h?"set":"value",c=!e&&t?s.static?t:t.prototype:null,d=e||(c?Object.getOwnPropertyDescriptor(c,s.name):{}),p=!1,u=i.length-1;u>=0;u--){var y={};for(var f in s)y[f]="access"===f?{}:s[f];for(var f in s.access)y.access[f]=s.access[f];y.addInitializer=function(t){if(p)throw new TypeError("Cannot add initializers after decoration has completed");r.push(a(t||null))};var g=(0,i[u])("accessor"===h?{get:d.get,set:d.set}:d[l],y);if("accessor"===h){if(void 0===g)continue;if(null===g||"object"!=typeof g)throw new TypeError("Object expected");(o=a(g.get))&&(d.get=o),(o=a(g.set))&&(d.set=o),(o=a(g.init))&&n.unshift(o)}else(o=a(g))&&("field"===h?n.unshift(o):d[l]=o)}c&&Object.defineProperty(c,s.name,d),p=!0},G=function(t,e,i){for(var s=arguments.length>2,n=0;n<e.length;n++)i=s?e[n].call(t,i):e[n].call(t);return s?i:void 0};function F([t,e,i,s]){return`rgba(${t}, ${e}, ${i}, ${s})`}!function(t){t[t.Group=0]="Group",t[t.Pixel=1]="Pixel",t[t.ColorUpdate=2]="ColorUpdate",t[t.ColorAdd=3]="ColorAdd",t[t.ColorRemove=4]="ColorRemove",t[t.LayerAdd=5]="LayerAdd",t[t.LayerRemove=6]="LayerRemove",t[t.LayerName=7]="LayerName",t[t.LayerLock=8]="LayerLock",t[t.LayerUnlock=9]="LayerUnlock",t[t.LayerExport=10]="LayerExport",t[t.LayerVisible=11]="LayerVisible",t[t.LayerOpacity=12]="LayerOpacity"}(T||(T={}));(()=>{let t,e,i,s,n,r,a,o,h,l=[m({selector:"pg-input-pixel-editor",style:S.A,template:'<div part="wrapper" tabindex="0"> <canvas part="canvas" draggable="false"></canvas> </div>'})],c=[],d=HTMLElement,p=[],u=[],y=[],f=[],g=[],x=[],v=[],w=[],E=[],M=[],z=[],U=[],j=[],N=[];(class extends d{static{e=this}static{const m="function"==typeof Symbol&&Symbol.metadata?Object.create(d[Symbol.metadata]??null):void 0;i=[b(L)],s=[b(L)],n=[b(L)],r=[b(L)],a=[b(C)],o=[b()],h=[function(t,e){const i=e.name,s=i.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,i,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${s}]`))}})}))}],K(null,null,i,{kind:"field",name:"width",static:!1,private:!1,access:{has:t=>"width"in t,get:t=>t.width,set:(t,e)=>{t.width=e}},metadata:m},p,u),K(null,null,s,{kind:"field",name:"height",static:!1,private:!1,access:{has:t=>"height"in t,get:t=>t.height,set:(t,e)=>{t.height=e}},metadata:m},y,f),K(null,null,n,{kind:"field",name:"size",static:!1,private:!1,access:{has:t=>"size"in t,get:t=>t.size,set:(t,e)=>{t.size=e}},metadata:m},g,x),K(null,null,r,{kind:"field",name:"gridSize",static:!1,private:!1,access:{has:t=>"gridSize"in t,get:t=>t.gridSize,set:(t,e)=>{t.gridSize=e}},metadata:m},v,w),K(null,null,a,{kind:"field",name:"transparent",static:!1,private:!1,access:{has:t=>"transparent"in t,get:t=>t.transparent,set:(t,e)=>{t.transparent=e}},metadata:m},E,M),K(null,null,o,{kind:"field",name:"placeholder",static:!1,private:!1,access:{has:t=>"placeholder"in t,get:t=>t.placeholder,set:(t,e)=>{t.placeholder=e}},metadata:m},z,U),K(null,null,h,{kind:"field",name:"$canvas",static:!1,private:!1,access:{has:t=>"$canvas"in t,get:t=>t.$canvas,set:(t,e)=>{t.$canvas=e}},metadata:m},j,N),K(null,t={value:e},l,{kind:"class",name:e.name,metadata:m},null,c),e=t.value,m&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:m}),G(e,c)}width=G(this,p,10);height=(G(this,u),G(this,y,10));size=(G(this,f),G(this,g,10));gridSize=(G(this,x),G(this,v,1));transparent=(G(this,w),G(this,E,!1));placeholder=(G(this,M),G(this,z,""));$canvas=(G(this,U),G(this,j,void 0));#t=(G(this,N),0);#e=!1;#i=!1;#s=-1;#n=-1;#r=-1;#a=-1;#o=-1;#h=0;#l=[];#c=!1;#d=!1;#p=!1;#u=[];#y=[];#f=[];#g;#m=[[0,0,0,0],[0,0,0,1]];#x;#v;#w;#b;#L;#C;#E;#S;connectedCallback(){const t=this.$canvas.getContext("2d");null!==t&&(this.#g=t,this.$canvas.addEventListener("contextmenu",this.handleContextMenu.bind(this)),this.$canvas.addEventListener("doubleclick",this.handleDoubleClick.bind(this)),this.$canvas.addEventListener("pointerdown",this.handlePointerDown.bind(this)),this.$canvas.addEventListener("pointerenter",this.handlePointerEnter.bind(this)),this.$canvas.addEventListener("pointerleave",this.handlePointerLeave.bind(this)),this.$canvas.addEventListener("keydown",this.handleKeyDown.bind(this)),this.$canvas.addEventListener("keyup",this.handleKeyUp.bind(this)))}render(t){(t.width||t.height||t.size||t.transparent)&&this.#P()}#M=!0;#P(){const t=this.size+this.gridSize,e=this.width*t-this.gridSize,i=this.height*t-this.gridSize;if(this.$canvas.width=e,this.$canvas.height=i,this.#g.clearRect(0,0,e,i),[this.#x,this.#v]=X(e,i),[this.#w,this.#b]=X(e,i),[this.#L,this.#C]=X(e,i),[this.#E,this.#S]=X(e,i),this.transparent)for(let e=0;e<this.height;e++)for(let i=0;i<this.width;i++)this.#v.fillStyle=k,this.#v.fillRect(i*t,e*t,this.size+1,this.size+1),this.#v.fillStyle="#DDD",this.#v.fillRect(i*t+Math.ceil(this.size/2),e*t,Math.floor(this.size/2),Math.floor(this.size/2)),this.#v.fillRect(i*t,e*t+Math.floor(this.size/2),Math.ceil(this.size/2),Math.ceil(this.size/2));else this.#v.clearRect(0,0,e,i);this.#M?(this.#h=0,this.#l=[{name:"Layer 1",export:!0,locked:!1,visible:!0,opacity:1}],this.#u=[H(this.width,this.height)],this.#M=!1,this.#y=[],this.#f=[]):this.#z(),this.#$()}#z(){const t=this.#u.toReversed(),e=t.length;for(let i=0;i<this.height;i++){if(i>=t[0].length)for(let i=0;i<e;i++)t[i].push(new Array(this.width).fill(0));for(let s=0;s<this.width;s++){if(s>=t[0][i].length)for(let s=0;s<e;s++)t[s][i].push(0);for(let n=0;n<e;n++)if(0!==t[n][i][s]){this.#k(s,i,t[n][i][s]);break}}}}#R(){const t=this.#u.map((t=>function(t,e={}){let i,s,n,r=1,a=0,o=0;if(e.width){if(i=t,s=e.width,n=i.length/s,n%1!=0)throw new Error(`Invalid bitmask width. ${n} = ${i.length} / ${s}`)}else{if(!(t[0]instanceof Array))throw new Error("options.width is required for 1 dimensional array.");i=t.flat(),s=t[0].length,n=t.length}e.scale&&(r=e.scale),e.offsetX&&(a=e.offsetX),e.offsetY&&(o=e.offsetY);const h=s+2,l=Array(h*(n+2)).fill(0);function c(t,e){return(e+1)*h+(t+1)}for(let t=0;t<n;++t)for(let e=0;e<s;++e)l[c(e,t)]=i[Y(e,t,s)];const d=s*(n+1),p=Array(d+(s+1)*n).fill(0).map((()=>({x:0,y:0,next:void 0})));function u(t,e){return e*s+t}function y(t,e){return d+e*(s+1)+t}const f=new Set;function g(t,e,i){t.x=e,t.y=i,f.add(t)}function m(t){for(var e=t.next;void 0!==e&&e!==t;e=e.next)f.delete(e);void 0!==e&&f.add(t)}for(let t=0;t<n;++t)for(let e=0;e<s;++e)if(1==l[c(e,t)]){if(0==l[c(e-1,t)]){const i=p[y(e,t)];g(i,e,t+1),l[c(e-1,t-1)]?i.next=p[u(e-1,t)]:l[c(e,t-1)]?i.next=p[y(e,t-1)]:i.next=p[u(e,t)],m(i)}if(0==l[c(e+1,t)]){const i=p[y(e+1,t)];g(i,e+1,t),l[c(e+1,t+1)]?i.next=p[u(e+1,t+1)]:l[c(e,t+1)]?i.next=p[y(e+1,t+1)]:i.next=p[u(e,t+1)],m(i)}if(0==l[c(e,t-1)]){const i=p[u(e,t)];g(i,e,t),l[c(e+1,t-1)]?i.next=p[y(e+1,t-1)]:l[c(e+1,t)]?i.next=p[u(e+1,t)]:i.next=p[y(e+1,t)],m(i)}if(0==l[c(e,t+1)]){const i=p[u(e,t+1)];g(i,e+1,t+1),l[c(e-1,t+1)]?i.next=p[y(e,t+1)]:l[c(e-1,t)]?i.next=p[u(e-1,t+1)]:i.next=p[y(e,t)],m(i)}}for(const t of f){let e=t;do{e.next&&(e.next.type=e.x==e?.next?.x?"V":"H",e=e.next)}while(e!==t)}for(let t of f){let e=t;do{if(e.type!=e.next?.type)for(;e.next?.type==e.next?.next?.type;)e.next===t&&(f.delete(t),t=e.next.next,f.add(t)),e.next=e.next?.next;e=e.next}while(e!==t)}let x="";for(const t of f){x+=`M${t.x*r},${t.y*r}`;for(var v=t.next;v!=t;v=v?.next)"H"==v?.type?x+=`H${v?.x*r+a}`:"V"==v?.type&&(x+=`V${v?.y*r+o}`);x+="Z"}return x}(t,{scale:1})));console.log("change:",t),this.dispatchEvent(new CustomEvent("change",{detail:{value:t}}))}#A=0;#O(){clearInterval(this.#A),this.#A=window.setTimeout(this.#R.bind(this),1e3)}#k(t,e,i){if(t>=this.width||t<0)return;if(e>=this.height||e<0)return;const s=this.size+this.gridSize;this.#g.clearRect(t*s,e*s,this.size,this.size),this.#b.clearRect(t*s,e*s,this.size,this.size),this.#C.clearRect(t*s,e*s,this.size,this.size),0!==this.#m[i][3]&&(this.#b.fillStyle=k,this.#b.fillRect(t*s-this.gridSize+1,e*s-this.gridSize+1,this.size+2*this.gridSize-2,this.size+2*this.gridSize-2),this.#b.fillStyle=F(this.#m[i]),this.#b.fillRect(t*s+1,e*s+1,this.size-2,this.size-2)),0!==this.#m[i][3]&&(this.#C.fillStyle=F(this.#m[i]),this.#C.fillRect(t*s,e*s,this.size,this.size)),this.#g.drawImage(this.#x,t*s,e*s,this.size+2,this.size+2,t*s,e*s,this.size+2,this.size+2),this.#g.drawImage(this.#i?this.#w:this.#L,t*s,e*s,this.size+2,this.size+2,t*s,e*s,this.size+2,this.size+2),this.#u[this.#h][e][t]=i,this.#O()}#H(){for(let t=0;t<this.height;t++)for(let e=0;e<this.width;e++)this.#k(e,t,this.#u[this.#h][t][e])}#I(t,e,i){const s=this.size+this.gridSize,n=this.width*s-this.gridSize,r=this.height*s-this.gridSize,{minX:a,maxX:o,minY:h,maxY:l}=t.reduce(((t,s)=>({minX:Math.min(t.minX,s.x,e),maxX:Math.max(t.maxX,s.x,e),minY:Math.min(t.minY,s.y,i),maxY:Math.max(t.maxY,s.y,i)})),{minX:this.width,maxX:0,minY:this.height,maxY:0}),c=a*s,d=h*s,p=(o-a+1)*s,u=(l-h+1)*s;this.#g.clearRect(c,d,p,u),this.#g.drawImage(this.#x,c,d,p,u,c,d,p,u),this.#g.drawImage(this.#w,c,d,p,u,c,d,p,u),this.#S.clearRect(0,0,n,r),t.forEach((({x:t,y:e})=>{this.#S.fillStyle=k,this.#S.beginPath(),this.#S.arc(t*s+5,e*s+5,3,0,2*Math.PI),this.#S.closePath(),this.#S.fill(),this.#S.fillStyle="#1B79C8",this.#S.beginPath(),this.#S.arc(t*s+5,e*s+5,2,0,2*Math.PI),this.#S.closePath(),this.#S.fill()})),this.#g.drawImage(this.#E,c,d,p,u,c,d,p,u),this.dispatchEvent(new CustomEvent("debug",{detail:{x:c,y:d,width:p,height:u,canvas:this.$canvas,context:this.#g,editLayer:this.#w,noEditLayer:this.#L,baseLayer:this.#x,previewLayer:this.#E}}))}handleKeyDown(t){switch(console.log(t.shiftKey,t.ctrlKey,t.altKey,t.key),t.key){case" ":console.log("space");break;case"Escape":console.log("escape")}}handleKeyUp(t){}handleContextMenu(t){t?.preventDefault()}handleDoubleClick(t){t?.preventDefault()}#Y;#X;handlePointerDown(t){if(1!==t.buttons&&32!==t.buttons)return t.preventDefault(),void t.stopPropagation();this.#p=t.altKey,this.#c=t.ctrlKey,this.#d=t.shiftKey;const e=this.$canvas.getBoundingClientRect(),i=this.size+this.gridSize;let s=Math.floor((t.clientX-e.left)/i),n=Math.floor((t.clientY-e.top)/i);if(s===this.#a&&n===this.#o)return;s>=this.width&&(s=this.width-1),n>=this.height&&(n=this.height-1),this.#e=!0,this.#s=this.#u[this.#h][n][s],this.#n=s,this.#r=n,this.#a=s,this.#o=n;const r=32===t.buttons?0:1;if(0===this.#t)this.#k(s,n,r);console.log(this.#t,s,n),this.#Y=this.handlePointerMove.bind(this),document.addEventListener("pointermove",this.#Y),this.#X=this.handlePointerUp.bind(this),document.addEventListener("pointerup",this.#X)}#U=!1;handlePointerUpGlobal(){this.#U&&(this.handlePointerUp({clientX:100,clientY:100}),this.cleanupPointerGlobal())}cleanupPointerGlobal(){document.removeEventListener("pointermove",this.#Y),document.removeEventListener("pointerup",this.#X)}handlePointerUp(t){const e=this.$canvas.getBoundingClientRect(),i=this.size+this.gridSize;let s=Math.floor((t.clientX-e.left)/i),n=Math.floor((t.clientY-e.top)/i);if(s===this.#n&&n===this.#r&&1===this.#s){if(0===this.#t)this.#k(s,n,0),this.#u[this.#h][n][s]=0}else switch(this.#t){case 1:R(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 2:A(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 3:O(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}));break;case 4:case 5:$(this.#n,this.#r,s,n).forEach((({x:t,y:e})=>{this.#k(t,e,1)}))}this.#a=-1,this.#o=-1,this.#e=!1,this.cleanupPointerGlobal()}handlePointerMove(t){const e=this.$canvas;if(this.#e){this.#p=t.altKey,this.#c=t.ctrlKey,this.#d=t.shiftKey;this.#u;const s=e.getBoundingClientRect(),n=this.size+this.gridSize,r=[],a=this.#n,o=this.#r,h=this.#a,l=this.#o;if("function"==typeof t.getCoalescedEvents){const e=t.getCoalescedEvents();for(const t of e){let e=Math.floor((t.clientX-s.left)/n),i=Math.floor((t.clientY-s.top)/n);e===h&&i===l||r.push([e,i])}}else{let e=Math.floor((t.clientX-s.left)/n),i=Math.floor((t.clientY-s.top)/n);if(e===h&&i===l)return;r.push([e,i])}const c=32===t.buttons?0:1;if(0===r.length)return;const[d,p]=r.at(-1);switch(this.#a=d,this.#o=p,this.#t){case 0:for(var i of r)this.#k(i[0],i[1],c);break;case 1:this.#I(R(a,o,d,p),h,l);break;case 2:this.#I(A(a,o,d,p),h,l);break;case 3:this.#I(O(a,o,d,p),h,l);break;case 4:case 5:this.#I($(a,o,d,p),h,l)}}}handlePointerEnter(t){this.#e||this.#i||(this.#i=!0,this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#i?this.#w:this.#L,0,0)),this.#U=!1}handlePointerLeave(t){this.#e?this.#i&&(this.#U=!0):(this.#i=!1,this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#i?this.#w:this.#L,0,0))}#$(){this.#g.drawImage(this.#x,0,0),this.#g.drawImage(this.#L,0,0)}mergeColor(t,e){}clear(){const t=H(this.width,this.height);!function(t,e){const i=[],s=t[0].length,n=t.length,r=e[0].length,a=e.length,o=Math.max(s,r),h=Math.max(n,a);for(let s=0;s<h;s++)for(let n=0;n<o;n++){const r=e&&e[s]&&e[s][n],a=t&&t[s]&&t[s][n];r!==a&&i.push([n,s,a,r])}}(this.#u[this.#h],t);this.#y.push({type:T.Group,data:{name:"Clear"}}),this.#y.push({type:T.Pixel,data:{pixels:[],layer:this.#h}}),this.#u=[H(this.width,this.height)],this.#$()}reset(){this.#M=!0,this.#P()}clearHistory(){this.#y=[],this.#f=[]}applyTemplate(t){this.#u=[t],this.#H()}flipHorizontal(){const t=P(this.#u[this.#h]),e=t[0].length-1;I(this.#u[this.#h],((i,s)=>{t[s][i]=this.#u[this.#h][s][e-i]})),this.#u[this.#h]=t}flipVertical(){const t=P(this.#u[this.#h]),e=t.length-1;I(this.#u[this.#h],((i,s)=>{t[this.#h][s][i]=this.#u[e-s][i]})),this.#u[this.#h]=t}move(t,e){const i=H(this.width,this.height);for(let t=0;t<this.height;t++)i[t].fill(0);I(this.#u[this.#h],((s,n)=>{n-e<0||s-t<0||n-e>=this.height||s-t>=this.width||(i[n][s]=this.#u[this.#h][n-e][s-t])})),this.#u[this.#h]=i}invert(){this.#m.length>2||(I(this.#u[this.#h],((t,e)=>{this.#u[this.#h][e][t]=0===this.#u[this.#h][e][t]?1:0})),this.#H())}applyGuides(){const t=D(this.width,this.height,this.size,this.gridSize);this.#v.drawImage(t,0,0)}clearGuides(){}undo(){const t=this.#y.pop();if(t&&t.type===T.Pixel)this.#f.push(t),t.data.pixels.forEach((t=>{const[e,i]=t;this.#u[this.#h][i][e]=t[2]}))}redo(){}rotateClockwise(){this.#j(!1)}rotateCounterclockwise(){this.#j(!0)}#j(t=!1){const e=P(this.#u[this.#h]);if(t){const t=this.#u[0].map(((t,e)=>this.#u.map((t=>t[t.length-1-e]))));for(let i=0;i<this.height;i++)for(let s=0;s<this.width;s++)e[i][s]=t[this.#h][i][s]}else{const t=this.#u[0].map(((t,e)=>this.#u.map((t=>t[e])).reverse()));for(let i=0;i<this.height;i++)for(let s=0;s<this.width;s++)e[i][s]=t[this.#h][i][s]}this.#u[this.#h]=e}hasUndo(){return 0!==this.#y.length}hasRedo(){return 0!==this.#f.length}inputModePixel(){this.#t=0}inputModeLine(){this.#t=1}inputModeRectangle(){this.#t=2}inputModeRectangleOutline(){this.#t=3}inputModeEllipse(){this.#t=4}inputModeEllipseOutline(){this.#t=5}async save(t={}){const e={width:this.width,height:this.height,transparent:this.transparent,colors:this.#m,layers:this.#l,data:this.#u};!0===t.history&&(e.undo=this.#y,e.redo=this.#f);for(let t=0;t<e.data.length;t++)for(let i=e.data[t].length-1;i>=0;i--)if(i>=this.height)e.data[t].pop();else for(let s=e.data[t][i].length-1;s>=0;s--)s>=this.width&&e.data[t][i].pop();return e}async open(t){if("object"!=typeof t)return["json must be type object"];const e=[],i=Object.keys(t);["width","height","transparent","colors","layers","data"].forEach((t=>{i.includes(t)||e.push(`JSON key '${t}' required.`)})),this.width=t.width,this.height=t.height,this.transparent=t.transparent,this.#m=t.colors,this.#l=t.layers,this.#u=t.data,t.undo&&(this.#y=t.undo),t.redo&&(this.#f=t.redo),this.#P()}})})()})();