@kong/icons 0.0.2-pr.1.3582091.0 → 0.0.2-pr.1.425ed09.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +130 -8
- package/dist/_plugin-vue_export-helper-ae3bbcb1.js +41 -0
- package/dist/_plugin-vue_export-helper-ae3bbcb1.js.map +1 -0
- package/dist/_plugin-vue_export-helper-dac333b2.cjs +2 -0
- package/dist/_plugin-vue_export-helper-dac333b2.cjs.map +1 -0
- package/dist/kong-icons.cjs.js +2 -0
- package/dist/kong-icons.cjs.js.map +1 -0
- package/dist/kong-icons.es.js +94 -8891
- package/dist/kong-icons.es.js.map +1 -1
- package/dist/kong-icons.flags.cjs.js +2 -0
- package/dist/kong-icons.flags.cjs.js.map +1 -0
- package/dist/kong-icons.flags.es.js +276 -0
- package/dist/kong-icons.flags.es.js.map +1 -0
- package/dist/kong-icons.multi-color.cjs.js +2 -0
- package/dist/kong-icons.multi-color.cjs.js.map +1 -0
- package/dist/kong-icons.multi-color.es.js +928 -0
- package/dist/kong-icons.multi-color.es.js.map +1 -0
- package/dist/kong-icons.solid.cjs.js +2 -0
- package/dist/kong-icons.solid.cjs.js.map +1 -0
- package/dist/kong-icons.solid.es.js +7758 -0
- package/dist/kong-icons.solid.es.js.map +1 -0
- package/dist/types/components/flags/FlagEuIcon.vue.d.ts +85 -0
- package/dist/types/components/flags/FlagUsIcon.vue.d.ts +85 -0
- package/dist/types/components/flags/index.d.ts +9 -0
- package/dist/types/components/index.d.ts +4 -90
- package/dist/types/components/{AwsIcon.vue.d.ts → multi-color/AwsIcon.vue.d.ts} +2 -2
- package/dist/types/components/{AzureIcon.vue.d.ts → multi-color/AzureIcon.vue.d.ts} +2 -2
- package/dist/types/components/{GoogleCloudIcon.vue.d.ts → multi-color/GoogleCloudIcon.vue.d.ts} +2 -2
- package/dist/types/components/{GoogleIcon.vue.d.ts → multi-color/GoogleIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RuntimeCompositeIcon.vue.d.ts → multi-color/RuntimeCompositeIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RuntimeDedicatedCloudIcon.vue.d.ts → multi-color/RuntimeDedicatedCloudIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RuntimeHybridIcon.vue.d.ts → multi-color/RuntimeHybridIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RuntimeKicIcon.vue.d.ts → multi-color/RuntimeKicIcon.vue.d.ts} +2 -2
- package/dist/types/components/multi-color/index.d.ts +15 -0
- package/dist/types/components/{AddCircleIcon.vue.d.ts → solid/AddCircleIcon.vue.d.ts} +2 -2
- package/dist/types/components/{AddIcon.vue.d.ts → solid/AddIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ArrowDownIcon.vue.d.ts → solid/ArrowDownIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ArrowLeftIcon.vue.d.ts → solid/ArrowLeftIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ArrowRightIcon.vue.d.ts → solid/ArrowRightIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ArrowUpIcon.vue.d.ts → solid/ArrowUpIcon.vue.d.ts} +2 -2
- package/dist/types/components/{BackIcon.vue.d.ts → solid/BackIcon.vue.d.ts} +2 -2
- package/dist/types/components/{BarChartIcon.vue.d.ts → solid/BarChartIcon.vue.d.ts} +2 -2
- package/dist/types/components/{BookIcon.vue.d.ts → solid/BookIcon.vue.d.ts} +2 -2
- package/dist/types/components/{BotIcon.vue.d.ts → solid/BotIcon.vue.d.ts} +2 -2
- package/dist/types/components/{BrainIcon.vue.d.ts → solid/BrainIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CalIcon.vue.d.ts → solid/CalIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CheckCircleIcon.vue.d.ts → solid/CheckCircleIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CheckIcon.vue.d.ts → solid/CheckIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CheckSmallIcon.vue.d.ts → solid/CheckSmallIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ChevronDownIcon.vue.d.ts → solid/ChevronDownIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ChevronLeftIcon.vue.d.ts → solid/ChevronLeftIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ChevronRightIcon.vue.d.ts → solid/ChevronRightIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ChevronUpIcon.vue.d.ts → solid/ChevronUpIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ClearIcon.vue.d.ts → solid/ClearIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ClipboardIcon.vue.d.ts → solid/ClipboardIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ClockIcon.vue.d.ts → solid/ClockIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CloseIcon.vue.d.ts → solid/CloseIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CloudIcon.vue.d.ts → solid/CloudIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CogIcon.vue.d.ts → solid/CogIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CollapseIcon.vue.d.ts → solid/CollapseIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CollapsePanelIcon.vue.d.ts → solid/CollapsePanelIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ConnectionsIcon.vue.d.ts → solid/ConnectionsIcon.vue.d.ts} +2 -2
- package/dist/types/components/{CopyIcon.vue.d.ts → solid/CopyIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DangerCircleIcon.vue.d.ts → solid/DangerCircleIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DashboardIcon.vue.d.ts → solid/DashboardIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DeployIcon.vue.d.ts → solid/DeployIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DevPortalIcon.vue.d.ts → solid/DevPortalIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DisabledIcon.vue.d.ts → solid/DisabledIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DocumentIcon.vue.d.ts → solid/DocumentIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DocumentListIcon.vue.d.ts → solid/DocumentListIcon.vue.d.ts} +2 -2
- package/dist/types/components/{DragIcon.vue.d.ts → solid/DragIcon.vue.d.ts} +2 -2
- package/dist/types/components/{EditIcon.vue.d.ts → solid/EditIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ExpandIcon.vue.d.ts → solid/ExpandIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ExternalLinkIcon.vue.d.ts → solid/ExternalLinkIcon.vue.d.ts} +2 -2
- package/dist/types/components/{FeatureRequestIcon.vue.d.ts → solid/FeatureRequestIcon.vue.d.ts} +2 -2
- package/dist/types/components/{FileEmptyIcon.vue.d.ts → solid/FileEmptyIcon.vue.d.ts} +2 -2
- package/dist/types/components/{FilterIcon.vue.d.ts → solid/FilterIcon.vue.d.ts} +2 -2
- package/dist/types/components/{FlagIcon.vue.d.ts → solid/FlagIcon.vue.d.ts} +2 -2
- package/dist/types/components/{GraduationIcon.vue.d.ts → solid/GraduationIcon.vue.d.ts} +2 -2
- package/dist/types/components/{GridIcon.vue.d.ts → solid/GridIcon.vue.d.ts} +2 -2
- package/dist/types/components/{HelpIcon.vue.d.ts → solid/HelpIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ImageIcon.vue.d.ts → solid/ImageIcon.vue.d.ts} +2 -2
- package/dist/types/components/{InboxIcon.vue.d.ts → solid/InboxIcon.vue.d.ts} +2 -2
- package/dist/types/components/{IndeterminateSmallIcon.vue.d.ts → solid/IndeterminateSmallIcon.vue.d.ts} +2 -2
- package/dist/types/components/{InfoIcon.vue.d.ts → solid/InfoIcon.vue.d.ts} +2 -2
- package/dist/types/components/{KongIcon.vue.d.ts → solid/KongIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ListIcon.vue.d.ts → solid/ListIcon.vue.d.ts} +2 -2
- package/dist/types/components/{LockIcon.vue.d.ts → solid/LockIcon.vue.d.ts} +2 -2
- package/dist/types/components/{MeshIcon.vue.d.ts → solid/MeshIcon.vue.d.ts} +2 -2
- package/dist/types/components/{MoreHorizontalIcon.vue.d.ts → solid/MoreHorizontalIcon.vue.d.ts} +2 -2
- package/dist/types/components/{MoreIcon.vue.d.ts → solid/MoreIcon.vue.d.ts} +2 -2
- package/dist/types/components/{NotificationIcon.vue.d.ts → solid/NotificationIcon.vue.d.ts} +2 -2
- package/dist/types/components/{OverviewIcon.vue.d.ts → solid/OverviewIcon.vue.d.ts} +2 -2
- package/dist/types/components/{PeopleIcon.vue.d.ts → solid/PeopleIcon.vue.d.ts} +2 -2
- package/dist/types/components/{PlugIcon.vue.d.ts → solid/PlugIcon.vue.d.ts} +2 -2
- package/dist/types/components/{PortalIcon.vue.d.ts → solid/PortalIcon.vue.d.ts} +2 -2
- package/dist/types/components/{PresentationIcon.vue.d.ts → solid/PresentationIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ProfileIcon.vue.d.ts → solid/ProfileIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RedoIcon.vue.d.ts → solid/RedoIcon.vue.d.ts} +2 -2
- package/dist/types/components/{RuntimesIcon.vue.d.ts → solid/RuntimesIcon.vue.d.ts} +2 -2
- package/dist/types/components/{SearchIcon.vue.d.ts → solid/SearchIcon.vue.d.ts} +2 -2
- package/dist/types/components/{SecurityIcon.vue.d.ts → solid/SecurityIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ServiceDocumentIcon.vue.d.ts → solid/ServiceDocumentIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ServiceHubIcon.vue.d.ts → solid/ServiceHubIcon.vue.d.ts} +2 -2
- package/dist/types/components/{ServicesIcon.vue.d.ts → solid/ServicesIcon.vue.d.ts} +2 -2
- package/dist/types/components/{SharedIcon.vue.d.ts → solid/SharedIcon.vue.d.ts} +2 -2
- package/dist/types/components/{SupportIcon.vue.d.ts → solid/SupportIcon.vue.d.ts} +2 -2
- package/dist/types/components/{TableIcon.vue.d.ts → solid/TableIcon.vue.d.ts} +2 -2
- package/dist/types/components/{TeammateIcon.vue.d.ts → solid/TeammateIcon.vue.d.ts} +2 -2
- package/dist/types/components/{TrashIcon.vue.d.ts → solid/TrashIcon.vue.d.ts} +2 -2
- package/dist/types/components/{VitalsIcon.vue.d.ts → solid/VitalsIcon.vue.d.ts} +2 -2
- package/dist/types/components/{WarningIcon.vue.d.ts → solid/WarningIcon.vue.d.ts} +2 -2
- package/dist/types/components/{WorldIcon.vue.d.ts → solid/WorldIcon.vue.d.ts} +2 -2
- package/dist/types/components/solid/index.d.ts +86 -0
- package/package.json +24 -7
- package/dist/kong-icons.umd.js +0 -2
- package/dist/kong-icons.umd.js.map +0 -1
- package/dist/types/components/EuropeanUnionIcon.vue.d.ts +0 -85
- package/dist/types/components/UnitedStatesIcon.vue.d.ts +0 -85
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"kong-icons.solid.cjs.js","sources":["../src/components/solid/AddIcon.vue","../src/components/solid/BackIcon.vue","../src/components/solid/BookIcon.vue","../src/components/solid/BotIcon.vue","../src/components/solid/BrainIcon.vue","../src/components/solid/CalIcon.vue","../src/components/solid/CheckIcon.vue","../src/components/solid/ClearIcon.vue","../src/components/solid/ClipboardIcon.vue","../src/components/solid/ClockIcon.vue","../src/components/solid/CloseIcon.vue","../src/components/solid/CloudIcon.vue","../src/components/solid/CogIcon.vue","../src/components/solid/CollapseIcon.vue","../src/components/solid/ConnectionsIcon.vue","../src/components/solid/CopyIcon.vue","../src/components/solid/DashboardIcon.vue","../src/components/solid/DeployIcon.vue","../src/components/solid/DisabledIcon.vue","../src/components/solid/DocumentIcon.vue","../src/components/solid/DragIcon.vue","../src/components/solid/EditIcon.vue","../src/components/solid/ExpandIcon.vue","../src/components/solid/FilterIcon.vue","../src/components/solid/FlagIcon.vue","../src/components/solid/GraduationIcon.vue","../src/components/solid/GridIcon.vue","../src/components/solid/HelpIcon.vue","../src/components/solid/ImageIcon.vue","../src/components/solid/InboxIcon.vue","../src/components/solid/InfoIcon.vue","../src/components/solid/KongIcon.vue","../src/components/solid/ListIcon.vue","../src/components/solid/LockIcon.vue","../src/components/solid/MeshIcon.vue","../src/components/solid/MoreIcon.vue","../src/components/solid/NotificationIcon.vue","../src/components/solid/OverviewIcon.vue","../src/components/solid/PeopleIcon.vue","../src/components/solid/PlugIcon.vue","../src/components/solid/PortalIcon.vue","../src/components/solid/PresentationIcon.vue","../src/components/solid/ProfileIcon.vue","../src/components/solid/RedoIcon.vue","../src/components/solid/RuntimesIcon.vue","../src/components/solid/SearchIcon.vue","../src/components/solid/SecurityIcon.vue","../src/components/solid/ServicesIcon.vue","../src/components/solid/SharedIcon.vue","../src/components/solid/SupportIcon.vue","../src/components/solid/TableIcon.vue","../src/components/solid/TeammateIcon.vue","../src/components/solid/TrashIcon.vue","../src/components/solid/VitalsIcon.vue","../src/components/solid/WarningIcon.vue","../src/components/solid/WorldIcon.vue","../src/components/solid/AddCircleIcon.vue","../src/components/solid/ArrowDownIcon.vue","../src/components/solid/ArrowLeftIcon.vue","../src/components/solid/ArrowRightIcon.vue","../src/components/solid/ArrowUpIcon.vue","../src/components/solid/BarChartIcon.vue","../src/components/solid/CheckCircleIcon.vue","../src/components/solid/CheckSmallIcon.vue","../src/components/solid/ChevronDownIcon.vue","../src/components/solid/ChevronLeftIcon.vue","../src/components/solid/ChevronRightIcon.vue","../src/components/solid/ChevronUpIcon.vue","../src/components/solid/CollapsePanelIcon.vue","../src/components/solid/DangerCircleIcon.vue","../src/components/solid/DevPortalIcon.vue","../src/components/solid/DocumentListIcon.vue","../src/components/solid/ExternalLinkIcon.vue","../src/components/solid/FeatureRequestIcon.vue","../src/components/solid/FileEmptyIcon.vue","../src/components/solid/IndeterminateSmallIcon.vue","../src/components/solid/MoreHorizontalIcon.vue","../src/components/solid/ServiceDocumentIcon.vue","../src/components/solid/ServiceHubIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n/**\n * AddIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `add-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon add-icon\"\n data-testid=\"kui-icon-wrapper-add-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-add-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11 19V13H5V11H11V5H13V11H19V13H13V19H11Z\"\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","<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 Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `back-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\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 :aria-labelledby=\"title ? titleId : 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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</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","<script lang=\"ts\" setup>\n/**\n * BookIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `book-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon book-icon\"\n data-testid=\"kui-icon-wrapper-book-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-book-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M14 9.9V8.2C14.55 7.96667 15.1125 7.79167 15.6875 7.675C16.2625 7.55833 16.8667 7.5 17.5 7.5C17.9333 7.5 18.3583 7.53333 18.775 7.6C19.1917 7.66667 19.6 7.75 20 7.85V9.45C19.6 9.3 19.1958 9.1875 18.7875 9.1125C18.3792 9.0375 17.95 9 17.5 9C16.8667 9 16.2583 9.07917 15.675 9.2375C15.0917 9.39583 14.5333 9.61667 14 9.9ZM14 15.4V13.7C14.55 13.4667 15.1125 13.2917 15.6875 13.175C16.2625 13.0583 16.8667 13 17.5 13C17.9333 13 18.3583 13.0333 18.775 13.1C19.1917 13.1667 19.6 13.25 20 13.35V14.95C19.6 14.8 19.1958 14.6875 18.7875 14.6125C18.3792 14.5375 17.95 14.5 17.5 14.5C16.8667 14.5 16.2583 14.575 15.675 14.725C15.0917 14.875 14.5333 15.1 14 15.4ZM14 12.65V10.95C14.55 10.7167 15.1125 10.5417 15.6875 10.425C16.2625 10.3083 16.8667 10.25 17.5 10.25C17.9333 10.25 18.3583 10.2833 18.775 10.35C19.1917 10.4167 19.6 10.5 20 10.6V12.2C19.6 12.05 19.1958 11.9375 18.7875 11.8625C18.3792 11.7875 17.95 11.75 17.5 11.75C16.8667 11.75 16.2583 11.8292 15.675 11.9875C15.0917 12.1458 14.5333 12.3667 14 12.65ZM6.5 16C7.28333 16 8.04583 16.0875 8.7875 16.2625C9.52917 16.4375 10.2667 16.7 11 17.05V7.2C10.3167 6.8 9.59167 6.5 8.825 6.3C8.05833 6.1 7.28333 6 6.5 6C5.9 6 5.30417 6.05833 4.7125 6.175C4.12083 6.29167 3.55 6.46667 3 6.7V16.6C3.58333 16.4 4.1625 16.25 4.7375 16.15C5.3125 16.05 5.9 16 6.5 16ZM13 17.05C13.7333 16.7 14.4708 16.4375 15.2125 16.2625C15.9542 16.0875 16.7167 16 17.5 16C18.1 16 18.6875 16.05 19.2625 16.15C19.8375 16.25 20.4167 16.4 21 16.6V6.7C20.45 6.46667 19.8792 6.29167 19.2875 6.175C18.6958 6.05833 18.1 6 17.5 6C16.7167 6 15.9417 6.1 15.175 6.3C14.4083 6.5 13.6833 6.8 13 7.2V17.05ZM12 20C11.2 19.3667 10.3333 18.875 9.4 18.525C8.46667 18.175 7.5 18 6.5 18C5.8 18 5.1125 18.0917 4.4375 18.275C3.7625 18.4583 3.11667 18.7167 2.5 19.05C2.15 19.2333 1.8125 19.225 1.4875 19.025C1.1625 18.825 1 18.5333 1 18.15V6.1C1 5.91667 1.04583 5.74167 1.1375 5.575C1.22917 5.40833 1.36667 5.28333 1.55 5.2C2.31667 4.8 3.11667 4.5 3.95 4.3C4.78333 4.1 5.63333 4 6.5 4C7.46667 4 8.4125 4.125 9.3375 4.375C10.2625 4.625 11.15 5 12 5.5C12.85 5 13.7375 4.625 14.6625 4.375C15.5875 4.125 16.5333 4 17.5 4C18.3667 4 19.2167 4.1 20.05 4.3C20.8833 4.5 21.6833 4.8 22.45 5.2C22.6333 5.28333 22.7708 5.40833 22.8625 5.575C22.9542 5.74167 23 5.91667 23 6.1V18.15C23 18.5333 22.8375 18.825 22.5125 19.025C22.1875 19.225 21.85 19.2333 21.5 19.05C20.8833 18.7167 20.2375 18.4583 19.5625 18.275C18.8875 18.0917 18.2 18 17.5 18C16.5 18 15.5333 18.175 14.6 18.525C13.6667 18.875 12.8 19.3667 12 20Z\"\n fill=\"currentColor\"\n />\n </svg>\n </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n","<script lang=\"ts\" setup>\n/**\n * BotIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `bot-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon bot-icon\"\n data-testid=\"kui-icon-wrapper-bot-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-bot-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M4 15C3.16667 15 2.45833 14.7083 1.875 14.125C1.29167 13.5417 1 12.8333 1 12C1 11.1667 1.29167 10.4583 1.875 9.875C2.45833 9.29167 3.16667 9 4 9V7C4 6.45 4.19583 5.97917 4.5875 5.5875C4.97917 5.19583 5.45 5 6 5H9C9 4.16667 9.29167 3.45833 9.875 2.875C10.4583 2.29167 11.1667 2 12 2C12.8333 2 13.5417 2.29167 14.125 2.875C14.7083 3.45833 15 4.16667 15 5H18C18.55 5 19.0208 5.19583 19.4125 5.5875C19.8042 5.97917 20 6.45 20 7V9C20.8333 9 21.5417 9.29167 22.125 9.875C22.7083 10.4583 23 11.1667 23 12C23 12.8333 22.7083 13.5417 22.125 14.125C21.5417 14.7083 20.8333 15 20 15V19C20 19.55 19.8042 20.0208 19.4125 20.4125C19.0208 20.8042 18.55 21 18 21H6C5.45 21 4.97917 20.8042 4.5875 20.4125C4.19583 20.0208 4 19.55 4 19V15ZM9 13C9.41667 13 9.77083 12.8542 10.0625 12.5625C10.3542 12.2708 10.5 11.9167 10.5 11.5C10.5 11.0833 10.3542 10.7292 10.0625 10.4375C9.77083 10.1458 9.41667 10 9 10C8.58333 10 8.22917 10.1458 7.9375 10.4375C7.64583 10.7292 7.5 11.0833 7.5 11.5C7.5 11.9167 7.64583 12.2708 7.9375 12.5625C8.22917 12.8542 8.58333 13 9 13ZM15 13C15.4167 13 15.7708 12.8542 16.0625 12.5625C16.3542 12.2708 16.5 11.9167 16.5 11.5C16.5 11.0833 16.3542 10.7292 16.0625 10.4375C15.7708 10.1458 15.4167 10 15 10C14.5833 10 14.2292 10.1458 13.9375 10.4375C13.6458 10.7292 13.5 11.0833 13.5 11.5C13.5 11.9167 13.6458 12.2708 13.9375 12.5625C14.2292 12.8542 14.5833 13 15 13ZM8 17H16V15H8V17ZM6 19H18V7H6V19Z\"\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","<script lang=\"ts\" setup>\n/**\n * BrainIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `brain-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon brain-icon\"\n data-testid=\"kui-icon-wrapper-brain-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-brain-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12.275 15.525C13.4417 15.525 14.4333 15.15 15.25 14.4C16.0667 13.65 16.475 12.7417 16.475 11.675C16.475 10.725 16.1708 9.92083 15.5625 9.2625C14.9542 8.60417 14.2167 8.275 13.35 8.275C12.5667 8.275 11.9042 8.525 11.3625 9.025C10.8208 9.525 10.55 10.1417 10.55 10.875C10.55 11.1917 10.6125 11.5 10.7375 11.8C10.8625 12.1 11.0417 12.375 11.275 12.625L12.7 11.2C12.65 11.1667 12.6125 11.125 12.5875 11.075C12.5625 11.025 12.55 10.9667 12.55 10.9C12.55 10.7167 12.625 10.5708 12.775 10.4625C12.925 10.3542 13.1167 10.3 13.35 10.3C13.6833 10.3 13.9583 10.4375 14.175 10.7125C14.3917 10.9875 14.5 11.3167 14.5 11.7C14.5 12.2167 14.2875 12.6542 13.8625 13.0125C13.4375 13.3708 12.9167 13.55 12.3 13.55C11.5167 13.55 10.8542 13.2333 10.3125 12.6C9.77083 11.9667 9.5 11.1917 9.5 10.275C9.5 9.79167 9.59167 9.32917 9.775 8.8875C9.95833 8.44583 10.2167 8.05833 10.55 7.725L9.125 6.3C8.59167 6.81667 8.18333 7.41667 7.9 8.1C7.61667 8.78333 7.475 9.5 7.475 10.25C7.475 11.7167 7.94167 12.9625 8.875 13.9875C9.80833 15.0125 10.9417 15.525 12.275 15.525ZM6 22V17.7C5.05 16.8333 4.3125 15.8208 3.7875 14.6625C3.2625 13.5042 3 12.2833 3 11C3 8.5 3.875 6.375 5.625 4.625C7.375 2.875 9.5 2 12 2C14.0833 2 15.9292 2.6125 17.5375 3.8375C19.1458 5.0625 20.1917 6.65833 20.675 8.625L21.975 13.75C22.0583 14.0667 22 14.3542 21.8 14.6125C21.6 14.8708 21.3333 15 21 15H19V18C19 18.55 18.8042 19.0208 18.4125 19.4125C18.0208 19.8042 17.55 20 17 20H15V22H13V18H17V13H19.7L18.75 9.125C18.3667 7.60833 17.55 6.375 16.3 5.425C15.05 4.475 13.6167 4 12 4C10.0667 4 8.41667 4.675 7.05 6.025C5.68333 7.375 5 9.01667 5 10.95C5 11.95 5.20417 12.9 5.6125 13.8C6.02083 14.7 6.6 15.5 7.35 16.2L8 16.8V22H6Z\"\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","<script lang=\"ts\" setup>\n/**\n * CalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `cal-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon cal-icon\"\n data-testid=\"kui-icon-wrapper-cal-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-cal-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 14C11.7167 14 11.4792 13.9042 11.2875 13.7125C11.0958 13.5208 11 13.2833 11 13C11 12.7167 11.0958 12.4792 11.2875 12.2875C11.4792 12.0958 11.7167 12 12 12C12.2833 12 12.5208 12.0958 12.7125 12.2875C12.9042 12.4792 13 12.7167 13 13C13 13.2833 12.9042 13.5208 12.7125 13.7125C12.5208 13.9042 12.2833 14 12 14ZM8 14C7.71667 14 7.47917 13.9042 7.2875 13.7125C7.09583 13.5208 7 13.2833 7 13C7 12.7167 7.09583 12.4792 7.2875 12.2875C7.47917 12.0958 7.71667 12 8 12C8.28333 12 8.52083 12.0958 8.7125 12.2875C8.90417 12.4792 9 12.7167 9 13C9 13.2833 8.90417 13.5208 8.7125 13.7125C8.52083 13.9042 8.28333 14 8 14ZM16 14C15.7167 14 15.4792 13.9042 15.2875 13.7125C15.0958 13.5208 15 13.2833 15 13C15 12.7167 15.0958 12.4792 15.2875 12.2875C15.4792 12.0958 15.7167 12 16 12C16.2833 12 16.5208 12.0958 16.7125 12.2875C16.9042 12.4792 17 12.7167 17 13C17 13.2833 16.9042 13.5208 16.7125 13.7125C16.5208 13.9042 16.2833 14 16 14ZM12 18C11.7167 18 11.4792 17.9042 11.2875 17.7125C11.0958 17.5208 11 17.2833 11 17C11 16.7167 11.0958 16.4792 11.2875 16.2875C11.4792 16.0958 11.7167 16 12 16C12.2833 16 12.5208 16.0958 12.7125 16.2875C12.9042 16.4792 13 16.7167 13 17C13 17.2833 12.9042 17.5208 12.7125 17.7125C12.5208 17.9042 12.2833 18 12 18ZM8 18C7.71667 18 7.47917 17.9042 7.2875 17.7125C7.09583 17.5208 7 17.2833 7 17C7 16.7167 7.09583 16.4792 7.2875 16.2875C7.47917 16.0958 7.71667 16 8 16C8.28333 16 8.52083 16.0958 8.7125 16.2875C8.90417 16.4792 9 16.7167 9 17C9 17.2833 8.90417 17.5208 8.7125 17.7125C8.52083 17.9042 8.28333 18 8 18ZM16 18C15.7167 18 15.4792 17.9042 15.2875 17.7125C15.0958 17.5208 15 17.2833 15 17C15 16.7167 15.0958 16.4792 15.2875 16.2875C15.4792 16.0958 15.7167 16 16 16C16.2833 16 16.5208 16.0958 16.7125 16.2875C16.9042 16.4792 17 16.7167 17 17C17 17.2833 16.9042 17.5208 16.7125 17.7125C16.5208 17.9042 16.2833 18 16 18ZM5 22C4.45 22 3.97917 21.8042 3.5875 21.4125C3.19583 21.0208 3 20.55 3 20V6C3 5.45 3.19583 4.97917 3.5875 4.5875C3.97917 4.19583 4.45 4 5 4H6V2H8V4H16V2H18V4H19C19.55 4 20.0208 4.19583 20.4125 4.5875C20.8042 4.97917 21 5.45 21 6V20C21 20.55 20.8042 21.0208 20.4125 21.4125C20.0208 21.8042 19.55 22 19 22H5ZM5 20H19V10H5V20Z\"\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","<script lang=\"ts\" setup>\n/**\n * CheckIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `check-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon check-icon\"\n data-testid=\"kui-icon-wrapper-check-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-check-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.7 18.025L4 12.325L5.425 10.9L9.7 15.175L18.875 6L20.3 7.425L9.7 18.025Z\"\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","<script lang=\"ts\" setup>\n/**\n * ClearIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `clear-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon clear-icon\"\n data-testid=\"kui-icon-wrapper-clear-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-clear-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M8.4 17L12 13.4L15.6 17L17 15.6L13.4 12L17 8.4L15.6 7L12 10.6L8.4 7L7 8.4L10.6 12L7 15.6L8.4 17ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * ClipboardIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `clipboard-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon clipboard-icon\"\n data-testid=\"kui-icon-wrapper-clipboard-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-clipboard-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 22C4.45 22 3.97917 21.8042 3.5875 21.4125C3.19583 21.0208 3 20.55 3 20V6C3 5.45 3.19583 4.97917 3.5875 4.5875C3.97917 4.19583 4.45 4 5 4H9.2C9.41667 3.4 9.77917 2.91667 10.2875 2.55C10.7958 2.18333 11.3667 2 12 2C12.6333 2 13.2042 2.18333 13.7125 2.55C14.2208 2.91667 14.5833 3.4 14.8 4H19C19.55 4 20.0208 4.19583 20.4125 4.5875C20.8042 4.97917 21 5.45 21 6V20C21 20.55 20.8042 21.0208 20.4125 21.4125C20.0208 21.8042 19.55 22 19 22H5ZM5 20H19V6H5V20ZM7 18H14V16H7V18ZM7 14H17V12H7V14ZM7 10H17V8H7V10ZM12 5.25C12.2167 5.25 12.3958 5.17917 12.5375 5.0375C12.6792 4.89583 12.75 4.71667 12.75 4.5C12.75 4.28333 12.6792 4.10417 12.5375 3.9625C12.3958 3.82083 12.2167 3.75 12 3.75C11.7833 3.75 11.6042 3.82083 11.4625 3.9625C11.3208 4.10417 11.25 4.28333 11.25 4.5C11.25 4.71667 11.3208 4.89583 11.4625 5.0375C11.6042 5.17917 11.7833 5.25 12 5.25Z\"\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","<script lang=\"ts\" setup>\n/**\n * ClockIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `clock-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon clock-icon\"\n data-testid=\"kui-icon-wrapper-clock-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-clock-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M15.3 16.7L16.7 15.3L13 11.6V7H11V12.4L15.3 16.7ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C14.2167 20 16.1042 19.2208 17.6625 17.6625C19.2208 16.1042 20 14.2167 20 12C20 9.78333 19.2208 7.89583 17.6625 6.3375C16.1042 4.77917 14.2167 4 12 4C9.78333 4 7.89583 4.77917 6.3375 6.3375C4.77917 7.89583 4 9.78333 4 12C4 14.2167 4.77917 16.1042 6.3375 17.6625C7.89583 19.2208 9.78333 20 12 20Z\"\n fill=\"currentColor\"\n />\n </svg>\n </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n","<script lang=\"ts\" setup>\n/**\n * CloseIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `close-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon close-icon\"\n data-testid=\"kui-icon-wrapper-close-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-close-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6.4 19L5 17.6L10.6 12L5 6.4L6.4 5L12 10.6L17.6 5L19 6.4L13.4 12L19 17.6L17.6 19L12 13.4L6.4 19Z\"\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","<script lang=\"ts\" setup>\n/**\n * CloudIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `cloud-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon cloud-icon\"\n data-testid=\"kui-icon-wrapper-cloud-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-cloud-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6.5 20C4.98333 20 3.6875 19.475 2.6125 18.425C1.5375 17.375 1 16.0917 1 14.575C1 13.275 1.39167 12.1167 2.175 11.1C2.95833 10.0833 3.98333 9.43333 5.25 9.15C5.66667 7.61667 6.5 6.375 7.75 5.425C9 4.475 10.4167 4 12 4C13.95 4 15.6042 4.67917 16.9625 6.0375C18.3208 7.39583 19 9.05 19 11C20.15 11.1333 21.1042 11.6292 21.8625 12.4875C22.6208 13.3458 23 14.35 23 15.5C23 16.75 22.5625 17.8125 21.6875 18.6875C20.8125 19.5625 19.75 20 18.5 20H6.5ZM6.5 18H18.5C19.2 18 19.7917 17.7583 20.275 17.275C20.7583 16.7917 21 16.2 21 15.5C21 14.8 20.7583 14.2083 20.275 13.725C19.7917 13.2417 19.2 13 18.5 13H17V11C17 9.61667 16.5125 8.4375 15.5375 7.4625C14.5625 6.4875 13.3833 6 12 6C10.6167 6 9.4375 6.4875 8.4625 7.4625C7.4875 8.4375 7 9.61667 7 11H6.5C5.53333 11 4.70833 11.3417 4.025 12.025C3.34167 12.7083 3 13.5333 3 14.5C3 15.4667 3.34167 16.2917 4.025 16.975C4.70833 17.6583 5.53333 18 6.5 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","<script lang=\"ts\" setup>\n/**\n * CogIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `cog-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon cog-icon\"\n data-testid=\"kui-icon-wrapper-cog-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-cog-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.2502 22L8.8502 18.8C8.63353 18.7167 8.42936 18.6167 8.2377 18.5C8.04603 18.3833 7.85853 18.2583 7.6752 18.125L4.7002 19.375L1.9502 14.625L4.5252 12.675C4.50853 12.5583 4.5002 12.4458 4.5002 12.3375V11.6625C4.5002 11.5542 4.50853 11.4417 4.5252 11.325L1.9502 9.375L4.7002 4.625L7.6752 5.875C7.85853 5.74167 8.0502 5.61667 8.2502 5.5C8.4502 5.38333 8.6502 5.28333 8.8502 5.2L9.2502 2H14.7502L15.1502 5.2C15.3669 5.28333 15.571 5.38333 15.7627 5.5C15.9544 5.61667 16.1419 5.74167 16.3252 5.875L19.3002 4.625L22.0502 9.375L19.4752 11.325C19.4919 11.4417 19.5002 11.5542 19.5002 11.6625V12.3375C19.5002 12.4458 19.4835 12.5583 19.4502 12.675L22.0252 14.625L19.2752 19.375L16.3252 18.125C16.1419 18.2583 15.9502 18.3833 15.7502 18.5C15.5502 18.6167 15.3502 18.7167 15.1502 18.8L14.7502 22H9.2502ZM12.0502 15.5C13.0169 15.5 13.8419 15.1583 14.5252 14.475C15.2085 13.7917 15.5502 12.9667 15.5502 12C15.5502 11.0333 15.2085 10.2083 14.5252 9.525C13.8419 8.84167 13.0169 8.5 12.0502 8.5C11.0669 8.5 10.2377 8.84167 9.5627 9.525C8.8877 10.2083 8.5502 11.0333 8.5502 12C8.5502 12.9667 8.8877 13.7917 9.5627 14.475C10.2377 15.1583 11.0669 15.5 12.0502 15.5Z\"\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","<script lang=\"ts\" setup>\n/**\n * CollapseIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `collapse-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon collapse-icon\"\n data-testid=\"kui-icon-wrapper-collapse-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-collapse-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M3.4 22L2 20.6L8.6 14H4V12H12V20H10V15.4L3.4 22ZM12 12V4H14V8.6L20.6 2L22 3.4L15.4 10H20V12H12Z\"\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","<script lang=\"ts\" setup>\n/**\n * ConnectionsIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `connections-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon connections-icon\"\n data-testid=\"kui-icon-wrapper-connections-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-connections-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n clip-rule=\"evenodd\"\n d=\"M20.999 12H11.999V3H20.999V6.07595V12ZM9.53418 15.5342L9.53418 9L3 9V15.5342H9.53418ZM16.9971 15V20.1989H11.7982L11.7982 15H16.9971Z\"\n fill=\"currentColor\"\n fill-rule=\"evenodd\"\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","<script lang=\"ts\" setup>\n/**\n * CopyIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `copy-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon copy-icon\"\n data-testid=\"kui-icon-wrapper-copy-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-copy-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 22C4.45 22 3.97917 21.8042 3.5875 21.4125C3.19583 21.0208 3 20.55 3 20V6H5V20H16V22H5ZM9 18C8.45 18 7.97917 17.8042 7.5875 17.4125C7.19583 17.0208 7 16.55 7 16V4C7 3.45 7.19583 2.97917 7.5875 2.5875C7.97917 2.19583 8.45 2 9 2H18C18.55 2 19.0208 2.19583 19.4125 2.5875C19.8042 2.97917 20 3.45 20 4V16C20 16.55 19.8042 17.0208 19.4125 17.4125C19.0208 17.8042 18.55 18 18 18H9ZM9 16H18V4H9V16Z\"\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","<script lang=\"ts\" setup>\n/**\n * DashboardIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `dashboard-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon dashboard-icon\"\n data-testid=\"kui-icon-wrapper-dashboard-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-dashboard-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M10.45 15.5C10.85 15.9 11.3667 16.0958 12 16.0875C12.6333 16.0792 13.1 15.85 13.4 15.4L19 7L10.6 12.6C10.15 12.9 9.9125 13.3583 9.8875 13.975C9.8625 14.5917 10.05 15.1 10.45 15.5ZM12 4C12.9833 4 13.9292 4.1375 14.8375 4.4125C15.7458 4.6875 16.6 5.1 17.4 5.65L15.5 6.85C14.95 6.56667 14.3792 6.35417 13.7875 6.2125C13.1958 6.07083 12.6 6 12 6C9.78333 6 7.89583 6.77917 6.3375 8.3375C4.77917 9.89583 4 11.7833 4 14C4 14.7 4.09583 15.3917 4.2875 16.075C4.47917 16.7583 4.75 17.4 5.1 18H18.9C19.2833 17.3667 19.5625 16.7083 19.7375 16.025C19.9125 15.3417 20 14.6333 20 13.9C20 13.3 19.9292 12.7167 19.7875 12.15C19.6458 11.5833 19.4333 11.0333 19.15 10.5L20.35 8.6C20.85 9.38333 21.2458 10.2167 21.5375 11.1C21.8292 11.9833 21.9833 12.9 22 13.85C22.0167 14.8 21.9083 15.7083 21.675 16.575C21.4417 17.4417 21.1 18.2667 20.65 19.05C20.4667 19.35 20.2167 19.5833 19.9 19.75C19.5833 19.9167 19.25 20 18.9 20H5.1C4.75 20 4.41667 19.9167 4.1 19.75C3.78333 19.5833 3.53333 19.35 3.35 19.05C2.91667 18.3 2.58333 17.5042 2.35 16.6625C2.11667 15.8208 2 14.9333 2 14C2 12.6167 2.2625 11.3208 2.7875 10.1125C3.3125 8.90417 4.02917 7.84583 4.9375 6.9375C5.84583 6.02917 6.90833 5.3125 8.125 4.7875C9.34167 4.2625 10.6333 4 12 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","<script lang=\"ts\" setup>\n/**\n * DeployIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `deploy-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon deploy-icon\"\n data-testid=\"kui-icon-wrapper-deploy-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-deploy-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11 19.425V12.575L5 9.1V15.95L11 19.425ZM13 19.425L19 15.95V9.1L13 12.575V19.425ZM12 10.85L17.925 7.425L12 4L6.075 7.425L12 10.85ZM4 17.7C3.68333 17.5167 3.4375 17.275 3.2625 16.975C3.0875 16.675 3 16.3417 3 15.975V8.025C3 7.65833 3.0875 7.325 3.2625 7.025C3.4375 6.725 3.68333 6.48333 4 6.3L11 2.275C11.3167 2.09167 11.65 2 12 2C12.35 2 12.6833 2.09167 13 2.275L20 6.3C20.3167 6.48333 20.5625 6.725 20.7375 7.025C20.9125 7.325 21 7.65833 21 8.025V15.975C21 16.3417 20.9125 16.675 20.7375 16.975C20.5625 17.275 20.3167 17.5167 20 17.7L13 21.725C12.6833 21.9083 12.35 22 12 22C11.65 22 11.3167 21.9083 11 21.725L4 17.7Z\"\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","<script lang=\"ts\" setup>\n/**\n * DisabledIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `disabled-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon disabled-icon\"\n data-testid=\"kui-icon-wrapper-disabled-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-disabled-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 11.1 19.8542 10.2333 19.5625 9.4C19.2708 8.56667 18.85 7.8 18.3 7.1L7.1 18.3C7.8 18.85 8.56667 19.2708 9.4 19.5625C10.2333 19.8542 11.1 20 12 20ZM5.7 16.9L16.9 5.7C16.2 5.15 15.4333 4.72917 14.6 4.4375C13.7667 4.14583 12.9 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 12.9 4.14583 13.7667 4.4375 14.6C4.72917 15.4333 5.15 16.2 5.7 16.9Z\"\n fill=\"currentColor\"\n />\n </svg>\n </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n","<script lang=\"ts\" setup>\n/**\n * DocumentIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `document-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon document-icon\"\n data-testid=\"kui-icon-wrapper-document-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-document-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M7 17H14V15H7V17ZM7 13H17V11H7V13ZM7 9H17V7H7V9ZM5 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","<script lang=\"ts\" setup>\n/**\n * DragIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `drag-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon drag-icon\"\n data-testid=\"kui-icon-wrapper-drag-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-drag-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9 20C8.45 20 7.97917 19.8042 7.5875 19.4125C7.19583 19.0208 7 18.55 7 18C7 17.45 7.19583 16.9792 7.5875 16.5875C7.97917 16.1958 8.45 16 9 16C9.55 16 10.0208 16.1958 10.4125 16.5875C10.8042 16.9792 11 17.45 11 18C11 18.55 10.8042 19.0208 10.4125 19.4125C10.0208 19.8042 9.55 20 9 20ZM15 20C14.45 20 13.9792 19.8042 13.5875 19.4125C13.1958 19.0208 13 18.55 13 18C13 17.45 13.1958 16.9792 13.5875 16.5875C13.9792 16.1958 14.45 16 15 16C15.55 16 16.0208 16.1958 16.4125 16.5875C16.8042 16.9792 17 17.45 17 18C17 18.55 16.8042 19.0208 16.4125 19.4125C16.0208 19.8042 15.55 20 15 20ZM9 14C8.45 14 7.97917 13.8042 7.5875 13.4125C7.19583 13.0208 7 12.55 7 12C7 11.45 7.19583 10.9792 7.5875 10.5875C7.97917 10.1958 8.45 10 9 10C9.55 10 10.0208 10.1958 10.4125 10.5875C10.8042 10.9792 11 11.45 11 12C11 12.55 10.8042 13.0208 10.4125 13.4125C10.0208 13.8042 9.55 14 9 14ZM15 14C14.45 14 13.9792 13.8042 13.5875 13.4125C13.1958 13.0208 13 12.55 13 12C13 11.45 13.1958 10.9792 13.5875 10.5875C13.9792 10.1958 14.45 10 15 10C15.55 10 16.0208 10.1958 16.4125 10.5875C16.8042 10.9792 17 11.45 17 12C17 12.55 16.8042 13.0208 16.4125 13.4125C16.0208 13.8042 15.55 14 15 14ZM9 8C8.45 8 7.97917 7.80417 7.5875 7.4125C7.19583 7.02083 7 6.55 7 6C7 5.45 7.19583 4.97917 7.5875 4.5875C7.97917 4.19583 8.45 4 9 4C9.55 4 10.0208 4.19583 10.4125 4.5875C10.8042 4.97917 11 5.45 11 6C11 6.55 10.8042 7.02083 10.4125 7.4125C10.0208 7.80417 9.55 8 9 8ZM15 8C14.45 8 13.9792 7.80417 13.5875 7.4125C13.1958 7.02083 13 6.55 13 6C13 5.45 13.1958 4.97917 13.5875 4.5875C13.9792 4.19583 14.45 4 15 4C15.55 4 16.0208 4.19583 16.4125 4.5875C16.8042 4.97917 17 5.45 17 6C17 6.55 16.8042 7.02083 16.4125 7.4125C16.0208 7.80417 15.55 8 15 8Z\"\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","<script lang=\"ts\" setup>\n/**\n * EditIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `edit-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon edit-icon\"\n data-testid=\"kui-icon-wrapper-edit-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-edit-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 19H6.4L15.025 10.375L13.625 8.975L5 17.6V19ZM19.3 8.925L15.05 4.725L16.45 3.325C16.8333 2.94167 17.3042 2.75 17.8625 2.75C18.4208 2.75 18.8917 2.94167 19.275 3.325L20.675 4.725C21.0583 5.10833 21.2583 5.57083 21.275 6.1125C21.2917 6.65417 21.1083 7.11667 20.725 7.5L19.3 8.925ZM17.85 10.4L7.25 21H3V16.75L13.6 6.15L17.85 10.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","<script lang=\"ts\" setup>\n/**\n * ExpandIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `expand-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon expand-icon\"\n data-testid=\"kui-icon-wrapper-expand-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-expand-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M3 21V13H5V17.6L17.6 5H13V3H21V11H19V6.4L6.4 19H11V21H3Z\"\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","<script lang=\"ts\" setup>\n/**\n * FilterIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `filter-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon filter-icon\"\n data-testid=\"kui-icon-wrapper-filter-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-filter-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M10 18V16H14V18H10ZM6 13V11H18V13H6ZM3 8V6H21V8H3Z\"\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","<script lang=\"ts\" setup>\n/**\n * FlagIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `flag-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon flag-icon\"\n data-testid=\"kui-icon-wrapper-flag-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-flag-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M4 20V3H13L13.4 5H19V15H12L11.6 13H6V20H4ZM13.65 13H17V7H11.75L11.35 5H6V11H13.25L13.65 13Z\"\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","<script lang=\"ts\" setup>\n/**\n * GraduationIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `graduation-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon graduation-icon\"\n data-testid=\"kui-icon-wrapper-graduation-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-graduation-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 21L5 17.2V11.2L1 9L12 3L23 9V17H21V10.1L19 11.2V17.2L12 21ZM12 12.7L18.85 9L12 5.3L5.15 9L12 12.7ZM12 18.725L17 16.025V12.25L12 15L7 12.25V16.025L12 18.725Z\"\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","<script lang=\"ts\" setup>\n/**\n * GridIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `grid-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon grid-icon\"\n data-testid=\"kui-icon-wrapper-grid-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-grid-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M3 11V3H11V11H3ZM3 21V13H11V21H3ZM13 11V3H21V11H13ZM13 21V13H21V21H13ZM5 9H9V5H5V9ZM15 9H19V5H15V9ZM15 19H19V15H15V19ZM5 19H9V15H5V19Z\"\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","<script lang=\"ts\" setup>\n/**\n * HelpIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `help-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon help-icon\"\n data-testid=\"kui-icon-wrapper-help-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-help-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11.95 18C12.3 18 12.5958 17.8792 12.8375 17.6375C13.0792 17.3958 13.2 17.1 13.2 16.75C13.2 16.4 13.0792 16.1042 12.8375 15.8625C12.5958 15.6208 12.3 15.5 11.95 15.5C11.6 15.5 11.3042 15.6208 11.0625 15.8625C10.8208 16.1042 10.7 16.4 10.7 16.75C10.7 17.1 10.8208 17.3958 11.0625 17.6375C11.3042 17.8792 11.6 18 11.95 18ZM11.05 14.15H12.9C12.9 13.6 12.9625 13.1667 13.0875 12.85C13.2125 12.5333 13.5667 12.1 14.15 11.55C14.5833 11.1167 14.925 10.7042 15.175 10.3125C15.425 9.92083 15.55 9.45 15.55 8.9C15.55 7.96667 15.2083 7.25 14.525 6.75C13.8417 6.25 13.0333 6 12.1 6C11.15 6 10.3792 6.25 9.7875 6.75C9.19583 7.25 8.78333 7.85 8.55 8.55L10.2 9.2C10.2833 8.9 10.4708 8.575 10.7625 8.225C11.0542 7.875 11.5 7.7 12.1 7.7C12.6333 7.7 13.0333 7.84583 13.3 8.1375C13.5667 8.42917 13.7 8.75 13.7 9.1C13.7 9.43333 13.6 9.74583 13.4 10.0375C13.2 10.3292 12.95 10.6 12.65 10.85C11.9167 11.5 11.4667 11.9917 11.3 12.325C11.1333 12.6583 11.05 13.2667 11.05 14.15ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * ImageIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `image-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon image-icon\"\n data-testid=\"kui-icon-wrapper-image-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-image-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 22C4.16667 22 3.45833 21.7083 2.875 21.125C2.29167 20.5417 2 19.8333 2 19V5C2 4.16667 2.29167 3.45833 2.875 2.875C3.45833 2.29167 4.16667 2 5 2H19C19.8333 2 20.5417 2.29167 21.125 2.875C21.7083 3.45833 22 4.16667 22 5V19C22 19.8333 21.7083 20.5417 21.125 21.125C20.5417 21.7083 19.8333 22 19 22H5ZM5 20H19C19.2833 20 19.5208 19.9042 19.7125 19.7125C19.9042 19.5208 20 19.2833 20 19V5C20 4.71667 19.9042 4.47917 19.7125 4.2875C19.5208 4.09583 19.2833 4 19 4H5C4.71667 4 4.47917 4.09583 4.2875 4.2875C4.09583 4.47917 4 4.71667 4 5V19C4 19.2833 4.09583 19.5208 4.2875 19.7125C4.47917 19.9042 4.71667 20 5 20ZM6 18L10 14L11.8 15.775L14 13L18 18H6ZM8 10C7.45 10 6.97917 9.80417 6.5875 9.4125C6.19583 9.02083 6 8.55 6 8C6 7.45 6.19583 6.97917 6.5875 6.5875C6.97917 6.19583 7.45 6 8 6C8.55 6 9.02083 6.19583 9.4125 6.5875C9.80417 6.97917 10 7.45 10 8C10 8.55 9.80417 9.02083 9.4125 9.4125C9.02083 9.80417 8.55 10 8 10Z\"\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","<script lang=\"ts\" setup>\n/**\n * InboxIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `inbox-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon inbox-icon\"\n data-testid=\"kui-icon-wrapper-inbox-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-inbox-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 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 19H19V16H16C15.5 16.6333 14.9042 17.125 14.2125 17.475C13.5208 17.825 12.7833 18 12 18C11.2167 18 10.4792 17.825 9.7875 17.475C9.09583 17.125 8.5 16.6333 8 16H5V19ZM12 16C12.6333 16 13.2083 15.8167 13.725 15.45C14.2417 15.0833 14.6 14.6 14.8 14H19V5H5V14H9.2C9.4 14.6 9.75833 15.0833 10.275 15.45C10.7917 15.8167 11.3667 16 12 16Z\"\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","<script lang=\"ts\" setup>\n/**\n * InfoIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `info-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon info-icon\"\n data-testid=\"kui-icon-wrapper-info-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-info-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11 17H13V11H11V17ZM12 9C12.2833 9 12.5208 8.90417 12.7125 8.7125C12.9042 8.52083 13 8.28333 13 8C13 7.71667 12.9042 7.47917 12.7125 7.2875C12.5208 7.09583 12.2833 7 12 7C11.7167 7 11.4792 7.09583 11.2875 7.2875C11.0958 7.47917 11 7.71667 11 8C11 8.28333 11.0958 8.52083 11.2875 8.7125C11.4792 8.90417 11.7167 9 12 9ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * KongIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `kong-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon kong-icon\"\n data-testid=\"kui-icon-wrapper-kong-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-kong-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n clip-rule=\"evenodd\"\n d=\"M8.56654 17.8134H12.2371L14.1429 20.2096L13.8152 21.026H9.0731L9.18942 20.2096L8.07153 18.4462L8.56654 17.8134ZM11.193 7.28639L13.1602 7.28343L22 17.822L21.3132 21.026H17.5245L17.7604 20.1233L9.50009 10.2732L11.193 7.28639ZM14.6686 3L18.778 6.22975L18.2519 6.77265L18.9644 7.76492V8.82592L16.9157 10.496L13.4703 6.42551H11.4644L12.272 4.94512L14.6686 3ZM6.04318 13.3443L8.90974 10.853L12.7144 15.4313L11.6342 17.1086H8.12603L5.69899 20.2934L5.14469 21.026H2V17.1183L4.93106 13.3443H6.04318Z\"\n fill=\"currentColor\"\n fill-rule=\"evenodd\"\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","<script lang=\"ts\" setup>\n/**\n * ListIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `list-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon list-icon\"\n data-testid=\"kui-icon-wrapper-list-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-list-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M4 17C3.71667 17 3.47917 16.9042 3.2875 16.7125C3.09583 16.5208 3 16.2833 3 16C3 15.7167 3.09583 15.4792 3.2875 15.2875C3.47917 15.0958 3.71667 15 4 15C4.28333 15 4.52083 15.0958 4.7125 15.2875C4.90417 15.4792 5 15.7167 5 16C5 16.2833 4.90417 16.5208 4.7125 16.7125C4.52083 16.9042 4.28333 17 4 17ZM4 13C3.71667 13 3.47917 12.9042 3.2875 12.7125C3.09583 12.5208 3 12.2833 3 12C3 11.7167 3.09583 11.4792 3.2875 11.2875C3.47917 11.0958 3.71667 11 4 11C4.28333 11 4.52083 11.0958 4.7125 11.2875C4.90417 11.4792 5 11.7167 5 12C5 12.2833 4.90417 12.5208 4.7125 12.7125C4.52083 12.9042 4.28333 13 4 13ZM4 9C3.71667 9 3.47917 8.90417 3.2875 8.7125C3.09583 8.52083 3 8.28333 3 8C3 7.71667 3.09583 7.47917 3.2875 7.2875C3.47917 7.09583 3.71667 7 4 7C4.28333 7 4.52083 7.09583 4.7125 7.2875C4.90417 7.47917 5 7.71667 5 8C5 8.28333 4.90417 8.52083 4.7125 8.7125C4.52083 8.90417 4.28333 9 4 9ZM7 17V15H21V17H7ZM7 13V11H21V13H7ZM7 9V7H21V9H7Z\"\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","<script lang=\"ts\" setup>\n/**\n * LockIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `lock-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon lock-icon\"\n data-testid=\"kui-icon-wrapper-lock-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-lock-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8H7V6C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM6 20H18V10H6V20ZM12 17C12.55 17 13.0208 16.8042 13.4125 16.4125C13.8042 16.0208 14 15.55 14 15C14 14.45 13.8042 13.9792 13.4125 13.5875C13.0208 13.1958 12.55 13 12 13C11.45 13 10.9792 13.1958 10.5875 13.5875C10.1958 13.9792 10 14.45 10 15C10 15.55 10.1958 16.0208 10.5875 16.4125C10.9792 16.8042 11.45 17 12 17ZM9 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6V8Z\"\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","<script lang=\"ts\" setup>\n/**\n * MeshIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `mesh-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon mesh-icon\"\n data-testid=\"kui-icon-wrapper-mesh-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-mesh-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6 20C5.16667 20 4.45833 19.7083 3.875 19.125C3.29167 18.5417 3 17.8333 3 17C3 16.1667 3.29167 15.4583 3.875 14.875C4.45833 14.2917 5.16667 14 6 14C6.83333 14 7.54167 14.2917 8.125 14.875C8.70833 15.4583 9 16.1667 9 17C9 17.8333 8.70833 18.5417 8.125 19.125C7.54167 19.7083 6.83333 20 6 20ZM18 20C17.1667 20 16.4583 19.7083 15.875 19.125C15.2917 18.5417 15 17.8333 15 17C15 16.1667 15.2917 15.4583 15.875 14.875C16.4583 14.2917 17.1667 14 18 14C18.8333 14 19.5417 14.2917 20.125 14.875C20.7083 15.4583 21 16.1667 21 17C21 17.8333 20.7083 18.5417 20.125 19.125C19.5417 19.7083 18.8333 20 18 20ZM12 10C11.1667 10 10.4583 9.70833 9.875 9.125C9.29167 8.54167 9 7.83333 9 7C9 6.16667 9.29167 5.45833 9.875 4.875C10.4583 4.29167 11.1667 4 12 4C12.8333 4 13.5417 4.29167 14.125 4.875C14.7083 5.45833 15 6.16667 15 7C15 7.83333 14.7083 8.54167 14.125 9.125C13.5417 9.70833 12.8333 10 12 10Z\"\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","<script lang=\"ts\" setup>\n/**\n * MoreIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `more-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon more-icon\"\n data-testid=\"kui-icon-wrapper-more-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-more-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 20C11.45 20 10.9792 19.8042 10.5875 19.4125C10.1958 19.0208 10 18.55 10 18C10 17.45 10.1958 16.9792 10.5875 16.5875C10.9792 16.1958 11.45 16 12 16C12.55 16 13.0208 16.1958 13.4125 16.5875C13.8042 16.9792 14 17.45 14 18C14 18.55 13.8042 19.0208 13.4125 19.4125C13.0208 19.8042 12.55 20 12 20ZM12 14C11.45 14 10.9792 13.8042 10.5875 13.4125C10.1958 13.0208 10 12.55 10 12C10 11.45 10.1958 10.9792 10.5875 10.5875C10.9792 10.1958 11.45 10 12 10C12.55 10 13.0208 10.1958 13.4125 10.5875C13.8042 10.9792 14 11.45 14 12C14 12.55 13.8042 13.0208 13.4125 13.4125C13.0208 13.8042 12.55 14 12 14ZM12 8C11.45 8 10.9792 7.80417 10.5875 7.4125C10.1958 7.02083 10 6.55 10 6C10 5.45 10.1958 4.97917 10.5875 4.5875C10.9792 4.19583 11.45 4 12 4C12.55 4 13.0208 4.19583 13.4125 4.5875C13.8042 4.97917 14 5.45 14 6C14 6.55 13.8042 7.02083 13.4125 7.4125C13.0208 7.80417 12.55 8 12 8Z\"\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","<script lang=\"ts\" setup>\n/**\n * NotificationIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `notification-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon notification-icon\"\n data-testid=\"kui-icon-wrapper-notification-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-notification-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22ZM8 17H16V10C16 8.9 15.6083 7.95833 14.825 7.175C14.0417 6.39167 13.1 6 12 6C10.9 6 9.95833 6.39167 9.175 7.175C8.39167 7.95833 8 8.9 8 10V17Z\"\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","<script lang=\"ts\" setup>\n/**\n * OverviewIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `overview-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon overview-icon\"\n data-testid=\"kui-icon-wrapper-overview-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-overview-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n clip-rule=\"evenodd\"\n d=\"M9.92421 2.40002L5.76021 9.60002H18.2402L12.0002 20.4L5.76021 9.60002L1.51221 16.968L3.67221 20.4H21.2402L22.8482 17.592L14.0882 2.40002H9.91221H9.92421Z\"\n fill=\"currentColor\"\n fill-rule=\"evenodd\"\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","<script lang=\"ts\" setup>\n/**\n * PeopleIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `people-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon people-icon\"\n data-testid=\"kui-icon-wrapper-people-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-people-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M1 20V17.2C1 16.6333 1.14583 16.1125 1.4375 15.6375C1.72917 15.1625 2.11667 14.8 2.6 14.55C3.63333 14.0333 4.68333 13.6458 5.75 13.3875C6.81667 13.1292 7.9 13 9 13C10.1 13 11.1833 13.1292 12.25 13.3875C13.3167 13.6458 14.3667 14.0333 15.4 14.55C15.8833 14.8 16.2708 15.1625 16.5625 15.6375C16.8542 16.1125 17 16.6333 17 17.2V20H1ZM19 20V17C19 16.2667 18.7958 15.5625 18.3875 14.8875C17.9792 14.2125 17.4 13.6333 16.65 13.15C17.5 13.25 18.3 13.4208 19.05 13.6625C19.8 13.9042 20.5 14.2 21.15 14.55C21.75 14.8833 22.2083 15.2542 22.525 15.6625C22.8417 16.0708 23 16.5167 23 17V20H19ZM9 12C7.9 12 6.95833 11.6083 6.175 10.825C5.39167 10.0417 5 9.1 5 8C5 6.9 5.39167 5.95833 6.175 5.175C6.95833 4.39167 7.9 4 9 4C10.1 4 11.0417 4.39167 11.825 5.175C12.6083 5.95833 13 6.9 13 8C13 9.1 12.6083 10.0417 11.825 10.825C11.0417 11.6083 10.1 12 9 12ZM19 8C19 9.1 18.6083 10.0417 17.825 10.825C17.0417 11.6083 16.1 12 15 12C14.8167 12 14.5833 11.9792 14.3 11.9375C14.0167 11.8958 13.7833 11.85 13.6 11.8C14.05 11.2667 14.3958 10.675 14.6375 10.025C14.8792 9.375 15 8.7 15 8C15 7.3 14.8792 6.625 14.6375 5.975C14.3958 5.325 14.05 4.73333 13.6 4.2C13.8333 4.11667 14.0667 4.0625 14.3 4.0375C14.5333 4.0125 14.7667 4 15 4C16.1 4 17.0417 4.39167 17.825 5.175C18.6083 5.95833 19 6.9 19 8Z\"\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","<script lang=\"ts\" setup>\n/**\n * PlugIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `plug-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon plug-icon\"\n data-testid=\"kui-icon-wrapper-plug-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-plug-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11.5 19H12.5V17.15L16 13.65V9H8V13.65L11.5 17.15V19ZM9.5 21V18L6 14.5V9C6 8.45 6.19583 7.97917 6.5875 7.5875C6.97917 7.19583 7.45 7 8 7H9L8 8V3H10V7H14V3H16V8L15 7H16C16.55 7 17.0208 7.19583 17.4125 7.5875C17.8042 7.97917 18 8.45 18 9V14.5L14.5 18V21H9.5Z\"\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","<script lang=\"ts\" setup>\n/**\n * PortalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `portal-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon portal-icon\"\n data-testid=\"kui-icon-wrapper-portal-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-portal-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.4 19.55C9.1 19 8.8375 18.4292 8.6125 17.8375C8.3875 17.2458 8.2 16.6333 8.05 16H5.1C5.58333 16.8333 6.1875 17.5583 6.9125 18.175C7.6375 18.7917 8.46667 19.25 9.4 19.55ZM4.25 14H7.65C7.6 13.6667 7.5625 13.3375 7.5375 13.0125C7.5125 12.6875 7.5 12.35 7.5 12C7.5 11.65 7.5125 11.3125 7.5375 10.9875C7.5625 10.6625 7.6 10.3333 7.65 10H4.25C4.16667 10.3333 4.10417 10.6625 4.0625 10.9875C4.02083 11.3125 4 11.65 4 12C4 12.35 4.02083 12.6875 4.0625 13.0125C4.10417 13.3375 4.16667 13.6667 4.25 14ZM5.1 8H8.05C8.2 7.36667 8.3875 6.75417 8.6125 6.1625C8.8375 5.57083 9.1 5 9.4 4.45C8.46667 4.75 7.6375 5.20833 6.9125 5.825C6.1875 6.44167 5.58333 7.16667 5.1 8ZM10.1 8H13.9C13.7 7.26667 13.4417 6.575 13.125 5.925C12.8083 5.275 12.4333 4.65 12 4.05C11.5667 4.65 11.1917 5.275 10.875 5.925C10.5583 6.575 10.3 7.26667 10.1 8ZM15.95 8H18.9C18.4167 7.16667 17.8125 6.44167 17.0875 5.825C16.3625 5.20833 15.5333 4.75 14.6 4.45C14.9 5 15.1625 5.57083 15.3875 6.1625C15.6125 6.75417 15.8 7.36667 15.95 8ZM12 22C10.6333 22 9.34167 21.7375 8.125 21.2125C6.90833 20.6875 5.84583 19.9708 4.9375 19.0625C4.02917 18.1542 3.3125 17.0917 2.7875 15.875C2.2625 14.6583 2 13.3667 2 12C2 10.6167 2.2625 9.32083 2.7875 8.1125C3.3125 6.90417 4.02917 5.84583 4.9375 4.9375C5.84583 4.02917 6.90833 3.3125 8.125 2.7875C9.34167 2.2625 10.6333 2 12 2C13.3833 2 14.6792 2.2625 15.8875 2.7875C17.0958 3.3125 18.1542 4.02917 19.0625 4.9375C19.9708 5.84583 20.6875 6.90417 21.2125 8.1125C21.7375 9.32083 22 10.6167 22 12C22 12.1667 21.9958 12.3333 21.9875 12.5C21.9792 12.6667 21.9667 12.8333 21.95 13H19.925C19.9583 12.8333 19.9792 12.6708 19.9875 12.5125C19.9958 12.3542 20 12.1833 20 12C20 11.65 19.9792 11.3125 19.9375 10.9875C19.8958 10.6625 19.8333 10.3333 19.75 10H16.35C16.4 10.3333 16.4375 10.6625 16.4625 10.9875C16.4875 11.3125 16.5 11.65 16.5 12V12.5125C16.5 12.6708 16.4917 12.8333 16.475 13H14.475C14.4917 12.8333 14.5 12.6708 14.5 12.5125V12C14.5 11.65 14.4875 11.3125 14.4625 10.9875C14.4375 10.6625 14.4 10.3333 14.35 10H9.65C9.6 10.3333 9.5625 10.6625 9.5375 10.9875C9.5125 11.3125 9.5 11.65 9.5 12C9.5 12.35 9.5125 12.6875 9.5375 13.0125C9.5625 13.3375 9.6 13.6667 9.65 14H13V16H10.1C10.3 16.7333 10.5583 17.425 10.875 18.075C11.1917 18.725 11.5667 19.35 12 19.95C12.1833 19.6833 12.3583 19.4125 12.525 19.1375C12.6917 18.8625 12.85 18.5833 13 18.3V21.95C12.8333 21.9667 12.6708 21.9792 12.5125 21.9875C12.3542 21.9958 12.1833 22 12 22ZM19.95 21.375L17 18.425V20.65H15V15H20.65V17H18.4L21.35 19.95L19.95 21.375Z\"\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","<script lang=\"ts\" setup>\n/**\n * PresentationIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `presentation-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon presentation-icon\"\n data-testid=\"kui-icon-wrapper-presentation-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-presentation-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.5 16.5L16.5 12L9.5 7.5V16.5ZM5 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","<script lang=\"ts\" setup>\n/**\n * ProfileIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `profile-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon profile-icon\"\n data-testid=\"kui-icon-wrapper-profile-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-profile-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5.85 17.1C6.7 16.45 7.65 15.9375 8.7 15.5625C9.75 15.1875 10.85 15 12 15C13.15 15 14.25 15.1875 15.3 15.5625C16.35 15.9375 17.3 16.45 18.15 17.1C18.7333 16.4167 19.1875 15.6417 19.5125 14.775C19.8375 13.9083 20 12.9833 20 12C20 9.78333 19.2208 7.89583 17.6625 6.3375C16.1042 4.77917 14.2167 4 12 4C9.78333 4 7.89583 4.77917 6.3375 6.3375C4.77917 7.89583 4 9.78333 4 12C4 12.9833 4.1625 13.9083 4.4875 14.775C4.8125 15.6417 5.26667 16.4167 5.85 17.1ZM12 13C11.0167 13 10.1875 12.6625 9.5125 11.9875C8.8375 11.3125 8.5 10.4833 8.5 9.5C8.5 8.51667 8.8375 7.6875 9.5125 7.0125C10.1875 6.3375 11.0167 6 12 6C12.9833 6 13.8125 6.3375 14.4875 7.0125C15.1625 7.6875 15.5 8.51667 15.5 9.5C15.5 10.4833 15.1625 11.3125 14.4875 11.9875C13.8125 12.6625 12.9833 13 12 13ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * RedoIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `redo-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon redo-icon\"\n data-testid=\"kui-icon-wrapper-redo-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-redo-icon\"\n fill=\"none\"\n height=\"100%\"\n role=\"img\"\n viewBox=\"0 0 24 24\"\n width=\"100%\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <title\n v-if=\"title\"\n :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.9 19C8.28333 19 6.89583 18.475 5.7375 17.425C4.57917 16.375 4 15.0667 4 13.5C4 11.9333 4.57917 10.625 5.7375 9.575C6.89583 8.525 8.28333 8 9.9 8H16.2L13.6 5.4L15 4L20 9L15 14L13.6 12.6L16.2 10H9.9C8.85 10 7.9375 10.3333 7.1625 11C6.3875 11.6667 6 12.5 6 13.5C6 14.5 6.3875 15.3333 7.1625 16C7.9375 16.6667 8.85 17 9.9 17H17V19H9.9Z\"\n fill=\"currentColor\"\n />\n </svg>\n </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n","<script lang=\"ts\" setup>\n/**\n * RuntimesIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `runtimes-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon runtimes-icon\"\n data-testid=\"kui-icon-wrapper-runtimes-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-runtimes-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n clip-rule=\"evenodd\"\n d=\"M15.4802 1.19995H9.6002H4.0562L1.2002 3.71995V15.144L3.6002 17.88V6.83995L7.2722 3.59995H17.5922L15.4802 1.19995ZM8.86824 6H20.2802L22.8002 8.868V20.28L19.9442 22.8H8.52024L6.00024 19.944V8.52L8.86824 6Z\"\n fill=\"currentColor\"\n fill-rule=\"evenodd\"\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","<script lang=\"ts\" setup>\n/**\n * SearchIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `search-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon search-icon\"\n data-testid=\"kui-icon-wrapper-search-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-search-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M19.6 21L13.3 14.7C12.8 15.1 12.225 15.4167 11.575 15.65C10.925 15.8833 10.2333 16 9.5 16C7.68333 16 6.14583 15.3708 4.8875 14.1125C3.62917 12.8542 3 11.3167 3 9.5C3 7.68333 3.62917 6.14583 4.8875 4.8875C6.14583 3.62917 7.68333 3 9.5 3C11.3167 3 12.8542 3.62917 14.1125 4.8875C15.3708 6.14583 16 7.68333 16 9.5C16 10.2333 15.8833 10.925 15.65 11.575C15.4167 12.225 15.1 12.8 14.7 13.3L21 19.6L19.6 21ZM9.5 14C10.75 14 11.8125 13.5625 12.6875 12.6875C13.5625 11.8125 14 10.75 14 9.5C14 8.25 13.5625 7.1875 12.6875 6.3125C11.8125 5.4375 10.75 5 9.5 5C8.25 5 7.1875 5.4375 6.3125 6.3125C5.4375 7.1875 5 8.25 5 9.5C5 10.75 5.4375 11.8125 6.3125 12.6875C7.1875 13.5625 8.25 14 9.5 14Z\"\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","<script lang=\"ts\" setup>\n/**\n * SecurityIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `security-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon security-icon\"\n data-testid=\"kui-icon-wrapper-security-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-security-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.2 15.6L12 13.5L14.75 15.6L13.7 12.2L16.5 10H13.1L12 6.6L10.9 10H7.5L10.25 12.2L9.2 15.6ZM12 22C9.68333 21.4167 7.77083 20.0875 6.2625 18.0125C4.75417 15.9375 4 13.6333 4 11.1V5L12 2L20 5V11.1C20 13.6333 19.2458 15.9375 17.7375 18.0125C16.2292 20.0875 14.3167 21.4167 12 22ZM12 19.9C13.7333 19.35 15.1667 18.25 16.3 16.6C17.4333 14.95 18 13.1167 18 11.1V6.375L12 4.125L6 6.375V11.1C6 13.1167 6.56667 14.95 7.7 16.6C8.83333 18.25 10.2667 19.35 12 19.9Z\"\n fill=\"currentColor\"\n />\n </svg>\n </component>\n</template>\n\n<style lang=\"scss\" scoped>\n/**\n * We are adding styles inline to avoid additional stylesheet imports in the host application/component.\n * Do not add styles into this component file.\n */\n</style>\n","<script lang=\"ts\" setup>\n/**\n * ServicesIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `services-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon services-icon\"\n data-testid=\"kui-icon-wrapper-services-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-services-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M18 15V13H20C20.2833 13 20.5208 13.0958 20.7125 13.2875C20.9042 13.4792 21 13.7167 21 14C21 14.2833 20.9042 14.5208 20.7125 14.7125C20.5208 14.9042 20.2833 15 20 15H18ZM18 19V17H20C20.2833 17 20.5208 17.0958 20.7125 17.2875C20.9042 17.4792 21 17.7167 21 18C21 18.2833 20.9042 18.5208 20.7125 18.7125C20.5208 18.9042 20.2833 19 20 19H18ZM14 20C13.45 20 12.9792 19.8042 12.5875 19.4125C12.1958 19.0208 12 18.55 12 18H10V14H12C12 13.45 12.1958 12.9792 12.5875 12.5875C12.9792 12.1958 13.45 12 14 12H17V20H14ZM7 17C5.9 17 4.95833 16.6083 4.175 15.825C3.39167 15.0417 3 14.1 3 13C3 11.9 3.39167 10.9583 4.175 10.175C4.95833 9.39167 5.9 9 7 9H8.5C8.91667 9 9.27083 8.85417 9.5625 8.5625C9.85417 8.27083 10 7.91667 10 7.5C10 7.08333 9.85417 6.72917 9.5625 6.4375C9.27083 6.14583 8.91667 6 8.5 6H5C4.71667 6 4.47917 5.90417 4.2875 5.7125C4.09583 5.52083 4 5.28333 4 5C4 4.71667 4.09583 4.47917 4.2875 4.2875C4.47917 4.09583 4.71667 4 5 4H8.5C9.46667 4 10.2917 4.34167 10.975 5.025C11.6583 5.70833 12 6.53333 12 7.5C12 8.46667 11.6583 9.29167 10.975 9.975C10.2917 10.6583 9.46667 11 8.5 11H7C6.45 11 5.97917 11.1958 5.5875 11.5875C5.19583 11.9792 5 12.45 5 13C5 13.55 5.19583 14.0208 5.5875 14.4125C5.97917 14.8042 6.45 15 7 15H9V17H7Z\"\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","<script lang=\"ts\" setup>\n/**\n * SharedIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `shared-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon shared-icon\"\n data-testid=\"kui-icon-wrapper-shared-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-shared-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M18 22C17.1667 22 16.4583 21.7083 15.875 21.125C15.2917 20.5417 15 19.8333 15 19C15 18.8833 15.0083 18.7625 15.025 18.6375C15.0417 18.5125 15.0667 18.4 15.1 18.3L8.05 14.2C7.76667 14.45 7.45 14.6458 7.1 14.7875C6.75 14.9292 6.38333 15 6 15C5.16667 15 4.45833 14.7083 3.875 14.125C3.29167 13.5417 3 12.8333 3 12C3 11.1667 3.29167 10.4583 3.875 9.875C4.45833 9.29167 5.16667 9 6 9C6.38333 9 6.75 9.07083 7.1 9.2125C7.45 9.35417 7.76667 9.55 8.05 9.8L15.1 5.7C15.0667 5.6 15.0417 5.4875 15.025 5.3625C15.0083 5.2375 15 5.11667 15 5C15 4.16667 15.2917 3.45833 15.875 2.875C16.4583 2.29167 17.1667 2 18 2C18.8333 2 19.5417 2.29167 20.125 2.875C20.7083 3.45833 21 4.16667 21 5C21 5.83333 20.7083 6.54167 20.125 7.125C19.5417 7.70833 18.8333 8 18 8C17.6167 8 17.25 7.92917 16.9 7.7875C16.55 7.64583 16.2333 7.45 15.95 7.2L8.9 11.3C8.93333 11.4 8.95833 11.5125 8.975 11.6375C8.99167 11.7625 9 11.8833 9 12C9 12.1167 8.99167 12.2375 8.975 12.3625C8.95833 12.4875 8.93333 12.6 8.9 12.7L15.95 16.8C16.2333 16.55 16.55 16.3542 16.9 16.2125C17.25 16.0708 17.6167 16 18 16C18.8333 16 19.5417 16.2917 20.125 16.875C20.7083 17.4583 21 18.1667 21 19C21 19.8333 20.7083 20.5417 20.125 21.125C19.5417 21.7083 18.8333 22 18 22ZM18 6C18.2833 6 18.5208 5.90417 18.7125 5.7125C18.9042 5.52083 19 5.28333 19 5C19 4.71667 18.9042 4.47917 18.7125 4.2875C18.5208 4.09583 18.2833 4 18 4C17.7167 4 17.4792 4.09583 17.2875 4.2875C17.0958 4.47917 17 4.71667 17 5C17 5.28333 17.0958 5.52083 17.2875 5.7125C17.4792 5.90417 17.7167 6 18 6ZM6 13C6.28333 13 6.52083 12.9042 6.7125 12.7125C6.90417 12.5208 7 12.2833 7 12C7 11.7167 6.90417 11.4792 6.7125 11.2875C6.52083 11.0958 6.28333 11 6 11C5.71667 11 5.47917 11.0958 5.2875 11.2875C5.09583 11.4792 5 11.7167 5 12C5 12.2833 5.09583 12.5208 5.2875 12.7125C5.47917 12.9042 5.71667 13 6 13ZM18 20C18.2833 20 18.5208 19.9042 18.7125 19.7125C18.9042 19.5208 19 19.2833 19 19C19 18.7167 18.9042 18.4792 18.7125 18.2875C18.5208 18.0958 18.2833 18 18 18C17.7167 18 17.4792 18.0958 17.2875 18.2875C17.0958 18.4792 17 18.7167 17 19C17 19.2833 17.0958 19.5208 17.2875 19.7125C17.4792 19.9042 17.7167 20 18 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","<script lang=\"ts\" setup>\n/**\n * SupportIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `support-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon support-icon\"\n data-testid=\"kui-icon-wrapper-support-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-support-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM9.1 19.45L10.3 16.7C9.6 16.45 8.99583 16.0625 8.4875 15.5375C7.97917 15.0125 7.58333 14.4 7.3 13.7L4.55 14.85C4.93333 15.9167 5.525 16.85 6.325 17.65C7.125 18.45 8.05 19.05 9.1 19.45ZM7.3 10.3C7.58333 9.6 7.97917 8.9875 8.4875 8.4625C8.99583 7.9375 9.6 7.55 10.3 7.3L9.15 4.55C8.08333 4.95 7.15 5.55 6.35 6.35C5.55 7.15 4.95 8.08333 4.55 9.15L7.3 10.3ZM12 15C12.8333 15 13.5417 14.7083 14.125 14.125C14.7083 13.5417 15 12.8333 15 12C15 11.1667 14.7083 10.4583 14.125 9.875C13.5417 9.29167 12.8333 9 12 9C11.1667 9 10.4583 9.29167 9.875 9.875C9.29167 10.4583 9 11.1667 9 12C9 12.8333 9.29167 13.5417 9.875 14.125C10.4583 14.7083 11.1667 15 12 15ZM14.9 19.45C15.95 19.05 16.8708 18.4542 17.6625 17.6625C18.4542 16.8708 19.05 15.95 19.45 14.9L16.7 13.7C16.45 14.4 16.0667 15.0042 15.55 15.5125C15.0333 16.0208 14.4333 16.4167 13.75 16.7L14.9 19.45ZM16.7 10.25L19.45 9.1C19.05 8.05 18.4542 7.12917 17.6625 6.3375C16.8708 5.54583 15.95 4.95 14.9 4.55L13.75 7.35C14.4333 7.6 15.025 7.97917 15.525 8.4875C16.025 8.99583 16.4167 9.58333 16.7 10.25Z\"\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","<script lang=\"ts\" setup>\n/**\n * TableIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `table-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon table-icon\"\n data-testid=\"kui-icon-wrapper-table-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-table-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M3 21V3H21V21H3ZM5 9H19V5H5V9ZM10.325 14H13.675V11H10.325V14ZM10.325 19H13.675V16H10.325V19ZM5 14H8.325V11H5V14ZM15.675 14H19V11H15.675V14ZM5 19H8.325V16H5V19ZM15.675 19H19V16H15.675V19Z\"\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","<script lang=\"ts\" setup>\n/**\n * TeammateIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `teammate-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon teammate-icon\"\n data-testid=\"kui-icon-wrapper-teammate-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-teammate-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 12C10.9 12 9.95833 11.6083 9.175 10.825C8.39167 10.0417 8 9.1 8 8C8 6.9 8.39167 5.95833 9.175 5.175C9.95833 4.39167 10.9 4 12 4C13.1 4 14.0417 4.39167 14.825 5.175C15.6083 5.95833 16 6.9 16 8C16 9.1 15.6083 10.0417 14.825 10.825C14.0417 11.6083 13.1 12 12 12ZM4 20V17.2C4 16.6333 4.14583 16.1125 4.4375 15.6375C4.72917 15.1625 5.11667 14.8 5.6 14.55C6.63333 14.0333 7.68333 13.6458 8.75 13.3875C9.81667 13.1292 10.9 13 12 13C13.1 13 14.1833 13.1292 15.25 13.3875C16.3167 13.6458 17.3667 14.0333 18.4 14.55C18.8833 14.8 19.2708 15.1625 19.5625 15.6375C19.8542 16.1125 20 16.6333 20 17.2V20H4Z\"\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","<script lang=\"ts\" setup>\n/**\n * TrashIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `trash-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon trash-icon\"\n data-testid=\"kui-icon-wrapper-trash-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-trash-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M7 21C6.45 21 5.97917 20.8042 5.5875 20.4125C5.19583 20.0208 5 19.55 5 19V6H4V4H9V3H15V4H20V6H19V19C19 19.55 18.8042 20.0208 18.4125 20.4125C18.0208 20.8042 17.55 21 17 21H7ZM17 6H7V19H17V6ZM9 17H11V8H9V17ZM13 17H15V8H13V17Z\"\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","<script lang=\"ts\" setup>\n/**\n * VitalsIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `vitals-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon vitals-icon\"\n data-testid=\"kui-icon-wrapper-vitals-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-vitals-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9 20C8.68333 20 8.4 19.9083 8.15 19.725C7.9 19.5417 7.71667 19.3083 7.6 19.025L5.3 13H1V11H6.7L9 17.1L13.6 4.975C13.7167 4.69167 13.9 4.45833 14.15 4.275C14.4 4.09167 14.6833 4 15 4C15.3167 4 15.6 4.09167 15.85 4.275C16.1 4.45833 16.2833 4.69167 16.4 4.975L18.7 11H23V13H17.3L15 6.9L10.4 19.025C10.2833 19.3083 10.1 19.5417 9.85 19.725C9.6 19.9083 9.31667 20 9 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","<script lang=\"ts\" setup>\n/**\n * WarningIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `warning-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon warning-icon\"\n data-testid=\"kui-icon-wrapper-warning-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-warning-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12.025 22.05C11.7583 22.05 11.5042 22 11.2625 21.9C11.0208 21.8 10.8 21.6583 10.6 21.475L2.575 13.45C2.39167 13.25 2.25 13.0292 2.15 12.7875C2.05 12.5458 2 12.2917 2 12.025C2 11.7583 2.05 11.5 2.15 11.25C2.25 11 2.39167 10.7833 2.575 10.6L10.6 2.575C10.8 2.375 11.0208 2.22917 11.2625 2.1375C11.5042 2.04583 11.7583 2 12.025 2C12.2917 2 12.55 2.04583 12.8 2.1375C13.05 2.22917 13.2667 2.375 13.45 2.575L21.475 10.6C21.675 10.7833 21.8208 11 21.9125 11.25C22.0042 11.5 22.05 11.7583 22.05 12.025C22.05 12.2917 22.0042 12.5458 21.9125 12.7875C21.8208 13.0292 21.675 13.25 21.475 13.45L13.45 21.475C13.2667 21.6583 13.05 21.8 12.8 21.9C12.55 22 12.2917 22.05 12.025 22.05ZM11.025 13.025H13.025V7.025H11.025V13.025ZM12.025 16.025C12.3083 16.025 12.5458 15.9292 12.7375 15.7375C12.9292 15.5458 13.025 15.3083 13.025 15.025C13.025 14.7417 12.9292 14.5042 12.7375 14.3125C12.5458 14.1208 12.3083 14.025 12.025 14.025C11.7417 14.025 11.5042 14.1208 11.3125 14.3125C11.1208 14.5042 11.025 14.7417 11.025 15.025C11.025 15.3083 11.1208 15.5458 11.3125 15.7375C11.5042 15.9292 11.7417 16.025 12.025 16.025Z\"\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","<script lang=\"ts\" setup>\n/**\n * WorldIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `world-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon world-icon\"\n data-testid=\"kui-icon-wrapper-world-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-world-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM11 19.95V18C10.45 18 9.97917 17.8042 9.5875 17.4125C9.19583 17.0208 9 16.55 9 16V15L4.2 10.2C4.15 10.5 4.10417 10.8 4.0625 11.1C4.02083 11.4 4 11.7 4 12C4 14.0167 4.6625 15.7833 5.9875 17.3C7.3125 18.8167 8.98333 19.7 11 19.95ZM17.9 17.4C18.2333 17.0333 18.5333 16.6375 18.8 16.2125C19.0667 15.7875 19.2875 15.3458 19.4625 14.8875C19.6375 14.4292 19.7708 13.9583 19.8625 13.475C19.9542 12.9917 20 12.5 20 12C20 10.3667 19.5458 8.875 18.6375 7.525C17.7292 6.175 16.5167 5.2 15 4.6V5C15 5.55 14.8042 6.02083 14.4125 6.4125C14.0208 6.80417 13.55 7 13 7H11V9C11 9.28333 10.9042 9.52083 10.7125 9.7125C10.5208 9.90417 10.2833 10 10 10H8V12H14C14.2833 12 14.5208 12.0958 14.7125 12.2875C14.9042 12.4792 15 12.7167 15 13V16H16C16.4333 16 16.825 16.1292 17.175 16.3875C17.525 16.6458 17.7667 16.9833 17.9 17.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","<script lang=\"ts\" setup>\n/**\n * AddCircleIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `add-circle-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon add-circle-icon\"\n data-testid=\"kui-icon-wrapper-add-circle-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-add-circle-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M11 17H13V13H17V11H13V7H11V11H7V13H11V17ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<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 Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `arrow-down-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\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 :aria-labelledby=\"title ? titleId : 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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</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","<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 Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `arrow-left-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\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 :aria-labelledby=\"title ? titleId : 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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</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","<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 Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `arrow-right-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\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 :aria-labelledby=\"title ? titleId : 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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</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","<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 Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `arrow-up-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\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 :aria-labelledby=\"title ? titleId : 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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</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","<script lang=\"ts\" setup>\n/**\n * BarChartIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `bar-chart-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon bar-chart-icon\"\n data-testid=\"kui-icon-wrapper-bar-chart-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-bar-chart-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M4 20V12H8V20H4ZM10 20V4H14V20H10ZM16 20V9H20V20H16Z\"\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","<script lang=\"ts\" setup>\n/**\n * CheckCircleIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `check-circle-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon check-circle-icon\"\n data-testid=\"kui-icon-wrapper-check-circle-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-check-circle-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M10.6 16.6L17.65 9.55L16.25 8.15L10.6 13.8L7.75 10.95L6.35 12.35L10.6 16.6ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * CheckSmallIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `check-small-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon check-small-icon\"\n data-testid=\"kui-icon-wrapper-check-small-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-check-small-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M8 14.4L4 10.4L5.4 9L8 11.6L14.6 5L16 6.4L8 14.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","<script lang=\"ts\" setup>\n/**\n * ChevronDownIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `chevron-down-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon chevron-down-icon\"\n data-testid=\"kui-icon-wrapper-chevron-down-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-chevron-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 15.4L6 9.4L7.4 8L12 12.6L16.6 8L18 9.4L12 15.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","<script lang=\"ts\" setup>\n/**\n * ChevronLeftIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `chevron-left-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon chevron-left-icon\"\n data-testid=\"kui-icon-wrapper-chevron-left-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-chevron-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M14 18L8 12L14 6L15.4 7.4L10.8 12L15.4 16.6L14 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","<script lang=\"ts\" setup>\n/**\n * ChevronRightIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `chevron-right-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon chevron-right-icon\"\n data-testid=\"kui-icon-wrapper-chevron-right-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-chevron-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M9.4 18L8 16.6L12.6 12L8 7.4L9.4 6L15.4 12L9.4 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","<script lang=\"ts\" setup>\n/**\n * ChevronUpIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `chevron-up-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon chevron-up-icon\"\n data-testid=\"kui-icon-wrapper-chevron-up-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-chevron-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M7.4 15.4L6 14L12 8L18 14L16.6 15.4L12 10.8L7.4 15.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","<script lang=\"ts\" setup>\n/**\n * CollapsePanelIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `collapse-panel-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon collapse-panel-icon\"\n data-testid=\"kui-icon-wrapper-collapse-panel-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-collapse-panel-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M16.5 16V8L12.5 12L16.5 16ZM5 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 21H5ZM8 19V5H5V19H8ZM10 19H19V5H10V19Z\"\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","<script lang=\"ts\" setup>\n/**\n * DangerCircleIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `danger-circle-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon danger-circle-icon\"\n data-testid=\"kui-icon-wrapper-danger-circle-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-danger-circle-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M12 17C12.2833 17 12.5208 16.9042 12.7125 16.7125C12.9042 16.5208 13 16.2833 13 16C13 15.7167 12.9042 15.4792 12.7125 15.2875C12.5208 15.0958 12.2833 15 12 15C11.7167 15 11.4792 15.0958 11.2875 15.2875C11.0958 15.4792 11 15.7167 11 16C11 16.2833 11.0958 16.5208 11.2875 16.7125C11.4792 16.9042 11.7167 17 12 17ZM11 13H13V7H11V13ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22Z\"\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","<script lang=\"ts\" setup>\n/**\n * DevPortalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `dev-portal-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon dev-portal-icon\"\n data-testid=\"kui-icon-wrapper-dev-portal-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-dev-portal-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n clip-rule=\"evenodd\"\n d=\"M11.9999 2.40002H18.7319L21.5999 5.67602V18.732L18.3239 21.6H5.2679L2.3999 18.324V5.26802L5.6759 2.40002H11.9999ZM16.2719 12C16.3026 12.5793 16.2151 13.1587 16.0146 13.703C15.8141 14.2473 15.5048 14.7451 15.1057 15.166C14.7065 15.5869 14.2258 15.9221 13.6929 16.1512C13.16 16.3802 12.586 16.4984 12.0059 16.4984C11.4258 16.4984 10.8518 16.3802 10.3189 16.1512C9.786 15.9221 9.30531 15.5869 8.90615 15.166C8.507 14.7451 8.19774 14.2473 7.99723 13.703C7.79673 13.1587 7.70917 12.5793 7.7399 12C7.82062 10.9254 8.30446 9.92105 9.09447 9.18815C9.88448 8.45526 10.9223 8.048 11.9999 8.048C13.0775 8.048 14.1153 8.45526 14.9053 9.18815C15.6953 9.92105 16.1792 10.9254 16.2599 12H16.2719Z\"\n fill=\"currentColor\"\n fill-rule=\"evenodd\"\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","<script lang=\"ts\" setup>\n/**\n * DocumentListIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `document-list-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon document-list-icon\"\n data-testid=\"kui-icon-wrapper-document-list-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-document-list-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M8 17C8.28333 17 8.52083 16.9042 8.7125 16.7125C8.90417 16.5208 9 16.2833 9 16C9 15.7167 8.90417 15.4792 8.7125 15.2875C8.52083 15.0958 8.28333 15 8 15C7.71667 15 7.47917 15.0958 7.2875 15.2875C7.09583 15.4792 7 15.7167 7 16C7 16.2833 7.09583 16.5208 7.2875 16.7125C7.47917 16.9042 7.71667 17 8 17ZM8 13C8.28333 13 8.52083 12.9042 8.7125 12.7125C8.90417 12.5208 9 12.2833 9 12C9 11.7167 8.90417 11.4792 8.7125 11.2875C8.52083 11.0958 8.28333 11 8 11C7.71667 11 7.47917 11.0958 7.2875 11.2875C7.09583 11.4792 7 11.7167 7 12C7 12.2833 7.09583 12.5208 7.2875 12.7125C7.47917 12.9042 7.71667 13 8 13ZM8 9C8.28333 9 8.52083 8.90417 8.7125 8.7125C8.90417 8.52083 9 8.28333 9 8C9 7.71667 8.90417 7.47917 8.7125 7.2875C8.52083 7.09583 8.28333 7 8 7C7.71667 7 7.47917 7.09583 7.2875 7.2875C7.09583 7.47917 7 7.71667 7 8C7 8.28333 7.09583 8.52083 7.2875 8.7125C7.47917 8.90417 7.71667 9 8 9ZM11 17H17V15H11V17ZM11 13H17V11H11V13ZM11 9H17V7H11V9ZM5 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","<script lang=\"ts\" setup>\n/**\n * ExternalLinkIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `external-link-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon external-link-icon\"\n data-testid=\"kui-icon-wrapper-external-link-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-external-link-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 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 3H12V5H5V19H19V12H21V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5ZM9.7 15.7L8.3 14.3L17.6 5H14V3H21V10H19V6.4L9.7 15.7Z\"\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","<script lang=\"ts\" setup>\n/**\n * FeatureRequestIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `feature-request-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon feature-request-icon\"\n data-testid=\"kui-icon-wrapper-feature-request-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-feature-request-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M2 22V4C2 3.45 2.19583 2.97917 2.5875 2.5875C2.97917 2.19583 3.45 2 4 2H20C20.55 2 21.0208 2.19583 21.4125 2.5875C21.8042 2.97917 22 3.45 22 4V16C22 16.55 21.8042 17.0208 21.4125 17.4125C21.0208 17.8042 20.55 18 20 18H6L2 22ZM4 17.175L5.175 16H20V4H4V17.175Z\"\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","<script lang=\"ts\" setup>\n/**\n * FileEmptyIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `file-empty-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon file-empty-icon\"\n data-testid=\"kui-icon-wrapper-file-empty-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-file-empty-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V4C4 3.45 4.19583 2.97917 4.5875 2.5875C4.97917 2.19583 5.45 2 6 2H14L20 8V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM13 9V4H6V20H18V9H13Z\"\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","<script lang=\"ts\" setup>\n/**\n * IndeterminateSmallIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `indeterminate-small-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon indeterminate-small-icon\"\n data-testid=\"kui-icon-wrapper-indeterminate-small-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-indeterminate-small-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M5 11V9H15V11H5Z\"\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","<script lang=\"ts\" setup>\n/**\n * MoreHorizontalIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `more-horizontal-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon more-horizontal-icon\"\n data-testid=\"kui-icon-wrapper-more-horizontal-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-more-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M6 14C5.45 14 4.97917 13.8042 4.5875 13.4125C4.19583 13.0208 4 12.55 4 12C4 11.45 4.19583 10.9792 4.5875 10.5875C4.97917 10.1958 5.45 10 6 10C6.55 10 7.02083 10.1958 7.4125 10.5875C7.80417 10.9792 8 11.45 8 12C8 12.55 7.80417 13.0208 7.4125 13.4125C7.02083 13.8042 6.55 14 6 14ZM12 14C11.45 14 10.9792 13.8042 10.5875 13.4125C10.1958 13.0208 10 12.55 10 12C10 11.45 10.1958 10.9792 10.5875 10.5875C10.9792 10.1958 11.45 10 12 10C12.55 10 13.0208 10.1958 13.4125 10.5875C13.8042 10.9792 14 11.45 14 12C14 12.55 13.8042 13.0208 13.4125 13.4125C13.0208 13.8042 12.55 14 12 14ZM18 14C17.45 14 16.9792 13.8042 16.5875 13.4125C16.1958 13.0208 16 12.55 16 12C16 11.45 16.1958 10.9792 16.5875 10.5875C16.9792 10.1958 17.45 10 18 10C18.55 10 19.0208 10.1958 19.4125 10.5875C19.8042 10.9792 20 11.45 20 12C20 12.55 19.8042 13.0208 19.4125 13.4125C19.0208 13.8042 18.55 14 18 14Z\"\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","<script lang=\"ts\" setup>\n/**\n * ServiceDocumentIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `service-document-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon service-document-icon\"\n data-testid=\"kui-icon-wrapper-service-document-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-service-document-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M8 18H16V16H8V18ZM8 14H16V12H8V14ZM6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V4C4 3.45 4.19583 2.97917 4.5875 2.5875C4.97917 2.19583 5.45 2 6 2H14L20 8V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM13 9V4H6V20H18V9H13Z\"\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","<script lang=\"ts\" setup>\n/**\n * ServiceHubIcon.vue\n * This file was generated via the build script. Do not edit this file directly.\n * Generated on Sat, 15 Jul 2023 19:24:36 GMT\n *\n * GitHub: https://github.com/Kong/icons\n * License: Apache-2.0\n */\n\nimport { computed } from 'vue'\nimport { v4 as uuidv4 } from 'uuid'\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: 24, // KUI_ICON_SIZE_50\n validator: (sizeValue: number): boolean => {\n if (typeof sizeValue === 'number' && sizeValue > 0) {\n return true\n }\n\n if (typeof sizeValue === 'string') {\n const sizeNumber = Number(sizeValue)\n return Number.isInteger(sizeNumber) && sizeNumber > 0\n }\n\n return false\n },\n },\n /** The HTML tag to utilize for the icon's wrapper element. Defaults to `span` */\n tag: {\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 const sizeNumber = Number(props.size)\n // If props.size is a string, ensure the string converts 1:1 to a number, and ensure it's greater than zero\n if (typeof props.size === 'string' && sizeNumber && Number.isInteger(sizeNumber) && sizeNumber > 0) {\n return `${props.size}px`\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\n// Compute a unique ID for the title element for a11y\nconst titleId = computed((): string => `service-hub-icon-${uuidv4()}`)\n</script>\n\n<template>\n <component\n :is=\"tag\"\n :aria-hidden=\"decorative ? 'true' : undefined\"\n class=\"kui-icon service-hub-icon\"\n data-testid=\"kui-icon-wrapper-service-hub-icon\"\n :style=\"rootElementStyles\"\n >\n <svg\n :aria-hidden=\"decorative ? 'true' : undefined\"\n :aria-labelledby=\"title ? titleId : undefined\"\n data-testid=\"kui-icon-svg-service-hub-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 :id=\"titleId\"\n data-testid=\"kui-icon-svg-title\"\n >{{ title }}</title>\n <path\n d=\"M10.6198 1.19995V10.02H1.7998V3.83995L4.81181 1.19995H10.6198ZM22.0198 10.02H13.1998V1.19995H19.3798L22.0198 4.21195V10.02ZM13.1998 21.42V12.6H22.0198V18.78L19.0078 21.42H13.1998ZM1.7998 12.6H10.6198V21.42H4.4398L1.7998 18.408V12.6Z\"\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":["iconSize","computed","props","sizeNumber","KUI_ICON_SIZE_50","rootElementStyles","titleId","uuidv4"],"mappings":"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"}
|