@kong/icons 1.20.5-pr.516.b7453b7.0 → 1.21.1

package/dist/kong-icons.es216.js

@@ -0,0 +1,136 @@
+import { defineComponent as v, computed as o, openBlock as s, createBlock as S, resolveDynamicComponent as L, normalizeStyle as y, withCtx as b, createElementBlock as x } from "vue";
+import { KUI_ICON_SIZE_50 as d } from "./kong-icons.es1256.js";
+const k = ["aria-hidden"], c = `<g clip-path="url(#clip0_1_2373)">
+<path d="M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12" fill="#D80027"/>
+<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"/>
+<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"/>
+<path d="M24 12C24 18.6274 18.6274 24 12 24C5.37262 24 0 18.6274 0 12H24Z" fill="#F0F0F0"/>
+<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"/>
+<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"/>
+<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"/>
+<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"/>
+</g>
+<defs>
+<clipPath id="clip0_1_2373">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>`, B = /* @__PURE__ */ v({
+  __name: "FlagKiIcon",
+  props: {
+    /** The accessibility text provided to screen readers */
+    title: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */
+    color: {
+      type: String,
+      required: !1,
+      default: "currentColor"
+    },
+    /** The CSS display property for the icon. Defaults to `block` */
+    display: {
+      type: String,
+      required: !1,
+      default: "block"
+    },
+    /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */
+    decorative: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    /** The icon size */
+    size: {
+      type: [Number, String],
+      required: !1,
+      default: d,
+      // if setting to the imported const fails, just pass a number of 24 as the default.
+      validator: (i) => {
+        if (typeof i == "number" && i > 0)
+          return !0;
+        if (typeof i == "string") {
+          const e = String(i).replace(/px/gi, ""), C = Number(e);
+          if (C && !isNaN(C) && Number.isInteger(C) && C > 0)
+            return !0;
+        }
+        return !1;
+      }
+    },
+    /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */
+    as: {
+      type: String,
+      required: !1,
+      default: "span"
+    },
+    /**
+     * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).
+     * Typically only set to `true` during snapshot testing.
+     * Defaults to `false`.
+     */
+    staticIds: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(i) {
+    const e = i, C = o(() => {
+      if (typeof e.size == "number" && e.size > 0)
+        return `${e.size}px`;
+      if (typeof e.size == "string") {
+        const r = String(e.size).replace(/px/gi, ""), t = Number(r);
+        if (t && !isNaN(t) && Number.isInteger(t) && t > 0)
+          return `${t}px`;
+      }
+      return d;
+    }), p = o(() => ({
+      boxSizing: "border-box",
+      color: e.color,
+      display: e.display,
+      flexShrink: "0",
+      height: C.value,
+      lineHeight: "0",
+      width: C.value,
+      pointerEvents: e.decorative ? "none" : void 0
+    })), u = (r) => {
+      const t = {}, m = Math.random().toString(36).substring(2, 12);
+      return r.replace(/id="([^"]+)"/g, (a, n) => {
+        const l = `${m}-${n}`;
+        return t[n] = l, `id="${l}"`;
+      }).replace(/#([^\s^")]+)/g, (a, n) => t[n] ? `#${t[n]}` : a);
+    }, f = {
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;",
+      "&": "&amp;"
+    }, g = (r) => r.replace(/[<>"'&]/g, (t) => f[t]), h = `${e.title ? `<title data-testid="kui-icon-svg-title">${g(e.title)}</title>` : ""}${e.staticIds ? c : u(c)}`;
+    return (r, t) => (s(), S(L(i.as), {
+      "aria-hidden": i.decorative ? "true" : void 0,
+      class: "kui-icon flag-ki-icon",
+      "data-testid": "kui-icon-wrapper-flag-ki-icon",
+      style: y(p.value),
+      tabindex: i.decorative ? "-1" : void 0
+    }, {
+      default: b(() => [
+        (s(), x("svg", {
+          "aria-hidden": i.decorative ? "true" : void 0,
+          "data-testid": "kui-icon-svg-flag-ki-icon",
+          fill: "none",
+          height: "100%",
+          role: "img",
+          viewBox: "0 0 24 24",
+          width: "100%",
+          xmlns: "http://www.w3.org/2000/svg",
+          innerHTML: h
+        }, null, 8, k))
+      ]),
+      _: 1
+    }, 8, ["aria-hidden", "style", "tabindex"]));
+  }
+});
+export {
+  B as default
+};
+//# sourceMappingURL=kong-icons.es216.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"kong-icons.es216.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, 04 Feb 2025 23:51:44 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } 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  /**\n   * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to `true` during snapshot testing.\n   * Defaults to `false`.\n   */\n  staticIds: {\n    type: Boolean,\n    default: false,\n  },\n})\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 | undefined> => ({\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  pointerEvents: props.decorative ? 'none' : undefined,\n}))\n\n/**\n * Prefix all SVG IDs in the given SVG string with a random prefix to ensure uniqueness.\n *\n * This function performs the following steps:\n * 1. Generates a random prefix.\n * 2. Replaces all `id` attributes in the SVG string with the new prefixed IDs.\n * 3. Updates all ID references (e.g., `url(#id)`, `href=\"#id\"`, etc.) to use the new prefixed IDs.\n *\n * @param {string} svgString - The SVG string in which to prefix IDs.\n * @returns {string} - The SVG string with prefixed IDs.\n */\nconst prefixSvgIdsInString = (svgString: string): string => {\n  const idMap: Record<string, string> = {}\n  const randomPrefix = Math.random().toString(36).substring(2, 12)\n\n  // Replace IDs in the SVG string\n  const updatedSvgString = svgString.replace(/id=\"([^\"]+)\"/g, (match, originalId) => {\n    const newId = `${randomPrefix}-${originalId}`\n    idMap[originalId] = newId\n    return `id=\"${newId}\"`\n  })\n\n  // Replace ID references (e.g., url(#id), href=\"#id\", etc.)\n  const processedSvgString = updatedSvgString.replace(/#([^\\s^\")]+)/g, (match, originalId) => idMap[originalId] ? `#${idMap[originalId]}` : match)\n\n  // Return the processed SVG string\n  return processedSvgString\n}\n\nconst htmlEntities: { [key: string]: string } = {\n  '<': '&lt;',\n  '>': '&gt;',\n  '\"': '&quot;',\n  \"'\": '&#39;',\n  '&': '&amp;',\n}\nconst escapeHtml = (str: string) => {\n  return str.replace(/[<>\"'&]/g, (match) => htmlEntities[match])\n}\n\n// The `svgOriginalContent` template string will be replaced with the SVG innerHTML in the generate script.\n\nconst svgOriginalContent = `<g clip-path=\"url(#clip0_1_2373)\">\n<path d=\"M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12\" fill=\"#D80027\"/>\n<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\"/>\n<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\"/>\n<path d=\"M24 12C24 18.6274 18.6274 24 12 24C5.37262 24 0 18.6274 0 12H24Z\" fill=\"#F0F0F0\"/>\n<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\"/>\n<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\"/>\n<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\"/>\n<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\"/>\n</g>\n<defs>\n<clipPath id=\"clip0_1_2373\">\n<rect width=\"24\" height=\"24\" fill=\"white\"/>\n</clipPath>\n</defs>`\nconst svgTitleContent = props.title ? `<title data-testid=\"kui-icon-svg-title\">${escapeHtml(props.title)}</title>` : ''\nconst svgProcessedContent = `${svgTitleContent}${!props.staticIds ? prefixSvgIdsInString(svgOriginalContent) : svgOriginalContent}`\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    :tabindex=\"decorative ? '-1' : undefined\"\n  >\n    <svg\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      v-html=\"svgProcessedContent\"\n    />\n  </component>\n</template>\n\n<style>\n/**\n * !Important: Do not add styles into this component file.\n *\n * We are adding styles inline to avoid additional stylesheet imports in the consuming application/component.\n */\n</style>\n"],"names":["svgOriginalContent","props","__props","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIdsInString","svgString","idMap","randomPrefix","match","originalId","newId","htmlEntities","escapeHtml","str","svgProcessedContent"],"mappings":";;2BAyJMA,IAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA5I3B,UAAMC,IAAQC,GAgERC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOH,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMI,IAAgB,OAAOJ,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDK,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MACtB;AAIK,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA2C;AAAA,MAC5E,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,MAChB,eAAeF,EAAM,aAAa,SAAS;AAAA,IAAA,EAC3C,GAaIQ,IAAuB,CAACC,MAA8B;AAC1D,YAAMC,IAAgC,CAAC,GACjCC,IAAe,KAAK,SAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE;AAaxD,aAVkBF,EAAU,QAAQ,iBAAiB,CAACG,GAAOC,MAAe;AACjF,cAAMC,IAAQ,GAAGH,CAAY,IAAIE,CAAU;AAC3C,eAAAH,EAAMG,CAAU,IAAIC,GACb,OAAOA,CAAK;AAAA,MAAA,CACpB,EAG2C,QAAQ,iBAAiB,CAACF,GAAOC,MAAeH,EAAMG,CAAU,IAAI,IAAIH,EAAMG,CAAU,CAAC,KAAKD,CAAK;AAAA,IAIjJ,GAEMG,IAA0C;AAAA,MAC9C,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IACP,GACMC,IAAa,CAACC,MACXA,EAAI,QAAQ,YAAY,CAACL,MAAUG,EAAaH,CAAK,CAAC,GAqBzDM,IAAsB,GADJlB,EAAM,QAAQ,2CAA2CgB,EAAWhB,EAAM,KAAK,CAAC,aAAa,EACvE,GAAIA,EAAM,YAAuDD,IAA3CS,EAAqBT,CAAkB,CAAsB;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es218.js

@@ -0,0 +1,138 @@
+import { defineComponent as v, computed as s, openBlock as d, createBlock as C, resolveDynamicComponent as S, normalizeStyle as F, withCtx as y, createElementBlock as b } from "vue";
+import { KUI_ICON_SIZE_50 as c } from "./kong-icons.es1256.js";
+const x = ["aria-hidden"], p = `<g clip-path="url(#clip0_1_2304)">
+<path d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z" fill="#F0F0F0"/>
+<path d="M23.9996 11.9653H10.9913C8.40862 14.5481 6.84684 16.542 5.25216 18.1367L12.0348 18.7479L22.5598 17.7044C23.4783 16.0078 24 14.0649 24 12.0001C24 11.9884 23.9996 11.977 23.9996 11.9653V11.9653Z" fill="#D80027"/>
+<path d="M5.2522 6.22613H22.5215C20.4807 2.51513 16.5343 0 12 0C8.69508 0 5.70277 1.33645 3.53269 3.498L5.2522 6.22613Z" fill="#FFDA44"/>
+<path d="M5.77392 17.7046C4.69514 18.7834 4.27823 19.6872 3.49772 20.4677C5.67061 22.6496 8.67741 24.0002 12 24.0002C16.5626 24.0002 20.5303 21.4537 22.5599 17.7046H5.77392Z" fill="#0052B4"/>
+<path d="M3.51469 3.47998C-1.17159 8.16626 -1.17159 15.7643 3.51469 20.4506C5.45123 18.5141 7.31372 16.6516 12 11.9653L3.51469 3.47998Z" fill="#6DA544"/>
+<path d="M3.16523 11.9652C3.16523 10.2168 4.39397 8.75624 6.03478 8.39793C5.78259 8.34285 5.52094 8.31299 5.25215 8.31299C3.23508 8.31299 1.59998 9.94808 1.59998 11.9652C1.59998 13.9822 3.23508 15.6173 5.25215 15.6173C5.52089 15.6173 5.78255 15.5875 6.03478 15.5324C4.39397 15.174 3.16523 13.7135 3.16523 11.9652V11.9652Z" fill="#F0F0F0"/>
+<path d="M5.99451 8.83447L6.18881 9.43232H6.8174L6.30881 9.80183L6.50311 10.3997L5.99451 10.0302L5.48592 10.3997L5.68022 9.80183L5.17162 9.43232H5.80022L5.99451 8.83447Z" fill="#F0F0F0"/>
+<path d="M5.99451 10.3999L6.18881 10.9978H6.8174L6.30881 11.3673L6.50311 11.9652L5.99451 11.5956L5.48592 11.9652L5.68022 11.3673L5.17162 10.9978H5.80022L5.99451 10.3999Z" fill="#F0F0F0"/>
+<path d="M5.99451 11.9653L6.18881 12.5632H6.8174L6.30881 12.9327L6.50311 13.5305L5.99451 13.161L5.48592 13.5305L5.68022 12.9327L5.17162 12.5632H5.80022L5.99451 11.9653Z" fill="#F0F0F0"/>
+<path d="M5.99451 13.5303L6.18881 14.1281H6.8174L6.30881 14.4976L6.50311 15.0955L5.99451 14.726L5.48592 15.0955L5.68022 14.4976L5.17162 14.1281H5.80022L5.99451 13.5303Z" fill="#F0F0F0"/>
+</g>
+<defs>
+<clipPath id="clip0_1_2304">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>`, N = /* @__PURE__ */ v({
+  __name: "FlagKmIcon",
+  props: {
+    /** The accessibility text provided to screen readers */
+    title: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */
+    color: {
+      type: String,
+      required: !1,
+      default: "currentColor"
+    },
+    /** The CSS display property for the icon. Defaults to `block` */
+    display: {
+      type: String,
+      required: !1,
+      default: "block"
+    },
+    /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */
+    decorative: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    /** The icon size */
+    size: {
+      type: [Number, String],
+      required: !1,
+      default: c,
+      // if setting to the imported const fails, just pass a number of 24 as the default.
+      validator: (i) => {
+        if (typeof i == "number" && i > 0)
+          return !0;
+        if (typeof i == "string") {
+          const e = String(i).replace(/px/gi, ""), r = Number(e);
+          if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
+            return !0;
+        }
+        return !1;
+      }
+    },
+    /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */
+    as: {
+      type: String,
+      required: !1,
+      default: "span"
+    },
+    /**
+     * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).
+     * Typically only set to `true` during snapshot testing.
+     * Defaults to `false`.
+     */
+    staticIds: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(i) {
+    const e = i, r = s(() => {
+      if (typeof e.size == "number" && e.size > 0)
+        return `${e.size}px`;
+      if (typeof e.size == "string") {
+        const n = String(e.size).replace(/px/gi, ""), t = Number(n);
+        if (t && !isNaN(t) && Number.isInteger(t) && t > 0)
+          return `${t}px`;
+      }
+      return c;
+    }), f = s(() => ({
+      boxSizing: "border-box",
+      color: e.color,
+      display: e.display,
+      flexShrink: "0",
+      height: r.value,
+      lineHeight: "0",
+      width: r.value,
+      pointerEvents: e.decorative ? "none" : void 0
+    })), u = (n) => {
+      const t = {}, m = Math.random().toString(36).substring(2, 12);
+      return n.replace(/id="([^"]+)"/g, (a, l) => {
+        const o = `${m}-${l}`;
+        return t[l] = o, `id="${o}"`;
+      }).replace(/#([^\s^")]+)/g, (a, l) => t[l] ? `#${t[l]}` : a);
+    }, g = {
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;",
+      "&": "&amp;"
+    }, L = (n) => n.replace(/[<>"'&]/g, (t) => g[t]), h = `${e.title ? `<title data-testid="kui-icon-svg-title">${L(e.title)}</title>` : ""}${e.staticIds ? p : u(p)}`;
+    return (n, t) => (d(), C(S(i.as), {
+      "aria-hidden": i.decorative ? "true" : void 0,
+      class: "kui-icon flag-km-icon",
+      "data-testid": "kui-icon-wrapper-flag-km-icon",
+      style: F(f.value),
+      tabindex: i.decorative ? "-1" : void 0
+    }, {
+      default: y(() => [
+        (d(), b("svg", {
+          "aria-hidden": i.decorative ? "true" : void 0,
+          "data-testid": "kui-icon-svg-flag-km-icon",
+          fill: "none",
+          height: "100%",
+          role: "img",
+          viewBox: "0 0 24 24",
+          width: "100%",
+          xmlns: "http://www.w3.org/2000/svg",
+          innerHTML: h
+        }, null, 8, x))
+      ]),
+      _: 1
+    }, 8, ["aria-hidden", "style", "tabindex"]));
+  }
+});
+export {
+  N as default
+};
+//# sourceMappingURL=kong-icons.es218.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"kong-icons.es218.js","sources":["../src/components/flags/FlagKmIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * FlagKmIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 04 Feb 2025 23:51:44 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } 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  /**\n   * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to `true` during snapshot testing.\n   * Defaults to `false`.\n   */\n  staticIds: {\n    type: Boolean,\n    default: false,\n  },\n})\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 | undefined> => ({\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  pointerEvents: props.decorative ? 'none' : undefined,\n}))\n\n/**\n * Prefix all SVG IDs in the given SVG string with a random prefix to ensure uniqueness.\n *\n * This function performs the following steps:\n * 1. Generates a random prefix.\n * 2. Replaces all `id` attributes in the SVG string with the new prefixed IDs.\n * 3. Updates all ID references (e.g., `url(#id)`, `href=\"#id\"`, etc.) to use the new prefixed IDs.\n *\n * @param {string} svgString - The SVG string in which to prefix IDs.\n * @returns {string} - The SVG string with prefixed IDs.\n */\nconst prefixSvgIdsInString = (svgString: string): string => {\n  const idMap: Record<string, string> = {}\n  const randomPrefix = Math.random().toString(36).substring(2, 12)\n\n  // Replace IDs in the SVG string\n  const updatedSvgString = svgString.replace(/id=\"([^\"]+)\"/g, (match, originalId) => {\n    const newId = `${randomPrefix}-${originalId}`\n    idMap[originalId] = newId\n    return `id=\"${newId}\"`\n  })\n\n  // Replace ID references (e.g., url(#id), href=\"#id\", etc.)\n  const processedSvgString = updatedSvgString.replace(/#([^\\s^\")]+)/g, (match, originalId) => idMap[originalId] ? `#${idMap[originalId]}` : match)\n\n  // Return the processed SVG string\n  return processedSvgString\n}\n\nconst htmlEntities: { [key: string]: string } = {\n  '<': '&lt;',\n  '>': '&gt;',\n  '\"': '&quot;',\n  \"'\": '&#39;',\n  '&': '&amp;',\n}\nconst escapeHtml = (str: string) => {\n  return str.replace(/[<>\"'&]/g, (match) => htmlEntities[match])\n}\n\n// The `svgOriginalContent` template string will be replaced with the SVG innerHTML in the generate script.\n\nconst svgOriginalContent = `<g clip-path=\"url(#clip0_1_2304)\">\n<path d=\"M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z\" fill=\"#F0F0F0\"/>\n<path d=\"M23.9996 11.9653H10.9913C8.40862 14.5481 6.84684 16.542 5.25216 18.1367L12.0348 18.7479L22.5598 17.7044C23.4783 16.0078 24 14.0649 24 12.0001C24 11.9884 23.9996 11.977 23.9996 11.9653V11.9653Z\" fill=\"#D80027\"/>\n<path d=\"M5.2522 6.22613H22.5215C20.4807 2.51513 16.5343 0 12 0C8.69508 0 5.70277 1.33645 3.53269 3.498L5.2522 6.22613Z\" fill=\"#FFDA44\"/>\n<path d=\"M5.77392 17.7046C4.69514 18.7834 4.27823 19.6872 3.49772 20.4677C5.67061 22.6496 8.67741 24.0002 12 24.0002C16.5626 24.0002 20.5303 21.4537 22.5599 17.7046H5.77392Z\" fill=\"#0052B4\"/>\n<path d=\"M3.51469 3.47998C-1.17159 8.16626 -1.17159 15.7643 3.51469 20.4506C5.45123 18.5141 7.31372 16.6516 12 11.9653L3.51469 3.47998Z\" fill=\"#6DA544\"/>\n<path d=\"M3.16523 11.9652C3.16523 10.2168 4.39397 8.75624 6.03478 8.39793C5.78259 8.34285 5.52094 8.31299 5.25215 8.31299C3.23508 8.31299 1.59998 9.94808 1.59998 11.9652C1.59998 13.9822 3.23508 15.6173 5.25215 15.6173C5.52089 15.6173 5.78255 15.5875 6.03478 15.5324C4.39397 15.174 3.16523 13.7135 3.16523 11.9652V11.9652Z\" fill=\"#F0F0F0\"/>\n<path d=\"M5.99451 8.83447L6.18881 9.43232H6.8174L6.30881 9.80183L6.50311 10.3997L5.99451 10.0302L5.48592 10.3997L5.68022 9.80183L5.17162 9.43232H5.80022L5.99451 8.83447Z\" fill=\"#F0F0F0\"/>\n<path d=\"M5.99451 10.3999L6.18881 10.9978H6.8174L6.30881 11.3673L6.50311 11.9652L5.99451 11.5956L5.48592 11.9652L5.68022 11.3673L5.17162 10.9978H5.80022L5.99451 10.3999Z\" fill=\"#F0F0F0\"/>\n<path d=\"M5.99451 11.9653L6.18881 12.5632H6.8174L6.30881 12.9327L6.50311 13.5305L5.99451 13.161L5.48592 13.5305L5.68022 12.9327L5.17162 12.5632H5.80022L5.99451 11.9653Z\" fill=\"#F0F0F0\"/>\n<path d=\"M5.99451 13.5303L6.18881 14.1281H6.8174L6.30881 14.4976L6.50311 15.0955L5.99451 14.726L5.48592 15.0955L5.68022 14.4976L5.17162 14.1281H5.80022L5.99451 13.5303Z\" fill=\"#F0F0F0\"/>\n</g>\n<defs>\n<clipPath id=\"clip0_1_2304\">\n<rect width=\"24\" height=\"24\" fill=\"white\"/>\n</clipPath>\n</defs>`\nconst svgTitleContent = props.title ? `<title data-testid=\"kui-icon-svg-title\">${escapeHtml(props.title)}</title>` : ''\nconst svgProcessedContent = `${svgTitleContent}${!props.staticIds ? prefixSvgIdsInString(svgOriginalContent) : svgOriginalContent}`\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon flag-km-icon\"\n    data-testid=\"kui-icon-wrapper-flag-km-icon\"\n    :style=\"rootElementStyles\"\n    :tabindex=\"decorative ? '-1' : undefined\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-flag-km-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      v-html=\"svgProcessedContent\"\n    />\n  </component>\n</template>\n\n<style>\n/**\n * !Important: Do not add styles into this component file.\n *\n * We are adding styles inline to avoid additional stylesheet imports in the consuming application/component.\n */\n</style>\n"],"names":["svgOriginalContent","props","__props","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIdsInString","svgString","idMap","randomPrefix","match","originalId","newId","htmlEntities","escapeHtml","str","svgProcessedContent"],"mappings":";;2BAyJMA,IAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA5I3B,UAAMC,IAAQC,GAgERC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOH,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMI,IAAgB,OAAOJ,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDK,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MACtB;AAIK,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA2C;AAAA,MAC5E,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,MAChB,eAAeF,EAAM,aAAa,SAAS;AAAA,IAAA,EAC3C,GAaIQ,IAAuB,CAACC,MAA8B;AAC1D,YAAMC,IAAgC,CAAC,GACjCC,IAAe,KAAK,SAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE;AAaxD,aAVkBF,EAAU,QAAQ,iBAAiB,CAACG,GAAOC,MAAe;AACjF,cAAMC,IAAQ,GAAGH,CAAY,IAAIE,CAAU;AAC3C,eAAAH,EAAMG,CAAU,IAAIC,GACb,OAAOA,CAAK;AAAA,MAAA,CACpB,EAG2C,QAAQ,iBAAiB,CAACF,GAAOC,MAAeH,EAAMG,CAAU,IAAI,IAAIH,EAAMG,CAAU,CAAC,KAAKD,CAAK;AAAA,IAIjJ,GAEMG,IAA0C;AAAA,MAC9C,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IACP,GACMC,IAAa,CAACC,MACXA,EAAI,QAAQ,YAAY,CAACL,MAAUG,EAAaH,CAAK,CAAC,GAuBzDM,IAAsB,GADJlB,EAAM,QAAQ,2CAA2CgB,EAAWhB,EAAM,KAAK,CAAC,aAAa,EACvE,GAAIA,EAAM,YAAuDD,IAA3CS,EAAqBT,CAAkB,CAAsB;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es22.js

@@ -0,0 +1,131 @@
+import { defineComponent as S, computed as l, openBlock as d, createBlock as y, resolveDynamicComponent as C, normalizeStyle as b, withCtx as x, createElementBlock as w } from "vue";
+import { KUI_ICON_SIZE_50 as c } from "./kong-icons.es1256.js";
+const z = ["aria-hidden"], u = `<g clip-path="url(#clip0_1_2262)">
+<path d="M23.2536 16.174C23.736 14.874 24 13.4679 24 12.0001C24 10.5322 23.736 9.12623 23.2536 7.8262L12 6.78271L0.746391 7.8262C0.264047 9.12623 0 10.5322 0 12.0001C0 13.4679 0.264047 14.874 0.746391 16.174L12 17.2175L23.2536 16.174Z" fill="#F0F0F0"/>
+<path d="M12 23.9999C17.1595 23.9999 21.5581 20.7434 23.2536 16.1738H0.746338C2.4419 20.7434 6.84037 23.9999 12 23.9999Z" fill="#D80027"/>
+<path d="M12 0C6.84037 0 2.4419 3.2565 0.746338 7.82611H23.2536C21.5581 3.2565 17.1595 0 12 0Z" fill="#D80027"/>
+</g>
+<defs>
+<clipPath id="clip0_1_2262">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>`, q = /* @__PURE__ */ S({
+  __name: "FlagAtIcon",
+  props: {
+    /** The accessibility text provided to screen readers */
+    title: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */
+    color: {
+      type: String,
+      required: !1,
+      default: "currentColor"
+    },
+    /** The CSS display property for the icon. Defaults to `block` */
+    display: {
+      type: String,
+      required: !1,
+      default: "block"
+    },
+    /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */
+    decorative: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    /** The icon size */
+    size: {
+      type: [Number, String],
+      required: !1,
+      default: c,
+      // if setting to the imported const fails, just pass a number of 24 as the default.
+      validator: (i) => {
+        if (typeof i == "number" && i > 0)
+          return !0;
+        if (typeof i == "string") {
+          const e = String(i).replace(/px/gi, ""), r = Number(e);
+          if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
+            return !0;
+        }
+        return !1;
+      }
+    },
+    /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */
+    as: {
+      type: String,
+      required: !1,
+      default: "span"
+    },
+    /**
+     * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).
+     * Typically only set to `true` during snapshot testing.
+     * Defaults to `false`.
+     */
+    staticIds: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(i) {
+    const e = i, r = l(() => {
+      if (typeof e.size == "number" && e.size > 0)
+        return `${e.size}px`;
+      if (typeof e.size == "string") {
+        const n = String(e.size).replace(/px/gi, ""), t = Number(n);
+        if (t && !isNaN(t) && Number.isInteger(t) && t > 0)
+          return `${t}px`;
+      }
+      return c;
+    }), g = l(() => ({
+      boxSizing: "border-box",
+      color: e.color,
+      display: e.display,
+      flexShrink: "0",
+      height: r.value,
+      lineHeight: "0",
+      width: r.value,
+      pointerEvents: e.decorative ? "none" : void 0
+    })), p = (n) => {
+      const t = {}, v = Math.random().toString(36).substring(2, 12);
+      return n.replace(/id="([^"]+)"/g, (o, a) => {
+        const s = `${v}-${a}`;
+        return t[a] = s, `id="${s}"`;
+      }).replace(/#([^\s^")]+)/g, (o, a) => t[a] ? `#${t[a]}` : o);
+    }, f = {
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;",
+      "&": "&amp;"
+    }, m = (n) => n.replace(/[<>"'&]/g, (t) => f[t]), h = `${e.title ? `<title data-testid="kui-icon-svg-title">${m(e.title)}</title>` : ""}${e.staticIds ? u : p(u)}`;
+    return (n, t) => (d(), y(C(i.as), {
+      "aria-hidden": i.decorative ? "true" : void 0,
+      class: "kui-icon flag-at-icon",
+      "data-testid": "kui-icon-wrapper-flag-at-icon",
+      style: b(g.value),
+      tabindex: i.decorative ? "-1" : void 0
+    }, {
+      default: x(() => [
+        (d(), w("svg", {
+          "aria-hidden": i.decorative ? "true" : void 0,
+          "data-testid": "kui-icon-svg-flag-at-icon",
+          fill: "none",
+          height: "100%",
+          role: "img",
+          viewBox: "0 0 24 24",
+          width: "100%",
+          xmlns: "http://www.w3.org/2000/svg",
+          innerHTML: h
+        }, null, 8, z))
+      ]),
+      _: 1
+    }, 8, ["aria-hidden", "style", "tabindex"]));
+  }
+});
+export {
+  q as default
+};
+//# sourceMappingURL=kong-icons.es22.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"kong-icons.es22.js","sources":["../src/components/flags/FlagAtIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * FlagAtIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 04 Feb 2025 23:51:44 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } 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  /**\n   * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).\n   * Typically only set to `true` during snapshot testing.\n   * Defaults to `false`.\n   */\n  staticIds: {\n    type: Boolean,\n    default: false,\n  },\n})\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 | undefined> => ({\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  pointerEvents: props.decorative ? 'none' : undefined,\n}))\n\n/**\n * Prefix all SVG IDs in the given SVG string with a random prefix to ensure uniqueness.\n *\n * This function performs the following steps:\n * 1. Generates a random prefix.\n * 2. Replaces all `id` attributes in the SVG string with the new prefixed IDs.\n * 3. Updates all ID references (e.g., `url(#id)`, `href=\"#id\"`, etc.) to use the new prefixed IDs.\n *\n * @param {string} svgString - The SVG string in which to prefix IDs.\n * @returns {string} - The SVG string with prefixed IDs.\n */\nconst prefixSvgIdsInString = (svgString: string): string => {\n  const idMap: Record<string, string> = {}\n  const randomPrefix = Math.random().toString(36).substring(2, 12)\n\n  // Replace IDs in the SVG string\n  const updatedSvgString = svgString.replace(/id=\"([^\"]+)\"/g, (match, originalId) => {\n    const newId = `${randomPrefix}-${originalId}`\n    idMap[originalId] = newId\n    return `id=\"${newId}\"`\n  })\n\n  // Replace ID references (e.g., url(#id), href=\"#id\", etc.)\n  const processedSvgString = updatedSvgString.replace(/#([^\\s^\")]+)/g, (match, originalId) => idMap[originalId] ? `#${idMap[originalId]}` : match)\n\n  // Return the processed SVG string\n  return processedSvgString\n}\n\nconst htmlEntities: { [key: string]: string } = {\n  '<': '&lt;',\n  '>': '&gt;',\n  '\"': '&quot;',\n  \"'\": '&#39;',\n  '&': '&amp;',\n}\nconst escapeHtml = (str: string) => {\n  return str.replace(/[<>\"'&]/g, (match) => htmlEntities[match])\n}\n\n// The `svgOriginalContent` template string will be replaced with the SVG innerHTML in the generate script.\n\nconst svgOriginalContent = `<g clip-path=\"url(#clip0_1_2262)\">\n<path d=\"M23.2536 16.174C23.736 14.874 24 13.4679 24 12.0001C24 10.5322 23.736 9.12623 23.2536 7.8262L12 6.78271L0.746391 7.8262C0.264047 9.12623 0 10.5322 0 12.0001C0 13.4679 0.264047 14.874 0.746391 16.174L12 17.2175L23.2536 16.174Z\" fill=\"#F0F0F0\"/>\n<path d=\"M12 23.9999C17.1595 23.9999 21.5581 20.7434 23.2536 16.1738H0.746338C2.4419 20.7434 6.84037 23.9999 12 23.9999Z\" fill=\"#D80027\"/>\n<path d=\"M12 0C6.84037 0 2.4419 3.2565 0.746338 7.82611H23.2536C21.5581 3.2565 17.1595 0 12 0Z\" fill=\"#D80027\"/>\n</g>\n<defs>\n<clipPath id=\"clip0_1_2262\">\n<rect width=\"24\" height=\"24\" fill=\"white\"/>\n</clipPath>\n</defs>`\nconst svgTitleContent = props.title ? `<title data-testid=\"kui-icon-svg-title\">${escapeHtml(props.title)}</title>` : ''\nconst svgProcessedContent = `${svgTitleContent}${!props.staticIds ? prefixSvgIdsInString(svgOriginalContent) : svgOriginalContent}`\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon flag-at-icon\"\n    data-testid=\"kui-icon-wrapper-flag-at-icon\"\n    :style=\"rootElementStyles\"\n    :tabindex=\"decorative ? '-1' : undefined\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-flag-at-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      v-html=\"svgProcessedContent\"\n    />\n  </component>\n</template>\n\n<style>\n/**\n * !Important: Do not add styles into this component file.\n *\n * We are adding styles inline to avoid additional stylesheet imports in the consuming application/component.\n */\n</style>\n"],"names":["svgOriginalContent","props","__props","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","prefixSvgIdsInString","svgString","idMap","randomPrefix","match","originalId","newId","htmlEntities","escapeHtml","str","svgProcessedContent"],"mappings":";;2BAyJMA,IAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA5I3B,UAAMC,IAAQC,GAgERC,IAAWC,EAAS,MAAc;AAEtC,UAAI,OAAOH,EAAM,QAAS,YAAYA,EAAM,OAAO;AAC1C,eAAA,GAAGA,EAAM,IAAI;AAGlB,UAAA,OAAOA,EAAM,QAAS,UAAU;AAElC,cAAMI,IAAgB,OAAOJ,EAAM,IAAI,EAAE,QAAQ,QAAQ,EAAE,GACrDK,IAAa,OAAOD,CAAa;AACnC,YAAAC,KAAc,CAAC,MAAMA,CAAU,KAAK,OAAO,UAAUA,CAAU,KAAKA,IAAa;AACnF,iBAAO,GAAGA,CAAU;AAAA,MACtB;AAIK,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA2C;AAAA,MAC5E,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,MAChB,eAAeF,EAAM,aAAa,SAAS;AAAA,IAAA,EAC3C,GAaIQ,IAAuB,CAACC,MAA8B;AAC1D,YAAMC,IAAgC,CAAC,GACjCC,IAAe,KAAK,SAAS,SAAS,EAAE,EAAE,UAAU,GAAG,EAAE;AAaxD,aAVkBF,EAAU,QAAQ,iBAAiB,CAACG,GAAOC,MAAe;AACjF,cAAMC,IAAQ,GAAGH,CAAY,IAAIE,CAAU;AAC3C,eAAAH,EAAMG,CAAU,IAAIC,GACb,OAAOA,CAAK;AAAA,MAAA,CACpB,EAG2C,QAAQ,iBAAiB,CAACF,GAAOC,MAAeH,EAAMG,CAAU,IAAI,IAAIH,EAAMG,CAAU,CAAC,KAAKD,CAAK;AAAA,IAIjJ,GAEMG,IAA0C;AAAA,MAC9C,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IACP,GACMC,IAAa,CAACC,MACXA,EAAI,QAAQ,YAAY,CAACL,MAAUG,EAAaH,CAAK,CAAC,GAgBzDM,IAAsB,GADJlB,EAAM,QAAQ,2CAA2CgB,EAAWhB,EAAM,KAAK,CAAC,aAAa,EACvE,GAAIA,EAAM,YAAuDD,IAA3CS,EAAqBT,CAAkB,CAAsB;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es220.js

@@ -0,0 +1,134 @@
+import { defineComponent as S, computed as s, openBlock as d, createBlock as C, resolveDynamicComponent as y, normalizeStyle as b, withCtx as x, createElementBlock as k } from "vue";
+import { KUI_ICON_SIZE_50 as c } from "./kong-icons.es1256.js";
+const w = ["aria-hidden"], p = `<g clip-path="url(#clip0_246_4960)">
+<path d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z" fill="#F0F0F0"/>
+<path d="M11.9999 0C8.36285 0 5.10396 1.61831 2.90332 4.17389H21.0965C18.8959 1.61831 15.637 0 11.9999 0Z" fill="#0052B4"/>
+<path d="M21.0965 19.8261H2.90332C5.10396 22.3817 8.36285 24 11.9999 24C15.637 24 18.8959 22.3817 21.0965 19.8261Z" fill="#0052B4"/>
+<path d="M22.2387 5.73914H1.76128C0.644297 7.56187 0 9.7056 0 12C0 14.2944 0.644297 16.4382 1.76128 18.2609H22.2387C23.3557 16.4382 24 14.2944 24 12C24 9.7056 23.3557 7.56187 22.2387 5.73914Z" fill="#D80027"/>
+<path d="M7.38251 16.6174C9.93262 16.6174 11.9999 14.5501 11.9999 12C11.9999 9.4499 9.93262 7.38263 7.38251 7.38263C4.83241 7.38263 2.76514 9.4499 2.76514 12C2.76514 14.5501 4.83241 16.6174 7.38251 16.6174Z" fill="#F0F0F0"/>
+<path d="M7.38279 7.38263L8.41877 10.5711H11.7768L9.05913 12.5418L10.1032 15.7398L7.38279 13.7597L4.66648 15.7361L5.70645 12.5418L2.99121 10.5711H6.34676L7.38279 7.38263Z" fill="#D80027"/>
+</g>
+<defs>
+<clipPath id="clip0_246_4960">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>`, M = /* @__PURE__ */ S({
+  __name: "FlagKpIcon",
+  props: {
+    /** The accessibility text provided to screen readers */
+    title: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    /** The icon color. Defaults to `currentColor` which inherits text color from the parent element */
+    color: {
+      type: String,
+      required: !1,
+      default: "currentColor"
+    },
+    /** The CSS display property for the icon. Defaults to `block` */
+    display: {
+      type: String,
+      required: !1,
+      default: "block"
+    },
+    /** Whether the icon is just eye-candy or is meaningful to the page (should screen-readers ignore the icon?) */
+    decorative: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    /** The icon size */
+    size: {
+      type: [Number, String],
+      required: !1,
+      default: c,
+      // if setting to the imported const fails, just pass a number of 24 as the default.
+      validator: (i) => {
+        if (typeof i == "number" && i > 0)
+          return !0;
+        if (typeof i == "string") {
+          const e = String(i).replace(/px/gi, ""), r = Number(e);
+          if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
+            return !0;
+        }
+        return !1;
+      }
+    },
+    /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */
+    as: {
+      type: String,
+      required: !1,
+      default: "span"
+    },
+    /**
+     * A boolean to disable prefixing any internal SVG ids with a unique string which is done to resolve the potential for multiple SVG instances on the same page and the SVG utilizing the same ids and references internally (e.g. in the `<defs>` tag).
+     * Typically only set to `true` during snapshot testing.
+     * Defaults to `false`.
+     */
+    staticIds: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(i) {
+    const e = i, r = s(() => {
+      if (typeof e.size == "number" && e.size > 0)
+        return `${e.size}px`;
+      if (typeof e.size == "string") {
+        const n = String(e.size).replace(/px/gi, ""), t = Number(n);
+        if (t && !isNaN(t) && Number.isInteger(t) && t > 0)
+          return `${t}px`;
+      }
+      return c;
+    }), u = s(() => ({
+      boxSizing: "border-box",
+      color: e.color,
+      display: e.display,
+      flexShrink: "0",
+      height: r.value,
+      lineHeight: "0",
+      width: r.value,
+      pointerEvents: e.decorative ? "none" : void 0
+    })), g = (n) => {
+      const t = {}, v = Math.random().toString(36).substring(2, 12);
+      return n.replace(/id="([^"]+)"/g, (o, a) => {
+        const l = `${v}-${a}`;
+        return t[a] = l, `id="${l}"`;
+      }).replace(/#([^\s^")]+)/g, (o, a) => t[a] ? `#${t[a]}` : o);
+    }, f = {
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;",
+      "&": "&amp;"
+    }, h = (n) => n.replace(/[<>"'&]/g, (t) => f[t]), m = `${e.title ? `<title data-testid="kui-icon-svg-title">${h(e.title)}</title>` : ""}${e.staticIds ? p : g(p)}`;
+    return (n, t) => (d(), C(y(i.as), {
+      "aria-hidden": i.decorative ? "true" : void 0,
+      class: "kui-icon flag-kp-icon",
+      "data-testid": "kui-icon-wrapper-flag-kp-icon",
+      style: b(u.value),
+      tabindex: i.decorative ? "-1" : void 0
+    }, {
+      default: x(() => [
+        (d(), k("svg", {
+          "aria-hidden": i.decorative ? "true" : void 0,
+          "data-testid": "kui-icon-svg-flag-kp-icon",
+          fill: "none",
+          height: "100%",
+          role: "img",
+          viewBox: "0 0 24 24",
+          width: "100%",
+          xmlns: "http://www.w3.org/2000/svg",
+          innerHTML: m
+        }, null, 8, w))
+      ]),
+      _: 1
+    }, 8, ["aria-hidden", "style", "tabindex"]));
+  }
+});
+export {
+  M as default
+};
+//# sourceMappingURL=kong-icons.es220.js.map