@getflip/swirl-components 0.11.0 → 0.13.0

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconMoreVertikal {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { 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, null,
+        h("path", { 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, null,
+        h("path", { 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 {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNewsFilled {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M11.5 2H4.5C3.83696 2 3.20107 2.26339 2.73223 2.73223C2.26339 3.20107 2 3.83696 2 4.5V11.5C2 12.163 2.26339 12.7989 2.73223 13.2678C3.20107 13.7366 3.83696 14 4.5 14H11.5C12.163 14 12.7989 13.7366 13.2678 13.2678C13.7366 12.7989 14 12.163 14 11.5V4.5C14 3.83696 13.7366 3.20107 13.2678 2.73223C12.7989 2.26339 12.163 2 11.5 2V2ZM4.835 3.835C5.0652 3.83599 5.28995 3.90515 5.48087 4.03376C5.6718 4.16237 5.82034 4.34467 5.90775 4.55763C5.99516 4.77059 6.01752 5.00467 5.972 5.23033C5.92649 5.45599 5.81514 5.6631 5.65201 5.82553C5.48889 5.98796 5.2813 6.09842 5.05545 6.14297C4.8296 6.18752 4.59561 6.16415 4.38303 6.07583C4.17044 5.98751 3.98879 5.83819 3.861 5.64672C3.7332 5.45524 3.665 5.2302 3.665 5C3.665 4.84659 3.6953 4.69469 3.75416 4.55302C3.81302 4.41134 3.89928 4.28269 4.00799 4.17445C4.1167 4.0662 4.24572 3.98049 4.38764 3.92224C4.52956 3.86399 4.68159 3.83434 4.835 3.835ZM12.335 11.365C12.335 11.4924 12.3099 11.6185 12.2612 11.7362C12.2124 11.8539 12.141 11.9608 12.0509 12.0509C11.9608 12.141 11.8539 12.2124 11.7362 12.2612C11.6185 12.3099 11.4924 12.335 11.365 12.335H4.635C4.50762 12.335 4.38148 12.3099 4.2638 12.2612C4.14611 12.2124 4.03918 12.141 3.94911 12.0509C3.85903 11.9608 3.78758 11.8539 3.73884 11.7362C3.69009 11.6185 3.665 11.4924 3.665 11.365V8.3C3.665 8.04274 3.7672 7.79602 3.94911 7.61411C4.13102 7.4322 4.37774 7.33 4.635 7.33H11.365C11.4924 7.33 11.6185 7.35509 11.7362 7.40384C11.8539 7.45258 11.9608 7.52403 12.0509 7.61411C12.141 7.70418 12.2124 7.81111 12.2612 7.9288C12.3099 8.04648 12.335 8.17262 12.335 8.3V11.365ZM11.75 5.585H7.915C7.75985 5.585 7.61105 5.52337 7.50134 5.41366C7.39163 5.30395 7.33 5.15515 7.33 5C7.33 4.84485 7.39163 4.69605 7.50134 4.58634C7.61105 4.47663 7.75985 4.415 7.915 4.415H11.75C11.9052 4.415 12.0539 4.47663 12.1637 4.58634C12.2734 4.69605 12.335 4.84485 12.335 5C12.335 5.15515 12.2734 5.30395 12.1637 5.41366C12.0539 5.52337 11.9052 5.585 11.75 5.585V5.585Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M17.25 3H6.75C5.75544 3 4.80161 3.39509 4.09835 4.09835C3.39509 4.80161 3 5.75544 3 6.75V17.25C3 18.2446 3.39509 19.1984 4.09835 19.9017C4.80161 20.6049 5.75544 21 6.75 21H17.25C18.2446 21 19.1984 20.6049 19.9017 19.9017C20.6049 19.1984 21 18.2446 21 17.25V6.75C21 5.75544 20.6049 4.80161 19.9017 4.09835C19.1984 3.39509 18.2446 3 17.25 3V3ZM7.2525 5.7525C7.5978 5.75398 7.93492 5.85773 8.22131 6.05065C8.50769 6.24356 8.73051 6.517 8.86162 6.83644C8.99274 7.15588 9.02628 7.50701 8.958 7.84549C8.88973 8.18398 8.72271 8.49465 8.47802 8.7383C8.23333 8.98194 7.92195 9.14763 7.58317 9.21445C7.2444 9.28127 6.89342 9.24623 6.57454 9.11375C6.25566 8.98127 5.98318 8.75729 5.79149 8.47007C5.59981 8.18286 5.4975 7.8453 5.4975 7.5C5.4975 7.26988 5.54295 7.04203 5.63123 6.82952C5.71952 6.61702 5.84891 6.42404 6.01198 6.26167C6.17505 6.0993 6.36857 5.97074 6.58146 5.88336C6.79434 5.79598 7.02238 5.75151 7.2525 5.7525ZM18.5025 17.0475C18.5025 17.2386 18.4649 17.4278 18.3917 17.6043C18.3186 17.7808 18.2114 17.9412 18.0763 18.0763C17.9412 18.2114 17.7808 18.3186 17.6043 18.3917C17.4278 18.4649 17.2386 18.5025 17.0475 18.5025H6.9525C6.76143 18.5025 6.57222 18.4649 6.3957 18.3917C6.21917 18.3186 6.05877 18.2114 5.92366 18.0763C5.78855 17.9412 5.68138 17.7808 5.60826 17.6043C5.53513 17.4278 5.4975 17.2386 5.4975 17.0475V12.45C5.4975 12.0641 5.65079 11.694 5.92366 11.4212C6.19653 11.1483 6.56661 10.995 6.9525 10.995H17.0475C17.2386 10.995 17.4278 11.0326 17.6043 11.1058C17.7808 11.1789 17.9412 11.2861 18.0763 11.4212C18.2114 11.5563 18.3186 11.7167 18.3917 11.8932C18.4649 12.0697 18.5025 12.2589 18.5025 12.45V17.0475ZM17.625 8.3775H11.8725C11.6398 8.3775 11.4166 8.28505 11.252 8.12049C11.0875 7.95592 10.995 7.73273 10.995 7.5C10.995 7.26727 11.0875 7.04408 11.252 6.87951C11.4166 6.71495 11.6398 6.6225 11.8725 6.6225H17.625C17.8577 6.6225 18.0809 6.71495 18.2455 6.87951C18.41 7.04408 18.5025 7.26727 18.5025 7.5C18.5025 7.73273 18.41 7.95592 18.2455 8.12049C18.0809 8.28505 17.8577 8.3775 17.625 8.3775V8.3775Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M20.125 3.5H7.875C6.71468 3.5 5.60188 3.96094 4.78141 4.78141C3.96094 5.60188 3.5 6.71468 3.5 7.875V20.125C3.5 21.2853 3.96094 22.3981 4.78141 23.2186C5.60188 24.0391 6.71468 24.5 7.875 24.5H20.125C21.2853 24.5 22.3981 24.0391 23.2186 23.2186C24.0391 22.3981 24.5 21.2853 24.5 20.125V7.875C24.5 6.71468 24.0391 5.60188 23.2186 4.78141C22.3981 3.96094 21.2853 3.5 20.125 3.5V3.5ZM8.46125 6.71125C8.8641 6.71298 9.25741 6.83402 9.59152 7.05909C9.92564 7.28416 10.1856 7.60317 10.3386 7.97585C10.4915 8.34853 10.5307 8.75818 10.451 9.15308C10.3714 9.54798 10.1765 9.91043 9.89102 10.1947C9.60555 10.4789 9.24227 10.6722 8.84703 10.7502C8.4518 10.8282 8.04232 10.7873 7.6703 10.6327C7.29827 10.4781 6.98038 10.2168 6.75674 9.88175C6.53311 9.54668 6.41375 9.15285 6.41375 8.75C6.41375 8.48153 6.46677 8.2157 6.56977 7.96778C6.67278 7.71985 6.82373 7.49471 7.01398 7.30528C7.20422 7.11585 7.43 6.96586 7.67837 6.86392C7.92673 6.76198 8.19278 6.7101 8.46125 6.71125ZM21.5863 19.8887C21.5863 20.1117 21.5423 20.3324 21.457 20.5384C21.3717 20.7443 21.2467 20.9314 21.0891 21.0891C20.9314 21.2467 20.7443 21.3717 20.5384 21.457C20.3324 21.5423 20.1117 21.5863 19.8887 21.5863H8.11125C7.88833 21.5863 7.6676 21.5423 7.46165 21.457C7.2557 21.3717 7.06856 21.2467 6.91094 21.0891C6.75331 20.9314 6.62827 20.7443 6.54296 20.5384C6.45766 20.3324 6.41375 20.1117 6.41375 19.8887V14.525C6.41375 14.0748 6.59259 13.643 6.91094 13.3247C7.22928 13.0063 7.66105 12.8275 8.11125 12.8275H19.8887C20.1117 12.8275 20.3324 12.8714 20.5384 12.9567C20.7443 13.042 20.9314 13.1671 21.0891 13.3247C21.2467 13.4823 21.3717 13.6694 21.457 13.8754C21.5423 14.0813 21.5863 14.3021 21.5863 14.525V19.8887ZM20.5625 9.77375H13.8512C13.5797 9.77375 13.3193 9.66589 13.1273 9.4739C12.9354 9.28191 12.8275 9.02152 12.8275 8.75C12.8275 8.47848 12.9354 8.21809 13.1273 8.0261C13.3193 7.83411 13.5797 7.72625 13.8512 7.72625H20.5625C20.834 7.72625 21.0944 7.83411 21.2864 8.0261C21.4784 8.21809 21.5863 8.47848 21.5863 8.75C21.5863 9.02152 21.4784 9.28191 21.2864 9.4739C21.0944 9.66589 20.834 9.77375 20.5625 9.77375V9.77375Z", 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 {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,58 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNewsOutlined {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M11.5 2H4.5C3.83696 2 3.20107 2.26339 2.73223 2.73223C2.26339 3.20107 2 3.83696 2 4.5V11.5C2 12.163 2.26339 12.7989 2.73223 13.2678C3.20107 13.7366 3.83696 14 4.5 14H11.5C12.163 14 12.7989 13.7366 13.2678 13.2678C13.7366 12.7989 14 12.163 14 11.5V4.5C14 3.83696 13.7366 3.20107 13.2678 2.73223C12.7989 2.26339 12.163 2 11.5 2ZM4.5 3H11.5C11.8978 3 12.2794 3.15804 12.5607 3.43934C12.842 3.72064 13 4.10218 13 4.5V7.34H3V4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3ZM11.5 13H4.5C4.10218 13 3.72064 12.842 3.43934 12.5607C3.15804 12.2794 3 11.8978 3 11.5V8.34H13V11.5C13 11.8978 12.842 12.2794 12.5607 12.5607C12.2794 12.842 11.8978 13 11.5 13Z", fill: "currentColor" }),
+        h("path", { d: "M5.17 4H5.165C4.52159 4 4 4.52159 4 5.165V5.17C4 5.81341 4.52159 6.335 5.165 6.335H5.17C5.81341 6.335 6.335 5.81341 6.335 5.17V5.165C6.335 4.52159 5.81341 4 5.17 4Z", fill: "currentColor" }),
+        h("path", { d: "M11.325 4.49H8.01C7.63721 4.49 7.335 4.79221 7.335 5.165V5.17C7.335 5.54279 7.63721 5.845 8.01 5.845H11.325C11.6978 5.845 12 5.54279 12 5.17V5.165C12 4.79221 11.6978 4.49 11.325 4.49Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M17.25 3H6.75C5.75544 3 4.80161 3.39509 4.09835 4.09835C3.39509 4.80161 3 5.75544 3 6.75V17.25C3 18.2446 3.39509 19.1984 4.09835 19.9017C4.80161 20.6049 5.75544 21 6.75 21H17.25C18.2446 21 19.1984 20.6049 19.9017 19.9017C20.6049 19.1984 21 18.2446 21 17.25V6.75C21 5.75544 20.6049 4.80161 19.9017 4.09835C19.1984 3.39509 18.2446 3 17.25 3ZM6.75 4.5H17.25C17.8467 4.5 18.419 4.73705 18.841 5.15901C19.2629 5.58097 19.5 6.15326 19.5 6.75V11.01H4.5V6.75C4.5 6.15326 4.73705 5.58097 5.15901 5.15901C5.58097 4.73705 6.15326 4.5 6.75 4.5ZM17.25 19.5H6.75C6.15326 19.5 5.58097 19.2629 5.15901 18.841C4.73705 18.419 4.5 17.8467 4.5 17.25V12.51H19.5V17.25C19.5 17.8467 19.2629 18.419 18.841 18.841C18.419 19.2629 17.8467 19.5 17.25 19.5Z", fill: "currentColor" }),
+        h("path", { d: "M7.755 6H7.7475C6.78238 6 6 6.78238 6 7.7475V7.755C6 8.72012 6.78238 9.5025 7.7475 9.5025H7.755C8.72012 9.5025 9.5025 8.72012 9.5025 7.755V7.7475C9.5025 6.78238 8.72012 6 7.755 6Z", fill: "currentColor" }),
+        h("path", { d: "M16.9875 6.735H12.015C11.4558 6.735 11.0025 7.18831 11.0025 7.7475V7.755C11.0025 8.31419 11.4558 8.7675 12.015 8.7675H16.9875C17.5467 8.7675 18 8.31419 18 7.755V7.7475C18 7.18831 17.5467 6.735 16.9875 6.735Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M20.125 3.5H7.875C6.71468 3.5 5.60188 3.96094 4.78141 4.78141C3.96094 5.60188 3.5 6.71468 3.5 7.875V20.125C3.5 21.2853 3.96094 22.3981 4.78141 23.2186C5.60188 24.0391 6.71468 24.5 7.875 24.5H20.125C21.2853 24.5 22.3981 24.0391 23.2186 23.2186C24.0391 22.3981 24.5 21.2853 24.5 20.125V7.875C24.5 6.71468 24.0391 5.60188 23.2186 4.78141C22.3981 3.96094 21.2853 3.5 20.125 3.5ZM7.875 5.25H20.125C20.8212 5.25 21.4889 5.52656 21.9812 6.01884C22.4734 6.51113 22.75 7.17881 22.75 7.875V12.845H5.25V7.875C5.25 7.17881 5.52656 6.51113 6.01884 6.01884C6.51113 5.52656 7.17881 5.25 7.875 5.25ZM20.125 22.75H7.875C7.17881 22.75 6.51113 22.4734 6.01884 21.9812C5.52656 21.4889 5.25 20.8212 5.25 20.125V14.595H22.75V20.125C22.75 20.8212 22.4734 21.4889 21.9812 21.9812C21.4889 22.4734 20.8212 22.75 20.125 22.75Z", fill: "currentColor" }),
+        h("path", { d: "M9.0475 7H9.03875C7.91278 7 7 7.91278 7 9.03875V9.0475C7 10.1735 7.91278 11.0863 9.03875 11.0863H9.0475C10.1735 11.0863 11.0863 10.1735 11.0863 9.0475V9.03875C11.0863 7.91278 10.1735 7 9.0475 7Z", fill: "currentColor" }),
+        h("path", { d: "M19.8187 7.8575H14.0175C13.3651 7.8575 12.8363 8.38636 12.8363 9.03875V9.0475C12.8363 9.69989 13.3651 10.2287 14.0175 10.2287H19.8187C20.4711 10.2287 21 9.69989 21 9.0475V9.03875C21 8.38636 20.4711 7.8575 19.8187 7.8575Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-news-outlined"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-notifications-active.js

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNotificationsActive {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M12.0026 10.5V7.16667C12.0026 5.12 10.9093 3.40667 9.00262 2.95333V2.5C9.00262 1.94667 8.54929 1.5 7.99595 1.5C7.44262 1.5 7.00262 1.94667 7.00262 2.5V2.95333C5.08929 3.40667 4.00262 5.11333 4.00262 7.16667V10.5L3.13595 11.36C2.71595 11.78 3.00929 12.5 3.60262 12.5H12.3826C12.976 12.5 13.276 11.78 12.856 11.36L12.0026 10.5ZM7.99595 14.5C8.72929 14.5 9.32929 13.9 9.32929 13.1667H6.66262C6.66262 13.9 7.25595 14.5 7.99595 14.5ZM4.51595 2.98667C4.79595 2.73333 4.80262 2.3 4.53595 2.03333C4.28262 1.78 3.86929 1.77333 3.60929 2.02C2.46929 3.06 1.68262 4.47333 1.42929 6.06C1.36929 6.46667 1.68262 6.83333 2.09595 6.83333C2.41595 6.83333 2.69595 6.6 2.74929 6.28C2.94929 4.98667 3.58929 3.83333 4.51595 2.98667ZM12.4026 2.02C12.136 1.77333 11.7226 1.78 11.4693 2.03333C11.2026 2.3 11.216 2.72667 11.4893 2.98C12.4093 3.82667 13.056 4.98 13.256 6.27333C13.3026 6.59333 13.5826 6.82667 13.9093 6.82667C14.316 6.82667 14.636 6.46 14.5693 6.05333C14.316 4.47333 13.536 3.06667 12.4026 2.02Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M18.0039 15.75V10.75C18.0039 7.68 16.3639 5.11 13.5039 4.43V3.75C13.5039 2.92 12.8239 2.25 11.9939 2.25C11.1639 2.25 10.5039 2.92 10.5039 3.75V4.43C7.63391 5.11 6.00391 7.67 6.00391 10.75V15.75L4.70391 17.04C4.07391 17.67 4.51391 18.75 5.40391 18.75H18.5739C19.4639 18.75 19.9139 17.67 19.2839 17.04L18.0039 15.75ZM11.9939 21.75C13.0939 21.75 13.9939 20.85 13.9939 19.75H9.99391C9.99391 20.85 10.8839 21.75 11.9939 21.75ZM6.77391 4.48C7.19391 4.1 7.20391 3.45 6.80391 3.05C6.42391 2.67 5.80391 2.66 5.41391 3.03C3.70391 4.59 2.52391 6.71 2.14391 9.09C2.05391 9.7 2.52391 10.25 3.14391 10.25C3.62391 10.25 4.04391 9.9 4.12391 9.42C4.42391 7.48 5.38391 5.75 6.77391 4.48ZM18.6039 3.03C18.2039 2.66 17.5839 2.67 17.2039 3.05C16.8039 3.45 16.8239 4.09 17.2339 4.47C18.6139 5.74 19.5839 7.47 19.8839 9.41C19.9539 9.89 20.3739 10.24 20.8639 10.24C21.4739 10.24 21.9539 9.69 21.8539 9.08C21.4739 6.71 20.3039 4.6 18.6039 3.03Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M21.0046 18.375V12.5417C21.0046 8.96 19.0912 5.96167 15.7546 5.16833V4.375C15.7546 3.40667 14.9612 2.625 13.9929 2.625C13.0246 2.625 12.2546 3.40667 12.2546 4.375V5.16833C8.90623 5.96167 7.00456 8.94833 7.00456 12.5417V18.375L5.48789 19.88C4.75289 20.615 5.26623 21.875 6.30456 21.875H21.6696C22.7079 21.875 23.2329 20.615 22.4979 19.88L21.0046 18.375ZM13.9929 25.375C15.2762 25.375 16.3262 24.325 16.3262 23.0417H11.6596C11.6596 24.325 12.6979 25.375 13.9929 25.375ZM7.90289 5.22667C8.39289 4.78333 8.40456 4.025 7.93789 3.55833C7.49456 3.115 6.77123 3.10333 6.31623 3.535C4.32123 5.355 2.94456 7.82833 2.50123 10.605C2.39623 11.3167 2.94456 11.9583 3.66789 11.9583C4.22789 11.9583 4.71789 11.55 4.81123 10.99C5.16123 8.72667 6.28123 6.70833 7.90289 5.22667ZM21.7046 3.535C21.2379 3.10333 20.5146 3.115 20.0712 3.55833C19.6046 4.025 19.6279 4.77167 20.1062 5.215C21.7162 6.69667 22.8479 8.715 23.1979 10.9783C23.2796 11.5383 23.7696 11.9467 24.3412 11.9467C25.0529 11.9467 25.6129 11.305 25.4962 10.5933C25.0529 7.82833 23.6879 5.36667 21.7046 3.535Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-notifications-active"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNotificationsOff {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M7.53667 14.5C8.27001 14.5 8.87001 13.9 8.87001 13.1667H6.20334C6.20334 13.9 6.79667 14.5 7.53667 14.5ZM11.5367 7.16667C11.5367 5.12 10.4433 3.40667 8.53667 2.95333V2.5C8.53667 1.94667 8.09001 1.5 7.53667 1.5C6.98334 1.5 6.53667 1.94667 6.53667 2.5V2.95333C6.37667 2.99333 6.22334 3.05333 6.07667 3.10667L11.5367 8.56667V7.16667ZM3.14334 2.06667L2.20334 3.00667L4.07667 4.88C3.73001 5.54667 3.53667 6.32 3.53667 7.16667V10.5L2.67667 11.36C2.25667 11.78 2.55001 12.5 3.14334 12.5H11.6967L12.8567 13.66L13.7967 12.72L3.14334 2.06667Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M11.305 21.75C12.405 21.75 13.305 20.85 13.305 19.75H9.30499C9.30499 20.85 10.195 21.75 11.305 21.75ZM17.305 10.75C17.305 7.68 15.665 5.11 12.805 4.43V3.75C12.805 2.92 12.135 2.25 11.305 2.25C10.475 2.25 9.80499 2.92 9.80499 3.75V4.43C9.56499 4.49 9.33499 4.58 9.11499 4.66L17.305 12.85V10.75ZM4.71499 3.1L3.30499 4.51L6.11499 7.32C5.59499 8.32 5.30499 9.48 5.30499 10.75V15.75L4.01499 17.04C3.38499 17.67 3.82499 18.75 4.71499 18.75H17.545L19.285 20.49L20.695 19.08L4.71499 3.1Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M13.1892 25.375C14.4725 25.375 15.5225 24.325 15.5225 23.0417H10.8558C10.8558 24.325 11.8942 25.375 13.1892 25.375ZM20.1892 12.5417C20.1892 8.96 18.2758 5.96167 14.9392 5.16833V4.375C14.9392 3.40667 14.1575 2.625 13.1892 2.625C12.2208 2.625 11.4392 3.40667 11.4392 4.375V5.16833C11.1592 5.23833 10.8908 5.34333 10.6342 5.43667L20.1892 14.9917V12.5417ZM5.50083 3.61667L3.85583 5.26167L7.13417 8.54C6.5275 9.70667 6.18917 11.06 6.18917 12.5417V18.375L4.68417 19.88C3.94917 20.615 4.4625 21.875 5.50083 21.875H20.4692L22.4992 23.905L24.1442 22.26L5.50083 3.61667Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-notifications-off"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconNotifications {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M8.00083 14.5C8.73416 14.5 9.33416 13.9 9.33416 13.1667H6.66749C6.66749 13.9 7.26083 14.5 8.00083 14.5ZM12.0008 10.5V7.16667C12.0008 5.12 10.9075 3.40667 9.00083 2.95333V2.5C9.00083 1.94667 8.55416 1.5 8.00083 1.5C7.44749 1.5 7.00083 1.94667 7.00083 2.5V2.95333C5.08749 3.40667 4.00083 5.11333 4.00083 7.16667V10.5L3.14083 11.36C2.72083 11.78 3.01416 12.5 3.60749 12.5H12.3875C12.9808 12.5 13.2808 11.78 12.8608 11.36L12.0008 10.5Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M12.0012 21.75C13.1012 21.75 14.0012 20.85 14.0012 19.75H10.0012C10.0012 20.85 10.8912 21.75 12.0012 21.75ZM18.0012 15.75V10.75C18.0012 7.68 16.3612 5.11 13.5012 4.43V3.75C13.5012 2.92 12.8312 2.25 12.0012 2.25C11.1712 2.25 10.5012 2.92 10.5012 3.75V4.43C7.63124 5.11 6.00124 7.67 6.00124 10.75V15.75L4.71124 17.04C4.08124 17.67 4.52124 18.75 5.41124 18.75H18.5812C19.4712 18.75 19.9212 17.67 19.2912 17.04L18.0012 15.75Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M14.0014 25.375C15.2848 25.375 16.3348 24.325 16.3348 23.0417H11.6681C11.6681 24.325 12.7064 25.375 14.0014 25.375ZM21.0014 18.375V12.5417C21.0014 8.96 19.0881 5.96167 15.7514 5.16833V4.375C15.7514 3.40667 14.9698 2.625 14.0014 2.625C13.0331 2.625 12.2514 3.40667 12.2514 4.375V5.16833C8.9031 5.96167 7.00143 8.94833 7.00143 12.5417V18.375L5.49643 19.88C4.76143 20.615 5.27477 21.875 6.3131 21.875H21.6781C22.7164 21.875 23.2414 20.615 22.5064 19.88L21.0014 18.375Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-notifications"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-open-in-new.js

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconOpenInNew {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M3.38334 14.1334C2.96111 14.1334 2.60289 13.9863 2.30867 13.692C2.014 13.3974 1.86667 13.0389 1.86667 12.6167V3.38337C1.86667 2.96114 2.014 2.6027 2.30867 2.30803C2.60289 2.01381 2.96111 1.8667 3.38334 1.8667H7.23334C7.45556 1.8667 7.63889 1.93892 7.78334 2.08337C7.92778 2.22781 8 2.40559 8 2.6167C8 2.83892 7.92778 3.02225 7.78334 3.1667C7.63889 3.31114 7.45556 3.38337 7.23334 3.38337H3.38334V12.6167H12.6167V8.7667C12.6167 8.54448 12.6889 8.36114 12.8333 8.2167C12.9778 8.07225 13.1611 8.00003 13.3833 8.00003C13.5944 8.00003 13.7722 8.07225 13.9167 8.2167C14.0611 8.36114 14.1333 8.54448 14.1333 8.7667V12.6167C14.1333 13.0389 13.9862 13.3974 13.692 13.692C13.3973 13.9863 13.0389 14.1334 12.6167 14.1334H3.38334ZM6.06667 9.93337C5.92222 9.80003 5.85 9.62781 5.85 9.4167C5.85 9.20559 5.92222 9.02781 6.06667 8.88337L11.5667 3.38337H10.1C9.87778 3.38337 9.69445 3.31114 9.55 3.1667C9.40556 3.02225 9.33333 2.83892 9.33333 2.6167C9.33333 2.40559 9.40556 2.22781 9.55 2.08337C9.69445 1.93892 9.87778 1.8667 10.1 1.8667H13.3833C13.5944 1.8667 13.7722 1.93892 13.9167 2.08337C14.0611 2.22781 14.1333 2.40559 14.1333 2.6167V5.90003C14.1333 6.12225 14.0611 6.30559 13.9167 6.45003C13.7722 6.59448 13.5944 6.6667 13.3833 6.6667C13.1611 6.6667 12.9778 6.59448 12.8333 6.45003C12.6889 6.30559 12.6167 6.12225 12.6167 5.90003V4.43337L7.1 9.95003C6.96667 10.0945 6.79733 10.1667 6.592 10.1667C6.38622 10.1667 6.21111 10.0889 6.06667 9.93337Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M5.075 21.2001C4.44167 21.2001 3.90433 20.9794 3.463 20.538C3.021 20.096 2.8 19.5584 2.8 18.925V5.07505C2.8 4.44172 3.021 3.90405 3.463 3.46205C3.90433 3.02072 4.44167 2.80005 5.075 2.80005H10.85C11.1833 2.80005 11.4583 2.90838 11.675 3.12505C11.8917 3.34172 12 3.60838 12 3.92505C12 4.25838 11.8917 4.53338 11.675 4.75005C11.4583 4.96672 11.1833 5.07505 10.85 5.07505H5.075V18.925H18.925V13.15C18.925 12.8167 19.0333 12.5417 19.25 12.325C19.4667 12.1084 19.7417 12 20.075 12C20.3917 12 20.6583 12.1084 20.875 12.325C21.0917 12.5417 21.2 12.8167 21.2 13.15V18.925C21.2 19.5584 20.9793 20.096 20.538 20.538C20.096 20.9794 19.5583 21.2001 18.925 21.2001H5.075ZM9.1 14.9C8.88333 14.7 8.775 14.4417 8.775 14.125C8.775 13.8084 8.88333 13.5417 9.1 13.325L17.35 5.07505H15.15C14.8167 5.07505 14.5417 4.96672 14.325 4.75005C14.1083 4.53338 14 4.25838 14 3.92505C14 3.60838 14.1083 3.34172 14.325 3.12505C14.5417 2.90838 14.8167 2.80005 15.15 2.80005H20.075C20.3917 2.80005 20.6583 2.90838 20.875 3.12505C21.0917 3.34172 21.2 3.60838 21.2 3.92505V8.85005C21.2 9.18338 21.0917 9.45838 20.875 9.67505C20.6583 9.89172 20.3917 10 20.075 10C19.7417 10 19.4667 9.89172 19.25 9.67505C19.0333 9.45838 18.925 9.18338 18.925 8.85005V6.65005L10.65 14.925C10.45 15.1417 10.196 15.25 9.888 15.25C9.57933 15.25 9.31667 15.1334 9.1 14.9Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M5.92084 24.7334C5.18195 24.7334 4.55506 24.4759 4.04017 23.9611C3.5245 23.4454 3.26667 22.8181 3.26667 22.0792V5.92089C3.26667 5.182 3.5245 4.55472 4.04017 4.03906C4.55506 3.52417 5.18195 3.26672 5.92084 3.26672H12.6583C13.0472 3.26672 13.3681 3.39311 13.6208 3.64589C13.8736 3.89867 14 4.20978 14 4.57922C14 4.96811 13.8736 5.28895 13.6208 5.54172C13.3681 5.7945 13.0472 5.92089 12.6583 5.92089H5.92084V22.0792H22.0792V15.3417C22.0792 14.9528 22.2056 14.632 22.4583 14.3792C22.7111 14.1264 23.032 14.0001 23.4208 14.0001C23.7903 14.0001 24.1014 14.1264 24.3542 14.3792C24.607 14.632 24.7333 14.9528 24.7333 15.3417V22.0792C24.7333 22.8181 24.4759 23.4454 23.961 23.9611C23.4453 24.4759 22.8181 24.7334 22.0792 24.7334H5.92084ZM10.6167 17.3834C10.3639 17.1501 10.2375 16.8487 10.2375 16.4792C10.2375 16.1098 10.3639 15.7987 10.6167 15.5459L20.2417 5.92089H17.675C17.2861 5.92089 16.9653 5.7945 16.7125 5.54172C16.4597 5.28895 16.3333 4.96811 16.3333 4.57922C16.3333 4.20978 16.4597 3.89867 16.7125 3.64589C16.9653 3.39311 17.2861 3.26672 17.675 3.26672H23.4208C23.7903 3.26672 24.1014 3.39311 24.3542 3.64589C24.607 3.89867 24.7333 4.20978 24.7333 4.57922V10.3251C24.7333 10.7139 24.607 11.0348 24.3542 11.2876C24.1014 11.5403 23.7903 11.6667 23.4208 11.6667C23.032 11.6667 22.7111 11.5403 22.4583 11.2876C22.2056 11.0348 22.0792 10.7139 22.0792 10.3251V7.75839L12.425 17.4126C12.1917 17.6653 11.8953 17.7917 11.536 17.7917C11.1759 17.7917 10.8694 17.6556 10.6167 17.3834Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-open-in-new"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

package/dist/collection/components/swirl-icon/icons/swirl-icon-people-alt.js

@@ -0,0 +1,61 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconPeopleAlt {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.1133 8.75329C12.0267 9.37329 12.6667 10.2133 12.6667 11.3333V13.3333H14.6667C15.0333 13.3333 15.3333 13.0333 15.3333 12.6666V11.3333C15.3333 9.87996 12.9533 9.01996 11.1133 8.75329Z", fill: "currentColor" }),
+        h("path", { d: "M5.99999 7.99996C7.47275 7.99996 8.66666 6.80605 8.66666 5.33329C8.66666 3.86053 7.47275 2.66663 5.99999 2.66663C4.52723 2.66663 3.33332 3.86053 3.33332 5.33329C3.33332 6.80605 4.52723 7.99996 5.99999 7.99996Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9.99999 7.99996C11.4733 7.99996 12.6667 6.80663 12.6667 5.33329C12.6667 3.85996 11.4733 2.66663 9.99999 2.66663C9.68666 2.66663 9.39332 2.73329 9.11332 2.82663C9.66666 3.51329 9.99999 4.38663 9.99999 5.33329C9.99999 6.27996 9.66666 7.15329 9.11332 7.83996C9.39332 7.93329 9.68666 7.99996 9.99999 7.99996Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5.99999 8.66663C4.21999 8.66663 0.666656 9.55996 0.666656 11.3333V12.6666C0.666656 13.0333 0.966656 13.3333 1.33332 13.3333H10.6667C11.0333 13.3333 11.3333 13.0333 11.3333 12.6666V11.3333C11.3333 9.55996 7.77999 8.66663 5.99999 8.66663Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M16.67 13.13C18.04 14.06 19 15.32 19 17V20H22C22.55 20 23 19.55 23 19V17C23 14.82 19.43 13.53 16.67 13.13Z", fill: "currentColor" }),
+        h("path", { d: "M9 12C11.2091 12 13 10.2091 13 8C13 5.79086 11.2091 4 9 4C6.79086 4 5 5.79086 5 8C5 10.2091 6.79086 12 9 12Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M15 12C17.21 12 19 10.21 19 8C19 5.79 17.21 4 15 4C14.53 4 14.09 4.1 13.67 4.24C14.5 5.27 15 6.58 15 8C15 9.42 14.5 10.73 13.67 11.76C14.09 11.9 14.53 12 15 12Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9 13C6.33 13 1 14.34 1 17V19C1 19.55 1.45 20 2 20H16C16.55 20 17 19.55 17 19V17C17 14.34 11.67 13 9 13Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M19.4483 15.3183C21.0467 16.4033 22.1667 17.8733 22.1667 19.8333V23.3333H25.6667C26.3083 23.3333 26.8333 22.8083 26.8333 22.1666V19.8333C26.8333 17.29 22.6683 15.785 19.4483 15.3183Z", fill: "currentColor" }),
+        h("path", { d: "M10.5 14C13.0773 14 15.1667 11.9106 15.1667 9.33329C15.1667 6.75596 13.0773 4.66663 10.5 4.66663C7.92266 4.66663 5.83332 6.75596 5.83332 9.33329C5.83332 11.9106 7.92266 14 10.5 14Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17.5 14C20.0783 14 22.1667 11.9116 22.1667 9.33329C22.1667 6.75496 20.0783 4.66663 17.5 4.66663C16.9517 4.66663 16.4383 4.78329 15.9483 4.94663C16.9167 6.14829 17.5 7.67663 17.5 9.33329C17.5 10.99 16.9167 12.5183 15.9483 13.72C16.4383 13.8833 16.9517 14 17.5 14Z", fill: "currentColor" }),
+        h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M10.5 15.1666C7.38499 15.1666 1.16666 16.73 1.16666 19.8333V22.1666C1.16666 22.8083 1.69166 23.3333 2.33332 23.3333H18.6667C19.3083 23.3333 19.8333 22.8083 19.8333 22.1666V19.8333C19.8333 16.73 13.615 15.1666 10.5 15.1666Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-people-alt"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconPersonOff {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M6.23708 3.41005C6.71041 2.67672 7.53708 2.19672 8.47042 2.19672C9.94375 2.19672 11.1371 3.39005 11.1371 4.86338C11.1371 5.79672 10.6571 6.62338 9.92375 7.09672L6.23708 3.41005ZM13.8037 10.9767C13.7904 10.2434 13.3837 9.57005 12.7304 9.23005C12.3704 9.04338 11.9771 8.87005 11.5504 8.72338L13.8037 10.9767ZM14.1304 13.19L2.81042 1.87005C2.55042 1.61005 2.13042 1.61005 1.87042 1.87005C1.61042 2.13005 1.61042 2.55005 1.87042 2.81005L7.32375 8.26338C6.11042 8.41672 5.05042 8.79672 4.19042 9.23672C3.53708 9.58338 3.13708 10.27 3.13708 11.01V12.8634H11.9171L13.1837 14.13C13.4437 14.39 13.8637 14.39 14.1237 14.13C14.3904 13.87 14.3904 13.45 14.1304 13.19Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M9.35562 5.11495C10.0656 4.01495 11.3056 3.29495 12.7056 3.29495C14.9156 3.29495 16.7056 5.08495 16.7056 7.29495C16.7056 8.69495 15.9856 9.93495 14.8856 10.645L9.35562 5.11495ZM20.7056 16.465C20.6856 15.365 20.0756 14.355 19.0956 13.845C18.5556 13.565 17.9656 13.305 17.3256 13.085L20.7056 16.465ZM21.1956 19.785L4.21562 2.80495C3.82562 2.41495 3.19562 2.41495 2.80562 2.80495C2.41562 3.19495 2.41562 3.82495 2.80562 4.21495L10.9856 12.395C9.16562 12.625 7.57562 13.195 6.28562 13.855C5.30562 14.375 4.70562 15.405 4.70562 16.515V19.295H17.8756L19.7756 21.195C20.1656 21.5849 20.7956 21.5849 21.1856 21.195C21.5856 20.805 21.5856 20.1749 21.1956 19.785Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M10.9149 5.96752C11.7432 4.68419 13.1899 3.84419 14.8232 3.84419C17.4016 3.84419 19.4899 5.93252 19.4899 8.51086C19.4899 10.1442 18.6499 11.5909 17.3666 12.4192L10.9149 5.96752ZM24.1566 19.2092C24.1332 17.9259 23.4216 16.7475 22.2782 16.1525C21.6482 15.8259 20.9599 15.5225 20.2132 15.2659L24.1566 19.2092ZM24.7282 23.0825L4.91823 3.27252C4.46323 2.81752 3.72823 2.81752 3.27323 3.27252C2.81823 3.72752 2.81823 4.46252 3.27323 4.91752L12.8166 14.4609C10.6932 14.7292 8.83823 15.3942 7.33323 16.1642C6.18989 16.7709 5.48989 17.9725 5.48989 19.2675V22.5109H20.8549L23.0716 24.7275C23.5266 25.1825 24.2616 25.1825 24.7166 24.7275C25.1832 24.2725 25.1832 23.5375 24.7282 23.0825Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-person-off"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconPerson {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M7.99999 8.00002C9.47332 8.00002 10.6667 6.80669 10.6667 5.33335C10.6667 3.86002 9.47332 2.66669 7.99999 2.66669C6.52666 2.66669 5.33332 3.86002 5.33332 5.33335C5.33332 6.80669 6.52666 8.00002 7.99999 8.00002ZM7.99999 9.33335C6.21999 9.33335 2.66666 10.2267 2.66666 12V12.6667C2.66666 13.0334 2.96666 13.3334 3.33332 13.3334H12.6667C13.0333 13.3334 13.3333 13.0334 13.3333 12.6667V12C13.3333 10.2267 9.77999 9.33335 7.99999 9.33335Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M12 12C14.21 12 16 10.21 16 8C16 5.79 14.21 4 12 4C9.79 4 8 5.79 8 8C8 10.21 9.79 12 12 12ZM12 14C9.33 14 4 15.34 4 18V19C4 19.55 4.45 20 5 20H19C19.55 20 20 19.55 20 19V18C20 15.34 14.67 14 12 14Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M14 14C16.5783 14 18.6667 11.9117 18.6667 9.33335C18.6667 6.75502 16.5783 4.66669 14 4.66669C11.4217 4.66669 9.33332 6.75502 9.33332 9.33335C9.33332 11.9117 11.4217 14 14 14ZM14 16.3334C10.885 16.3334 4.66666 17.8967 4.66666 21V22.1667C4.66666 22.8084 5.19166 23.3334 5.83332 23.3334H22.1667C22.8083 23.3334 23.3333 22.8084 23.3333 22.1667V21C23.3333 17.8967 17.115 16.3334 14 16.3334Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-person"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}

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

@@ -0,0 +1,52 @@
+// DO NOT EDIT. THIS FILE GETS GENERATED VIA "yarn generate".
+import { Component, Fragment, h, Prop } from "@stencil/core";
+import classnames from "classnames";
+export class SwirlIconPhone {
+  constructor() {
+    this.size = 24;
+  }
+  render() {
+    const viewBoxSize = this.size === 20 ? 24 : this.size;
+    const className = classnames("swirl-icon", `swirl-icon--size-${this.size}`);
+    return (h("svg", { class: className, fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" },
+      this.size === 16 && (h(Fragment, null,
+        h("path", { d: "M12.8145 10.1788L11.1212 9.98545C10.7145 9.93878 10.3145 10.0788 10.0279 10.3654L8.8012 11.5921C6.91453 10.6321 5.36787 9.09211 4.40787 7.19878L5.6412 5.96545C5.92787 5.67878 6.06787 5.27878 6.0212 4.87212L5.82787 3.19212C5.74787 2.51878 5.1812 2.01212 4.5012 2.01212H3.34787C2.59453 2.01212 1.96787 2.63878 2.01453 3.39212C2.36787 9.08545 6.9212 13.6321 12.6079 13.9854C13.3612 14.0321 13.9879 13.4054 13.9879 12.6521V11.4988C13.9945 10.8254 13.4879 10.2588 12.8145 10.1788Z", fill: "currentColor" }))),
+      (this.size === 20 || this.size === 24) && (h(Fragment, null,
+        h("path", { d: "M19.2218 15.2682L16.6818 14.9782C16.0718 14.9082 15.4718 15.1182 15.0418 15.5482L13.2018 17.3882C10.3718 15.9482 8.0518 13.6382 6.6118 10.7982L8.4618 8.94816C8.8918 8.51816 9.1018 7.91816 9.0318 7.30816L8.7418 4.78816C8.6218 3.77816 7.7718 3.01816 6.7518 3.01816H5.0218C3.8918 3.01816 2.9518 3.95816 3.0218 5.08816C3.5518 13.6282 10.3818 20.4482 18.9118 20.9782C20.0418 21.0482 20.9818 20.1082 20.9818 18.9782V17.2482C20.9918 16.2382 20.2318 15.3882 19.2218 15.2682Z", fill: "currentColor" }))),
+      this.size === 28 && (h(Fragment, null,
+        h("path", { d: "M22.4254 17.8129L19.4621 17.4745C18.7504 17.3929 18.0504 17.6379 17.5488 18.1395L15.4021 20.2862C12.1004 18.6062 9.39377 15.9112 7.71377 12.5979L9.8721 10.4395C10.3738 9.93786 10.6188 9.23786 10.5371 8.52619L10.1988 5.58619C10.0588 4.40786 9.0671 3.52119 7.8771 3.52119H5.85877C4.54043 3.52119 3.44377 4.61786 3.52543 5.93619C4.14377 15.8995 12.1121 23.8562 22.0638 24.4745C23.3821 24.5562 24.4788 23.4595 24.4788 22.1412V20.1229C24.4904 18.9445 23.6038 17.9529 22.4254 17.8129Z", fill: "currentColor" })))));
+  }
+  static get is() { return "swirl-icon-phone"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["../swirl-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "SwirlIconSize",
+        "resolved": "16 | 20 | 24 | 28",
+        "references": {
+          "SwirlIconSize": {
+            "location": "import",
+            "path": "../swirl-icon.types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "24"
+    }
+  }; }
+}