magick-ui 0.1.0

package/dist/index.cjs

@@ -0,0 +1,1325 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  ButtonGroupPrimitive: () => ButtonGroupPrimitive,
+  CardPrimitive: () => CardPrimitive,
+  KeyValuePrimitive: () => KeyValuePrimitive,
+  UIRenderer: () => UIRenderer,
+  cn: () => cn,
+  componentSchema: () => componentSchema,
+  designTokens: () => designTokens,
+  getAvailablePrimitives: () => getAvailablePrimitives,
+  getFullExample: () => getFullExample,
+  getPrimitiveSchemas: () => getPrimitiveSchemas,
+  getTokenValue: () => getTokenValue,
+  getTokenValueWithFallback: () => getTokenValueWithFallback,
+  isUINode: () => isUINode,
+  registerPrimitives: () => registerPrimitives
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/primitives/CardPrimitive.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function CardPrimitive({
+  title,
+  subtitle,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      style: {
+        width: "100%",
+        maxWidth: "28rem",
+        overflow: "hidden",
+        borderRadius: "1rem",
+        border: "1px solid var(--gen-ui-border, #e2e8f0)",
+        backgroundColor: "var(--gen-ui-card-bg, #ffffff)"
+      },
+      children: [
+        (title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            style: {
+              padding: "0.75rem 1rem",
+              borderBottom: "1px solid var(--gen-ui-border, #e2e8f0)"
+            },
+            children: [
+              title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "h3",
+                {
+                  style: {
+                    margin: 0,
+                    fontSize: "0.875rem",
+                    fontWeight: 600,
+                    color: "var(--gen-ui-text, #1a202c)"
+                  },
+                  children: title
+                }
+              ),
+              subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "p",
+                {
+                  style: {
+                    margin: "0.125rem 0 0",
+                    fontSize: "0.75rem",
+                    color: "var(--gen-ui-text-muted, #718096)"
+                  },
+                  children: subtitle
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { padding: "1rem", display: "flex", flexDirection: "column", gap: "0.75rem" }, children })
+      ]
+    }
+  );
+}
+
+// src/primitives/KeyValuePrimitive.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function KeyValuePrimitive({
+  items = []
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: "0.375rem" }, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "baseline",
+        justifyContent: "space-between",
+        gap: "1rem"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "span",
+          {
+            style: {
+              flexShrink: 0,
+              fontSize: "0.75rem",
+              fontWeight: 500,
+              color: "var(--gen-ui-text-muted, #718096)"
+            },
+            children: item.label
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "span",
+          {
+            style: {
+              fontSize: "0.875rem",
+              fontWeight: 500,
+              textAlign: "right",
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+              color: "var(--gen-ui-text, #1a202c)"
+            },
+            children: item.value
+          }
+        )
+      ]
+    },
+    i
+  )) });
+}
+
+// src/primitives/ButtonGroupPrimitive.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var variantStyles = {
+  primary: {
+    backgroundColor: "var(--gen-ui-btn-primary-bg, #3182ce)",
+    color: "var(--gen-ui-btn-primary-text, #ffffff)",
+    border: "none"
+  },
+  secondary: {
+    backgroundColor: "var(--gen-ui-btn-secondary-bg, #edf2f7)",
+    color: "var(--gen-ui-btn-secondary-text, #2d3748)",
+    border: "none"
+  },
+  outline: {
+    backgroundColor: "transparent",
+    color: "var(--gen-ui-btn-outline-text, #2d3748)",
+    border: "1px solid var(--gen-ui-border, #e2e8f0)"
+  }
+};
+function ButtonGroupPrimitive({
+  buttons = []
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.5rem" }, children: buttons.map((btn, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "button",
+    {
+      style: {
+        padding: "0.375rem 0.75rem",
+        fontSize: "0.875rem",
+        fontWeight: 500,
+        borderRadius: "0.5rem",
+        cursor: "pointer",
+        ...variantStyles[btn.variant ?? "primary"]
+      },
+      onClick: () => {
+        if (btn.url) window.open(btn.url, "_blank");
+      },
+      children: btn.label
+    },
+    i
+  )) });
+}
+
+// src/renderer.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var defaultPrimitives = {
+  card: CardPrimitive,
+  "key-value": KeyValuePrimitive,
+  "button-group": ButtonGroupPrimitive
+};
+var registeredPrimitives = {
+  ...defaultPrimitives
+};
+function registerPrimitives(primitives) {
+  registeredPrimitives = { ...registeredPrimitives, ...primitives };
+}
+function isUINode(data) {
+  return typeof data === "object" && data !== null && "type" in data && typeof data.type === "string" && data.type in registeredPrimitives;
+}
+function getAvailablePrimitives() {
+  return Object.keys(registeredPrimitives);
+}
+function UIRenderer({ node }) {
+  const Component = registeredPrimitives[node.type];
+  if (!Component) return null;
+  const childElements = node.children?.map((child, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UIRenderer, { node: child }, i));
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Component, { ...node.props ?? {}, children: childElements });
+}
+
+// schema/component-schema.json
+var component_schema_default = {
+  $schema: "Generative UI Component Schema",
+  description: "Available primitive components for composing chat UI. The AI should return a JSON tree using these types. Each node has: type (string), props (object), children (array of nodes, optional).",
+  primitives: {
+    card: {
+      description: "Container with optional title and subtitle. Can wrap other components as children.",
+      props: {
+        title: { type: "string", required: false, description: "Card heading text" },
+        subtitle: { type: "string", required: false, description: "Secondary text below the title" }
+      },
+      accepts_children: true,
+      example: {
+        type: "card",
+        props: { title: "Project Summary", subtitle: "Last updated 2 hours ago" },
+        children: []
+      }
+    },
+    "key-value": {
+      description: "Displays a list of label-value pairs. Use for entity details like name, status, email, etc.",
+      props: {
+        items: {
+          type: "array",
+          required: true,
+          description: "Array of { label, value } objects",
+          item_schema: {
+            label: { type: "string", description: "Field name (e.g. 'Email', 'Status')" },
+            value: { type: "string", description: "Field value" }
+          }
+        }
+      },
+      accepts_children: false,
+      example: {
+        type: "key-value",
+        props: {
+          items: [
+            { label: "Client", value: "Orchid Flo" },
+            { label: "Status", value: "Active" },
+            { label: "Email", value: "ray@example.com" }
+          ]
+        }
+      }
+    },
+    "button-group": {
+      description: "Row of action buttons. Use when offering choices or actions to the user.",
+      props: {
+        buttons: {
+          type: "array",
+          required: true,
+          description: "Array of button definitions",
+          item_schema: {
+            label: { type: "string", description: "Button text" },
+            variant: { type: "string", enum: ["primary", "secondary", "outline"], description: "Button style" },
+            url: { type: "string", required: false, description: "URL to open when clicked" }
+          }
+        }
+      },
+      accepts_children: false,
+      example: {
+        type: "button-group",
+        props: {
+          buttons: [
+            { label: "Open Project", variant: "primary", url: "/projects/123" },
+            { label: "View Documents", variant: "outline" }
+          ]
+        }
+      }
+    }
+  },
+  ui_tree_format: {
+    description: "The AI should return a JSON object with this structure. Send it via Centrifugo as the message payload.",
+    schema: {
+      type: { type: "string", description: "One of the primitive type names above" },
+      props: { type: "object", description: "Props matching the primitive's prop schema" },
+      children: { type: "array", description: "Optional array of nested nodes (only for types with accepts_children: true)" }
+    }
+  },
+  full_example: {
+    type: "card",
+    props: { title: "Client Overview" },
+    children: [
+      {
+        type: "key-value",
+        props: {
+          items: [
+            { label: "Name", value: "Orchid Flo" },
+            { label: "Type", value: "Company" },
+            { label: "Email", value: "ray@example.com" }
+          ]
+        }
+      },
+      {
+        type: "card",
+        props: { title: "Project: Promotion" },
+        children: [
+          {
+            type: "key-value",
+            props: {
+              items: [
+                { label: "Status", value: "Active" },
+                { label: "Workspaces", value: "3" }
+              ]
+            }
+          },
+          {
+            type: "button-group",
+            props: {
+              buttons: [
+                { label: "Open Project", variant: "primary" },
+                { label: "View Documents", variant: "outline" }
+              ]
+            }
+          }
+        ]
+      }
+    ]
+  }
+};
+
+// src/schema.ts
+var componentSchema = component_schema_default;
+function getPrimitiveSchemas() {
+  return componentSchema.primitives;
+}
+function getFullExample() {
+  return componentSchema.full_example;
+}
+
+// src/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/design-tokens/design-tokens.ts
+var designTokens = {
+  "color-slate-50": "var(--color-slate-50)",
+  "color-slate-100": "var(--color-slate-100)",
+  "color-slate-200": "var(--color-slate-200)",
+  "color-slate-300": "var(--color-slate-300)",
+  "color-slate-400": "var(--color-slate-400)",
+  "color-slate-500": "var(--color-slate-500)",
+  "color-slate-600": "var(--color-slate-600)",
+  "color-slate-700": "var(--color-slate-700)",
+  "color-slate-800": "var(--color-slate-800)",
+  "color-slate-900": "var(--color-slate-900)",
+  "color-slate-950": "var(--color-slate-950)",
+  "color-red-50": "var(--color-red-50)",
+  "color-red-100": "var(--color-red-100)",
+  "color-red-200": "var(--color-red-200)",
+  "color-red-300": "var(--color-red-300)",
+  "color-red-400": "var(--color-red-400)",
+  "color-red-500": "var(--color-red-500)",
+  "color-red-600": "var(--color-red-600)",
+  "color-red-700": "var(--color-red-700)",
+  "color-red-800": "var(--color-red-800)",
+  "color-red-900": "var(--color-red-900)",
+  "color-red-950": "var(--color-red-950)",
+  "color-orange-50": "var(--color-orange-50)",
+  "color-orange-100": "var(--color-orange-100)",
+  "color-orange-200": "var(--color-orange-200)",
+  "color-orange-300": "var(--color-orange-300)",
+  "color-orange-400": "var(--color-orange-400)",
+  "color-orange-500": "var(--color-orange-500)",
+  "color-orange-600": "var(--color-orange-600)",
+  "color-orange-700": "var(--color-orange-700)",
+  "color-orange-800": "var(--color-orange-800)",
+  "color-orange-900": "var(--color-orange-900)",
+  "color-orange-950": "var(--color-orange-950)",
+  "color-amber-50": "var(--color-amber-50)",
+  "color-amber-100": "var(--color-amber-100)",
+  "color-amber-200": "var(--color-amber-200)",
+  "color-amber-300": "var(--color-amber-300)",
+  "color-amber-400": "var(--color-amber-400)",
+  "color-amber-500": "var(--color-amber-500)",
+  "color-amber-600": "var(--color-amber-600)",
+  "color-amber-700": "var(--color-amber-700)",
+  "color-amber-800": "var(--color-amber-800)",
+  "color-amber-900": "var(--color-amber-900)",
+  "color-amber-950": "var(--color-amber-950)",
+  "color-yellow-50": "var(--color-yellow-50)",
+  "color-yellow-100": "var(--color-yellow-100)",
+  "color-yellow-200": "var(--color-yellow-200)",
+  "color-yellow-300": "var(--color-yellow-300)",
+  "color-yellow-400": "var(--color-yellow-400)",
+  "color-yellow-500": "var(--color-yellow-500)",
+  "color-yellow-600": "var(--color-yellow-600)",
+  "color-yellow-700": "var(--color-yellow-700)",
+  "color-yellow-800": "var(--color-yellow-800)",
+  "color-yellow-900": "var(--color-yellow-900)",
+  "color-yellow-950": "var(--color-yellow-950)",
+  "color-lime-50": "var(--color-lime-50)",
+  "color-lime-100": "var(--color-lime-100)",
+  "color-lime-200": "var(--color-lime-200)",
+  "color-lime-300": "var(--color-lime-300)",
+  "color-lime-400": "var(--color-lime-400)",
+  "color-lime-500": "var(--color-lime-500)",
+  "color-lime-600": "var(--color-lime-600)",
+  "color-lime-700": "var(--color-lime-700)",
+  "color-lime-800": "var(--color-lime-800)",
+  "color-lime-900": "var(--color-lime-900)",
+  "color-lime-950": "var(--color-lime-950)",
+  "color-green-50": "var(--color-green-50)",
+  "color-green-100": "var(--color-green-100)",
+  "color-green-200": "var(--color-green-200)",
+  "color-green-300": "var(--color-green-300)",
+  "color-green-400": "var(--color-green-400)",
+  "color-green-500": "var(--color-green-500)",
+  "color-green-600": "var(--color-green-600)",
+  "color-green-700": "var(--color-green-700)",
+  "color-green-800": "var(--color-green-800)",
+  "color-green-900": "var(--color-green-900)",
+  "color-green-950": "var(--color-green-950)",
+  "color-emerald-50": "var(--color-emerald-50)",
+  "color-emerald-100": "var(--color-emerald-100)",
+  "color-emerald-200": "var(--color-emerald-200)",
+  "color-emerald-300": "var(--color-emerald-300)",
+  "color-emerald-400": "var(--color-emerald-400)",
+  "color-emerald-500": "var(--color-emerald-500)",
+  "color-emerald-600": "var(--color-emerald-600)",
+  "color-emerald-700": "var(--color-emerald-700)",
+  "color-emerald-800": "var(--color-emerald-800)",
+  "color-emerald-900": "var(--color-emerald-900)",
+  "color-emerald-950": "var(--color-emerald-950)",
+  "color-teal-50": "var(--color-teal-50)",
+  "color-teal-100": "var(--color-teal-100)",
+  "color-teal-200": "var(--color-teal-200)",
+  "color-teal-300": "var(--color-teal-300)",
+  "color-teal-400": "var(--color-teal-400)",
+  "color-teal-500": "var(--color-teal-500)",
+  "color-teal-600": "var(--color-teal-600)",
+  "color-teal-700": "var(--color-teal-700)",
+  "color-teal-800": "var(--color-teal-800)",
+  "color-teal-900": "var(--color-teal-900)",
+  "color-teal-950": "var(--color-teal-950)",
+  "color-cyan-50": "var(--color-cyan-50)",
+  "color-cyan-100": "var(--color-cyan-100)",
+  "color-cyan-200": "var(--color-cyan-200)",
+  "color-cyan-300": "var(--color-cyan-300)",
+  "color-cyan-400": "var(--color-cyan-400)",
+  "color-cyan-500": "var(--color-cyan-500)",
+  "color-cyan-600": "var(--color-cyan-600)",
+  "color-cyan-700": "var(--color-cyan-700)",
+  "color-cyan-800": "var(--color-cyan-800)",
+  "color-cyan-900": "var(--color-cyan-900)",
+  "color-cyan-950": "var(--color-cyan-950)",
+  "color-sky-50": "var(--color-sky-50)",
+  "color-sky-100": "var(--color-sky-100)",
+  "color-sky-200": "var(--color-sky-200)",
+  "color-sky-300": "var(--color-sky-300)",
+  "color-sky-400": "var(--color-sky-400)",
+  "color-sky-500": "var(--color-sky-500)",
+  "color-sky-600": "var(--color-sky-600)",
+  "color-sky-700": "var(--color-sky-700)",
+  "color-sky-800": "var(--color-sky-800)",
+  "color-sky-900": "var(--color-sky-900)",
+  "color-sky-950": "var(--color-sky-950)",
+  "color-blue-50": "var(--color-blue-50)",
+  "color-blue-100": "var(--color-blue-100)",
+  "color-blue-200": "var(--color-blue-200)",
+  "color-blue-300": "var(--color-blue-300)",
+  "color-blue-400": "var(--color-blue-400)",
+  "color-blue-500": "var(--color-blue-500)",
+  "color-blue-600": "var(--color-blue-600)",
+  "color-blue-700": "var(--color-blue-700)",
+  "color-blue-800": "var(--color-blue-800)",
+  "color-blue-900": "var(--color-blue-900)",
+  "color-blue-950": "var(--color-blue-950)",
+  "color-indigo-50": "var(--color-indigo-50)",
+  "color-indigo-100": "var(--color-indigo-100)",
+  "color-indigo-200": "var(--color-indigo-200)",
+  "color-indigo-300": "var(--color-indigo-300)",
+  "color-indigo-400": "var(--color-indigo-400)",
+  "color-indigo-500": "var(--color-indigo-500)",
+  "color-indigo-600": "var(--color-indigo-600)",
+  "color-indigo-700": "var(--color-indigo-700)",
+  "color-indigo-800": "var(--color-indigo-800)",
+  "color-indigo-900": "var(--color-indigo-900)",
+  "color-indigo-950": "var(--color-indigo-950)",
+  "color-violet-50": "var(--color-violet-50)",
+  "color-violet-100": "var(--color-violet-100)",
+  "color-violet-200": "var(--color-violet-200)",
+  "color-violet-300": "var(--color-violet-300)",
+  "color-violet-400": "var(--color-violet-400)",
+  "color-violet-500": "var(--color-violet-500)",
+  "color-violet-600": "var(--color-violet-600)",
+  "color-violet-700": "var(--color-violet-700)",
+  "color-violet-800": "var(--color-violet-800)",
+  "color-violet-900": "var(--color-violet-900)",
+  "color-violet-950": "var(--color-violet-950)",
+  "color-purple-50": "var(--color-purple-50)",
+  "color-purple-100": "var(--color-purple-100)",
+  "color-purple-200": "var(--color-purple-200)",
+  "color-purple-300": "var(--color-purple-300)",
+  "color-purple-400": "var(--color-purple-400)",
+  "color-purple-500": "var(--color-purple-500)",
+  "color-purple-600": "var(--color-purple-600)",
+  "color-purple-700": "var(--color-purple-700)",
+  "color-purple-800": "var(--color-purple-800)",
+  "color-purple-900": "var(--color-purple-900)",
+  "color-purple-950": "var(--color-purple-950)",
+  "color-fuchsia-50": "var(--color-fuchsia-50)",
+  "color-fuchsia-100": "var(--color-fuchsia-100)",
+  "color-fuchsia-200": "var(--color-fuchsia-200)",
+  "color-fuchsia-300": "var(--color-fuchsia-300)",
+  "color-fuchsia-400": "var(--color-fuchsia-400)",
+  "color-fuchsia-500": "var(--color-fuchsia-500)",
+  "color-fuchsia-600": "var(--color-fuchsia-600)",
+  "color-fuchsia-700": "var(--color-fuchsia-700)",
+  "color-fuchsia-800": "var(--color-fuchsia-800)",
+  "color-fuchsia-900": "var(--color-fuchsia-900)",
+  "color-fuchsia-950": "var(--color-fuchsia-950)",
+  "color-pink-50": "var(--color-pink-50)",
+  "color-pink-100": "var(--color-pink-100)",
+  "color-pink-200": "var(--color-pink-200)",
+  "color-pink-300": "var(--color-pink-300)",
+  "color-pink-400": "var(--color-pink-400)",
+  "color-pink-500": "var(--color-pink-500)",
+  "color-pink-600": "var(--color-pink-600)",
+  "color-pink-700": "var(--color-pink-700)",
+  "color-pink-800": "var(--color-pink-800)",
+  "color-pink-900": "var(--color-pink-900)",
+  "color-pink-950": "var(--color-pink-950)",
+  "color-rose-50": "var(--color-rose-50)",
+  "color-rose-100": "var(--color-rose-100)",
+  "color-rose-200": "var(--color-rose-200)",
+  "color-rose-300": "var(--color-rose-300)",
+  "color-rose-400": "var(--color-rose-400)",
+  "color-rose-500": "var(--color-rose-500)",
+  "color-rose-600": "var(--color-rose-600)",
+  "color-rose-700": "var(--color-rose-700)",
+  "color-rose-800": "var(--color-rose-800)",
+  "color-rose-900": "var(--color-rose-900)",
+  "color-rose-950": "var(--color-rose-950)",
+  "color-neutral-black": "var(--color-neutral-black)",
+  "color-neutral-white": "var(--color-neutral-white)",
+  "typography-font-sans": "var(--typography-font-sans)",
+  "typography-text-sm": "var(--typography-text-sm)",
+  "typography-text-base": "var(--typography-text-base)",
+  "typography-text-lg": "var(--typography-text-lg)",
+  "typography-text-xl": "var(--typography-text-xl)",
+  "typography-text-2xl": "var(--typography-text-2xl)",
+  "typography-text-3xl": "var(--typography-text-3xl)",
+  "typography-text-4xl": "var(--typography-text-4xl)",
+  "typography-text-5xl": "var(--typography-text-5xl)",
+  "typography-text-6xl": "var(--typography-text-6xl)",
+  "typography-text-7xl": "var(--typography-text-7xl)",
+  "typography-leading-1": "var(--typography-leading-1)",
+  "typography-leading-2": "var(--typography-leading-2)",
+  "typography-leading-3": "var(--typography-leading-3)",
+  "typography-leading-4": "var(--typography-leading-4)",
+  "typography-leading-5": "var(--typography-leading-5)",
+  "typography-leading-6": "var(--typography-leading-6)",
+  "typography-leading-7": "var(--typography-leading-7)",
+  "typography-leading-8": "var(--typography-leading-8)",
+  "typography-leading-9": "var(--typography-leading-9)",
+  "typography-leading-10": "var(--typography-leading-10)",
+  "font-weight-500": "var(--font-weight-500)",
+  "font-weight-600": "var(--font-weight-600)",
+  "font-weight-700": "var(--font-weight-700)",
+  "tracking-0": "var(--tracking-0)",
+  "typography-paragraph-8": "var(--typography-paragraph-8)",
+  "typography-paragraph-16": "var(--typography-paragraph-16)",
+  "typography-paragraph-20": "var(--typography-paragraph-20)",
+  "typography-paragraph-24": "var(--typography-paragraph-24)",
+  "spacing-unit-2px": "var(--spacing-unit-2px)",
+  "spacing-unit-4px": "var(--spacing-unit-4px)",
+  "spacing-unit-6px": "var(--spacing-unit-6px)",
+  "spacing-unit-8px": "var(--spacing-unit-8px)",
+  "spacing-unit-10px": "var(--spacing-unit-10px)",
+  "spacing-unit-12px": "var(--spacing-unit-12px)",
+  "spacing-unit-14px": "var(--spacing-unit-14px)",
+  "spacing-unit-16px": "var(--spacing-unit-16px)",
+  "spacing-unit-24px": "var(--spacing-unit-24px)",
+  "spacing-unit-32px": "var(--spacing-unit-32px)",
+  "spacing-unit-40px": "var(--spacing-unit-40px)",
+  "spacing-unit-0px": "var(--spacing-unit-0px)",
+  "spacing-unit-128px": "var(--spacing-unit-128px)",
+  "spacing-unit--8px": "var(--spacing-unit--8px)",
+  "spacing-unit--16px": "var(--spacing-unit--16px)",
+  "spacing-unit--4px": "var(--spacing-unit--4px)",
+  "spacing-unit-1px": "var(--spacing-unit-1px)",
+  "spacing-unit-64px": "var(--spacing-unit-64px)",
+  "spacing-unit--24px": "var(--spacing-unit--24px)",
+  "radius-unit-corner-radius-xs": "var(--radius-unit-corner-radius-xs)",
+  "radius-unit-corner-radius-sm": "var(--radius-unit-corner-radius-sm)",
+  "radius-unit-corner-radius-md": "var(--radius-unit-corner-radius-md)",
+  "radius-unit-corner-radius-lg": "var(--radius-unit-corner-radius-lg)",
+  "radius-unit-corner-radius-xl": "var(--radius-unit-corner-radius-xl)",
+  "radius-unit-corner-radius-2xl": "var(--radius-unit-corner-radius-2xl)",
+  "radius-unit-corner-radius-3xl": "var(--radius-unit-corner-radius-3xl)",
+  "radius-unit-corner-radius-5xl": "var(--radius-unit-corner-radius-5xl)",
+  "radius-unit-corner-radius-none": "var(--radius-unit-corner-radius-none)",
+  "radius-unit-corner-radius-rounded-full": "var(--radius-unit-corner-radius-rounded-full)",
+  "radius-unit-corner-radius-6xl": "var(--radius-unit-corner-radius-6xl)",
+  "radius-unit-corner-radius-7xl": "var(--radius-unit-corner-radius-7xl)",
+  "radius-unit-corner-radius-4xl": "var(--radius-unit-corner-radius-4xl)",
+  "border-width-unit-border-width-sm": "var(--border-width-unit-border-width-sm)",
+  "border-width-unit-border-width-md": "var(--border-width-unit-border-width-md)",
+  "border-width-unit-border-width-lg": "var(--border-width-unit-border-width-lg)",
+  "opacity-unit-xs": "var(--opacity-unit-xs)",
+  "opacity-unit-sm": "var(--opacity-unit-sm)",
+  "opacity-unit-md": "var(--opacity-unit-md)",
+  "opacity-unit-lg": "var(--opacity-unit-lg)",
+  "opacity-unit-xl": "var(--opacity-unit-xl)",
+  "opacity-unit-2xl": "var(--opacity-unit-2xl)",
+  "unit-blur-xs": "var(--unit-blur-xs)",
+  "unit-blur-sm": "var(--unit-blur-sm)",
+  "unit-blur-md": "var(--unit-blur-md)",
+  "unit-blur-lg": "var(--unit-blur-lg)",
+  "unit-blur-xl": "var(--unit-blur-xl)",
+  "unit-blur-2xl": "var(--unit-blur-2xl)",
+  "unit-blur-none": "var(--unit-blur-none)",
+  "color-button-primary-enabled": "var(--color-button-primary-enabled)",
+  "color-button-primary-hovered": "var(--color-button-primary-hovered)",
+  "color-button-primary-pressed": "var(--color-button-primary-pressed)",
+  "color-button-primary-disabled": "var(--color-button-primary-disabled)",
+  "color-button-secondary-enabled": "var(--color-button-secondary-enabled)",
+  "color-button-secondary-hovered": "var(--color-button-secondary-hovered)",
+  "color-button-secondary-pressed": "var(--color-button-secondary-pressed)",
+  "color-button-secondary-disabled": "var(--color-button-secondary-disabled)",
+  "color-button-outline-enabled": "var(--color-button-outline-enabled)",
+  "color-button-outline-hovered": "var(--color-button-outline-hovered)",
+  "color-button-outline-pressed": "var(--color-button-outline-pressed)",
+  "color-button-outline-disabled": "var(--color-button-outline-disabled)",
+  "color-button-destructive-enabled": "var(--color-button-destructive-enabled)",
+  "color-button-destructive-hovered": "var(--color-button-destructive-hovered)",
+  "color-button-destructive-pressed": "var(--color-button-destructive-pressed)",
+  "color-button-destructive-disabled": "var(--color-button-destructive-disabled)",
+  "color-button-soft-enabled": "var(--color-button-soft-enabled)",
+  "color-button-soft-hovered": "var(--color-button-soft-hovered)",
+  "color-button-soft-pressed": "var(--color-button-soft-pressed)",
+  "color-button-soft-disabled": "var(--color-button-soft-disabled)",
+  "color-button-ghost-enabled": "var(--color-button-ghost-enabled)",
+  "color-button-ghost-hovered": "var(--color-button-ghost-hovered)",
+  "color-button-ghost-pressed": "var(--color-button-ghost-pressed)",
+  "color-button-ghost-disabled": "var(--color-button-ghost-disabled)",
+  "color-button-glass-enabled": "var(--color-button-glass-enabled)",
+  "color-button-glass-hovered": "var(--color-button-glass-hovered)",
+  "color-button-glass-pressed": "var(--color-button-glass-pressed)",
+  "color-button-glass-disabled": "var(--color-button-glass-disabled)",
+  "color-chip-slate-enabled": "var(--color-chip-slate-enabled)",
+  "color-chip-slate-hovered": "var(--color-chip-slate-hovered)",
+  "color-chip-red-enabled": "var(--color-chip-red-enabled)",
+  "color-chip-red-hovered": "var(--color-chip-red-hovered)",
+  "color-chip-orange-enabled": "var(--color-chip-orange-enabled)",
+  "color-chip-orange-hovered": "var(--color-chip-orange-hovered)",
+  "color-chip-amber-enabled": "var(--color-chip-amber-enabled)",
+  "color-chip-amber-hovered": "var(--color-chip-amber-hovered)",
+  "color-chip-yellow-enabled": "var(--color-chip-yellow-enabled)",
+  "color-chip-yellow-hovered": "var(--color-chip-yellow-hovered)",
+  "color-chip-lime-enabled": "var(--color-chip-lime-enabled)",
+  "color-chip-lime-hovered": "var(--color-chip-lime-hovered)",
+  "color-chip-green-enabled": "var(--color-chip-green-enabled)",
+  "color-chip-green-hovered": "var(--color-chip-green-hovered)",
+  "color-chip-emerald-enabled": "var(--color-chip-emerald-enabled)",
+  "color-chip-emerald-hovered": "var(--color-chip-emerald-hovered)",
+  "color-chip-teal-enabled": "var(--color-chip-teal-enabled)",
+  "color-chip-teal-hovered": "var(--color-chip-teal-hovered)",
+  "color-chip-cyan-enabled": "var(--color-chip-cyan-enabled)",
+  "color-chip-cyan-hovered": "var(--color-chip-cyan-hovered)",
+  "color-chip-sky-enabled": "var(--color-chip-sky-enabled)",
+  "color-chip-sky-hovered": "var(--color-chip-sky-hovered)",
+  "color-chip-blue-enabled": "var(--color-chip-blue-enabled)",
+  "color-chip-blue-hovered": "var(--color-chip-blue-hovered)",
+  "color-chip-indigo-enabled": "var(--color-chip-indigo-enabled)",
+  "color-chip-indigo-hovered": "var(--color-chip-indigo-hovered)",
+  "color-chip-violet-enabled": "var(--color-chip-violet-enabled)",
+  "color-chip-violet-hovered": "var(--color-chip-violet-hovered)",
+  "color-chip-purple-enabled": "var(--color-chip-purple-enabled)",
+  "color-chip-purple-hovered": "var(--color-chip-purple-hovered)",
+  "color-chip-fuchsia-enabled": "var(--color-chip-fuchsia-enabled)",
+  "color-chip-fuchsia-hovered": "var(--color-chip-fuchsia-hovered)",
+  "color-chip-pink-enabled": "var(--color-chip-pink-enabled)",
+  "color-chip-pink-hovered": "var(--color-chip-pink-hovered)",
+  "color-chip-rose-enabled": "var(--color-chip-rose-enabled)",
+  "color-chip-rose-hovered": "var(--color-chip-rose-hovered)",
+  "color-data-table-unselected-enabled": "var(--color-data-table-unselected-enabled)",
+  "color-data-table-unselected-hovered": "var(--color-data-table-unselected-hovered)",
+  "color-data-table-unselected-focused": "var(--color-data-table-unselected-focused)",
+  "color-data-table-selected-enabled": "var(--color-data-table-selected-enabled)",
+  "color-data-table-selected-hovered": "var(--color-data-table-selected-hovered)",
+  "color-data-table-selected-focused": "var(--color-data-table-selected-focused)",
+  "color-check-box-and-radio-checked-enabled": "var(--color-check-box-and-radio-checked-enabled)",
+  "color-check-box-and-radio-checked-hovered": "var(--color-check-box-and-radio-checked-hovered)",
+  "color-check-box-and-radio-checked-disabled": "var(--color-check-box-and-radio-checked-disabled)",
+  "color-check-box-and-radio-unchecked-enabled": "var(--color-check-box-and-radio-unchecked-enabled)",
+  "color-check-box-and-radio-unchecked-disabled": "var(--color-check-box-and-radio-unchecked-disabled)",
+  "color-check-box-and-radio-unchecked-hovered": "var(--color-check-box-and-radio-unchecked-hovered)",
+  "color-input-outline-enabled": "var(--color-input-outline-enabled)",
+  "color-input-outline-disabled": "var(--color-input-outline-disabled)",
+  "color-input-outline-hovered": "var(--color-input-outline-hovered)",
+  "color-input-ghost-enabled": "var(--color-input-ghost-enabled)",
+  "color-input-ghost-hovered": "var(--color-input-ghost-hovered)",
+  "color-input-ghost-disabled": "var(--color-input-ghost-disabled)",
+  "color-button-switch-on-enabled": "var(--color-button-switch-on-enabled)",
+  "color-button-switch-on-hovered": "var(--color-button-switch-on-hovered)",
+  "color-button-switch-on-disabled": "var(--color-button-switch-on-disabled)",
+  "color-button-switch-off-enabled": "var(--color-button-switch-off-enabled)",
+  "color-button-switch-off-hovered": "var(--color-button-switch-off-hovered)",
+  "color-button-switch-off-disabled": "var(--color-button-switch-off-disabled)",
+  "color-chat-bubble-primary-enabled": "var(--color-chat-bubble-primary-enabled)",
+  "color-chat-bubble-primary-hovered": "var(--color-chat-bubble-primary-hovered)",
+  "color-chat-bubble-neutral-enabled": "var(--color-chat-bubble-neutral-enabled)",
+  "color-chat-bubble-neutral-hovered": "var(--color-chat-bubble-neutral-hovered)",
+  "color-button-toggle-unselected-primary-enabled": "var(--color-button-toggle-unselected-primary-enabled)",
+  "color-button-toggle-unselected-primary-hovered": "var(--color-button-toggle-unselected-primary-hovered)",
+  "color-button-toggle-unselected-primary-pressed": "var(--color-button-toggle-unselected-primary-pressed)",
+  "color-button-toggle-unselected-secondary-enabled": "var(--color-button-toggle-unselected-secondary-enabled)",
+  "color-button-toggle-unselected-secondary-hovered": "var(--color-button-toggle-unselected-secondary-hovered)",
+  "color-button-toggle-unselected-secondary-pressed": "var(--color-button-toggle-unselected-secondary-pressed)",
+  "color-button-toggle-unselected-destructive-enabled": "var(--color-button-toggle-unselected-destructive-enabled)",
+  "color-button-toggle-unselected-destructive-hovered": "var(--color-button-toggle-unselected-destructive-hovered)",
+  "color-button-toggle-unselected-destructive-pressed": "var(--color-button-toggle-unselected-destructive-pressed)",
+  "color-button-toggle-selected-primary-enabled": "var(--color-button-toggle-selected-primary-enabled)",
+  "color-button-toggle-selected-primary-hovered": "var(--color-button-toggle-selected-primary-hovered)",
+  "color-button-toggle-selected-primary-pressed": "var(--color-button-toggle-selected-primary-pressed)",
+  "color-button-toggle-selected-secondary-enabled": "var(--color-button-toggle-selected-secondary-enabled)",
+  "color-button-toggle-selected-secondary-hovered": "var(--color-button-toggle-selected-secondary-hovered)",
+  "color-button-toggle-selected-secondary-pressed": "var(--color-button-toggle-selected-secondary-pressed)",
+  "color-button-toggle-selected-destructive-enabled": "var(--color-button-toggle-selected-destructive-enabled)",
+  "color-button-toggle-selected-destructive-hovered": "var(--color-button-toggle-selected-destructive-hovered)",
+  "color-button-toggle-selected-destructive-pressed": "var(--color-button-toggle-selected-destructive-pressed)",
+  "color-tab-primary-enabled": "var(--color-tab-primary-enabled)",
+  "color-tab-primary-hovered": "var(--color-tab-primary-hovered)",
+  "color-tab-primary-pressed": "var(--color-tab-primary-pressed)",
+  "color-tab-primary-active": "var(--color-tab-primary-active)",
+  "color-menu-panel-unselected-enabled": "var(--color-menu-panel-unselected-enabled)",
+  "color-menu-panel-unselected-hovered": "var(--color-menu-panel-unselected-hovered)",
+  "color-menu-panel-selected-enabled": "var(--color-menu-panel-selected-enabled)",
+  "color-menu-panel-selected-hovered": "var(--color-menu-panel-selected-hovered)",
+  "color-toast-error": "var(--color-toast-error)",
+  "color-toast-warning": "var(--color-toast-warning)",
+  "color-toast-success": "var(--color-toast-success)",
+  "color-toast-info": "var(--color-toast-info)",
+  "color-navigation-hovered": "var(--color-navigation-hovered)",
+  "color-navigation-selected": "var(--color-navigation-selected)",
+  "color-toggle-ghost-inactive-enabled": "var(--color-toggle-ghost-inactive-enabled)",
+  "color-toggle-ghost-inactive-hovered": "var(--color-toggle-ghost-inactive-hovered)",
+  "color-toggle-ghost-inactive-pressed": "var(--color-toggle-ghost-inactive-pressed)",
+  "color-toggle-ghost-inactive-disabled": "var(--color-toggle-ghost-inactive-disabled)",
+  "color-toggle-ghost-active-enabled": "var(--color-toggle-ghost-active-enabled)",
+  "color-toggle-ghost-active-hovered": "var(--color-toggle-ghost-active-hovered)",
+  "color-toggle-ghost-active-pressed": "var(--color-toggle-ghost-active-pressed)",
+  "color-toggle-ghost-active-disabled": "var(--color-toggle-ghost-active-disabled)",
+  "color-toggle-outline-active-enabled": "var(--color-toggle-outline-active-enabled)",
+  "color-toggle-outline-active-hovered": "var(--color-toggle-outline-active-hovered)",
+  "color-toggle-outline-active-pressed": "var(--color-toggle-outline-active-pressed)",
+  "color-toggle-outline-active-disabled": "var(--color-toggle-outline-active-disabled)",
+  "color-toggle-outline-inactive-enabled": "var(--color-toggle-outline-inactive-enabled)",
+  "color-toggle-outline-inactive-hovered": "var(--color-toggle-outline-inactive-hovered)",
+  "color-toggle-outline-inactive-pressed": "var(--color-toggle-outline-inactive-pressed)",
+  "color-toggle-outline-inactive-disabled": "var(--color-toggle-outline-inactive-disabled)",
+  "color-toggle-soft-active-enabled": "var(--color-toggle-soft-active-enabled)",
+  "color-toggle-soft-active-hovered": "var(--color-toggle-soft-active-hovered)",
+  "color-toggle-soft-active-pressed": "var(--color-toggle-soft-active-pressed)",
+  "color-toggle-soft-active-disabled": "var(--color-toggle-soft-active-disabled)",
+  "color-toggle-soft-inactive-enabled": "var(--color-toggle-soft-inactive-enabled)",
+  "color-toggle-soft-inactive-hovered": "var(--color-toggle-soft-inactive-hovered)",
+  "color-toggle-soft-inactive-pressed": "var(--color-toggle-soft-inactive-pressed)",
+  "color-toggle-soft-inactive-disabled": "var(--color-toggle-soft-inactive-disabled)",
+  "color-utility-tab-inactive-enabled": "var(--color-utility-tab-inactive-enabled)",
+  "color-utility-tab-inactive-hovered": "var(--color-utility-tab-inactive-hovered)",
+  "color-utility-tab-active-enabled": "var(--color-utility-tab-active-enabled)",
+  "color-utility-tab-active-hovered": "var(--color-utility-tab-active-hovered)",
+  "color-filter-chip-unselected-enabled": "var(--color-filter-chip-unselected-enabled)",
+  "color-filter-chip-unselected-hovered": "var(--color-filter-chip-unselected-hovered)",
+  "color-filter-chip-selected-enabled": "var(--color-filter-chip-selected-enabled)",
+  "color-filter-chip-selected-hovered": "var(--color-filter-chip-selected-hovered)",
+  "pagination-page-tab-enabled": "var(--pagination-page-tab-enabled)",
+  "pagination-page-tab-hovered": "var(--pagination-page-tab-hovered)",
+  "pagination-page-tab-pressed": "var(--pagination-page-tab-pressed)",
+  "pagination-page-tab-actived": "var(--pagination-page-tab-actived)",
+  "color-comment-opened-enabled": "var(--color-comment-opened-enabled)",
+  "color-comment-opened-hovered": "var(--color-comment-opened-hovered)",
+  "color-comment-opened-actived": "var(--color-comment-opened-actived)",
+  "color-comment-closed-enabled": "var(--color-comment-closed-enabled)",
+  "color-comment-closed-hovered": "var(--color-comment-closed-hovered)",
+  "color-comment-closed-actived": "var(--color-comment-closed-actived)",
+  "list-enabled": "var(--list-enabled)",
+  "list-hovered": "var(--list-hovered)",
+  "list-actived": "var(--list-actived)",
+  "color-dropdown-hovered": "var(--color-dropdown-hovered)",
+  "color-notificationCard-enabled": "var(--color-notificationCard-enabled)",
+  "color-notificationCard-hovered": "var(--color-notificationCard-hovered)",
+  "color-table-table-cell-unselected": "var(--color-table-table-cell-unselected)",
+  "color-table-table-cell-selected": "var(--color-table-table-cell-selected)",
+  "color-table-table-header-default": "var(--color-table-table-header-default)",
+  "color-fill-background": "var(--color-fill-background)",
+  "color-fill-foreground": "var(--color-fill-foreground)",
+  "color-fill-static-red-01": "var(--color-fill-static-red-01)",
+  "color-fill-static-red-03": "var(--color-fill-static-red-03)",
+  "color-fill-static-red-05": "var(--color-fill-static-red-05)",
+  "color-fill-static-red-04": "var(--color-fill-static-red-04)",
+  "color-fill-static-red-02": "var(--color-fill-static-red-02)",
+  "color-fill-static-red-06": "var(--color-fill-static-red-06)",
+  "color-fill-static-orange-01": "var(--color-fill-static-orange-01)",
+  "color-fill-static-orange-02": "var(--color-fill-static-orange-02)",
+  "color-fill-static-orange-03": "var(--color-fill-static-orange-03)",
+  "color-fill-static-amber-01": "var(--color-fill-static-amber-01)",
+  "color-fill-static-amber-02": "var(--color-fill-static-amber-02)",
+  "color-fill-static-amber-03": "var(--color-fill-static-amber-03)",
+  "color-fill-static-yellow-01": "var(--color-fill-static-yellow-01)",
+  "color-fill-static-yellow-02": "var(--color-fill-static-yellow-02)",
+  "color-fill-static-yellow-03": "var(--color-fill-static-yellow-03)",
+  "color-fill-static-lime-01": "var(--color-fill-static-lime-01)",
+  "color-fill-static-lime-02": "var(--color-fill-static-lime-02)",
+  "color-fill-static-lime-03": "var(--color-fill-static-lime-03)",
+  "color-fill-static-green-01": "var(--color-fill-static-green-01)",
+  "color-fill-static-green-03": "var(--color-fill-static-green-03)",
+  "color-fill-static-green-05": "var(--color-fill-static-green-05)",
+  "color-fill-static-green-02": "var(--color-fill-static-green-02)",
+  "color-fill-static-green-04": "var(--color-fill-static-green-04)",
+  "color-fill-static-emerald-01": "var(--color-fill-static-emerald-01)",
+  "color-fill-static-emerald-02": "var(--color-fill-static-emerald-02)",
+  "color-fill-static-emerald-03": "var(--color-fill-static-emerald-03)",
+  "color-fill-static-teal-01": "var(--color-fill-static-teal-01)",
+  "color-fill-static-teal-02": "var(--color-fill-static-teal-02)",
+  "color-fill-static-teal-03": "var(--color-fill-static-teal-03)",
+  "color-fill-static-cyan-01": "var(--color-fill-static-cyan-01)",
+  "color-fill-static-cyan-02": "var(--color-fill-static-cyan-02)",
+  "color-fill-static-cyan-03": "var(--color-fill-static-cyan-03)",
+  "color-fill-static-sky-01": "var(--color-fill-static-sky-01)",
+  "color-fill-static-sky-02": "var(--color-fill-static-sky-02)",
+  "color-fill-static-sky-03": "var(--color-fill-static-sky-03)",
+  "color-fill-static-blue-01": "var(--color-fill-static-blue-01)",
+  "color-fill-static-blue-03": "var(--color-fill-static-blue-03)",
+  "color-fill-static-blue-05": "var(--color-fill-static-blue-05)",
+  "color-fill-static-blue-02": "var(--color-fill-static-blue-02)",
+  "color-fill-static-blue-04": "var(--color-fill-static-blue-04)",
+  "color-fill-static-blue-06": "var(--color-fill-static-blue-06)",
+  "color-fill-static-indigo-01": "var(--color-fill-static-indigo-01)",
+  "color-fill-static-indigo-02": "var(--color-fill-static-indigo-02)",
+  "color-fill-static-indigo-03": "var(--color-fill-static-indigo-03)",
+  "color-fill-static-violet-01": "var(--color-fill-static-violet-01)",
+  "color-fill-static-violet-02": "var(--color-fill-static-violet-02)",
+  "color-fill-static-violet-03": "var(--color-fill-static-violet-03)",
+  "color-fill-static-purple-01": "var(--color-fill-static-purple-01)",
+  "color-fill-static-purple-02": "var(--color-fill-static-purple-02)",
+  "color-fill-static-purple-03": "var(--color-fill-static-purple-03)",
+  "color-fill-static-fuchsia-01": "var(--color-fill-static-fuchsia-01)",
+  "color-fill-static-fuchsia-02": "var(--color-fill-static-fuchsia-02)",
+  "color-fill-static-fuchsia-03": "var(--color-fill-static-fuchsia-03)",
+  "color-fill-static-pink-01": "var(--color-fill-static-pink-01)",
+  "color-fill-static-pink-02": "var(--color-fill-static-pink-02)",
+  "color-fill-static-pink-03": "var(--color-fill-static-pink-03)",
+  "color-fill-static-rose-01": "var(--color-fill-static-rose-01)",
+  "color-fill-static-rose-02": "var(--color-fill-static-rose-02)",
+  "color-fill-static-rose-dark": "var(--color-fill-static-rose-dark)",
+  "color-fill-static-slate-01": "var(--color-fill-static-slate-01)",
+  "color-fill-static-slate-02": "var(--color-fill-static-slate-02)",
+  "color-fill-static-slate-03": "var(--color-fill-static-slate-03)",
+  "color-fill-static-slate-04": "var(--color-fill-static-slate-04)",
+  "color-fill-static-slate-05": "var(--color-fill-static-slate-05)",
+  "color-fill-inverse-slate-10": "var(--color-fill-inverse-slate-10)",
+  "color-fill-inverse-slate-01": "var(--color-fill-inverse-slate-01)",
+  "color-fill-inverse-slate-03": "var(--color-fill-inverse-slate-03)",
+  "color-fill-inverse-slate-07": "var(--color-fill-inverse-slate-07)",
+  "color-fill-inverse-slate-06": "var(--color-fill-inverse-slate-06)",
+  "color-fill-inverse-slate-08": "var(--color-fill-inverse-slate-08)",
+  "color-fill-inverse-slate-09": "var(--color-fill-inverse-slate-09)",
+  "color-fill-inverse-slate-04": "var(--color-fill-inverse-slate-04)",
+  "color-fill-inverse-slate-05": "var(--color-fill-inverse-slate-05)",
+  "color-fill-inverse-slate-02": "var(--color-fill-inverse-slate-02)",
+  "color-fill-inverse-blue-01": "var(--color-fill-inverse-blue-01)",
+  "color-fill-inverse-blue-02": "var(--color-fill-inverse-blue-02)",
+  "color-fill-inverse-red-01": "var(--color-fill-inverse-red-01)",
+  "color-fill-inverse-red-02": "var(--color-fill-inverse-red-02)",
+  "color-fill-inverse-orange-01": "var(--color-fill-inverse-orange-01)",
+  "color-fill-inverse-orange-02": "var(--color-fill-inverse-orange-02)",
+  "color-fill-inverse-yellow-01": "var(--color-fill-inverse-yellow-01)",
+  "color-fill-inverse-yellow-02": "var(--color-fill-inverse-yellow-02)",
+  "color-fill-inverse-lime-01": "var(--color-fill-inverse-lime-01)",
+  "color-fill-inverse-lime-02": "var(--color-fill-inverse-lime-02)",
+  "color-fill-inverse-green-01": "var(--color-fill-inverse-green-01)",
+  "color-fill-inverse-green-02": "var(--color-fill-inverse-green-02)",
+  "color-fill-inverse-emerald-01": "var(--color-fill-inverse-emerald-01)",
+  "color-fill-inverse-emerald-02": "var(--color-fill-inverse-emerald-02)",
+  "color-fill-inverse-teal-01": "var(--color-fill-inverse-teal-01)",
+  "color-fill-inverse-teal-02": "var(--color-fill-inverse-teal-02)",
+  "color-fill-inverse-cyan-01": "var(--color-fill-inverse-cyan-01)",
+  "color-fill-inverse-cyan-02": "var(--color-fill-inverse-cyan-02)",
+  "color-fill-inverse-sky-01": "var(--color-fill-inverse-sky-01)",
+  "color-fill-inverse-sky-02": "var(--color-fill-inverse-sky-02)",
+  "color-fill-inverse-violet-01": "var(--color-fill-inverse-violet-01)",
+  "color-fill-inverse-violet-02": "var(--color-fill-inverse-violet-02)",
+  "color-fill-inverse-indigo-01": "var(--color-fill-inverse-indigo-01)",
+  "color-fill-inverse-indigo-02": "var(--color-fill-inverse-indigo-02)",
+  "color-fill-inverse-purple-01": "var(--color-fill-inverse-purple-01)",
+  "color-fill-inverse-purple-02": "var(--color-fill-inverse-purple-02)",
+  "color-fill-inverse-fuchsia-01": "var(--color-fill-inverse-fuchsia-01)",
+  "color-fill-inverse-fuchsia-02": "var(--color-fill-inverse-fuchsia-02)",
+  "color-fill-inverse-pink-01": "var(--color-fill-inverse-pink-01)",
+  "color-fill-inverse-pink-02": "var(--color-fill-inverse-pink-02)",
+  "color-fill-inverse-rose-01": "var(--color-fill-inverse-rose-01)",
+  "color-fill-inverse-rose-02": "var(--color-fill-inverse-rose-02)",
+  "color-fill-inverse-amber-01": "var(--color-fill-inverse-amber-01)",
+  "color-fill-inverse-amber-02": "var(--color-fill-inverse-amber-02)",
+  "color-stroke-inverse-slate-01": "var(--color-stroke-inverse-slate-01)",
+  "color-stroke-inverse-slate-03": "var(--color-stroke-inverse-slate-03)",
+  "color-stroke-inverse-slate-04": "var(--color-stroke-inverse-slate-04)",
+  "color-stroke-inverse-slate-02": "var(--color-stroke-inverse-slate-02)",
+  "color-stroke-inverse-red-01": "var(--color-stroke-inverse-red-01)",
+  "color-stroke-inverse-red-02": "var(--color-stroke-inverse-red-02)",
+  "color-stroke-inverse-orange-01": "var(--color-stroke-inverse-orange-01)",
+  "color-stroke-inverse-orange-02": "var(--color-stroke-inverse-orange-02)",
+  "color-stroke-inverse-amber-01": "var(--color-stroke-inverse-amber-01)",
+  "color-stroke-inverse-amber-02": "var(--color-stroke-inverse-amber-02)",
+  "color-stroke-inverse-yellow-01": "var(--color-stroke-inverse-yellow-01)",
+  "color-stroke-inverse-yellow-02": "var(--color-stroke-inverse-yellow-02)",
+  "color-stroke-inverse-lime-01": "var(--color-stroke-inverse-lime-01)",
+  "color-stroke-inverse-lime-02": "var(--color-stroke-inverse-lime-02)",
+  "color-stroke-inverse-green-01": "var(--color-stroke-inverse-green-01)",
+  "color-stroke-inverse-green-02": "var(--color-stroke-inverse-green-02)",
+  "color-stroke-inverse-emerald-01": "var(--color-stroke-inverse-emerald-01)",
+  "color-stroke-inverse-emerald-02": "var(--color-stroke-inverse-emerald-02)",
+  "color-stroke-inverse-teal-01": "var(--color-stroke-inverse-teal-01)",
+  "color-stroke-inverse-teal-02": "var(--color-stroke-inverse-teal-02)",
+  "color-stroke-inverse-cyan-01": "var(--color-stroke-inverse-cyan-01)",
+  "color-stroke-inverse-cyan-02": "var(--color-stroke-inverse-cyan-02)",
+  "color-stroke-inverse-sky-01": "var(--color-stroke-inverse-sky-01)",
+  "color-stroke-inverse-sky-02": "var(--color-stroke-inverse-sky-02)",
+  "color-stroke-inverse-blue-01": "var(--color-stroke-inverse-blue-01)",
+  "color-stroke-inverse-blue-02": "var(--color-stroke-inverse-blue-02)",
+  "color-stroke-inverse-indigo-01": "var(--color-stroke-inverse-indigo-01)",
+  "color-stroke-inverse-indigo-02": "var(--color-stroke-inverse-indigo-02)",
+  "color-stroke-inverse-violet-01": "var(--color-stroke-inverse-violet-01)",
+  "color-stroke-inverse-violet-02": "var(--color-stroke-inverse-violet-02)",
+  "color-stroke-inverse-purple-01": "var(--color-stroke-inverse-purple-01)",
+  "color-stroke-inverse-purple-02": "var(--color-stroke-inverse-purple-02)",
+  "color-stroke-inverse-fuchsia-01": "var(--color-stroke-inverse-fuchsia-01)",
+  "color-stroke-inverse-fuchsia-02": "var(--color-stroke-inverse-fuchsia-02)",
+  "color-stroke-inverse-pink-01": "var(--color-stroke-inverse-pink-01)",
+  "color-stroke-inverse-pink-02": "var(--color-stroke-inverse-pink-02)",
+  "color-stroke-inverse-rose-01": "var(--color-stroke-inverse-rose-01)",
+  "color-stroke-inverse-rose-02": "var(--color-stroke-inverse-rose-02)",
+  "color-stroke-static-slate-01": "var(--color-stroke-static-slate-01)",
+  "color-stroke-static-slate-02": "var(--color-stroke-static-slate-02)",
+  "color-stroke-static-slate-03": "var(--color-stroke-static-slate-03)",
+  "color-stroke-static-slate-04": "var(--color-stroke-static-slate-04)",
+  "color-stroke-static-slate-05": "var(--color-stroke-static-slate-05)",
+  "color-stroke-static-red-01": "var(--color-stroke-static-red-01)",
+  "color-stroke-static-red-02": "var(--color-stroke-static-red-02)",
+  "color-stroke-static-red-03": "var(--color-stroke-static-red-03)",
+  "color-stroke-static-red-04": "var(--color-stroke-static-red-04)",
+  "color-stroke-static-red-05": "var(--color-stroke-static-red-05)",
+  "color-stroke-static-orange-01": "var(--color-stroke-static-orange-01)",
+  "color-stroke-static-orange-02": "var(--color-stroke-static-orange-02)",
+  "color-stroke-static-orange-03": "var(--color-stroke-static-orange-03)",
+  "color-stroke-static-amber-01": "var(--color-stroke-static-amber-01)",
+  "color-stroke-static-amber-02": "var(--color-stroke-static-amber-02)",
+  "color-stroke-static-amber-03": "var(--color-stroke-static-amber-03)",
+  "color-stroke-static-yellow-01": "var(--color-stroke-static-yellow-01)",
+  "color-stroke-static-yellow-02": "var(--color-stroke-static-yellow-02)",
+  "color-stroke-static-yellow-03": "var(--color-stroke-static-yellow-03)",
+  "color-stroke-static-lime-01": "var(--color-stroke-static-lime-01)",
+  "color-stroke-static-lime-02": "var(--color-stroke-static-lime-02)",
+  "color-stroke-static-lime-03": "var(--color-stroke-static-lime-03)",
+  "color-stroke-static-green-01": "var(--color-stroke-static-green-01)",
+  "color-stroke-static-green-02": "var(--color-stroke-static-green-02)",
+  "color-stroke-static-green-03": "var(--color-stroke-static-green-03)",
+  "color-stroke-static-emerald-01": "var(--color-stroke-static-emerald-01)",
+  "color-stroke-static-emerald-02": "var(--color-stroke-static-emerald-02)",
+  "color-stroke-static-emerald-03": "var(--color-stroke-static-emerald-03)",
+  "color-stroke-static-teal-01": "var(--color-stroke-static-teal-01)",
+  "color-stroke-static-teal-02": "var(--color-stroke-static-teal-02)",
+  "color-stroke-static-teal-03": "var(--color-stroke-static-teal-03)",
+  "color-stroke-static-cyan-01": "var(--color-stroke-static-cyan-01)",
+  "color-stroke-static-cyan-02": "var(--color-stroke-static-cyan-02)",
+  "color-stroke-static-cyan-03": "var(--color-stroke-static-cyan-03)",
+  "color-stroke-static-sky-01": "var(--color-stroke-static-sky-01)",
+  "color-stroke-static-sky-02": "var(--color-stroke-static-sky-02)",
+  "color-stroke-static-sky-03": "var(--color-stroke-static-sky-03)",
+  "color-stroke-static-blue-01": "var(--color-stroke-static-blue-01)",
+  "color-stroke-static-blue-02": "var(--color-stroke-static-blue-02)",
+  "color-stroke-static-blue-03": "var(--color-stroke-static-blue-03)",
+  "color-stroke-static-blue-04": "var(--color-stroke-static-blue-04)",
+  "color-stroke-static-blue-05": "var(--color-stroke-static-blue-05)",
+  "color-stroke-static-indigo-01": "var(--color-stroke-static-indigo-01)",
+  "color-stroke-static-indigo-02": "var(--color-stroke-static-indigo-02)",
+  "color-stroke-static-indigo-03": "var(--color-stroke-static-indigo-03)",
+  "color-stroke-static-violet-01": "var(--color-stroke-static-violet-01)",
+  "color-stroke-static-violet-02": "var(--color-stroke-static-violet-02)",
+  "color-stroke-static-violet-03": "var(--color-stroke-static-violet-03)",
+  "color-stroke-static-purple-01": "var(--color-stroke-static-purple-01)",
+  "color-stroke-static-purple-02": "var(--color-stroke-static-purple-02)",
+  "color-stroke-static-purple-03": "var(--color-stroke-static-purple-03)",
+  "color-stroke-static-fuchsia-01": "var(--color-stroke-static-fuchsia-01)",
+  "color-stroke-static-fuchsia-02": "var(--color-stroke-static-fuchsia-02)",
+  "color-stroke-static-fuchsia-03": "var(--color-stroke-static-fuchsia-03)",
+  "color-stroke-static-pink-01": "var(--color-stroke-static-pink-01)",
+  "color-stroke-static-pink-02": "var(--color-stroke-static-pink-02)",
+  "color-stroke-static-pink-03": "var(--color-stroke-static-pink-03)",
+  "color-stroke-static-rose-01": "var(--color-stroke-static-rose-01)",
+  "color-stroke-static-rose-02": "var(--color-stroke-static-rose-02)",
+  "color-stroke-static-rose-dark": "var(--color-stroke-static-rose-dark)",
+  "color-element-inverse-default": "var(--color-element-inverse-default)",
+  "color-element-inverse-gray": "var(--color-element-inverse-gray)",
+  "color-element-inverse-disabled": "var(--color-element-inverse-disabled)",
+  "color-element-inverse-red": "var(--color-element-inverse-red)",
+  "color-element-inverse-default-alt": "var(--color-element-inverse-default-alt)",
+  "color-element-inverse-blue": "var(--color-element-inverse-blue)",
+  "color-element-inverse-orange": "var(--color-element-inverse-orange)",
+  "color-element-inverse-amber": "var(--color-element-inverse-amber)",
+  "color-element-inverse-yellow": "var(--color-element-inverse-yellow)",
+  "color-element-inverse-lime": "var(--color-element-inverse-lime)",
+  "color-element-inverse-green": "var(--color-element-inverse-green)",
+  "color-element-inverse-emerald": "var(--color-element-inverse-emerald)",
+  "color-element-inverse-teal": "var(--color-element-inverse-teal)",
+  "color-element-inverse-cyan": "var(--color-element-inverse-cyan)",
+  "color-element-inverse-sky": "var(--color-element-inverse-sky)",
+  "color-element-inverse-indigo": "var(--color-element-inverse-indigo)",
+  "color-element-inverse-violet": "var(--color-element-inverse-violet)",
+  "color-element-inverse-purple": "var(--color-element-inverse-purple)",
+  "color-element-inverse-fuchsia": "var(--color-element-inverse-fuchsia)",
+  "color-element-inverse-pink": "var(--color-element-inverse-pink)",
+  "color-element-inverse-rose": "var(--color-element-inverse-rose)",
+  "color-element-inverse-soft": "var(--color-element-inverse-soft)",
+  "color-element-static-black": "var(--color-element-static-black)",
+  "color-element-static-white": "var(--color-element-static-white)",
+  "color-element-static-red": "var(--color-element-static-red)",
+  "color-element-static-blue": "var(--color-element-static-blue)",
+  "color-element-static-orange": "var(--color-element-static-orange)",
+  "color-element-static-amber": "var(--color-element-static-amber)",
+  "color-element-static-yellow": "var(--color-element-static-yellow)",
+  "color-element-static-lime": "var(--color-element-static-lime)",
+  "color-element-static-green": "var(--color-element-static-green)",
+  "color-element-static-emerald": "var(--color-element-static-emerald)",
+  "color-element-static-teal": "var(--color-element-static-teal)",
+  "color-element-static-cyan": "var(--color-element-static-cyan)",
+  "color-element-static-sky": "var(--color-element-static-sky)",
+  "color-element-static-indigo": "var(--color-element-static-indigo)",
+  "color-element-static-violet": "var(--color-element-static-violet)",
+  "color-element-static-purple": "var(--color-element-static-purple)",
+  "color-element-static-fuchsia": "var(--color-element-static-fuchsia)",
+  "color-element-static-pink": "var(--color-element-static-pink)",
+  "color-element-static-rose": "var(--color-element-static-rose)",
+  "color-chart-inverse-slate-10": "var(--color-chart-inverse-slate-10)",
+  "color-chart-inverse-slate-11": "var(--color-chart-inverse-slate-11)",
+  "color-chart-inverse-slate-01": "var(--color-chart-inverse-slate-01)",
+  "color-chart-inverse-slate-02": "var(--color-chart-inverse-slate-02)",
+  "color-chart-inverse-slate-03": "var(--color-chart-inverse-slate-03)",
+  "color-chart-inverse-slate-04": "var(--color-chart-inverse-slate-04)",
+  "color-chart-inverse-slate-05": "var(--color-chart-inverse-slate-05)",
+  "color-chart-inverse-slate-06": "var(--color-chart-inverse-slate-06)",
+  "color-chart-inverse-slate-08": "var(--color-chart-inverse-slate-08)",
+  "color-chart-inverse-slate-09": "var(--color-chart-inverse-slate-09)",
+  "color-chart-inverse-slate-07": "var(--color-chart-inverse-slate-07)",
+  "color-chart-inverse-red-10": "var(--color-chart-inverse-red-10)",
+  "color-chart-inverse-red-11": "var(--color-chart-inverse-red-11)",
+  "color-chart-inverse-red-01": "var(--color-chart-inverse-red-01)",
+  "color-chart-inverse-red-02": "var(--color-chart-inverse-red-02)",
+  "color-chart-inverse-red-03": "var(--color-chart-inverse-red-03)",
+  "color-chart-inverse-red-04": "var(--color-chart-inverse-red-04)",
+  "color-chart-inverse-red-05": "var(--color-chart-inverse-red-05)",
+  "color-chart-inverse-red-06": "var(--color-chart-inverse-red-06)",
+  "color-chart-inverse-red-07": "var(--color-chart-inverse-red-07)",
+  "color-chart-inverse-red-08": "var(--color-chart-inverse-red-08)",
+  "color-chart-inverse-red-09": "var(--color-chart-inverse-red-09)",
+  "color-chart-inverse-orange-10": "var(--color-chart-inverse-orange-10)",
+  "color-chart-inverse-orange-11": "var(--color-chart-inverse-orange-11)",
+  "color-chart-inverse-orange-01": "var(--color-chart-inverse-orange-01)",
+  "color-chart-inverse-orange-02": "var(--color-chart-inverse-orange-02)",
+  "color-chart-inverse-orange-03": "var(--color-chart-inverse-orange-03)",
+  "color-chart-inverse-orange-04": "var(--color-chart-inverse-orange-04)",
+  "color-chart-inverse-orange-05": "var(--color-chart-inverse-orange-05)",
+  "color-chart-inverse-orange-06": "var(--color-chart-inverse-orange-06)",
+  "color-chart-inverse-orange-07": "var(--color-chart-inverse-orange-07)",
+  "color-chart-inverse-orange-08": "var(--color-chart-inverse-orange-08)",
+  "color-chart-inverse-orange-09": "var(--color-chart-inverse-orange-09)",
+  "color-chart-inverse-amber-10": "var(--color-chart-inverse-amber-10)",
+  "color-chart-inverse-amber-11": "var(--color-chart-inverse-amber-11)",
+  "color-chart-inverse-amber-01": "var(--color-chart-inverse-amber-01)",
+  "color-chart-inverse-amber-02": "var(--color-chart-inverse-amber-02)",
+  "color-chart-inverse-amber-03": "var(--color-chart-inverse-amber-03)",
+  "color-chart-inverse-amber-04": "var(--color-chart-inverse-amber-04)",
+  "color-chart-inverse-amber-05": "var(--color-chart-inverse-amber-05)",
+  "color-chart-inverse-amber-06": "var(--color-chart-inverse-amber-06)",
+  "color-chart-inverse-amber-07": "var(--color-chart-inverse-amber-07)",
+  "color-chart-inverse-amber-08": "var(--color-chart-inverse-amber-08)",
+  "color-chart-inverse-amber-09": "var(--color-chart-inverse-amber-09)",
+  "color-chart-inverse-yellow-10": "var(--color-chart-inverse-yellow-10)",
+  "color-chart-inverse-yellow-11": "var(--color-chart-inverse-yellow-11)",
+  "color-chart-inverse-yellow-01": "var(--color-chart-inverse-yellow-01)",
+  "color-chart-inverse-yellow-02": "var(--color-chart-inverse-yellow-02)",
+  "color-chart-inverse-yellow-03": "var(--color-chart-inverse-yellow-03)",
+  "color-chart-inverse-yellow-04": "var(--color-chart-inverse-yellow-04)",
+  "color-chart-inverse-yellow-05": "var(--color-chart-inverse-yellow-05)",
+  "color-chart-inverse-yellow-06": "var(--color-chart-inverse-yellow-06)",
+  "color-chart-inverse-yellow-07": "var(--color-chart-inverse-yellow-07)",
+  "color-chart-inverse-yellow-08": "var(--color-chart-inverse-yellow-08)",
+  "color-chart-inverse-yellow-09": "var(--color-chart-inverse-yellow-09)",
+  "color-chart-inverse-blue-10": "var(--color-chart-inverse-blue-10)",
+  "color-chart-inverse-blue-11": "var(--color-chart-inverse-blue-11)",
+  "color-chart-inverse-blue-01": "var(--color-chart-inverse-blue-01)",
+  "color-chart-inverse-blue-02": "var(--color-chart-inverse-blue-02)",
+  "color-chart-inverse-blue-03": "var(--color-chart-inverse-blue-03)",
+  "color-chart-inverse-blue-04": "var(--color-chart-inverse-blue-04)",
+  "color-chart-inverse-blue-05": "var(--color-chart-inverse-blue-05)",
+  "color-chart-inverse-blue-06": "var(--color-chart-inverse-blue-06)",
+  "color-chart-inverse-blue-07": "var(--color-chart-inverse-blue-07)",
+  "color-chart-inverse-blue-08": "var(--color-chart-inverse-blue-08)",
+  "color-chart-inverse-blue-09": "var(--color-chart-inverse-blue-09)",
+  "color-chart-inverse-indigo-10": "var(--color-chart-inverse-indigo-10)",
+  "color-chart-inverse-indigo-11": "var(--color-chart-inverse-indigo-11)",
+  "color-chart-inverse-indigo-01": "var(--color-chart-inverse-indigo-01)",
+  "color-chart-inverse-indigo-02": "var(--color-chart-inverse-indigo-02)",
+  "color-chart-inverse-indigo-03": "var(--color-chart-inverse-indigo-03)",
+  "color-chart-inverse-indigo-04": "var(--color-chart-inverse-indigo-04)",
+  "color-chart-inverse-indigo-05": "var(--color-chart-inverse-indigo-05)",
+  "color-chart-inverse-indigo-06": "var(--color-chart-inverse-indigo-06)",
+  "color-chart-inverse-indigo-07": "var(--color-chart-inverse-indigo-07)",
+  "color-chart-inverse-indigo-08": "var(--color-chart-inverse-indigo-08)",
+  "color-chart-inverse-indigo-09": "var(--color-chart-inverse-indigo-09)",
+  "color-chart-inverse-sky-10": "var(--color-chart-inverse-sky-10)",
+  "color-chart-inverse-sky-11": "var(--color-chart-inverse-sky-11)",
+  "color-chart-inverse-sky-01": "var(--color-chart-inverse-sky-01)",
+  "color-chart-inverse-sky-02": "var(--color-chart-inverse-sky-02)",
+  "color-chart-inverse-sky-03": "var(--color-chart-inverse-sky-03)",
+  "color-chart-inverse-sky-04": "var(--color-chart-inverse-sky-04)",
+  "color-chart-inverse-sky-05": "var(--color-chart-inverse-sky-05)",
+  "color-chart-inverse-sky-06": "var(--color-chart-inverse-sky-06)",
+  "color-chart-inverse-sky-07": "var(--color-chart-inverse-sky-07)",
+  "color-chart-inverse-sky-08": "var(--color-chart-inverse-sky-08)",
+  "color-chart-inverse-sky-09": "var(--color-chart-inverse-sky-09)",
+  "color-chart-inverse-cyan-10": "var(--color-chart-inverse-cyan-10)",
+  "color-chart-inverse-cyan-11": "var(--color-chart-inverse-cyan-11)",
+  "color-chart-inverse-cyan-01": "var(--color-chart-inverse-cyan-01)",
+  "color-chart-inverse-cyan-02": "var(--color-chart-inverse-cyan-02)",
+  "color-chart-inverse-cyan-03": "var(--color-chart-inverse-cyan-03)",
+  "color-chart-inverse-cyan-04": "var(--color-chart-inverse-cyan-04)",
+  "color-chart-inverse-cyan-05": "var(--color-chart-inverse-cyan-05)",
+  "color-chart-inverse-cyan-06": "var(--color-chart-inverse-cyan-06)",
+  "color-chart-inverse-cyan-07": "var(--color-chart-inverse-cyan-07)",
+  "color-chart-inverse-cyan-08": "var(--color-chart-inverse-cyan-08)",
+  "color-chart-inverse-cyan-09": "var(--color-chart-inverse-cyan-09)",
+  "color-chart-inverse-teal-10": "var(--color-chart-inverse-teal-10)",
+  "color-chart-inverse-teal-11": "var(--color-chart-inverse-teal-11)",
+  "color-chart-inverse-teal-01": "var(--color-chart-inverse-teal-01)",
+  "color-chart-inverse-teal-02": "var(--color-chart-inverse-teal-02)",
+  "color-chart-inverse-teal-03": "var(--color-chart-inverse-teal-03)",
+  "color-chart-inverse-teal-04": "var(--color-chart-inverse-teal-04)",
+  "color-chart-inverse-teal-05": "var(--color-chart-inverse-teal-05)",
+  "color-chart-inverse-teal-06": "var(--color-chart-inverse-teal-06)",
+  "color-chart-inverse-teal-07": "var(--color-chart-inverse-teal-07)",
+  "color-chart-inverse-teal-08": "var(--color-chart-inverse-teal-08)",
+  "color-chart-inverse-teal-09": "var(--color-chart-inverse-teal-09)",
+  "color-chart-inverse-emerald-10": "var(--color-chart-inverse-emerald-10)",
+  "color-chart-inverse-emerald-11": "var(--color-chart-inverse-emerald-11)",
+  "color-chart-inverse-emerald-01": "var(--color-chart-inverse-emerald-01)",
+  "color-chart-inverse-emerald-02": "var(--color-chart-inverse-emerald-02)",
+  "color-chart-inverse-emerald-03": "var(--color-chart-inverse-emerald-03)",
+  "color-chart-inverse-emerald-04": "var(--color-chart-inverse-emerald-04)",
+  "color-chart-inverse-emerald-05": "var(--color-chart-inverse-emerald-05)",
+  "color-chart-inverse-emerald-06": "var(--color-chart-inverse-emerald-06)",
+  "color-chart-inverse-emerald-07": "var(--color-chart-inverse-emerald-07)",
+  "color-chart-inverse-emerald-08": "var(--color-chart-inverse-emerald-08)",
+  "color-chart-inverse-emerald-09": "var(--color-chart-inverse-emerald-09)",
+  "color-chart-inverse-green-10": "var(--color-chart-inverse-green-10)",
+  "color-chart-inverse-green-11": "var(--color-chart-inverse-green-11)",
+  "color-chart-inverse-green-01": "var(--color-chart-inverse-green-01)",
+  "color-chart-inverse-green-02": "var(--color-chart-inverse-green-02)",
+  "color-chart-inverse-green-03": "var(--color-chart-inverse-green-03)",
+  "color-chart-inverse-green-04": "var(--color-chart-inverse-green-04)",
+  "color-chart-inverse-green-05": "var(--color-chart-inverse-green-05)",
+  "color-chart-inverse-green-06": "var(--color-chart-inverse-green-06)",
+  "color-chart-inverse-green-07": "var(--color-chart-inverse-green-07)",
+  "color-chart-inverse-green-08": "var(--color-chart-inverse-green-08)",
+  "color-chart-inverse-green-09": "var(--color-chart-inverse-green-09)",
+  "color-chart-inverse-lime-10": "var(--color-chart-inverse-lime-10)",
+  "color-chart-inverse-lime-11": "var(--color-chart-inverse-lime-11)",
+  "color-chart-inverse-lime-01": "var(--color-chart-inverse-lime-01)",
+  "color-chart-inverse-lime-02": "var(--color-chart-inverse-lime-02)",
+  "color-chart-inverse-lime-03": "var(--color-chart-inverse-lime-03)",
+  "color-chart-inverse-lime-04": "var(--color-chart-inverse-lime-04)",
+  "color-chart-inverse-lime-05": "var(--color-chart-inverse-lime-05)",
+  "color-chart-inverse-lime-06": "var(--color-chart-inverse-lime-06)",
+  "color-chart-inverse-lime-07": "var(--color-chart-inverse-lime-07)",
+  "color-chart-inverse-lime-08": "var(--color-chart-inverse-lime-08)",
+  "color-chart-inverse-lime-09": "var(--color-chart-inverse-lime-09)",
+  "color-chart-inverse-violet-10": "var(--color-chart-inverse-violet-10)",
+  "color-chart-inverse-violet-11": "var(--color-chart-inverse-violet-11)",
+  "color-chart-inverse-violet-01": "var(--color-chart-inverse-violet-01)",
+  "color-chart-inverse-violet-02": "var(--color-chart-inverse-violet-02)",
+  "color-chart-inverse-violet-03": "var(--color-chart-inverse-violet-03)",
+  "color-chart-inverse-violet-04": "var(--color-chart-inverse-violet-04)",
+  "color-chart-inverse-violet-05": "var(--color-chart-inverse-violet-05)",
+  "color-chart-inverse-violet-06": "var(--color-chart-inverse-violet-06)",
+  "color-chart-inverse-violet-07": "var(--color-chart-inverse-violet-07)",
+  "color-chart-inverse-violet-08": "var(--color-chart-inverse-violet-08)",
+  "color-chart-inverse-violet-09": "var(--color-chart-inverse-violet-09)",
+  "color-chart-inverse-purple-10": "var(--color-chart-inverse-purple-10)",
+  "color-chart-inverse-purple-11": "var(--color-chart-inverse-purple-11)",
+  "color-chart-inverse-purple-01": "var(--color-chart-inverse-purple-01)",
+  "color-chart-inverse-purple-02": "var(--color-chart-inverse-purple-02)",
+  "color-chart-inverse-purple-03": "var(--color-chart-inverse-purple-03)",
+  "color-chart-inverse-purple-04": "var(--color-chart-inverse-purple-04)",
+  "color-chart-inverse-purple-05": "var(--color-chart-inverse-purple-05)",
+  "color-chart-inverse-purple-06": "var(--color-chart-inverse-purple-06)",
+  "color-chart-inverse-purple-07": "var(--color-chart-inverse-purple-07)",
+  "color-chart-inverse-purple-08": "var(--color-chart-inverse-purple-08)",
+  "color-chart-inverse-purple-09": "var(--color-chart-inverse-purple-09)",
+  "color-chart-inverse-fuchsia-10": "var(--color-chart-inverse-fuchsia-10)",
+  "color-chart-inverse-fuchsia-11": "var(--color-chart-inverse-fuchsia-11)",
+  "color-chart-inverse-fuchsia-01": "var(--color-chart-inverse-fuchsia-01)",
+  "color-chart-inverse-fuchsia-02": "var(--color-chart-inverse-fuchsia-02)",
+  "color-chart-inverse-fuchsia-03": "var(--color-chart-inverse-fuchsia-03)",
+  "color-chart-inverse-fuchsia-04": "var(--color-chart-inverse-fuchsia-04)",
+  "color-chart-inverse-fuchsia-05": "var(--color-chart-inverse-fuchsia-05)",
+  "color-chart-inverse-fuchsia-06": "var(--color-chart-inverse-fuchsia-06)",
+  "color-chart-inverse-fuchsia-07": "var(--color-chart-inverse-fuchsia-07)",
+  "color-chart-inverse-fuchsia-08": "var(--color-chart-inverse-fuchsia-08)",
+  "color-chart-inverse-fuchsia-09": "var(--color-chart-inverse-fuchsia-09)",
+  "color-chart-inverse-pink-10": "var(--color-chart-inverse-pink-10)",
+  "color-chart-inverse-pink-11": "var(--color-chart-inverse-pink-11)",
+  "color-chart-inverse-pink-01": "var(--color-chart-inverse-pink-01)",
+  "color-chart-inverse-pink-02": "var(--color-chart-inverse-pink-02)",
+  "color-chart-inverse-pink-03": "var(--color-chart-inverse-pink-03)",
+  "color-chart-inverse-pink-04": "var(--color-chart-inverse-pink-04)",
+  "color-chart-inverse-pink-05": "var(--color-chart-inverse-pink-05)",
+  "color-chart-inverse-pink-06": "var(--color-chart-inverse-pink-06)",
+  "color-chart-inverse-pink-07": "var(--color-chart-inverse-pink-07)",
+  "color-chart-inverse-pink-08": "var(--color-chart-inverse-pink-08)",
+  "color-chart-inverse-pink-09": "var(--color-chart-inverse-pink-09)",
+  "color-chart-inverse-rose-10": "var(--color-chart-inverse-rose-10)",
+  "color-chart-inverse-rose-11": "var(--color-chart-inverse-rose-11)",
+  "color-chart-inverse-rose-01": "var(--color-chart-inverse-rose-01)",
+  "color-chart-inverse-rose-02": "var(--color-chart-inverse-rose-02)",
+  "color-chart-inverse-rose-03": "var(--color-chart-inverse-rose-03)",
+  "color-chart-inverse-rose-04": "var(--color-chart-inverse-rose-04)",
+  "color-chart-inverse-rose-05": "var(--color-chart-inverse-rose-05)",
+  "color-chart-inverse-rose-06": "var(--color-chart-inverse-rose-06)",
+  "color-chart-inverse-rose-07": "var(--color-chart-inverse-rose-07)",
+  "color-chart-inverse-rose-08": "var(--color-chart-inverse-rose-08)",
+  "color-chart-inverse-rose-09": "var(--color-chart-inverse-rose-09)",
+  "color-opacity-inverse-10": "var(--color-opacity-inverse-10)",
+  "color-opacity-inverse-01": "var(--color-opacity-inverse-01)",
+  "color-opacity-inverse-02": "var(--color-opacity-inverse-02)",
+  "color-opacity-inverse-03": "var(--color-opacity-inverse-03)",
+  "color-opacity-inverse-04": "var(--color-opacity-inverse-04)",
+  "color-opacity-inverse-05": "var(--color-opacity-inverse-05)",
+  "color-opacity-inverse-06": "var(--color-opacity-inverse-06)",
+  "color-opacity-inverse-07": "var(--color-opacity-inverse-07)",
+  "color-opacity-inverse-08": "var(--color-opacity-inverse-08)",
+  "color-opacity-inverse-09": "var(--color-opacity-inverse-09)",
+  "color-opacity-inverse-00": "var(--color-opacity-inverse-00)",
+  "color-opacity-static-10": "var(--color-opacity-static-10)",
+  "color-opacity-static-01": "var(--color-opacity-static-01)",
+  "color-opacity-static-02": "var(--color-opacity-static-02)",
+  "color-opacity-static-03": "var(--color-opacity-static-03)",
+  "color-opacity-static-04": "var(--color-opacity-static-04)",
+  "color-opacity-static-05": "var(--color-opacity-static-05)",
+  "color-opacity-static-06": "var(--color-opacity-static-06)",
+  "color-opacity-static-07": "var(--color-opacity-static-07)",
+  "color-opacity-static-08": "var(--color-opacity-static-08)",
+  "color-opacity-static-09": "var(--color-opacity-static-09)",
+  "color-opacity-static-00": "var(--color-opacity-static-00)",
+  "text-caption": "var(--text-caption)",
+  "text-body-sm": "var(--text-body-sm)",
+  "text-body-lg": "var(--text-body-lg)",
+  "text-title-sm": "var(--text-title-sm)",
+  "text-title-lg": "var(--text-title-lg)",
+  "text-h6": "var(--text-h6)",
+  "text-h5": "var(--text-h5)",
+  "text-h4": "var(--text-h4)",
+  "text-h3": "var(--text-h3)",
+  "text-h2": "var(--text-h2)",
+  "text-h1": "var(--text-h1)",
+  "text-bullet-point": "var(--text-bullet-point)",
+  "leading-caption": "var(--leading-caption)",
+  "leading-body-sm": "var(--leading-body-sm)",
+  "leading-body-lg": "var(--leading-body-lg)",
+  "leading-title-sm": "var(--leading-title-sm)",
+  "leading-title-lg": "var(--leading-title-lg)",
+  "leading-h6": "var(--leading-h6)",
+  "leading-h5": "var(--leading-h5)",
+  "leading-h4": "var(--leading-h4)",
+  "leading-h3": "var(--leading-h3)",
+  "leading-h2": "var(--leading-h2)",
+  "leading-h1": "var(--leading-h1)",
+  "leading-bullet-point": "var(--leading-bullet-point)",
+  "font-weight-medium": "var(--font-weight-medium)",
+  "font-weight-semibold": "var(--font-weight-semibold)",
+  "font-weight-bold": "var(--font-weight-bold)",
+  "typography-letter-spacing": "var(--typography-letter-spacing)"
+};
+function getTokenValue(tokenName) {
+  return designTokens[tokenName];
+}
+function getTokenValueWithFallback(tokenName, fallback) {
+  return `var(--${tokenName}, ${fallback})`;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ButtonGroupPrimitive,
+  CardPrimitive,
+  KeyValuePrimitive,
+  UIRenderer,
+  cn,
+  componentSchema,
+  designTokens,
+  getAvailablePrimitives,
+  getFullExample,
+  getPrimitiveSchemas,
+  getTokenValue,
+  getTokenValueWithFallback,
+  isUINode,
+  registerPrimitives
+});
+//# sourceMappingURL=index.cjs.map