@justeattakeaway/pie-icons-webc 0.1.0

package/dist/IconCutleryLarge.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 32 32" class="c-pieIcon c-pieIcon--cutleryLarge"><path d="m24.391 21.25 2.827.464a67.186 67.186 0 0 1-.35 4.803h1.75c.13-1.268.28-2.764.376-5.52.188-4.29.162-8.586-.079-12.872-.157-1.461-.481-2.205-1.12-2.476a1.628 1.628 0 0 0-1.969.647c-.131.184-3.29 4.76-2.774 13.221a1.75 1.75 0 0 0 1.34 1.733ZM27.078 7.6c.045.237.077.477.096.718.288 3.858.21 8.61.114 11.61-.875-.14-2.004-.314-2.468-.402a.377.377 0 0 1 0-.105C24.4 12.86 26.378 8.8 27.078 7.6Z"></path><path d="M14.25 5.754h-.166l-1.584.761v6.86c0 2.126 1.829 3.404 3.5 3.745v9.38h1.75v-9.398c1.68-.34 3.5-1.618 3.5-3.753V5.71l-1.75.875v6.79c0 1.496-1.855 2.091-2.625 2.091s-2.625-.595-2.625-2.091V5.754Z"></path><path d="m17.759 5.692-1.75.84v6.843h1.75V5.692Z"></path><path d="M5.5 15.886V26.5h1.75V15.886a4.786 4.786 0 0 0 3.185-4.768v-.736c0-2.694-1.82-4.882-4.06-4.882-2.24 0-4.06 2.188-4.06 4.883v.735A4.786 4.786 0 0 0 5.5 15.886Zm-1.435-5.503c0-1.724 1.041-3.133 2.31-3.133 1.269 0 2.31 1.409 2.31 3.133v.735c0 1.723-1.041 3.132-2.31 3.132-1.269 0-2.31-1.409-2.31-3.133v-.735Z"></path></svg>';
+
+class IconCutleryLarge extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--cutleryLarge', '', null, 'IconCutleryLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--cutleryLarge');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--cutleryLarge', '', newVal, 'IconCutleryLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-cutlery-large', IconCutleryLarge);
+
+exports.IconCutleryLarge = IconCutleryLarge;

package/dist/IconDashboard.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--dashboard"><path d="M14.781 9.75c-.001.9-.18 1.793-.525 2.625h-1.461a5.435 5.435 0 0 0 .306-4.585l.945-1.085a6.71 6.71 0 0 1 .735 3.045ZM8 4.281c.845 0 1.678.198 2.432.578l.875-1.015A6.773 6.773 0 0 0 1.22 9.75c.001.9.18 1.793.525 2.625h1.461A5.469 5.469 0 0 1 8 4.281Zm2.012 5.031a2.406 2.406 0 1 1-.988-.875L13.25 3.67l.989.875-4.227 4.768Zm-1.242.543a1.076 1.076 0 0 0-1.54 0 1.085 1.085 0 1 0 1.54 0Z"></path></svg>';
+
+class IconDashboard extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dashboard', '', null, 'IconDashboard');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--dashboard');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dashboard', '', newVal, 'IconDashboard');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-dashboard', IconDashboard);
+
+exports.IconDashboard = IconDashboard;

package/dist/IconDashboardLarge.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 32 32" class="c-pieIcon c-pieIcon--dashboardLarge"><path d="M29.073 18.625a13.003 13.003 0 0 1-1.112 5.25h-1.933a11.28 11.28 0 0 0-.184-10.832l1.207-1.374a13.02 13.02 0 0 1 2.022 6.956ZM15.948 7.25a11.322 11.322 0 0 1 6.308 1.916l1.155-1.321a13.125 13.125 0 0 0-19.486 16.03H5.86A11.375 11.375 0 0 1 15.948 7.25Zm3.386 5.25 1.181-1.348a8.75 8.75 0 0 0-13.317 7.473h1.75A7 7 0 0 1 19.334 12.5Zm-.508 5.889a3.5 3.5 0 1 1-2.878-1.514 3.5 3.5 0 0 1 1.557.385l8.566-9.783 1.304 1.147-8.549 9.765Zm-1.128 1.986a1.75 1.75 0 1 0-3.5 0 1.75 1.75 0 0 0 3.5 0Z"></path></svg>';
+
+class IconDashboardLarge extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dashboardLarge', '', null, 'IconDashboardLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--dashboardLarge');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dashboardLarge', '', newVal, 'IconDashboardLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-dashboard-large', IconDashboardLarge);
+
+exports.IconDashboardLarge = IconDashboardLarge;

package/dist/IconDeliveryFee.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--deliveryFee"><g clip-path="url(#prefix__clip0_18_2472)"><path d="M13.127 1.735 7.8 3.686 4.64 10.502l7.28 3.37 3.159-6.808-1.952-5.329Zm-2.065 9.818L6.96 9.645l2.117-4.568 3.01-1.102 1.103 3.01-2.127 4.567ZM1.876 6.25H4.5V8H1.875V6.25ZM6.031 4.5H1V2.75h5.031V4.5Z"></path></g><defs><clipPath id="prefix__clip0_18_2472"><rect width="14" height="14" transform="translate(1 1)"></rect></clipPath></defs></svg>';
+
+class IconDeliveryFee extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--deliveryFee', '', null, 'IconDeliveryFee');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--deliveryFee');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--deliveryFee', '', newVal, 'IconDeliveryFee');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-delivery-fee', IconDeliveryFee);
+
+exports.IconDeliveryFee = IconDeliveryFee;

package/dist/IconDeliveryFeeLarge.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 32 32" class="c-pieIcon c-pieIcon--deliveryFeeLarge"><path d="M25.424 4.45 15.326 8.125 9.15 21.477l13.799 6.388 6.177-13.326-3.701-10.09Zm-3.299 21.096L11.476 20.63l5.136-11.087 7.77-2.852 2.853 7.77-5.11 11.086ZM9.875 15.125H5.5v-1.75h4.375v1.75Zm1.75-4.375h-8.75V9h8.75v1.75Zm12.25.438a1.312 1.312 0 1 1-2.625 0 1.312 1.312 0 0 1 2.625 0Z"></path></svg>';
+
+class IconDeliveryFeeLarge extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--deliveryFeeLarge', '', null, 'IconDeliveryFeeLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--deliveryFeeLarge');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--deliveryFeeLarge', '', newVal, 'IconDeliveryFeeLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-delivery-fee-large', IconDeliveryFeeLarge);
+
+exports.IconDeliveryFeeLarge = IconDeliveryFeeLarge;

package/dist/IconDineIn.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--dineIn"><g clip-path="url(#prefix__clip0_18_1460)"><path d="m8.525 7.274.263.148a1.523 1.523 0 0 0 1.75-.07l2.878-2.415H11.36L9.698 6.32a.219.219 0 0 1-.228 0l-1.584-.945a2.406 2.406 0 1 0-4.042-1.75 2.362 2.362 0 0 0 .875 1.837A4.918 4.918 0 0 0 1.578 8l-.534 1.076 1.181.569.525-1.103A3.5 3.5 0 0 1 3.844 7.3v.875a2.721 2.721 0 0 0 1.277 2.292l.464.298c-.275.18-.568.329-.875.446L1.7 12.515l.534 1.199 2.975-1.339a6.013 6.013 0 0 0 1.557-.875l.604.385L8.77 15l1.199-.543-1.566-3.473-.718-.464c.369-.516.595-1.12.656-1.75l.184-1.496ZM7.038 8.647a2.354 2.354 0 0 1-.455 1.164l-.753-.49a1.4 1.4 0 0 1-.674-1.181V6.714a3.71 3.71 0 0 1 .823-.097h1.304l-.245 2.03ZM6.25 4.72a1.094 1.094 0 1 1 0-2.188 1.094 1.094 0 0 1 0 2.188ZM15 3.625h-4.375v-.289a2.161 2.161 0 0 1 4.314 0l.061.289Z"></path></g><defs><clipPath id="prefix__clip0_18_1460"><rect width="14" height="14" transform="translate(1 1)"></rect></clipPath></defs></svg>';
+
+class IconDineIn extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dineIn', '', null, 'IconDineIn');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--dineIn');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dineIn', '', newVal, 'IconDineIn');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-dine-in', IconDineIn);
+
+exports.IconDineIn = IconDineIn;

package/dist/IconDineInLarge.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 32 32" class="c-pieIcon c-pieIcon--dineInLarge"><g clip-path="url(#prefix__clip0_18_1452)"><path d="M28.757 7.25a4.445 4.445 0 1 0-8.89 0h-.726V9h10.343V7.25h-.727Zm-4.445-2.625a2.704 2.704 0 0 1 2.695 2.625h-5.39a2.704 2.704 0 0 1 2.695-2.625ZM12.5 10.313a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm0-5.25a1.75 1.75 0 1 1 0 3.5 1.75 1.75 0 0 1 0-3.5Zm6.125 8.46a.7.7 0 0 1-.805 0l-3.141-1.898h-3.23a8.854 8.854 0 0 0-7.953 4.891l-.875 1.628 1.558.814.875-1.645a7.079 7.079 0 0 1 3.5-3.334v2.686a4.804 4.804 0 0 0 2.248 4.043l.937.603a8.567 8.567 0 0 1-2.415 1.497l-5.382 2.537.753 1.575 5.355-2.52a10 10 0 0 0 3.202-2.109l1.873 1.234 2.695 5.959 1.592-.718-2.887-6.431-2.161-1.409a6.668 6.668 0 0 0 1.102-3.088l.403-3.5 1.04.62a2.45 2.45 0 0 0 2.827-.095l5.093-4.113h-2.774l-3.43 2.774Zm-4.9 4.14a5.117 5.117 0 0 1-.823 2.318l-1.146-.744a3.063 3.063 0 0 1-1.444-2.572v-3.194a7.04 7.04 0 0 1 1.138-.096h2.747l-.472 4.288Z"></path></g><defs><clipPath id="prefix__clip0_18_1452"><rect width="28" height="28" transform="translate(2 2)"></rect></clipPath></defs></svg>';
+
+class IconDineInLarge extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dineInLarge', '', null, 'IconDineInLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--dineInLarge');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dineInLarge', '', newVal, 'IconDineInLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-dine-in-large', IconDineInLarge);
+
+exports.IconDineInLarge = IconDineInLarge;

package/dist/IconDirections.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--directions"><path d="M14.072 6.232 11.194 2.97H6.25V1.656H4.929V2.97h-3.5v8.75h3.5v2.625H6.25v-2.625h4.953l2.87-3.264a1.47 1.47 0 0 0 0-2.223Zm-.883 1.26-2.564 2.914H6.25V8h1.137v1.146L9.96 7.344 7.387 5.69v.997H4.93v3.72H2.75V4.28h7.875l2.476 2.844.079.079a.15.15 0 0 1 .058.208.15.15 0 0 1-.058.054l.009.026Z"></path></svg>';
+
+class IconDirections extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--directions', '', null, 'IconDirections');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--directions');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--directions', '', newVal, 'IconDirections');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-directions', IconDirections);
+
+exports.IconDirections = IconDirections;

package/dist/IconDirectionsLarge.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 32 32" class="c-pieIcon c-pieIcon--directionsLarge"><path d="M28.451 13.664 20.9 7.25h-6.65V5.5a1.75 1.75 0 0 0-1.75-1.75h-1.75A1.75 1.75 0 0 0 9 5.5v1.75H2.875v14.875H9v5.25h1.75v-5.25h1.75v5.25h1.75v-5.25h6.65l7.499-5.495a1.91 1.91 0 0 0 .726-1.505 1.873 1.873 0 0 0-.674-1.461ZM10.75 5.938a.438.438 0 0 1 .438-.438h.874a.438.438 0 0 1 .438.438V7.25h-1.75V5.937Zm9.45 14.437H4.625V9H20.2l7.175 6.125-7.175 5.25Z"></path><path d="m19.78 14.197-2.861-2.87-1.234 1.243 1.68 1.68H10.75v6.125h1.75V16h4.865l-1.68 1.68 1.234 1.242 2.861-2.87a1.303 1.303 0 0 0 0-1.854Z"></path></svg>';
+
+class IconDirectionsLarge extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--directionsLarge', '', null, 'IconDirectionsLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--directionsLarge');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--directionsLarge', '', newVal, 'IconDirectionsLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-directions-large', IconDirectionsLarge);
+
+exports.IconDirectionsLarge = IconDirectionsLarge;

package/dist/IconDish.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var configs = require('./pie-icons-configs/configs.js');
+
+const template = document.createElement('template');
+template.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--dish"><path d="M13.469 8a4.603 4.603 0 0 0-4.594-4.594V2.094A5.906 5.906 0 1 1 6.25 13.25v-1.496c.762.558 1.68.864 2.625.875A4.603 4.603 0 0 0 13.469 8ZM3.188 6.801a.665.665 0 0 0 .656-.656v-3.64l1.295-.63v4.27a.656.656 0 1 0 1.312 0v-3.64l1.313-.63v6.352a3.08 3.08 0 0 1-2.625 2.87v3.028H3.844v-3.027a3.08 3.08 0 0 1-2.625-2.87V2.61l1.312-.639v4.174a.665.665 0 0 0 .656.656Zm0 1.313A2.074 2.074 0 0 1 2.53 8v.236c0 1.164 1.391 1.636 1.969 1.636.577 0 1.969-.472 1.969-1.636V8c-.211.076-.433.117-.657.123A1.951 1.951 0 0 1 4.5 7.598c-.358.33-.826.513-1.313.516Z"></path></svg>';
+
+class IconDish extends HTMLElement {
+    constructor () {
+        super();
+        const clone = template.content.cloneNode(true);
+        this.root = this.attachShadow({ mode: 'open' });
+        this.root.append(clone);
+    }
+
+    static get observedAttributes () {
+        return ['size'];
+    }
+
+    get size () {
+        return this.getAttribute('size');
+    }
+
+    set size (value) {
+        this.setAttribute('size', value);
+    }
+
+    get class () {
+        return this.getAttribute('class');
+    }
+
+    set class (value) {
+        this.setAttribute('class', value);
+    }
+
+    connectedCallback () {
+        const svg = this.root.querySelector('svg');
+        const svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dish', '', null, 'IconDish');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--dish');
+        this.root.append(svg);
+    }
+
+    attributeChangedCallback (attr, oldVal, newVal) {
+        const svg = this.root.querySelector('svg');
+        let svgSize;
+
+        if (attr === 'size') {
+            svgSize = configs.getSvgProps('c-pieIcon c-pieIcon--dish', '', newVal, 'IconDish');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-dish', IconDish);
+
+exports.IconDish = IconDish;