@kong/icons 1.15.0 → 1.15.1-pr.357.73586ee.0

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es473.js","sources":["../src/components/solid/AnalyticsIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * AnalyticsIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon analytics-icon\"\n    data-testid=\"kui-icon-wrapper-analytics-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-analytics-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=\"M7 17H9V12H7V17ZM15 17H17V7H15V17ZM11 17H13V14H11V17ZM11 12H13V10H11V12ZM5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5ZM5 19H19V5H5V19Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es473.js","sources":["../src/components/solid/AnalyticsIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * AnalyticsIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon analytics-icon\"\n    data-testid=\"kui-icon-wrapper-analytics-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-analytics-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=\"M7 17H9V12H7V17ZM15 17H17V7H15V17ZM11 17H13V14H11V17ZM11 12H13V10H11V12ZM5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5ZM5 19H19V5H5V19Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es475.js

@@ -1,9 +1,9 @@
-import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as m, createElementBlock as s, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as w, createElementVNode as S } from "vue";
-import { KUI_ICON_SIZE_50 as d } from "./kong-icons.es1215.js";
-const v = (e) => (y("data-v-2b6923fb"), e = e(), w(), e), b = ["aria-hidden"], N = {
+import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as m, createElementBlock as l, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as w } from "vue";
+import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
+const v = (e) => (y("data-v-5f66504a"), e = e(), S(), e), N = ["aria-hidden"], b = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, z = /* @__PURE__ */ v(() => /* @__PURE__ */ S("path", {
+}, x = /* @__PURE__ */ v(() => /* @__PURE__ */ w("path", {
   d: "M12 20L4 12L5.4 10.575L11 16.175V4H13V16.175L18.6 10.575L20 12L12 20Z",
   fill: "currentColor"
 }, null, -1)), I = /* @__PURE__ */ c({
@@ -37,7 +37,7 @@ const v = (e) => (y("data-v-2b6923fb"), e = e(), w(), e), b = ["aria-hidden"], N
     size: {
       type: [Number, String],
       required: !1,
-      default: d,
+      default: s,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
@@ -66,11 +66,12 @@ const v = (e) => (y("data-v-2b6923fb"), e = e(), w(), e), b = ["aria-hidden"], N
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
-      return d;
-    }), l = a(() => ({
+      return s;
+    }), d = a(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
@@ -79,10 +80,10 @@ const v = (e) => (y("data-v-2b6923fb"), e = e(), w(), e), b = ["aria-hidden"], N
       "aria-hidden": e.decorative ? "true" : void 0,
       class: "kui-icon arrow-down-icon",
       "data-testid": "kui-icon-wrapper-arrow-down-icon",
-      style: p(l.value)
+      style: p(d.value)
     }, {
       default: m(() => [
-        (o(), s("svg", {
+        (o(), l("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-arrow-down-icon",
           fill: "none",
@@ -92,9 +93,9 @@ const v = (e) => (y("data-v-2b6923fb"), e = e(), w(), e), b = ["aria-hidden"], N
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (o(), s("title", N, g(e.title), 1)) : h("", !0),
-          z
-        ], 8, b))
+          e.title ? (o(), l("title", b, g(e.title), 1)) : h("", !0),
+          x
+        ], 8, N))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es475.js","sources":["../src/components/solid/ArrowDownIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowDownIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-down-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-down-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-down-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 20L4 12L5.4 10.575L11 16.175V4H13V16.175L18.6 10.575L20 12L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es475.js","sources":["../src/components/solid/ArrowDownIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowDownIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-down-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-down-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-down-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 20L4 12L5.4 10.575L11 16.175V4H13V16.175L18.6 10.575L20 12L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es477.js

@@ -1,9 +1,9 @@
 import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as m, createElementBlock as l, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as v } from "vue";
 import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
-const w = (e) => (y("data-v-a14d381d"), e = e(), S(), e), N = ["aria-hidden"], b = {
+const w = (e) => (y("data-v-105ee690"), e = e(), S(), e), N = ["aria-hidden"], b = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, z = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
+}, x = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
   d: "M12 20L4 12L12 4L13.425 5.4L7.825 11H20V13H7.825L13.425 18.6L12 20Z",
   fill: "currentColor"
 }, null, -1)), I = /* @__PURE__ */ c({
@@ -71,6 +71,7 @@ const w = (e) => (y("data-v-a14d381d"), e = e(), S(), e), N = ["aria-hidden"], b
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
@@ -93,7 +94,7 @@ const w = (e) => (y("data-v-a14d381d"), e = e(), S(), e), N = ["aria-hidden"], b
           xmlns: "http://www.w3.org/2000/svg"
         }, [
           e.title ? (o(), l("title", b, g(e.title), 1)) : h("", !0),
-          z
+          x
         ], 8, N))
       ]),
       _: 1

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es477.js","sources":["../src/components/solid/ArrowLeftIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowLeftIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-left-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-left-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-left-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 20L4 12L12 4L13.425 5.4L7.825 11H20V13H7.825L13.425 18.6L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es477.js","sources":["../src/components/solid/ArrowLeftIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowLeftIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-left-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-left-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-left-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 20L4 12L12 4L13.425 5.4L7.825 11H20V13H7.825L13.425 18.6L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es479.js

@@ -1,9 +1,9 @@
-import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as g, createElementBlock as s, toDisplayString as m, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as v } from "vue";
-import { KUI_ICON_SIZE_50 as l } from "./kong-icons.es1215.js";
-const w = (e) => (y("data-v-f0578020"), e = e(), S(), e), N = ["aria-hidden"], b = {
+import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as g, createElementBlock as l, toDisplayString as m, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as v } from "vue";
+import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
+const w = (e) => (y("data-v-72167256"), e = e(), S(), e), N = ["aria-hidden"], b = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, z = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
+}, x = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
   d: "M12 20L10.575 18.6L16.175 13H4V11H16.175L10.575 5.4L12 4L20 12L12 20Z",
   fill: "currentColor"
 }, null, -1)), I = /* @__PURE__ */ c({
@@ -37,7 +37,7 @@ const w = (e) => (y("data-v-f0578020"), e = e(), S(), e), N = ["aria-hidden"], b
     size: {
       type: [Number, String],
       required: !1,
-      default: l,
+      default: s,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
@@ -66,11 +66,12 @@ const w = (e) => (y("data-v-f0578020"), e = e(), S(), e), N = ["aria-hidden"], b
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
-      return l;
+      return s;
     }), d = a(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
@@ -82,7 +83,7 @@ const w = (e) => (y("data-v-f0578020"), e = e(), S(), e), N = ["aria-hidden"], b
       style: p(d.value)
     }, {
       default: g(() => [
-        (o(), s("svg", {
+        (o(), l("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-arrow-right-icon",
           fill: "none",
@@ -92,8 +93,8 @@ const w = (e) => (y("data-v-f0578020"), e = e(), S(), e), N = ["aria-hidden"], b
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (o(), s("title", b, m(e.title), 1)) : h("", !0),
-          z
+          e.title ? (o(), l("title", b, m(e.title), 1)) : h("", !0),
+          x
         ], 8, N))
       ]),
       _: 1

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es479.js","sources":["../src/components/solid/ArrowRightIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowRightIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-right-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-right-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-right-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 20L10.575 18.6L16.175 13H4V11H16.175L10.575 5.4L12 4L20 12L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es479.js","sources":["../src/components/solid/ArrowRightIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowRightIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-right-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-right-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-right-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 20L10.575 18.6L16.175 13H4V11H16.175L10.575 5.4L12 4L20 12L12 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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es48.js

@@ -1,8 +1,8 @@
 import o from "./kong-icons.es851.js";
 /* empty css                 */
 import t from "./kong-icons.es408.js";
-const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e3c713bf"]]);
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-c0e1d63e"]]);
 export {
-  f as default
+  e as default
 };
 //# sourceMappingURL=kong-icons.es48.js.map

package/dist/kong-icons.es481.js

@@ -1,9 +1,9 @@
-import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as p, normalizeStyle as f, withCtx as m, createElementBlock as s, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as v } from "vue";
-import { KUI_ICON_SIZE_50 as l } from "./kong-icons.es1215.js";
-const w = (e) => (y("data-v-23c22e41"), e = e(), S(), e), N = ["aria-hidden"], b = {
+import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as p, normalizeStyle as f, withCtx as m, createElementBlock as l, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as v } from "vue";
+import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
+const w = (e) => (y("data-v-c53669d2"), e = e(), S(), e), N = ["aria-hidden"], b = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, z = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
+}, x = /* @__PURE__ */ w(() => /* @__PURE__ */ v("path", {
   d: "M11 20V7.825L5.4 13.425L4 12L12 4L20 12L18.6 13.425L13 7.825V20H11Z",
   fill: "currentColor"
 }, null, -1)), I = /* @__PURE__ */ c({
@@ -37,7 +37,7 @@ const w = (e) => (y("data-v-23c22e41"), e = e(), S(), e), N = ["aria-hidden"], b
     size: {
       type: [Number, String],
       required: !1,
-      default: l,
+      default: s,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
@@ -66,11 +66,12 @@ const w = (e) => (y("data-v-23c22e41"), e = e(), S(), e), N = ["aria-hidden"], b
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
-      return l;
+      return s;
     }), d = a(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
@@ -82,7 +83,7 @@ const w = (e) => (y("data-v-23c22e41"), e = e(), S(), e), N = ["aria-hidden"], b
       style: f(d.value)
     }, {
       default: m(() => [
-        (o(), s("svg", {
+        (o(), l("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-arrow-up-icon",
           fill: "none",
@@ -92,8 +93,8 @@ const w = (e) => (y("data-v-23c22e41"), e = e(), S(), e), N = ["aria-hidden"], b
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (o(), s("title", b, g(e.title), 1)) : h("", !0),
-          z
+          e.title ? (o(), l("title", b, g(e.title), 1)) : h("", !0),
+          x
         ], 8, N))
       ]),
       _: 1

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es481.js","sources":["../src/components/solid/ArrowUpIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowUpIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-up-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-up-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-up-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=\"M11 20V7.825L5.4 13.425L4 12L12 4L20 12L18.6 13.425L13 7.825V20H11Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es481.js","sources":["../src/components/solid/ArrowUpIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * ArrowUpIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon arrow-up-icon\"\n    data-testid=\"kui-icon-wrapper-arrow-up-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-arrow-up-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=\"M11 20V7.825L5.4 13.425L4 12L12 4L20 12L18.6 13.425L13 7.825V20H11Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es483.js

@@ -1,12 +1,12 @@
-import { defineComponent as d, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as p, normalizeStyle as f, withCtx as m, createElementBlock as s, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as b, createElementVNode as S } from "vue";
-import { KUI_ICON_SIZE_50 as l } from "./kong-icons.es1215.js";
-const v = (e) => (y("data-v-66bcb967"), e = e(), b(), e), N = ["aria-hidden"], k = {
+import { defineComponent as c, computed as a, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as m, createElementBlock as l, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as S, createElementVNode as b } from "vue";
+import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
+const v = (e) => (y("data-v-14775475"), e = e(), S(), e), k = ["aria-hidden"], N = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, z = /* @__PURE__ */ v(() => /* @__PURE__ */ S("path", {
+}, x = /* @__PURE__ */ v(() => /* @__PURE__ */ b("path", {
   d: "M9 18L3 12L9 6L10.4 7.4L6.8 11H21V13H6.8L10.4 16.6L9 18Z",
   fill: "currentColor"
-}, null, -1)), I = /* @__PURE__ */ d({
+}, null, -1)), I = /* @__PURE__ */ c({
   __name: "BackIcon",
   props: {
     /** The accessibility text provided to screen readers */
@@ -37,7 +37,7 @@ const v = (e) => (y("data-v-66bcb967"), e = e(), b(), e), N = ["aria-hidden"], k
     size: {
       type: [Number, String],
       required: !1,
-      default: l,
+      default: s,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
@@ -66,23 +66,24 @@ const v = (e) => (y("data-v-66bcb967"), e = e(), b(), e), N = ["aria-hidden"], k
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
-      return l;
-    }), c = a(() => ({
+      return s;
+    }), d = a(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
     }));
-    return (n, r) => (o(), u(p(e.as), {
+    return (n, r) => (o(), u(f(e.as), {
       "aria-hidden": e.decorative ? "true" : void 0,
       class: "kui-icon back-icon",
       "data-testid": "kui-icon-wrapper-back-icon",
-      style: f(c.value)
+      style: p(d.value)
     }, {
       default: m(() => [
-        (o(), s("svg", {
+        (o(), l("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-back-icon",
           fill: "none",
@@ -92,9 +93,9 @@ const v = (e) => (y("data-v-66bcb967"), e = e(), b(), e), N = ["aria-hidden"], k
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (o(), s("title", k, g(e.title), 1)) : h("", !0),
-          z
-        ], 8, N))
+          e.title ? (o(), l("title", N, g(e.title), 1)) : h("", !0),
+          x
+        ], 8, k))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es483.js","sources":["../src/components/solid/BackIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * BackIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon back-icon\"\n    data-testid=\"kui-icon-wrapper-back-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-back-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 18L3 12L9 6L10.4 7.4L6.8 11H21V13H6.8L10.4 16.6L9 18Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es483.js","sources":["../src/components/solid/BackIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * BackIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon back-icon\"\n    data-testid=\"kui-icon-wrapper-back-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-back-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 18L3 12L9 6L10.4 7.4L6.8 11H21V13H6.8L10.4 16.6L9 18Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es485.js

@@ -1,12 +1,12 @@
 import { defineComponent as c, computed as n, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as h, createElementBlock as l, toDisplayString as m, createCommentVNode as g, pushScopeId as y, popScopeId as S, createElementVNode as b } from "vue";
 import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
-const v = (e) => (y("data-v-0318f54d"), e = e(), S(), e), z = ["aria-hidden"], N = {
+const v = (e) => (y("data-v-1db910f7"), e = e(), S(), e), z = ["aria-hidden"], N = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, L = /* @__PURE__ */ v(() => /* @__PURE__ */ b("path", {
+}, x = /* @__PURE__ */ v(() => /* @__PURE__ */ b("path", {
   d: "M4 16L18 16L18 20L4 20L4 16ZM4 10L20 10L20 14L4 14L4 10ZM4 4L15 4L15 8L4 8L4 4Z",
   fill: "currentColor"
-}, null, -1)), k = /* @__PURE__ */ c({
+}, null, -1)), w = /* @__PURE__ */ c({
   __name: "BarChartHorizontalIcon",
   props: {
     /** The accessibility text provided to screen readers */
@@ -71,6 +71,7 @@ const v = (e) => (y("data-v-0318f54d"), e = e(), S(), e), z = ["aria-hidden"], N
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
@@ -93,7 +94,7 @@ const v = (e) => (y("data-v-0318f54d"), e = e(), S(), e), z = ["aria-hidden"], N
           xmlns: "http://www.w3.org/2000/svg"
         }, [
           e.title ? (o(), l("title", N, m(e.title), 1)) : g("", !0),
-          L
+          x
         ], 8, z))
       ]),
       _: 1
@@ -101,6 +102,6 @@ const v = (e) => (y("data-v-0318f54d"), e = e(), S(), e), z = ["aria-hidden"], N
   }
 });
 export {
-  k as default
+  w as default
 };
 //# sourceMappingURL=kong-icons.es485.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"kong-icons.es485.js","sources":["../src/components/solid/BarChartHorizontalIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * BarChartHorizontalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Tue, 16 Jul 2024 12:21:51 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\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  height: iconSize.value,\n  lineHeight: '0',\n  width: iconSize.value,\n}))\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon bar-chart-horizontal-icon\"\n    data-testid=\"kui-icon-wrapper-bar-chart-horizontal-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-bar-chart-horizontal-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=\"M4 16L18 16L18 20L4 20L4 16ZM4 10L20 10L20 14L4 14L4 10ZM4 4L15 4L15 8L4 8L4 4Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"kong-icons.es485.js","sources":["../src/components/solid/BarChartHorizontalIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * BarChartHorizontalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Thu, 18 Jul 2024 14:59:12 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\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</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :aria-hidden=\"decorative ? 'true' : undefined\"\n    class=\"kui-icon bar-chart-horizontal-icon\"\n    data-testid=\"kui-icon-wrapper-bar-chart-horizontal-icon\"\n    :style=\"rootElementStyles\"\n  >\n    <svg\n      :aria-hidden=\"decorative ? 'true' : undefined\"\n      data-testid=\"kui-icon-svg-bar-chart-horizontal-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=\"M4 16L18 16L18 20L4 20L4 16ZM4 10L20 10L20 14L4 14L4 10ZM4 4L15 4L15 8L4 8L4 4Z\"\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","iconSize","computed","sanitizedSize","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAuDRC,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,MAExB;AAGO,aAAAC;AAAA,IAAA,CACR,GAMKC,IAAoBJ,EAAS,OAA+B;AAAA,MAChE,WAAW;AAAA,MACX,OAAOH,EAAM;AAAA,MACb,SAASA,EAAM;AAAA,MACf,YAAY;AAAA,MACZ,QAAQE,EAAS;AAAA,MACjB,YAAY;AAAA,MACZ,OAAOA,EAAS;AAAA,IAChB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/kong-icons.es487.js

@@ -1,9 +1,9 @@
-import { defineComponent as c, computed as n, openBlock as o, createBlock as u, resolveDynamicComponent as p, normalizeStyle as f, withCtx as m, createElementBlock as s, toDisplayString as g, createCommentVNode as h, pushScopeId as y, popScopeId as b, createElementVNode as S } from "vue";
-import { KUI_ICON_SIZE_50 as d } from "./kong-icons.es1215.js";
-const v = (e) => (y("data-v-dcddcb1b"), e = e(), b(), e), N = ["aria-hidden"], z = {
+import { defineComponent as c, computed as n, openBlock as o, createBlock as u, resolveDynamicComponent as f, normalizeStyle as p, withCtx as m, createElementBlock as l, toDisplayString as h, createCommentVNode as g, pushScopeId as y, popScopeId as S, createElementVNode as b } from "vue";
+import { KUI_ICON_SIZE_50 as s } from "./kong-icons.es1215.js";
+const v = (e) => (y("data-v-e84bd5da"), e = e(), S(), e), N = ["aria-hidden"], x = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, x = /* @__PURE__ */ v(() => /* @__PURE__ */ S("path", {
+}, z = /* @__PURE__ */ v(() => /* @__PURE__ */ b("path", {
   d: "M4 20V12H8V20H4ZM10 20V4H14V20H10ZM16 20V9H20V20H16Z",
   fill: "currentColor"
 }, null, -1)), I = /* @__PURE__ */ c({
@@ -37,7 +37,7 @@ const v = (e) => (y("data-v-dcddcb1b"), e = e(), b(), e), N = ["aria-hidden"], z
     size: {
       type: [Number, String],
       required: !1,
-      default: d,
+      default: s,
       // if setting to the imported const fails, just pass a number of 24 as the default.
       validator: (e) => {
         if (typeof e == "number" && e > 0)
@@ -66,23 +66,24 @@ const v = (e) => (y("data-v-dcddcb1b"), e = e(), b(), e), N = ["aria-hidden"], z
         if (r && !isNaN(r) && Number.isInteger(r) && r > 0)
           return `${r}px`;
       }
-      return d;
-    }), l = n(() => ({
+      return s;
+    }), d = n(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
+      flexShrink: "0",
       height: i.value,
       lineHeight: "0",
       width: i.value
     }));
-    return (a, r) => (o(), u(p(e.as), {
+    return (a, r) => (o(), u(f(e.as), {
       "aria-hidden": e.decorative ? "true" : void 0,
       class: "kui-icon bar-chart-icon",
       "data-testid": "kui-icon-wrapper-bar-chart-icon",
-      style: f(l.value)
+      style: p(d.value)
     }, {
       default: m(() => [
-        (o(), s("svg", {
+        (o(), l("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-bar-chart-icon",
           fill: "none",
@@ -92,8 +93,8 @@ const v = (e) => (y("data-v-dcddcb1b"), e = e(), b(), e), N = ["aria-hidden"], z
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (o(), s("title", z, g(e.title), 1)) : h("", !0),
-          x
+          e.title ? (o(), l("title", x, h(e.title), 1)) : g("", !0),
+          z
         ], 8, N))
       ]),
       _: 1