proto-table-wc 0.0.454 → 0.0.456

package/dist/cjs/demo-table_2.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-955d8089.js');
+const index = require('./index-267e3f8d.js');
 
 const demoTableCss = ".detailWrapper{font-weight:100;font-size:13px;display:flex;flex-direction:column;justify-items:start;padding:5px;padding-left:30px}";
 

package/dist/cjs/{index-955d8089.js → index-267e3f8d.js}

@@ -366,11 +366,19 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                 // except for the first character, we keep the event name case
                 memberName = ln[2] + memberName.slice(3);
             }
-            if (oldValue) {
-                plt.rel(elm, memberName, oldValue, false);
-            }
-            if (newValue) {
-                plt.ael(elm, memberName, newValue, false);
+            if (oldValue || newValue) {
+                // Need to account for "capture" events.
+                // If the event name ends with "Capture", we'll update the name to remove
+                // the "Capture" suffix and make sure the event listener is setup to handle the capture event.
+                const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+                // Make sure we only replace the last instance of "Capture"
+                memberName = memberName.replace(CAPTURE_EVENT_REGEX, '');
+                if (oldValue) {
+                    plt.rel(elm, memberName, oldValue, capture);
+                }
+                if (newValue) {
+                    plt.ael(elm, memberName, newValue, capture);
+                }
             }
         }
         else {
@@ -412,6 +420,8 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
 };
 const parseClassListRegex = /\s/;
 const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
+const CAPTURE_EVENT_SUFFIX = 'Capture';
+const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
 const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
     // if the element passed in is a shadow root, which is a document fragment
     // then we want to be adding attrs/props to the shadow root's "host" element

package/dist/cjs/loader.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-955d8089.js');
+const index = require('./index-267e3f8d.js');
 
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;

package/dist/cjs/proto-table-wc.cjs.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-955d8089.js');
+const index = require('./index-267e3f8d.js');
 
 /*
- Stencil Client Patch Browser v4.6.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.7.1 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('proto-table-wc.cjs.js', document.baseURI).href));

package/dist/collection/collection-manifest.json

@@ -5,7 +5,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.6.0",
+    "version": "4.7.1",
     "typescriptVersion": "5.2.2"
   },
   "collections": [],

package/dist/esm/demo-table_2.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-89b90415.js';
+import { r as registerInstance, h } from './index-4a0356a5.js';
 
 const demoTableCss = ".detailWrapper{font-weight:100;font-size:13px;display:flex;flex-direction:column;justify-items:start;padding:5px;padding-left:30px}";
 

package/dist/esm/{index-89b90415.js → index-4a0356a5.js}

@@ -344,11 +344,19 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                 // except for the first character, we keep the event name case
                 memberName = ln[2] + memberName.slice(3);
             }
-            if (oldValue) {
-                plt.rel(elm, memberName, oldValue, false);
-            }
-            if (newValue) {
-                plt.ael(elm, memberName, newValue, false);
+            if (oldValue || newValue) {
+                // Need to account for "capture" events.
+                // If the event name ends with "Capture", we'll update the name to remove
+                // the "Capture" suffix and make sure the event listener is setup to handle the capture event.
+                const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+                // Make sure we only replace the last instance of "Capture"
+                memberName = memberName.replace(CAPTURE_EVENT_REGEX, '');
+                if (oldValue) {
+                    plt.rel(elm, memberName, oldValue, capture);
+                }
+                if (newValue) {
+                    plt.ael(elm, memberName, newValue, capture);
+                }
             }
         }
         else {
@@ -390,6 +398,8 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
 };
 const parseClassListRegex = /\s/;
 const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
+const CAPTURE_EVENT_SUFFIX = 'Capture';
+const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
 const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
     // if the element passed in is a shadow root, which is a document fragment
     // then we want to be adding attrs/props to the shadow root's "host" element

package/dist/esm/loader.js

@@ -1,5 +1,5 @@
-import { b as bootstrapLazy } from './index-89b90415.js';
-export { s as setNonce } from './index-89b90415.js';
+import { b as bootstrapLazy } from './index-4a0356a5.js';
+export { s as setNonce } from './index-4a0356a5.js';
 
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;

package/dist/esm/proto-table-wc.js

@@ -1,8 +1,8 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-89b90415.js';
-export { s as setNonce } from './index-89b90415.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-4a0356a5.js';
+export { s as setNonce } from './index-4a0356a5.js';
 
 /*
- Stencil Client Patch Browser v4.6.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.7.1 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = import.meta.url;

package/dist/proto-table-wc/p-0f6e26e3.js

@@ -0,0 +1,2 @@
+let n,t,e=!1,l=!1;const o={},s=n=>"object"==(n=typeof n)||"function"===n;function i(n){var t,e,l;return null!==(l=null===(e=null===(t=n.head)||void 0===t?void 0:t.querySelector('meta[name="csp-nonce"]'))||void 0===e?void 0:e.getAttribute("content"))&&void 0!==l?l:void 0}const c=(n,t,...e)=>{let l=null,o=!1,i=!1;const c=[],u=t=>{for(let e=0;e<t.length;e++)l=t[e],Array.isArray(l)?u(l):null!=l&&"boolean"!=typeof l&&((o="function"!=typeof n&&!s(l))&&(l+=""),o&&i?c[c.length-1].t+=l:c.push(o?r(null,l):l),i=o)};if(u(e),t){const n=t.className||t.class;n&&(t.class="object"!=typeof n?n:Object.keys(n).filter((t=>n[t])).join(" "))}const a=r(n,null);return a.l=t,c.length>0&&(a.o=c),a},r=(n,t)=>({i:0,u:n,t,p:null,o:null,l:null}),u={},a=new WeakMap,f=n=>"sc-"+n.h,d=(n,t,e,l,o,i)=>{if(e!==l){let c=V(n,t),r=t.toLowerCase();if("class"===t){const t=n.classList,o=h(e),s=h(l);t.remove(...o.filter((n=>n&&!s.includes(n)))),t.add(...s.filter((n=>n&&!o.includes(n))))}else if("ref"===t)l&&l(n);else if(c||"o"!==t[0]||"n"!==t[1]){const r=s(l);if((c||r&&null!==l)&&!o)try{if(n.tagName.includes("-"))n[t]=l;else{const o=null==l?"":l;"list"===t?c=!1:null!=e&&n[t]==o||(n[t]=o)}}catch(n){}null==l||!1===l?!1===l&&""!==n.getAttribute(t)||n.removeAttribute(t):(!c||4&i||o)&&!r&&n.setAttribute(t,l=!0===l?"":l)}else if(t="-"===t[2]?t.slice(3):V(I,r)?r.slice(2):r[2]+t.slice(3),e||l){const o=t.endsWith(y);t=t.replace($,""),e&&K.rel(n,t,e,o),l&&K.ael(n,t,l,o)}}},p=/\s/,h=n=>n?n.split(p):[],y="Capture",$=RegExp(y+"$"),m=(n,t,e,l)=>{const s=11===t.p.nodeType&&t.p.host?t.p.host:t.p,i=n&&n.l||o,c=t.l||o;for(l in i)l in c||d(s,l,i[l],void 0,e,t.i);for(l in c)d(s,l,i[l],c[l],e,t.i)},v=(t,l,o)=>{const s=l.o[o];let i,c,r=0;if(null!==s.t)i=s.p=J.createTextNode(s.t);else{if(e||(e="svg"===s.u),i=s.p=J.createElementNS(e?"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",s.u),e&&"foreignObject"===s.u&&(e=!1),m(null,s,e),null!=n&&i["s-si"]!==n&&i.classList.add(i["s-si"]=n),s.o)for(r=0;r<s.o.length;++r)c=v(t,s,r),c&&i.appendChild(c);"svg"===s.u?e=!1:"foreignObject"===i.tagName&&(e=!0)}return i},w=(n,e,l,o,s,i)=>{let c,r=n;for(r.shadowRoot&&r.tagName===t&&(r=r.shadowRoot);s<=i;++s)o[s]&&(c=v(null,l,s),c&&(o[s].p=c,r.insertBefore(c,e)))},b=(n,t,e)=>{for(let l=t;l<=e;++l){const t=n[l];if(t){const n=t.p;S(t),n&&n.remove()}}},g=(n,t)=>n.u===t.u,j=(n,t)=>{const l=t.p=n.p,o=n.o,s=t.o,i=t.u,c=t.t;null===c?(e="svg"===i||"foreignObject"!==i&&e,m(n,t,e),null!==o&&null!==s?((n,t,e,l)=>{let o,s=0,i=0,c=t.length-1,r=t[0],u=t[c],a=l.length-1,f=l[0],d=l[a];for(;s<=c&&i<=a;)null==r?r=t[++s]:null==u?u=t[--c]:null==f?f=l[++i]:null==d?d=l[--a]:g(r,f)?(j(r,f),r=t[++s],f=l[++i]):g(u,d)?(j(u,d),u=t[--c],d=l[--a]):g(r,d)?(j(r,d),n.insertBefore(r.p,u.p.nextSibling),r=t[++s],d=l[--a]):g(u,f)?(j(u,f),n.insertBefore(u.p,r.p),u=t[--c],f=l[++i]):(o=v(t&&t[i],e,i),f=l[++i],o&&r.p.parentNode.insertBefore(o,r.p));s>c?w(n,null==l[a+1]?null:l[a+1].p,e,l,i,a):i>a&&b(t,s,c)})(l,o,t,s):null!==s?(null!==n.t&&(l.textContent=""),w(l,null,t,s,0,s.length-1)):null!==o&&b(o,0,o.length-1),e&&"svg"===i&&(e=!1)):n.t!==c&&(l.data=c)},S=n=>{n.l&&n.l.ref&&n.l.ref(null),n.o&&n.o.map(S)},O=(n,t)=>{t&&!n.$&&t["s-p"]&&t["s-p"].push(new Promise((t=>n.$=t)))},M=(n,t)=>{if(n.i|=16,!(4&n.i))return O(n,n.m),on((()=>k(n,t)));n.i|=512},k=(n,t)=>{const e=n.v;let l;return t&&(l=N(e,"componentWillLoad")),C(l,(()=>P(n,e,t)))},C=(n,t)=>x(n)?n.then(t):t(),x=n=>n instanceof Promise||n&&n.then&&"function"==typeof n.then,P=async(n,t,e)=>{var l;const o=n.$hostElement$,s=o["s-rc"];e&&(n=>{const t=n.j,e=n.$hostElement$,l=t.i,o=((n,t)=>{var e;const l=f(t),o=G.get(l);if(n=11===n.nodeType?n:J,o)if("string"==typeof o){let t,s=a.get(n=n.head||n);if(s||a.set(n,s=new Set),!s.has(l)){{t=J.createElement("style"),t.innerHTML=o;const l=null!==(e=K.S)&&void 0!==e?e:i(J);null!=l&&t.setAttribute("nonce",l),n.insertBefore(t,n.querySelector("link"))}s&&s.add(l)}}else n.adoptedStyleSheets.includes(o)||(n.adoptedStyleSheets=[...n.adoptedStyleSheets,o]);return l})(e.shadowRoot?e.shadowRoot:e.getRootNode(),t);10&l&&(e["s-sc"]=o,e.classList.add(o+"-h"))})(n);E(n,t,o,e),s&&(s.map((n=>n())),o["s-rc"]=void 0);{const t=null!==(l=o["s-p"])&&void 0!==l?l:[],e=()=>L(n);0===t.length?e():(Promise.all(t).then(e),n.i|=4,t.length=0)}},E=(e,l,o,s)=>{try{l=l.render(),e.i&=-17,e.i|=2,((e,l,o=!1)=>{const s=e.$hostElement$,i=e.O||r(null,null),a=(n=>n&&n.u===u)(l)?l:c(null,null,l);if(t=s.tagName,o&&a.l)for(const n of Object.keys(a.l))s.hasAttribute(n)&&!["key","ref","style","class"].includes(n)&&(a.l[n]=s[n]);a.u=null,a.i|=4,e.O=a,a.p=i.p=s.shadowRoot||s,n=s["s-sc"],j(i,a)})(e,l,s)}catch(n){_(n,e.$hostElement$)}return null},L=n=>{const t=n.$hostElement$,e=n.v,l=n.m;64&n.i||(n.i|=64,R(t),N(e,"componentDidLoad"),n.M(t),l||A()),n.$&&(n.$(),n.$=void 0),512&n.i&&ln((()=>M(n,!1))),n.i&=-517},A=()=>{R(J.documentElement),ln((()=>(n=>{const t=K.ce("appload",{detail:{namespace:"proto-table-wc"}});return n.dispatchEvent(t),t})(I)))},N=(n,t,e)=>{if(n&&n[t])try{return n[t](e)}catch(n){_(n)}},R=n=>n.classList.add("hydrated"),T=(n,t,e)=>{var l;if(t.k){const o=Object.entries(t.k),i=n.prototype;if(o.map((([n,[t]])=>{(31&t||2&e&&32&t)&&Object.defineProperty(i,n,{get(){return((n,t)=>D(this).C.get(t))(0,n)},set(t){((n,t,e)=>{const l=D(n),o=l.C.get(t),i=l.i,c=l.v;e=(n=>(null==n||s(n),n))(e),8&i&&void 0!==o||e===o||Number.isNaN(o)&&Number.isNaN(e)||(l.C.set(t,e),c&&2==(18&i)&&M(l,!1))})(this,n,t)},configurable:!0,enumerable:!0})})),1&e){const e=new Map;i.attributeChangedCallback=function(n,l,o){K.jmp((()=>{const s=e.get(n);if(this.hasOwnProperty(s))o=this[s],delete this[s];else{if(i.hasOwnProperty(s)&&"number"==typeof this[s]&&this[s]==o)return;if(null==s){const e=D(this),s=null==e?void 0:e.i;if(!(8&s)&&128&s&&o!==l){const s=e.v,i=t.P[n];null==i||i.forEach((t=>{null!=s[t]&&s[t].call(s,o,l,n)}))}return}}this[s]=(null!==o||"boolean"!=typeof this[s])&&o}))},n.observedAttributes=Array.from(new Set([...Object.keys(null!==(l=t.P)&&void 0!==l?l:{}),...o.filter((([n,t])=>15&t[0])).map((([n,t])=>{const l=t[1]||n;return e.set(l,n),l}))]))}}return n},W=(n,t={})=>{var e;const l=[],o=t.exclude||[],s=I.customElements,c=J.head,r=c.querySelector("meta[charset]"),u=J.createElement("style"),a=[];let d,p=!0;Object.assign(K,t),K.L=new URL(t.resourcesUrl||"./",J.baseURI).href,n.map((n=>{n[1].map((t=>{const e={i:t[0],h:t[1],k:t[2],A:t[3]};e.k=t[2];const i=e.h,c=class extends HTMLElement{constructor(n){super(n),H(n=this,e),1&e.i&&n.attachShadow({mode:"open"})}connectedCallback(){d&&(clearTimeout(d),d=null),p?a.push(this):K.jmp((()=>(n=>{if(0==(1&K.i)){const t=D(n),e=t.j,l=()=>{};if(1&t.i)(null==t?void 0:t.v)||(null==t?void 0:t.N)&&t.N.then((()=>{}));else{t.i|=1;{let e=n;for(;e=e.parentNode||e.host;)if(e["s-p"]){O(t,t.m=e);break}}e.k&&Object.entries(e.k).map((([t,[e]])=>{if(31&e&&n.hasOwnProperty(t)){const e=n[t];delete n[t],n[t]=e}})),(async(n,t,e)=>{let l;if(0==(32&t.i)){t.i|=32;{if(l=B(e),l.then){const n=()=>{};l=await l,n()}l.isProxied||(T(l,e,2),l.isProxied=!0);const n=()=>{};t.i|=8;try{new l(t)}catch(n){_(n)}t.i&=-9,n()}if(l.style){let n=l.style;const t=f(e);if(!G.has(t)){const l=()=>{};((n,t,e)=>{let l=G.get(n);X&&e?(l=l||new CSSStyleSheet,"string"==typeof l?l=t:l.replaceSync(t)):l=t,G.set(n,l)})(t,n,!!(1&e.i)),l()}}}const o=t.m,s=()=>M(t,!0);o&&o["s-rc"]?o["s-rc"].push(s):s()})(0,t,e)}l()}})(this)))}disconnectedCallback(){K.jmp((()=>(async()=>{if(0==(1&K.i)){const n=D(this);(null==n?void 0:n.v)||(null==n?void 0:n.N)&&n.N.then((()=>{}))}})()))}componentOnReady(){return D(this).N}};e.R=n[0],o.includes(i)||s.get(i)||(l.push(i),s.define(i,T(c,e,1)))}))}));{u.innerHTML=l+"{visibility:hidden}.hydrated{visibility:inherit}",u.setAttribute("data-styles","");const n=null!==(e=K.S)&&void 0!==e?e:i(J);null!=n&&u.setAttribute("nonce",n),c.insertBefore(u,r?r.nextSibling:c.firstChild)}p=!1,a.length?a.map((n=>n.connectedCallback())):K.jmp((()=>d=setTimeout(A,30)))},U=n=>K.S=n,q=new WeakMap,D=n=>q.get(n),F=(n,t)=>q.set(t.v=n,t),H=(n,t)=>{const e={i:0,$hostElement$:n,j:t,C:new Map};return e.N=new Promise((n=>e.M=n)),n["s-p"]=[],n["s-rc"]=[],q.set(n,e)},V=(n,t)=>t in n,_=(n,t)=>(0,console.error)(n,t),z=new Map,B=n=>{const t=n.h.replace(/-/g,"_"),e=n.R,l=z.get(e);return l?l[t]:import(`./${e}.entry.js`).then((n=>(z.set(e,n),n[t])),_)
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/},G=new Map,I="undefined"!=typeof window?window:{},J=I.document||{head:{}},K={i:0,L:"",jmp:n=>n(),raf:n=>requestAnimationFrame(n),ael:(n,t,e,l)=>n.addEventListener(t,e,l),rel:(n,t,e,l)=>n.removeEventListener(t,e,l),ce:(n,t)=>new CustomEvent(n,t)},Q=n=>Promise.resolve(n),X=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(n){}return!1})(),Y=[],Z=[],nn=(n,t)=>e=>{n.push(e),l||(l=!0,t&&4&K.i?ln(en):K.raf(en))},tn=n=>{for(let t=0;t<n.length;t++)try{n[t](performance.now())}catch(n){_(n)}n.length=0},en=()=>{tn(Y),tn(Z),(l=Y.length>0)&&K.raf(en)},ln=n=>Q().then(n),on=nn(Z,!0);export{W as b,c as h,Q as p,F as r,U as s}

package/dist/proto-table-wc/{p-80a6126c.entry.js → p-dcfb580f.entry.js}

@@ -1 +1 @@
-import{r as t,h as e}from"./p-569a1d33.js";const r=class{constructor(r){t(this,r),this.fields=[{label:"Date",prop:"date"},{label:"List Price",prop:"price"},{label:"% of Market",prop:"market"},{label:"ProfitTime Score",prop:"score"}],this.items=[],this.table=void 0,this.renderDetails=t=>{const{tags:r=[]}=t;return e("div",{class:"detailWrapper"},e("span",null,r.length," details..."),e("ul",null,r.map((t=>e("li",null,t)))))}}componentWillLoad(){this.items=[{date:"08/30/2020",price:"$24,000",market:"98%",score:"No Score",tags:["one","two","three"]},{date:"08/31/2020",price:"$24,000",market:"99%",score:"No Score",tags:["uno","duo"]},{date:"09/01/2020",price:"$27,000",market:"102%",score:"Platinum"},{date:"09/02/2020",price:"$27,423",market:"104%",score:"Platinum",tags:["dog","cat","fish","hamster"]},{date:"09/03/2020",price:"$27,521",market:"106%",score:"Platinum",tags:["4wd","sports"]},{date:"09/04/2020",price:"$27,687",market:"107%",score:"Platinum",tags:["leather","chrome"]}]}componentDidLoad(){const{table:t,items:e,fields:r}=this;t.data=e,t.fields=r,t.details=this.renderDetails}render(){return e("proto-table",{ref:t=>this.table=t})}};r.style=".detailWrapper{font-weight:100;font-size:13px;display:flex;flex-direction:column;justify-items:start;padding:5px;padding-left:30px}";const s={down:"M12 15.4L6.6 10 8 8.6l4 4 4-4 1.4 1.4z",up:"M16 15.4l-4-4-4 4L6.6 14 12 8.6l5.4 5.4z",left:"M14 17.4L8.6 12 14 6.6 15.4 8l-4 4 4 4z",right:"M10 17.4L8.6 16l4-4-4-4L10 6.6l5.4 5.4z",more:"M12 14a2 2 0 100-4 2 2 0 000 4zm-6 0a2 2 0 100-4 2 2 0 000 4zm12 0a2 2 0 100-4 2 2 0 000 4z","arrow-up":"M5.3 10.7l1.4 1.4L11 7.8V20h2V7.8l4.3 4.3 1.4-1.4L12 4z","arrow-down":"M18.7 13.3l-1.4-1.4-4.3 4.3V4h-2v12.2l-4.3-4.3-1.4 1.4L12 20z"},i={right:"show",down:"hide","arrow-up":"sort","arrow-down":"sort"},l=class{constructor(r){t(this,r),this.protoIcon=(t,r,l=24)=>{const o=s[t];return e("svg",{width:l,height:l,viewBox:"0 0 24 24",role:"img","aria-labelledby":"title"},e("title",null,(t=>i[t])(t)),e("g",{fill:r},e("path",{d:o})),e("path",{d:"M0 0h24v24H0z",fill:"none"}))},this.handleCellClick=(t,e)=>()=>{0===t&&(this.expanded=this.expanded===e?void 0:e)},this.handleSortClick=t=>()=>{this.sort===t?2===this.clicks?(this.clicks=0,this.sort=void 0):this.clicks=this.clicks+1:(this.sort=t,this.clicks=1)},this.iconFor=t=>this.sort===t&&2===this.clicks?"arrow-up":"arrow-down",this.header=()=>{const{fields:t,iconFor:r,protoIcon:s}=this;return e("div",{class:"header"},t.map((({label:t},i)=>{const l=i===this.sort?"headerCell sort":"headerCell",o=r(i);return e("div",{class:l,onClick:this.handleSortClick(i)},s(o),e("span",null,t))})))},this.row=(t,r)=>{const{fields:s,protoIcon:i}=this;return e("div",{class:"rowContainer"},e("div",{class:this.expanded===r?"row expanded":"row"},s.map((({prop:s},l)=>e("div",{class:l===this.sort?"cell sort":"cell",onClick:this.handleCellClick(l,r)},i(0===l&&this.details?this.expanded===r?"down":"right":"pad"),t[s])))),this.details&&this.expanded===r&&this.details(t))},this.data=[],this.details=void 0,this.fields=[],this.expanded=void 0,this.sort=void 0,this.clicks=0}render(){const t=this.data||[];return e("div",{class:"table"},this.header(),t.map(((t,e)=>this.row(t,e))))}};l.style=".table{font-weight:400;font-size:13px;display:flex;flex-direction:column;width:100%;border:1px solid var(--clrs-navy);border-radius:2px}.table svg{fill:var(--clrs-navy)}.header{display:flex}.headerCell{flex-basis:100%;display:flex;align-items:center;justify-items:start;border-right:1px solid var(--clrs-navy);border-bottom:1px solid var(--clrs-navy);padding:5px;cursor:pointer}.headerCell svg g{display:none}.headerCell.sort svg g{display:inline}.headerCell:hover svg g{display:inline}.headerCell:hover{background-color:var(--clrs-silver)}.headerCell:last-child{border-right:none}.cell{flex-basis:100%;display:flex;align-items:center;justify-items:start;padding:5px}.cell:first-child svg{cursor:pointer}.sort{background-color:var(--cx-column-sort)}.row{display:flex;justify-items:stretch;width:100%}.row.expanded{background-color:var(--cx-row-expanded)}.row.expanded svg{fill:var(--clrs-red)}.row:hover{background-color:var(--cx-row-hover)}";export{r as demo_table,l as proto_table}
+import{r as t,h as e}from"./p-0f6e26e3.js";const r=class{constructor(r){t(this,r),this.fields=[{label:"Date",prop:"date"},{label:"List Price",prop:"price"},{label:"% of Market",prop:"market"},{label:"ProfitTime Score",prop:"score"}],this.items=[],this.table=void 0,this.renderDetails=t=>{const{tags:r=[]}=t;return e("div",{class:"detailWrapper"},e("span",null,r.length," details..."),e("ul",null,r.map((t=>e("li",null,t)))))}}componentWillLoad(){this.items=[{date:"08/30/2020",price:"$24,000",market:"98%",score:"No Score",tags:["one","two","three"]},{date:"08/31/2020",price:"$24,000",market:"99%",score:"No Score",tags:["uno","duo"]},{date:"09/01/2020",price:"$27,000",market:"102%",score:"Platinum"},{date:"09/02/2020",price:"$27,423",market:"104%",score:"Platinum",tags:["dog","cat","fish","hamster"]},{date:"09/03/2020",price:"$27,521",market:"106%",score:"Platinum",tags:["4wd","sports"]},{date:"09/04/2020",price:"$27,687",market:"107%",score:"Platinum",tags:["leather","chrome"]}]}componentDidLoad(){const{table:t,items:e,fields:r}=this;t.data=e,t.fields=r,t.details=this.renderDetails}render(){return e("proto-table",{ref:t=>this.table=t})}};r.style=".detailWrapper{font-weight:100;font-size:13px;display:flex;flex-direction:column;justify-items:start;padding:5px;padding-left:30px}";const s={down:"M12 15.4L6.6 10 8 8.6l4 4 4-4 1.4 1.4z",up:"M16 15.4l-4-4-4 4L6.6 14 12 8.6l5.4 5.4z",left:"M14 17.4L8.6 12 14 6.6 15.4 8l-4 4 4 4z",right:"M10 17.4L8.6 16l4-4-4-4L10 6.6l5.4 5.4z",more:"M12 14a2 2 0 100-4 2 2 0 000 4zm-6 0a2 2 0 100-4 2 2 0 000 4zm12 0a2 2 0 100-4 2 2 0 000 4z","arrow-up":"M5.3 10.7l1.4 1.4L11 7.8V20h2V7.8l4.3 4.3 1.4-1.4L12 4z","arrow-down":"M18.7 13.3l-1.4-1.4-4.3 4.3V4h-2v12.2l-4.3-4.3-1.4 1.4L12 20z"},i={right:"show",down:"hide","arrow-up":"sort","arrow-down":"sort"},l=class{constructor(r){t(this,r),this.protoIcon=(t,r,l=24)=>{const o=s[t];return e("svg",{width:l,height:l,viewBox:"0 0 24 24",role:"img","aria-labelledby":"title"},e("title",null,(t=>i[t])(t)),e("g",{fill:r},e("path",{d:o})),e("path",{d:"M0 0h24v24H0z",fill:"none"}))},this.handleCellClick=(t,e)=>()=>{0===t&&(this.expanded=this.expanded===e?void 0:e)},this.handleSortClick=t=>()=>{this.sort===t?2===this.clicks?(this.clicks=0,this.sort=void 0):this.clicks=this.clicks+1:(this.sort=t,this.clicks=1)},this.iconFor=t=>this.sort===t&&2===this.clicks?"arrow-up":"arrow-down",this.header=()=>{const{fields:t,iconFor:r,protoIcon:s}=this;return e("div",{class:"header"},t.map((({label:t},i)=>{const l=i===this.sort?"headerCell sort":"headerCell",o=r(i);return e("div",{class:l,onClick:this.handleSortClick(i)},s(o),e("span",null,t))})))},this.row=(t,r)=>{const{fields:s,protoIcon:i}=this;return e("div",{class:"rowContainer"},e("div",{class:this.expanded===r?"row expanded":"row"},s.map((({prop:s},l)=>e("div",{class:l===this.sort?"cell sort":"cell",onClick:this.handleCellClick(l,r)},i(0===l&&this.details?this.expanded===r?"down":"right":"pad"),t[s])))),this.details&&this.expanded===r&&this.details(t))},this.data=[],this.details=void 0,this.fields=[],this.expanded=void 0,this.sort=void 0,this.clicks=0}render(){const t=this.data||[];return e("div",{class:"table"},this.header(),t.map(((t,e)=>this.row(t,e))))}};l.style=".table{font-weight:400;font-size:13px;display:flex;flex-direction:column;width:100%;border:1px solid var(--clrs-navy);border-radius:2px}.table svg{fill:var(--clrs-navy)}.header{display:flex}.headerCell{flex-basis:100%;display:flex;align-items:center;justify-items:start;border-right:1px solid var(--clrs-navy);border-bottom:1px solid var(--clrs-navy);padding:5px;cursor:pointer}.headerCell svg g{display:none}.headerCell.sort svg g{display:inline}.headerCell:hover svg g{display:inline}.headerCell:hover{background-color:var(--clrs-silver)}.headerCell:last-child{border-right:none}.cell{flex-basis:100%;display:flex;align-items:center;justify-items:start;padding:5px}.cell:first-child svg{cursor:pointer}.sort{background-color:var(--cx-column-sort)}.row{display:flex;justify-items:stretch;width:100%}.row.expanded{background-color:var(--cx-row-expanded)}.row.expanded svg{fill:var(--clrs-red)}.row:hover{background-color:var(--cx-row-hover)}";export{r as demo_table,l as proto_table}

package/dist/proto-table-wc/proto-table-wc.esm.js

@@ -1 +1 @@
-import{p as a,b as e}from"./p-569a1d33.js";export{s as setNonce}from"./p-569a1d33.js";(()=>{const e=import.meta.url,t={};return""!==e&&(t.resourcesUrl=new URL(".",e).href),a(t)})().then((a=>e([["p-80a6126c",[[1,"demo-table"],[0,"proto-table",{data:[16],details:[8],fields:[16],expanded:[32],sort:[32],clicks:[32]}]]]],a)));
+import{p as e,b as t}from"./p-0f6e26e3.js";export{s as setNonce}from"./p-0f6e26e3.js";(()=>{const t=import.meta.url,s={};return""!==t&&(s.resourcesUrl=new URL(".",t).href),e(s)})().then((e=>t([["p-dcfb580f",[[1,"demo-table"],[0,"proto-table",{data:[16],details:[8],fields:[16],expanded:[32],sort:[32],clicks:[32]}]]]],e)));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "proto-table-wc",
-  "version": "0.0.454",
+  "version": "0.0.456",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -25,11 +25,11 @@
     "format": "prettier --write src"
   },
   "dependencies": {
-    "@stencil/core": "4.6.0"
+    "@stencil/core": "4.7.1"
   },
   "devDependencies": {
     "cspell": "7.3.8",
-    "eslint": "8.52.0",
+    "eslint": "8.53.0",
     "prettier": "3.0.3",
     "tslint": "6.1.3",
     "typescript": "5.2.2"

package/dist/proto-table-wc/p-569a1d33.js

@@ -1,2 +0,0 @@
-let n,t,e=!1,l=!1;const o={},s=n=>"object"==(n=typeof n)||"function"===n;function i(n){var t,e,l;return null!==(l=null===(e=null===(t=n.head)||void 0===t?void 0:t.querySelector('meta[name="csp-nonce"]'))||void 0===e?void 0:e.getAttribute("content"))&&void 0!==l?l:void 0}const c=(n,t,...e)=>{let l=null,o=!1,i=!1;const c=[],u=t=>{for(let e=0;e<t.length;e++)l=t[e],Array.isArray(l)?u(l):null!=l&&"boolean"!=typeof l&&((o="function"!=typeof n&&!s(l))&&(l+=""),o&&i?c[c.length-1].t+=l:c.push(o?r(null,l):l),i=o)};if(u(e),t){const n=t.className||t.class;n&&(t.class="object"!=typeof n?n:Object.keys(n).filter((t=>n[t])).join(" "))}const a=r(n,null);return a.l=t,c.length>0&&(a.o=c),a},r=(n,t)=>({i:0,u:n,t,h:null,o:null,l:null}),u={},a=new WeakMap,f=n=>"sc-"+n.p,d=(n,t,e,l,o,i)=>{if(e!==l){let c=F(n,t),r=t.toLowerCase();if("class"===t){const t=n.classList,o=y(e),s=y(l);t.remove(...o.filter((n=>n&&!s.includes(n)))),t.add(...s.filter((n=>n&&!o.includes(n))))}else if("ref"===t)l&&l(n);else if(c||"o"!==t[0]||"n"!==t[1]){const r=s(l);if((c||r&&null!==l)&&!o)try{if(n.tagName.includes("-"))n[t]=l;else{const o=null==l?"":l;"list"===t?c=!1:null!=e&&n[t]==o||(n[t]=o)}}catch(n){}null==l||!1===l?!1===l&&""!==n.getAttribute(t)||n.removeAttribute(t):(!c||4&i||o)&&!r&&n.setAttribute(t,l=!0===l?"":l)}else t="-"===t[2]?t.slice(3):F(B,r)?r.slice(2):r[2]+t.slice(3),e&&I.rel(n,t,e,!1),l&&I.ael(n,t,l,!1)}},h=/\s/,y=n=>n?n.split(h):[],p=(n,t,e,l)=>{const s=11===t.h.nodeType&&t.h.host?t.h.host:t.h,i=n&&n.l||o,c=t.l||o;for(l in i)l in c||d(s,l,i[l],void 0,e,t.i);for(l in c)d(s,l,i[l],c[l],e,t.i)},m=(t,l,o)=>{const s=l.o[o];let i,c,r=0;if(null!==s.t)i=s.h=G.createTextNode(s.t);else{if(e||(e="svg"===s.u),i=s.h=G.createElementNS(e?"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",s.u),e&&"foreignObject"===s.u&&(e=!1),p(null,s,e),null!=n&&i["s-si"]!==n&&i.classList.add(i["s-si"]=n),s.o)for(r=0;r<s.o.length;++r)c=m(t,s,r),c&&i.appendChild(c);"svg"===s.u?e=!1:"foreignObject"===i.tagName&&(e=!0)}return i},$=(n,e,l,o,s,i)=>{let c,r=n;for(r.shadowRoot&&r.tagName===t&&(r=r.shadowRoot);s<=i;++s)o[s]&&(c=m(null,l,s),c&&(o[s].h=c,r.insertBefore(c,e)))},v=(n,t,e)=>{for(let l=t;l<=e;++l){const t=n[l];if(t){const n=t.h;g(t),n&&n.remove()}}},w=(n,t)=>n.u===t.u,b=(n,t)=>{const l=t.h=n.h,o=n.o,s=t.o,i=t.u,c=t.t;null===c?(e="svg"===i||"foreignObject"!==i&&e,p(n,t,e),null!==o&&null!==s?((n,t,e,l)=>{let o,s=0,i=0,c=t.length-1,r=t[0],u=t[c],a=l.length-1,f=l[0],d=l[a];for(;s<=c&&i<=a;)null==r?r=t[++s]:null==u?u=t[--c]:null==f?f=l[++i]:null==d?d=l[--a]:w(r,f)?(b(r,f),r=t[++s],f=l[++i]):w(u,d)?(b(u,d),u=t[--c],d=l[--a]):w(r,d)?(b(r,d),n.insertBefore(r.h,u.h.nextSibling),r=t[++s],d=l[--a]):w(u,f)?(b(u,f),n.insertBefore(u.h,r.h),u=t[--c],f=l[++i]):(o=m(t&&t[i],e,i),f=l[++i],o&&r.h.parentNode.insertBefore(o,r.h));s>c?$(n,null==l[a+1]?null:l[a+1].h,e,l,i,a):i>a&&v(t,s,c)})(l,o,t,s):null!==s?(null!==n.t&&(l.textContent=""),$(l,null,t,s,0,s.length-1)):null!==o&&v(o,0,o.length-1),e&&"svg"===i&&(e=!1)):n.t!==c&&(l.data=c)},g=n=>{n.l&&n.l.ref&&n.l.ref(null),n.o&&n.o.map(g)},j=(n,t)=>{t&&!n.m&&t["s-p"]&&t["s-p"].push(new Promise((t=>n.m=t)))},S=(n,t)=>{if(n.i|=16,!(4&n.i))return j(n,n.$),en((()=>O(n,t)));n.i|=512},O=(n,t)=>{const e=n.v;let l;return t&&(l=A(e,"componentWillLoad")),M(l,(()=>C(n,e,t)))},M=(n,t)=>k(n)?n.then(t):t(),k=n=>n instanceof Promise||n&&n.then&&"function"==typeof n.then,C=async(n,t,e)=>{var l;const o=n.$hostElement$,s=o["s-rc"];e&&(n=>{const t=n.j,e=n.$hostElement$,l=t.i,o=((n,t)=>{var e;const l=f(t),o=z.get(l);if(n=11===n.nodeType?n:G,o)if("string"==typeof o){let t,s=a.get(n=n.head||n);if(s||a.set(n,s=new Set),!s.has(l)){{t=G.createElement("style"),t.innerHTML=o;const l=null!==(e=I.S)&&void 0!==e?e:i(G);null!=l&&t.setAttribute("nonce",l),n.insertBefore(t,n.querySelector("link"))}s&&s.add(l)}}else n.adoptedStyleSheets.includes(o)||(n.adoptedStyleSheets=[...n.adoptedStyleSheets,o]);return l})(e.shadowRoot?e.shadowRoot:e.getRootNode(),t);10&l&&(e["s-sc"]=o,e.classList.add(o+"-h"))})(n);P(n,t,o,e),s&&(s.map((n=>n())),o["s-rc"]=void 0);{const t=null!==(l=o["s-p"])&&void 0!==l?l:[],e=()=>x(n);0===t.length?e():(Promise.all(t).then(e),n.i|=4,t.length=0)}},P=(e,l,o,s)=>{try{l=l.render(),e.i&=-17,e.i|=2,((e,l,o=!1)=>{const s=e.$hostElement$,i=e.O||r(null,null),a=(n=>n&&n.u===u)(l)?l:c(null,null,l);if(t=s.tagName,o&&a.l)for(const n of Object.keys(a.l))s.hasAttribute(n)&&!["key","ref","style","class"].includes(n)&&(a.l[n]=s[n]);a.u=null,a.i|=4,e.O=a,a.h=i.h=s.shadowRoot||s,n=s["s-sc"],b(i,a)})(e,l,s)}catch(n){H(n,e.$hostElement$)}return null},x=n=>{const t=n.$hostElement$,e=n.v,l=n.$;64&n.i||(n.i|=64,E(t),A(e,"componentDidLoad"),n.M(t),l||L()),n.m&&(n.m(),n.m=void 0),512&n.i&&tn((()=>S(n,!1))),n.i&=-517},L=()=>{E(G.documentElement),tn((()=>(n=>{const t=I.ce("appload",{detail:{namespace:"proto-table-wc"}});return n.dispatchEvent(t),t})(B)))},A=(n,t,e)=>{if(n&&n[t])try{return n[t](e)}catch(n){H(n)}},E=n=>n.classList.add("hydrated"),N=(n,t,e)=>{var l;if(t.k){const o=Object.entries(t.k),i=n.prototype;if(o.map((([n,[t]])=>{(31&t||2&e&&32&t)&&Object.defineProperty(i,n,{get(){return((n,t)=>U(this).C.get(t))(0,n)},set(t){((n,t,e)=>{const l=U(n),o=l.C.get(t),i=l.i,c=l.v;e=(n=>(null==n||s(n),n))(e),8&i&&void 0!==o||e===o||Number.isNaN(o)&&Number.isNaN(e)||(l.C.set(t,e),c&&2==(18&i)&&S(l,!1))})(this,n,t)},configurable:!0,enumerable:!0})})),1&e){const e=new Map;i.attributeChangedCallback=function(n,l,o){I.jmp((()=>{const s=e.get(n);if(this.hasOwnProperty(s))o=this[s],delete this[s];else{if(i.hasOwnProperty(s)&&"number"==typeof this[s]&&this[s]==o)return;if(null==s){const e=U(this),s=null==e?void 0:e.i;if(!(8&s)&&128&s&&o!==l){const s=e.v,i=t.P[n];null==i||i.forEach((t=>{null!=s[t]&&s[t].call(s,o,l,n)}))}return}}this[s]=(null!==o||"boolean"!=typeof this[s])&&o}))},n.observedAttributes=Array.from(new Set([...Object.keys(null!==(l=t.P)&&void 0!==l?l:{}),...o.filter((([n,t])=>15&t[0])).map((([n,t])=>{const l=t[1]||n;return e.set(l,n),l}))]))}}return n},T=(n,t={})=>{var e;const l=[],o=t.exclude||[],s=B.customElements,c=G.head,r=c.querySelector("meta[charset]"),u=G.createElement("style"),a=[];let d,h=!0;Object.assign(I,t),I.L=new URL(t.resourcesUrl||"./",G.baseURI).href,n.map((n=>{n[1].map((t=>{const e={i:t[0],p:t[1],k:t[2],A:t[3]};e.k=t[2];const i=e.p,c=class extends HTMLElement{constructor(n){super(n),D(n=this,e),1&e.i&&n.attachShadow({mode:"open"})}connectedCallback(){d&&(clearTimeout(d),d=null),h?a.push(this):I.jmp((()=>(n=>{if(0==(1&I.i)){const t=U(n),e=t.j,l=()=>{};if(1&t.i)(null==t?void 0:t.v)||(null==t?void 0:t.N)&&t.N.then((()=>{}));else{t.i|=1;{let e=n;for(;e=e.parentNode||e.host;)if(e["s-p"]){j(t,t.$=e);break}}e.k&&Object.entries(e.k).map((([t,[e]])=>{if(31&e&&n.hasOwnProperty(t)){const e=n[t];delete n[t],n[t]=e}})),(async(n,t,e)=>{let l;if(0==(32&t.i)){t.i|=32;{if(l=_(e),l.then){const n=()=>{};l=await l,n()}l.isProxied||(N(l,e,2),l.isProxied=!0);const n=()=>{};t.i|=8;try{new l(t)}catch(n){H(n)}t.i&=-9,n()}if(l.style){let n=l.style;const t=f(e);if(!z.has(t)){const l=()=>{};((n,t,e)=>{let l=z.get(n);K&&e?(l=l||new CSSStyleSheet,"string"==typeof l?l=t:l.replaceSync(t)):l=t,z.set(n,l)})(t,n,!!(1&e.i)),l()}}}const o=t.$,s=()=>S(t,!0);o&&o["s-rc"]?o["s-rc"].push(s):s()})(0,t,e)}l()}})(this)))}disconnectedCallback(){I.jmp((()=>(async()=>{if(0==(1&I.i)){const n=U(this);(null==n?void 0:n.v)||(null==n?void 0:n.N)&&n.N.then((()=>{}))}})()))}componentOnReady(){return U(this).N}};e.T=n[0],o.includes(i)||s.get(i)||(l.push(i),s.define(i,N(c,e,1)))}))}));{u.innerHTML=l+"{visibility:hidden}.hydrated{visibility:inherit}",u.setAttribute("data-styles","");const n=null!==(e=I.S)&&void 0!==e?e:i(G);null!=n&&u.setAttribute("nonce",n),c.insertBefore(u,r?r.nextSibling:c.firstChild)}h=!1,a.length?a.map((n=>n.connectedCallback())):I.jmp((()=>d=setTimeout(L,30)))},W=n=>I.S=n,R=new WeakMap,U=n=>R.get(n),q=(n,t)=>R.set(t.v=n,t),D=(n,t)=>{const e={i:0,$hostElement$:n,j:t,C:new Map};return e.N=new Promise((n=>e.M=n)),n["s-p"]=[],n["s-rc"]=[],R.set(n,e)},F=(n,t)=>t in n,H=(n,t)=>(0,console.error)(n,t),V=new Map,_=n=>{const t=n.p.replace(/-/g,"_"),e=n.T,l=V.get(e);return l?l[t]:import(`./${e}.entry.js`).then((n=>(V.set(e,n),n[t])),H)
-/*!__STENCIL_STATIC_IMPORT_SWITCH__*/},z=new Map,B="undefined"!=typeof window?window:{},G=B.document||{head:{}},I={i:0,L:"",jmp:n=>n(),raf:n=>requestAnimationFrame(n),ael:(n,t,e,l)=>n.addEventListener(t,e,l),rel:(n,t,e,l)=>n.removeEventListener(t,e,l),ce:(n,t)=>new CustomEvent(n,t)},J=n=>Promise.resolve(n),K=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(n){}return!1})(),Q=[],X=[],Y=(n,t)=>e=>{n.push(e),l||(l=!0,t&&4&I.i?tn(nn):I.raf(nn))},Z=n=>{for(let t=0;t<n.length;t++)try{n[t](performance.now())}catch(n){H(n)}n.length=0},nn=()=>{Z(Q),Z(X),(l=Q.length>0)&&I.raf(nn)},tn=n=>J().then(n),en=Y(X,!0);export{T as b,c as h,J as p,q as r,W as s}