@getflip/swirl-components 0.0.0-beta-20260114160010

package/dist/collection/components/swirl-icon/icons/swirl-icon-message.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMessage {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: 'a772dbc1928531d0ffaa18606618ae03666cdbd8', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: '96a6c9eac3ff5dd13979348e18b80b9a690a1613' }, h("path", { key: '509fa2eda5273a2ecaff80123ada7249a190a238', d: "M4.66665 9.33325H8.68331C8.8722 9.33325 9.02776 9.26925 9.14998 9.14125C9.2722 9.0137 9.33331 8.85547 9.33331 8.66659C9.33331 8.4777 9.26953 8.31925 9.14198 8.19125C9.01398 8.0637 8.85553 7.99992 8.66665 7.99992H4.64998C4.46109 7.99992 4.30554 8.0637 4.18331 8.19125C4.06109 8.31925 3.99998 8.4777 3.99998 8.66659C3.99998 8.85547 4.06376 9.0137 4.19131 9.14125C4.31931 9.26925 4.47776 9.33325 4.66665 9.33325ZM4.66665 7.33325H11.35C11.5389 7.33325 11.6944 7.26925 11.8166 7.14125C11.9389 7.0137 12 6.85547 12 6.66659C12 6.4777 11.936 6.31925 11.808 6.19125C11.6804 6.0637 11.5222 5.99992 11.3333 5.99992H4.64998C4.46109 5.99992 4.30554 6.0637 4.18331 6.19125C4.06109 6.31925 3.99998 6.4777 3.99998 6.66659C3.99998 6.85547 4.06376 7.0137 4.19131 7.14125C4.31931 7.26925 4.47776 7.33325 4.66665 7.33325ZM4.66665 5.33325H11.35C11.5389 5.33325 11.6944 5.26947 11.8166 5.14192C11.9389 5.01392 12 4.85547 12 4.66659C12 4.4777 11.936 4.31925 11.808 4.19125C11.6804 4.0637 11.5222 3.99992 11.3333 3.99992H4.64998C4.46109 3.99992 4.30554 4.0637 4.18331 4.19125C4.06109 4.31925 3.99998 4.4777 3.99998 4.66659C3.99998 4.85547 4.06376 5.01392 4.19131 5.14192C4.31931 5.26947 4.47776 5.33325 4.66665 5.33325ZM1.33331 13.0499V2.66659C1.33331 2.29992 1.46398 1.98592 1.72531 1.72459C1.9862 1.4637 2.29998 1.33325 2.66665 1.33325H13.3333C13.7 1.33325 14.014 1.4637 14.2753 1.72459C14.5362 1.98592 14.6666 2.29992 14.6666 2.66659V10.6666C14.6666 11.0333 14.5362 11.3473 14.2753 11.6086C14.014 11.8695 13.7 11.9999 13.3333 11.9999H3.99998L2.46665 13.5333C2.25554 13.7444 2.01376 13.7915 1.74131 13.6746C1.46931 13.5581 1.33331 13.3499 1.33331 13.0499ZM2.66665 11.4499L3.44998 10.6666H13.3333V2.66659H2.66665V11.4499Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: 'a26612f25690621a88fae260490226b8002dfe3b' }, h("path", { key: 'd2c3d96894af63efe87659fabe00471cc939ccff', d: "M7 14H13.025C13.3083 14 13.5417 13.904 13.725 13.712C13.9083 13.5207 14 13.2833 14 13C14 12.7167 13.9043 12.479 13.713 12.287C13.521 12.0957 13.2833 12 13 12H6.975C6.69167 12 6.45833 12.0957 6.275 12.287C6.09167 12.479 6 12.7167 6 13C6 13.2833 6.09567 13.5207 6.287 13.712C6.479 13.904 6.71667 14 7 14ZM7 11H17.025C17.3083 11 17.5417 10.904 17.725 10.712C17.9083 10.5207 18 10.2833 18 10C18 9.71667 17.904 9.479 17.712 9.287C17.5207 9.09567 17.2833 9 17 9H6.975C6.69167 9 6.45833 9.09567 6.275 9.287C6.09167 9.479 6 9.71667 6 10C6 10.2833 6.09567 10.5207 6.287 10.712C6.479 10.904 6.71667 11 7 11ZM7 8H17.025C17.3083 8 17.5417 7.90433 17.725 7.713C17.9083 7.521 18 7.28333 18 7C18 6.71667 17.904 6.479 17.712 6.287C17.5207 6.09567 17.2833 6 17 6H6.975C6.69167 6 6.45833 6.09567 6.275 6.287C6.09167 6.479 6 6.71667 6 7C6 7.28333 6.09567 7.521 6.287 7.713C6.479 7.90433 6.71667 8 7 8ZM2 19.575V4C2 3.45 2.196 2.979 2.588 2.587C2.97933 2.19567 3.45 2 4 2H20C20.55 2 21.021 2.19567 21.413 2.587C21.8043 2.979 22 3.45 22 4V16C22 16.55 21.8043 17.021 21.413 17.413C21.021 17.8043 20.55 18 20 18H6L3.7 20.3C3.38333 20.6167 3.02067 20.6873 2.612 20.512C2.204 20.3373 2 20.025 2 19.575ZM4 17.175L5.175 16H20V4H4V17.175Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: '86f58a289ba1f0be9accff91d5a6b2223a9ffcf9' }, h("path", { key: '46d593ec4133aacc0dd740def045dd64e7a84e77', d: "M8.16665 16.3333H15.1958C15.5264 16.3333 15.7986 16.2213 16.0125 15.9973C16.2264 15.774 16.3333 15.4971 16.3333 15.1666C16.3333 14.836 16.2217 14.5588 15.9985 14.3348C15.7745 14.1115 15.4972 13.9999 15.1666 13.9999H8.13748C7.80692 13.9999 7.5347 14.1115 7.32081 14.3348C7.10692 14.5588 6.99998 14.836 6.99998 15.1666C6.99998 15.4971 7.11159 15.774 7.33481 15.9973C7.55881 16.2213 7.83609 16.3333 8.16665 16.3333ZM8.16665 12.8333H19.8625C20.193 12.8333 20.4653 12.7213 20.6791 12.4973C20.893 12.274 21 11.9971 21 11.6666C21 11.336 20.888 11.0588 20.664 10.8348C20.4408 10.6115 20.1639 10.4999 19.8333 10.4999H8.13748C7.80692 10.4999 7.5347 10.6115 7.32081 10.8348C7.10692 11.0588 6.99998 11.336 6.99998 11.6666C6.99998 11.9971 7.11159 12.274 7.33481 12.4973C7.55881 12.7213 7.83609 12.8333 8.16665 12.8333ZM8.16665 9.33325H19.8625C20.193 9.33325 20.4653 9.22164 20.6791 8.99842C20.893 8.77442 21 8.49714 21 8.16659C21 7.83603 20.888 7.55875 20.664 7.33475C20.4408 7.11153 20.1639 6.99992 19.8333 6.99992H8.13748C7.80692 6.99992 7.5347 7.11153 7.32081 7.33475C7.10692 7.55875 6.99998 7.83603 6.99998 8.16659C6.99998 8.49714 7.11159 8.77442 7.33481 8.99842C7.55881 9.22164 7.83609 9.33325 8.16665 9.33325ZM2.33331 22.8374V4.66659C2.33331 4.02492 2.56198 3.47542 3.01931 3.01809C3.47587 2.56153 4.02498 2.33325 4.66665 2.33325H23.3333C23.975 2.33325 24.5245 2.56153 24.9818 3.01809C25.4384 3.47542 25.6666 4.02492 25.6666 4.66659V18.6666C25.6666 19.3083 25.4384 19.8578 24.9818 20.3151C24.5245 20.7716 23.975 20.9999 23.3333 20.9999H6.99998L4.31665 23.6833C3.9472 24.0527 3.52409 24.1351 3.04731 23.9306C2.57131 23.7268 2.33331 23.3624 2.33331 22.8374ZM4.66665 20.0374L6.03748 18.6666H23.3333V4.66659H4.66665V20.0374Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-message"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-mic-off.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMicOff {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: '7e4d603df51629bf3715b00bcdb6148695672c75', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: 'fcc2991a101a8b0cfab13b17eabbcf8d3a968952' }, h("path", { key: 'dc5466776d9592cdf0133b14556ec1848dee2377', d: "M11.2 9.71683C11.0445 9.62794 10.9445 9.49183 10.9 9.3085C10.8556 9.12516 10.8778 8.95572 10.9667 8.80016C11.0445 8.67794 11.1083 8.54739 11.1583 8.4085C11.2083 8.26961 11.2445 8.12794 11.2667 7.9835C11.3111 7.79461 11.3972 7.63905 11.525 7.51683C11.6528 7.39461 11.8111 7.3335 12 7.3335C12.1889 7.3335 12.3445 7.40016 12.4667 7.5335C12.5889 7.66683 12.6389 7.82794 12.6167 8.01683C12.5833 8.27239 12.525 8.52239 12.4417 8.76683C12.3583 9.01127 12.25 9.24461 12.1167 9.46683C12.0278 9.62239 11.8917 9.72516 11.7083 9.77516C11.525 9.82516 11.3556 9.80572 11.2 9.71683ZM8.00001 1.3335C8.55556 1.3335 9.02779 1.52794 9.41668 1.91683C9.80556 2.30572 10 2.77794 10 3.3335V6.50016C10 6.72239 9.93056 6.88905 9.79168 7.00016C9.65279 7.11127 9.50001 7.16683 9.33334 7.16683C9.16668 7.16683 9.0139 7.1085 8.87501 6.99183C8.73612 6.87516 8.66668 6.70572 8.66668 6.4835V3.3335C8.66668 3.14461 8.60279 2.98627 8.47501 2.8585C8.34723 2.73072 8.1889 2.66683 8.00001 2.66683C7.81112 2.66683 7.65279 2.73072 7.52501 2.8585C7.39723 2.98627 7.33334 3.14461 7.33334 3.3335V3.8335C7.33334 4.05572 7.2639 4.22239 7.12501 4.3335C6.98612 4.44461 6.83334 4.50016 6.66668 4.50016C6.50001 4.50016 6.34723 4.44183 6.20834 4.32516C6.06945 4.2085 6.00001 4.03905 6.00001 3.81683V3.3335C6.00001 2.77794 6.19445 2.30572 6.58334 1.91683C6.97223 1.52794 7.44445 1.3335 8.00001 1.3335ZM7.33334 13.3335V11.9502C6.31112 11.8168 5.43612 11.3863 4.70834 10.6585C3.98056 9.93072 3.5389 9.05016 3.38334 8.01683C3.36112 7.82794 3.41112 7.66683 3.53334 7.5335C3.65556 7.40016 3.81112 7.3335 4.00001 7.3335C4.1889 7.3335 4.35001 7.39739 4.48334 7.52516C4.61667 7.65294 4.70001 7.81127 4.73334 8.00016C4.8889 8.78905 5.27223 9.43072 5.88334 9.92516C6.49445 10.4196 7.20001 10.6668 8.00001 10.6668C8.37779 10.6668 8.73612 10.6085 9.07501 10.4918C9.4139 10.3752 9.72223 10.2113 10 10.0002L10.95 10.9502C10.6278 11.2057 10.275 11.4224 9.89167 11.6002C9.50834 11.7779 9.10001 11.8946 8.66668 11.9502V13.3335C8.66668 13.5224 8.60279 13.6807 8.47501 13.8085C8.34723 13.9363 8.1889 14.0002 8.00001 14.0002C7.81112 14.0002 7.65279 13.9363 7.52501 13.8085C7.39723 13.6807 7.33334 13.5224 7.33334 13.3335ZM12.7333 14.6002L1.40001 3.26683C1.27779 3.14461 1.21667 2.98905 1.21667 2.80016C1.21667 2.61127 1.27779 2.45572 1.40001 2.3335C1.52223 2.21127 1.67779 2.15016 1.86667 2.15016C2.05556 2.15016 2.21112 2.21127 2.33334 2.3335L13.6667 13.6668C13.7889 13.7891 13.85 13.9446 13.85 14.1335C13.85 14.3224 13.7889 14.4779 13.6667 14.6002C13.5445 14.7224 13.3889 14.7835 13.2 14.7835C13.0111 14.7835 12.8556 14.7224 12.7333 14.6002Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '8a19ad4ffbcd88b58dcd8d2438929f6de2337e2c' }, h("path", { key: 'fec9036c7acef766ab43a2fa8bc8f8643673380b', d: "M16.8 14.575C16.5667 14.4417 16.4167 14.2375 16.35 13.9625C16.2833 13.6875 16.3167 13.4333 16.45 13.2C16.5667 13.0167 16.6625 12.8208 16.7375 12.6125C16.8125 12.4042 16.8667 12.1917 16.9 11.975C16.9667 11.6917 17.0958 11.4583 17.2875 11.275C17.4792 11.0917 17.7167 11 18 11C18.2833 11 18.5167 11.1 18.7 11.3C18.8833 11.5 18.9583 11.7417 18.925 12.025C18.875 12.4083 18.7875 12.7833 18.6625 13.15C18.5375 13.5167 18.375 13.8667 18.175 14.2C18.0417 14.4333 17.8375 14.5875 17.5625 14.6625C17.2875 14.7375 17.0333 14.7083 16.8 14.575ZM12 2C12.8333 2 13.5417 2.29167 14.125 2.875C14.7083 3.45833 15 4.16667 15 5V9.75C15 10.0833 14.8958 10.3333 14.6875 10.5C14.4792 10.6667 14.25 10.75 14 10.75C13.75 10.75 13.5208 10.6625 13.3125 10.4875C13.1042 10.3125 13 10.0583 13 9.725V5C13 4.71667 12.9042 4.47917 12.7125 4.2875C12.5208 4.09583 12.2833 4 12 4C11.7167 4 11.4792 4.09583 11.2875 4.2875C11.0958 4.47917 11 4.71667 11 5V5.75C11 6.08333 10.8958 6.33333 10.6875 6.5C10.4792 6.66667 10.25 6.75 10 6.75C9.75001 6.75 9.52085 6.6625 9.31251 6.4875C9.10418 6.3125 9.00001 6.05833 9.00001 5.725V5C9.00001 4.16667 9.29168 3.45833 9.87501 2.875C10.4583 2.29167 11.1667 2 12 2ZM11 20V17.925C9.46668 17.725 8.15418 17.0792 7.06251 15.9875C5.97085 14.8958 5.30835 13.575 5.07501 12.025C5.04168 11.7417 5.11668 11.5 5.30001 11.3C5.48335 11.1 5.71668 11 6.00001 11C6.28335 11 6.52501 11.0958 6.72501 11.2875C6.92501 11.4792 7.05001 11.7167 7.10001 12C7.33335 13.1833 7.90835 14.1458 8.82501 14.8875C9.74168 15.6292 10.8 16 12 16C12.5667 16 13.1042 15.9125 13.6125 15.7375C14.1208 15.5625 14.5833 15.3167 15 15L16.425 16.425C15.9417 16.8083 15.4125 17.1333 14.8375 17.4C14.2625 17.6667 13.65 17.8417 13 17.925V20C13 20.2833 12.9042 20.5208 12.7125 20.7125C12.5208 20.9042 12.2833 21 12 21C11.7167 21 11.4792 20.9042 11.2875 20.7125C11.0958 20.5208 11 20.2833 11 20ZM19.1 21.9L2.10001 4.9C1.91668 4.71667 1.82501 4.48333 1.82501 4.2C1.82501 3.91667 1.91668 3.68333 2.10001 3.5C2.28335 3.31667 2.51668 3.225 2.80001 3.225C3.08335 3.225 3.31668 3.31667 3.50001 3.5L20.5 20.5C20.6833 20.6833 20.775 20.9167 20.775 21.2C20.775 21.4833 20.6833 21.7167 20.5 21.9C20.3167 22.0833 20.0833 22.175 19.8 22.175C19.5167 22.175 19.2833 22.0833 19.1 21.9Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: '0c49524896d5408069815e934585b4a9b7afd12a' }, h("path", { key: 'be601a8cb7f95f37c0c023d91a12f826d5f29187', d: "M19.6 17.0043C19.3278 16.8488 19.1528 16.6106 19.075 16.2897C18.9972 15.9689 19.0361 15.6724 19.1917 15.4002C19.3278 15.1863 19.4396 14.9578 19.5271 14.7147C19.6146 14.4717 19.6778 14.2238 19.7167 13.971C19.7944 13.6404 19.9451 13.3682 20.1687 13.1543C20.3923 12.9404 20.6694 12.8335 21 12.8335C21.3305 12.8335 21.6028 12.9502 21.8167 13.1835C22.0305 13.4168 22.118 13.6988 22.0792 14.0293C22.0208 14.4766 21.9187 14.9141 21.7729 15.3418C21.6271 15.7696 21.4375 16.1779 21.2042 16.5668C21.0486 16.8391 20.8104 17.0189 20.4896 17.1064C20.1687 17.1939 19.8722 17.1599 19.6 17.0043ZM14 2.3335C14.9722 2.3335 15.7986 2.67377 16.4792 3.35433C17.1597 4.03489 17.5 4.86127 17.5 5.8335V11.3752C17.5 11.7641 17.3785 12.0557 17.1354 12.2502C16.8923 12.4446 16.625 12.5418 16.3333 12.5418C16.0417 12.5418 15.7743 12.4397 15.5312 12.2356C15.2882 12.0314 15.1667 11.7349 15.1667 11.346V5.8335C15.1667 5.50294 15.0548 5.22586 14.8312 5.00225C14.6076 4.77864 14.3305 4.66683 14 4.66683C13.6694 4.66683 13.3923 4.77864 13.1687 5.00225C12.9451 5.22586 12.8333 5.50294 12.8333 5.8335V6.7085C12.8333 7.09739 12.7118 7.38905 12.4687 7.5835C12.2257 7.77794 11.9583 7.87516 11.6667 7.87516C11.375 7.87516 11.1076 7.77308 10.8646 7.56891C10.6215 7.36475 10.5 7.06822 10.5 6.67933V5.8335C10.5 4.86127 10.8403 4.03489 11.5208 3.35433C12.2014 2.67377 13.0278 2.3335 14 2.3335ZM12.8333 23.3335V20.9127C11.0444 20.6793 9.51318 19.9259 8.23957 18.6522C6.96596 17.3786 6.19304 15.8377 5.92082 14.0293C5.88193 13.6988 5.96943 13.4168 6.18332 13.1835C6.39721 12.9502 6.66943 12.8335 6.99998 12.8335C7.33054 12.8335 7.61248 12.9453 7.84582 13.1689C8.07915 13.3925 8.22498 13.6696 8.28332 14.0002C8.55554 15.3807 9.22637 16.5036 10.2958 17.3689C11.3653 18.2342 12.6 18.6668 14 18.6668C14.6611 18.6668 15.2882 18.5647 15.8812 18.3606C16.4743 18.1564 17.0139 17.8696 17.5 17.5002L19.1625 19.1627C18.5986 19.6099 17.9812 19.9891 17.3104 20.3002C16.6396 20.6113 15.925 20.8154 15.1667 20.9127V23.3335C15.1667 23.6641 15.0548 23.9411 14.8312 24.1647C14.6076 24.3884 14.3305 24.5002 14 24.5002C13.6694 24.5002 13.3923 24.3884 13.1687 24.1647C12.9451 23.9411 12.8333 23.6641 12.8333 23.3335ZM22.2833 25.5502L2.44998 5.71683C2.23609 5.50294 2.12915 5.23072 2.12915 4.90016C2.12915 4.56961 2.23609 4.29739 2.44998 4.0835C2.66387 3.86961 2.93609 3.76266 3.26665 3.76266C3.59721 3.76266 3.86943 3.86961 4.08332 4.0835L23.9167 23.9168C24.1305 24.1307 24.2375 24.4029 24.2375 24.7335C24.2375 25.0641 24.1305 25.3363 23.9167 25.5502C23.7028 25.7641 23.4305 25.871 23.1 25.871C22.7694 25.871 22.4972 25.7641 22.2833 25.5502Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-mic-off"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-mic.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMic {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: '6ba33f388f526a1aa2fd72472bda34969a9f9514', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: '1d3e280e52abf2568794a7456e8e6f48365ac2f8' }, h("path", { key: '33eaa7f7821f6dd590eaca6a9e24c48ff8d2deaa', d: "M8.00002 9.33337C7.44446 9.33337 6.97224 9.13893 6.58335 8.75004C6.19446 8.36115 6.00002 7.88893 6.00002 7.33337V3.33337C6.00002 2.77782 6.19446 2.3056 6.58335 1.91671C6.97224 1.52782 7.44446 1.33337 8.00002 1.33337C8.55557 1.33337 9.0278 1.52782 9.41669 1.91671C9.80557 2.3056 10 2.77782 10 3.33337V7.33337C10 7.88893 9.80557 8.36115 9.41669 8.75004C9.0278 9.13893 8.55557 9.33337 8.00002 9.33337ZM8.00002 14C7.81113 14 7.65291 13.936 7.52535 13.808C7.39735 13.6805 7.33335 13.5223 7.33335 13.3334V11.95C6.30002 11.8056 5.42224 11.3723 4.70002 10.65C3.9778 9.92782 3.53891 9.06115 3.38335 8.05004C3.35002 7.86115 3.40002 7.69449 3.53335 7.55004C3.66669 7.4056 3.84446 7.33337 4.06669 7.33337C4.22224 7.33337 4.36113 7.3916 4.48335 7.50804C4.60557 7.62493 4.68335 7.76671 4.71669 7.93337C4.86113 8.71115 5.23891 9.36115 5.85002 9.88337C6.46113 10.4056 7.1778 10.6667 8.00002 10.6667C8.82224 10.6667 9.53891 10.4056 10.15 9.88337C10.7611 9.36115 11.1389 8.71115 11.2834 7.93337C11.3167 7.76671 11.3974 7.62493 11.5254 7.50804C11.6529 7.3916 11.7945 7.33337 11.95 7.33337C12.1611 7.33337 12.3334 7.4056 12.4667 7.55004C12.6 7.69449 12.65 7.86115 12.6167 8.05004C12.4611 9.06115 12.0222 9.92782 11.3 10.65C10.5778 11.3723 9.70002 11.8056 8.66669 11.95V13.3334C8.66669 13.5223 8.60291 13.6805 8.47535 13.808C8.34735 13.936 8.18891 14 8.00002 14ZM8.00002 8.00004C8.18891 8.00004 8.34735 7.93604 8.47535 7.80804C8.60291 7.68049 8.66669 7.52226 8.66669 7.33337V3.33337C8.66669 3.14449 8.60291 2.98604 8.47535 2.85804C8.34735 2.73049 8.18891 2.66671 8.00002 2.66671C7.81113 2.66671 7.65291 2.73049 7.52535 2.85804C7.39735 2.98604 7.33335 3.14449 7.33335 3.33337V7.33337C7.33335 7.52226 7.39735 7.68049 7.52535 7.80804C7.65291 7.93604 7.81113 8.00004 8.00002 8.00004Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: 'b1183caaef4a8be271393fc7a26a871be67770c7' }, h("path", { key: 'afc4a16921b49be93bab26b9e37ed202ef6d7b43', d: "M12 14C11.1667 14 10.4583 13.7083 9.875 13.125C9.29166 12.5417 9 11.8333 9 11V5C9 4.16667 9.29166 3.45833 9.875 2.875C10.4583 2.29167 11.1667 2 12 2C12.8333 2 13.5417 2.29167 14.125 2.875C14.7083 3.45833 15 4.16667 15 5V11C15 11.8333 14.7083 12.5417 14.125 13.125C13.5417 13.7083 12.8333 14 12 14ZM12 21C11.7167 21 11.4793 20.904 11.288 20.712C11.096 20.5207 11 20.2833 11 20V17.925C9.45 17.7083 8.13333 17.0583 7.05 15.975C5.96666 14.8917 5.30833 13.5917 5.075 12.075C5.025 11.7917 5.1 11.5417 5.3 11.325C5.5 11.1083 5.76666 11 6.1 11C6.33333 11 6.54166 11.0873 6.725 11.262C6.90833 11.4373 7.025 11.65 7.075 11.9C7.29166 13.0667 7.85833 14.0417 8.775 14.825C9.69166 15.6083 10.7667 16 12 16C13.2333 16 14.3083 15.6083 15.225 14.825C16.1417 14.0417 16.7083 13.0667 16.925 11.9C16.975 11.65 17.096 11.4373 17.288 11.262C17.4793 11.0873 17.6917 11 17.925 11C18.2417 11 18.5 11.1083 18.7 11.325C18.9 11.5417 18.975 11.7917 18.925 12.075C18.6917 13.5917 18.0333 14.8917 16.95 15.975C15.8667 17.0583 14.55 17.7083 13 17.925V20C13 20.2833 12.9043 20.5207 12.713 20.712C12.521 20.904 12.2833 21 12 21ZM12 12C12.2833 12 12.521 11.904 12.713 11.712C12.9043 11.5207 13 11.2833 13 11V5C13 4.71667 12.9043 4.479 12.713 4.287C12.521 4.09567 12.2833 4 12 4C11.7167 4 11.4793 4.09567 11.288 4.287C11.096 4.479 11 4.71667 11 5V11C11 11.2833 11.096 11.5207 11.288 11.712C11.4793 11.904 11.7167 12 12 12Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: '2487efd6cda2adbb348947af1fb046f6e3f2bb52' }, h("path", { key: '34723f77bb4a8e6d3b75fbc4362912f8ff78691d', d: "M14 16.3334C13.0278 16.3334 12.2014 15.9931 11.5208 15.3125C10.8403 14.632 10.5 13.8056 10.5 12.8334V5.83337C10.5 4.86115 10.8403 4.03476 11.5208 3.35421C12.2014 2.67365 13.0278 2.33337 14 2.33337C14.9722 2.33337 15.7986 2.67365 16.4792 3.35421C17.1597 4.03476 17.5 4.86115 17.5 5.83337V12.8334C17.5 13.8056 17.1597 14.632 16.4792 15.3125C15.7986 15.9931 14.9722 16.3334 14 16.3334ZM14 24.5C13.6694 24.5 13.3925 24.388 13.1693 24.164C12.9453 23.9408 12.8333 23.6639 12.8333 23.3334V20.9125C11.025 20.6598 9.48888 19.9014 8.22499 18.6375C6.9611 17.3737 6.19304 15.857 5.92082 14.0875C5.86249 13.757 5.94999 13.4653 6.18332 13.2125C6.41665 12.9598 6.72776 12.8334 7.11665 12.8334C7.38888 12.8334 7.63193 12.9353 7.84582 13.139C8.05971 13.3436 8.19582 13.5917 8.25415 13.8834C8.50693 15.2445 9.16804 16.382 10.2375 17.2959C11.3069 18.2098 12.5611 18.6667 14 18.6667C15.4389 18.6667 16.693 18.2098 17.7625 17.2959C18.8319 16.382 19.493 15.2445 19.7458 13.8834C19.8042 13.5917 19.9453 13.3436 20.1693 13.139C20.3925 12.9353 20.6403 12.8334 20.9125 12.8334C21.2819 12.8334 21.5833 12.9598 21.8167 13.2125C22.05 13.4653 22.1375 13.757 22.0792 14.0875C21.8069 15.857 21.0389 17.3737 19.775 18.6375C18.5111 19.9014 16.975 20.6598 15.1667 20.9125V23.3334C15.1667 23.6639 15.055 23.9408 14.8318 24.164C14.6078 24.388 14.3305 24.5 14 24.5ZM14 14C14.3305 14 14.6078 13.888 14.8318 13.664C15.055 13.4408 15.1667 13.1639 15.1667 12.8334V5.83337C15.1667 5.50282 15.055 5.22554 14.8318 5.00154C14.6078 4.77832 14.3305 4.66671 14 4.66671C13.6694 4.66671 13.3925 4.77832 13.1693 5.00154C12.9453 5.22554 12.8333 5.50282 12.8333 5.83337V12.8334C12.8333 13.1639 12.9453 13.4408 13.1693 13.664C13.3925 13.888 13.6694 14 14 14Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-mic"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-more-horizontal.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMoreHorizontal {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: 'b53c19bcfd37a4979a916f5ee1ead2e32296f7ed', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: 'ce0cc9af7a60eac21eb87329842f82b5b568e82c' }, h("path", { key: '87a796b29b5ab2cfa54519465e915414ce5ec737', d: "M3.88334 9.39998C3.49445 9.39998 3.164 9.26109 2.892 8.98331C2.61956 8.70553 2.48334 8.37775 2.48334 7.99998C2.48334 7.61109 2.61956 7.28042 2.892 7.00798C3.164 6.73598 3.49445 6.59998 3.88334 6.59998C4.26112 6.59998 4.58623 6.73598 4.85867 7.00798C5.13067 7.28042 5.26667 7.61109 5.26667 7.99998C5.26667 8.37775 5.13067 8.70553 4.85867 8.98331C4.58623 9.26109 4.26112 9.39998 3.88334 9.39998ZM8 9.39998C7.62223 9.39998 7.29445 9.26109 7.01667 8.98331C6.73889 8.70553 6.6 8.37775 6.6 7.99998C6.6 7.61109 6.73889 7.28042 7.01667 7.00798C7.29445 6.73598 7.62223 6.59998 8 6.59998C8.38889 6.59998 8.71956 6.73598 8.992 7.00798C9.264 7.28042 9.4 7.61109 9.4 7.99998C9.4 8.37775 9.264 8.70553 8.992 8.98331C8.71956 9.26109 8.38889 9.39998 8 9.39998ZM12.1167 9.39998C11.7389 9.39998 11.4138 9.26109 11.1413 8.98331C10.8693 8.70553 10.7333 8.37775 10.7333 7.99998C10.7333 7.61109 10.8693 7.28042 11.1413 7.00798C11.4138 6.73598 11.7389 6.59998 12.1167 6.59998C12.5056 6.59998 12.8362 6.73598 13.1087 7.00798C13.3807 7.28042 13.5167 7.61109 13.5167 7.99998C13.5167 8.37775 13.3807 8.70553 13.1087 8.98331C12.8362 9.26109 12.5056 9.39998 12.1167 9.39998Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '6e9b80255539a59de1eef4b410a8d80d6817fd17' }, h("path", { key: 'bd4e9317e177f16adcf6e02c4dc39d6034463db7', d: "M5.82501 14.1C5.24167 14.1 4.74601 13.8917 4.33801 13.475C3.92934 13.0584 3.72501 12.5667 3.72501 12C3.72501 11.4167 3.92934 10.9207 4.33801 10.512C4.74601 10.104 5.24167 9.90002 5.82501 9.90002C6.39167 9.90002 6.87934 10.104 7.28801 10.512C7.69601 10.9207 7.90001 11.4167 7.90001 12C7.90001 12.5667 7.69601 13.0584 7.28801 13.475C6.87934 13.8917 6.39167 14.1 5.82501 14.1ZM12 14.1C11.4333 14.1 10.9417 13.8917 10.525 13.475C10.1083 13.0584 9.90001 12.5667 9.90001 12C9.90001 11.4167 10.1083 10.9207 10.525 10.512C10.9417 10.104 11.4333 9.90002 12 9.90002C12.5833 9.90002 13.0793 10.104 13.488 10.512C13.896 10.9207 14.1 11.4167 14.1 12C14.1 12.5667 13.896 13.0584 13.488 13.475C13.0793 13.8917 12.5833 14.1 12 14.1ZM18.175 14.1C17.6083 14.1 17.1207 13.8917 16.712 13.475C16.304 13.0584 16.1 12.5667 16.1 12C16.1 11.4167 16.304 10.9207 16.712 10.512C17.1207 10.104 17.6083 9.90002 18.175 9.90002C18.7583 9.90002 19.2543 10.104 19.663 10.512C20.071 10.9207 20.275 11.4167 20.275 12C20.275 12.5667 20.071 13.0584 19.663 13.475C19.2543 13.8917 18.7583 14.1 18.175 14.1Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: 'eed9c9de7dd7f8b83a29d3d36400f69d30c586bd' }, h("path", { key: 'de712bdbaab8c74544581e76e7879e9b34903436', d: "M6.79583 16.45C6.11527 16.45 5.53699 16.2069 5.06099 15.7208C4.58421 15.2347 4.34583 14.6611 4.34583 14C4.34583 13.3194 4.58421 12.7408 5.06099 12.264C5.53699 11.788 6.11527 11.55 6.79583 11.55C7.45694 11.55 8.02588 11.788 8.50266 12.264C8.97866 12.7408 9.21666 13.3194 9.21666 14C9.21666 14.6611 8.97866 15.2347 8.50266 15.7208C8.02588 16.2069 7.45694 16.45 6.79583 16.45ZM14 16.45C13.3389 16.45 12.7653 16.2069 12.2792 15.7208C11.793 15.2347 11.55 14.6611 11.55 14C11.55 13.3194 11.793 12.7408 12.2792 12.264C12.7653 11.788 13.3389 11.55 14 11.55C14.6805 11.55 15.2592 11.788 15.736 12.264C16.212 12.7408 16.45 13.3194 16.45 14C16.45 14.6611 16.212 15.2347 15.736 15.7208C15.2592 16.2069 14.6805 16.45 14 16.45ZM21.2042 16.45C20.543 16.45 19.9741 16.2069 19.4973 15.7208C19.0213 15.2347 18.7833 14.6611 18.7833 14C18.7833 13.3194 19.0213 12.7408 19.4973 12.264C19.9741 11.788 20.543 11.55 21.2042 11.55C21.8847 11.55 22.4634 11.788 22.9402 12.264C23.4162 12.7408 23.6542 13.3194 23.6542 14C23.6542 14.6611 23.4162 15.2347 22.9402 15.7208C22.4634 16.2069 21.8847 16.45 21.2042 16.45Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-more-horizontal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-more-vertikal.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMoreVertikal {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: '5bbc3ccc3fa80c8768bab9b13233053eccb98716', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: '0d454e121159800be672d8e6f265a9ced5e6b3bf' }, h("path", { key: 'cf2d372ea2f1aba151002f392b7a36a3ab22c0b3', d: "M8.00001 13.5167C7.62223 13.5167 7.29445 13.3807 7.01667 13.1087C6.73889 12.8362 6.60001 12.5056 6.60001 12.1167C6.60001 11.7389 6.73889 11.4138 7.01667 11.1413C7.29445 10.8693 7.62223 10.7333 8.00001 10.7333C8.3889 10.7333 8.71956 10.8693 8.99201 11.1413C9.26401 11.4138 9.40001 11.7389 9.40001 12.1167C9.40001 12.5056 9.26401 12.8362 8.99201 13.1087C8.71956 13.3807 8.3889 13.5167 8.00001 13.5167ZM8.00001 9.4C7.62223 9.4 7.29445 9.26112 7.01667 8.98334C6.73889 8.70556 6.60001 8.37778 6.60001 8C6.60001 7.61112 6.73889 7.28045 7.01667 7.008C7.29445 6.736 7.62223 6.6 8.00001 6.6C8.3889 6.6 8.71956 6.736 8.99201 7.008C9.26401 7.28045 9.40001 7.61112 9.40001 8C9.40001 8.37778 9.26401 8.70556 8.99201 8.98334C8.71956 9.26112 8.3889 9.4 8.00001 9.4V9.4ZM8.00001 5.26667C7.62223 5.26667 7.29445 5.13045 7.01667 4.858C6.73889 4.586 6.60001 4.26112 6.60001 3.88334C6.60001 3.49445 6.73889 3.16378 7.01667 2.89134C7.29445 2.61934 7.62223 2.48334 8.00001 2.48334C8.3889 2.48334 8.71956 2.61934 8.99201 2.89134C9.26401 3.16378 9.40001 3.49445 9.40001 3.88334C9.40001 4.26112 9.26401 4.586 8.99201 4.858C8.71956 5.13045 8.3889 5.26667 8.00001 5.26667V5.26667Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '7c4a72a7973e8c3baa7829c65d53525ba483a0f1' }, h("path", { key: '34ba02d5599cdc962e5be77e12c44de5ebe7ad0c', d: "M12 20.275C11.4333 20.275 10.9417 20.071 10.525 19.663C10.1083 19.2543 9.89999 18.7583 9.89999 18.175C9.89999 17.6083 10.1083 17.1206 10.525 16.712C10.9417 16.304 11.4333 16.1 12 16.1C12.5833 16.1 13.0793 16.304 13.488 16.712C13.896 17.1206 14.1 17.6083 14.1 18.175C14.1 18.7583 13.896 19.2543 13.488 19.663C13.0793 20.071 12.5833 20.275 12 20.275ZM12 14.1C11.4333 14.1 10.9417 13.8916 10.525 13.475C10.1083 13.0583 9.89999 12.5666 9.89999 12C9.89999 11.4166 10.1083 10.9206 10.525 10.512C10.9417 10.104 11.4333 9.89998 12 9.89998C12.5833 9.89998 13.0793 10.104 13.488 10.512C13.896 10.9206 14.1 11.4166 14.1 12C14.1 12.5666 13.896 13.0583 13.488 13.475C13.0793 13.8916 12.5833 14.1 12 14.1ZM12 7.89998C11.4333 7.89998 10.9417 7.69564 10.525 7.28698C10.1083 6.87898 9.89999 6.39164 9.89999 5.82498C9.89999 5.24164 10.1083 4.74564 10.525 4.33698C10.9417 3.92898 11.4333 3.72498 12 3.72498C12.5833 3.72498 13.0793 3.92898 13.488 4.33698C13.896 4.74564 14.1 5.24164 14.1 5.82498C14.1 6.39164 13.896 6.87898 13.488 7.28698C13.0793 7.69564 12.5833 7.89998 12 7.89998Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: 'd1f533eb817e085c7e1209e9e7ed7f8b3cd965db' }, h("path", { key: 'f30077691a830abc075853bbfb3316c3f3ded62c', d: "M14 23.6542C13.3389 23.6542 12.7653 23.4162 12.2792 22.9402C11.793 22.4634 11.55 21.8847 11.55 21.2042C11.55 20.543 11.793 19.9741 12.2792 19.4973C12.7653 19.0213 13.3389 18.7833 14 18.7833C14.6805 18.7833 15.2592 19.0213 15.736 19.4973C16.212 19.9741 16.45 20.543 16.45 21.2042C16.45 21.8847 16.212 22.4634 15.736 22.9402C15.2592 23.4162 14.6805 23.6542 14 23.6542ZM14 16.45C13.3389 16.45 12.7653 16.2069 12.2792 15.7208C11.793 15.2347 11.55 14.6611 11.55 14C11.55 13.3194 11.793 12.7408 12.2792 12.264C12.7653 11.788 13.3389 11.55 14 11.55C14.6805 11.55 15.2592 11.788 15.736 12.264C16.212 12.7408 16.45 13.3194 16.45 14C16.45 14.6611 16.212 15.2347 15.736 15.7208C15.2592 16.2069 14.6805 16.45 14 16.45V16.45ZM14 9.21666C13.3389 9.21666 12.7653 8.97827 12.2792 8.50149C11.793 8.02549 11.55 7.45694 11.55 6.79583C11.55 6.11527 11.793 5.5366 12.2792 5.05983C12.7653 4.58383 13.3389 4.34583 14 4.34583C14.6805 4.34583 15.2592 4.58383 15.736 5.05983C16.212 5.5366 16.45 6.11527 16.45 6.79583C16.45 7.45694 16.212 8.02549 15.736 8.50149C15.2592 8.97827 14.6805 9.21666 14 9.21666V9.21666Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-more-vertikal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-news-filled.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNewsFilled {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: '58b210a52f817b5aaf0df1d5b3ddad804024e11d', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: 'bf3ac974f092bc5a928247ea7b4b468b14d4c340' }, h("path", { key: '4e842d74aa8305eb49f002ab6268780e30d92114', d: "M2 4C2 2.89543 2.89543 2 4 2H12C13.1046 2 14 2.89543 14 4V12C14 13.1046 13.1046 14 12 14H4C2.89543 14 2 13.1046 2 12V4ZM3.33333 8.66667V12C3.33333 12.3682 3.63181 12.6667 4 12.6667H12C12.3682 12.6667 12.6667 12.3682 12.6667 12V8.66667H3.33333ZM6 5.33333C6 4.78105 5.55228 4.33333 5 4.33333C4.44772 4.33333 4 4.78105 4 5.33333C4 5.88562 4.44772 6.33333 5 6.33333C5.55228 6.33333 6 5.88562 6 5.33333ZM8 4.66667C7.63181 4.66667 7.33333 4.96514 7.33333 5.33333C7.33333 5.70152 7.63181 6 8 6H11C11.3682 6 11.6667 5.70152 11.6667 5.33333C11.6667 4.96514 11.3682 4.66667 11 4.66667H8Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: 'ae73d870a7e8edb731e7fc56e3e7f734ce17501f' }, h("path", { key: 'd665ff6ecdcee60a78fc6042f29ac383b79df334', d: "M3 6C3 4.34315 4.34315 3 6 3H18C19.6569 3 21 4.34315 21 6V18C21 19.6569 19.6569 21 18 21H6C4.34315 21 3 19.6569 3 18V6ZM5 13V18C5 18.5523 5.44772 19 6 19H18C18.5523 19 19 18.5523 19 18V13H5ZM9 8C9 7.17157 8.32843 6.5 7.5 6.5C6.67157 6.5 6 7.17157 6 8C6 8.82843 6.67157 9.5 7.5 9.5C8.32843 9.5 9 8.82843 9 8ZM12 7C11.4477 7 11 7.44772 11 8C11 8.55229 11.4477 9 12 9H16.5C17.0523 9 17.5 8.55229 17.5 8C17.5 7.44772 17.0523 7 16.5 7H12Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: '2ff975d9efcb0fa8571bbb310a1d3f260168c267' }, h("path", { key: '4b454b72bb6cf566c0d588d1a32bf2f0b7d0fd1f', d: "M3.5 7C3.5 5.067 5.067 3.5 7 3.5H21C22.933 3.5 24.5 5.067 24.5 7V21C24.5 22.933 22.933 24.5 21 24.5H7C5.067 24.5 3.5 22.933 3.5 21V7ZM5.83333 15.1667V21C5.83333 21.6443 6.35567 22.1667 7 22.1667H21C21.6443 22.1667 22.1667 21.6443 22.1667 21V15.1667H5.83333ZM10.5 9.33333C10.5 8.36683 9.7165 7.58333 8.75 7.58333C7.7835 7.58333 7 8.36683 7 9.33333C7 10.2998 7.7835 11.0833 8.75 11.0833C9.7165 11.0833 10.5 10.2998 10.5 9.33333ZM14 8.16667C13.3557 8.16667 12.8333 8.689 12.8333 9.33333C12.8333 9.97767 13.3557 10.5 14 10.5H19.25C19.8943 10.5 20.4167 9.97767 20.4167 9.33333C20.4167 8.689 19.8943 8.16667 19.25 8.16667H14Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-news-filled"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-news-off.js

@@ -0,0 +1,83 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Fragment, h } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNewsOff {
+    constructor() {
+        this.size = 24;
+    }
+    render() {
+        const viewBoxSize = this.size === 20 ? 24 : this.size;
+        const styles = {
+            color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
+        };
+        const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+        return (h("svg", { key: '89a1bcb7c9876aded5e53be835d9ef844f29ab1a', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, { key: '76f672efd05d7381451a8b52968b8acb971990f3' }, h("path", { key: '6eb60cb6f7dbf6f08500f3a5e23f4efcca7e469e', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6569 13.6569C13.9172 13.9172 13.9172 14.3393 13.6569 14.5997C13.3965 14.86 12.9744 14.86 12.714 14.5997L12.1113 13.997C12.0745 13.999 12.0374 14 12 14H4C2.89543 14 2 13.1046 2 12V4C2 3.96264 2.00102 3.92552 2.00305 3.88866L1.40034 3.28596C1.13999 3.02561 1.13999 2.6035 1.40034 2.34315C1.66069 2.0828 2.0828 2.0828 2.34315 2.34315L13.6569 13.6569ZM3.33333 5.21895V7.33333H5.44772L3.33333 5.21895ZM6.78105 8.66667H3.33333V12C3.33333 12.3682 3.63181 12.6667 4 12.6667H10.781L6.78105 8.66667Z", fill: "currentColor" }), h("path", { key: '41ca3162a4f45da420a50375af1aa4b9e1f05cda', d: "M12.6667 7.33333H8.93221L10.2655 8.66667H12.6667V11.0678L13.9663 12.3674C13.9884 12.2483 14 12.1255 14 12V4C14 2.89543 13.1046 2 12 2H4C3.87448 2 3.75167 2.01156 3.63256 2.03368L4.93221 3.33333H12C12.3682 3.33333 12.6667 3.63181 12.6667 4V7.33333Z", fill: "currentColor" }), h("path", { key: 'd092114ce6c0b3a7d53f9c2b2818890fdbae5ecc', d: "M7.33333 5.33333C7.33333 4.96514 7.63181 4.66667 8 4.66667H10.6667C11.0349 4.66667 11.3333 4.96514 11.3333 5.33333C11.3333 5.70152 11.0349 6 10.6667 6H8C7.63181 6 7.33333 5.70152 7.33333 5.33333Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '61c51277dbf9ef4f53249659f89cdab6bc17c001' }, h("path", { key: '0e40cbeb59451bd09efdfcfb7d052ad51d1b20ea', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.4853 20.4853C20.8758 20.8758 20.8758 21.509 20.4853 21.8995C20.0948 22.29 19.4616 22.29 19.0711 21.8995L18.167 20.9954C18.1117 20.9985 18.056 21 18 21H6C4.34315 21 3 19.6569 3 18V6C3 5.94396 3.00154 5.88828 3.00457 5.833L2.10051 4.92894C1.70999 4.53841 1.70999 3.90525 2.10051 3.51472C2.49103 3.1242 3.1242 3.1242 3.51472 3.51472L20.4853 20.4853ZM5 7.82843V11H8.17157L5 7.82843ZM10.1716 13H5V18C5 18.5523 5.44772 19 6 19H16.1716L10.1716 13Z", fill: "currentColor" }), h("path", { key: 'ec66042d6f3172c9e97371852d34880fcca12923', d: "M19 11H13.3983L15.3983 13H19V16.6017L20.9495 18.5512C20.9827 18.3725 21 18.1883 21 18V6C21 4.34315 19.6569 3 18 3H6C5.81172 3 5.6275 3.01734 5.44884 3.05052L7.39831 5H18C18.5523 5 19 5.44772 19 6V11Z", fill: "currentColor" }), h("path", { key: '50fc8e8271facf188eab5ad4baba2f08f1c39079', d: "M11 8C11 7.44772 11.4477 7 12 7H16C16.5523 7 17 7.44772 17 8C17 8.55228 16.5523 9 16 9H12C11.4477 9 11 8.55228 11 8Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: 'ce09cadd9e4a25dc3984ee138889afb328cf8b13' }, h("path", { key: 'dcba35dbe409708f0314280965be135b94cedb16', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M23.8995 23.8995C24.3551 24.3551 24.3551 25.0938 23.8995 25.5494C23.4439 26.005 22.7052 26.005 22.2496 25.5494L21.1948 24.4947C21.1303 24.4982 21.0654 24.5 21 24.5H7C5.067 24.5 3.5 22.933 3.5 21V7C3.5 6.93462 3.50179 6.86966 3.50533 6.80516L2.4506 5.75043C1.99498 5.29482 1.99498 4.55612 2.4506 4.10051C2.90621 3.6449 3.6449 3.6449 4.10051 4.10051L23.8995 23.8995ZM5.83333 9.13316V12.8333H9.5335L5.83333 9.13316ZM11.8668 15.1667H5.83333V21C5.83333 21.6443 6.35567 22.1667 7 22.1667H18.8668L11.8668 15.1667Z", fill: "currentColor" }), h("path", { key: 'e28a4409e196b14607c6f5c1caec48e9ab1545ad', d: "M22.1667 12.8333H15.6314L17.9647 15.1667H22.1667V19.3686L24.4411 21.643C24.4798 21.4346 24.5 21.2197 24.5 21V7C24.5 5.067 22.933 3.5 21 3.5H7C6.78034 3.5 6.56542 3.52023 6.35698 3.55894L8.63137 5.83333H21C21.6443 5.83333 22.1667 6.35567 22.1667 7V12.8333Z", fill: "currentColor" }), h("path", { key: '1f8de6441db704748c50c43a983e9073c2a7f881', d: "M12.8333 9.33333C12.8333 8.689 13.3557 8.16667 14 8.16667H18.6667C19.311 8.16667 19.8333 8.689 19.8333 9.33333C19.8333 9.97766 19.311 10.5 18.6667 10.5H14C13.3557 10.5 12.8333 9.97766 12.8333 9.33333Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-news-off"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../swirl-icon.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "color": {
+                "type": "string",
+                "attribute": "color",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconColor",
+                    "resolved": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\"",
+                    "references": {
+                        "SwirlIconColor": {
+                            "location": "import",
+                            "path": "../swirl-icon",
+                            "id": "src/components/swirl-icon/swirl-icon.tsx::SwirlIconColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "attribute": "size",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlIconSize",
+                    "resolved": "16 | 20 | 24 | 28",
+                    "references": {
+                        "SwirlIconSize": {
+                            "location": "import",
+                            "path": "../swirl-icon.types",
+                            "id": "src/components/swirl-icon/swirl-icon.types.ts::SwirlIconSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "24"
+            }
+        };
+    }
+}