diff --git a/dist/features/features.js b/dist/features/features.js index caa42296..bd20a25e 100644 --- a/dist/features/features.js +++ b/dist/features/features.js @@ -1,2 +1,2 @@ -import{j as l,x as a}from"../__chunks__/lit-element.XkUWx5ik.js";import{o as p}from"../__chunks__/unsafe-html.tmuruS4o.js";import{t as h}from"../__chunks__/custom-element.qyLKk-84.js";var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,d=(e,t,s,o)=>{for(var n=o>1?void 0:o?f(t,s):t,r=e.length-1,c;r>=0;r--)(c=e[r])&&(n=(o?c(t,s,n):c(n))||n);return o&&n&&m(t,s,n),n};let i=class extends HTMLElement{get name(){const e=this.getAttribute("name");if(!e)throw new Error("Icon must have a name attribute");return e}connectedCallback(){console.log("RENDER ICON"),this.render()}async render(){const e=await this.fetchIcon();return console.log("render icon here",e),`${e}`}async fetchIcon(){return await(await fetch(`${window.hlx.codeBasePath}/dist/icons/${this.name}.svg`)).text()}};i=d([h("icon-component")],i);const u=e=>a`${e.map(t=>a`
${p(t.textBlock)}
`)}`;function g(e){new i;const t=e.querySelectorAll(":scope > div");let s=[];[...t].forEach(o=>{const n=o.children[0].innerHTML,r=o.children[1].innerHTML;s.push({icon:n,textBlock:r})}),e.innerHTML="",e.style.removeProperty("display"),l(u(s),e)}export{g as default}; +import{j as l,x as i}from"../__chunks__/lit-element.XkUWx5ik.js";import{o as p}from"../__chunks__/unsafe-html.tmuruS4o.js";import{t as h}from"../__chunks__/custom-element.qyLKk-84.js";var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,d=(e,t,s,o)=>{for(var n=o>1?void 0:o?f(t,s):t,r=e.length-1,c;r>=0;r--)(c=e[r])&&(n=(o?c(t,s,n):c(n))||n);return o&&n&&m(t,s,n),n};let a=class extends HTMLElement{get name(){const e=this.getAttribute("name");if(!e)throw new Error("Icon must have a name attribute");return e}connectedCallback(){console.log("RENDER ICON"),this.render()}async render(){const e=await this.fetchIcon();return console.log("render icon here",e),`${e}`}async fetchIcon(){return await(await fetch(`${window.hlx.codeBasePath}/dist/icons/${this.name}.svg`)).text()}};a=d([h("icon-component")],a);const u=e=>i`${e.map(t=>i`
${p(t.textBlock)}
`)}`;function g(e){const t=e.querySelectorAll(":scope > div");let s=[];[...t].forEach(o=>{const n=o.children[0].innerHTML,r=o.children[1].innerHTML;s.push({icon:n,textBlock:r})}),e.innerHTML="",e.style.removeProperty("display"),l(u(s),e)}export{g as default}; //# sourceMappingURL=features.js.map diff --git a/dist/features/features.js.map b/dist/features/features.js.map index 5b0dd087..1063bfc9 100644 --- a/dist/features/features.js.map +++ b/dist/features/features.js.map @@ -1 +1 @@ -{"version":3,"file":"features.js","sources":["../../src/components/icon.ts","../../src/blocks/features/features.ts"],"sourcesContent":["import { customElement } from 'lit/decorators.js';\n\n@customElement('icon-component')\nexport class Icon extends HTMLElement {\n get name() {\n const srcValue = this.getAttribute('name');\n if (!srcValue) {\n throw new Error('Icon must have a name attribute');\n }\n return srcValue;\n }\n\n connectedCallback() {\n console.log('RENDER ICON');\n this.render();\n }\n\n async render() {\n const svg = await this.fetchIcon();\n console.log('render icon here', svg);\n return `${svg}`;\n }\n\n async fetchIcon() {\n const response = await fetch(`${window.hlx.codeBasePath}/dist/icons/${this.name}.svg`);\n const textResponse = await response.text();\n return textResponse;\n }\n}\n","import { html, render } from 'lit';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\n\n// @ts-ignore\nimport { Icon } from '../../components/icon';\n\ninterface Feature {\n icon: string;\n textBlock: string;\n}\n\ntype TemplateArgs = Feature[];\n\nconst template = (features: TemplateArgs) => {\n return html`\n ${features.map(\n (feature) => html`\n
\n \n
${unsafeHTML(feature.textBlock)}
\n
\n `\n )}\n `;\n};\n\nexport default function (block: HTMLElement) {\n new Icon();\n const rows = block.querySelectorAll(':scope > div');\n let features: Feature[] = [];\n [...rows].forEach((row) => {\n const icon = row.children[0].innerHTML;\n const textBlock = row.children[1].innerHTML;\n features.push({ icon, textBlock });\n });\n\n block.innerHTML = '';\n\n block.style.removeProperty('display');\n render(template(features), block);\n}\n"],"names":["Icon","srcValue","svg","__decorateClass","customElement","template","features","html","feature","unsafeHTML","block","rows","row","icon","textBlock","render"],"mappings":"wXAGa,IAAAA,EAAN,cAAmB,WAAY,CACpC,IAAI,MAAO,CACH,MAAAC,EAAW,KAAK,aAAa,MAAM,EACzC,GAAI,CAACA,EACG,MAAA,IAAI,MAAM,iCAAiC,EAE5C,OAAAA,CACT,CAEA,mBAAoB,CAClB,QAAQ,IAAI,aAAa,EACzB,KAAK,OAAO,CACd,CAEA,MAAM,QAAS,CACP,MAAAC,EAAM,MAAM,KAAK,YACf,eAAA,IAAI,mBAAoBA,CAAG,EAC5B,wIAAwIA,CAAG,EACpJ,CAEA,MAAM,WAAY,CAGT,OADc,MADJ,MAAM,MAAM,GAAG,OAAO,IAAI,YAAY,eAAe,KAAK,IAAI,MAAM,GACjD,MAEtC,CACF,EAzBaF,EAANG,EAAA,CADNC,EAAc,gBAAgB,CAAA,EAClBJ,CAAA,ECUb,MAAMK,EAAYC,GACTC,IACHD,EAAS,IACRE,GAAYD,6DAEyCC,EAAQ,IAAI,kDACvCC,EAAWD,EAAQ,SAAS,CAAC,kBAGzD,CAAA,GAIL,SAAAF,EAAyBI,EAAoB,CAC3C,IAAIV,EACE,MAAAW,EAAOD,EAAM,iBAAiB,cAAc,EAClD,IAAIJ,EAAsB,CAAA,EAC1B,CAAC,GAAGK,CAAI,EAAE,QAASC,GAAQ,CACzB,MAAMC,EAAOD,EAAI,SAAS,CAAC,EAAE,UACvBE,EAAYF,EAAI,SAAS,CAAC,EAAE,UAClCN,EAAS,KAAK,CAAE,KAAAO,EAAM,UAAAC,CAAW,CAAA,CAAA,CAClC,EAEDJ,EAAM,UAAY,GAEZA,EAAA,MAAM,eAAe,SAAS,EAC7BK,EAAAV,EAASC,CAAQ,EAAGI,CAAK,CAClC"} \ No newline at end of file +{"version":3,"file":"features.js","sources":["../../src/components/icon.ts","../../src/blocks/features/features.ts"],"sourcesContent":["import { customElement } from 'lit/decorators.js';\n\n@customElement('icon-component')\nexport class Icon extends HTMLElement {\n get name() {\n const srcValue = this.getAttribute('name');\n if (!srcValue) {\n throw new Error('Icon must have a name attribute');\n }\n return srcValue;\n }\n\n connectedCallback() {\n console.log('RENDER ICON');\n this.render();\n }\n\n async render() {\n const svg = await this.fetchIcon();\n console.log('render icon here', svg);\n return `${svg}`;\n }\n\n async fetchIcon() {\n const response = await fetch(`${window.hlx.codeBasePath}/dist/icons/${this.name}.svg`);\n const textResponse = await response.text();\n return textResponse;\n }\n}\n","import { html, render } from 'lit';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\n\nimport '../../components/icon';\n\ninterface Feature {\n icon: string;\n textBlock: string;\n}\n\ntype TemplateArgs = Feature[];\n\nconst template = (features: TemplateArgs) => {\n return html`\n ${features.map(\n (feature) => html`\n
\n \n
${unsafeHTML(feature.textBlock)}
\n
\n `\n )}\n `;\n};\n\nexport default function (block: HTMLElement) {\n const rows = block.querySelectorAll(':scope > div');\n let features: Feature[] = [];\n [...rows].forEach((row) => {\n const icon = row.children[0].innerHTML;\n const textBlock = row.children[1].innerHTML;\n features.push({ icon, textBlock });\n });\n\n block.innerHTML = '';\n\n block.style.removeProperty('display');\n render(template(features), block);\n}\n"],"names":["Icon","srcValue","svg","__decorateClass","customElement","template","features","html","feature","unsafeHTML","block","rows","row","icon","textBlock","render"],"mappings":"wXAGa,IAAAA,EAAN,cAAmB,WAAY,CACpC,IAAI,MAAO,CACH,MAAAC,EAAW,KAAK,aAAa,MAAM,EACzC,GAAI,CAACA,EACG,MAAA,IAAI,MAAM,iCAAiC,EAE5C,OAAAA,CACT,CAEA,mBAAoB,CAClB,QAAQ,IAAI,aAAa,EACzB,KAAK,OAAO,CACd,CAEA,MAAM,QAAS,CACP,MAAAC,EAAM,MAAM,KAAK,YACf,eAAA,IAAI,mBAAoBA,CAAG,EAC5B,wIAAwIA,CAAG,EACpJ,CAEA,MAAM,WAAY,CAGT,OADc,MADJ,MAAM,MAAM,GAAG,OAAO,IAAI,YAAY,eAAe,KAAK,IAAI,MAAM,GACjD,MAEtC,CACF,EAzBaF,EAANG,EAAA,CADNC,EAAc,gBAAgB,CAAA,EAClBJ,CAAA,ECSb,MAAMK,EAAYC,GACTC,IACHD,EAAS,IACRE,GAAYD,6DAEyCC,EAAQ,IAAI,kDACvCC,EAAWD,EAAQ,SAAS,CAAC,kBAGzD,CAAA,GAIL,SAAAF,EAAyBI,EAAoB,CACrC,MAAAC,EAAOD,EAAM,iBAAiB,cAAc,EAClD,IAAIJ,EAAsB,CAAA,EAC1B,CAAC,GAAGK,CAAI,EAAE,QAASC,GAAQ,CACzB,MAAMC,EAAOD,EAAI,SAAS,CAAC,EAAE,UACvBE,EAAYF,EAAI,SAAS,CAAC,EAAE,UAClCN,EAAS,KAAK,CAAE,KAAAO,EAAM,UAAAC,CAAW,CAAA,CAAA,CAClC,EAEDJ,EAAM,UAAY,GAEZA,EAAA,MAAM,eAAe,SAAS,EAC7BK,EAAAV,EAASC,CAAQ,EAAGI,CAAK,CAClC"} \ No newline at end of file diff --git a/src/blocks/features/features.ts b/src/blocks/features/features.ts index 00f71102..b49d0300 100644 --- a/src/blocks/features/features.ts +++ b/src/blocks/features/features.ts @@ -1,8 +1,7 @@ import { html, render } from 'lit'; import { unsafeHTML } from 'lit-html/directives/unsafe-html.js'; -// @ts-ignore -import { Icon } from '../../components/icon'; +import '../../components/icon'; interface Feature { icon: string; @@ -25,7 +24,6 @@ const template = (features: TemplateArgs) => { }; export default function (block: HTMLElement) { - new Icon(); const rows = block.querySelectorAll(':scope > div'); let features: Feature[] = []; [...rows].forEach((row) => { diff --git a/types/blocks/features/features.d.ts b/types/blocks/features/features.d.ts index 95509577..1271bf7d 100644 --- a/types/blocks/features/features.d.ts +++ b/types/blocks/features/features.d.ts @@ -1 +1,2 @@ +import '../../components/icon'; export default function (block: HTMLElement): void;