@kong/icons 1.15.3-pr.391.5c59f07.0 → 1.15.3-pr.391.6d60e23.0

package/dist/kong-icons.es682.js

@@ -1,35 +1,13 @@
-import { defineComponent as z, ref as C, computed as g, onMounted as I, openBlock as f, createBlock as N, resolveDynamicComponent as _, normalizeStyle as w, withCtx as L, createElementBlock as m, toDisplayString as V, createCommentVNode as q, pushScopeId as H, popScopeId as B, createElementVNode as o } from "vue";
-import { KUI_ICON_SIZE_50 as y } from "./kong-icons.es1218.js";
-const S = (e) => (H("data-v-41c44bef"), e = e(), B(), e), E = ["aria-hidden"], A = {
+import { defineComponent as C, ref as k, computed as g, onMounted as x, openBlock as u, createBlock as z, resolveDynamicComponent as I, normalizeStyle as N, withCtx as w, createElementBlock as m, toDisplayString as q, createCommentVNode as E, pushScopeId as _, popScopeId as A, createElementVNode as B } from "vue";
+import { KUI_ICON_SIZE_50 as h } from "./kong-icons.es1218.js";
+const L = (e) => (_("data-v-8cbfaff6"), e = e(), A(), e), $ = ["aria-hidden"], H = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, M = /* @__PURE__ */ S(() => /* @__PURE__ */ o("g", { "clip-path": "url(#clip0_1_2290)" }, [
-  /* @__PURE__ */ o("path", {
-    d: "M0 11.9999C0 14.0788 0.528891 16.0342 1.45908 17.739L12 18.7825L22.5409 17.739C23.4711 16.0342 24 14.0788 24 11.9999C24 9.921 23.4711 7.96566 22.5409 6.26077L12 5.21729L1.45908 6.26077C0.528891 7.96566 0 9.921 0 11.9999H0Z",
-    fill: "#D80027"
-  }),
-  /* @__PURE__ */ o("path", {
-    d: "M1.45911 6.26086H22.5409C20.5057 2.53073 16.5485 0 12 0C7.45151 0 3.49437 2.53073 1.45911 6.26086V6.26086Z",
-    fill: "#0052B4"
-  }),
-  /* @__PURE__ */ o("path", {
-    d: "M12 24.0001C16.5485 24.0001 20.5057 21.4694 22.5409 17.7393H1.45911C3.49437 21.4694 7.45151 24.0001 12 24.0001Z",
-    fill: "#0052B4"
-  }),
-  /* @__PURE__ */ o("path", {
-    d: "M16.1739 14.3481V12.7829H15.1305V10.6959L14.087 9.6524L13.0435 10.6959V8.60891L12 7.56543L10.9565 8.60891V10.6959L9.91306 9.6524L8.86958 10.6959V12.7829H7.82614V14.3481H6.78265V15.9133H17.2174V14.3481H16.1739Z",
-    fill: "#F0F0F0"
-  })
-], -1)), $ = /* @__PURE__ */ S(() => /* @__PURE__ */ o("defs", null, [
-  /* @__PURE__ */ o("clipPath", { id: "clip0_1_2290" }, [
-    /* @__PURE__ */ o("rect", {
-      fill: "white",
-      height: "24",
-      width: "24"
-    })
-  ])
-], -1)), D = /* @__PURE__ */ z({
-  __name: "FlagKhIcon",
+}, M = /* @__PURE__ */ L(() => /* @__PURE__ */ B("path", {
+  d: "M9.9 19C8.28333 19 6.89583 18.475 5.7375 17.425C4.57917 16.375 4 15.0667 4 13.5C4 11.9333 4.57917 10.625 5.7375 9.575C6.89583 8.525 8.28333 8 9.9 8H16.2L13.6 5.4L15 4L20 9L15 14L13.6 12.6L16.2 10H9.9C8.85 10 7.9375 10.3333 7.1625 11C6.3875 11.6667 6 12.5 6 13.5C6 14.5 6.3875 15.3333 7.1625 16C7.9375 16.6667 8.85 17 9.9 17H17V19H9.9Z",
+  fill: "currentColor"
+}, null, -1)), V = /* @__PURE__ */ C({
+  __name: "RedoIcon",
   props: {
     /** The accessibility text provided to screen readers */
     title: {
@@ -59,14 +37,14 @@ const S = (e) => (H("data-v-41c44bef"), e = e(), B(), e), E = ["aria-hidden"], A
     size: {
       type: [Number, String],
       required: !1,
-      default: y,
+      default: h,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
           return !0;
         if (typeof e == "string") {
-          const t = String(e).replace(/px/gi, ""), r = Number(t);
-          if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
+          const t = String(e).replace(/px/gi, ""), i = Number(t);
+          if (i && !isNaN(i) && Number.isInteger(i) && i > 0)
             return !0;
         }
         return !1;
@@ -88,58 +66,58 @@ const S = (e) => (H("data-v-41c44bef"), e = e(), B(), e), E = ["aria-hidden"], A
     }
   },
   setup(e) {
-    const t = e, r = C(null), p = g(() => {
+    const t = e, i = k(null), f = g(() => {
       if (typeof t.size == "number" && t.size > 0)
         return `${t.size}px`;
       if (typeof t.size == "string") {
-        const l = String(t.size).replace(/px/gi, ""), i = Number(l);
-        if (i && !isNaN(i) && Number.isInteger(i) && i > 0)
-          return `${i}px`;
+        const n = String(t.size).replace(/px/gi, ""), r = Number(n);
+        if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
+          return `${r}px`;
       }
-      return y;
-    }), b = g(() => ({
+      return h;
+    }), y = g(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
       flexShrink: "0",
-      height: p.value,
+      height: f.value,
       lineHeight: "0",
-      width: p.value
-    })), v = (l) => {
-      if (!l)
+      width: f.value
+    })), S = (n) => {
+      if (!n)
         return;
-      const i = l.querySelector("defs"), s = {};
-      i && i.querySelectorAll("[id]").forEach((n) => {
-        const d = n.getAttribute("id"), a = `${Math.random().toString(36).substring(2, 12)}-${d}`;
-        s[d] = a, n.setAttribute("id", a);
+      const r = n.querySelector("defs"), l = {};
+      r && r.querySelectorAll("[id]").forEach((o) => {
+        const s = o.getAttribute("id"), a = `${Math.random().toString(36).substring(2, 12)}-${s}`;
+        l[s] = a, o.setAttribute("id", a);
       });
-      const k = ["fill", "stroke", "filter", "mask", "clip-path", "xlink:href", "href"], x = (n) => {
-        k.forEach((d) => {
-          const a = n.getAttribute(d);
+      const b = ["fill", "stroke", "filter", "mask", "clip-path", "xlink:href", "href"], v = (o) => {
+        b.forEach((s) => {
+          const a = o.getAttribute(s);
           if (a) {
-            const h = a.replace(/url\(#([^)]+)\)/g, (u, c) => s[c] ? `url(#${s[c]})` : u).replace(/#([^\s]+)/g, (u, c) => s[c] ? `#${s[c]}` : u);
-            h !== a && n.setAttribute(d, h);
+            const p = a.replace(/url\(#([^)]+)\)/g, (c, d) => l[d] ? `url(#${l[d]})` : c).replace(/#([^\s]+)/g, (c, d) => l[d] ? `#${l[d]}` : c);
+            p !== a && o.setAttribute(s, p);
           }
         });
       };
-      l.querySelectorAll("*").forEach((n) => {
-        x(n);
+      n.querySelectorAll("*").forEach((o) => {
+        v(o);
       });
     };
-    return I(() => {
-      t.randomizeIds && r.value && v(r.value);
-    }), (l, i) => (f(), N(_(e.as), {
+    return x(() => {
+      t.randomizeIds && i.value && S(i.value);
+    }), (n, r) => (u(), z(I(e.as), {
       "aria-hidden": e.decorative ? "true" : void 0,
-      class: "kui-icon flag-kh-icon",
-      "data-testid": "kui-icon-wrapper-flag-kh-icon",
-      style: w(b.value)
+      class: "kui-icon redo-icon",
+      "data-testid": "kui-icon-wrapper-redo-icon",
+      style: N(y.value)
     }, {
-      default: L(() => [
-        (f(), m("svg", {
+      default: w(() => [
+        (u(), m("svg", {
           ref_key: "svgElement",
-          ref: r,
+          ref: i,
           "aria-hidden": e.decorative ? "true" : void 0,
-          "data-testid": "kui-icon-svg-flag-kh-icon",
+          "data-testid": "kui-icon-svg-redo-icon",
           fill: "none",
           height: "100%",
           role: "img",
@@ -147,16 +125,15 @@ const S = (e) => (H("data-v-41c44bef"), e = e(), B(), e), E = ["aria-hidden"], A
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (f(), m("title", A, V(e.title), 1)) : q("", !0),
-          M,
-          $
-        ], 8, E))
+          e.title ? (u(), m("title", H, q(e.title), 1)) : E("", !0),
+          M
+        ], 8, $))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
 });
 export {
-  D as default
+  V as default
 };
 //# sourceMappingURL=kong-icons.es682.js.map

package/dist/kong-icons.es682.js.map

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es682.js","sources":["../src/components/flags/FlagKhIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * FlagKhIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 24 Sep 2024 00:35:22 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed, ref, onMounted } from 'vue'\nimport { KUI_ICON_SIZE_50 } from '@kong/design-tokens'\n\nconst props = defineProps({\n  /** The accessibility text provided to screen readers */\n  title: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */\n  color: {\n    type: String,\n    required: false,\n    default: 'currentColor',\n  },\n  /** The CSS display property for the icon. Defaults to `block` */\n  display: {\n    type: String,\n    required: false,\n    default: 'block',\n  },\n  /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */\n  decorative: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  /** The icon size */\n  size: {\n    type: [Number, String],\n    required: false,\n    default: KUI_ICON_SIZE_50, // if setting to the imported const fails, just pass a number of 24 as the default.\n    validator: (sizeValue: number | string): boolean => {\n      if (typeof sizeValue === 'number' && sizeValue > 0) {\n        return true\n      }\n\n      if (typeof sizeValue === 'string') {\n        // Strip `px` from the string\n        const sanitizedSize = String(sizeValue).replace(/px/gi, '')\n        const sizeNumber = Number(sanitizedSize)\n        if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n          return true\n        }\n      }\n\n      return false\n    },\n  },\n  /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n  as: {\n    type: String,\n    required: false,\n    default: 'span',\n  },\n  /** A boolean to enable prefixing any internal SVG ids with a unique string; useful when there are potentially multiple SVG instances on the same page and the SVG utilizes ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to false during snapshot testing.\n   * Defaults to `true`.\n   */\n  randomizeIds: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nconst svgElement = ref<SVGElement | null>(null)\n\nconst iconSize = computed((): string => {\n  // If props.size is a number, ensure it's greater than zero\n  if (typeof props.size === 'number' && props.size > 0) {\n    return `${props.size}px`\n  }\n\n  if (typeof props.size === 'string') {\n    // Strip `px` from the string\n    const sanitizedSize = String(props.size).replace(/px/gi, '')\n    const sizeNumber = Number(sanitizedSize)\n    if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n      return `${sizeNumber}px`\n    }\n  }\n\n  // Return the default icon size\n  return KUI_ICON_SIZE_50\n})\n\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * All of the properties should be mapped to component props for customization.\n */\nconst rootElementStyles = computed((): Record<string, string> => ({\n  boxSizing: 'border-box',\n  color: props.color,\n  display: props.display,\n  flexShrink: '0',\n  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n\n/**\n * Prefix all ids within the SVG element and update all corresponding references to these ids. This is useful to avoid id conflicts when utilizing multiple instances of the same SVG in the DOM.\n *\n * @param {SVGElement} svgElement - The SVG element whose potential IDs need to be prefixed.\n */\nconst prefixSvgIds = (svgElement: SVGElement): void => {\n  if (!svgElement) {\n    return\n  }\n\n  const defsElement = svgElement.querySelector('defs')\n\n  // Prepare a map to store the original and new IDs for quick lookups\n  const idMap: Record<string, string> = {}\n\n  if (defsElement) {\n    // Prefix all direct children of <defs> that have an `id`\n    defsElement.querySelectorAll('[id]').forEach((element) => {\n      const originalId = element.getAttribute('id')\n      const newId = `${Math.random().toString(36).substring(2, 12)}-${originalId}`\n\n      // Map old id to new id\n      idMap[originalId!] = newId\n\n      // Update the element's id with the new prefixed id\n      element.setAttribute('id', newId)\n    })\n  }\n\n  // Step 2: Update all references to these prefixed IDs in attributes like `url(#id)`, `href`, `xlink:href`\n  const referencingAttributes = ['fill', 'stroke', 'filter', 'mask', 'clip-path', 'xlink:href', 'href']\n\n  // Function to update references to IDs in attributes\n  const updateReferences = (element: Element): void => {\n    referencingAttributes.forEach((attr) => {\n      const attrValue = element.getAttribute(attr)\n      if (attrValue) {\n        // Match any url(#id) or href=\"#id\" references\n        const updatedValue = attrValue.replace(/url\\(#([^)]+)\\)/g, (match, id) => {\n          return idMap[id] ? `url(#${idMap[id]})` : match\n        }).replace(/#([^\\s]+)/g, (match, id) => {\n          return idMap[id] ? `#${idMap[id]}` : match\n        })\n\n        // If the value changed, update the attribute\n        if (updatedValue !== attrValue) {\n          element.setAttribute(attr, updatedValue)\n        }\n      }\n    })\n  }\n\n  // Traverse all elements in the SVG to update ID references\n  svgElement.querySelectorAll('*').forEach((element) => {\n    updateReferences(element)\n  })\n}\n\nonMounted(() => {\n  if (props.randomizeIds && svgElement.value) {\n    prefixSvgIds(svgElement.value)\n  }\n})\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon flag-kh-icon\"\n    data-testid=\"kui-icon-wrapper-flag-kh-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      ref=\"svgElement\"\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-flag-kh-icon\"\n      fill=\"none\"\n      height=\"100%\"\n      role=\"img\"\n      viewBox=\"0 0 24 24\"\n      width=\"100%\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title\n        v-if=\"title\"\n        data-testid=\"kui-icon-svg-title\"\n      >\n        {{ title }}\n      </title>\n      <g clip-path=\"url(#clip0_1_2290)\">\n        <path\n          d=\"M0 11.9999C0 14.0788 0.528891 16.0342 1.45908 17.739L12 18.7825L22.5409 17.739C23.4711 16.0342 24 14.0788 24 11.9999C24 9.921 23.4711 7.96566 22.5409 6.26077L12 5.21729L1.45908 6.26077C0.528891 7.96566 0 9.921 0 11.9999H0Z\"\n          fill=\"#D80027\"\n        />\n        <path\n          d=\"M1.45911 6.26086H22.5409C20.5057 2.53073 16.5485 0 12 0C7.45151 0 3.49437 2.53073 1.45911 6.26086V6.26086Z\"\n          fill=\"#0052B4\"\n        />\n        <path\n          d=\"M12 24.0001C16.5485 24.0001 20.5057 21.4694 22.5409 17.7393H1.45911C3.49437 21.4694 7.45151 24.0001 12 24.0001Z\"\n          fill=\"#0052B4\"\n        />\n        <path\n          d=\"M16.1739 14.3481V12.7829H15.1305V10.6959L14.087 9.6524L13.0435 10.6959V8.60891L12 7.56543L10.9565 8.60891V10.6959L9.91306 9.6524L8.86958 10.6959V12.7829H7.82614V14.3481H6.78265V15.9133H17.2174V14.3481H16.1739Z\"\n          fill=\"#F0F0F0\"\n        />\n      </g>\n      <defs>\n        <clipPath id=\"clip0_1_2290\">\n          <rect\n            fill=\"white\"\n            height=\"24\"\n            width=\"24\"\n          />\n        </clipPath>\n      </defs>\n    </svg>\n  </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n"],"names":["props","__props","svgElement","ref","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIds","defsElement","idMap","element","originalId","newId","referencingAttributes","updateReferences","attr","attrValue","updatedValue","match","id","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GA+DRC,IAAaC,EAAuB,IAAI,GAExCC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOL,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMM,IAAgB,OAAON,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDO,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOL,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQI,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA,GAOIM,IAAe,CAACR,MAAiC;AACrD,UAAI,CAACA;AACH;AAGI,YAAAS,IAAcT,EAAW,cAAc,MAAM,GAG7CU,IAAgC,CAAA;AAEtC,MAAID,KAEFA,EAAY,iBAAiB,MAAM,EAAE,QAAQ,CAACE,MAAY;AAClD,cAAAC,IAAaD,EAAQ,aAAa,IAAI,GACtCE,IAAQ,GAAG,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE,CAAC,IAAID,CAAU;AAG1E,QAAAF,EAAME,CAAW,IAAIC,GAGbF,EAAA,aAAa,MAAME,CAAK;AAAA,MAAA,CACjC;AAIG,YAAAC,IAAwB,CAAC,QAAQ,UAAU,UAAU,QAAQ,aAAa,cAAc,MAAM,GAG9FC,IAAmB,CAACJ,MAA2B;AAC7B,QAAAG,EAAA,QAAQ,CAACE,MAAS;AAChC,gBAAAC,IAAYN,EAAQ,aAAaK,CAAI;AAC3C,cAAIC,GAAW;AAEb,kBAAMC,IAAeD,EAAU,QAAQ,oBAAoB,CAACE,GAAOC,MAC1DV,EAAMU,CAAE,IAAI,QAAQV,EAAMU,CAAE,CAAC,MAAMD,CAC3C,EAAE,QAAQ,cAAc,CAACA,GAAOC,MACxBV,EAAMU,CAAE,IAAI,IAAIV,EAAMU,CAAE,CAAC,KAAKD,CACtC;AAGD,YAAID,MAAiBD,KACXN,EAAA,aAAaK,GAAME,CAAY;AAAA,UAE3C;AAAA,QAAA,CACD;AAAA,MAAA;AAIHlB,MAAAA,EAAW,iBAAiB,GAAG,EAAE,QAAQ,CAACW,MAAY;AACpD,QAAAI,EAAiBJ,CAAO;AAAA,MAAA,CACzB;AAAA,IAAA;AAGH,WAAAU,EAAU,MAAM;AACV,MAAAvB,EAAM,gBAAgBE,EAAW,SACnCQ,EAAaR,EAAW,KAAK;AAAA,IAC/B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es682.js","sources":["../src/components/solid/RedoIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * RedoIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 24 Sep 2024 00:39:43 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed, ref, onMounted } from 'vue'\nimport { KUI_ICON_SIZE_50 } from '@kong/design-tokens'\n\nconst props = defineProps({\n  /** The accessibility text provided to screen readers */\n  title: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */\n  color: {\n    type: String,\n    required: false,\n    default: 'currentColor',\n  },\n  /** The CSS display property for the icon. Defaults to `block` */\n  display: {\n    type: String,\n    required: false,\n    default: 'block',\n  },\n  /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */\n  decorative: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  /** The icon size */\n  size: {\n    type: [Number, String],\n    required: false,\n    default: KUI_ICON_SIZE_50, // if setting to the imported const fails, just pass a number of 24 as the default.\n    validator: (sizeValue: number | string): boolean => {\n      if (typeof sizeValue === 'number' && sizeValue > 0) {\n        return true\n      }\n\n      if (typeof sizeValue === 'string') {\n        // Strip `px` from the string\n        const sanitizedSize = String(sizeValue).replace(/px/gi, '')\n        const sizeNumber = Number(sanitizedSize)\n        if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n          return true\n        }\n      }\n\n      return false\n    },\n  },\n  /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n  as: {\n    type: String,\n    required: false,\n    default: 'span',\n  },\n  /** A boolean to enable prefixing any internal SVG ids with a unique string; useful when there are potentially multiple SVG instances on the same page and the SVG utilizes ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to false during snapshot testing.\n   * Defaults to `true`.\n   */\n  randomizeIds: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nconst svgElement = ref<SVGElement | null>(null)\n\nconst iconSize = computed((): string => {\n  // If props.size is a number, ensure it's greater than zero\n  if (typeof props.size === 'number' && props.size > 0) {\n    return `${props.size}px`\n  }\n\n  if (typeof props.size === 'string') {\n    // Strip `px` from the string\n    const sanitizedSize = String(props.size).replace(/px/gi, '')\n    const sizeNumber = Number(sanitizedSize)\n    if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n      return `${sizeNumber}px`\n    }\n  }\n\n  // Return the default icon size\n  return KUI_ICON_SIZE_50\n})\n\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * All of the properties should be mapped to component props for customization.\n */\nconst rootElementStyles = computed((): Record<string, string> => ({\n  boxSizing: 'border-box',\n  color: props.color,\n  display: props.display,\n  flexShrink: '0',\n  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n\n/**\n * Prefix all ids within the SVG element and update all corresponding references to these ids. This is useful to avoid id conflicts when utilizing multiple instances of the same SVG in the DOM.\n *\n * @param {SVGElement} svgElement - The SVG element whose potential IDs need to be prefixed.\n */\nconst prefixSvgIds = (svgElement: SVGElement): void => {\n  if (!svgElement) {\n    return\n  }\n\n  const defsElement = svgElement.querySelector('defs')\n\n  // Prepare a map to store the original and new IDs for quick lookups\n  const idMap: Record<string, string> = {}\n\n  if (defsElement) {\n    // Prefix all direct children of <defs> that have an `id`\n    defsElement.querySelectorAll('[id]').forEach((element) => {\n      const originalId = element.getAttribute('id')\n      const newId = `${Math.random().toString(36).substring(2, 12)}-${originalId}`\n\n      // Map old id to new id\n      idMap[originalId!] = newId\n\n      // Update the element's id with the new prefixed id\n      element.setAttribute('id', newId)\n    })\n  }\n\n  // Update all references to these prefixed ids in attributes like `url(#id)`, `href`, `xlink:href`\n  const referencingAttributes = ['fill', 'stroke', 'filter', 'mask', 'clip-path', 'xlink:href', 'href']\n\n  // Function to update references to ids in attributes\n  const updateReferences = (element: Element): void => {\n    referencingAttributes.forEach((attr) => {\n      const attrValue = element.getAttribute(attr)\n      if (attrValue) {\n        // Match any url(#id) or href=\"#id\" references\n        const updatedValue = attrValue.replace(/url\\(#([^)]+)\\)/g, (match, id) => {\n          return idMap[id] ? `url(#${idMap[id]})` : match\n        }).replace(/#([^\\s]+)/g, (match, id) => {\n          return idMap[id] ? `#${idMap[id]}` : match\n        })\n\n        // If the value changed, update the attribute\n        if (updatedValue !== attrValue) {\n          element.setAttribute(attr, updatedValue)\n        }\n      }\n    })\n  }\n\n  // Traverse all elements in the SVG to update id references\n  svgElement.querySelectorAll('*').forEach((element) => {\n    updateReferences(element)\n  })\n}\n\nonMounted(() => {\n  if (props.randomizeIds && svgElement.value) {\n    prefixSvgIds(svgElement.value)\n  }\n})\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon redo-icon\"\n    data-testid=\"kui-icon-wrapper-redo-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      ref=\"svgElement\"\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-redo-icon\"\n      fill=\"none\"\n      height=\"100%\"\n      role=\"img\"\n      viewBox=\"0 0 24 24\"\n      width=\"100%\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title\n        v-if=\"title\"\n        data-testid=\"kui-icon-svg-title\"\n      >\n        {{ title }}\n      </title>\n      <path\n        d=\"M9.9 19C8.28333 19 6.89583 18.475 5.7375 17.425C4.57917 16.375 4 15.0667 4 13.5C4 11.9333 4.57917 10.625 5.7375 9.575C6.89583 8.525 8.28333 8 9.9 8H16.2L13.6 5.4L15 4L20 9L15 14L13.6 12.6L16.2 10H9.9C8.85 10 7.9375 10.3333 7.1625 11C6.3875 11.6667 6 12.5 6 13.5C6 14.5 6.3875 15.3333 7.1625 16C7.9375 16.6667 8.85 17 9.9 17H17V19H9.9Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n"],"names":["props","__props","svgElement","ref","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIds","defsElement","idMap","element","originalId","newId","referencingAttributes","updateReferences","attr","attrValue","updatedValue","match","id","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GA+DRC,IAAaC,EAAuB,IAAI,GAExCC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOL,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMM,IAAgB,OAAON,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDO,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOL,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQI,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA,GAOIM,IAAe,CAACR,MAAiC;AACrD,UAAI,CAACA;AACH;AAGI,YAAAS,IAAcT,EAAW,cAAc,MAAM,GAG7CU,IAAgC,CAAA;AAEtC,MAAID,KAEFA,EAAY,iBAAiB,MAAM,EAAE,QAAQ,CAACE,MAAY;AAClD,cAAAC,IAAaD,EAAQ,aAAa,IAAI,GACtCE,IAAQ,GAAG,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE,CAAC,IAAID,CAAU;AAG1E,QAAAF,EAAME,CAAW,IAAIC,GAGbF,EAAA,aAAa,MAAME,CAAK;AAAA,MAAA,CACjC;AAIG,YAAAC,IAAwB,CAAC,QAAQ,UAAU,UAAU,QAAQ,aAAa,cAAc,MAAM,GAG9FC,IAAmB,CAACJ,MAA2B;AAC7B,QAAAG,EAAA,QAAQ,CAACE,MAAS;AAChC,gBAAAC,IAAYN,EAAQ,aAAaK,CAAI;AAC3C,cAAIC,GAAW;AAEb,kBAAMC,IAAeD,EAAU,QAAQ,oBAAoB,CAACE,GAAOC,MAC1DV,EAAMU,CAAE,IAAI,QAAQV,EAAMU,CAAE,CAAC,MAAMD,CAC3C,EAAE,QAAQ,cAAc,CAACA,GAAOC,MACxBV,EAAMU,CAAE,IAAI,IAAIV,EAAMU,CAAE,CAAC,KAAKD,CACtC;AAGD,YAAID,MAAiBD,KACXN,EAAA,aAAaK,GAAME,CAAY;AAAA,UAE3C;AAAA,QAAA,CACD;AAAA,MAAA;AAIHlB,MAAAA,EAAW,iBAAiB,GAAG,EAAE,QAAQ,CAACW,MAAY;AACpD,QAAAI,EAAiBJ,CAAO;AAAA,MAAA,CACzB;AAAA,IAAA;AAGH,WAAAU,EAAU,MAAM;AACV,MAAAvB,EAAM,gBAAgBE,EAAW,SACnCQ,EAAaR,EAAW,KAAK;AAAA,IAC/B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es684.js

@@ -1,51 +1,13 @@
-import { defineComponent as k, ref as x, computed as h, onMounted as z, openBlock as u, createBlock as I, resolveDynamicComponent as N, normalizeStyle as _, withCtx as w, createElementBlock as g, toDisplayString as F, createCommentVNode as M, pushScopeId as q, popScopeId as A, createElementVNode as t } from "vue";
+import { defineComponent as v, ref as k, computed as g, onMounted as x, openBlock as u, createBlock as z, resolveDynamicComponent as I, normalizeStyle as N, withCtx as w, createElementBlock as h, toDisplayString as q, createCommentVNode as E, pushScopeId as _, popScopeId as A, createElementVNode as B } from "vue";
 import { KUI_ICON_SIZE_50 as m } from "./kong-icons.es1218.js";
-const y = (e) => (q("data-v-131f13f9"), e = e(), A(), e), B = ["aria-hidden"], E = {
+const $ = (e) => (_("data-v-7fde0cab"), e = e(), A(), e), H = ["aria-hidden"], M = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, Z = /* @__PURE__ */ y(() => /* @__PURE__ */ t("g", { "clip-path": "url(#clip0_1_2373)" }, [
-  /* @__PURE__ */ t("path", {
-    d: "M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12",
-    fill: "#D80027"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M16.1739 11.16L14.4683 11.9622L15.3766 13.614L13.5246 13.2597L13.29 15.1305L12 13.7545L10.71 15.1305L10.4754 13.2597L8.62341 13.6139L9.53161 11.9622L7.82611 11.16L9.53161 10.3577L8.62341 8.70605L10.4753 9.06023L10.71 7.18945L12 8.56537L13.29 7.18945L13.5246 9.06023L15.3766 8.70605L14.4685 10.3578L16.1739 11.16Z",
-    fill: "#FFDA44"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M15.1305 3.913H12.7826C12.7826 3.48086 12.4322 3.13037 12 3.13037C11.5678 3.13037 11.2174 3.48081 11.2174 3.913H8.86957C8.86957 4.34518 9.24607 4.69562 9.67826 4.69562H9.65215C9.65215 5.12781 10.0025 5.47825 10.4348 5.47825C10.4348 5.91043 10.7851 6.26087 11.2174 6.26087H12.7826C13.2147 6.26087 13.5652 5.91048 13.5652 5.47825C13.9974 5.47825 14.3478 5.12786 14.3478 4.69562H14.3217C14.754 4.69562 15.1305 4.34523 15.1305 3.913V3.913Z",
-    fill: "#FFDA44"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M24 12C24 18.6274 18.6274 24 12 24C5.37262 24 0 18.6274 0 12H24Z",
-    fill: "#F0F0F0"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M12 24C15.751 24 19.0995 22.2785 21.3001 19.583C20.9043 19.3132 20.6906 18.877 19.9998 18.877C18.9998 18.877 18.9998 19.7913 17.9999 19.7913C17 19.7913 16.9999 18.877 16 18.877C15 18.877 15 19.7913 14 19.7913C12.9999 19.7913 12.9999 18.877 11.9998 18.877C10.9998 18.877 10.9998 19.7913 9.99989 19.7913C9.00005 19.7913 9.00005 18.877 8.00006 18.877C6.99999 18.877 6.99999 19.7913 5.99991 19.7913C4.99983 19.7913 4.99983 18.877 3.99975 18.877C3.3091 18.877 3.09539 19.3131 2.69977 19.5829C4.90027 22.2785 8.24892 24 12 24V24Z",
-    fill: "#0052B4"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M21.9999 13.5306C20.9999 13.5306 20.9999 12.6162 19.9998 12.6162C18.9999 12.6162 18.9999 13.5306 17.9999 13.5306C17 13.5306 16.9999 12.6162 16 12.6162C15 12.6162 15 13.5306 14 13.5306C13 13.5306 12.9999 12.6162 11.9998 12.6162C10.9998 12.6162 10.9998 13.5306 9.99991 13.5306C9.00006 13.5306 9.00006 12.6162 8.00008 12.6162C7 12.6162 7 13.5306 5.99992 13.5306C4.99984 13.5306 4.99984 12.6162 3.99977 12.6162C2.99992 12.6162 2.99992 13.5306 1.99994 13.5306C1.00534 13.5306 0.999578 12.6263 0.015625 12.6166C0.0433281 13.1655 0.108859 13.7044 0.207953 14.2314C1.00502 14.3485 1.07481 15.1305 1.99998 15.1305C2.99997 15.1305 2.99997 14.2163 3.99981 14.2163C4.99989 14.2163 4.99989 15.1305 5.99997 15.1305C7.00005 15.1305 7.00005 14.2163 8.00013 14.2163C9.00011 14.2163 9.00011 15.1305 9.99995 15.1305C10.9999 15.1305 10.9999 14.2163 11.9999 14.2163C13 14.2163 13 15.1305 14 15.1305C15.0001 15.1305 15.0001 14.2163 16 14.2163C17 14.2163 17 15.1305 18 15.1305C18.9999 15.1305 19 14.2163 19.9999 14.2163C21 14.2163 21 15.1305 21.9999 15.1305C22.9252 15.1305 22.995 14.3486 23.7921 14.2314C23.8912 13.7044 23.9567 13.1656 23.9845 12.6167C23.0004 12.6264 22.9945 13.5306 21.9999 13.5306V13.5306Z",
-    fill: "#0052B4"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M19.9998 15.7466C18.9998 15.7466 18.9998 16.6609 17.9999 16.6609C17 16.6609 16.9999 15.7466 16 15.7466C15 15.7466 15 16.6609 14 16.6609C12.9999 16.6609 12.9999 15.7466 11.9998 15.7466C10.9998 15.7466 10.9998 16.6609 9.99989 16.6609C9.00005 16.6609 9.00005 15.7466 8.00006 15.7466C6.99998 15.7466 6.99998 16.6609 5.9999 16.6609C4.99983 16.6609 4.99983 15.7466 3.99975 15.7466C2.9999 15.7466 2.9999 16.6609 1.99992 16.6609C1.2854 16.6609 1.08131 16.1942 0.658264 15.9276C0.939889 16.7413 1.30626 17.5154 1.7475 18.2389C1.82423 18.2531 1.90776 18.2609 1.99992 18.2609C2.9999 18.2609 2.9999 17.3467 3.99975 17.3467C4.99983 17.3467 4.99983 18.2609 5.9999 18.2609C6.99998 18.2609 6.99998 17.3467 8.00006 17.3467C9.00005 17.3467 9.00005 18.2609 9.99989 18.2609C10.9999 18.2609 10.9999 17.3467 11.9998 17.3467C12.9999 17.3467 12.9999 18.2609 14 18.2609C15 18.2609 15 17.3467 16 17.3467C17 17.3467 17 18.2609 17.9999 18.2609C18.9998 18.2609 18.9999 17.3467 19.9998 17.3467C20.9999 17.3467 20.9999 18.2609 21.9998 18.2609C22.0921 18.2609 22.1756 18.2531 22.2524 18.2389C22.6936 17.5154 23.0599 16.7413 23.3417 15.9277C22.9186 16.1941 22.7145 16.6609 21.9998 16.6609C20.9999 16.6609 20.9999 15.7466 19.9998 15.7466Z",
-    fill: "#0052B4"
-  }),
-  /* @__PURE__ */ t("path", {
-    d: "M23.9628 11.0518C23.0004 11.0745 22.9872 11.9651 21.9998 11.9651C20.9999 11.9651 20.9999 11.0508 19.9998 11.0508C18.9998 11.0508 18.9998 11.9651 17.9999 11.9651C17 11.9651 16.9999 11.0508 16 11.0508C15 11.0508 15 11.9651 14 11.9651C12.9999 11.9651 12.9999 11.0508 11.9998 11.0508C10.9998 11.0508 10.9998 11.9651 9.99989 11.9651C9.00005 11.9651 9.00005 11.0508 8.00006 11.0508C6.99998 11.0508 6.99998 11.9651 5.99991 11.9651C4.99983 11.9651 4.99983 11.0508 3.99975 11.0508C2.99991 11.0508 2.99991 11.9651 1.99992 11.9651C1.01278 11.9651 0.999422 11.0746 0.0371719 11.0518C0.01275 11.3647 0 11.6808 0 11.9999C0 12.2184 0.0061875 12.4356 0.0178594 12.6513C0.999563 12.6623 1.00608 13.5651 1.99997 13.5651C2.99995 13.5651 2.99995 12.6508 3.9998 12.6508C4.99988 12.6508 4.99988 13.5651 5.99995 13.5651C7.00003 13.5651 7.00003 12.6508 8.00011 12.6508C9.00009 12.6508 9.00009 13.5651 9.99994 13.5651C10.9999 13.5651 10.9999 12.6508 11.9999 12.6508C12.9999 12.6508 12.9999 13.5651 14 13.5651C15.0001 13.5651 15.0001 12.6508 16 12.6508C17 12.6508 17 13.5651 18 13.5651C18.9999 13.5651 18.9999 12.6508 19.9999 12.6508C21 12.6508 21 13.5651 21.9999 13.5651C22.9939 13.5651 23.0004 12.6623 23.9823 12.6513C23.9938 12.4356 24 12.2184 24 11.9999C24 11.6808 23.9872 11.3647 23.9628 11.0518V11.0518Z",
-    fill: "#F0F0F0"
-  })
-], -1)), H = /* @__PURE__ */ y(() => /* @__PURE__ */ t("defs", null, [
-  /* @__PURE__ */ t("clipPath", { id: "clip0_1_2373" }, [
-    /* @__PURE__ */ t("rect", {
-      fill: "white",
-      height: "24",
-      width: "24"
-    })
-  ])
-], -1)), V = /* @__PURE__ */ k({
-  __name: "FlagKiIcon",
+}, V = /* @__PURE__ */ $(() => /* @__PURE__ */ B("path", {
+  d: "M12 20C9.76667 20 7.875 19.225 6.325 17.675C4.775 16.125 4 14.2333 4 12C4 9.76667 4.775 7.875 6.325 6.325C7.875 4.775 9.76667 4 12 4C13.15 4 14.25 4.2375 15.3 4.7125C16.35 5.1875 17.25 5.86667 18 6.75V4H20V11H13V9H17.2C16.6667 8.06667 15.9375 7.33333 15.0125 6.8C14.0875 6.26667 13.0833 6 12 6C10.3333 6 8.91667 6.58333 7.75 7.75C6.58333 8.91667 6 10.3333 6 12C6 13.6667 6.58333 15.0833 7.75 16.25C8.91667 17.4167 10.3333 18 12 18C13.2833 18 14.4417 17.6333 15.475 16.9C16.5083 16.1667 17.2333 15.2 17.65 14H19.75C19.2833 15.7667 18.3333 17.2083 16.9 18.325C15.4667 19.4417 13.8333 20 12 20Z",
+  fill: "currentColor"
+}, null, -1)), Z = /* @__PURE__ */ v({
+  __name: "RefreshIcon",
   props: {
     /** The accessibility text provided to screen readers */
     title: {
@@ -81,8 +43,8 @@ const y = (e) => (q("data-v-131f13f9"), e = e(), A(), e), B = ["aria-hidden"], E
         if (typeof e == "number" && e > 0)
           return !0;
         if (typeof e == "string") {
-          const i = String(e).replace(/px/gi, ""), C = Number(i);
-          if (C && !isNaN(C) && Number.isInteger(C) && C > 0)
+          const t = String(e).replace(/px/gi, ""), i = Number(t);
+          if (i && !isNaN(i) && Number.isInteger(i) && i > 0)
             return !0;
         }
         return !1;
@@ -104,58 +66,58 @@ const y = (e) => (q("data-v-131f13f9"), e = e(), A(), e), B = ["aria-hidden"], E
     }
   },
   setup(e) {
-    const i = e, C = x(null), f = h(() => {
-      if (typeof i.size == "number" && i.size > 0)
-        return `${i.size}px`;
-      if (typeof i.size == "string") {
-        const o = String(i.size).replace(/px/gi, ""), r = Number(o);
+    const t = e, i = k(null), f = g(() => {
+      if (typeof t.size == "number" && t.size > 0)
+        return `${t.size}px`;
+      if (typeof t.size == "string") {
+        const n = String(t.size).replace(/px/gi, ""), r = Number(n);
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
       return m;
-    }), S = h(() => ({
+    }), y = g(() => ({
       boxSizing: "border-box",
-      color: i.color,
-      display: i.display,
+      color: t.color,
+      display: t.display,
       flexShrink: "0",
       height: f.value,
       lineHeight: "0",
       width: f.value
-    })), L = (o) => {
-      if (!o)
+    })), S = (n) => {
+      if (!n)
         return;
-      const r = o.querySelector("defs"), a = {};
-      r && r.querySelectorAll("[id]").forEach((l) => {
-        const s = l.getAttribute("id"), n = `${Math.random().toString(36).substring(2, 12)}-${s}`;
-        a[s] = n, l.setAttribute("id", n);
+      const r = n.querySelector("defs"), s = {};
+      r && r.querySelectorAll("[id]").forEach((o) => {
+        const l = o.getAttribute("id"), a = `${Math.random().toString(36).substring(2, 12)}-${l}`;
+        s[l] = a, o.setAttribute("id", a);
       });
-      const b = ["fill", "stroke", "filter", "mask", "clip-path", "xlink:href", "href"], v = (l) => {
-        b.forEach((s) => {
-          const n = l.getAttribute(s);
-          if (n) {
-            const p = n.replace(/url\(#([^)]+)\)/g, (c, d) => a[d] ? `url(#${a[d]})` : c).replace(/#([^\s]+)/g, (c, d) => a[d] ? `#${a[d]}` : c);
-            p !== n && l.setAttribute(s, p);
+      const C = ["fill", "stroke", "filter", "mask", "clip-path", "xlink:href", "href"], b = (o) => {
+        C.forEach((l) => {
+          const a = o.getAttribute(l);
+          if (a) {
+            const p = a.replace(/url\(#([^)]+)\)/g, (c, d) => s[d] ? `url(#${s[d]})` : c).replace(/#([^\s]+)/g, (c, d) => s[d] ? `#${s[d]}` : c);
+            p !== a && o.setAttribute(l, p);
           }
         });
       };
-      o.querySelectorAll("*").forEach((l) => {
-        v(l);
+      n.querySelectorAll("*").forEach((o) => {
+        b(o);
       });
     };
-    return z(() => {
-      i.randomizeIds && C.value && L(C.value);
-    }), (o, r) => (u(), I(N(e.as), {
+    return x(() => {
+      t.randomizeIds && i.value && S(i.value);
+    }), (n, r) => (u(), z(I(e.as), {
       "aria-hidden": e.decorative ? "true" : void 0,
-      class: "kui-icon flag-ki-icon",
-      "data-testid": "kui-icon-wrapper-flag-ki-icon",
-      style: _(S.value)
+      class: "kui-icon refresh-icon",
+      "data-testid": "kui-icon-wrapper-refresh-icon",
+      style: N(y.value)
     }, {
       default: w(() => [
-        (u(), g("svg", {
+        (u(), h("svg", {
           ref_key: "svgElement",
-          ref: C,
+          ref: i,
           "aria-hidden": e.decorative ? "true" : void 0,
-          "data-testid": "kui-icon-svg-flag-ki-icon",
+          "data-testid": "kui-icon-svg-refresh-icon",
           fill: "none",
           height: "100%",
           role: "img",
@@ -163,16 +125,15 @@ const y = (e) => (q("data-v-131f13f9"), e = e(), A(), e), B = ["aria-hidden"], E
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (u(), g("title", E, F(e.title), 1)) : M("", !0),
-          Z,
-          H
-        ], 8, B))
+          e.title ? (u(), h("title", M, q(e.title), 1)) : E("", !0),
+          V
+        ], 8, H))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
 });
 export {
-  V as default
+  Z as default
 };
 //# sourceMappingURL=kong-icons.es684.js.map

package/dist/kong-icons.es684.js.map

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es684.js","sources":["../src/components/flags/FlagKiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * FlagKiIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 24 Sep 2024 00:35:22 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed, ref, onMounted } from 'vue'\nimport { KUI_ICON_SIZE_50 } from '@kong/design-tokens'\n\nconst props = defineProps({\n  /** The accessibility text provided to screen readers */\n  title: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */\n  color: {\n    type: String,\n    required: false,\n    default: 'currentColor',\n  },\n  /** The CSS display property for the icon. Defaults to `block` */\n  display: {\n    type: String,\n    required: false,\n    default: 'block',\n  },\n  /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */\n  decorative: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  /** The icon size */\n  size: {\n    type: [Number, String],\n    required: false,\n    default: KUI_ICON_SIZE_50, // if setting to the imported const fails, just pass a number of 24 as the default.\n    validator: (sizeValue: number | string): boolean => {\n      if (typeof sizeValue === 'number' && sizeValue > 0) {\n        return true\n      }\n\n      if (typeof sizeValue === 'string') {\n        // Strip `px` from the string\n        const sanitizedSize = String(sizeValue).replace(/px/gi, '')\n        const sizeNumber = Number(sanitizedSize)\n        if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n          return true\n        }\n      }\n\n      return false\n    },\n  },\n  /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n  as: {\n    type: String,\n    required: false,\n    default: 'span',\n  },\n  /** A boolean to enable prefixing any internal SVG ids with a unique string; useful when there are potentially multiple SVG instances on the same page and the SVG utilizes ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to false during snapshot testing.\n   * Defaults to `true`.\n   */\n  randomizeIds: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nconst svgElement = ref<SVGElement | null>(null)\n\nconst iconSize = computed((): string => {\n  // If props.size is a number, ensure it's greater than zero\n  if (typeof props.size === 'number' && props.size > 0) {\n    return `${props.size}px`\n  }\n\n  if (typeof props.size === 'string') {\n    // Strip `px` from the string\n    const sanitizedSize = String(props.size).replace(/px/gi, '')\n    const sizeNumber = Number(sanitizedSize)\n    if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n      return `${sizeNumber}px`\n    }\n  }\n\n  // Return the default icon size\n  return KUI_ICON_SIZE_50\n})\n\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * All of the properties should be mapped to component props for customization.\n */\nconst rootElementStyles = computed((): Record<string, string> => ({\n  boxSizing: 'border-box',\n  color: props.color,\n  display: props.display,\n  flexShrink: '0',\n  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n\n/**\n * Prefix all ids within the SVG element and update all corresponding references to these ids. This is useful to avoid id conflicts when utilizing multiple instances of the same SVG in the DOM.\n *\n * @param {SVGElement} svgElement - The SVG element whose potential IDs need to be prefixed.\n */\nconst prefixSvgIds = (svgElement: SVGElement): void => {\n  if (!svgElement) {\n    return\n  }\n\n  const defsElement = svgElement.querySelector('defs')\n\n  // Prepare a map to store the original and new IDs for quick lookups\n  const idMap: Record<string, string> = {}\n\n  if (defsElement) {\n    // Prefix all direct children of <defs> that have an `id`\n    defsElement.querySelectorAll('[id]').forEach((element) => {\n      const originalId = element.getAttribute('id')\n      const newId = `${Math.random().toString(36).substring(2, 12)}-${originalId}`\n\n      // Map old id to new id\n      idMap[originalId!] = newId\n\n      // Update the element's id with the new prefixed id\n      element.setAttribute('id', newId)\n    })\n  }\n\n  // Step 2: Update all references to these prefixed IDs in attributes like `url(#id)`, `href`, `xlink:href`\n  const referencingAttributes = ['fill', 'stroke', 'filter', 'mask', 'clip-path', 'xlink:href', 'href']\n\n  // Function to update references to IDs in attributes\n  const updateReferences = (element: Element): void => {\n    referencingAttributes.forEach((attr) => {\n      const attrValue = element.getAttribute(attr)\n      if (attrValue) {\n        // Match any url(#id) or href=\"#id\" references\n        const updatedValue = attrValue.replace(/url\\(#([^)]+)\\)/g, (match, id) => {\n          return idMap[id] ? `url(#${idMap[id]})` : match\n        }).replace(/#([^\\s]+)/g, (match, id) => {\n          return idMap[id] ? `#${idMap[id]}` : match\n        })\n\n        // If the value changed, update the attribute\n        if (updatedValue !== attrValue) {\n          element.setAttribute(attr, updatedValue)\n        }\n      }\n    })\n  }\n\n  // Traverse all elements in the SVG to update ID references\n  svgElement.querySelectorAll('*').forEach((element) => {\n    updateReferences(element)\n  })\n}\n\nonMounted(() => {\n  if (props.randomizeIds && svgElement.value) {\n    prefixSvgIds(svgElement.value)\n  }\n})\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon flag-ki-icon\"\n    data-testid=\"kui-icon-wrapper-flag-ki-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      ref=\"svgElement\"\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-flag-ki-icon\"\n      fill=\"none\"\n      height=\"100%\"\n      role=\"img\"\n      viewBox=\"0 0 24 24\"\n      width=\"100%\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title\n        v-if=\"title\"\n        data-testid=\"kui-icon-svg-title\"\n      >\n        {{ title }}\n      </title>\n      <g clip-path=\"url(#clip0_1_2373)\">\n        <path\n          d=\"M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12\"\n          fill=\"#D80027\"\n        />\n        <path\n          d=\"M16.1739 11.16L14.4683 11.9622L15.3766 13.614L13.5246 13.2597L13.29 15.1305L12 13.7545L10.71 15.1305L10.4754 13.2597L8.62341 13.6139L9.53161 11.9622L7.82611 11.16L9.53161 10.3577L8.62341 8.70605L10.4753 9.06023L10.71 7.18945L12 8.56537L13.29 7.18945L13.5246 9.06023L15.3766 8.70605L14.4685 10.3578L16.1739 11.16Z\"\n          fill=\"#FFDA44\"\n        />\n        <path\n          d=\"M15.1305 3.913H12.7826C12.7826 3.48086 12.4322 3.13037 12 3.13037C11.5678 3.13037 11.2174 3.48081 11.2174 3.913H8.86957C8.86957 4.34518 9.24607 4.69562 9.67826 4.69562H9.65215C9.65215 5.12781 10.0025 5.47825 10.4348 5.47825C10.4348 5.91043 10.7851 6.26087 11.2174 6.26087H12.7826C13.2147 6.26087 13.5652 5.91048 13.5652 5.47825C13.9974 5.47825 14.3478 5.12786 14.3478 4.69562H14.3217C14.754 4.69562 15.1305 4.34523 15.1305 3.913V3.913Z\"\n          fill=\"#FFDA44\"\n        />\n        <path\n          d=\"M24 12C24 18.6274 18.6274 24 12 24C5.37262 24 0 18.6274 0 12H24Z\"\n          fill=\"#F0F0F0\"\n        />\n        <path\n          d=\"M12 24C15.751 24 19.0995 22.2785 21.3001 19.583C20.9043 19.3132 20.6906 18.877 19.9998 18.877C18.9998 18.877 18.9998 19.7913 17.9999 19.7913C17 19.7913 16.9999 18.877 16 18.877C15 18.877 15 19.7913 14 19.7913C12.9999 19.7913 12.9999 18.877 11.9998 18.877C10.9998 18.877 10.9998 19.7913 9.99989 19.7913C9.00005 19.7913 9.00005 18.877 8.00006 18.877C6.99999 18.877 6.99999 19.7913 5.99991 19.7913C4.99983 19.7913 4.99983 18.877 3.99975 18.877C3.3091 18.877 3.09539 19.3131 2.69977 19.5829C4.90027 22.2785 8.24892 24 12 24V24Z\"\n          fill=\"#0052B4\"\n        />\n        <path\n          d=\"M21.9999 13.5306C20.9999 13.5306 20.9999 12.6162 19.9998 12.6162C18.9999 12.6162 18.9999 13.5306 17.9999 13.5306C17 13.5306 16.9999 12.6162 16 12.6162C15 12.6162 15 13.5306 14 13.5306C13 13.5306 12.9999 12.6162 11.9998 12.6162C10.9998 12.6162 10.9998 13.5306 9.99991 13.5306C9.00006 13.5306 9.00006 12.6162 8.00008 12.6162C7 12.6162 7 13.5306 5.99992 13.5306C4.99984 13.5306 4.99984 12.6162 3.99977 12.6162C2.99992 12.6162 2.99992 13.5306 1.99994 13.5306C1.00534 13.5306 0.999578 12.6263 0.015625 12.6166C0.0433281 13.1655 0.108859 13.7044 0.207953 14.2314C1.00502 14.3485 1.07481 15.1305 1.99998 15.1305C2.99997 15.1305 2.99997 14.2163 3.99981 14.2163C4.99989 14.2163 4.99989 15.1305 5.99997 15.1305C7.00005 15.1305 7.00005 14.2163 8.00013 14.2163C9.00011 14.2163 9.00011 15.1305 9.99995 15.1305C10.9999 15.1305 10.9999 14.2163 11.9999 14.2163C13 14.2163 13 15.1305 14 15.1305C15.0001 15.1305 15.0001 14.2163 16 14.2163C17 14.2163 17 15.1305 18 15.1305C18.9999 15.1305 19 14.2163 19.9999 14.2163C21 14.2163 21 15.1305 21.9999 15.1305C22.9252 15.1305 22.995 14.3486 23.7921 14.2314C23.8912 13.7044 23.9567 13.1656 23.9845 12.6167C23.0004 12.6264 22.9945 13.5306 21.9999 13.5306V13.5306Z\"\n          fill=\"#0052B4\"\n        />\n        <path\n          d=\"M19.9998 15.7466C18.9998 15.7466 18.9998 16.6609 17.9999 16.6609C17 16.6609 16.9999 15.7466 16 15.7466C15 15.7466 15 16.6609 14 16.6609C12.9999 16.6609 12.9999 15.7466 11.9998 15.7466C10.9998 15.7466 10.9998 16.6609 9.99989 16.6609C9.00005 16.6609 9.00005 15.7466 8.00006 15.7466C6.99998 15.7466 6.99998 16.6609 5.9999 16.6609C4.99983 16.6609 4.99983 15.7466 3.99975 15.7466C2.9999 15.7466 2.9999 16.6609 1.99992 16.6609C1.2854 16.6609 1.08131 16.1942 0.658264 15.9276C0.939889 16.7413 1.30626 17.5154 1.7475 18.2389C1.82423 18.2531 1.90776 18.2609 1.99992 18.2609C2.9999 18.2609 2.9999 17.3467 3.99975 17.3467C4.99983 17.3467 4.99983 18.2609 5.9999 18.2609C6.99998 18.2609 6.99998 17.3467 8.00006 17.3467C9.00005 17.3467 9.00005 18.2609 9.99989 18.2609C10.9999 18.2609 10.9999 17.3467 11.9998 17.3467C12.9999 17.3467 12.9999 18.2609 14 18.2609C15 18.2609 15 17.3467 16 17.3467C17 17.3467 17 18.2609 17.9999 18.2609C18.9998 18.2609 18.9999 17.3467 19.9998 17.3467C20.9999 17.3467 20.9999 18.2609 21.9998 18.2609C22.0921 18.2609 22.1756 18.2531 22.2524 18.2389C22.6936 17.5154 23.0599 16.7413 23.3417 15.9277C22.9186 16.1941 22.7145 16.6609 21.9998 16.6609C20.9999 16.6609 20.9999 15.7466 19.9998 15.7466Z\"\n          fill=\"#0052B4\"\n        />\n        <path\n          d=\"M23.9628 11.0518C23.0004 11.0745 22.9872 11.9651 21.9998 11.9651C20.9999 11.9651 20.9999 11.0508 19.9998 11.0508C18.9998 11.0508 18.9998 11.9651 17.9999 11.9651C17 11.9651 16.9999 11.0508 16 11.0508C15 11.0508 15 11.9651 14 11.9651C12.9999 11.9651 12.9999 11.0508 11.9998 11.0508C10.9998 11.0508 10.9998 11.9651 9.99989 11.9651C9.00005 11.9651 9.00005 11.0508 8.00006 11.0508C6.99998 11.0508 6.99998 11.9651 5.99991 11.9651C4.99983 11.9651 4.99983 11.0508 3.99975 11.0508C2.99991 11.0508 2.99991 11.9651 1.99992 11.9651C1.01278 11.9651 0.999422 11.0746 0.0371719 11.0518C0.01275 11.3647 0 11.6808 0 11.9999C0 12.2184 0.0061875 12.4356 0.0178594 12.6513C0.999563 12.6623 1.00608 13.5651 1.99997 13.5651C2.99995 13.5651 2.99995 12.6508 3.9998 12.6508C4.99988 12.6508 4.99988 13.5651 5.99995 13.5651C7.00003 13.5651 7.00003 12.6508 8.00011 12.6508C9.00009 12.6508 9.00009 13.5651 9.99994 13.5651C10.9999 13.5651 10.9999 12.6508 11.9999 12.6508C12.9999 12.6508 12.9999 13.5651 14 13.5651C15.0001 13.5651 15.0001 12.6508 16 12.6508C17 12.6508 17 13.5651 18 13.5651C18.9999 13.5651 18.9999 12.6508 19.9999 12.6508C21 12.6508 21 13.5651 21.9999 13.5651C22.9939 13.5651 23.0004 12.6623 23.9823 12.6513C23.9938 12.4356 24 12.2184 24 11.9999C24 11.6808 23.9872 11.3647 23.9628 11.0518V11.0518Z\"\n          fill=\"#F0F0F0\"\n        />\n      </g>\n      <defs>\n        <clipPath id=\"clip0_1_2373\">\n          <rect\n            fill=\"white\"\n            height=\"24\"\n            width=\"24\"\n          />\n        </clipPath>\n      </defs>\n    </svg>\n  </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n"],"names":["props","__props","svgElement","ref","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIds","defsElement","idMap","element","originalId","newId","referencingAttributes","updateReferences","attr","attrValue","updatedValue","match","id","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GA+DRC,IAAaC,EAAuB,IAAI,GAExCC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOL,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMM,IAAgB,OAAON,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDO,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOL,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQI,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA,GAOIM,IAAe,CAACR,MAAiC;AACrD,UAAI,CAACA;AACH;AAGI,YAAAS,IAAcT,EAAW,cAAc,MAAM,GAG7CU,IAAgC,CAAA;AAEtC,MAAID,KAEFA,EAAY,iBAAiB,MAAM,EAAE,QAAQ,CAACE,MAAY;AAClD,cAAAC,IAAaD,EAAQ,aAAa,IAAI,GACtCE,IAAQ,GAAG,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE,CAAC,IAAID,CAAU;AAG1E,QAAAF,EAAME,CAAW,IAAIC,GAGbF,EAAA,aAAa,MAAME,CAAK;AAAA,MAAA,CACjC;AAIG,YAAAC,IAAwB,CAAC,QAAQ,UAAU,UAAU,QAAQ,aAAa,cAAc,MAAM,GAG9FC,IAAmB,CAACJ,MAA2B;AAC7B,QAAAG,EAAA,QAAQ,CAACE,MAAS;AAChC,gBAAAC,IAAYN,EAAQ,aAAaK,CAAI;AAC3C,cAAIC,GAAW;AAEb,kBAAMC,IAAeD,EAAU,QAAQ,oBAAoB,CAACE,GAAOC,MAC1DV,EAAMU,CAAE,IAAI,QAAQV,EAAMU,CAAE,CAAC,MAAMD,CAC3C,EAAE,QAAQ,cAAc,CAACA,GAAOC,MACxBV,EAAMU,CAAE,IAAI,IAAIV,EAAMU,CAAE,CAAC,KAAKD,CACtC;AAGD,YAAID,MAAiBD,KACXN,EAAA,aAAaK,GAAME,CAAY;AAAA,UAE3C;AAAA,QAAA,CACD;AAAA,MAAA;AAIHlB,MAAAA,EAAW,iBAAiB,GAAG,EAAE,QAAQ,CAACW,MAAY;AACpD,QAAAI,EAAiBJ,CAAO;AAAA,MAAA,CACzB;AAAA,IAAA;AAGH,WAAAU,EAAU,MAAM;AACV,MAAAvB,EAAM,gBAAgBE,EAAW,SACnCQ,EAAaR,EAAW,KAAK;AAAA,IAC/B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es684.js","sources":["../src/components/solid/RefreshIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * RefreshIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 24 Sep 2024 00:39:43 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed, ref, onMounted } from 'vue'\nimport { KUI_ICON_SIZE_50 } from '@kong/design-tokens'\n\nconst props = defineProps({\n  /** The accessibility text provided to screen readers */\n  title: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */\n  color: {\n    type: String,\n    required: false,\n    default: 'currentColor',\n  },\n  /** The CSS display property for the icon. Defaults to `block` */\n  display: {\n    type: String,\n    required: false,\n    default: 'block',\n  },\n  /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */\n  decorative: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  /** The icon size */\n  size: {\n    type: [Number, String],\n    required: false,\n    default: KUI_ICON_SIZE_50, // if setting to the imported const fails, just pass a number of 24 as the default.\n    validator: (sizeValue: number | string): boolean => {\n      if (typeof sizeValue === 'number' && sizeValue > 0) {\n        return true\n      }\n\n      if (typeof sizeValue === 'string') {\n        // Strip `px` from the string\n        const sanitizedSize = String(sizeValue).replace(/px/gi, '')\n        const sizeNumber = Number(sanitizedSize)\n        if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n          return true\n        }\n      }\n\n      return false\n    },\n  },\n  /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n  as: {\n    type: String,\n    required: false,\n    default: 'span',\n  },\n  /** A boolean to enable prefixing any internal SVG ids with a unique string; useful when there are potentially multiple SVG instances on the same page and the SVG utilizes ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to false during snapshot testing.\n   * Defaults to `true`.\n   */\n  randomizeIds: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nconst svgElement = ref<SVGElement | null>(null)\n\nconst iconSize = computed((): string => {\n  // If props.size is a number, ensure it's greater than zero\n  if (typeof props.size === 'number' && props.size > 0) {\n    return `${props.size}px`\n  }\n\n  if (typeof props.size === 'string') {\n    // Strip `px` from the string\n    const sanitizedSize = String(props.size).replace(/px/gi, '')\n    const sizeNumber = Number(sanitizedSize)\n    if (sizeNumber && !isNaN(sizeNumber) && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n      return `${sizeNumber}px`\n    }\n  }\n\n  // Return the default icon size\n  return KUI_ICON_SIZE_50\n})\n\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * All of the properties should be mapped to component props for customization.\n */\nconst rootElementStyles = computed((): Record<string, string> => ({\n  boxSizing: 'border-box',\n  color: props.color,\n  display: props.display,\n  flexShrink: '0',\n  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n\n/**\n * Prefix all ids within the SVG element and update all corresponding references to these ids. This is useful to avoid id conflicts when utilizing multiple instances of the same SVG in the DOM.\n *\n * @param {SVGElement} svgElement - The SVG element whose potential IDs need to be prefixed.\n */\nconst prefixSvgIds = (svgElement: SVGElement): void => {\n  if (!svgElement) {\n    return\n  }\n\n  const defsElement = svgElement.querySelector('defs')\n\n  // Prepare a map to store the original and new IDs for quick lookups\n  const idMap: Record<string, string> = {}\n\n  if (defsElement) {\n    // Prefix all direct children of <defs> that have an `id`\n    defsElement.querySelectorAll('[id]').forEach((element) => {\n      const originalId = element.getAttribute('id')\n      const newId = `${Math.random().toString(36).substring(2, 12)}-${originalId}`\n\n      // Map old id to new id\n      idMap[originalId!] = newId\n\n      // Update the element's id with the new prefixed id\n      element.setAttribute('id', newId)\n    })\n  }\n\n  // Update all references to these prefixed ids in attributes like `url(#id)`, `href`, `xlink:href`\n  const referencingAttributes = ['fill', 'stroke', 'filter', 'mask', 'clip-path', 'xlink:href', 'href']\n\n  // Function to update references to ids in attributes\n  const updateReferences = (element: Element): void => {\n    referencingAttributes.forEach((attr) => {\n      const attrValue = element.getAttribute(attr)\n      if (attrValue) {\n        // Match any url(#id) or href=\"#id\" references\n        const updatedValue = attrValue.replace(/url\\(#([^)]+)\\)/g, (match, id) => {\n          return idMap[id] ? `url(#${idMap[id]})` : match\n        }).replace(/#([^\\s]+)/g, (match, id) => {\n          return idMap[id] ? `#${idMap[id]}` : match\n        })\n\n        // If the value changed, update the attribute\n        if (updatedValue !== attrValue) {\n          element.setAttribute(attr, updatedValue)\n        }\n      }\n    })\n  }\n\n  // Traverse all elements in the SVG to update id references\n  svgElement.querySelectorAll('*').forEach((element) => {\n    updateReferences(element)\n  })\n}\n\nonMounted(() => {\n  if (props.randomizeIds && svgElement.value) {\n    prefixSvgIds(svgElement.value)\n  }\n})\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon refresh-icon\"\n    data-testid=\"kui-icon-wrapper-refresh-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      ref=\"svgElement\"\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-refresh-icon\"\n      fill=\"none\"\n      height=\"100%\"\n      role=\"img\"\n      viewBox=\"0 0 24 24\"\n      width=\"100%\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title\n        v-if=\"title\"\n        data-testid=\"kui-icon-svg-title\"\n      >\n        {{ title }}\n      </title>\n      <path\n        d=\"M12 20C9.76667 20 7.875 19.225 6.325 17.675C4.775 16.125 4 14.2333 4 12C4 9.76667 4.775 7.875 6.325 6.325C7.875 4.775 9.76667 4 12 4C13.15 4 14.25 4.2375 15.3 4.7125C16.35 5.1875 17.25 5.86667 18 6.75V4H20V11H13V9H17.2C16.6667 8.06667 15.9375 7.33333 15.0125 6.8C14.0875 6.26667 13.0833 6 12 6C10.3333 6 8.91667 6.58333 7.75 7.75C6.58333 8.91667 6 10.3333 6 12C6 13.6667 6.58333 15.0833 7.75 16.25C8.91667 17.4167 10.3333 18 12 18C13.2833 18 14.4417 17.6333 15.475 16.9C16.5083 16.1667 17.2333 15.2 17.65 14H19.75C19.2833 15.7667 18.3333 17.2083 16.9 18.325C15.4667 19.4417 13.8333 20 12 20Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n"],"names":["props","__props","svgElement","ref","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIds","defsElement","idMap","element","originalId","newId","referencingAttributes","updateReferences","attr","attrValue","updatedValue","match","id","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GA+DRC,IAAaC,EAAuB,IAAI,GAExCC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOL,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMM,IAAgB,OAAON,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDO,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOL,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQI,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA,GAOIM,IAAe,CAACR,MAAiC;AACrD,UAAI,CAACA;AACH;AAGI,YAAAS,IAAcT,EAAW,cAAc,MAAM,GAG7CU,IAAgC,CAAA;AAEtC,MAAID,KAEFA,EAAY,iBAAiB,MAAM,EAAE,QAAQ,CAACE,MAAY;AAClD,cAAAC,IAAaD,EAAQ,aAAa,IAAI,GACtCE,IAAQ,GAAG,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE,CAAC,IAAID,CAAU;AAG1E,QAAAF,EAAME,CAAW,IAAIC,GAGbF,EAAA,aAAa,MAAME,CAAK;AAAA,MAAA,CACjC;AAIG,YAAAC,IAAwB,CAAC,QAAQ,UAAU,UAAU,QAAQ,aAAa,cAAc,MAAM,GAG9FC,IAAmB,CAACJ,MAA2B;AAC7B,QAAAG,EAAA,QAAQ,CAACE,MAAS;AAChC,gBAAAC,IAAYN,EAAQ,aAAaK,CAAI;AAC3C,cAAIC,GAAW;AAEb,kBAAMC,IAAeD,EAAU,QAAQ,oBAAoB,CAACE,GAAOC,MAC1DV,EAAMU,CAAE,IAAI,QAAQV,EAAMU,CAAE,CAAC,MAAMD,CAC3C,EAAE,QAAQ,cAAc,CAACA,GAAOC,MACxBV,EAAMU,CAAE,IAAI,IAAIV,EAAMU,CAAE,CAAC,KAAKD,CACtC;AAGD,YAAID,MAAiBD,KACXN,EAAA,aAAaK,GAAME,CAAY;AAAA,UAE3C;AAAA,QAAA,CACD;AAAA,MAAA;AAIHlB,MAAAA,EAAW,iBAAiB,GAAG,EAAE,QAAQ,CAACW,MAAY;AACpD,QAAAI,EAAiBJ,CAAO;AAAA,MAAA,CACzB;AAAA,IAAA;AAGH,WAAAU,EAAU,MAAM;AACV,MAAAvB,EAAM,gBAAgBE,EAAW,SACnCQ,EAAaR,EAAW,KAAK;AAAA,IAC/B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;"}