@justeattakeaway/pie-icons-webc 0.1.0

package/dist/IconMinusLarge.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--minusLarge"><path d="M27.375 16.875v-1.75H4.625v1.75h22.75Z"></path></svg>';
+
+class IconMinusLarge 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--minusLarge', '', null, 'IconMinusLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--minusLarge');
+        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--minusLarge', '', newVal, 'IconMinusLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-minus-large', IconMinusLarge);
+
+exports.IconMinusLarge = IconMinusLarge;

package/dist/IconMolluscs.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--molluscs"><g clip-path="url(#prefix__clip0_8387_3631)"><path d="M13.563 4.72a1.548 1.548 0 0 0-.854-.627 1.586 1.586 0 0 0-.523-.784c-.81-.662-1.9-1.159-2.988-1.35-.427-.08-.863.052-1.202.304a1.528 1.528 0 0 0-1.203-.305c-1.089.2-2.178.689-2.988 1.36-.252.208-.435.479-.522.783a1.548 1.548 0 0 0-.854.628 7.082 7.082 0 0 0-1.08 2.787c0 .053-.018.105-.018.149-.044.296-.07.6-.07.932v.305l2.335 1.995v.392a1.966 1.966 0 0 0 1.96 1.96h.793l.375.313c.366.34.827.514 1.29.514.46 0 .923-.174 1.262-.514l.401-.348h.854a1.978 1.978 0 0 0 1.942-1.969v-.418l2.257-1.925v-.305a7.068 7.068 0 0 0-1.168-3.868V4.72Zm-1.717 4.913-1.55 1.325-1.107.94-.81.689c-.218.218-.566.218-.819-.035l-.74-.636-.776-.662-3.485-2.97a5.55 5.55 0 0 1 .114-.802c.026-.131.06-.262.096-.392.034-.122.07-.244.104-.358.096-.26.288-.723.601-1.193.026-.035.07-.07.105-.105l1.62 3.494h1.438L4.546 4.415c.026-.043.043-.087.07-.104.635-.523 1.524-.924 2.395-1.08.087-.018.2.034.235.095l.053.096.017 5.506h1.307L8.605 3.5l.088-.148c.052-.087.165-.14.252-.122.863.157 1.76.558 2.396 1.08.035.027.07.079.087.14L9.372 8.937h1.438l1.611-3.52s.026.017.035.026c.331.497.871 1.498.941 2.849L11.82 9.633h.026Z"></path></g><defs><clipPath id="prefix__clip0_8387_3631"><rect width="14" height="14" transform="translate(1 1)"></rect></clipPath></defs></svg>';
+
+class IconMolluscs 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--molluscs', '', null, 'IconMolluscs');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--molluscs');
+        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--molluscs', '', newVal, 'IconMolluscs');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-molluscs', IconMolluscs);
+
+exports.IconMolluscs = IconMolluscs;

package/dist/IconMolluscsLarge.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--molluscsLarge"><path d="M26.244 10.863a2.584 2.584 0 0 0-1.63-1.09l-.035-.148a2.67 2.67 0 0 0-.888-1.377c-1.5-1.228-3.521-2.143-5.543-2.51a2.554 2.554 0 0 0-2.24.698 2.611 2.611 0 0 0-2.265-.663 12.91 12.91 0 0 0-4.445 1.743c-.427.27-.836.567-1.228.89a2.542 2.542 0 0 0-.88 1.524v.061a2.614 2.614 0 0 0-1.552 1.072c-1.098 1.63-1.551 3.216-1.568 3.268a12.469 12.469 0 0 0-.567 3.721v.401l3.617 3.085v2.31a2.622 2.622 0 0 0 2.614 2.614h3.163l.863.732a3.15 3.15 0 0 0 2.248.932c.855 0 1.648-.33 2.197-.88l.915-.784h3.154a2.622 2.622 0 0 0 2.615-2.614v-2.31l3.616-3.085v-.4c0-3.426-1.36-5.97-2.17-7.182l.009-.008ZM9.643 24.719a.874.874 0 0 1-.872-.872v-.827l1.987 1.699H9.643Zm13.412-.872c0 .48-.393.872-.872.872h-1.115l1.986-1.69v.819Zm.33-3.39L21.347 22.2l-2.954 2.519-1.455 1.246c-.54.54-1.438.593-2.074-.043l-1.403-1.203-2.955-2.519-2.039-1.742-3.285-2.798c.035-.959.192-1.9.48-2.823 0-.018.409-1.403 1.341-2.79a.835.835 0 0 1 .323-.278l3.294 7.111h1.917l-3.8-8.209.079-.427a.8.8 0 0 1 .27-.488c.331-.27.688-.532 1.054-.758a11.063 11.063 0 0 1 3.835-1.508.855.855 0 0 1 .897.418l.166.288.044 10.684h1.743L16.78 8.187l.192-.313c.183-.305.54-.48.871-.41 1.708.305 3.486 1.107 4.75 2.144a.94.94 0 0 1 .313.47l.166.62-3.852 8.19h1.926l3.416-7.267c.096.06.192.13.253.226a11.269 11.269 0 0 1 1.873 5.822l-3.285 2.797-.017-.009Z"></path></svg>';
+
+class IconMolluscsLarge 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--molluscsLarge', '', null, 'IconMolluscsLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--molluscsLarge');
+        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--molluscsLarge', '', newVal, 'IconMolluscsLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-molluscs-large', IconMolluscsLarge);
+
+exports.IconMolluscsLarge = IconMolluscsLarge;

package/dist/IconMoon.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--moon"><path d="M8.219 8a4.174 4.174 0 0 1 3.412-4.078 5.249 5.249 0 0 0-1.444-.927A5.39 5.39 0 0 0 8 2.531 5.469 5.469 0 0 0 8 13.47a5.39 5.39 0 0 0 2.188-.464 5.248 5.248 0 0 0 1.443-.928A4.174 4.174 0 0 1 8.22 8ZM8 12.156a4.155 4.155 0 0 1-3.689-6.18 4.156 4.156 0 0 1 4.433-2.054 5.443 5.443 0 0 0 0 8.155 4.12 4.12 0 0 1-.744.08Z"></path></svg>';
+
+class IconMoon 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--moon', '', null, 'IconMoon');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moon');
+        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--moon', '', newVal, 'IconMoon');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-moon', IconMoon);
+
+exports.IconMoon = IconMoon;

package/dist/IconMoonLarge.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--moonLarge"><path d="M15.125 16a8.794 8.794 0 0 1 6.93-8.558 10.612 10.612 0 0 0-.805-.524 10.213 10.213 0 0 0-1.321-.64A10.317 10.317 0 0 0 16 5.5a10.5 10.5 0 1 0 0 21c1.348 0 2.683-.265 3.929-.779.455-.18.897-.394 1.321-.639.28-.166.551-.34.805-.524A8.793 8.793 0 0 1 15.125 16ZM16 24.75a8.75 8.75 0 1 1 1.811-17.308 10.5 10.5 0 0 0 0 17.116A8.834 8.834 0 0 1 16 24.75Z"></path></svg>';
+
+class IconMoonLarge 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--moonLarge', '', null, 'IconMoonLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moonLarge');
+        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--moonLarge', '', newVal, 'IconMoonLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-moon-large', IconMoonLarge);
+
+exports.IconMoonLarge = IconMoonLarge;

package/dist/IconMoped.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--moped"><path d="M14.072 9.802a2.354 2.354 0 0 0-1.697-.682c.06-.31.06-.627 0-.936l-1.75-5.872A1.514 1.514 0 0 0 9.102 1.22H6.355L7.02 2.53h2.082a.228.228 0 0 1 .21.158l1.75 5.871a1.102 1.102 0 0 1-.559 1.296c-.152.076-.32.115-.49.113H8.63l-.7-2.503a1.54 1.54 0 0 0-1.487-1.164H2.75a1.54 1.54 0 0 0-1.531 1.532v3.447h1.33a2.354 2.354 0 0 0 .691 1.916 2.39 2.39 0 0 0 3.395 0 2.353 2.353 0 0 0 .691-1.916h2.625v.219a2.406 2.406 0 1 0 4.104-1.698h.018ZM5.708 12.27a1.094 1.094 0 0 1-1.818-.456 1.059 1.059 0 0 1-.02-.533h2.135a1.059 1.059 0 0 1-.298.989ZM2.53 9.969V7.834a.219.219 0 0 1 .219-.219h3.692a.236.236 0 0 1 .22.184l.603 2.17H2.531Zm10.614 2.301a1.103 1.103 0 0 1-1.54 0 1.094 1.094 0 1 1 1.54 0Z"></path></svg>';
+
+class IconMoped 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--moped', '', null, 'IconMoped');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moped');
+        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--moped', '', newVal, 'IconMoped');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-moped', IconMoped);
+
+exports.IconMoped = IconMoped;

package/dist/IconMopedLarge.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--mopedLarge"><g clip-path="url(#prefix__clip0_4_686)"><path d="M12.5 9.875H2.875v1.75H12.5v-1.75Z"></path><path d="M28.723 20.777a4.375 4.375 0 0 0-3.5-1.233 4.377 4.377 0 0 0-.097-2.179l-3.5-11.742a2.625 2.625 0 0 0-2.555-1.873h-3.946L16 5.5h3.071a.875.875 0 0 1 .875.621l3.5 11.751a2.626 2.626 0 0 1-.42 2.363 2.425 2.425 0 0 1-1.96 1.015H16.15l-1.637-5.889a2.625 2.625 0 0 0-2.537-1.986h-7.35A2.625 2.625 0 0 0 2 16v7h2.713a4.288 4.288 0 0 0 1.198 3.955 4.331 4.331 0 0 0 6.169 0A4.313 4.313 0 0 0 13.287 23h8.06a4.374 4.374 0 1 0 7.375-2.205v-.018Zm-17.877 4.944a2.625 2.625 0 0 1-3.701 0 2.555 2.555 0 0 1-.612-2.712h4.934a2.563 2.563 0 0 1-.62 2.712ZM3.75 21.25V16a.875.875 0 0 1 .875-.875h7.35a.875.875 0 0 1 .875.674l1.479 5.451H3.75Zm23.73 4.48a2.625 2.625 0 0 1-3.71-3.71 2.625 2.625 0 0 1 4.478 1.855c0 .696-.276 1.363-.768 1.855Z"></path></g><defs><clipPath id="prefix__clip0_4_686"><rect width="28" height="28" transform="translate(2 2)"></rect></clipPath></defs></svg>';
+
+class IconMopedLarge 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--mopedLarge', '', null, 'IconMopedLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--mopedLarge');
+        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--mopedLarge', '', newVal, 'IconMopedLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-moped-large', IconMopedLarge);
+
+exports.IconMopedLarge = IconMopedLarge;

package/dist/IconMoreHorizontal.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--moreHorizontal"><path d="M3.188 6.688a1.313 1.313 0 1 1 0 2.625 1.313 1.313 0 0 1 0-2.626ZM6.688 8a1.313 1.313 0 1 0 2.625 0 1.313 1.313 0 0 0-2.626 0ZM11.5 8a1.313 1.313 0 1 0 2.625 0A1.313 1.313 0 0 0 11.5 8Z"></path></svg>';
+
+class IconMoreHorizontal 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--moreHorizontal', '', null, 'IconMoreHorizontal');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moreHorizontal');
+        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--moreHorizontal', '', newVal, 'IconMoreHorizontal');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-more-horizontal', IconMoreHorizontal);
+
+exports.IconMoreHorizontal = IconMoreHorizontal;

package/dist/IconMoreHorizontalLarge.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--moreHorizontalLarge"><path d="M7.688 14.031a1.969 1.969 0 1 1 0 3.938 1.969 1.969 0 0 1 0-3.938ZM14.03 16a1.97 1.97 0 1 0 3.938 0 1.97 1.97 0 0 0-3.938 0Zm8.313 0a1.97 1.97 0 1 0 3.938 0 1.97 1.97 0 0 0-3.938 0Z"></path></svg>';
+
+class IconMoreHorizontalLarge 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--moreHorizontalLarge', '', null, 'IconMoreHorizontalLarge');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moreHorizontalLarge');
+        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--moreHorizontalLarge', '', newVal, 'IconMoreHorizontalLarge');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-more-horizontal-large', IconMoreHorizontalLarge);
+
+exports.IconMoreHorizontalLarge = IconMoreHorizontalLarge;

package/dist/IconMoreVertical.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--moreVertical"><path d="M9.313 3.188a1.313 1.313 0 1 1-2.626 0 1.313 1.313 0 0 1 2.625 0ZM8 6.688a1.313 1.313 0 1 0 0 2.625 1.313 1.313 0 0 0 0-2.626ZM8 11.5a1.313 1.313 0 1 0 0 2.625A1.313 1.313 0 0 0 8 11.5Z"></path></svg>';
+
+class IconMoreVertical 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--moreVertical', '', null, 'IconMoreVertical');
+        svg.setAttribute('width', svgSize.width);
+        svg.setAttribute('height', svgSize.height);
+        this.setAttribute('class', 'c-pieIcon c-pieIcon--moreVertical');
+        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--moreVertical', '', newVal, 'IconMoreVertical');
+
+            svg.setAttribute('width', svgSize.width);
+            svg.setAttribute('height', svgSize.height);
+            this.root.append(svg);
+        }
+    }
+}
+
+customElements.define('icon-more-vertical', IconMoreVertical);
+
+exports.IconMoreVertical = IconMoreVertical;