npm - @getflip/swirl-components - Versions diffs - 0.197.1 → 0.199.0 - Mend

@getflip/swirl-components 0.197.1 → 0.199.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2776) hide show

package/dist/collection/components/swirl-icon/icons/swirl-icon-load.js CHANGED Viewed

@@ -2,77 +2,79 @@
 import { Fragment, h } from "@stencil/core";
 import classnames from "classnames";
 export class SwirlIconLoad {
-  constructor() {
-    this.color = undefined;
-    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", { "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, null, h("path", { d: "M4.00002 8.03317C4.00002 8.53317 4.09446 9.01928 4.28335 9.4915C4.47224 9.96373 4.76669 10.3998 5.16669 10.7998L5.33335 10.9665V9.99984C5.33335 9.81095 5.39724 9.65262 5.52502 9.52484C5.6528 9.39706 5.81113 9.33317 6.00002 9.33317C6.18891 9.33317 6.34724 9.39706 6.47502 9.52484C6.6028 9.65262 6.66669 9.81095 6.66669 9.99984V12.6665C6.66669 12.8554 6.6028 13.0137 6.47502 13.1415C6.34724 13.2693 6.18891 13.3332 6.00002 13.3332H3.33335C3.14446 13.3332 2.98613 13.2693 2.85835 13.1415C2.73058 13.0137 2.66669 12.8554 2.66669 12.6665C2.66669 12.4776 2.73058 12.3193 2.85835 12.1915C2.98613 12.0637 3.14446 11.9998 3.33335 11.9998H4.50002L4.23335 11.7665C3.65558 11.2554 3.25002 10.6721 3.01669 10.0165C2.78335 9.36095 2.66669 8.69984 2.66669 8.03317C2.66669 6.98873 2.93335 6.0415 3.46669 5.1915C4.00002 4.3415 4.71669 3.68873 5.61669 3.23317C5.77224 3.14428 5.93613 3.13873 6.10835 3.2165C6.28058 3.29428 6.39447 3.42206 6.45002 3.59984C6.50558 3.7665 6.5028 3.93317 6.44169 4.09984C6.38058 4.2665 6.27224 4.39428 6.11669 4.48317C5.47224 4.83873 4.95835 5.33039 4.57502 5.95817C4.19169 6.58595 4.00002 7.27762 4.00002 8.03317ZM12 7.9665C12 7.4665 11.9056 6.98039 11.7167 6.50817C11.5278 6.03595 11.2334 5.59984 10.8334 5.19984L10.6667 5.03317V5.99984C10.6667 6.18873 10.6028 6.34706 10.475 6.47484C10.3472 6.60262 10.1889 6.6665 10 6.6665C9.81113 6.6665 9.6528 6.60262 9.52502 6.47484C9.39724 6.34706 9.33335 6.18873 9.33335 5.99984V3.33317C9.33335 3.14428 9.39724 2.98595 9.52502 2.85817C9.6528 2.73039 9.81113 2.6665 10 2.6665H12.6667C12.8556 2.6665 13.0139 2.73039 13.1417 2.85817C13.2695 2.98595 13.3334 3.14428 13.3334 3.33317C13.3334 3.52206 13.2695 3.68039 13.1417 3.80817C13.0139 3.93595 12.8556 3.99984 12.6667 3.99984H11.5L11.7667 4.23317C12.3111 4.77762 12.7084 5.36928 12.9584 6.00817C13.2084 6.64706 13.3334 7.29984 13.3334 7.9665C13.3334 9.01095 13.0667 9.95817 12.5334 10.8082C12 11.6582 11.2834 12.3109 10.3834 12.7665C10.2278 12.8554 10.0639 12.8609 9.89169 12.7832C9.71947 12.7054 9.60558 12.5776 9.55002 12.3998C9.49446 12.2332 9.49724 12.0665 9.55835 11.8998C9.61947 11.7332 9.7278 11.6054 9.88335 11.5165C10.5278 11.1609 11.0417 10.6693 11.425 10.0415C11.8084 9.41373 12 8.72206 12 7.9665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, null, h("path", { d: "M6 12.05C6 12.8 6.14167 13.5292 6.425 14.2375C6.70833 14.9458 7.15 15.6 7.75 16.2L8 16.45V15C8 14.7167 8.09583 14.4792 8.2875 14.2875C8.47917 14.0958 8.71667 14 9 14C9.28333 14 9.52083 14.0958 9.7125 14.2875C9.90417 14.4792 10 14.7167 10 15V19C10 19.2833 9.90417 19.5208 9.7125 19.7125C9.52083 19.9042 9.28333 20 9 20H5C4.71667 20 4.47917 19.9042 4.2875 19.7125C4.09583 19.5208 4 19.2833 4 19C4 18.7167 4.09583 18.4792 4.2875 18.2875C4.47917 18.0958 4.71667 18 5 18H6.75L6.35 17.65C5.48333 16.8833 4.875 16.0083 4.525 15.025C4.175 14.0417 4 13.05 4 12.05C4 10.4833 4.4 9.0625 5.2 7.7875C6 6.5125 7.075 5.53333 8.425 4.85C8.65833 4.71667 8.90417 4.70833 9.1625 4.825C9.42083 4.94167 9.59167 5.13333 9.675 5.4C9.75833 5.65 9.75417 5.9 9.6625 6.15C9.57083 6.4 9.40833 6.59167 9.175 6.725C8.20833 7.25833 7.4375 7.99583 6.8625 8.9375C6.2875 9.87917 6 10.9167 6 12.05ZM18 11.95C18 11.2 17.8583 10.4708 17.575 9.7625C17.2917 9.05417 16.85 8.4 16.25 7.8L16 7.55V9C16 9.28333 15.9042 9.52083 15.7125 9.7125C15.5208 9.90417 15.2833 10 15 10C14.7167 10 14.4792 9.90417 14.2875 9.7125C14.0958 9.52083 14 9.28333 14 9V5C14 4.71667 14.0958 4.47917 14.2875 4.2875C14.4792 4.09583 14.7167 4 15 4H19C19.2833 4 19.5208 4.09583 19.7125 4.2875C19.9042 4.47917 20 4.71667 20 5C20 5.28333 19.9042 5.52083 19.7125 5.7125C19.5208 5.90417 19.2833 6 19 6H17.25L17.65 6.35C18.4667 7.16667 19.0625 8.05417 19.4375 9.0125C19.8125 9.97083 20 10.95 20 11.95C20 13.5167 19.6 14.9375 18.8 16.2125C18 17.4875 16.925 18.4667 15.575 19.15C15.3417 19.2833 15.0958 19.2917 14.8375 19.175C14.5792 19.0583 14.4083 18.8667 14.325 18.6C14.2417 18.35 14.2458 18.1 14.3375 17.85C14.4292 17.6 14.5917 17.4083 14.825 17.275C15.7917 16.7417 16.5625 16.0042 17.1375 15.0625C17.7125 14.1208 18 13.0833 18 11.95Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M7.00002 14.0582C7.00002 14.9332 7.1653 15.7839 7.49585 16.6103C7.82641 17.4366 8.34169 18.1998 9.04169 18.8998L9.33335 19.1915V17.4998C9.33335 17.1693 9.44516 16.8922 9.66877 16.6686C9.89238 16.445 10.1695 16.3332 10.5 16.3332C10.8306 16.3332 11.1077 16.445 11.3313 16.6686C11.5549 16.8922 11.6667 17.1693 11.6667 17.4998V22.1665C11.6667 22.4971 11.5549 22.7741 11.3313 22.9978C11.1077 23.2214 10.8306 23.3332 10.5 23.3332H5.83335C5.5028 23.3332 5.22571 23.2214 5.0021 22.9978C4.77849 22.7741 4.66669 22.4971 4.66669 22.1665C4.66669 21.8359 4.77849 21.5589 5.0021 21.3353C5.22571 21.1116 5.5028 20.9998 5.83335 20.9998H7.87502L7.40835 20.5915C6.39724 19.6971 5.68752 18.6762 5.27919 17.529C4.87085 16.3818 4.66669 15.2248 4.66669 14.0582C4.66669 12.2304 5.13335 10.5728 6.06669 9.08525C7.00002 7.59775 8.25419 6.45539 9.82919 5.65817C10.1014 5.50262 10.3882 5.49289 10.6896 5.629C10.991 5.76511 11.1903 5.98873 11.2875 6.29984C11.3847 6.5915 11.3799 6.88317 11.2729 7.17484C11.166 7.4665 10.9764 7.69012 10.7042 7.84567C9.57641 8.46789 8.6771 9.32831 8.00627 10.4269C7.33544 11.5255 7.00002 12.7359 7.00002 14.0582ZM21 13.9415C21 13.0665 20.8347 12.2158 20.5042 11.3894C20.1736 10.563 19.6584 9.79984 18.9584 9.09984L18.6667 8.80817V10.4998C18.6667 10.8304 18.5549 11.1075 18.3313 11.3311C18.1077 11.5547 17.8306 11.6665 17.5 11.6665C17.1695 11.6665 16.8924 11.5547 16.6688 11.3311C16.4452 11.1075 16.3334 10.8304 16.3334 10.4998V5.83317C16.3334 5.50261 16.4452 5.22553 16.6688 5.00192C16.8924 4.77831 17.1695 4.6665 17.5 4.6665H22.1667C22.4972 4.6665 22.7743 4.77831 22.9979 5.00192C23.2215 5.22553 23.3334 5.50261 23.3334 5.83317C23.3334 6.16373 23.2215 6.44081 22.9979 6.66442C22.7743 6.88803 22.4972 6.99984 22.1667 6.99984H20.125L20.5917 7.40817C21.5445 8.36095 22.2396 9.39637 22.6771 10.5144C23.1146 11.6325 23.3334 12.7748 23.3334 13.9415C23.3334 15.7693 22.8667 17.4269 21.9334 18.9144C21 20.4019 19.7459 21.5443 18.1709 22.3415C17.8986 22.4971 17.6118 22.5068 17.3104 22.3707C17.009 22.2346 16.8097 22.0109 16.7125 21.6998C16.6153 21.4082 16.6202 21.1165 16.7271 20.8248C16.834 20.5332 17.0236 20.3096 17.2959 20.154C18.4236 19.5318 19.3229 18.6714 19.9938 17.5728C20.6646 16.4741 21 15.2637 21 13.9415Z", fill: "currentColor" })))));
-  }
-  static get is() { return "swirl-icon-load"; }
-  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",
-        "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"
+    constructor() {
+        this.color = undefined;
+        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: '9e66e9b5c2df67c813393a5827dfcc66b5f4542e', "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: '658092a55e9b4554e2998eb87c97f7a2c930c8ab' }, h("path", { key: '903bc05eff0497a935a9e620a5b4a194746fd7c0', d: "M4.00002 8.03317C4.00002 8.53317 4.09446 9.01928 4.28335 9.4915C4.47224 9.96373 4.76669 10.3998 5.16669 10.7998L5.33335 10.9665V9.99984C5.33335 9.81095 5.39724 9.65262 5.52502 9.52484C5.6528 9.39706 5.81113 9.33317 6.00002 9.33317C6.18891 9.33317 6.34724 9.39706 6.47502 9.52484C6.6028 9.65262 6.66669 9.81095 6.66669 9.99984V12.6665C6.66669 12.8554 6.6028 13.0137 6.47502 13.1415C6.34724 13.2693 6.18891 13.3332 6.00002 13.3332H3.33335C3.14446 13.3332 2.98613 13.2693 2.85835 13.1415C2.73058 13.0137 2.66669 12.8554 2.66669 12.6665C2.66669 12.4776 2.73058 12.3193 2.85835 12.1915C2.98613 12.0637 3.14446 11.9998 3.33335 11.9998H4.50002L4.23335 11.7665C3.65558 11.2554 3.25002 10.6721 3.01669 10.0165C2.78335 9.36095 2.66669 8.69984 2.66669 8.03317C2.66669 6.98873 2.93335 6.0415 3.46669 5.1915C4.00002 4.3415 4.71669 3.68873 5.61669 3.23317C5.77224 3.14428 5.93613 3.13873 6.10835 3.2165C6.28058 3.29428 6.39447 3.42206 6.45002 3.59984C6.50558 3.7665 6.5028 3.93317 6.44169 4.09984C6.38058 4.2665 6.27224 4.39428 6.11669 4.48317C5.47224 4.83873 4.95835 5.33039 4.57502 5.95817C4.19169 6.58595 4.00002 7.27762 4.00002 8.03317ZM12 7.9665C12 7.4665 11.9056 6.98039 11.7167 6.50817C11.5278 6.03595 11.2334 5.59984 10.8334 5.19984L10.6667 5.03317V5.99984C10.6667 6.18873 10.6028 6.34706 10.475 6.47484C10.3472 6.60262 10.1889 6.6665 10 6.6665C9.81113 6.6665 9.6528 6.60262 9.52502 6.47484C9.39724 6.34706 9.33335 6.18873 9.33335 5.99984V3.33317C9.33335 3.14428 9.39724 2.98595 9.52502 2.85817C9.6528 2.73039 9.81113 2.6665 10 2.6665H12.6667C12.8556 2.6665 13.0139 2.73039 13.1417 2.85817C13.2695 2.98595 13.3334 3.14428 13.3334 3.33317C13.3334 3.52206 13.2695 3.68039 13.1417 3.80817C13.0139 3.93595 12.8556 3.99984 12.6667 3.99984H11.5L11.7667 4.23317C12.3111 4.77762 12.7084 5.36928 12.9584 6.00817C13.2084 6.64706 13.3334 7.29984 13.3334 7.9665C13.3334 9.01095 13.0667 9.95817 12.5334 10.8082C12 11.6582 11.2834 12.3109 10.3834 12.7665C10.2278 12.8554 10.0639 12.8609 9.89169 12.7832C9.71947 12.7054 9.60558 12.5776 9.55002 12.3998C9.49446 12.2332 9.49724 12.0665 9.55835 11.8998C9.61947 11.7332 9.7278 11.6054 9.88335 11.5165C10.5278 11.1609 11.0417 10.6693 11.425 10.0415C11.8084 9.41373 12 8.72206 12 7.9665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: 'f3f2d02b0d3f0afdbc1d7041e966dcabca664633' }, h("path", { key: '0ec9fed4dbd2b645dae0b1a3a8349adfc1e6df85', d: "M6 12.05C6 12.8 6.14167 13.5292 6.425 14.2375C6.70833 14.9458 7.15 15.6 7.75 16.2L8 16.45V15C8 14.7167 8.09583 14.4792 8.2875 14.2875C8.47917 14.0958 8.71667 14 9 14C9.28333 14 9.52083 14.0958 9.7125 14.2875C9.90417 14.4792 10 14.7167 10 15V19C10 19.2833 9.90417 19.5208 9.7125 19.7125C9.52083 19.9042 9.28333 20 9 20H5C4.71667 20 4.47917 19.9042 4.2875 19.7125C4.09583 19.5208 4 19.2833 4 19C4 18.7167 4.09583 18.4792 4.2875 18.2875C4.47917 18.0958 4.71667 18 5 18H6.75L6.35 17.65C5.48333 16.8833 4.875 16.0083 4.525 15.025C4.175 14.0417 4 13.05 4 12.05C4 10.4833 4.4 9.0625 5.2 7.7875C6 6.5125 7.075 5.53333 8.425 4.85C8.65833 4.71667 8.90417 4.70833 9.1625 4.825C9.42083 4.94167 9.59167 5.13333 9.675 5.4C9.75833 5.65 9.75417 5.9 9.6625 6.15C9.57083 6.4 9.40833 6.59167 9.175 6.725C8.20833 7.25833 7.4375 7.99583 6.8625 8.9375C6.2875 9.87917 6 10.9167 6 12.05ZM18 11.95C18 11.2 17.8583 10.4708 17.575 9.7625C17.2917 9.05417 16.85 8.4 16.25 7.8L16 7.55V9C16 9.28333 15.9042 9.52083 15.7125 9.7125C15.5208 9.90417 15.2833 10 15 10C14.7167 10 14.4792 9.90417 14.2875 9.7125C14.0958 9.52083 14 9.28333 14 9V5C14 4.71667 14.0958 4.47917 14.2875 4.2875C14.4792 4.09583 14.7167 4 15 4H19C19.2833 4 19.5208 4.09583 19.7125 4.2875C19.9042 4.47917 20 4.71667 20 5C20 5.28333 19.9042 5.52083 19.7125 5.7125C19.5208 5.90417 19.2833 6 19 6H17.25L17.65 6.35C18.4667 7.16667 19.0625 8.05417 19.4375 9.0125C19.8125 9.97083 20 10.95 20 11.95C20 13.5167 19.6 14.9375 18.8 16.2125C18 17.4875 16.925 18.4667 15.575 19.15C15.3417 19.2833 15.0958 19.2917 14.8375 19.175C14.5792 19.0583 14.4083 18.8667 14.325 18.6C14.2417 18.35 14.2458 18.1 14.3375 17.85C14.4292 17.6 14.5917 17.4083 14.825 17.275C15.7917 16.7417 16.5625 16.0042 17.1375 15.0625C17.7125 14.1208 18 13.0833 18 11.95Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: '0df0f013aefc5490e2ef41b22e1b05d4733b9101' }, h("path", { key: 'bc5c9b485dab83b0c2d862bb9b7e8712fb758917', d: "M7.00002 14.0582C7.00002 14.9332 7.1653 15.7839 7.49585 16.6103C7.82641 17.4366 8.34169 18.1998 9.04169 18.8998L9.33335 19.1915V17.4998C9.33335 17.1693 9.44516 16.8922 9.66877 16.6686C9.89238 16.445 10.1695 16.3332 10.5 16.3332C10.8306 16.3332 11.1077 16.445 11.3313 16.6686C11.5549 16.8922 11.6667 17.1693 11.6667 17.4998V22.1665C11.6667 22.4971 11.5549 22.7741 11.3313 22.9978C11.1077 23.2214 10.8306 23.3332 10.5 23.3332H5.83335C5.5028 23.3332 5.22571 23.2214 5.0021 22.9978C4.77849 22.7741 4.66669 22.4971 4.66669 22.1665C4.66669 21.8359 4.77849 21.5589 5.0021 21.3353C5.22571 21.1116 5.5028 20.9998 5.83335 20.9998H7.87502L7.40835 20.5915C6.39724 19.6971 5.68752 18.6762 5.27919 17.529C4.87085 16.3818 4.66669 15.2248 4.66669 14.0582C4.66669 12.2304 5.13335 10.5728 6.06669 9.08525C7.00002 7.59775 8.25419 6.45539 9.82919 5.65817C10.1014 5.50262 10.3882 5.49289 10.6896 5.629C10.991 5.76511 11.1903 5.98873 11.2875 6.29984C11.3847 6.5915 11.3799 6.88317 11.2729 7.17484C11.166 7.4665 10.9764 7.69012 10.7042 7.84567C9.57641 8.46789 8.6771 9.32831 8.00627 10.4269C7.33544 11.5255 7.00002 12.7359 7.00002 14.0582ZM21 13.9415C21 13.0665 20.8347 12.2158 20.5042 11.3894C20.1736 10.563 19.6584 9.79984 18.9584 9.09984L18.6667 8.80817V10.4998C18.6667 10.8304 18.5549 11.1075 18.3313 11.3311C18.1077 11.5547 17.8306 11.6665 17.5 11.6665C17.1695 11.6665 16.8924 11.5547 16.6688 11.3311C16.4452 11.1075 16.3334 10.8304 16.3334 10.4998V5.83317C16.3334 5.50261 16.4452 5.22553 16.6688 5.00192C16.8924 4.77831 17.1695 4.6665 17.5 4.6665H22.1667C22.4972 4.6665 22.7743 4.77831 22.9979 5.00192C23.2215 5.22553 23.3334 5.50261 23.3334 5.83317C23.3334 6.16373 23.2215 6.44081 22.9979 6.66442C22.7743 6.88803 22.4972 6.99984 22.1667 6.99984H20.125L20.5917 7.40817C21.5445 8.36095 22.2396 9.39637 22.6771 10.5144C23.1146 11.6325 23.3334 12.7748 23.3334 13.9415C23.3334 15.7693 22.8667 17.4269 21.9334 18.9144C21 20.4019 19.7459 21.5443 18.1709 22.3415C17.8986 22.4971 17.6118 22.5068 17.3104 22.3707C17.009 22.2346 16.8097 22.0109 16.7125 21.6998C16.6153 21.4082 16.6202 21.1165 16.7271 20.8248C16.834 20.5332 17.0236 20.3096 17.2959 20.154C18.4236 19.5318 19.3229 18.6714 19.9938 17.5728C20.6646 16.4741 21 15.2637 21 13.9415Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-load"; }
+    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",
+                "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": ""
+                },
+                "attribute": "color",
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "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": ""
+                },
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "24"
             }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color",
-        "reflect": false
-      },
-      "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-lock-open.js CHANGED Viewed

@@ -2,77 +2,79 @@
 import { Fragment, h } from "@stencil/core";
 import classnames from "classnames";
 export class SwirlIconLockOpen {
-  constructor() {
-    this.color = undefined;
-    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", { "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, null, h("path", { d: "M3.99999 5.33317H9.99999V3.99984C9.99999 3.44428 9.80555 2.97206 9.41666 2.58317C9.02777 2.19428 8.55555 1.99984 7.99999 1.99984C7.44443 1.99984 6.97221 2.19428 6.58332 2.58317C6.19443 2.97206 5.99999 3.44428 5.99999 3.99984H4.66666C4.66666 3.07762 4.99166 2.2915 5.64166 1.6415C6.29166 0.991504 7.07777 0.666504 7.99999 0.666504C8.92221 0.666504 9.70832 0.991504 10.3583 1.6415C11.0083 2.2915 11.3333 3.07762 11.3333 3.99984V5.33317H12C12.3667 5.33317 12.6805 5.46373 12.9417 5.72484C13.2028 5.98595 13.3333 6.29984 13.3333 6.6665V13.3332C13.3333 13.6998 13.2028 14.0137 12.9417 14.2748C12.6805 14.5359 12.3667 14.6665 12 14.6665H3.99999C3.63332 14.6665 3.31943 14.5359 3.05832 14.2748C2.79721 14.0137 2.66666 13.6998 2.66666 13.3332V6.6665C2.66666 6.29984 2.79721 5.98595 3.05832 5.72484C3.31943 5.46373 3.63332 5.33317 3.99999 5.33317ZM3.99999 13.3332H12V6.6665H3.99999V13.3332ZM7.99999 11.3332C8.36666 11.3332 8.68055 11.2026 8.94166 10.9415C9.20277 10.6804 9.33332 10.3665 9.33332 9.99984C9.33332 9.63317 9.20277 9.31928 8.94166 9.05817C8.68055 8.79706 8.36666 8.6665 7.99999 8.6665C7.63332 8.6665 7.31943 8.79706 7.05832 9.05817C6.79721 9.31928 6.66666 9.63317 6.66666 9.99984C6.66666 10.3665 6.79721 10.6804 7.05832 10.9415C7.31943 11.2026 7.63332 11.3332 7.99999 11.3332Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, null, h("path", { d: "M6 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6H7C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8ZM6 20H18V10H6V20ZM12 17C12.55 17 13.0208 16.8042 13.4125 16.4125C13.8042 16.0208 14 15.55 14 15C14 14.45 13.8042 13.9792 13.4125 13.5875C13.0208 13.1958 12.55 13 12 13C11.45 13 10.9792 13.1958 10.5875 13.5875C10.1958 13.9792 10 14.45 10 15C10 15.55 10.1958 16.0208 10.5875 16.4125C10.9792 16.8042 11.45 17 12 17Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M6.99999 9.33317H17.5V6.99984C17.5 6.02761 17.1597 5.20123 16.4792 4.52067C15.7986 3.84011 14.9722 3.49984 14 3.49984C13.0278 3.49984 12.2014 3.84011 11.5208 4.52067C10.8403 5.20123 10.5 6.02761 10.5 6.99984H8.16666C8.16666 5.38595 8.73541 4.01025 9.87291 2.87275C11.0104 1.73525 12.3861 1.1665 14 1.1665C15.6139 1.1665 16.9896 1.73525 18.1271 2.87275C19.2646 4.01025 19.8333 5.38595 19.8333 6.99984V9.33317H21C21.6417 9.33317 22.191 9.56164 22.6479 10.0186C23.1049 10.4755 23.3333 11.0248 23.3333 11.6665V23.3332C23.3333 23.9748 23.1049 24.5241 22.6479 24.9811C22.191 25.438 21.6417 25.6665 21 25.6665H6.99999C6.35832 25.6665 5.80902 25.438 5.35207 24.9811C4.89513 24.5241 4.66666 23.9748 4.66666 23.3332V11.6665C4.66666 11.0248 4.89513 10.4755 5.35207 10.0186C5.80902 9.56164 6.35832 9.33317 6.99999 9.33317ZM6.99999 23.3332H21V11.6665H6.99999V23.3332ZM14 19.8332C14.6417 19.8332 15.191 19.6047 15.6479 19.1478C16.1049 18.6908 16.3333 18.1415 16.3333 17.4998C16.3333 16.8582 16.1049 16.3089 15.6479 15.8519C15.191 15.395 14.6417 15.1665 14 15.1665C13.3583 15.1665 12.809 15.395 12.3521 15.8519C11.8951 16.3089 11.6667 16.8582 11.6667 17.4998C11.6667 18.1415 11.8951 18.6908 12.3521 19.1478C12.809 19.6047 13.3583 19.8332 14 19.8332Z", fill: "currentColor" })))));
-  }
-  static get is() { return "swirl-icon-lock-open"; }
-  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",
-        "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"
+    constructor() {
+        this.color = undefined;
+        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: '4c7a3ffcd64914cd1a14587db977dd7698189c3f', "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: 'f2cb0a75e799989e7609ed59dfc5e9ac360cdb1a' }, h("path", { key: '98f52629b85ccf43e6caa837784d7665c87e8037', d: "M3.99999 5.33317H9.99999V3.99984C9.99999 3.44428 9.80555 2.97206 9.41666 2.58317C9.02777 2.19428 8.55555 1.99984 7.99999 1.99984C7.44443 1.99984 6.97221 2.19428 6.58332 2.58317C6.19443 2.97206 5.99999 3.44428 5.99999 3.99984H4.66666C4.66666 3.07762 4.99166 2.2915 5.64166 1.6415C6.29166 0.991504 7.07777 0.666504 7.99999 0.666504C8.92221 0.666504 9.70832 0.991504 10.3583 1.6415C11.0083 2.2915 11.3333 3.07762 11.3333 3.99984V5.33317H12C12.3667 5.33317 12.6805 5.46373 12.9417 5.72484C13.2028 5.98595 13.3333 6.29984 13.3333 6.6665V13.3332C13.3333 13.6998 13.2028 14.0137 12.9417 14.2748C12.6805 14.5359 12.3667 14.6665 12 14.6665H3.99999C3.63332 14.6665 3.31943 14.5359 3.05832 14.2748C2.79721 14.0137 2.66666 13.6998 2.66666 13.3332V6.6665C2.66666 6.29984 2.79721 5.98595 3.05832 5.72484C3.31943 5.46373 3.63332 5.33317 3.99999 5.33317ZM3.99999 13.3332H12V6.6665H3.99999V13.3332ZM7.99999 11.3332C8.36666 11.3332 8.68055 11.2026 8.94166 10.9415C9.20277 10.6804 9.33332 10.3665 9.33332 9.99984C9.33332 9.63317 9.20277 9.31928 8.94166 9.05817C8.68055 8.79706 8.36666 8.6665 7.99999 8.6665C7.63332 8.6665 7.31943 8.79706 7.05832 9.05817C6.79721 9.31928 6.66666 9.63317 6.66666 9.99984C6.66666 10.3665 6.79721 10.6804 7.05832 10.9415C7.31943 11.2026 7.63332 11.3332 7.99999 11.3332Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '3014a1c78821d55b4f1bb82b3d32d797b7ba7f26' }, h("path", { key: '7e1ca0df4aa5a485f6152f1bb433eae8b84f8bcd', d: "M6 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6H7C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8ZM6 20H18V10H6V20ZM12 17C12.55 17 13.0208 16.8042 13.4125 16.4125C13.8042 16.0208 14 15.55 14 15C14 14.45 13.8042 13.9792 13.4125 13.5875C13.0208 13.1958 12.55 13 12 13C11.45 13 10.9792 13.1958 10.5875 13.5875C10.1958 13.9792 10 14.45 10 15C10 15.55 10.1958 16.0208 10.5875 16.4125C10.9792 16.8042 11.45 17 12 17Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: 'ba0e9483030baff7bcd6e464f441d6a6d484385c' }, h("path", { key: '6ef812ce147229b08e68d4a63adfae4e6f56b1f1', d: "M6.99999 9.33317H17.5V6.99984C17.5 6.02761 17.1597 5.20123 16.4792 4.52067C15.7986 3.84011 14.9722 3.49984 14 3.49984C13.0278 3.49984 12.2014 3.84011 11.5208 4.52067C10.8403 5.20123 10.5 6.02761 10.5 6.99984H8.16666C8.16666 5.38595 8.73541 4.01025 9.87291 2.87275C11.0104 1.73525 12.3861 1.1665 14 1.1665C15.6139 1.1665 16.9896 1.73525 18.1271 2.87275C19.2646 4.01025 19.8333 5.38595 19.8333 6.99984V9.33317H21C21.6417 9.33317 22.191 9.56164 22.6479 10.0186C23.1049 10.4755 23.3333 11.0248 23.3333 11.6665V23.3332C23.3333 23.9748 23.1049 24.5241 22.6479 24.9811C22.191 25.438 21.6417 25.6665 21 25.6665H6.99999C6.35832 25.6665 5.80902 25.438 5.35207 24.9811C4.89513 24.5241 4.66666 23.9748 4.66666 23.3332V11.6665C4.66666 11.0248 4.89513 10.4755 5.35207 10.0186C5.80902 9.56164 6.35832 9.33317 6.99999 9.33317ZM6.99999 23.3332H21V11.6665H6.99999V23.3332ZM14 19.8332C14.6417 19.8332 15.191 19.6047 15.6479 19.1478C16.1049 18.6908 16.3333 18.1415 16.3333 17.4998C16.3333 16.8582 16.1049 16.3089 15.6479 15.8519C15.191 15.395 14.6417 15.1665 14 15.1665C13.3583 15.1665 12.809 15.395 12.3521 15.8519C11.8951 16.3089 11.6667 16.8582 11.6667 17.4998C11.6667 18.1415 11.8951 18.6908 12.3521 19.1478C12.809 19.6047 13.3583 19.8332 14 19.8332Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-lock-open"; }
+    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",
+                "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": ""
+                },
+                "attribute": "color",
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "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": ""
+                },
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "24"
             }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color",
-        "reflect": false
-      },
-      "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-lock-person.js CHANGED Viewed

@@ -2,77 +2,79 @@
 import { Fragment, h } from "@stencil/core";
 import classnames from "classnames";
 export class SwirlIconLockPerson {
-  constructor() {
-    this.color = undefined;
-    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", { "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, null, h("path", { d: "M12 11.9998C12.2777 11.9998 12.5138 11.9026 12.7083 11.7082C12.9027 11.5137 13 11.2776 13 10.9998C13 10.7221 12.9027 10.4859 12.7083 10.2915C12.5138 10.0971 12.2777 9.99984 12 9.99984C11.7222 9.99984 11.4861 10.0971 11.2916 10.2915C11.0972 10.4859 11 10.7221 11 10.9998C11 11.2776 11.0972 11.5137 11.2916 11.7082C11.4861 11.9026 11.7222 11.9998 12 11.9998ZM12 13.9998C12.3333 13.9998 12.6444 13.9221 12.9333 13.7665C13.2222 13.6109 13.4611 13.3943 13.65 13.1165C13.3944 12.9609 13.1277 12.8471 12.85 12.7748C12.5722 12.7026 12.2888 12.6665 12 12.6665C11.7111 12.6665 11.4277 12.7026 11.15 12.7748C10.8722 12.8471 10.6055 12.9609 10.35 13.1165C10.5388 13.3943 10.7777 13.6109 11.0666 13.7665C11.3555 13.9221 11.6666 13.9998 12 13.9998ZM5.99996 5.33317H9.99996V3.99984C9.99996 3.44428 9.80552 2.97206 9.41663 2.58317C9.02774 2.19428 8.55552 1.99984 7.99996 1.99984C7.4444 1.99984 6.97218 2.19428 6.58329 2.58317C6.1944 2.97206 5.99996 3.44428 5.99996 3.99984V5.33317ZM8.16663 14.6665H3.99996C3.63329 14.6665 3.3194 14.5359 3.05829 14.2748C2.79718 14.0137 2.66663 13.6998 2.66663 13.3332V6.6665C2.66663 6.29984 2.79718 5.98595 3.05829 5.72484C3.3194 5.46373 3.63329 5.33317 3.99996 5.33317H4.66663V3.99984C4.66663 3.07762 4.99163 2.2915 5.64163 1.6415C6.29163 0.991504 7.07774 0.666504 7.99996 0.666504C8.92218 0.666504 9.70829 0.991504 10.3583 1.6415C11.0083 2.2915 11.3333 3.07762 11.3333 3.99984V5.33317H12C12.3666 5.33317 12.6805 5.46373 12.9416 5.72484C13.2027 5.98595 13.3333 6.29984 13.3333 6.6665V7.53317C13.1333 7.4665 12.925 7.4165 12.7083 7.38317C12.4916 7.34984 12.2555 7.33317 12 7.33317V6.6665H3.99996V13.3332H7.53329C7.62218 13.5998 7.71107 13.8304 7.79996 14.0248C7.88885 14.2193 8.01107 14.4332 8.16663 14.6665ZM12 15.3332C11.0777 15.3332 10.2916 15.0082 9.64163 14.3582C8.99163 13.7082 8.66663 12.9221 8.66663 11.9998C8.66663 11.0776 8.99163 10.2915 9.64163 9.6415C10.2916 8.9915 11.0777 8.6665 12 8.6665C12.9222 8.6665 13.7083 8.9915 14.3583 9.6415C15.0083 10.2915 15.3333 11.0776 15.3333 11.9998C15.3333 12.9221 15.0083 13.7082 14.3583 14.3582C13.7083 15.0082 12.9222 15.3332 12 15.3332Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, null, h("path", { d: "M18 18C18.4167 18 18.7708 17.8542 19.0625 17.5625C19.3542 17.2708 19.5 16.9167 19.5 16.5C19.5 16.0833 19.3542 15.7292 19.0625 15.4375C18.7708 15.1458 18.4167 15 18 15C17.5833 15 17.2292 15.1458 16.9375 15.4375C16.6458 15.7292 16.5 16.0833 16.5 16.5C16.5 16.9167 16.6458 17.2708 16.9375 17.5625C17.2292 17.8542 17.5833 18 18 18ZM18 21C18.5 21 18.9667 20.8833 19.4 20.65C19.8333 20.4167 20.1917 20.0917 20.475 19.675C20.0917 19.4417 19.6917 19.2708 19.275 19.1625C18.8583 19.0542 18.4333 19 18 19C17.5667 19 17.1417 19.0542 16.725 19.1625C16.3083 19.2708 15.9083 19.4417 15.525 19.675C15.8083 20.0917 16.1667 20.4167 16.6 20.65C17.0333 20.8833 17.5 21 18 21ZM9 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6V8ZM12.25 22H6C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8H7V6C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V11.3C19.7 11.2 19.3875 11.125 19.0625 11.075C18.7375 11.025 18.3833 11 18 11V10H6V20H11.3C11.4333 20.4 11.5667 20.7458 11.7 21.0375C11.8333 21.3292 12.0167 21.65 12.25 22ZM18 23C16.6167 23 15.4375 22.5125 14.4625 21.5375C13.4875 20.5625 13 19.3833 13 18C13 16.6167 13.4875 15.4375 14.4625 14.4625C15.4375 13.4875 16.6167 13 18 13C19.3833 13 20.5625 13.4875 21.5375 14.4625C22.5125 15.4375 23 16.6167 23 18C23 19.3833 22.5125 20.5625 21.5375 21.5375C20.5625 22.5125 19.3833 23 18 23Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M21 20.9998C21.4861 20.9998 21.8993 20.8297 22.2395 20.4894C22.5798 20.1491 22.75 19.7359 22.75 19.2498C22.75 18.7637 22.5798 18.3505 22.2395 18.0103C21.8993 17.67 21.4861 17.4998 21 17.4998C20.5138 17.4998 20.1007 17.67 19.7604 18.0103C19.4201 18.3505 19.25 18.7637 19.25 19.2498C19.25 19.7359 19.4201 20.1491 19.7604 20.4894C20.1007 20.8297 20.5138 20.9998 21 20.9998ZM21 24.4998C21.5833 24.4998 22.1277 24.3637 22.6333 24.0915C23.1388 23.8193 23.5569 23.4401 23.8875 22.954C23.4402 22.6818 22.9736 22.4825 22.4875 22.3561C22.0013 22.2297 21.5055 22.1665 21 22.1665C20.4944 22.1665 19.9986 22.2297 19.5125 22.3561C19.0263 22.4825 18.5597 22.6818 18.1125 22.954C18.443 23.4401 18.8611 23.8193 19.3666 24.0915C19.8722 24.3637 20.4166 24.4998 21 24.4998ZM10.5 9.33317H17.5V6.99984C17.5 6.02761 17.1597 5.20123 16.4791 4.52067C15.7986 3.84011 14.9722 3.49984 14 3.49984C13.0277 3.49984 12.2013 3.84011 11.5208 4.52067C10.8402 5.20123 10.5 6.02761 10.5 6.99984V9.33317ZM14.2916 25.6665H6.99996C6.35829 25.6665 5.80899 25.438 5.35204 24.9811C4.8951 24.5241 4.66663 23.9748 4.66663 23.3332V11.6665C4.66663 11.0248 4.8951 10.4755 5.35204 10.0186C5.80899 9.56164 6.35829 9.33317 6.99996 9.33317H8.16663V6.99984C8.16663 5.38595 8.73538 4.01025 9.87288 2.87275C11.0104 1.73525 12.3861 1.1665 14 1.1665C15.6138 1.1665 16.9895 1.73525 18.127 2.87275C19.2645 4.01025 19.8333 5.38595 19.8333 6.99984V9.33317H21C21.6416 9.33317 22.1909 9.56164 22.6479 10.0186C23.1048 10.4755 23.3333 11.0248 23.3333 11.6665V13.1832C22.9833 13.0665 22.6187 12.979 22.2395 12.9207C21.8604 12.8623 21.4472 12.8332 21 12.8332V11.6665H6.99996V23.3332H13.1833C13.3388 23.7998 13.4944 24.2033 13.65 24.5436C13.8055 24.8839 14.0194 25.2582 14.2916 25.6665ZM21 26.8332C19.3861 26.8332 18.0104 26.2644 16.8729 25.1269C15.7354 23.9894 15.1666 22.6137 15.1666 20.9998C15.1666 19.3859 15.7354 18.0103 16.8729 16.8728C18.0104 15.7353 19.3861 15.1665 21 15.1665C22.6138 15.1665 23.9895 15.7353 25.127 16.8728C26.2645 18.0103 26.8333 19.3859 26.8333 20.9998C26.8333 22.6137 26.2645 23.9894 25.127 25.1269C23.9895 26.2644 22.6138 26.8332 21 26.8332Z", fill: "currentColor" })))));
-  }
-  static get is() { return "swirl-icon-lock-person"; }
-  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",
-        "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"
+    constructor() {
+        this.color = undefined;
+        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: '07575b37b52c3c398badbf1bd4f36d4b7777feca', "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: '359cf09f23c0c95447da2f96c741d8abff21ced5' }, h("path", { key: 'ad14debb588e026ea856f52e9df3409a7e1d2db0', d: "M12 11.9998C12.2777 11.9998 12.5138 11.9026 12.7083 11.7082C12.9027 11.5137 13 11.2776 13 10.9998C13 10.7221 12.9027 10.4859 12.7083 10.2915C12.5138 10.0971 12.2777 9.99984 12 9.99984C11.7222 9.99984 11.4861 10.0971 11.2916 10.2915C11.0972 10.4859 11 10.7221 11 10.9998C11 11.2776 11.0972 11.5137 11.2916 11.7082C11.4861 11.9026 11.7222 11.9998 12 11.9998ZM12 13.9998C12.3333 13.9998 12.6444 13.9221 12.9333 13.7665C13.2222 13.6109 13.4611 13.3943 13.65 13.1165C13.3944 12.9609 13.1277 12.8471 12.85 12.7748C12.5722 12.7026 12.2888 12.6665 12 12.6665C11.7111 12.6665 11.4277 12.7026 11.15 12.7748C10.8722 12.8471 10.6055 12.9609 10.35 13.1165C10.5388 13.3943 10.7777 13.6109 11.0666 13.7665C11.3555 13.9221 11.6666 13.9998 12 13.9998ZM5.99996 5.33317H9.99996V3.99984C9.99996 3.44428 9.80552 2.97206 9.41663 2.58317C9.02774 2.19428 8.55552 1.99984 7.99996 1.99984C7.4444 1.99984 6.97218 2.19428 6.58329 2.58317C6.1944 2.97206 5.99996 3.44428 5.99996 3.99984V5.33317ZM8.16663 14.6665H3.99996C3.63329 14.6665 3.3194 14.5359 3.05829 14.2748C2.79718 14.0137 2.66663 13.6998 2.66663 13.3332V6.6665C2.66663 6.29984 2.79718 5.98595 3.05829 5.72484C3.3194 5.46373 3.63329 5.33317 3.99996 5.33317H4.66663V3.99984C4.66663 3.07762 4.99163 2.2915 5.64163 1.6415C6.29163 0.991504 7.07774 0.666504 7.99996 0.666504C8.92218 0.666504 9.70829 0.991504 10.3583 1.6415C11.0083 2.2915 11.3333 3.07762 11.3333 3.99984V5.33317H12C12.3666 5.33317 12.6805 5.46373 12.9416 5.72484C13.2027 5.98595 13.3333 6.29984 13.3333 6.6665V7.53317C13.1333 7.4665 12.925 7.4165 12.7083 7.38317C12.4916 7.34984 12.2555 7.33317 12 7.33317V6.6665H3.99996V13.3332H7.53329C7.62218 13.5998 7.71107 13.8304 7.79996 14.0248C7.88885 14.2193 8.01107 14.4332 8.16663 14.6665ZM12 15.3332C11.0777 15.3332 10.2916 15.0082 9.64163 14.3582C8.99163 13.7082 8.66663 12.9221 8.66663 11.9998C8.66663 11.0776 8.99163 10.2915 9.64163 9.6415C10.2916 8.9915 11.0777 8.6665 12 8.6665C12.9222 8.6665 13.7083 8.9915 14.3583 9.6415C15.0083 10.2915 15.3333 11.0776 15.3333 11.9998C15.3333 12.9221 15.0083 13.7082 14.3583 14.3582C13.7083 15.0082 12.9222 15.3332 12 15.3332Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (h(Fragment, { key: '87f2331942d44f2bddaf03a89eea1cfcb7db04e9' }, h("path", { key: 'cb3f6a8f2114e5859eff676c49ce1858e0669db4', d: "M18 18C18.4167 18 18.7708 17.8542 19.0625 17.5625C19.3542 17.2708 19.5 16.9167 19.5 16.5C19.5 16.0833 19.3542 15.7292 19.0625 15.4375C18.7708 15.1458 18.4167 15 18 15C17.5833 15 17.2292 15.1458 16.9375 15.4375C16.6458 15.7292 16.5 16.0833 16.5 16.5C16.5 16.9167 16.6458 17.2708 16.9375 17.5625C17.2292 17.8542 17.5833 18 18 18ZM18 21C18.5 21 18.9667 20.8833 19.4 20.65C19.8333 20.4167 20.1917 20.0917 20.475 19.675C20.0917 19.4417 19.6917 19.2708 19.275 19.1625C18.8583 19.0542 18.4333 19 18 19C17.5667 19 17.1417 19.0542 16.725 19.1625C16.3083 19.2708 15.9083 19.4417 15.525 19.675C15.8083 20.0917 16.1667 20.4167 16.6 20.65C17.0333 20.8833 17.5 21 18 21ZM9 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6V8ZM12.25 22H6C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8H7V6C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V11.3C19.7 11.2 19.3875 11.125 19.0625 11.075C18.7375 11.025 18.3833 11 18 11V10H6V20H11.3C11.4333 20.4 11.5667 20.7458 11.7 21.0375C11.8333 21.3292 12.0167 21.65 12.25 22ZM18 23C16.6167 23 15.4375 22.5125 14.4625 21.5375C13.4875 20.5625 13 19.3833 13 18C13 16.6167 13.4875 15.4375 14.4625 14.4625C15.4375 13.4875 16.6167 13 18 13C19.3833 13 20.5625 13.4875 21.5375 14.4625C22.5125 15.4375 23 16.6167 23 18C23 19.3833 22.5125 20.5625 21.5375 21.5375C20.5625 22.5125 19.3833 23 18 23Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, { key: 'db6f388332e829018136222595de0a4f8e738706' }, h("path", { key: 'b12eb83d27cd8b8a7eb56e9eef8f9fce8437d473', d: "M21 20.9998C21.4861 20.9998 21.8993 20.8297 22.2395 20.4894C22.5798 20.1491 22.75 19.7359 22.75 19.2498C22.75 18.7637 22.5798 18.3505 22.2395 18.0103C21.8993 17.67 21.4861 17.4998 21 17.4998C20.5138 17.4998 20.1007 17.67 19.7604 18.0103C19.4201 18.3505 19.25 18.7637 19.25 19.2498C19.25 19.7359 19.4201 20.1491 19.7604 20.4894C20.1007 20.8297 20.5138 20.9998 21 20.9998ZM21 24.4998C21.5833 24.4998 22.1277 24.3637 22.6333 24.0915C23.1388 23.8193 23.5569 23.4401 23.8875 22.954C23.4402 22.6818 22.9736 22.4825 22.4875 22.3561C22.0013 22.2297 21.5055 22.1665 21 22.1665C20.4944 22.1665 19.9986 22.2297 19.5125 22.3561C19.0263 22.4825 18.5597 22.6818 18.1125 22.954C18.443 23.4401 18.8611 23.8193 19.3666 24.0915C19.8722 24.3637 20.4166 24.4998 21 24.4998ZM10.5 9.33317H17.5V6.99984C17.5 6.02761 17.1597 5.20123 16.4791 4.52067C15.7986 3.84011 14.9722 3.49984 14 3.49984C13.0277 3.49984 12.2013 3.84011 11.5208 4.52067C10.8402 5.20123 10.5 6.02761 10.5 6.99984V9.33317ZM14.2916 25.6665H6.99996C6.35829 25.6665 5.80899 25.438 5.35204 24.9811C4.8951 24.5241 4.66663 23.9748 4.66663 23.3332V11.6665C4.66663 11.0248 4.8951 10.4755 5.35204 10.0186C5.80899 9.56164 6.35829 9.33317 6.99996 9.33317H8.16663V6.99984C8.16663 5.38595 8.73538 4.01025 9.87288 2.87275C11.0104 1.73525 12.3861 1.1665 14 1.1665C15.6138 1.1665 16.9895 1.73525 18.127 2.87275C19.2645 4.01025 19.8333 5.38595 19.8333 6.99984V9.33317H21C21.6416 9.33317 22.1909 9.56164 22.6479 10.0186C23.1048 10.4755 23.3333 11.0248 23.3333 11.6665V13.1832C22.9833 13.0665 22.6187 12.979 22.2395 12.9207C21.8604 12.8623 21.4472 12.8332 21 12.8332V11.6665H6.99996V23.3332H13.1833C13.3388 23.7998 13.4944 24.2033 13.65 24.5436C13.8055 24.8839 14.0194 25.2582 14.2916 25.6665ZM21 26.8332C19.3861 26.8332 18.0104 26.2644 16.8729 25.1269C15.7354 23.9894 15.1666 22.6137 15.1666 20.9998C15.1666 19.3859 15.7354 18.0103 16.8729 16.8728C18.0104 15.7353 19.3861 15.1665 21 15.1665C22.6138 15.1665 23.9895 15.7353 25.127 16.8728C26.2645 18.0103 26.8333 19.3859 26.8333 20.9998C26.8333 22.6137 26.2645 23.9894 25.127 25.1269C23.9895 26.2644 22.6138 26.8332 21 26.8332Z", fill: "currentColor" })))));
+    }
+    static get is() { return "swirl-icon-lock-person"; }
+    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",
+                "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": ""
+                },
+                "attribute": "color",
+                "reflect": false
+            },
+            "size": {
+                "type": "number",
+                "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": ""
+                },
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "24"
             }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color",
-        "reflect": false
-      },
-      "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"
-      }
-    };
-  }
+        };
+    }
 }