@yahoo/uds 3.109.0 → 3.111.0

package/dist/cli/dist/utils/rules/config.js

@@ -1,71 +1,154 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 import { dirname, join } from "node:path";
-import { readFileSync } from "node:fs";
+import { existsSync, readFileSync } from "node:fs";
 import { fileURLToPath } from "node:url";
 
 //#region ../cli/dist/utils/rules/config.mjs
 /*! © 2026 Yahoo, Inc. UDS CLI v0.0.0-development */
 const __dirname = dirname(fileURLToPath(import.meta.url));
-const EDITOR_CONFIGS = { cursor: {
-	name: "Cursor",
-	description: "AI-powered coding assistant rules for UDS development",
-	rules: [
-		{
-			name: "UDS Components",
-			description: "Component development guidelines and patterns",
-			files: [{
-				source: "rules/cursor/uds/components.mdc",
-				target: ".cursor/rules/uds/components.mdc",
-				type: "file"
-			}]
-		},
-		{
-			name: "UDS Tailwind",
-			description: "Tailwind CSS configuration and setup guidelines",
-			files: [{
-				source: "rules/cursor/uds/tailwind.mdc",
-				target: ".cursor/rules/uds/tailwind.mdc",
-				type: "file"
-			}]
-		},
-		{
-			name: "UDS Icons",
-			description: "Icon usage and documentation guidelines",
-			files: [{
-				source: "rules/cursor/uds/icons.mdc",
-				target: ".cursor/rules/uds/icons.mdc",
-				type: "file"
-			}]
-		},
-		{
-			name: "UDS Elevation",
-			description: "Elevation prop usage for layered surfaces",
-			files: [{
-				source: "rules/cursor/uds/elevation.mdc",
-				target: ".cursor/rules/uds/elevation.mdc",
-				type: "file"
-			}]
-		},
-		{
-			name: "UDS Styling",
-			description: "Color palette and styling guidelines",
-			files: [{
-				source: "rules/cursor/uds/styling.mdc",
-				target: ".cursor/rules/uds/styling.mdc",
-				type: "file"
-			}]
-		}
-	]
-} };
+const EDITOR_CONFIGS = {
+	cursor: {
+		name: "Cursor",
+		description: "AI-powered coding assistant rules for UDS development",
+		rules: [
+			{
+				name: "UDS Components",
+				description: "Component development guidelines and patterns",
+				files: [{
+					source: "rules/cursor/uds/components.mdc",
+					target: ".cursor/rules/uds/components.mdc",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Tailwind",
+				description: "Tailwind CSS configuration and setup guidelines",
+				files: [{
+					source: "rules/cursor/uds/tailwind.mdc",
+					target: ".cursor/rules/uds/tailwind.mdc",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Icons",
+				description: "Icon usage and documentation guidelines",
+				files: [{
+					source: "rules/cursor/uds/icons.mdc",
+					target: ".cursor/rules/uds/icons.mdc",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Elevation",
+				description: "Elevation prop usage for layered surfaces",
+				files: [{
+					source: "rules/cursor/uds/elevation.mdc",
+					target: ".cursor/rules/uds/elevation.mdc",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Styling",
+				description: "Color palette and styling guidelines",
+				files: [{
+					source: "rules/cursor/uds/styling.mdc",
+					target: ".cursor/rules/uds/styling.mdc",
+					type: "file"
+				}]
+			}
+		]
+	},
+	claude: {
+		name: "Claude Code",
+		description: "AI-powered coding assistant rules for UDS development",
+		rules: [
+			{
+				name: "UDS Components",
+				description: "Component development guidelines and patterns",
+				files: [{
+					source: "rules/claude/uds/components.md",
+					target: ".claude/rules/uds/components.md",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Tailwind",
+				description: "Tailwind CSS configuration and setup guidelines",
+				files: [{
+					source: "rules/claude/uds/tailwind.md",
+					target: ".claude/rules/uds/tailwind.md",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Icons",
+				description: "Icon usage and documentation guidelines",
+				files: [{
+					source: "rules/claude/uds/icons.md",
+					target: ".claude/rules/uds/icons.md",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Elevation",
+				description: "Elevation prop usage for layered surfaces",
+				files: [{
+					source: "rules/claude/uds/elevation.md",
+					target: ".claude/rules/uds/elevation.md",
+					type: "file"
+				}]
+			},
+			{
+				name: "UDS Styling",
+				description: "Color palette and styling guidelines",
+				files: [{
+					source: "rules/claude/uds/styling.md",
+					target: ".claude/rules/uds/styling.md",
+					type: "file"
+				}]
+			}
+		]
+	}
+};
 function getAvailableEditors() {
 	return Object.keys(EDITOR_CONFIGS);
 }
 function getEditorConfig(editor) {
 	return EDITOR_CONFIGS[editor];
 }
+const AUTO_GENERATED_HEADER = "<!-- Auto-generated by UDS CLI (`uds editor-rules`). Do not edit manually. -->";
 function getRuleContent(rulePath) {
-	return readFileSync(join(__dirname, "..", "..", "..", rulePath), "utf-8");
+	return addAutoGeneratedHeader(readFileSync(join(__dirname, "..", "..", "..", rulePath), "utf-8"));
+}
+function addAutoGeneratedHeader(content) {
+	if (content.startsWith("---\n")) {
+		const closingIndex = content.indexOf("\n---\n", 4);
+		if (closingIndex !== -1) return `${content.slice(0, closingIndex + 5)}${AUTO_GENERATED_HEADER}\n${content.slice(closingIndex + 5)}`;
+	}
+	return `${AUTO_GENERATED_HEADER}\n\n${content}`;
+}
+/**
+* Checks which editors have installed UDS rules that are out of date
+* compared to the latest rules shipped with the CLI.
+* Only checks editors whose rule directories already exist.
+*/
+function getEditorsWithStaleRules(projectDir) {
+	const staleEditors = [];
+	for (const [_editorId, editorConfig] of Object.entries(EDITOR_CONFIGS)) {
+		let hasAnyRule = false;
+		let hasStaleRule = false;
+		for (const rule of editorConfig.rules) for (const file of rule.files) {
+			const targetPath = join(projectDir, file.target);
+			if (!existsSync(targetPath)) continue;
+			hasAnyRule = true;
+			try {
+				if (readFileSync(targetPath, "utf-8") !== getRuleContent(file.source)) hasStaleRule = true;
+			} catch {}
+		}
+		if (hasAnyRule && hasStaleRule) staleEditors.push(editorConfig.name);
+	}
+	return staleEditors;
 }
 
 //#endregion
-export { getAvailableEditors, getEditorConfig, getRuleContent };
+export { getAvailableEditors, getEditorConfig, getEditorsWithStaleRules, getRuleContent };

package/dist/cli/rules/claude/uds/components.md

@@ -0,0 +1,50 @@
+# UDS Components
+
+## MCP tool usage
+
+- Always fetch components type definition using the UDS MCP server
+- Always fetch the possible components from UDS using the UDS MCP server
+- Before using any component, fetch its type definition and documentation examples via the MCP server
+- Use `get_components` to retrieve the full list of exported UDS components
+- Use `get_component_documentation_examples` with a component name (e.g., "tooltip", "toast") to fetch usage docs and examples
+- Use `get_documentation` with path "core-concepts/elevation" for detailed elevation guidance
+
+## Never rebuild existing UDS primitives
+
+- Before building ANY custom tooltip, toast, notification, popover, dropdown, select, dialog, modal, drawer, sheet, accordion, tabs, alert, snackbar, or banner, call `get_components` first to check if UDS already exports it
+- If a matching component exists, use it and call `get_component_documentation_examples` to learn its API
+- Never recreate functionality that UDS provides — only create custom components when UDS doesn't offer the needed functionality
+
+## Use UDS components instead of raw HTML
+
+- Always use UDS UI library components instead of raw HTML tags
+- Use `<Text>` instead of `<p>`, `<span>`, `<h1>`–`<h6>`
+- Use `<Button>` instead of `<button>`
+- Use `<Input>` instead of `<input>`
+- Use `<Checkbox>` instead of `<input type="checkbox">`
+- Use `<Radio>` instead of `<input type="radio">`
+- Use `<Switch>` instead of custom toggle components
+- Use `<Link>` instead of `<a>`
+- Use `<Icon>` instead of SVG elements
+- Use `<Tooltip>`, `<TooltipTrigger>`, `<TooltipContent>` instead of custom tooltip implementations
+- Use `createToast()` from `@yahoo/uds` instead of custom toast/notification components
+
+## Box constraints
+
+- `<Box>` has `display="flex"` by default — use `<VStack>` for vertical stacking, `<HStack>` for horizontal, or `<div>` for simple containers
+- Always set an explicit `display` prop on every `<Box>` (`display="block"` or `display="flex"`). Omitting it causes broken UI.
+- `<Box>` does NOT have a `gap` prop — use `rowGap` or `columnGap` instead. Only `<HStack>` and `<VStack>` have `gap`.
+- Every `<Box>` with `flexDirection="column"` must have `rowGap` specified. Every `<Box>` with `flexDirection="row"` must have `columnGap` specified if spacing between children is needed. The `spacing` prop is for padding only, not gaps.
+
+## HStack and VStack constraints
+
+- Always set `alignItems` and `justifyContent` on every `<HStack>` and `<VStack>` — never rely on default flex behavior
+- Flexbox alignment values must use full CSS syntax: `"flex-start"` not `"start"`, `"flex-end"` not `"end"`
+- Valid `justifyContent` values: `"flex-start"` | `"flex-end"` | `"center"` | `"space-between"` | `"space-around"` | `"space-evenly"`
+- Valid `alignItems` values: `"flex-start"` | `"flex-end"` | `"center"` | `"baseline"` | `"stretch"`
+
+## Styling rules
+
+- Box, HStack, and VStack provide TypeScript props for all styling — prefer using props (`backgroundColor`, `spacing`, `borderRadius`, etc.) over Tailwind `className` for UDS design tokens
+- Never override styling properties on components that use `size` and `variant` props (Button, IconButton, Chip, Badge, Avatar, Radio, Checkbox, Menu, Divider, Switch) with Tailwind classes — always use only the available `size` and `variant` options
+- When placing fixed-size components (Button, IconButton, Chip, Badge, Avatar) in a horizontal flex container, add `className="shrink-0"` to prevent them from being compressed

package/dist/cli/rules/claude/uds/elevation.md

@@ -0,0 +1,33 @@
+# UDS Elevation
+
+## When to use elevation
+
+- Any surface that overlaps or sits on top of another MUST use the `elevation` prop on `<Box>`, `<VStack>`, or `<HStack>`
+- This includes cards, modals, popovers, dropdowns, drawers, toasts, sheets, and floating elements
+
+## The elevation scale
+
+- `elevation="0"` — Background or flat surfaces
+- `elevation="1"` — Cards, list items, secondary surfaces
+- `elevation="2"` — Floating elements like popovers, dropdowns
+- `elevation="3"` — Modals, sheets, key actions
+- `elevation="4"` — Drawers or toasts
+- `elevation="5"` — System overlays
+
+## Always use the shorthand prop
+
+- The `elevation` prop is a shorthand that sets `backgroundColor`, `borderColor`, `borderWidth`, and `dropShadow` together in one prop
+- Never use `dropShadow` alone for layered surfaces — it only adds a shadow and misses the required `backgroundColor`, `borderColor`, and `borderWidth` changes
+- Never use individual elevation token props (`backgroundColor="elevation-X"`, `borderColor="elevation-X"`, `borderWidth="elevation-X"`, `dropShadow="elevation-X"`) — always use the shorthand `elevation` prop instead
+- Individual props override the shorthand if needed: `<Box elevation="2" backgroundColor="primary" />`
+
+## Examples
+
+- Wrong: `<Box dropShadow="md" backgroundColor="primary" borderRadius="lg">` (incomplete elevation)
+- Wrong: `<Box backgroundColor="elevation-2" borderColor="elevation-2" borderWidth="elevation-2" dropShadow="elevation-2">` (verbose, use shorthand)
+- Correct: `<Box elevation="1" borderRadius="lg">` (single prop sets all 4 properties)
+- Correct: `<VStack elevation="2" gap="4" alignItems="stretch" justifyContent="flex-start">Popover content</VStack>`
+
+## More information
+
+- Use `get_documentation` MCP tool with path "core-concepts/elevation" for detailed guidance on applying elevation

package/dist/cli/rules/claude/uds/icons.md

@@ -0,0 +1,4 @@
+# UDS Icons
+
+- Anytime you have to use an icon in a UDS component or use UDS icons outside UDS components, fetch Icon documentation for more context from the MCP server
+- Always check what icons are available in UDS through the MCP server

package/dist/cli/rules/claude/uds/styling.md

@@ -0,0 +1,18 @@
+# UDS Styling
+
+## Use UDS palette colors only
+
+- Only use UDS palette colors — never use raw color values like `bg-white`, `text-white`, `bg-gray-100`, etc.
+- Background colors: `primary`, `secondary`, `brand`, `brand-secondary`, `alert`, `alert-secondary`, `positive`, `positive-secondary`, `warning`, `warning-secondary`, `info`, `info-secondary`
+- Foreground (text/icon) colors: `primary`, `secondary`, `tertiary`, `muted`, `on-color`, `brand`, `alert`, `positive`, `warning`, `info`
+
+## Color pairing rules
+
+- On dark or brand backgrounds (`brand`, `positive`, `info`, `warning`, `alert`), use `color="on-color"` for text and icons
+- On secondary/lighter background variants (`brand-secondary`, `positive-secondary`, etc.), use the matching semantic color (e.g., `color="brand"` on `backgroundColor="brand-secondary"`)
+- Never use `color="on-color"` on white or light backgrounds — it creates invisible white text
+- Never use a dark semantic color (e.g., `brand`, `positive`) directly on its own secondary background variant as contrast will be poor
+
+## General styling
+
+- Prefer UDS TypeScript props (`backgroundColor`, `spacing`, `borderRadius`, etc.) over Tailwind `className` for design tokens

package/dist/cli/rules/claude/uds/tailwind.md

@@ -0,0 +1,5 @@
+# UDS Tailwind
+
+- Never create a UDS config manually
+- If `uds.config.ts` or `uds.config.js` is not present at the root of the project, ask the user to create it using UDS CLI sync command
+- Make sure that tailwind configuration has the UDS tailwind plugin

package/dist/components/client/Avatar/AvatarImage.cjs

@@ -55,6 +55,7 @@ const AvatarImage = ({ size = require_components_client_Avatar_utils.DEFAULT_AVA
 	if (loadingState === "loaded") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Box.Box, {
 		className: classNames.root,
 		style: inlineStyles.root,
+		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Image.Image, {
 			src,
 			srcSet,

package/dist/components/client/Avatar/AvatarImage.js

@@ -53,6 +53,7 @@ const AvatarImage = ({ size = DEFAULT_AVATAR_SIZE, variant = DEFAULT_AVATAR_VARI
 	if (loadingState === "loaded") return /* @__PURE__ */ jsx(Box, {
 		className: classNames.root,
 		style: inlineStyles.root,
+		...props,
 		children: /* @__PURE__ */ jsx(Image$1, {
 			src,
 			srcSet,

package/dist/components/client/Chip/ChipDismissible.cjs

@@ -20,7 +20,7 @@ const ChipDismissible = (0, react.forwardRef)(function ChipDismissible({ dismiss
 			className
 		}),
 		icon: require_styles_styler.getStyles({ chipDismissibleVariantIcon: variant }),
-		iconPressable: require_styles_styler.cx("uds-chip-dismissible-button", "uds-hit-target")
+		iconPressable: require_styles_styler.cx("uds-chip-dismissible-button", "uds-hit-target", "uds-ring", "rounded-full")
 	}), [className, variant]);
 	/**
 	* Handlers

package/dist/components/client/Chip/ChipDismissible.js

@@ -17,7 +17,7 @@ const ChipDismissible = forwardRef(function ChipDismissible({ dismissButtonAriaL
 			className
 		}),
 		icon: getStyles({ chipDismissibleVariantIcon: variant }),
-		iconPressable: cx("uds-chip-dismissible-button", "uds-hit-target")
+		iconPressable: cx("uds-chip-dismissible-button", "uds-hit-target", "uds-ring", "rounded-full")
 	}), [className, variant]);
 	/**
 	* Handlers

package/dist/components/client/Toast/Toast.cjs

@@ -72,7 +72,7 @@ const Toast = ({ message, onClickCloseButton, size: sizeProp, variant: variantPr
 		closeIconContainer: require_styles_styler.getStyles({
 			spacing: "2",
 			borderRadius: "full",
-			className: require_styles_styler.cx(cssAnimationDuration, "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15")
+			className: require_styles_styler.cx(cssAnimationDuration, "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15", "uds-ring")
 		}),
 		closeIcon: require_styles_styler.getStyles({
 			toastVariantCloseIcon: variant,

package/dist/components/client/Toast/Toast.js

@@ -70,7 +70,7 @@ const Toast = ({ message, onClickCloseButton, size: sizeProp, variant: variantPr
 		closeIconContainer: getStyles({
 			spacing: "2",
 			borderRadius: "full",
-			className: cx(cssAnimationDuration, "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15")
+			className: cx(cssAnimationDuration, "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15", "uds-ring")
 		}),
 		closeIcon: getStyles({
 			toastVariantCloseIcon: variant,

package/dist/components/client/Toast/ToastContainer.cjs

@@ -5,6 +5,7 @@ const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
 const require_styles_styler = require('../../../styles/styler.cjs');
 const require_components_HStack = require('../../HStack.cjs');
 const require_components_client_Toast_UDSToastConfigProvider = require('./UDSToastConfigProvider.cjs');
+const require_utils_isElevationAlias = require('../../../utils/isElevationAlias.cjs');
 let react_jsx_runtime = require("react/jsx-runtime");
 let lodash_isString_js = require("lodash/isString.js");
 lodash_isString_js = require_runtime.__toESM(lodash_isString_js);
@@ -26,7 +27,9 @@ const getToastClassName = (toastClassName) => (context) => {
 	}), (0, lodash_isString_js.default)(toastClassName) ? toastClassName : toastClassName?.(context));
 };
 const ToastContainer = ({ size: sizeProp, variant: variantProp, children, className, ...props }) => {
-	const { size, variant } = require_components_client_Toast_UDSToastConfigProvider.useToastConfig(sizeProp, variantProp);
+	const { size, variant, backgroundColor } = require_components_client_Toast_UDSToastConfigProvider.useToastConfig(sizeProp, variantProp);
+	const bg = backgroundColor[variant];
+	const isElevationBg = require_utils_isElevationAlias.isElevationAlias(bg);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
 		className: require_styles_styler.getStyles({
 			toastVariantRoot: variant,
@@ -37,6 +40,7 @@ const ToastContainer = ({ size: sizeProp, variant: variantProp, children, classN
 		justifyContent: "space-between",
 		overflow: "hidden",
 		position: "relative",
+		backgroundColor: isElevationBg ? bg : void 0,
 		...props,
 		children
 	});

package/dist/components/client/Toast/ToastContainer.js

@@ -3,6 +3,7 @@
 import { cx, getStyles } from "../../../styles/styler.js";
 import { HStack } from "../../HStack.js";
 import { useToastConfig } from "./UDSToastConfigProvider.js";
+import { isElevationAlias } from "../../../utils/isElevationAlias.js";
 import { jsx } from "react/jsx-runtime";
 import { isString } from "lodash-es";
 
@@ -23,7 +24,9 @@ const getToastClassName = (toastClassName) => (context) => {
 	}), isString(toastClassName) ? toastClassName : toastClassName?.(context));
 };
 const ToastContainer = ({ size: sizeProp, variant: variantProp, children, className, ...props }) => {
-	const { size, variant } = useToastConfig(sizeProp, variantProp);
+	const { size, variant, backgroundColor } = useToastConfig(sizeProp, variantProp);
+	const bg = backgroundColor[variant];
+	const isElevationBg = isElevationAlias(bg);
 	return /* @__PURE__ */ jsx(HStack, {
 		className: getStyles({
 			toastVariantRoot: variant,
@@ -34,6 +37,7 @@ const ToastContainer = ({ size: sizeProp, variant: variantProp, children, classN
 		justifyContent: "space-between",
 		overflow: "hidden",
 		position: "relative",
+		backgroundColor: isElevationBg ? bg : void 0,
 		...props,
 		children
 	});

package/dist/components/client/Toast/UDSToastConfigProvider.d.cts

@@ -30,6 +30,13 @@ declare const useToastConfig: (sizeProp?: ToastSize | undefined, variantProp?: T
   iconVariant: IconVariant;
   autoClose: number | false;
   position: ToastPosition;
+  backgroundColor: {
+    warning: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
+    info: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
+    error: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
+    loading: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
+    success: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
+  };
 };
 //#endregion
 export { type UDSToastConfigContextType, UDSToastConfigProvider, type UDSToastConfigProviderProps, useToastConfig };