@pictogrammers/components 0.4.8 → 0.4.9

package/pgInputUserSelect.js

@@ -1 +1 @@
-(()=>{"use strict";var e={25:(e,t,n)=>{n.d(t,{A:()=>l});var i=n(601),s=n.n(i),o=n(314),a=n.n(o)()(s());a.push([e.id,':host {\n  display: block;\n}\n\n[part="wrapper"] {\n  display: grid;\n  grid-template-rows: auto 0;\n  grid-template-columns: 100%;\n}\n\n[part="select"] {\n  display: grid;\n  grid-template-columns: 3.5rem 1.75rem auto 2.75rem 1fr 1.5rem;\n  grid-template-rows: 1.5rem 1.5rem;\n  grid-row: 1;\n  grid-column: 1;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n  border-radius: 0.25rem;\n  padding: 0.5rem 0.5rem 0.5rem 0.75rem;\n  width: 100%;\n  font-size: 1rem;\n  outline: 0;\n  text-align: left;\n  background: var(--pg-input-select-background, #fff);\n}\n\n[part="select"]:focus {\n  box-shadow: 0 0 0 3px rgba(79, 143, 249, 0.5);\n}\n\n[part="select"]:disabled {\n  border: 1px solid var(--pg-input-select-disabled-border-color, rgba(69, 60, 79, 0.6));\n  color: var(--pg-input-select-disabled-color, rgba(69, 60, 79, 0.6));\n}\n\n[part="chevron"] {\n  grid-row: 1 / span 2;\n  grid-column: 6;\n  pointer-events: none;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n}\n\n.githubIcon,\n[part="githubIcon"] {\n  grid-row: 2;\n  grid-column: 2;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n  color: var(--pg-input-select-border-color, #453C4F);\n}\n\n.avatar,\n[part="selectedAvatar"] {\n  grid-row: 1 / span 2;\n  grid-column: 1;\n  width: 3rem;\n  height: 3rem;\n  border-radius: 50%;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n}\n\n.name,\n[part="selectedName"] {\n  grid-row: 1;\n  grid-column: 2 / span 4;\n  align-self: center;\n}\n\n.github,\n[part="selectedGithub"] {\n  grid-row: 2;\n  grid-column: 3;\n  align-self: center;\n}\n\n.countIcon,\n[part="countIcon"] {\n  grid-row: 2;\n  grid-column: 4;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n  margin-left: 1rem;\n  color: var(--pg-input-select-border-color, #453C4F);\n}\n\n.iconCount,\n[part="selectedCount"] {\n  grid-row: 2;\n  grid-column: 5;\n  align-self: center;\n  font-weight: bold;\n}\n\n[part="dropdown"].open {\n  display: flex;\n}\n\n[part="dropdown"] {\n  grid-row: 2;\n  grid-column: 1;\n  display: none;\n  flex-direction: column;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n  border-radius: 0.25rem;\n  background: #fff;\n  z-index: 1;\n  position: absolute;\n  max-height: 16.5rem;\n  overflow: auto;\n}\n\n[part="dropdown"] button {\n  display: grid;\n  grid-template-columns: 3.5rem 1.75rem auto 2.75rem 1fr;\n  grid-template-rows: auto;\n  border: 0;\n  padding: 0.5rem 0.75rem;\n  text-align: left;\n  background: #fff;\n}\n\n[part="dropdown"] button:hover,\n[part="dropdown"] button:focus {\n  color: #fff;\n  background: #1E90FF;\n}\n\n[part="dropdown"] button:hover .githubIcon,\n[part="dropdown"] button:hover .countIcon,\n[part="dropdown"] button:focus .githubIcon,\n[part="dropdown"] button:focus .countIcon {\n  color: #fff;\n}\n\n[part="loading"] {\n  width: 3rem;\n  height: 3rem;\n  animation: spin 2s infinite linear;\n  grid-row: 1 / span 2;;\n  grid-column: 1;\n  pointer-events: none;\n  align-self: center;\n}\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(359deg);\n  }\n}\n\n[part="loadingText"] {\n  grid-row: 1 / span 2;\n  grid-column: 2 / span 3;\n  align-self: center;\n}\n\n[part="noData"] {\n  grid-row: 1 / span 2;\n  grid-column: 1 / span 4;\n  align-self: center;\n}\n\n[part="noSelection"] {\n  grid-row: 1 / span 2;\n  grid-column: 1 / span 4;\n  align-self: center;\n}',""]);var r=new CSSStyleSheet;r.replaceSync(a.toString());const l=r},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",i=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),i&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),i&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,i,s,o){"string"==typeof e&&(e=[[null,e,void 0]]);var a={};if(i)for(var r=0;r<this.length;r++){var l=this[r][0];null!=l&&(a[l]=!0)}for(var c=0;c<e.length;c++){var d=[].concat(e[c]);i&&a[d[0]]||(void 0!==o&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=o),n&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=n):d[2]=n),s&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=s):d[4]="".concat(s)),t.push(d))}},t}},601:e=>{e.exports=function(e){return e[1]}}},t={};function n(i){var s=t[i];if(void 0!==s)return s.exports;var o=t[i]={id:i,exports:{}};return e[i](o,o.exports,n),o.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);const i=Symbol("addObserver"),s=Symbol("removeObserver"),o=Symbol("getObservers"),a=Symbol("swapObserver"),r=Symbol("isProxy"),l=Symbol("getTarget"),c=["fill","pop","push","reverse","shift","sort","splice","unshift"],d=new Map;function p(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case r:return!0;case l:return t;case o:return d.has(e);case a:return(t,n)=>{const i=d.get(e);i.forEach(((s,o)=>{if(o.getRootNode().host===t){const t=i.get(o);d.has(n)?d.get(n).has(o)?d.get(n).get(o).push(i.get(o)):d.get(n).set(o,i.get(o)):d.set(n,new Map([[o,t]])),d.delete(e),t.forEach((e=>{e(null,h.swap,[n])}))}}))};case i:return(t,n)=>{d.has(e)?d.get(e).has(t)?d.get(e).get(t).push(n):d.get(e).set(t,[n]):d.set(e,new Map([[t,[n]]]))};case s:return t=>{d.has(e)&&(d.get(e).delete(t),0===d.get(e).size&&d.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?p(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(c.includes(n))return d.has(t)?function(){const e=Array.prototype[n].apply(t,arguments);return d.get(t).forEach(((e,i)=>{e.forEach((e=>{e(t,n,arguments)}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return p(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(d.has(e)){d.get(e).forEach(((e,i)=>{e.forEach((e=>{e(t,n)}))}))}return Reflect.set(e,t,n)}})}window.observers=d;const h={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const u=Symbol("init"),m=Symbol("template"),g=Symbol("style"),f=Symbol("parent");function y(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function v(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function b(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var i,s;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[f]||t.prototype[f][t.prototype[f].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[f]=[t.prototype],t.prototype[g]=e.style?[e.style]:[],t.prototype[m]=e.template||""):(t.prototype[f].push(t.prototype),t.prototype[g].push(e.style),t.prototype[m]=(i=t.prototype[m],(s=e.template||null)&&s.match(/<parent\/>/)?s.replace(/<parent\/>/,i):`${i}${s||""}`));const o=t.prototype.connectedCallback||(()=>{}),a=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[u]||void 0!==e.template||void 0!==e.style)if(this[u]){if(this[u]&&e.style);else if(this[u]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[m]||"";const n=document.importNode(e.content,!0),i=this.attachShadow({mode:"open"});i.adoptedStyleSheets=t.prototype[g].map((e=>{if(e instanceof CSSStyleSheet)return e;var t=new CSSStyleSheet;return t.replaceSync(e.toString()),t})),i.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const i=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),s=()=>{this[f].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[v(t)]=!0,e)),{}):{})}))};0===i.length?(this[u]=!0,o.call(this),s()):Promise.all(i).then((()=>{this[u]=!0,o.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));s()}))},t.prototype.disconnectedCallback=function(){a.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[v(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function $(e){return!!e&&e.constructor===Array}function w(e,t){e[u]&&e[f].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function C(e){return null===e?"null":$(e)?"array":typeof e}function S(e){return function(t,n){const i=n.name,s=Symbol(i),c=Symbol(`${i}:type`),d=Symbol(`${i}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,i,{get:()=>"object"===this[c]||"array"===this[c]?this[s][r]?this[s]:p(this[s]):this[s],set:t=>{const n=C(e?e(t):t);if("index"!==i&&this[c]!==n&&"null"!==this[c]&&"null"!==n)throw new Error(`@Prop() ${i} with type '${this[c]}' cannot be set to ${n}.`);if("array"===this[c]){if(!$(t))throw new PropError(`Array "${i}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,i)?.set);if(this[s]===t)throw new Error("Setting an array to itself is not allowed.");const e=p(this[s]);if(e[o]){const n=t[r]?t[l]:t;e[a](this,n),this[s]=t,console.log(">>> trigger render???",this,i)}else this[s]=t}else this[s]=e?e(t):t,w(this,i)}})})),function(t){if(void 0===t&&"index"!==i)throw new Error(`@Prop() ${i} must have an initial value defined.`);if(void 0!==t&&"index"===i)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${i} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=y(i);t[i]||(e.observedAttributes.push(n),t[i]=s)}return this[c]=C(t),"array"===this[c]?(this[s]=t,new Proxy(t,{get:(e,t)=>t===E?this[d]:(console.log("errr???"),Reflect.get(this[s],t)),set:(e,t,n)=>{if(t===E)return this[d]=n,!0;const o=Reflect.set(e,t,n);return"length"===t&&this[s].length===n||w(this,i),this[s]=n,o}})):(this[s]=e?e(this.getAttribute(i)??t):this.getAttribute(i)??t,this[s])}}}function x(){return function(e,t){const n=t.name,i=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${i}]`))}})}))}}Symbol("hasProxy");const E=Symbol("meta");var k=n(25),T=function(e,t,n,i,s,o){function a(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var r,l=i.kind,c="getter"===l?"get":"setter"===l?"set":"value",d=!t&&e?i.static?e:e.prototype:null,p=t||(d?Object.getOwnPropertyDescriptor(d,i.name):{}),h=!1,u=n.length-1;u>=0;u--){var m={};for(var g in i)m[g]="access"===g?{}:i[g];for(var g in i.access)m.access[g]=i.access[g];m.addInitializer=function(e){if(h)throw new TypeError("Cannot add initializers after decoration has completed");o.push(a(e||null))};var f=(0,n[u])("accessor"===l?{get:p.get,set:p.set}:p[c],m);if("accessor"===l){if(void 0===f)continue;if(null===f||"object"!=typeof f)throw new TypeError("Object expected");(r=a(f.get))&&(p.get=r),(r=a(f.set))&&(p.set=r),(r=a(f.init))&&s.unshift(r)}else(r=a(f))&&("field"===l?s.unshift(r):p[c]=r)}d&&Object.defineProperty(d,i.name,p),h=!0},A=function(e,t,n){for(var i=arguments.length>2,s=0;s<t.length;s++)n=i?t[s].call(e,n):t[s].call(e);return i?n:void 0};function I(e,t){const n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.setAttribute("viewBox","0 0 24 24");const i=document.createElementNS("http://www.w3.org/2000/svg","path");return i.setAttribute("d",e),i.setAttribute("fill","currentColor"),n.appendChild(i),n.classList.add(t),n}const L="ArrowUp",M="ArrowDown",D="Escape",P="Tab";(()=>{let e,t,n,i,s,o,a,r,l,c,d,p,h,u,m,g,f,y,v,$,w=[b({selector:"pg-input-user-select",style:k.A,template:'<div part="wrapper"> <button part="select"> <img part="selectedAvatar"/> <span part="selectedName">First Last</span> <svg part="githubIcon" viewBox="0 0 24 24"><path fill="currentColor" d="M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z"/></svg> <span part="selectedGithub">GitHub</span> <svg part="countIcon" viewBox="0 0 24 24"><path fill="currentColor" d="M11,13.5V21.5H3V13.5H11M12,2L17.5,11H6.5L12,2M17.5,13C20,13 22,15 22,17.5C22,20 20,22 17.5,22C15,22 13,20 13,17.5C13,15 15,13 17.5,13Z"/></svg> <span part="selectedCount">9999</span> <svg part="loading" viewBox="0 0 24 24"><path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z"/></svg> <span part="loadingText">Loading...</span> <svg part="chevron" viewBox="0 0 24 24"><path fill="currentColor" d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"/></svg> <span part="noData">Empty Users List</span> <span part="noSelection">Select a User</span> </button> <div part="dropdownContainer"> <div part="dropdown"></div> </div> </div>'})],C=[],E=HTMLElement,N=[],O=[],R=[],j=[],G=[],z=[],H=[],B=[],F=[],U=[],Z=[],V=[],W=[],q=[],K=[],_=[],Y=[],J=[],Q=[],X=[],ee=[],te=[],ne=[],ie=[],se=[],oe=[],ae=[],re=[],le=[],ce=[],de=[],pe=[],he=[],ue=[],me=[],ge=[];(class extends E{static{t=this}static{const b="function"==typeof Symbol&&Symbol.metadata?Object.create(E[Symbol.metadata]??null):void 0;n=[S()],i=[S()],s=[S()],o=[S()],a=[S()],r=[S()],l=[x()],c=[x()],d=[x()],p=[x()],h=[x()],u=[x()],m=[x()],g=[x()],f=[x()],y=[x()],v=[x()],$=[x()],T(null,null,n,{kind:"field",name:"options",static:!1,private:!1,access:{has:e=>"options"in e,get:e=>e.options,set:(e,t)=>{e.options=t}},metadata:b},N,O),T(null,null,i,{kind:"field",name:"value",static:!1,private:!1,access:{has:e=>"value"in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:b},R,j),T(null,null,s,{kind:"field",name:"clear",static:!1,private:!1,access:{has:e=>"clear"in e,get:e=>e.clear,set:(e,t)=>{e.clear=t}},metadata:b},G,z),T(null,null,o,{kind:"field",name:"noDataText",static:!1,private:!1,access:{has:e=>"noDataText"in e,get:e=>e.noDataText,set:(e,t)=>{e.noDataText=t}},metadata:b},H,B),T(null,null,a,{kind:"field",name:"noSelectionText",static:!1,private:!1,access:{has:e=>"noSelectionText"in e,get:e=>e.noSelectionText,set:(e,t)=>{e.noSelectionText=t}},metadata:b},F,U),T(null,null,r,{kind:"field",name:"name",static:!1,private:!1,access:{has:e=>"name"in e,get:e=>e.name,set:(e,t)=>{e.name=t}},metadata:b},Z,V),T(null,null,l,{kind:"field",name:"$select",static:!1,private:!1,access:{has:e=>"$select"in e,get:e=>e.$select,set:(e,t)=>{e.$select=t}},metadata:b},W,q),T(null,null,c,{kind:"field",name:"$selectedAvatar",static:!1,private:!1,access:{has:e=>"$selectedAvatar"in e,get:e=>e.$selectedAvatar,set:(e,t)=>{e.$selectedAvatar=t}},metadata:b},K,_),T(null,null,d,{kind:"field",name:"$selectedName",static:!1,private:!1,access:{has:e=>"$selectedName"in e,get:e=>e.$selectedName,set:(e,t)=>{e.$selectedName=t}},metadata:b},Y,J),T(null,null,p,{kind:"field",name:"$githubIcon",static:!1,private:!1,access:{has:e=>"$githubIcon"in e,get:e=>e.$githubIcon,set:(e,t)=>{e.$githubIcon=t}},metadata:b},Q,X),T(null,null,h,{kind:"field",name:"$selectedGithub",static:!1,private:!1,access:{has:e=>"$selectedGithub"in e,get:e=>e.$selectedGithub,set:(e,t)=>{e.$selectedGithub=t}},metadata:b},ee,te),T(null,null,u,{kind:"field",name:"$countIcon",static:!1,private:!1,access:{has:e=>"$countIcon"in e,get:e=>e.$countIcon,set:(e,t)=>{e.$countIcon=t}},metadata:b},ne,ie),T(null,null,m,{kind:"field",name:"$selectedCount",static:!1,private:!1,access:{has:e=>"$selectedCount"in e,get:e=>e.$selectedCount,set:(e,t)=>{e.$selectedCount=t}},metadata:b},se,oe),T(null,null,g,{kind:"field",name:"$dropdown",static:!1,private:!1,access:{has:e=>"$dropdown"in e,get:e=>e.$dropdown,set:(e,t)=>{e.$dropdown=t}},metadata:b},ae,re),T(null,null,f,{kind:"field",name:"$loading",static:!1,private:!1,access:{has:e=>"$loading"in e,get:e=>e.$loading,set:(e,t)=>{e.$loading=t}},metadata:b},le,ce),T(null,null,y,{kind:"field",name:"$loadingText",static:!1,private:!1,access:{has:e=>"$loadingText"in e,get:e=>e.$loadingText,set:(e,t)=>{e.$loadingText=t}},metadata:b},de,pe),T(null,null,v,{kind:"field",name:"$noData",static:!1,private:!1,access:{has:e=>"$noData"in e,get:e=>e.$noData,set:(e,t)=>{e.$noData=t}},metadata:b},he,ue),T(null,null,$,{kind:"field",name:"$noSelection",static:!1,private:!1,access:{has:e=>"$noSelection"in e,get:e=>e.$noSelection,set:(e,t)=>{e.$noSelection=t}},metadata:b},me,ge),T(null,e={value:t},w,{kind:"class",name:t.name,metadata:b},null,C),t=e.value,b&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:b}),A(t,C)}options=A(this,N,[]);value=(A(this,O),A(this,R,null));clear=(A(this,j),A(this,G,!1));noDataText=(A(this,z),A(this,H,"Empty Users List"));noSelectionText=(A(this,B),A(this,F,"Select a User"));name=(A(this,U),A(this,Z,""));$select=(A(this,V),A(this,W,void 0));$selectedAvatar=(A(this,q),A(this,K,void 0));$selectedName=(A(this,_),A(this,Y,void 0));$githubIcon=(A(this,J),A(this,Q,void 0));$selectedGithub=(A(this,X),A(this,ee,void 0));$countIcon=(A(this,te),A(this,ne,void 0));$selectedCount=(A(this,ie),A(this,se,void 0));$dropdown=(A(this,oe),A(this,ae,void 0));$loading=(A(this,re),A(this,le,void 0));$loadingText=(A(this,ce),A(this,de,void 0));$noData=(A(this,pe),A(this,he,void 0));$noSelection=(A(this,ue),A(this,me,void 0));connectedCallback(){this.$select.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeys.bind(this))}isOpen=(A(this,ge),!1);handleCloseBind;optionsElements=[];close(){this.isOpen=!1,this.$dropdown.classList.remove("open"),document.removeEventListener("mousedown",this.handleCloseBind)}handleClose(e){const t=e.target;t.nodeName===this.nodeName&&t.isOpen||this.close()}handleClick(){this.isOpen=!this.isOpen,this.$dropdown.classList.toggle("open",this.isOpen),this.handleCloseBind=this.handleClose.bind(this),document.addEventListener("mousedown",this.handleCloseBind),this.focusSelected()}focusSelected(){const e=this.options?.findIndex((e=>e===this.value));e&&-1!==e?(this.optionsElements[e].focus(),this.index=e):this.optionsElements.length&&this.optionsElements[0].focus()}handleSelect(e){console.log("clicked");const{id:t}=e.currentTarget.dataset,n=this.options?.find((e=>e.id===t));this.value=n||null,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,name:this.name}})),this.close()}loadingMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="none",this.$noSelection.style.display="none",this.$loading.style.display="flex",this.$loadingText.style.display="initial",this.$select.disabled=!0}noDataMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="initial",this.$noSelection.style.display="none",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!0}noSelectionMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="none",this.$noSelection.style.display="initial",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!1}selectMode(){this.$selectedAvatar.style.display="initial",this.$selectedName.style.display="initial",this.$githubIcon.style.display="initial",this.$selectedGithub.style.display="initial",this.$countIcon.style.display="initial",this.$selectedCount.style.display="initial",this.$noData.style.display="none",this.$noSelection.style.display="none",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!1}render(e){e.options&&(null===this.options?this.loadingMode():0===this.options.length?this.noDataMode():(this.selectMode(),this.calculateMinWidth(),this.optionsElements=this.options.map((e=>{const t=document.createElement("button"),n=document.createElement("img");n.src=`${e.base64}`,n.classList.add("avatar"),t.appendChild(n);const i=document.createElement("span");i.innerText=`${e.name}`,i.classList.add("name"),t.appendChild(i);const s=document.createElement("span");s.innerText=`${e.github}`,s.classList.add("github"),t.appendChild(s);const o=document.createElement("span");return o.innerText=`${e.iconCount}`,o.classList.add("iconCount"),t.appendChild(o),t.dataset.id=`${e.id}`,t.appendChild(I("M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z","githubIcon")),t.appendChild(I("M11,13.5V21.5H3V13.5H11M12,2L17.5,11H6.5L12,2M17.5,13C20,13 22,15 22,17.5C22,20 20,22 17.5,22C15,22 13,20 13,17.5C13,15 15,13 17.5,13Z","countIcon")),t.addEventListener("click",this.handleSelect.bind(this)),this.$dropdown.appendChild(t),t})),null===this.value&&this.noSelectionMode())),e.value&&e.value&&this.value&&(this.$selectedAvatar.src=this.value.base64||"",this.$selectedCount.innerText=`${this.value.iconCount}`,this.$selectedName.innerText=`${this.value.name}`,this.$selectedGithub.innerText=`${this.value.github}`,this.selectMode()),e.noDataText&&(this.$noData.innerText=this.noDataText),e.noSelectionText&&(this.$noSelection.innerText=this.noSelectionText)}calculateMinWidth(){const{width:e}=this.$select.getBoundingClientRect();this.$dropdown.style.minWidth=e-2+"px"}index=-1;handleKeys(e){const t=this.optionsElements;let n=this.index;switch(e.key){case L:0===n?n=t.length-1:n>=0&&(n-=1);break;case M:n<t.length-1?n+=1:n===t.length-1&&(n=0);break;case P:case D:this.close()}n!=this.index&&(this.index=n,t[n].focus(),e.preventDefault())}})})()})();
+(()=>{"use strict";var e={25:(e,t,n)=>{n.d(t,{A:()=>l});var s=n(601),i=n.n(s),o=n(314),a=n.n(o)()(i());a.push([e.id,':host {\n  display: block;\n}\n\n[part="wrapper"] {\n  display: grid;\n  grid-template-rows: auto 0;\n  grid-template-columns: 100%;\n}\n\n[part="select"] {\n  display: grid;\n  grid-template-columns: 3.5rem 1.75rem auto 2.75rem 1fr 1.5rem;\n  grid-template-rows: 1.5rem 1.5rem;\n  grid-row: 1;\n  grid-column: 1;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n  border-radius: 0.25rem;\n  padding: 0.5rem 0.5rem 0.5rem 0.75rem;\n  width: 100%;\n  font-size: 1rem;\n  outline: 0;\n  text-align: left;\n  background: var(--pg-input-select-background, #fff);\n}\n\n[part="select"]:focus {\n  box-shadow: 0 0 0 3px rgba(79, 143, 249, 0.5);\n}\n\n[part="select"]:disabled {\n  border: 1px solid var(--pg-input-select-disabled-border-color, rgba(69, 60, 79, 0.6));\n  color: var(--pg-input-select-disabled-color, rgba(69, 60, 79, 0.6));\n}\n\n[part="chevron"] {\n  grid-row: 1 / span 2;\n  grid-column: 6;\n  pointer-events: none;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n}\n\n.githubIcon,\n[part="githubIcon"] {\n  grid-row: 2;\n  grid-column: 2;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n  color: var(--pg-input-select-border-color, #453C4F);\n}\n\n.avatar,\n[part="selectedAvatar"] {\n  grid-row: 1 / span 2;\n  grid-column: 1;\n  width: 3rem;\n  height: 3rem;\n  border-radius: 50%;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n}\n\n.name,\n[part="selectedName"] {\n  grid-row: 1;\n  grid-column: 2 / span 4;\n  align-self: center;\n}\n\n.github,\n[part="selectedGithub"] {\n  grid-row: 2;\n  grid-column: 3;\n  align-self: center;\n}\n\n.countIcon,\n[part="countIcon"] {\n  grid-row: 2;\n  grid-column: 4;\n  width: 1.5rem;\n  height: 1.5rem;\n  align-self: center;\n  margin-left: 1rem;\n  color: var(--pg-input-select-border-color, #453C4F);\n}\n\n.iconCount,\n[part="selectedCount"] {\n  grid-row: 2;\n  grid-column: 5;\n  align-self: center;\n  font-weight: bold;\n}\n\n[part="dropdown"].open {\n  display: flex;\n}\n\n[part="dropdown"] {\n  grid-row: 2;\n  grid-column: 1;\n  display: none;\n  flex-direction: column;\n  border: 1px solid var(--pg-input-select-border-color, #453C4F);\n  border-radius: 0.25rem;\n  background: #fff;\n  z-index: 1;\n  position: absolute;\n  max-height: 16.5rem;\n  overflow: auto;\n}\n\n[part="dropdown"] button {\n  display: grid;\n  grid-template-columns: 3.5rem 1.75rem auto 2.75rem 1fr;\n  grid-template-rows: auto;\n  border: 0;\n  padding: 0.5rem 0.75rem;\n  text-align: left;\n  background: #fff;\n}\n\n[part="dropdown"] button:hover,\n[part="dropdown"] button:focus {\n  color: #fff;\n  background: #1E90FF;\n}\n\n[part="dropdown"] button:hover .githubIcon,\n[part="dropdown"] button:hover .countIcon,\n[part="dropdown"] button:focus .githubIcon,\n[part="dropdown"] button:focus .countIcon {\n  color: #fff;\n}\n\n[part="loading"] {\n  width: 3rem;\n  height: 3rem;\n  animation: spin 2s infinite linear;\n  grid-row: 1 / span 2;;\n  grid-column: 1;\n  pointer-events: none;\n  align-self: center;\n}\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(359deg);\n  }\n}\n\n[part="loadingText"] {\n  grid-row: 1 / span 2;\n  grid-column: 2 / span 3;\n  align-self: center;\n}\n\n[part="noData"] {\n  grid-row: 1 / span 2;\n  grid-column: 1 / span 4;\n  align-self: center;\n}\n\n[part="noSelection"] {\n  grid-row: 1 / span 2;\n  grid-column: 1 / span 4;\n  align-self: center;\n}',""]);var r=new CSSStyleSheet;r.replaceSync(a.toString());const l=r},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",s=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),s&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),s&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,s,i,o){"string"==typeof e&&(e=[[null,e,void 0]]);var a={};if(s)for(var r=0;r<this.length;r++){var l=this[r][0];null!=l&&(a[l]=!0)}for(var c=0;c<e.length;c++){var d=[].concat(e[c]);s&&a[d[0]]||(void 0!==o&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=o),n&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=n):d[2]=n),i&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=i):d[4]="".concat(i)),t.push(d))}},t}},601:e=>{e.exports=function(e){return e[1]}}},t={};function n(s){var i=t[s];if(void 0!==i)return i.exports;var o=t[s]={id:s,exports:{}};return e[s](o,o.exports,n),o.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var s in t)n.o(t,s)&&!n.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);const s=Symbol("addObserver"),i=Symbol("removeObserver"),o=Symbol("getObservers"),a=Symbol("swapObserver"),r=Symbol("isProxy"),l=Symbol("getTarget"),c=["fill","pop","push","reverse","shift","sort","splice","unshift"],d=new Map;function p(e){return new Proxy(e,{get(t,n){if("symbol"==typeof n){switch(n){case r:return!0;case l:return t;case o:return t=>{const n=d.get(e);return n?.has(t)};case a:return(t,n)=>{const s=d.get(e);if(s){const e=s.get(t);e&&e.forEach(((s,i)=>{if(!s)throw new Error("Unreachable");{const e=d.get(n);if(e){const n=e.get(t);n?n.set(i,s):e.set(t,new Map([[i,s]]))}else d.set(n,new Map([[t,new Map([[i,s]])]]))}e.delete(i),s.forEach((e=>{e(null,h.swap,[n])}))}))}};case s:return(t,n)=>{const s=t.getRootNode().host,i=d.get(e);if(i){const e=i.get(s);if(e){const s=e.get(t);s?s.push(n):e.set(t,[n])}else i.set(s,new Map([[t,[n]]]))}else d.set(e,new Map([[s,new Map([[t,[n]]])]]))};case i:return t=>{const n=t.getRootNode().host,s=d.get(e);s&&(s.delete(n),0===s.size&&d.delete(e))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(t,n)}throw new Error("Unsupported symbol")}if(n in t){if(!Number.isNaN(Number(n)))return"object"==typeof t[n]?p(t[n]):t[n];if("copyWithin"===n)throw new Error("Unsupported array method copyWithin");if(c.includes(n))return d.has(t)?function(){const e=Array.prototype[n].apply(t,arguments),s=d.get(t);return s?.forEach((e=>{e.forEach((e=>{e.forEach((e=>{e(t,n,arguments)}))}))})),e}:Reflect.get(t,n);if(t[n]instanceof Array)return p(t[n])}return Reflect.get(t,n)},set(e,t,n){if("symbol"==typeof t)throw new Error("Setting symbols not allowed.");if(Array.isArray(e))return Reflect.set(e,t,n);if(d.has(e)){const s=d.get(e);s?.forEach((e=>{e.forEach((e=>{e.forEach((e=>{e(t,n)}))}))}))}return Reflect.set(e,t,n)}})}window.observers=d;const h={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(e,t){super(e),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,t)}}Symbol("index");const u=Symbol("init"),m=Symbol("template"),g=Symbol("style"),f=Symbol("parent");function y(e){return e.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function v(e){return e.replace(/-([a-z])/g,(e=>e[1].toUpperCase()))}function b(e={}){return function(t,n){if("class"!==n.kind)throw new Error("@Component() can only decorate a class");var s,i;Reflect.defineProperty(t,"name",{value:e.selector,writable:!1,configurable:!1}),!t.prototype[f]||t.prototype[f][t.prototype[f].length-1]instanceof Object.getPrototypeOf(t)?t.prototype instanceof HTMLElement&&(t.prototype[f]=[t.prototype],t.prototype[g]=e.style?[e.style]:[],t.prototype[m]=e.template||""):(t.prototype[f].push(t.prototype),t.prototype[g].push(e.style),t.prototype[m]=(s=t.prototype[m],(i=e.template||null)&&i.match(/<parent\/>/)?i.replace(/<parent\/>/,s):s.match(/<child\/>/)?s.replace(/<child\/>/,i||""):`${s}${i||""}`));const o=t.prototype.connectedCallback||(()=>{}),a=t.prototype.disconnectedCallback||(()=>{});t.prototype.connectedCallback=function(){if(this[u]||void 0!==e.template||void 0!==e.style)if(this[u]){if(this[u]&&e.style);else if(this[u]&&e.selector&&!e.template)throw new Error("You need to pass a template for an extended element.")}else{if(!1===e.useShadow)throw new Error("unsupported");{const e=document.createElement("template");e.innerHTML=t.prototype[m]||"";const n=document.importNode(e.content,!0),s=this.attachShadow({mode:"open"});s.adoptedStyleSheets=t.prototype[g].reduce(((e,t)=>{if(!t)return e;if(t instanceof CSSStyleSheet)return e.push(t),e;var n=new CSSStyleSheet;return n.replaceSync(t.toString()),e.push(n),e}),[]),s.appendChild(n)}}else!1===e.useShadow||this.attachShadow({mode:"open"});const n=new Set;for(const e of this.shadowRoot.querySelectorAll("*"))-1!==e.localName.indexOf("-")&&n.add(e.localName);const s=Array.from(n.values()).map((e=>customElements.get(e)?Promise.resolve():customElements.whenDefined(e))),i=()=>{this[f].map((e=>{e.render&&e.render.call(this,t.observedAttributes?t.observedAttributes.reduce(((e,t)=>(e[v(t)]=!0,e)),{}):{})}))};0===s.length?(this[u]=!0,o.call(this),i()):Promise.all(s).then((()=>{this[u]=!0,o.call(this);for(const e of this.shadowRoot.querySelectorAll("slot"))e.dispatchEvent(new CustomEvent("slotchange"));i()}))},t.prototype.disconnectedCallback=function(){a.call(this)},t.prototype.attributeChangedCallback=function(e,t,n){this[v(e)]=n},n.addInitializer((function(){if(e.selector){if(window.customElements.get(e.selector))throw new Error(`@Component() ${n.name} duplicate selector '${e.selector}'`);window.customElements.define(e.selector,t)}}))}}Symbol("transmute");function w(e){return!!e&&e.constructor===Array}function $(e,t){e[u]&&e[f].map((n=>{n.render&&n.render.call(e,{[t]:!0})}))}function C(e){return null===e?"null":w(e)?"array":typeof e}function S(e){return function(t,n){const s=n.name,i=Symbol(s),c=Symbol(`${s}:type`),d=Symbol(`${s}:meta`);return n.addInitializer((function(){Reflect.defineProperty(this,s,{get:()=>"object"===this[c]||"array"===this[c]?this[i][r]?this[i]:p(this[i]):this[i],set:t=>{const n=C(e?e(t):t);if("index"!==s&&this[c]!==n&&"null"!==this[c]&&"null"!==n)throw new Error(`@Prop() ${s} with type '${this[c]}' cannot be set to ${n}.`);if("array"===this[c]){if(!w(t))throw new PropError(`Array "${s}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,s)?.set);if(this[i]===t)throw new Error("Setting an array to itself is not allowed.");const e=p(this[i]);if(e[o](this)){const n=t[r]?t[l]:t;e[a](this,n),this[i]=t}else this[i]=t}else this[i]=e?e(t):t,$(this,s)}})})),function(t){if(void 0===t&&"index"!==s)throw new Error(`@Prop() ${s} must have an initial value defined.`);if(void 0!==t&&"index"===s)throw new Error("@Prop() index must not have an initial value defined.");if(!0===t)throw new Error(`@Prop() ${s} boolean must initialize to false.`);if(!n.private){const{constructor:e}=this;e.observedAttributes??=[],e.symbols||(e.symbols={});const{symbols:t}=e,n=y(s);t[s]||(e.observedAttributes.push(n),t[s]=i)}return this[c]=C(t),"array"===this[c]?(this[i]=t,new Proxy(t,{get:(e,t)=>t===E?this[d]:(console.log("errr???"),Reflect.get(this[i],t)),set:(e,t,n)=>{if(t===E)return this[d]=n,!0;const o=Reflect.set(e,t,n);return"length"===t&&this[i].length===n||$(this,s),this[i]=n,o}})):(this[i]=e?e(this.getAttribute(s)??t):this.getAttribute(s)??t,this[i])}}}function x(){return function(e,t){const n=t.name,s=n.replace(/^\$/,"");t.addInitializer((function(){let e=null;Reflect.defineProperty(this,n,{get(){return e??(e=this.shadowRoot?.querySelector(`[part~=${s}]`))}})}))}}Symbol("hasProxy");const E=Symbol("meta");var k=n(25),T=function(e,t,n,s,i,o){function a(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var r,l=s.kind,c="getter"===l?"get":"setter"===l?"set":"value",d=!t&&e?s.static?e:e.prototype:null,p=t||(d?Object.getOwnPropertyDescriptor(d,s.name):{}),h=!1,u=n.length-1;u>=0;u--){var m={};for(var g in s)m[g]="access"===g?{}:s[g];for(var g in s.access)m.access[g]=s.access[g];m.addInitializer=function(e){if(h)throw new TypeError("Cannot add initializers after decoration has completed");o.push(a(e||null))};var f=(0,n[u])("accessor"===l?{get:p.get,set:p.set}:p[c],m);if("accessor"===l){if(void 0===f)continue;if(null===f||"object"!=typeof f)throw new TypeError("Object expected");(r=a(f.get))&&(p.get=r),(r=a(f.set))&&(p.set=r),(r=a(f.init))&&i.unshift(r)}else(r=a(f))&&("field"===l?i.unshift(r):p[c]=r)}d&&Object.defineProperty(d,s.name,p),h=!0},A=function(e,t,n){for(var s=arguments.length>2,i=0;i<t.length;i++)n=s?t[i].call(e,n):t[i].call(e);return s?n:void 0};function I(e,t){const n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.setAttribute("viewBox","0 0 24 24");const s=document.createElementNS("http://www.w3.org/2000/svg","path");return s.setAttribute("d",e),s.setAttribute("fill","currentColor"),n.appendChild(s),n.classList.add(t),n}const M="ArrowUp",L="ArrowDown",D="Escape",N="Tab";(()=>{let e,t,n,s,i,o,a,r,l,c,d,p,h,u,m,g,f,y,v,w,$=[b({selector:"pg-input-user-select",style:k.A,template:'<div part="wrapper"> <button part="select"> <img part="selectedAvatar"/> <span part="selectedName">First Last</span> <svg part="githubIcon" viewBox="0 0 24 24"><path fill="currentColor" d="M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z"/></svg> <span part="selectedGithub">GitHub</span> <svg part="countIcon" viewBox="0 0 24 24"><path fill="currentColor" d="M11,13.5V21.5H3V13.5H11M12,2L17.5,11H6.5L12,2M17.5,13C20,13 22,15 22,17.5C22,20 20,22 17.5,22C15,22 13,20 13,17.5C13,15 15,13 17.5,13Z"/></svg> <span part="selectedCount">9999</span> <svg part="loading" viewBox="0 0 24 24"><path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z"/></svg> <span part="loadingText">Loading...</span> <svg part="chevron" viewBox="0 0 24 24"><path fill="currentColor" d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"/></svg> <span part="noData">Empty Users List</span> <span part="noSelection">Select a User</span> </button> <div part="dropdownContainer"> <div part="dropdown"></div> </div> </div>'})],C=[],E=HTMLElement,P=[],O=[],R=[],j=[],G=[],z=[],H=[],B=[],F=[],U=[],Z=[],V=[],W=[],q=[],K=[],_=[],Y=[],J=[],Q=[],X=[],ee=[],te=[],ne=[],se=[],ie=[],oe=[],ae=[],re=[],le=[],ce=[],de=[],pe=[],he=[],ue=[],me=[],ge=[];(class extends E{static{t=this}static{const b="function"==typeof Symbol&&Symbol.metadata?Object.create(E[Symbol.metadata]??null):void 0;n=[S()],s=[S()],i=[S()],o=[S()],a=[S()],r=[S()],l=[x()],c=[x()],d=[x()],p=[x()],h=[x()],u=[x()],m=[x()],g=[x()],f=[x()],y=[x()],v=[x()],w=[x()],T(null,null,n,{kind:"field",name:"options",static:!1,private:!1,access:{has:e=>"options"in e,get:e=>e.options,set:(e,t)=>{e.options=t}},metadata:b},P,O),T(null,null,s,{kind:"field",name:"value",static:!1,private:!1,access:{has:e=>"value"in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:b},R,j),T(null,null,i,{kind:"field",name:"clear",static:!1,private:!1,access:{has:e=>"clear"in e,get:e=>e.clear,set:(e,t)=>{e.clear=t}},metadata:b},G,z),T(null,null,o,{kind:"field",name:"noDataText",static:!1,private:!1,access:{has:e=>"noDataText"in e,get:e=>e.noDataText,set:(e,t)=>{e.noDataText=t}},metadata:b},H,B),T(null,null,a,{kind:"field",name:"noSelectionText",static:!1,private:!1,access:{has:e=>"noSelectionText"in e,get:e=>e.noSelectionText,set:(e,t)=>{e.noSelectionText=t}},metadata:b},F,U),T(null,null,r,{kind:"field",name:"name",static:!1,private:!1,access:{has:e=>"name"in e,get:e=>e.name,set:(e,t)=>{e.name=t}},metadata:b},Z,V),T(null,null,l,{kind:"field",name:"$select",static:!1,private:!1,access:{has:e=>"$select"in e,get:e=>e.$select,set:(e,t)=>{e.$select=t}},metadata:b},W,q),T(null,null,c,{kind:"field",name:"$selectedAvatar",static:!1,private:!1,access:{has:e=>"$selectedAvatar"in e,get:e=>e.$selectedAvatar,set:(e,t)=>{e.$selectedAvatar=t}},metadata:b},K,_),T(null,null,d,{kind:"field",name:"$selectedName",static:!1,private:!1,access:{has:e=>"$selectedName"in e,get:e=>e.$selectedName,set:(e,t)=>{e.$selectedName=t}},metadata:b},Y,J),T(null,null,p,{kind:"field",name:"$githubIcon",static:!1,private:!1,access:{has:e=>"$githubIcon"in e,get:e=>e.$githubIcon,set:(e,t)=>{e.$githubIcon=t}},metadata:b},Q,X),T(null,null,h,{kind:"field",name:"$selectedGithub",static:!1,private:!1,access:{has:e=>"$selectedGithub"in e,get:e=>e.$selectedGithub,set:(e,t)=>{e.$selectedGithub=t}},metadata:b},ee,te),T(null,null,u,{kind:"field",name:"$countIcon",static:!1,private:!1,access:{has:e=>"$countIcon"in e,get:e=>e.$countIcon,set:(e,t)=>{e.$countIcon=t}},metadata:b},ne,se),T(null,null,m,{kind:"field",name:"$selectedCount",static:!1,private:!1,access:{has:e=>"$selectedCount"in e,get:e=>e.$selectedCount,set:(e,t)=>{e.$selectedCount=t}},metadata:b},ie,oe),T(null,null,g,{kind:"field",name:"$dropdown",static:!1,private:!1,access:{has:e=>"$dropdown"in e,get:e=>e.$dropdown,set:(e,t)=>{e.$dropdown=t}},metadata:b},ae,re),T(null,null,f,{kind:"field",name:"$loading",static:!1,private:!1,access:{has:e=>"$loading"in e,get:e=>e.$loading,set:(e,t)=>{e.$loading=t}},metadata:b},le,ce),T(null,null,y,{kind:"field",name:"$loadingText",static:!1,private:!1,access:{has:e=>"$loadingText"in e,get:e=>e.$loadingText,set:(e,t)=>{e.$loadingText=t}},metadata:b},de,pe),T(null,null,v,{kind:"field",name:"$noData",static:!1,private:!1,access:{has:e=>"$noData"in e,get:e=>e.$noData,set:(e,t)=>{e.$noData=t}},metadata:b},he,ue),T(null,null,w,{kind:"field",name:"$noSelection",static:!1,private:!1,access:{has:e=>"$noSelection"in e,get:e=>e.$noSelection,set:(e,t)=>{e.$noSelection=t}},metadata:b},me,ge),T(null,e={value:t},$,{kind:"class",name:t.name,metadata:b},null,C),t=e.value,b&&Object.defineProperty(t,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:b}),A(t,C)}options=A(this,P,[]);value=(A(this,O),A(this,R,null));clear=(A(this,j),A(this,G,!1));noDataText=(A(this,z),A(this,H,"Empty Users List"));noSelectionText=(A(this,B),A(this,F,"Select a User"));name=(A(this,U),A(this,Z,""));$select=(A(this,V),A(this,W,void 0));$selectedAvatar=(A(this,q),A(this,K,void 0));$selectedName=(A(this,_),A(this,Y,void 0));$githubIcon=(A(this,J),A(this,Q,void 0));$selectedGithub=(A(this,X),A(this,ee,void 0));$countIcon=(A(this,te),A(this,ne,void 0));$selectedCount=(A(this,se),A(this,ie,void 0));$dropdown=(A(this,oe),A(this,ae,void 0));$loading=(A(this,re),A(this,le,void 0));$loadingText=(A(this,ce),A(this,de,void 0));$noData=(A(this,pe),A(this,he,void 0));$noSelection=(A(this,ue),A(this,me,void 0));connectedCallback(){this.$select.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeys.bind(this))}isOpen=(A(this,ge),!1);handleCloseBind;optionsElements=[];close(){this.isOpen=!1,this.$dropdown.classList.remove("open"),document.removeEventListener("mousedown",this.handleCloseBind)}handleClose(e){const t=e.target;t.nodeName===this.nodeName&&t.isOpen||this.close()}handleClick(){this.isOpen=!this.isOpen,this.$dropdown.classList.toggle("open",this.isOpen),this.handleCloseBind=this.handleClose.bind(this),document.addEventListener("mousedown",this.handleCloseBind),this.focusSelected()}focusSelected(){const e=this.options?.findIndex((e=>e===this.value));e&&-1!==e?(this.optionsElements[e].focus(),this.index=e):this.optionsElements.length&&this.optionsElements[0].focus()}handleSelect(e){console.log("clicked");const{id:t}=e.currentTarget.dataset,n=this.options?.find((e=>e.id===t));this.value=n||null,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,name:this.name}})),this.close()}loadingMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="none",this.$noSelection.style.display="none",this.$loading.style.display="flex",this.$loadingText.style.display="initial",this.$select.disabled=!0}noDataMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="initial",this.$noSelection.style.display="none",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!0}noSelectionMode(){this.$selectedAvatar.style.display="none",this.$selectedName.style.display="none",this.$githubIcon.style.display="none",this.$selectedGithub.style.display="none",this.$countIcon.style.display="none",this.$selectedCount.style.display="none",this.$noData.style.display="none",this.$noSelection.style.display="initial",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!1}selectMode(){this.$selectedAvatar.style.display="initial",this.$selectedName.style.display="initial",this.$githubIcon.style.display="initial",this.$selectedGithub.style.display="initial",this.$countIcon.style.display="initial",this.$selectedCount.style.display="initial",this.$noData.style.display="none",this.$noSelection.style.display="none",this.$loading.style.display="none",this.$loadingText.style.display="none",this.$select.disabled=!1}render(e){e.options&&(null===this.options?this.loadingMode():0===this.options.length?this.noDataMode():(this.selectMode(),this.calculateMinWidth(),this.optionsElements=this.options.map((e=>{const t=document.createElement("button"),n=document.createElement("img");n.src=`${e.base64}`,n.classList.add("avatar"),t.appendChild(n);const s=document.createElement("span");s.innerText=`${e.name}`,s.classList.add("name"),t.appendChild(s);const i=document.createElement("span");i.innerText=`${e.github}`,i.classList.add("github"),t.appendChild(i);const o=document.createElement("span");return o.innerText=`${e.iconCount}`,o.classList.add("iconCount"),t.appendChild(o),t.dataset.id=`${e.id}`,t.appendChild(I("M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z","githubIcon")),t.appendChild(I("M11,13.5V21.5H3V13.5H11M12,2L17.5,11H6.5L12,2M17.5,13C20,13 22,15 22,17.5C22,20 20,22 17.5,22C15,22 13,20 13,17.5C13,15 15,13 17.5,13Z","countIcon")),t.addEventListener("click",this.handleSelect.bind(this)),this.$dropdown.appendChild(t),t})),null===this.value&&this.noSelectionMode())),e.value&&e.value&&this.value&&(this.$selectedAvatar.src=this.value.base64||"",this.$selectedCount.innerText=`${this.value.iconCount}`,this.$selectedName.innerText=`${this.value.name}`,this.$selectedGithub.innerText=`${this.value.github}`,this.selectMode()),e.noDataText&&(this.$noData.innerText=this.noDataText),e.noSelectionText&&(this.$noSelection.innerText=this.noSelectionText)}calculateMinWidth(){const{width:e}=this.$select.getBoundingClientRect();this.$dropdown.style.minWidth=e-2+"px"}index=-1;handleKeys(e){const t=this.optionsElements;let n=this.index;switch(e.key){case M:0===n?n=t.length-1:n>=0&&(n-=1);break;case L:n<t.length-1?n+=1:n===t.length-1&&(n=0);break;case N:case D:this.close()}n!=this.index&&(this.index=n,t[n].focus(),e.preventDefault())}})})()})();

package/pgListTag.js

@@ -1 +1 @@
-(()=>{"use strict";var t={314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r="",o=void 0!==e[5];return e[4]&&(r+="@supports (".concat(e[4],") {")),e[2]&&(r+="@media ".concat(e[2]," {")),o&&(r+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),r+=t(e),o&&(r+="}"),e[2]&&(r+="}"),e[4]&&(r+="}"),r})).join("")},e.i=function(t,r,o,n,s){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(o)for(var a=0;a<this.length;a++){var c=this[a][0];null!=c&&(i[c]=!0)}for(var l=0;l<t.length;l++){var p=[].concat(t[l]);o&&i[p[0]]||(void 0!==s&&(void 0===p[5]||(p[1]="@layer".concat(p[5].length>0?" ".concat(p[5]):""," {").concat(p[1],"}")),p[5]=s),r&&(p[2]?(p[1]="@media ".concat(p[2]," {").concat(p[1],"}"),p[2]=r):p[2]=r),n&&(p[4]?(p[1]="@supports (".concat(p[4],") {").concat(p[1],"}"),p[4]=n):p[4]="".concat(n)),e.push(p))}},e}},601:t=>{t.exports=function(t){return t[1]}},833:(t,e,r)=>{r.d(e,{A:()=>c});var o=r(601),n=r.n(o),s=r(314),i=r.n(s)()(n());i.push([t.id,':host {\n  display: inline-flex;\n  color: var(--pg-icon-color, #453C4F);\n}\n\n[part="svg"] {\n  width: var(--pg-icon-width, 1.5rem);\n  height: var(--pg-icon-height, 1.5rem);\n}',""]);var a=new CSSStyleSheet;a.replaceSync(i.toString());const c=a}},e={};function r(o){var n=e[o];if(void 0!==n)return n.exports;var s=e[o]={id:o,exports:{}};return t[o](s,s.exports,r),s.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var o in e)r.o(e,o)&&!r.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const o=Symbol("addObserver"),n=Symbol("removeObserver"),s=Symbol("getObservers"),i=Symbol("swapObserver"),a=Symbol("isProxy"),c=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],p=new Map;function u(t){return new Proxy(t,{get(e,r){if("symbol"==typeof r){switch(r){case a:return!0;case c:return e;case s:return p.has(t);case i:return(e,r)=>{const o=p.get(t);o.forEach(((n,s)=>{if(s.getRootNode().host===e){const e=o.get(s);p.has(r)?p.get(r).has(s)?p.get(r).get(s).push(o.get(s)):p.get(r).set(s,o.get(s)):p.set(r,new Map([[s,e]])),p.delete(t),e.forEach((t=>{t(null,h.swap,[r])}))}}))};case o:return(e,r)=>{p.has(t)?p.get(t).has(e)?p.get(t).get(e).push(r):p.get(t).set(e,[r]):p.set(t,new Map([[e,[r]]]))};case n:return e=>{p.has(t)&&(p.get(t).delete(e),0===p.get(t).size&&p.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,r)}throw new Error("Unsupported symbol")}if(r in e){if(!Number.isNaN(Number(r)))return"object"==typeof e[r]?u(e[r]):e[r];if("copyWithin"===r)throw new Error("Unsupported array method copyWithin");if(l.includes(r))return p.has(e)?function(){const t=Array.prototype[r].apply(e,arguments);return p.get(e).forEach(((t,o)=>{t.forEach((t=>{t(e,r,arguments)}))})),t}:Reflect.get(e,r);if(e[r]instanceof Array)return u(e[r])}return Reflect.get(e,r)},set(t,e,r){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,r);if(p.has(t)){p.get(t).forEach(((t,o)=>{t.forEach((t=>{t(e,r)}))}))}return Reflect.set(t,e,r)}})}window.observers=p;const h={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),f=Symbol("template"),m=Symbol("style"),y=Symbol("parent");function g(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,r){if("class"!==r.kind)throw new Error("@Component() can only decorate a class");var o,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[m]=t.style?[t.style]:[],e.prototype[f]=t.template||""):(e.prototype[y].push(e.prototype),e.prototype[m].push(t.style),e.prototype[f]=(o=e.prototype[f],(n=t.template||null)&&n.match(/<parent\/>/)?n.replace(/<parent\/>/,o):`${o}${n||""}`));const s=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[f]||"";const r=document.importNode(t.content,!0),o=this.attachShadow({mode:"open"});o.adoptedStyleSheets=e.prototype[m].map((t=>{if(t instanceof CSSStyleSheet)return t;var e=new CSSStyleSheet;return e.replaceSync(t.toString()),e})),o.appendChild(r)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const r=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&r.add(t.localName);const o=Array.from(r.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[b(e)]=!0,t)),{}):{})}))};0===o.length?(this[d]=!0,s.call(this),n()):Promise.all(o).then((()=>{this[d]=!0,s.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));n()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,r){this[b(t)]=r},r.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${r.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function w(t){return!!t&&t.constructor===Array}function S(t,e){t[d]&&t[y].map((r=>{r.render&&r.render.call(t,{[e]:!0})}))}function E(t){return null===t?"null":w(t)?"array":typeof t}function P(t){return function(e,r){const o=r.name,n=Symbol(o),l=Symbol(`${o}:type`),p=Symbol(`${o}:meta`);return r.addInitializer((function(){Reflect.defineProperty(this,o,{get:()=>"object"===this[l]||"array"===this[l]?this[n][a]?this[n]:u(this[n]):this[n],set:e=>{const r=E(t?t(e):e);if("index"!==o&&this[l]!==r&&"null"!==this[l]&&"null"!==r)throw new Error(`@Prop() ${o} with type '${this[l]}' cannot be set to ${r}.`);if("array"===this[l]){if(!w(e))throw new PropError(`Array "${o}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,o)?.set);if(this[n]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[n]);if(t[s]){const r=e[a]?e[c]:e;t[i](this,r),this[n]=e,console.log(">>> trigger render???",this,o)}else this[n]=e}else this[n]=t?t(e):e,S(this,o)}})})),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(!r.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,r=g(o);e[o]||(t.observedAttributes.push(r),e[o]=n)}return this[l]=E(e),"array"===this[l]?(this[n]=e,new Proxy(e,{get:(t,e)=>e===x?this[p]:(console.log("errr???"),Reflect.get(this[n],e)),set:(t,e,r)=>{if(e===x)return this[p]=r,!0;const s=Reflect.set(t,e,r);return"length"===e&&this[n].length===r||S(this,o),this[n]=r,s}})):(this[n]=t?t(this.getAttribute(o)??e):this.getAttribute(o)??e,this[n])}}}Symbol("hasProxy");const x=Symbol("meta");var A=r(833),$=function(t,e,r,o,n,s){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var a,c=o.kind,l="getter"===c?"get":"setter"===c?"set":"value",p=!e&&t?o.static?t:t.prototype:null,u=e||(p?Object.getOwnPropertyDescriptor(p,o.name):{}),h=!1,d=r.length-1;d>=0;d--){var f={};for(var m in o)f[m]="access"===m?{}:o[m];for(var m in o.access)f.access[m]=o.access[m];f.addInitializer=function(t){if(h)throw new TypeError("Cannot add initializers after decoration has completed");s.push(i(t||null))};var y=(0,r[d])("accessor"===c?{get:u.get,set:u.set}:u[l],f);if("accessor"===c){if(void 0===y)continue;if(null===y||"object"!=typeof y)throw new TypeError("Object expected");(a=i(y.get))&&(u.get=a),(a=i(y.set))&&(u.set=a),(a=i(y.init))&&n.unshift(a)}else(a=i(y))&&("field"===c?n.unshift(a):u[l]=a)}p&&Object.defineProperty(p,o.name,u),h=!0},O=function(t,e,r){for(var o=arguments.length>2,n=0;n<e.length;n++)r=o?e[n].call(t,r):e[n].call(t);return o?r:void 0};(()=>{let t,e,r,o,n,s=[v({selector:"pg-list-tag",style:A.A,template:'<div part="items"></div>'})],i=[],a=HTMLElement,c=[],l=[],p=[],u=[],h=[],d=[];(class extends a{static{e=this}static{const f="function"==typeof Symbol&&Symbol.metadata?Object.create(a[Symbol.metadata]??null):void 0;r=[P()],o=[P()],n=[function(t,e){const r=e.name,o=r.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,r,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${o}]`))}})}))}],$(null,null,r,{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:f},c,l),$(null,null,o,{kind:"field",name:"edit",static:!1,private:!1,access:{has:t=>"edit"in t,get:t=>t.edit,set:(t,e)=>{t.edit=e}},metadata:f},p,u),$(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:f},h,d),$(null,t={value:e},s,{kind:"class",name:e.name,metadata:f},null,i),e=t.value,f&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:f}),O(e,i)}items=O(this,c,[]);edit=(O(this,l),O(this,p,!1));$items=(O(this,u),O(this,h,void 0));render(t){t.items&&function(t,e,r,o,n){const s=Array.from(t.children),i=s.map((t=>t.dataset.key)),a=e.map((t=>t[r]));e.forEach((e=>{if(!i.includes(e[r])){const n=o(e);return n instanceof DocumentFragment?n.children[0].dataset.key=e[r]:n.dataset.key=e[r],void t.appendChild(n)}{const t=s.find((t=>t.dataset.key===i[r]));if(e[r]===i[r])return void n(e,t)}})),s.forEach((t=>{a.includes(t.dataset.key)||t.remove()}))}(this.$items,this.items,"id",(t=>{const e=function(t,e){const r=document.createElement("template");r.innerHTML=t;const o=document.importNode(r.content,!0);for(const[t,r]of Object.entries(e)){const e=o.querySelector(`[part~="${t}"]`);if(e)for(const[t,o]of Object.entries(r))o instanceof Function?null===o()?e.removeAttribute(t):e.setAttribute(t,o()):e[t]=o}return o}('<button part="name"> </button>',{name:{innerText:t.name}}),r=e.querySelector('[part="name"]');return r?.addEventListener("click",(e=>{console.log(t)})),e}),((t,e)=>{})),t.edit}constructor(){super(...arguments),O(this,d)}})})()})();
+(()=>{"use strict";var t={314:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var r="",o=void 0!==e[5];return e[4]&&(r+="@supports (".concat(e[4],") {")),e[2]&&(r+="@media ".concat(e[2]," {")),o&&(r+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),r+=t(e),o&&(r+="}"),e[2]&&(r+="}"),e[4]&&(r+="}"),r})).join("")},e.i=function(t,r,o,n,s){"string"==typeof t&&(t=[[null,t,void 0]]);var i={};if(o)for(var a=0;a<this.length;a++){var c=this[a][0];null!=c&&(i[c]=!0)}for(var l=0;l<t.length;l++){var p=[].concat(t[l]);o&&i[p[0]]||(void 0!==s&&(void 0===p[5]||(p[1]="@layer".concat(p[5].length>0?" ".concat(p[5]):""," {").concat(p[1],"}")),p[5]=s),r&&(p[2]?(p[1]="@media ".concat(p[2]," {").concat(p[1],"}"),p[2]=r):p[2]=r),n&&(p[4]?(p[1]="@supports (".concat(p[4],") {").concat(p[1],"}"),p[4]=n):p[4]="".concat(n)),e.push(p))}},e}},601:t=>{t.exports=function(t){return t[1]}},833:(t,e,r)=>{r.d(e,{A:()=>c});var o=r(601),n=r.n(o),s=r(314),i=r.n(s)()(n());i.push([t.id,':host {\n  display: inline-flex;\n  color: var(--pg-icon-color, #453C4F);\n}\n\n[part="svg"] {\n  width: var(--pg-icon-width, 1.5rem);\n  height: var(--pg-icon-height, 1.5rem);\n}',""]);var a=new CSSStyleSheet;a.replaceSync(i.toString());const c=a}},e={};function r(o){var n=e[o];if(void 0!==n)return n.exports;var s=e[o]={id:o,exports:{}};return t[o](s,s.exports,r),s.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var o in e)r.o(e,o)&&!r.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);const o=Symbol("addObserver"),n=Symbol("removeObserver"),s=Symbol("getObservers"),i=Symbol("swapObserver"),a=Symbol("isProxy"),c=Symbol("getTarget"),l=["fill","pop","push","reverse","shift","sort","splice","unshift"],p=new Map;function u(t){return new Proxy(t,{get(e,r){if("symbol"==typeof r){switch(r){case a:return!0;case c:return e;case s:return e=>{const r=p.get(t);return r?.has(e)};case i:return(e,r)=>{const o=p.get(t);if(o){const t=o.get(e);t&&t.forEach(((o,n)=>{if(!o)throw new Error("Unreachable");{const t=p.get(r);if(t){const r=t.get(e);r?r.set(n,o):t.set(e,new Map([[n,o]]))}else p.set(r,new Map([[e,new Map([[n,o]])]]))}t.delete(n),o.forEach((t=>{t(null,h.swap,[r])}))}))}};case o:return(e,r)=>{const o=e.getRootNode().host,n=p.get(t);if(n){const t=n.get(o);if(t){const o=t.get(e);o?o.push(r):t.set(e,[r])}else n.set(o,new Map([[e,[r]]]))}else p.set(t,new Map([[o,new Map([[e,[r]]])]]))};case n:return e=>{const r=e.getRootNode().host,o=p.get(t);o&&(o.delete(r),0===o.size&&p.delete(t))};case Symbol.toPrimitive:case Symbol.toStringTag:return Reflect.get(e,r)}throw new Error("Unsupported symbol")}if(r in e){if(!Number.isNaN(Number(r)))return"object"==typeof e[r]?u(e[r]):e[r];if("copyWithin"===r)throw new Error("Unsupported array method copyWithin");if(l.includes(r))return p.has(e)?function(){const t=Array.prototype[r].apply(e,arguments),o=p.get(e);return o?.forEach((t=>{t.forEach((t=>{t.forEach((t=>{t(e,r,arguments)}))}))})),t}:Reflect.get(e,r);if(e[r]instanceof Array)return u(e[r])}return Reflect.get(e,r)},set(t,e,r){if("symbol"==typeof e)throw new Error("Setting symbols not allowed.");if(Array.isArray(t))return Reflect.set(t,e,r);if(p.has(t)){const o=p.get(t);o?.forEach((t=>{t.forEach((t=>{t.forEach((t=>{t(e,r)}))}))}))}return Reflect.set(t,e,r)}})}window.observers=p;const h={fill:"fill",pop:"pop",push:"push",reverse:"reverse",shift:"shift",sort:"sort",splice:"splice",unshift:"unshift",swap:"swap"};class PropError extends Error{constructor(t,e){super(t),this.name="PropError",Error.captureStackTrace&&Error.captureStackTrace(this,e)}}Symbol("index");const d=Symbol("init"),f=Symbol("template"),m=Symbol("style"),y=Symbol("parent");function b(t){return t.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function v(t){return t.replace(/-([a-z])/g,(t=>t[1].toUpperCase()))}function g(t={}){return function(e,r){if("class"!==r.kind)throw new Error("@Component() can only decorate a class");var o,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[m]=t.style?[t.style]:[],e.prototype[f]=t.template||""):(e.prototype[y].push(e.prototype),e.prototype[m].push(t.style),e.prototype[f]=(o=e.prototype[f],(n=t.template||null)&&n.match(/<parent\/>/)?n.replace(/<parent\/>/,o):o.match(/<child\/>/)?o.replace(/<child\/>/,n||""):`${o}${n||""}`));const s=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[f]||"";const r=document.importNode(t.content,!0),o=this.attachShadow({mode:"open"});o.adoptedStyleSheets=e.prototype[m].reduce(((t,e)=>{if(!e)return t;if(e instanceof CSSStyleSheet)return t.push(e),t;var r=new CSSStyleSheet;return r.replaceSync(e.toString()),t.push(r),t}),[]),o.appendChild(r)}}else!1===t.useShadow||this.attachShadow({mode:"open"});const r=new Set;for(const t of this.shadowRoot.querySelectorAll("*"))-1!==t.localName.indexOf("-")&&r.add(t.localName);const o=Array.from(r.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[v(e)]=!0,t)),{}):{})}))};0===o.length?(this[d]=!0,s.call(this),n()):Promise.all(o).then((()=>{this[d]=!0,s.call(this);for(const t of this.shadowRoot.querySelectorAll("slot"))t.dispatchEvent(new CustomEvent("slotchange"));n()}))},e.prototype.disconnectedCallback=function(){i.call(this)},e.prototype.attributeChangedCallback=function(t,e,r){this[v(t)]=r},r.addInitializer((function(){if(t.selector){if(window.customElements.get(t.selector))throw new Error(`@Component() ${r.name} duplicate selector '${t.selector}'`);window.customElements.define(t.selector,e)}}))}}Symbol("transmute");function w(t){return!!t&&t.constructor===Array}function S(t,e){t[d]&&t[y].map((r=>{r.render&&r.render.call(t,{[e]:!0})}))}function E(t){return null===t?"null":w(t)?"array":typeof t}function P(t){return function(e,r){const o=r.name,n=Symbol(o),l=Symbol(`${o}:type`),p=Symbol(`${o}:meta`);return r.addInitializer((function(){Reflect.defineProperty(this,o,{get:()=>"object"===this[l]||"array"===this[l]?this[n][a]?this[n]:u(this[n]):this[n],set:e=>{const r=E(t?t(e):e);if("index"!==o&&this[l]!==r&&"null"!==this[l]&&"null"!==r)throw new Error(`@Prop() ${o} with type '${this[l]}' cannot be set to ${r}.`);if("array"===this[l]){if(!w(e))throw new PropError(`Array "${o}" (Prop) initialized already. Reassignments must be array type.`,Object.getOwnPropertyDescriptor(this,o)?.set);if(this[n]===e)throw new Error("Setting an array to itself is not allowed.");const t=u(this[n]);if(t[s](this)){const r=e[a]?e[c]:e;t[i](this,r),this[n]=e}else this[n]=e}else this[n]=t?t(e):e,S(this,o)}})})),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(!r.private){const{constructor:t}=this;t.observedAttributes??=[],t.symbols||(t.symbols={});const{symbols:e}=t,r=b(o);e[o]||(t.observedAttributes.push(r),e[o]=n)}return this[l]=E(e),"array"===this[l]?(this[n]=e,new Proxy(e,{get:(t,e)=>e===x?this[p]:(console.log("errr???"),Reflect.get(this[n],e)),set:(t,e,r)=>{if(e===x)return this[p]=r,!0;const s=Reflect.set(t,e,r);return"length"===e&&this[n].length===r||S(this,o),this[n]=r,s}})):(this[n]=t?t(this.getAttribute(o)??e):this.getAttribute(o)??e,this[n])}}}Symbol("hasProxy");const x=Symbol("meta");var A=r(833),$=function(t,e,r,o,n,s){function i(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var a,c=o.kind,l="getter"===c?"get":"setter"===c?"set":"value",p=!e&&t?o.static?t:t.prototype:null,u=e||(p?Object.getOwnPropertyDescriptor(p,o.name):{}),h=!1,d=r.length-1;d>=0;d--){var f={};for(var m in o)f[m]="access"===m?{}:o[m];for(var m in o.access)f.access[m]=o.access[m];f.addInitializer=function(t){if(h)throw new TypeError("Cannot add initializers after decoration has completed");s.push(i(t||null))};var y=(0,r[d])("accessor"===c?{get:u.get,set:u.set}:u[l],f);if("accessor"===c){if(void 0===y)continue;if(null===y||"object"!=typeof y)throw new TypeError("Object expected");(a=i(y.get))&&(u.get=a),(a=i(y.set))&&(u.set=a),(a=i(y.init))&&n.unshift(a)}else(a=i(y))&&("field"===c?n.unshift(a):u[l]=a)}p&&Object.defineProperty(p,o.name,u),h=!0},O=function(t,e,r){for(var o=arguments.length>2,n=0;n<e.length;n++)r=o?e[n].call(t,r):e[n].call(t);return o?r:void 0};(()=>{let t,e,r,o,n,s=[g({selector:"pg-list-tag",style:A.A,template:'<div part="items"></div>'})],i=[],a=HTMLElement,c=[],l=[],p=[],u=[],h=[],d=[];(class extends a{static{e=this}static{const f="function"==typeof Symbol&&Symbol.metadata?Object.create(a[Symbol.metadata]??null):void 0;r=[P()],o=[P()],n=[function(t,e){const r=e.name,o=r.replace(/^\$/,"");e.addInitializer((function(){let t=null;Reflect.defineProperty(this,r,{get(){return t??(t=this.shadowRoot?.querySelector(`[part~=${o}]`))}})}))}],$(null,null,r,{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:f},c,l),$(null,null,o,{kind:"field",name:"edit",static:!1,private:!1,access:{has:t=>"edit"in t,get:t=>t.edit,set:(t,e)=>{t.edit=e}},metadata:f},p,u),$(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:f},h,d),$(null,t={value:e},s,{kind:"class",name:e.name,metadata:f},null,i),e=t.value,f&&Object.defineProperty(e,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:f}),O(e,i)}items=O(this,c,[]);edit=(O(this,l),O(this,p,!1));$items=(O(this,u),O(this,h,void 0));render(t){t.items&&function(t,e,r,o,n){const s=Array.from(t.children),i=s.map((t=>t.dataset.key)),a=e.map((t=>t[r]));e.forEach((e=>{if(!i.includes(e[r])){const n=o(e);return n instanceof DocumentFragment?n.children[0].dataset.key=e[r]:n.dataset.key=e[r],void t.appendChild(n)}{const t=s.find((t=>t.dataset.key===i[r]));if(e[r]===i[r])return void n(e,t)}})),s.forEach((t=>{a.includes(t.dataset.key)||t.remove()}))}(this.$items,this.items,"id",(t=>{const e=function(t,e){const r=document.createElement("template");r.innerHTML=t;const o=document.importNode(r.content,!0);for(const[t,r]of Object.entries(e)){const e=o.querySelector(`[part~="${t}"]`);if(e)for(const[t,o]of Object.entries(r))o instanceof Function?null===o()?e.removeAttribute(t):e.setAttribute(t,o()):e[t]=o}return o}('<button part="name"> </button>',{name:{innerText:t.name}}),r=e.querySelector('[part="name"]');return r?.addEventListener("click",(e=>{console.log(t)})),e}),((t,e)=>{})),t.edit}constructor(){super(...arguments),O(this,d)}})})()})();