@whydrf/nava-icon-web-components 0.1.0

package/dist/chunk-OBYMFDXN.js

@@ -0,0 +1,45 @@
+// src/icons/last-page.ts
+var NavaIconLastPage = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M7.707 17.707L13.414 12L7.707 6.293L6.293 7.707L10.586 12L6.293 16.293L7.707 17.707ZM15 6H17V18H15V6Z" />`;
+    const filledPaths = `<path d="M7.707 17.707L13.414 12L7.707 6.293L6.293 7.707L10.586 12L6.293 16.293L7.707 17.707ZM15 6H17V18H15V6Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-last-page")) {
+  customElements.define("icon-last-page", NavaIconLastPage);
+}

package/dist/chunk-ODRX6DHX.js

@@ -0,0 +1,45 @@
+// src/icons/color.ts
+var NavaIconColor = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2ZM12 15C11.4067 15 10.8266 14.8241 10.3333 14.4944C9.83995 14.1648 9.45543 13.6962 9.22837 13.1481C9.0013 12.5999 8.94189 11.9967 9.05765 11.4147C9.1734 10.8328 9.45913 10.2982 9.87868 9.87868C10.2982 9.45912 10.8328 9.1734 11.4147 9.05764C11.9967 8.94189 12.5999 9.0013 13.1481 9.22836C13.6962 9.45542 14.1648 9.83994 14.4944 10.3333C14.8241 10.8266 15 11.4067 15 12C15 12.7956 14.6839 13.5587 14.1213 14.1213C13.5587 14.6839 12.7957 15 12 15ZM14.75 7.83C14.2186 7.47727 13.6246 7.22948 13 7.1V4.1C14.4224 4.27804 15.7701 4.83784 16.9 5.72L14.75 7.83ZM11 7.1C10.3754 7.22948 9.78144 7.47727 9.25 7.83L7.1 5.69C8.22993 4.80784 9.5776 4.24804 11 4.07V7.1ZM7.83 9.25C7.47728 9.78143 7.22949 10.3754 7.1 11H4.1C4.26927 9.58057 4.8186 8.23317 5.69 7.1L7.83 9.25ZM7.1 13C7.22949 13.6246 7.47728 14.2186 7.83 14.75L5.69 16.9C4.80785 15.7701 4.24805 14.4224 4.07 13H7.1ZM9.25 16.17C9.78144 16.5227 10.3754 16.7705 11 16.9V19.9C9.5776 19.722 8.22993 19.1622 7.1 18.28L9.25 16.17ZM13 16.9C13.6246 16.7705 14.2186 16.5227 14.75 16.17L16.9 18.31C15.7701 19.1922 14.4224 19.752 13 19.93V16.9ZM16.17 14.75C16.5227 14.2186 16.7705 13.6246 16.9 13H19.9C19.722 14.4224 19.1622 15.7701 18.28 16.9L16.17 14.75ZM16.9 11C16.7705 10.3754 16.5227 9.78143 16.17 9.25L18.31 7.1C19.1922 8.22993 19.752 9.5776 19.93 11H16.9Z" />`;
+    const filledPaths = `<path d="M7.08 11.25C7.19839 10.4514 7.51465 9.69513 8 9.05L4.43 5.49C3.0179 7.09637 2.16519 9.11759 2 11.25H7.08ZM9.05 8C9.69613 7.51822 10.4523 7.20543 11.25 7.09V2C9.11759 2.16519 7.09637 3.0179 5.49 4.43L9.05 8ZM12.75 2V7C13.5737 7.1338 14.3487 7.47828 15 8L18.56 4.44C16.9416 3.0143 14.9011 2.15736 12.75 2ZM8 15C7.51822 14.3539 7.20543 13.5977 7.09 12.8H2C2.15394 14.9277 2.99239 16.9484 4.39 18.56L8 15ZM11.25 16.92C10.4514 16.8016 9.69513 16.4853 9.05 16L5.49 19.57C7.09637 20.9821 9.11759 21.8348 11.25 22V16.92ZM16 9.05C16.4818 9.69613 16.7946 10.4523 16.91 11.25H21.91C21.7561 9.12233 20.9176 7.10163 19.52 5.49L16 9.05ZM15 16C14.3539 16.4818 13.5977 16.7946 12.8 16.91V21.91C14.9277 21.7561 16.9484 20.9176 18.56 19.52L15 16ZM16.92 12.75C16.8097 13.5661 16.4931 14.3405 16 15L19.56 18.56C20.9857 16.9416 21.8426 14.9011 22 12.75H16.92Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-color")) {
+  customElements.define("icon-color", NavaIconColor);
+}

package/dist/chunk-OEDIFBHG.js

@@ -0,0 +1,45 @@
+// src/icons/bell.ts
+var NavaIconBell = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M19 13.586V10C19 6.783 16.815 4.073 13.855 3.258C13.562 2.52 12.846 2 12 2C11.154 2 10.438 2.52 10.145 3.258C7.185 4.074 5 6.783 5 10V13.586L3.293 15.293C3.19996 15.3857 3.12617 15.4959 3.07589 15.6172C3.0256 15.7386 2.99981 15.8687 3 16V18C3 18.2652 3.10536 18.5196 3.29289 18.7071C3.48043 18.8946 3.73478 19 4 19H20C20.2652 19 20.5196 18.8946 20.7071 18.7071C20.8946 18.5196 21 18.2652 21 18V16C21.0002 15.8687 20.9744 15.7386 20.9241 15.6172C20.8738 15.4959 20.8 15.3857 20.707 15.293L19 13.586ZM19 17H5V16.414L6.707 14.707C6.80004 14.6143 6.87383 14.5041 6.92412 14.3828C6.9744 14.2614 7.00019 14.1313 7 14V10C7 7.243 9.243 5 12 5C14.757 5 17 7.243 17 10V14C17 14.266 17.105 14.52 17.293 14.707L19 16.414V17ZM12 22C12.6193 22.0008 13.2235 21.8086 13.7285 21.4502C14.2335 21.0917 14.6143 20.5849 14.818 20H9.182C9.38566 20.5849 9.76648 21.0917 10.2715 21.4502C10.7765 21.8086 11.3807 22.0008 12 22Z" />`;
+    const filledPaths = `<path d="M12 22C12.6193 22.0008 13.2235 21.8086 13.7285 21.4502C14.2335 21.0917 14.6143 20.5849 14.818 20H9.182C9.38566 20.5849 9.76648 21.0917 10.2715 21.4502C10.7765 21.8086 11.3807 22.0008 12 22ZM19 14.586V10C19 6.783 16.815 4.073 13.855 3.258C13.562 2.52 12.846 2 12 2C11.154 2 10.438 2.52 10.145 3.258C7.185 4.074 5 6.783 5 10V14.586L3.293 16.293C3.19996 16.3857 3.12617 16.4959 3.07589 16.6172C3.0256 16.7386 2.99981 16.8687 3 17V18C3 18.2652 3.10536 18.5196 3.29289 18.7071C3.48043 18.8946 3.73478 19 4 19H20C20.2652 19 20.5196 18.8946 20.7071 18.7071C20.8946 18.5196 21 18.2652 21 18V17C21.0002 16.8687 20.9744 16.7386 20.9241 16.6172C20.8738 16.4959 20.8 16.3857 20.707 16.293L19 14.586Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-bell")) {
+  customElements.define("icon-bell", NavaIconBell);
+}

package/dist/chunk-OEVGZ6WG.js

@@ -0,0 +1,47 @@
+// src/icons/money-withdraw.ts
+var NavaIconMoneyWithdraw = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M12 15C10.16 15 10 14.14 10 14H8C8 14.92 8.66 16.55 11 16.92V18H13V16.92C15 16.58 16 15.29 16 14C16 12.88 15.48 11 12 11C10 11 10 10.37 10 10C10 9.63 10.7 9 12 9C13.3 9 13.39 9.64 13.4 10H15.4C15.3865 9.31875 15.1415 8.66241 14.7053 8.13896C14.269 7.61551 13.6676 7.25614 13 7.12V6H11V7.09C9 7.42 8 8.71 8 10C8 11.12 8.52 13 12 13C14 13 14 13.68 14 14C14 14.32 13.38 15 12 15Z" />
+<path d="M5 2H2V4H4V21C4 21.2652 4.10536 21.5196 4.29289 21.7071C4.48043 21.8946 4.73478 22 5 22H19C19.2652 22 19.5196 21.8946 19.7071 21.7071C19.8946 21.5196 20 21.2652 20 21V4H22V2H5ZM18 20H6V4H18V20Z" />`;
+    const filledPaths = `<path d="M12 15C10.16 15 10 14.14 10 14H8C8 14.92 8.66 16.55 11 16.92V18H13V16.92C15 16.58 16 15.29 16 14C16 12.88 15.48 11 12 11C10 11 10 10.37 10 10C10 9.63 10.7 9 12 9C13.3 9 13.39 9.64 13.4 10H15.4C15.3865 9.31875 15.1415 8.66241 14.7053 8.13896C14.269 7.61551 13.6676 7.25614 13 7.12V6H11V7.09C9 7.42 8 8.71 8 10C8 11.12 8.52 13 12 13C14 13 14 13.68 14 14C14 14.32 13.38 15 12 15Z" />
+<path d="M5 2H2V4H4V21C4 21.2652 4.10536 21.5196 4.29289 21.7071C4.48043 21.8946 4.73478 22 5 22H19C19.2652 22 19.5196 21.8946 19.7071 21.7071C19.8946 21.5196 20 21.2652 20 21V4H22V2H5ZM18 20H6V4H18V20Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-money-withdraw")) {
+  customElements.define("icon-money-withdraw", NavaIconMoneyWithdraw);
+}

package/dist/chunk-OF2KDSL2.js

@@ -0,0 +1,45 @@
+// src/icons/collapse-alt.ts
+var NavaIconCollapseAlt = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M2 15H9V22H11V13H2V15ZM15 2H13V11H22V9H15V2Z" />`;
+    const filledPaths = `<path d="M2 15H9V22H11V13H2V15ZM15 2H13V11H22V9H15V2Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-collapse-alt")) {
+  customElements.define("icon-collapse-alt", NavaIconCollapseAlt);
+}

package/dist/chunk-OFMWPC2W.js

@@ -0,0 +1,45 @@
+// src/icons/widget.ts
+var NavaIconWidget = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M4 11H10C10.2652 11 10.5196 10.8947 10.7071 10.7071C10.8946 10.5196 11 10.2652 11 10V4.00002C11 3.7348 10.8946 3.48045 10.7071 3.29291C10.5196 3.10538 10.2652 3.00002 10 3.00002H4C3.73478 3.00002 3.48043 3.10538 3.29289 3.29291C3.10536 3.48045 3 3.7348 3 4.00002V10C3 10.2652 3.10536 10.5196 3.29289 10.7071C3.48043 10.8947 3.73478 11 4 11ZM4 21H10C10.2652 21 10.5196 20.8947 10.7071 20.7071C10.8946 20.5196 11 20.2652 11 20V14C11 13.7348 10.8946 13.4804 10.7071 13.2929C10.5196 13.1054 10.2652 13 10 13H4C3.73478 13 3.48043 13.1054 3.29289 13.2929C3.10536 13.4804 3 13.7348 3 14V20C3 20.2652 3.10536 20.5196 3.29289 20.7071C3.48043 20.8947 3.73478 21 4 21ZM14 21H20C20.2652 21 20.5196 20.8947 20.7071 20.7071C20.8946 20.5196 21 20.2652 21 20V14C21 13.7348 20.8946 13.4804 20.7071 13.2929C20.5196 13.1054 20.2652 13 20 13H14C13.7348 13 13.4804 13.1054 13.2929 13.2929C13.1054 13.4804 13 13.7348 13 14V20C13 20.2652 13.1054 20.5196 13.2929 20.7071C13.4804 20.8947 13.7348 21 14 21ZM21.293 6.29302L17.707 2.70702C17.6142 2.61407 17.504 2.54034 17.3827 2.49003C17.2614 2.43971 17.1313 2.41382 17 2.41382C16.8687 2.41382 16.7386 2.43971 16.6173 2.49003C16.496 2.54034 16.3858 2.61407 16.293 2.70702L12.707 6.29302C12.6141 6.38581 12.5403 6.49601 12.49 6.61733C12.4397 6.73864 12.4138 6.86869 12.4138 7.00002C12.4138 7.13135 12.4397 7.2614 12.49 7.38271C12.5403 7.50403 12.6141 7.61423 12.707 7.70702L16.293 11.293C16.3858 11.386 16.496 11.4597 16.6173 11.51C16.7386 11.5603 16.8687 11.5862 17 11.5862C17.1313 11.5862 17.2614 11.5603 17.3827 11.51C17.504 11.4597 17.6142 11.386 17.707 11.293L21.293 7.70702C21.3859 7.61423 21.4597 7.50403 21.51 7.38271C21.5603 7.2614 21.5862 7.13135 21.5862 7.00002C21.5862 6.86869 21.5603 6.73864 21.51 6.61733C21.4597 6.49601 21.3859 6.38581 21.293 6.29302Z" />`;
+    const filledPaths = `<path d="M4 11H10C10.2652 11 10.5196 10.8947 10.7071 10.7071C10.8946 10.5196 11 10.2652 11 10V4.00002C11 3.7348 10.8946 3.48045 10.7071 3.29291C10.5196 3.10538 10.2652 3.00002 10 3.00002H4C3.73478 3.00002 3.48043 3.10538 3.29289 3.29291C3.10536 3.48045 3 3.7348 3 4.00002V10C3 10.2652 3.10536 10.5196 3.29289 10.7071C3.48043 10.8947 3.73478 11 4 11ZM4 21H10C10.2652 21 10.5196 20.8947 10.7071 20.7071C10.8946 20.5196 11 20.2652 11 20V14C11 13.7348 10.8946 13.4804 10.7071 13.2929C10.5196 13.1054 10.2652 13 10 13H4C3.73478 13 3.48043 13.1054 3.29289 13.2929C3.10536 13.4804 3 13.7348 3 14V20C3 20.2652 3.10536 20.5196 3.29289 20.7071C3.48043 20.8947 3.73478 21 4 21ZM14 21H20C20.2652 21 20.5196 20.8947 20.7071 20.7071C20.8946 20.5196 21 20.2652 21 20V14C21 13.7348 20.8946 13.4804 20.7071 13.2929C20.5196 13.1054 20.2652 13 20 13H14C13.7348 13 13.4804 13.1054 13.2929 13.2929C13.1054 13.4804 13 13.7348 13 14V20C13 20.2652 13.1054 20.5196 13.2929 20.7071C13.4804 20.8947 13.7348 21 14 21ZM21.293 6.29302L17.707 2.70702C17.6142 2.61407 17.504 2.54034 17.3827 2.49003C17.2614 2.43971 17.1313 2.41382 17 2.41382C16.8687 2.41382 16.7386 2.43971 16.6173 2.49003C16.496 2.54034 16.3858 2.61407 16.293 2.70702L12.707 6.29302C12.6141 6.38581 12.5403 6.49601 12.49 6.61733C12.4397 6.73864 12.4138 6.86869 12.4138 7.00002C12.4138 7.13135 12.4397 7.2614 12.49 7.38271C12.5403 7.50403 12.6141 7.61423 12.707 7.70702L16.293 11.293C16.3858 11.386 16.496 11.4597 16.6173 11.51C16.7386 11.5603 16.8687 11.5862 17 11.5862C17.1313 11.5862 17.2614 11.5603 17.3827 11.51C17.504 11.4597 17.6142 11.386 17.707 11.293L21.293 7.70702C21.3859 7.61423 21.4597 7.50403 21.51 7.38271C21.5603 7.2614 21.5862 7.13135 21.5862 7.00002C21.5862 6.86869 21.5603 6.73864 21.51 6.61733C21.4597 6.49601 21.3859 6.38581 21.293 6.29302Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-widget")) {
+  customElements.define("icon-widget", NavaIconWidget);
+}

package/dist/chunk-OFRQTDOY.js

@@ -0,0 +1,46 @@
+// src/icons/caret-down-square.ts
+var NavaIconCaretDownSquare = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M12 16L17 10H7L12 16Z" />
+<path d="M19 3H5C3.897 3 3 3.897 3 5V19C3 20.103 3.897 21 5 21H19C20.103 21 21 20.103 21 19V5C21 3.897 20.103 3 19 3ZM5 19V5H19L19.002 19H5Z" />`;
+    const filledPaths = `<path d="M5 21H19C20.103 21 21 20.103 21 19V5C21 3.897 20.103 3 19 3H5C3.897 3 3 3.897 3 5V19C3 20.103 3.897 21 5 21ZM17 10L12 16L7 10H17Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-caret-down-square")) {
+  customElements.define("icon-caret-down-square", NavaIconCaretDownSquare);
+}

package/dist/chunk-OHDUHTTH.js

@@ -0,0 +1,48 @@
+// src/icons/joystick-alt.ts
+var NavaIconJoystickAlt = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M15 14C15.5523 14 16 13.5523 16 13C16 12.4477 15.5523 12 15 12C14.4477 12 14 12.4477 14 13C14 13.5523 14.4477 14 15 14Z" />
+<path d="M17 12C17.5523 12 18 11.5523 18 11C18 10.4477 17.5523 10 17 10C16.4477 10 16 10.4477 16 11C16 11.5523 16.4477 12 17 12Z" />
+<path d="M10 9H8V11H6V13H8V15H10V13H12V11H10V9Z" />
+<path d="M15 5H9C7.14348 5 5.36301 5.7375 4.05025 7.05025C2.7375 8.36301 2 10.1435 2 12C2 13.8565 2.7375 15.637 4.05025 16.9497C5.36301 18.2625 7.14348 19 9 19H15C16.8565 19 18.637 18.2625 19.9497 16.9497C21.2625 15.637 22 13.8565 22 12C22 10.1435 21.2625 8.36301 19.9497 7.05025C18.637 5.7375 16.8565 5 15 5ZM15 17H9C7.67392 17 6.40215 16.4732 5.46447 15.5355C4.52678 14.5979 4 13.3261 4 12C4 10.6739 4.52678 9.40215 5.46447 8.46447C6.40215 7.52678 7.67392 7 9 7H15C16.3261 7 17.5979 7.52678 18.5355 8.46447C19.4732 9.40215 20 10.6739 20 12C20 13.3261 19.4732 14.5979 18.5355 15.5355C17.5979 16.4732 16.3261 17 15 17Z" />`;
+    const filledPaths = `<path d="M16 6H8C6.4087 6 4.88258 6.63214 3.75736 7.75736C2.63214 8.88258 2 10.4087 2 12C2 13.5913 2.63214 15.1174 3.75736 16.2426C4.88258 17.3679 6.4087 18 8 18H16C17.5913 18 19.1174 17.3679 20.2426 16.2426C21.3679 15.1174 22 13.5913 22 12C22 10.4087 21.3679 8.88258 20.2426 7.75736C19.1174 6.63214 17.5913 6 16 6ZM11 13H9V15H7V13H5V11H7V9H9V11H11V13ZM14.5 15C14.1022 15 13.7206 14.842 13.4393 14.5607C13.158 14.2794 13 13.8978 13 13.5C13 13.1022 13.158 12.7206 13.4393 12.4393C13.7206 12.158 14.1022 12 14.5 12C14.8978 12 15.2794 12.158 15.5607 12.4393C15.842 12.7206 16 13.1022 16 13.5C16 13.8978 15.842 14.2794 15.5607 14.5607C15.2794 14.842 14.8978 15 14.5 15ZM17.5 12C17.1022 12 16.7206 11.842 16.4393 11.5607C16.158 11.2794 16 10.8978 16 10.5C16 10.1022 16.158 9.72064 16.4393 9.43934C16.7206 9.15804 17.1022 9 17.5 9C17.8978 9 18.2794 9.15804 18.5607 9.43934C18.842 9.72064 19 10.1022 19 10.5C19 10.8978 18.842 11.2794 18.5607 11.5607C18.2794 11.842 17.8978 12 17.5 12Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-joystick-alt")) {
+  customElements.define("icon-joystick-alt", NavaIconJoystickAlt);
+}

package/dist/chunk-OHZO7REF.js

@@ -0,0 +1,45 @@
+// src/icons/magic-wand.ts
+var NavaIconMagicWand = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M11.0001 4L10.5001 3L10.0001 4L9.00006 4.125L9.83406 4.833L9.50006 6L10.5001 5.334L11.5001 6L11.1661 4.833L12.0001 4.125L11.0001 4ZM19.3341 14.666L18.5001 13L17.6661 14.666L16.0001 14.875L17.3891 16.056L16.8341 18L18.5001 16.889L20.1661 18L19.6111 16.056L21.0001 14.875L19.3341 14.666ZM6.66706 6.333L6.00006 5L5.33306 6.333L4.00006 6.5L5.11106 7.444L4.66706 9L6.00006 8.111L7.33306 9L6.88906 7.444L8.00006 6.5L6.66706 6.333ZM3.41406 17C3.41406 17.534 3.62206 18.036 4.00006 18.414L5.58606 20C5.96406 20.378 6.46606 20.586 7.00006 20.586C7.53406 20.586 8.03606 20.378 8.41406 20L20.0001 8.414C20.3781 8.036 20.5861 7.534 20.5861 7C20.5861 6.466 20.3781 5.964 20.0001 5.586L18.4141 4C17.6581 3.244 16.3421 3.244 15.5861 4L4.00006 15.586C3.62206 15.964 3.41406 16.466 3.41406 17ZM17.0001 5.414L18.5861 7L15.0001 10.586L13.4141 9L17.0001 5.414Z" />`;
+    const filledPaths = `<path d="M11.0001 4L10.5001 3L10.0001 4L9.00006 4.125L9.83406 4.833L9.50006 6L10.5001 5.334L11.5001 6L11.1661 4.833L12.0001 4.125L11.0001 4ZM19.3341 14.666L18.5001 13L17.6661 14.666L16.0001 14.875L17.3891 16.056L16.8341 18L18.5001 16.889L20.1661 18L19.6111 16.056L21.0001 14.875L19.3341 14.666ZM6.66706 6.333L6.00006 5L5.33306 6.333L4.00006 6.5L5.11106 7.444L4.66706 9L6.00006 8.111L7.33306 9L6.88906 7.444L8.00006 6.5L6.66706 6.333ZM3.41406 17C3.41406 17.534 3.62206 18.036 4.00006 18.414L5.58606 20C5.96406 20.378 6.46606 20.586 7.00006 20.586C7.53406 20.586 8.03606 20.378 8.41406 20L20.0001 8.414C20.3781 8.036 20.5861 7.534 20.5861 7C20.5861 6.466 20.3781 5.964 20.0001 5.586L18.4141 4C17.6581 3.244 16.3421 3.244 15.5861 4L4.00006 15.586C3.62206 15.964 3.41406 16.466 3.41406 17ZM17.0001 5.414L18.5861 7L15.0001 10.586L13.4141 9L17.0001 5.414Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-magic-wand")) {
+  customElements.define("icon-magic-wand", NavaIconMagicWand);
+}

package/dist/chunk-OI2BELYQ.js

@@ -0,0 +1,49 @@
+// src/icons/face.ts
+var NavaIconFace = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M12 2C6.486 2 2 6.486 2 12C2 17.514 6.486 22 12 22C17.514 22 22 17.514 22 12C22 6.486 17.514 2 12 2ZM12 4C15.213 4 17.982 5.908 19.254 8.648C18.9451 8.50179 18.6461 8.33543 18.359 8.15C17.95 7.892 17.486 7.599 16.899 7.378C16.23 7.123 15.499 7 14.665 7C13.831 7 13.1 7.123 12.431 7.377C11.844 7.6 11.38 7.893 10.959 8.158C10.581 8.395 10.256 8.601 9.856 8.752C9.41 8.921 8.926 9 8.33 9C7.735 9 7.251 8.921 6.806 8.752C6.406 8.601 6.078 8.394 5.7 8.154C5.539 8.053 5.36 7.946 5.18 7.841C6.587 5.542 9.113 4 12 4ZM12 20C7.589 20 4 16.411 4 12C4 11.19 4.123 10.41 4.348 9.673C4.442 9.731 4.533 9.783 4.631 9.846C5.042 10.106 5.507 10.4 6.097 10.622C6.766 10.877 7.496 11 8.33 11C9.163 11 9.894 10.877 10.565 10.623C11.152 10.4 11.616 10.107 12.037 9.842C12.415 9.605 12.74 9.399 13.14 9.247C13.585 9.079 14.069 9 14.665 9C15.261 9 15.745 9.079 16.19 9.248C16.589 9.398 16.915 9.604 17.304 9.85C17.713 10.108 18.177 10.401 18.764 10.623C19.127 10.761 19.512 10.852 19.917 10.914C19.966 11.271 20 11.631 20 12C20 16.411 16.411 20 12 20Z" />
+<path d="M8.5 15C9.32843 15 10 14.3284 10 13.5C10 12.6716 9.32843 12 8.5 12C7.67157 12 7 12.6716 7 13.5C7 14.3284 7.67157 15 8.5 15Z" />
+<path d="M15.5 15C16.3284 15 17 14.3284 17 13.5C17 12.6716 16.3284 12 15.5 12C14.6716 12 14 12.6716 14 13.5C14 14.3284 14.6716 15 15.5 15Z" />`;
+    const filledPaths = `<path d="M12 2C6.486 2 2 6.486 2 12C2 17.514 6.486 22 12 22C17.514 22 22 17.514 22 12C22 6.486 17.514 2 12 2ZM12 20C7.589 20 4 16.411 4 12C4 10.832 4.258 9.725 4.709 8.724C4.863 8.814 5.017 8.906 5.165 9C5.561 9.25 5.956 9.5 6.451 9.688C6.945 9.875 7.539 10 8.33 10C9.122 10 9.716 9.875 10.211 9.687C10.706 9.499 11.102 9.25 11.498 9C11.894 8.75 12.29 8.5 12.785 8.312C13.279 8.125 13.873 8 14.665 8C15.457 8 16.051 8.125 16.545 8.313C17.04 8.5 17.436 8.75 17.832 9C18.228 9.25 18.624 9.5 19.119 9.688C19.297 9.755 19.493 9.81 19.7 9.859C19.891 10.541 20 11.257 20 12C20 16.411 16.411 20 12 20Z" />
+<path d="M8.5 14C9.32843 14 10 13.3284 10 12.5C10 11.6716 9.32843 11 8.5 11C7.67157 11 7 11.6716 7 12.5C7 13.3284 7.67157 14 8.5 14Z" />
+<path d="M15.5 14C16.3284 14 17 13.3284 17 12.5C17 11.6716 16.3284 11 15.5 11C14.6716 11 14 11.6716 14 12.5C14 13.3284 14.6716 14 15.5 14Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-face")) {
+  customElements.define("icon-face", NavaIconFace);
+}

package/dist/chunk-OIXQX2GE.js

@@ -0,0 +1,45 @@
+// src/icons/signal-1.ts
+var NavaIconSignal1 = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M3 16H5V21H3V16Z" />`;
+    const filledPaths = `<path d="M3 16H5V21H3V16Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-signal-1")) {
+  customElements.define("icon-signal-1", NavaIconSignal1);
+}

package/dist/chunk-OJWFCICI.js

@@ -0,0 +1,45 @@
+// src/icons/message.ts
+var NavaIconMessage = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M20 2H4C2.897 2 2 2.897 2 4V16C2 17.103 2.897 18 4 18H7V21.767L13.277 18H20C21.103 18 22 17.103 22 16V4C22 2.897 21.103 2 20 2ZM20 16H12.723L9 18.233V16H4V4H20V16Z" />`;
+    const filledPaths = `<path d="M20 2H4C2.897 2 2 2.894 2 3.992V16.008C2 17.106 2.897 18 4 18H7V22L13.351 18H20C21.103 18 22 17.106 22 16.008V3.992C21.9984 3.46279 21.7869 2.95583 21.412 2.58237C21.037 2.20891 20.5292 1.99947 20 2Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-message")) {
+  customElements.define("icon-message", NavaIconMessage);
+}

package/dist/chunk-OKKA2G5V.js

@@ -0,0 +1,45 @@
+// src/icons/zap.ts
+var NavaIconZap = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["size", "color", "stroke-width", "mode"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.render();
+  }
+  attributeChangedCallback() {
+    this.render();
+  }
+  render() {
+    const size = this.getAttribute("size") || "24";
+    const color = this.getAttribute("color") || "currentColor";
+    const strokeWidth = this.getAttribute("stroke-width") || "0.5";
+    const mode = this.getAttribute("mode") || "regular";
+    const isFilled = mode === "filled";
+    const regularPaths = `<path d="M20.9801 11.802C20.943 11.6167 20.8539 11.4457 20.7232 11.3092C20.5925 11.1726 20.4256 11.0761 20.2421 11.031L13.3821 9.315L15.9191 3.394C16.0074 3.18853 16.0242 2.95932 15.9667 2.74317C15.9093 2.52701 15.7808 2.33642 15.6021 2.202C15.4236 2.06669 15.2048 1.99547 14.9809 1.99982C14.757 2.00418 14.5411 2.08386 14.3681 2.226L3.36805 11.226C3.22457 11.3434 3.11654 11.4983 3.05602 11.6735C2.9955 11.8488 2.98487 12.0373 3.02532 12.2182C3.06578 12.3992 3.15572 12.5653 3.28511 12.698C3.4145 12.8308 3.57824 12.9249 3.75805 12.97L10.4771 14.651L7.13205 20.505C7.04576 20.6571 7.00081 20.8291 7.00168 21.004C7.00254 21.1788 7.0492 21.3504 7.13699 21.5016C7.22479 21.6528 7.35067 21.7784 7.50209 21.8659C7.65351 21.9533 7.8252 21.9995 8.00005 22C8.21648 22.0004 8.42713 21.9301 8.60005 21.8L20.6001 12.8C20.7512 12.6866 20.8672 12.5326 20.9344 12.356C21.0017 12.1793 21.0175 11.9873 20.9801 11.802Z" />`;
+    const filledPaths = `<path d="M20.9801 11.802C20.943 11.6167 20.8539 11.4457 20.7232 11.3092C20.5925 11.1726 20.4256 11.0761 20.2421 11.031L13.3821 9.315L15.9191 3.394C16.0074 3.18853 16.0242 2.95932 15.9667 2.74317C15.9093 2.52701 15.7808 2.33642 15.6021 2.202C15.4236 2.06669 15.2048 1.99547 14.9809 1.99982C14.757 2.00418 14.5411 2.08386 14.3681 2.226L3.36805 11.226C3.22457 11.3434 3.11654 11.4983 3.05602 11.6735C2.9955 11.8488 2.98487 12.0373 3.02532 12.2182C3.06578 12.3992 3.15572 12.5653 3.28511 12.698C3.4145 12.8308 3.57824 12.9249 3.75805 12.97L10.4771 14.651L7.13205 20.505C7.04576 20.6571 7.00081 20.8291 7.00168 21.004C7.00254 21.1788 7.0492 21.3504 7.13699 21.5016C7.22479 21.6528 7.35067 21.7784 7.50209 21.8659C7.65351 21.9533 7.8252 21.9995 8.00005 22C8.21648 22.0004 8.42713 21.9301 8.60005 21.8L20.6001 12.8C20.7512 12.6866 20.8672 12.5326 20.9344 12.356C21.0017 12.1793 21.0175 11.9873 20.9801 11.802Z" />`;
+    const paths = isFilled && filledPaths ? filledPaths : regularPaths;
+    const strokeBased = isFilled ? false : false;
+    this.shadowRoot.innerHTML = `
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        width="${size}"
+        height="${size}"
+        fill="${strokeBased ? "none" : color}"
+        stroke="${strokeBased ? color : "none"}"
+        stroke-width="${strokeBased ? strokeWidth : ""}"
+        ${strokeBased ? 'stroke-linecap="round"' : ""}
+        ${strokeBased ? 'stroke-linejoin="round"' : ""}
+      >
+        ${paths}
+      </svg>
+    `;
+  }
+};
+if (!customElements.get("icon-zap")) {
+  customElements.define("icon-zap", NavaIconZap);
+}