@pstdio/ui 0.15.0 → 0.17.0

package/dist/{theme-25P7ij4C.js → theme-CNhnbvcE.js}

@@ -1,7 +1,7 @@
-import { defineSlotRecipe as t, defineRecipe as n, defaultConfig as a, defineLayerStyles as m, defineTextStyles as h, defineConfig as p, createSystem as f } from "@chakra-ui/react";
-import { alertAnatomy as _, dialogAnatomy as F, drawerAnatomy as y, fieldsetAnatomy as k, menuAnatomy as x, popoverAnatomy as S, tabsAnatomy as C, tooltipAnatomy as E } from "@chakra-ui/react/anatomy";
-import { progressCircleSlotRecipe as d } from "@chakra-ui/react/theme";
-const A = {
+import { defineSlotRecipe as i, defineRecipe as c, defaultConfig as d, defineLayerStyles as F, defineTextStyles as k, createSystem as C, defineConfig as E } from "@chakra-ui/react";
+import { alertAnatomy as w, colorPickerAnatomy as A, dialogAnatomy as z, drawerAnatomy as D, fieldsetAnatomy as W, menuAnatomy as R, numberInputAnatomy as B, popoverAnatomy as H, tabsAnatomy as T, timelineAnatomy as L, tooltipAnatomy as V } from "@chakra-ui/react/anatomy";
+import { progressCircleSlotRecipe as h } from "@chakra-ui/react/theme";
+const I = {
   "editor.background": ["colors.bg", "colors.bg.code"],
   "editor.foreground": ["colors.fg"],
   "editor.lineHighlightBackground": ["colors.bg.hover"],
@@ -33,42 +33,42 @@ const A = {
   "gitDecoration.deletedResourceForeground": ["colors.fg.error"],
   descriptionForeground: ["colors.fg.muted"],
   disabledForeground: ["colors.fg.subtle"],
-  border: ["colors.border", "colors.border.muted", "colors.border.subtle"]
-}, D = (e) => `colors.vscode.${e}`, w = (e) => e.replace(/^#/, ""), B = (e) => {
-  const r = (e.theme.tokenColors ?? []).flatMap((l) => (Array.isArray(l.scope) ? l.scope : l.scope ? [l.scope] : []).map((u) => ({
-    token: u,
-    ...l.settings?.foreground ? {
-      foreground: w(l.settings.foreground)
+  border: ["colors.border", "colors.border.subtle"]
+}, M = (e) => `colors.vscode.${e}`, P = (e) => e.replace(/^#/, ""), X = (e) => {
+  const l = (e.theme.tokenColors ?? []).flatMap((o) => (Array.isArray(o.scope) ? o.scope : o.scope ? [o.scope] : []).map((s) => ({
+    token: s,
+    ...o.settings?.foreground ? {
+      foreground: P(o.settings.foreground)
     } : {},
-    ...l.settings?.fontStyle ? {
-      fontStyle: l.settings.fontStyle
+    ...o.settings?.fontStyle ? {
+      fontStyle: o.settings.fontStyle
     } : {}
   })));
   return {
     base: e.mode === "dark" ? "vs-dark" : "vs",
     inherit: !0,
-    rules: r,
+    rules: l,
     colors: e.theme.colors ?? {}
   };
-}, He = (e) => {
-  const r = {}, l = e.theme.colors ?? {};
-  for (const [i, u] of Object.entries(l))
-    r[D(i)] = u;
-  for (const [i, u] of Object.entries(A)) {
-    const g = l[i];
+}, Ze = (e) => {
+  const l = {}, o = e.theme.colors ?? {};
+  for (const [n, s] of Object.entries(o))
+    l[M(n)] = s;
+  for (const [n, s] of Object.entries(I)) {
+    const g = o[n];
     if (g)
-      for (const v of u) r[v] = g;
+      for (const m of s) l[m] = g;
   }
   return {
     id: e.id,
     mode: e.mode,
-    tokens: r,
-    monacoTheme: B({
+    tokens: l,
+    monacoTheme: X({
       mode: e.mode,
       theme: e.theme
     })
   };
-}, z = {
+}, j = {
   "*::selection": {
     bg: {
       base: "bg.accent-secondary.blue-medium",
@@ -79,7 +79,7 @@ const A = {
     }
   },
   ":root": {
-    "--focus-border": "blue.border",
+    "--focus-border": "border.accent-light",
     "--separator-border": "transparent !important"
   },
   html: {
@@ -87,6 +87,9 @@ const A = {
     width: "100%",
     overflow: "hidden"
   },
+  hr: {
+    borderColor: "border.subtle"
+  },
   body: {
     height: "100%",
     width: "100%",
@@ -126,7 +129,7 @@ const A = {
       fontSize: "1.5rem"
     }
   }
-}, R = {
+}, U = {
   DEFAULT: {
     value: "#0A0D15"
   },
@@ -175,7 +178,7 @@ const A = {
   1e3: {
     value: "#000000"
   }
-}, W = {
+}, O = {
   DEFAULT: {
     value: "#5098FF"
   },
@@ -209,7 +212,7 @@ const A = {
   900: {
     value: "#002862"
   }
-}, H = {
+}, Y = {
   DEFAULT: {
     value: "#3A4BE4"
   },
@@ -246,7 +249,7 @@ const A = {
   900: {
     value: "#0A125A"
   }
-}, L = {
+}, $ = {
   DEFAULT: {
     value: "#E054EC"
   },
@@ -283,7 +286,7 @@ const A = {
   900: {
     value: "#520659"
   }
-}, T = {
+}, N = {
   DEFAULT: {
     value: "#FBD8CE"
   },
@@ -317,7 +320,7 @@ const A = {
   900: {
     value: "#522923"
   }
-}, M = {
+}, q = {
   DEFAULT: {
     value: "#FF3232"
   },
@@ -351,7 +354,7 @@ const A = {
   900: {
     value: "#580707"
   }
-}, U = {
+}, G = {
   DEFAULT: {
     value: "#F78C25"
   },
@@ -385,7 +388,7 @@ const A = {
   900: {
     value: "#552107"
   }
-}, P = {
+}, K = {
   DEFAULT: {
     value: "#FFD643"
   },
@@ -425,7 +428,7 @@ const A = {
   900: {
     value: "#644E00"
   }
-}, V = {
+}, J = {
   DEFAULT: {
     value: "#2DD665"
   },
@@ -459,7 +462,7 @@ const A = {
   900: {
     value: "#003110"
   }
-}, O = {
+}, Q = {
   DEFAULT: {
     value: "#3EECC4"
   },
@@ -493,7 +496,7 @@ const A = {
   900: {
     value: "#024F3D"
   }
-}, X = {
+}, Z = {
   DEFAULT: {
     value: "#5CDCFF"
   },
@@ -527,7 +530,7 @@ const A = {
   900: {
     value: "#005B73"
   }
-}, j = {
+}, ee = {
   DEFAULT: {
     value: "#8B47FF"
   },
@@ -561,7 +564,7 @@ const A = {
   900: {
     value: "#1E0050"
   }
-}, I = {
+}, oe = {
   DEFAULT: {
     value: "#F4F2EC"
   },
@@ -595,7 +598,7 @@ const A = {
   900: {
     value: "#E8CECE"
   }
-}, $ = {
+}, re = {
   50: {
     value: "#FCFDFC"
   },
@@ -638,30 +641,30 @@ const A = {
   950: {
     value: "#10141B"
   }
-}, Y = {
+}, le = {
   100: {
     value: "#D3ECEE"
   },
   200: {
     value: "#B3DEE2"
   }
-}, q = {
-  sand: I,
-  blacks: R,
-  blue: W,
-  sapphire: H,
-  pink: L,
-  peach: T,
-  red: M,
-  orange: U,
-  yellow: P,
-  green: V,
-  teal: O,
-  cyan: X,
-  purple: j,
-  neutral: $,
-  mint: Y
-}, G = {
+}, te = {
+  sand: oe,
+  blacks: U,
+  blue: O,
+  sapphire: Y,
+  pink: $,
+  peach: N,
+  red: q,
+  orange: G,
+  yellow: K,
+  green: J,
+  teal: Q,
+  cyan: Z,
+  purple: ee,
+  neutral: re,
+  mint: le
+}, ae = {
   display: {
     value: "'Playfair Display', serif"
   },
@@ -677,7 +680,7 @@ const A = {
   body: {
     value: "Inter, sans-serif"
   }
-}, K = {
+}, ie = {
   xs: {
     value: "0.625rem"
   },
@@ -742,7 +745,7 @@ const A = {
     value: "1.25rem"
   }
   // 20px
-}, J = {
+}, ne = {
   regular: {
     value: 400
   },
@@ -755,7 +758,7 @@ const A = {
   bold: {
     value: 700
   }
-}, o = {
+}, r = {
   // 0px
   25: "0.125rem",
   // 2px
@@ -782,80 +785,233 @@ const A = {
   900: "4.5rem",
   // 96px
   1600: "8rem"
-}, N = {
+}, se = {
   none: {
     value: "0"
   },
   "2xs": {
-    value: o[50]
+    value: r[50]
   },
   xs: {
-    value: o[100]
+    value: r[100]
+  },
+  compact: {
+    value: "0.625rem"
   },
   sm: {
-    value: o[150]
+    value: r[150]
+  },
+  comfortable: {
+    value: "0.875rem"
   },
   md: {
-    value: o[200]
+    value: r[200]
   },
   lg: {
-    value: o[300]
+    value: r[300]
   },
   xl: {
-    value: o[400]
+    value: r[400]
   },
   "2xl": {
-    value: o[500]
+    value: r[500]
   },
   "3xl": {
-    value: o[600]
+    value: r[600]
   },
   "3.5xl": {
-    value: o[700]
+    value: r[700]
   },
   "4xl": {
-    value: o[800]
+    value: r[800]
   },
   "4.5xl": {
-    value: o[900]
+    value: r[900]
   },
   "5xl": {
-    value: o[1600]
+    value: r[1600]
   }
-}, Q = {
+}, de = {
+  "collection-row": {
+    value: "2.125rem"
+  },
+  "filter-pill": {
+    value: r[300]
+  },
+  "view-bar": {
+    value: r[500]
+  },
+  "view-subheader": {
+    value: "2.25rem"
+  }
+}, ce = {
   none: {
     value: "0"
   },
   "2xs": {
-    value: o[25]
+    value: r[25]
   },
   xs: {
-    value: o[50]
+    value: r[50]
+  },
+  compact: {
+    value: "0.375rem"
   },
   sm: {
-    value: o[100]
+    value: r[100]
   },
   md: {
-    value: o[150]
+    value: r[150]
   },
   lg: {
-    value: o[200]
+    value: r[200]
   },
   xl: {
-    value: o[400]
+    value: r[400]
   },
   full: {
     value: "100%"
   }
-}, Z = t({
-  slots: _.keys(),
+}, ue = i({
+  slots: w.keys(),
   base: {
     root: {
-      pt: "xs",
-      pb: "xs"
+      px: "xs",
+      py: "2xs",
+      gap: "2xs",
+      borderRadius: "xs",
+      alignItems: "flex-start",
+      minH: "auto"
+    },
+    indicator: {
+      mt: "0.0625rem"
+    },
+    content: {
+      gap: "0"
+    },
+    title: {
+      textStyle: "label/S/medium"
+    },
+    description: {
+      textStyle: "paragraph/S/regular"
+    }
+  },
+  compoundVariants: [{
+    status: "info",
+    variant: "subtle",
+    css: {
+      root: {
+        bg: "bg.info",
+        color: "fg.info"
+      },
+      indicator: {
+        color: "fg.info"
+      }
+    }
+  }, {
+    status: "success",
+    variant: "subtle",
+    css: {
+      root: {
+        bg: "bg.success",
+        color: "fg.success"
+      },
+      indicator: {
+        color: "fg.success"
+      }
+    }
+  }, {
+    status: "warning",
+    variant: "subtle",
+    css: {
+      root: {
+        bg: "bg.warning",
+        color: "fg.warning"
+      },
+      indicator: {
+        color: "fg.warning"
+      }
+    }
+  }, {
+    status: "error",
+    variant: "subtle",
+    css: {
+      root: {
+        bg: "bg.error",
+        color: "fg.error"
+      },
+      indicator: {
+        color: "fg.error"
+      }
+    }
+  }]
+}), be = c({
+  className: "chakra-badge",
+  base: {
+    display: "inline-flex",
+    alignItems: "center",
+    borderRadius: "9999px",
+    gap: "1",
+    fontWeight: "medium",
+    fontVariantNumeric: "tabular-nums",
+    whiteSpace: "nowrap",
+    userSelect: "none"
+  },
+  variants: {
+    variant: {
+      solid: {
+        bg: "colorPalette.solid",
+        color: "colorPalette.contrast"
+      },
+      subtle: {
+        bg: "colorPalette.subtle",
+        color: "colorPalette.fg"
+      },
+      number: {
+        bg: "colorPalette.subtle",
+        color: "colorPalette.fg",
+        borderRadius: "2xs",
+        justifyContent: "center"
+      },
+      outline: {
+        color: "colorPalette.fg",
+        "--outline-shadow-legacy": "colors.colorPalette.muted",
+        "--outline-shadow": "colors.colorPalette.border",
+        shadow: "inset 0 0 0px 1px var(--shadow-color)",
+        shadowColor: "var(--outline-shadow, var(--outline-shadow-legacy))"
+      },
+      plain: {
+        color: "colorPalette.fg"
+      }
+    },
+    size: {
+      xs: {
+        textStyle: "2xs",
+        px: "1",
+        minH: "4"
+      },
+      sm: {
+        textStyle: "xs",
+        px: "1.5",
+        minH: "5"
+      },
+      md: {
+        textStyle: "sm",
+        px: "2",
+        minH: "6"
+      },
+      lg: {
+        textStyle: "sm",
+        px: "2.5",
+        minH: "7"
+      }
     }
+  },
+  defaultVariants: {
+    variant: "subtle",
+    size: "sm"
   }
-}), ee = n({
+}), ge = c({
   base: {
     borderRadius: "xs",
     transition: "all 0.1s ease-in-out",
@@ -863,7 +1019,7 @@ const A = {
     fontWeight: "500",
     color: "fg",
     bg: "bg",
-    borderColor: "border.muted",
+    borderColor: "border",
     _disabled: {
       opacity: 1,
       color: "fg.subtle",
@@ -886,7 +1042,6 @@ const A = {
       "display-primary": {
         bg: "blacks.900",
         color: "fg.inverted",
-        borderRadius: "xl",
         outline: "none",
         border: "none",
         _hover: {
@@ -896,7 +1051,6 @@ const A = {
       "display-outline": {
         bg: "transparent",
         color: "fg",
-        borderRadius: "xl",
         border: "2px solid {fg}",
         _hover: {
           bg: "bg.hover"
@@ -908,7 +1062,6 @@ const A = {
       "display-ghost": {
         bg: "transparent",
         color: "fg",
-        borderRadius: "xl",
         _hover: {
           bg: "bg.hover"
         },
@@ -920,7 +1073,6 @@ const A = {
         bg: "transparent",
         color: "fg",
         border: "none",
-        borderRadius: "xl",
         _hover: {
           textDecoration: "underline"
         },
@@ -939,26 +1091,21 @@ const A = {
           bg: "bg.button.primary.pressed"
         }
       },
-      secondary: {
-        color: "fg",
-        bg: "bg",
-        border: "2px solid border.muted",
+      destructive: {
+        color: "blacks.50",
+        bg: "red.500",
+        border: "none",
         _hover: {
-          bg: "bg.hover"
+          bg: "red.600"
         },
         _active: {
-          bg: "bg.active"
-        },
-        _disabled: {
-          opacity: 1,
-          color: "fg.subtle",
-          borderColor: "border.muted"
+          bg: "red.700"
         }
       },
       outline: {
         color: "fg",
         bg: "bg",
-        border: "border.muted",
+        border: "border",
         _hover: {
           bg: "bg.hover"
         },
@@ -971,7 +1118,7 @@ const A = {
         _disabled: {
           opacity: 1,
           color: "fg.subtle",
-          borderColor: "border.muted"
+          borderColor: "border"
         }
       },
       ghost: {
@@ -987,6 +1134,12 @@ const A = {
         _expanded: {
           bg: "bg.active"
         },
+        "&[aria-pressed=true]": {
+          bg: "bg.active",
+          _hover: {
+            bg: "bg.active"
+          }
+        },
         _disabled: {
           bg: "transparent",
           _hover: {
@@ -996,8 +1149,8 @@ const A = {
       },
       subtle: {
         color: "fg",
-        bg: "bg.subtle",
-        border: "none",
+        bg: "bg.muted",
+        border: "1px solid {border}",
         _hover: {
           bg: "bg.hover"
         },
@@ -1011,6 +1164,7 @@ const A = {
           opacity: 1,
           color: "fg.subtle",
           bg: "bg.muted",
+          borderColor: "border",
           _hover: {
             bg: "bg.muted"
           }
@@ -1018,8 +1172,21 @@ const A = {
       }
     },
     size: {
+      "2xs": {
+        px: "0.375rem",
+        h: "1.5rem",
+        minW: "1.5rem",
+        textStyle: "label/XS",
+        _icon: {
+          width: "0.75rem",
+          height: "0.75rem"
+        }
+      },
       xs: {
+        px: "0.5rem",
         h: "1.75rem",
+        minW: "1.75rem",
+        textStyle: "label/XS",
         _icon: {
           width: "0.875rem",
           height: "0.875rem"
@@ -1049,23 +1216,117 @@ const A = {
     size: "sm",
     variant: "outline"
   }
-}), le = t({
-  slots: F.keys(),
+}), u = "border.accent-light", me = i({
+  slots: A.keys(),
+  base: {
+    control: {
+      display: "flex",
+      alignItems: "center",
+      width: "full",
+      minW: "0",
+      h: "2rem",
+      bg: "bg",
+      color: "fg",
+      border: "1px solid",
+      borderColor: "border",
+      borderRadius: "xs",
+      overflow: "hidden",
+      transition: "border-color 0.2s ease-in-out",
+      outline: "none",
+      boxShadow: "none",
+      _hover: {
+        borderColor: u
+      },
+      _active: {
+        borderColor: u
+      },
+      _focusWithin: {
+        borderColor: u,
+        boxShadow: "none"
+      },
+      "&:is(:hover, [data-hover])": {
+        borderColor: u
+      },
+      "&:is(:active, [data-active])": {
+        borderColor: u
+      },
+      "& [data-scope=color-picker][data-part=trigger]": {
+        border: "0",
+        borderInlineStartWidth: "0",
+        boxShadow: "none"
+      }
+    },
+    channelInput: {
+      h: "full",
+      minW: "0",
+      flex: "1",
+      px: "sm",
+      bg: "transparent",
+      color: "fg",
+      border: "0",
+      borderInlineEndWidth: "0",
+      borderRadius: "0",
+      outline: "none",
+      boxShadow: "none",
+      textStyle: "label/S/regular",
+      _focusVisible: {
+        outline: "none",
+        boxShadow: "none"
+      }
+    },
+    trigger: {
+      h: "full",
+      minH: "0",
+      maxH: "full",
+      minW: "2rem",
+      alignSelf: "stretch",
+      px: "xs",
+      bg: "transparent",
+      color: "fg",
+      border: "0",
+      borderInlineStartWidth: "0",
+      borderRadius: "0",
+      boxShadow: "none",
+      _hover: {
+        bg: "bg.hover"
+      }
+    },
+    content: {
+      p: "sm",
+      bg: "bg",
+      color: "fg",
+      borderWidth: "0",
+      borderRadius: "xs"
+    },
+    swatch: {
+      borderRadius: "2xs",
+      borderWidth: "0"
+    },
+    swatchTrigger: {
+      borderRadius: "2xs",
+      _focusVisible: {
+        outline: "1px solid",
+        outlineColor: u
+      }
+    }
+  }
+}), ve = i({
+  slots: z.keys(),
   base: {
     content: {
       bg: "bg",
       borderRadius: "xs",
       borderWidth: "1px",
-      borderColor: "border.muted",
+      borderColor: "border.subtle",
       overflow: "hidden"
     }
   }
-}), oe = n({
+}), he = c({
   base: {
-    borderColor: "border"
+    borderColor: "border.subtle"
   }
-}), re = t({
-  slots: y.keys(),
+}), pe = i({
+  slots: D.keys(),
   base: {
     header: {
       fontWeight: "medium",
@@ -1076,7 +1337,7 @@ const A = {
       bg: "bg"
     }
   }
-}), te = t({
+}), fe = i({
   slots: ["preview", "input", "textarea"],
   base: {
     preview: {
@@ -1175,46 +1436,119 @@ const A = {
       }
     }
   }
-}), ae = t({
-  slots: k.keys(),
+}), xe = i({
+  slots: W.keys(),
   base: {
     legend: {
       mb: "2xs"
     }
   }
-}), ie = n({
+}), t = "border.accent-light", _e = c({
   base: {
     px: "sm",
     borderRadius: "xs",
     transition: "border-color 0.2s ease-in-out",
     bg: "bg",
     color: "fg",
-    borderColor: "border.muted",
+    border: "1px solid",
+    borderColor: "border",
+    outline: "none",
+    boxShadow: "none",
+    "--focus-color": "var(--chakra-colors-border-accent-light)",
+    "--focus-ring-style": "none",
     _hover: {
-      borderColor: "border"
+      borderColor: t
     },
     _active: {
-      borderColor: "blue.border"
+      borderColor: t
     },
     _focus: {
-      borderColor: "blue.border"
+      borderColor: t,
+      outline: "none",
+      boxShadow: "none"
     },
     _focusVisible: {
-      borderColor: "blue.border",
-      outline: "none"
+      borderColor: t,
+      outline: "none",
+      boxShadow: "none"
     },
     _placeholder: {
       color: "fg.subtle"
+    },
+    "&:is(:hover, [data-hover])": {
+      borderColor: t
+    },
+    "&:is(:active, [data-active])": {
+      borderColor: t
     }
   },
   variants: {
+    variant: {
+      outline: {
+        bg: "bg",
+        border: "1px solid",
+        borderColor: "border",
+        outline: "none",
+        boxShadow: "none",
+        "--focus-color": "var(--chakra-colors-border-accent-light)",
+        "--focus-ring-style": "none",
+        _hover: {
+          borderColor: t
+        },
+        _active: {
+          borderColor: t
+        },
+        _focus: {
+          borderColor: t,
+          outline: "none",
+          boxShadow: "none"
+        },
+        _focusVisible: {
+          borderColor: t,
+          outline: "none",
+          boxShadow: "none"
+        },
+        "&:is(:hover, [data-hover])": {
+          borderColor: t
+        },
+        "&:is(:active, [data-active])": {
+          borderColor: t
+        }
+      }
+    },
     size: {
+      "2xs": {
+        h: "1.5rem",
+        px: "2xs",
+        textStyle: "label/XS"
+      },
+      xs: {
+        h: "1.75rem",
+        px: "xs",
+        textStyle: "label/XS"
+      },
       sm: {
-        h: "2rem"
+        h: "2rem",
+        px: "sm",
+        textStyle: "label/S/regular"
+      },
+      md: {
+        h: "2.5rem",
+        px: "sm",
+        textStyle: "label/M/regular"
+      },
+      lg: {
+        h: "3rem",
+        px: "md",
+        textStyle: "label/M/regular"
       }
     }
+  },
+  defaultVariants: {
+    size: "sm",
+    variant: "outline"
   }
-}), se = n({
+}), ye = c({
   base: {
     display: "inline-flex",
     alignItems: "center",
@@ -1277,8 +1611,8 @@ const A = {
     size: "md",
     variant: "raised"
   }
-}), ne = t({
-  slots: x.keys(),
+}), Se = i({
+  slots: R.keys(),
   base: {
     itemGroupLabel: {
       ml: "{2xs}",
@@ -1287,12 +1621,25 @@ const A = {
       color: "fg.muted"
     },
     item: {
-      bg: "bg.menu-item.default",
+      width: "full",
+      minWidth: "0",
+      maxWidth: "full",
+      minH: "1.75rem",
+      h: "auto",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: "xs",
+      px: "sm",
+      py: "2xs",
+      borderRadius: "0",
+      bg: "transparent",
       color: "fg.menu-item.default",
-      textStyle: "label/M/regular",
+      textStyle: "label/S/regular",
       cursor: "pointer",
-      px: "0",
-      h: "auto",
+      overflow: "hidden",
+      textAlign: "left",
+      textDecoration: "none",
       _hover: {
         bg: "bg.menu-item.hover"
       },
@@ -1302,17 +1649,36 @@ const A = {
       _focusVisible: {
         bg: "bg.menu-item.focus"
       },
+      _checked: {
+        bg: "bg.menu-item.selected",
+        color: "fg"
+      },
+      _selected: {
+        bg: "bg.menu-item.selected",
+        color: "fg"
+      },
+      "&[aria-checked=true]": {
+        bg: "bg.menu-item.selected",
+        color: "fg"
+      },
       _disabled: {
-        cursor: "not-allowed"
+        cursor: "not-allowed",
+        color: "fg.muted"
       }
     },
+    itemIndicator: {
+      color: "fg"
+    },
     separator: {
-      my: "2xs",
-      borderColor: "border.muted"
+      my: "0",
+      borderColor: "border.subtle"
     },
     content: {
       display: "flex",
       flexDirection: "column",
+      width: "17.5rem",
+      minWidth: "17.5rem",
+      maxWidth: "17.5rem",
       gap: "0",
       borderRadius: "xs",
       p: "0",
@@ -1321,71 +1687,284 @@ const A = {
       bg: "bg",
       borderWidth: "1px",
       borderStyle: "solid",
-      borderColor: "border.muted",
+      borderColor: "border",
       zIndex: "dropdown",
       textStyle: "label/M/regular"
     }
   }
-}), ue = t({
-  slots: S.keys(),
+}), Fe = "var(--chakra-colors-border)", v = "var(--chakra-colors-border-accent-light)", ke = i({
+  slots: B.keys(),
   base: {
-    positioner: {
-      _focus: {
-        outline: "none"
+    root: {
+      position: "relative",
+      zIndex: "0",
+      isolation: "isolate",
+      boxShadow: "none",
+      "--number-input-border-color": Fe,
+      "&:is(:hover, [data-hover])": {
+        "--number-input-border-color": v
+      },
+      "&:is(:active, [data-active])": {
+        "--number-input-border-color": v
+      },
+      "&:focus-within": {
+        "--number-input-border-color": v
       }
     },
-    closeTrigger: {
-      textStyle: "label/M/medium",
-      color: "fg"
-    },
-    arrow: {
-      bg: "background-primary !important",
-      borderColor: "button-secondary-stroke"
-    },
-    content: {
-      gap: "8px",
-      py: "xs",
+    input: {
+      px: "sm",
+      pe: "calc(var(--stepper-width) + 0.5rem)",
       borderRadius: "xs",
+      transition: "border-color 0.2s ease-in-out",
       bg: "bg",
+      color: "fg",
       borderWidth: "1px",
       borderStyle: "solid",
-      borderColor: "border.muted",
+      borderColor: "var(--number-input-border-color)",
+      outline: "none",
+      boxShadow: "none",
+      "--focus-ring-color": "var(--number-input-border-color)",
+      "--focus-ring-style": "none",
+      _hover: {
+        borderColor: "var(--number-input-border-color)"
+      },
+      _active: {
+        borderColor: "var(--number-input-border-color)"
+      },
       _focus: {
-        outline: "none"
+        borderColor: "var(--number-input-border-color)",
+        outline: "none",
+        boxShadow: "none"
+      },
+      _focusVisible: {
+        borderColor: "var(--number-input-border-color)",
+        outline: "none",
+        boxShadow: "none"
+      },
+      _placeholder: {
+        color: "fg.subtle"
+      },
+      "&:is(:hover, [data-hover])": {
+        borderColor: "var(--number-input-border-color)"
+      },
+      "&:is(:active, [data-active])": {
+        borderColor: "var(--number-input-border-color)"
+      },
+      "&:not([data-invalid], [aria-invalid='true'], [data-state='invalid'])": {
+        borderColor: "var(--number-input-border-color)"
       }
     },
-    title: {
-      borderBottom: "none",
-      textStyle: "label/M/medium",
-      bg: "bg"
+    control: {
+      display: "flex",
+      flexDirection: "column",
+      position: "absolute",
+      top: "0",
+      insetEnd: "0",
+      margin: "1px",
+      width: "var(--stepper-width)",
+      height: "calc(100% - 2px)",
+      zIndex: "1",
+      borderStartWidth: "1px",
+      borderStartColor: "var(--number-input-border-color)",
+      borderColor: "var(--number-input-border-color)",
+      divideY: "1px",
+      overflow: "hidden",
+      boxShadow: "none",
+      "& > :not(style, [hidden]) ~ :not(style, [hidden])": {
+        borderColor: "var(--number-input-border-color)"
+      }
     },
-    body: {
-      textStyle: "primary"
+    incrementTrigger: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flex: "1",
+      minH: "0",
+      lineHeight: "1",
+      borderTopEndRadius: "xs",
+      color: "fg.muted",
+      _hover: {
+        bg: "bg.hover",
+        color: "fg"
+      }
     },
-    footer: {}
+    decrementTrigger: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flex: "1",
+      minH: "0",
+      lineHeight: "1",
+      borderBottomEndRadius: "xs",
+      color: "fg.muted",
+      _hover: {
+        bg: "bg.hover",
+        color: "fg"
+      }
+    }
   },
   variants: {
     variant: {
-      responsive: {
-        content: {
-          width: "unset"
+      outline: {
+        input: {
+          bg: "bg",
+          borderWidth: "1px",
+          borderStyle: "solid",
+          borderColor: "var(--number-input-border-color)",
+          outline: "none",
+          boxShadow: "none",
+          "--focus-ring-color": "var(--number-input-border-color)",
+          "--focus-ring-style": "none",
+          _hover: {
+            borderColor: "var(--number-input-border-color)"
+          },
+          _active: {
+            borderColor: "var(--number-input-border-color)"
+          },
+          _focus: {
+            borderColor: "var(--number-input-border-color)",
+            outline: "none",
+            boxShadow: "none"
+          },
+          _focusVisible: {
+            borderColor: "var(--number-input-border-color)",
+            outline: "none",
+            boxShadow: "none"
+          },
+          "&:is(:hover, [data-hover])": {
+            borderColor: "var(--number-input-border-color)"
+          },
+          "&:is(:active, [data-active])": {
+            borderColor: "var(--number-input-border-color)"
+          },
+          "&:not([data-invalid], [aria-invalid='true'], [data-state='invalid'])": {
+            borderColor: "var(--number-input-border-color)"
+          }
         }
       }
     },
     size: {
-      "2xl": {
-        content: {
-          width: "2xl"
+      "2xs": {
+        input: {
+          h: "1.5rem",
+          px: "2xs",
+          textStyle: "label/XS"
+        },
+        control: {
+          "--stepper-width": "1.25rem",
+          fontSize: "0.625rem"
         }
-      }
+      },
+      xs: {
+        input: {
+          h: "1.75rem",
+          px: "xs",
+          textStyle: "label/XS"
+        },
+        control: {
+          "--stepper-width": "1.5rem",
+          fontSize: "0.75rem"
+        }
+      },
+      sm: {
+        input: {
+          h: "2rem",
+          px: "sm",
+          textStyle: "label/S/regular"
+        },
+        control: {
+          "--stepper-width": "1.75rem",
+          fontSize: "0.75rem"
+        }
+      },
+      md: {
+        input: {
+          h: "2.5rem",
+          px: "sm",
+          textStyle: "label/M/regular"
+        },
+        control: {
+          "--stepper-width": "2rem",
+          fontSize: "0.875rem"
+        }
+      },
+      lg: {
+        input: {
+          h: "3rem",
+          px: "md",
+          textStyle: "label/M/regular"
+        },
+        control: {
+          "--stepper-width": "2.25rem",
+          fontSize: "0.875rem"
+        }
+      }
     }
+  },
+  defaultVariants: {
+    size: "sm",
+    variant: "outline"
   }
-}), de = d.variants?.size ?? {}, ce = {
-  ...d,
+}), Ce = i({
+  slots: H.keys(),
+  base: {
+    positioner: {
+      _focus: {
+        outline: "none"
+      }
+    },
+    closeTrigger: {
+      textStyle: "label/M/medium",
+      color: "fg"
+    },
+    arrow: {
+      bg: "background-primary !important",
+      borderColor: "button-secondary-stroke"
+    },
+    content: {
+      gap: "8px",
+      py: "xs",
+      borderRadius: "xs",
+      bg: "bg",
+      borderWidth: "1px",
+      borderStyle: "solid",
+      borderColor: "border",
+      _focus: {
+        outline: "none"
+      }
+    },
+    title: {
+      borderBottom: "none",
+      textStyle: "label/M/medium",
+      bg: "bg"
+    },
+    body: {
+      textStyle: "primary"
+    },
+    footer: {}
+  },
   variants: {
-    ...d.variants,
+    variant: {
+      responsive: {
+        content: {
+          width: "unset"
+        }
+      }
+    },
+    size: {
+      "2xl": {
+        content: {
+          width: "2xl"
+        }
+      }
+    }
+  }
+}), Ee = h.variants?.size ?? {}, we = {
+  ...h,
+  variants: {
+    ...h.variants,
     size: {
-      ...de,
+      ...Ee,
       "2xs": {
         circle: {
           "--size": "14px",
@@ -1397,143 +1976,446 @@ const A = {
       }
     }
   }
-}, ge = n({
+}, Ae = c({
   base: {
     "--start-color": "fg",
     "--end-color": "fg.muted"
   }
-}), be = t({
-  slots: C.keys(),
+}), ze = i({
+  slots: T.keys(),
   base: {
+    root: {
+      "--tabs-trigger-radius": "radii.xs"
+    },
+    list: {
+      gap: "2xs",
+      alignItems: "center",
+      justifyContent: "flex-start",
+      borderBottom: "0",
+      _horizontal: {
+        _before: {
+          borderBottomWidth: "0"
+        }
+      }
+    },
     trigger: {
-      borderRadius: "0"
+      minW: "0",
+      flexShrink: "0",
+      py: "0",
+      borderRadius: "xs",
+      borderWidth: "1px",
+      borderColor: "border",
+      color: "fg.muted",
+      bg: "transparent",
+      _selected: {
+        color: "fg",
+        bg: "bg.muted",
+        borderColor: "border"
+      },
+      _hover: {
+        bg: "bg.hover",
+        borderColor: "border",
+        color: "fg"
+      },
+      _disabled: {
+        color: "fg.subtle",
+        borderColor: "border",
+        bg: "transparent",
+        _hover: {
+          color: "fg.subtle",
+          borderColor: "border",
+          bg: "transparent"
+        }
+      }
     }
   },
   variants: {
-    variant: {
-      subtle: {
+    size: {
+      xs: {
         trigger: {
-          color: "fg.muted",
-          bg: "transparent",
-          _hover: {
-            bg: "bg.hover",
-            color: "fg"
-          },
-          _selected: {
-            bg: "bg.muted",
-            color: "fg"
+          h: "1.25rem",
+          px: "xs",
+          gap: "2xs",
+          textStyle: "label/XS/medium",
+          _icon: {
+            width: "0.75rem",
+            height: "0.75rem"
           }
         }
       },
-      // Folder-style tabs: only the selected tab is outlined and it merges with
-      // the panel content below via a transparent bottom border. Adapts Chakra's
-      // built-in `outline` variant for use inside a workbench header — the
-      // header paints its own full-width bottom line, so the variant's own
-      // underline and the negative margins that overlap it are suppressed.
-      outline: {
-        list: {
-          border: "0",
-          _horizontal: {
-            _before: {
-              borderBottomWidth: "0"
-            }
+      sm: {
+        trigger: {
+          h: "1.5rem",
+          px: "xs",
+          gap: "2xs",
+          textStyle: "label/XS/medium",
+          _icon: {
+            width: "0.875rem",
+            height: "0.875rem"
           }
-        },
+        }
+      },
+      md: {
+        trigger: {
+          h: "1.75rem",
+          px: "0.5rem",
+          gap: "xs",
+          textStyle: "label/S/medium",
+          _icon: {
+            width: "0.875rem",
+            height: "0.875rem"
+          }
+        }
+      }
+    },
+    variant: {
+      subtle: {
         trigger: {
+          borderRadius: "var(--tabs-trigger-radius)",
           color: "fg.muted",
           bg: "transparent",
-          borderWidth: "1px",
-          borderColor: "transparent",
           _selected: {
             color: "fg",
-            borderColor: "border.muted",
-            borderBottomColor: "transparent"
+            bg: "bg.muted",
+            borderColor: "border"
+          },
+          _hover: {
+            bg: "bg.hover",
+            borderColor: "border",
+            color: "fg"
           },
-          _horizontal: {
-            borderTopRadius: "0",
-            marginBottom: "0",
-            marginEnd: "0",
-            _selected: {
-              borderColor: "border.muted",
-              borderBottomColor: "transparent"
+          _disabled: {
+            bg: "transparent",
+            color: "fg.subtle",
+            borderColor: "border",
+            _hover: {
+              bg: "transparent",
+              color: "fg.subtle",
+              borderColor: "border"
             }
           }
         }
       }
     }
+  },
+  defaultVariants: {
+    size: "xs",
+    variant: "subtle"
   }
-}), ve = n({
+}), a = "border.accent-light", De = c({
   base: {
     paddingX: "sm",
     paddingY: "xs",
     opacity: "1",
     outline: "none",
+    boxShadow: "none",
     color: "fg",
     border: "1px solid",
     borderRadius: "xs",
     transition: "border-color 0.2s ease-in-out",
-    borderColor: "border.muted",
+    borderColor: "border",
+    "--focus-color": "var(--chakra-colors-border-accent-light)",
+    "--focus-ring-style": "none",
     _hover: {
-      borderColor: "border"
+      borderColor: a
     },
     _active: {
-      borderColor: "blue.border"
+      borderColor: a
     },
     _focus: {
-      borderColor: "blue.border"
+      borderColor: a,
+      outline: "none",
+      boxShadow: "none"
     },
     _focusVisible: {
-      borderColor: "blue.border"
+      borderColor: a,
+      outline: "none",
+      boxShadow: "none"
     },
     _placeholder: {
       color: "fg.subtle"
+    },
+    "&:is(:hover, [data-hover])": {
+      borderColor: a
+    },
+    "&:is(:active, [data-active])": {
+      borderColor: a
+    }
+  },
+  variants: {
+    variant: {
+      outline: {
+        bg: "bg",
+        border: "1px solid",
+        borderColor: "border",
+        outline: "none",
+        boxShadow: "none",
+        "--focus-color": "var(--chakra-colors-border-accent-light)",
+        "--focus-ring-style": "none",
+        _hover: {
+          borderColor: a
+        },
+        _active: {
+          borderColor: a
+        },
+        _focus: {
+          borderColor: a,
+          outline: "none",
+          boxShadow: "none"
+        },
+        _focusVisible: {
+          borderColor: a,
+          outline: "none",
+          boxShadow: "none"
+        },
+        "&:is(:hover, [data-hover])": {
+          borderColor: a
+        },
+        "&:is(:active, [data-active])": {
+          borderColor: a
+        }
+      }
+    },
+    size: {
+      "2xs": {
+        paddingX: "2xs",
+        paddingY: "2xs",
+        textStyle: "label/XS"
+      },
+      xs: {
+        paddingX: "xs",
+        paddingY: "2xs",
+        textStyle: "label/XS"
+      },
+      sm: {
+        paddingX: "sm",
+        paddingY: "xs",
+        textStyle: "label/S/regular"
+      },
+      md: {
+        paddingX: "sm",
+        paddingY: "xs",
+        textStyle: "label/M/regular"
+      },
+      lg: {
+        paddingX: "md",
+        paddingY: "sm",
+        textStyle: "label/M/regular"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "sm",
+    variant: "outline"
+  }
+}), We = i({
+  slots: L.keys(),
+  base: {
+    root: {
+      display: "flex",
+      flexDirection: "column",
+      width: "full",
+      "--timeline-thickness": "1px",
+      "--timeline-gutter": "4px"
+    },
+    item: {
+      "--timeline-content-gap": "spacing.6",
+      display: "flex",
+      position: "relative",
+      alignItems: "flex-start",
+      flexShrink: 0,
+      gap: "4",
+      _last: {
+        "--timeline-content-gap": "0"
+      }
+    },
+    separator: {
+      display: "var(--timeline-separator-display)",
+      position: "absolute",
+      borderStartWidth: "var(--timeline-thickness)",
+      ms: "calc(-1 * var(--timeline-thickness) / 2)",
+      insetInlineStart: "calc(var(--timeline-indicator-size) / 2)",
+      insetBlock: "0",
+      borderColor: "border.subtle"
+    },
+    indicator: {
+      outline: "2px solid {colors.bg}",
+      position: "relative",
+      flexShrink: "0",
+      boxSize: "var(--timeline-indicator-size)",
+      fontSize: "var(--timeline-font-size)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      borderRadius: "full",
+      fontWeight: "medium",
+      bg: "bg",
+      color: "fg"
+    },
+    connector: {
+      alignSelf: "stretch",
+      position: "relative"
+    },
+    content: {
+      pb: "var(--timeline-content-gap)",
+      display: "flex",
+      flexDirection: "column",
+      width: "full",
+      gap: "2"
+    },
+    title: {
+      display: "flex",
+      fontWeight: "medium",
+      flexWrap: "wrap",
+      gap: "1.5",
+      alignItems: "center",
+      mt: "var(--timeline-margin)"
+    },
+    description: {
+      color: "fg.muted",
+      textStyle: "xs"
     }
+  },
+  variants: {
+    variant: {
+      solid: {},
+      subtle: {},
+      outline: {
+        indicator: {
+          borderWidth: "1px",
+          borderColor: "border.subtle"
+        }
+      },
+      plain: {
+        indicator: {
+          bg: "transparent",
+          color: "fg"
+        }
+      }
+    },
+    showLastSeparator: {
+      true: {
+        item: {
+          _last: {
+            "--timeline-separator-display": "initial"
+          }
+        }
+      },
+      false: {
+        item: {
+          _last: {
+            "--timeline-separator-display": "none"
+          }
+        }
+      }
+    },
+    size: {
+      sm: {
+        root: {
+          "--timeline-indicator-size": "sizes.4",
+          "--timeline-font-size": "fontSizes.2xs"
+        },
+        title: {
+          textStyle: "xs"
+        }
+      },
+      md: {
+        root: {
+          "--timeline-indicator-size": "sizes.5",
+          "--timeline-font-size": "fontSizes.xs"
+        },
+        title: {
+          textStyle: "sm"
+        }
+      },
+      lg: {
+        root: {
+          "--timeline-indicator-size": "sizes.6",
+          "--timeline-font-size": "fontSizes.xs"
+        },
+        title: {
+          mt: "0.5",
+          textStyle: "sm"
+        }
+      },
+      xl: {
+        root: {
+          "--timeline-indicator-size": "sizes.8",
+          "--timeline-font-size": "fontSizes.sm"
+        },
+        title: {
+          mt: "1.5",
+          textStyle: "sm"
+        }
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    variant: "solid",
+    showLastSeparator: !1
   }
-}), me = t({
-  slots: E.keys(),
+}), Re = i({
+  slots: V.keys(),
   base: {
     content: {
       bg: "bg.inverted",
       borderRadius: "xs",
       color: "fg.inverted"
-    },
-    arrow: {
-      bg: "bg.inverted"
     }
   }
-}), he = /* @__PURE__ */ new Set(["boxShadow", "boxShadowColor", "textShadow"]), c = /shadow/i, pe = (e) => {
-  if (!c.test(e)) return e;
-  const r = e.split(",").map((l) => l.trim()).filter((l) => !c.test(l));
-  if (r.length !== 0)
-    return r.join(", ");
-}, s = (e) => Array.isArray(e) ? e.map(s).filter((r) => r !== void 0) : typeof e == "string" ? pe(e) : !e || typeof e != "object" ? e : Object.fromEntries(Object.entries(e).flatMap(([r, l]) => {
-  if (he.has(r) || c.test(r)) return [];
-  const i = s(l);
-  return i === void 0 ? [] : [[r, i]];
-})), b = (e) => {
+}), Be = /* @__PURE__ */ new Set(["boxShadow", "boxShadowColor", "textShadow"]), p = /shadow/i, He = (e) => {
+  if (!p.test(e)) return e;
+  const l = e.split(",").map((o) => o.trim()).filter((o) => !p.test(o));
+  if (l.length !== 0)
+    return l.join(", ");
+}, b = (e) => Array.isArray(e) ? e.map(b).filter((l) => l !== void 0) : typeof e == "string" ? He(e) : !e || typeof e != "object" ? e : Object.fromEntries(Object.entries(e).flatMap(([l, o]) => {
+  if (Be.has(l) || p.test(l)) return [];
+  const n = b(o);
+  return n === void 0 ? [] : [[l, n]];
+})), x = (e) => {
   const {
-    shadows: r,
-    ...l
+    shadows: l,
+    ...o
   } = e ?? {};
+  return o;
+}, Te = {
+  badge: ["surface"],
+  button: ["secondary", "surface"]
+}, Le = (e) => {
+  const l = {
+    ...e ?? {}
+  };
+  for (const [o, n] of Object.entries(Te)) {
+    const s = l[o];
+    if (!s || typeof s != "object") continue;
+    const g = s, m = g.variants, f = m?.variant;
+    if (!f) continue;
+    const _ = new Set(n), y = Object.fromEntries(Object.entries(f).filter(([S]) => !_.has(S)));
+    l[o] = {
+      ...g,
+      variants: {
+        ...m,
+        variant: y
+      }
+    };
+  }
   return l;
-}, fe = {
-  ...a,
+}, Ve = {
+  ...d,
   theme: {
-    ...a.theme,
-    tokens: b(a.theme?.tokens),
-    semanticTokens: b(a.theme?.semanticTokens),
-    recipes: s(a.theme?.recipes),
-    slotRecipes: s(a.theme?.slotRecipes),
-    layerStyles: s(a.theme?.layerStyles),
-    animationStyles: s(a.theme?.animationStyles)
+    ...d.theme,
+    tokens: x(d.theme?.tokens),
+    semanticTokens: x(d.theme?.semanticTokens),
+    recipes: Le(b(d.theme?.recipes)),
+    slotRecipes: b(d.theme?.slotRecipes),
+    layerStyles: b(d.theme?.layerStyles),
+    animationStyles: b(d.theme?.animationStyles)
   }
-}, _e = {
+}, Ie = {
   DEFAULT: {
     value: "1px solid {colors.border}"
   },
-  muted: {
-    value: "1px solid {colors.border.muted}"
-  },
   subtle: {
     value: "1px solid {colors.border.subtle}"
   },
@@ -1546,23 +2428,23 @@ const A = {
   "accent-light": {
     value: "1px solid {colors.border.accent-light}"
   }
-}, Fe = {
+}, Me = {
   DEFAULT: {
     value: {
       _light: "{colors.blacks.800}",
-      _dark: "{colors.blacks.200}"
+      _dark: "#F7F8F8"
     }
   },
   muted: {
     value: {
       _light: "{colors.blacks.450}",
-      _dark: "{colors.blacks.500}"
+      _dark: "#8B9099"
     }
   },
   subtle: {
     value: {
       _light: "{colors.blacks.400}",
-      _dark: "{colors.blacks.600}"
+      _dark: "#646973"
     }
   },
   inverted: {
@@ -1571,15 +2453,27 @@ const A = {
       _dark: "{colors.blacks.800}"
     }
   },
+  info: {
+    value: {
+      _light: "{colors.blue.700}",
+      _dark: "{colors.blue.300}"
+    }
+  },
+  warning: {
+    value: {
+      _light: "{colors.orange.700}",
+      _dark: "{colors.orange.300}"
+    }
+  },
   success: {
     value: {
-      _light: "{colors.green.400}",
+      _light: "{colors.green.700}",
       _dark: "{colors.green.400}"
     }
   },
   error: {
     value: {
-      _light: "{colors.red.400}",
+      _light: "{colors.red.700}",
       _dark: "{colors.red.400}"
     }
   },
@@ -1630,35 +2524,47 @@ const A = {
       value: "{colors.fg.muted}"
     }
   }
-}, ye = {
+}, Pe = {
   DEFAULT: {
     value: {
       _light: "{colors.blacks.50}",
-      _dark: "{colors.blacks.900}"
+      _dark: "#07090E"
     }
   },
   muted: {
     value: {
-      _light: "{colors.neutral.200}",
-      _dark: "{colors.neutral.800}"
+      _light: "#F0F5F1",
+      _dark: "#171A22"
     }
   },
   subtle: {
     value: {
-      _light: "{colors.neutral.50}",
-      _dark: "{colors.neutral.950}"
+      _light: "#F9FBFA",
+      _dark: "#0E1016"
     }
   },
   hover: {
     value: {
-      _light: "{colors.neutral.100}",
-      _dark: "{colors.neutral.850}"
+      _light: "#EDF2EE",
+      _dark: "#1E212A"
     }
   },
   active: {
     value: {
-      _light: "{colors.neutral.75}",
-      _dark: "{colors.blacks.850}"
+      _light: "#E7EEE9",
+      _dark: "#252932"
+    }
+  },
+  info: {
+    value: {
+      _light: "{colors.blue.50}",
+      _dark: "{colors.blue.900}"
+    }
+  },
+  warning: {
+    value: {
+      _light: "{colors.orange.50}",
+      _dark: "{colors.orange.900}"
     }
   },
   success: {
@@ -1676,13 +2582,19 @@ const A = {
   code: {
     value: {
       _light: "{colors.blacks.50}",
-      _dark: "{colors.blacks.800}"
+      _dark: "#10131A"
     }
   },
   emphasized: {
     value: {
       _light: "{colors.bg.active}",
-      _dark: "{colors.bg.active}"
+      _dark: "#1D242E"
+    }
+  },
+  elevated: {
+    value: {
+      _light: "{colors.blacks.50}",
+      _dark: "#1B1E26"
     }
   },
   inverted: {
@@ -1712,22 +2624,13 @@ const A = {
   button: {
     primary: {
       default: {
-        value: {
-          _light: "{colors.bg.accent-primary.default}",
-          _dark: "{colors.bg.accent-primary.dark}"
-        }
+        value: "{colors.bg.accent-primary.default}"
       },
       hover: {
-        value: {
-          _light: "{colors.bg.accent-primary.hover}",
-          _dark: "{colors.bg.accent-primary.medium}"
-        }
+        value: "{colors.bg.accent-primary.hover}"
       },
       pressed: {
-        value: {
-          _light: "{colors.bg.accent-primary.pressed}",
-          _dark: "{colors.bg.accent-primary.medium}"
-        }
+        value: "{colors.bg.accent-primary.pressed}"
       },
       disabled: {
         value: "{colors.bg.muted}"
@@ -1739,22 +2642,13 @@ const A = {
       value: "{colors.bg}"
     },
     hover: {
-      value: {
-        _light: "{colors.bg.hover}",
-        _dark: "{colors.neutral.700}"
-      }
+      value: "{colors.bg.hover}"
     },
     focus: {
-      value: {
-        _light: "{colors.bg.hover}",
-        _dark: "{colors.neutral.700}"
-      }
+      value: "{colors.bg.hover}"
     },
     selected: {
-      value: {
-        _light: "{colors.bg.muted}",
-        _dark: "{colors.bg.muted}"
-      }
+      value: "{colors.bg.active}"
     }
   },
   display: {
@@ -1882,24 +2776,6 @@ const A = {
         _dark: "{colors.sapphire.50}"
       }
     },
-    "yellow-light": {
-      value: {
-        _light: "{colors.yellow.75}",
-        _dark: "{colors.yellow.75}"
-      }
-    },
-    "yellow-medium": {
-      value: {
-        _light: "{colors.yellow.100}",
-        _dark: "{colors.yellow.100}"
-      }
-    },
-    "yellow-dark": {
-      value: {
-        _light: "{colors.yellow.150}",
-        _dark: "{colors.yellow.150}"
-      }
-    },
     "sand-light": {
       value: {
         _light: "{colors.sand.100}",
@@ -1907,23 +2783,17 @@ const A = {
       }
     }
   }
-}, ke = {
+}, Xe = {
   DEFAULT: {
     value: {
-      _light: "{colors.neutral.400}",
-      _dark: "{colors.neutral.700}"
-    }
-  },
-  muted: {
-    value: {
-      _light: "{colors.neutral.300}",
-      _dark: "{colors.neutral.750}"
+      _light: "#EAF0EB",
+      _dark: "#2E333F"
     }
   },
   subtle: {
     value: {
-      _light: "{colors.neutral.200}",
-      _dark: "{colors.neutral.800}"
+      _light: "#EDF2EE",
+      _dark: "#1A1E26"
     }
   },
   inverted: {
@@ -1944,19 +2814,43 @@ const A = {
       _dark: "{colors.blue.200}"
     }
   },
+  info: {
+    value: {
+      _light: "{colors.blue.100}",
+      _dark: "#113A7C"
+    }
+  },
+  warning: {
+    value: {
+      _light: "{colors.orange.100}",
+      _dark: "#7C3A0E"
+    }
+  },
+  success: {
+    value: {
+      _light: "{colors.green.100}",
+      _dark: "#0A5B24"
+    }
+  },
+  error: {
+    value: {
+      _light: "{colors.red.100}",
+      _dark: "{colors.red.800}"
+    }
+  },
   button: {
     primary: {
-      value: "{colors.border.muted}"
+      value: "{colors.border.subtle}"
     }
   }
-}, xe = {
+}, je = {
   border: {
     value: {
       _light: "{colors.mint.200}",
       _dark: "{colors.mint.200}"
     }
   }
-}, Se = {
+}, Ue = {
   contrast: {
     value: {
       _light: "black",
@@ -2005,7 +2899,7 @@ const A = {
       _dark: "{colors.orange.500}"
     }
   }
-}, Ce = {
+}, Oe = {
   text: {
     primary: {
       value: {
@@ -2035,44 +2929,44 @@ const A = {
   categorical: {
     1: {
       value: {
-        _light: "{colors.blue.300}",
+        _light: "{colors.blue.700}",
         _dark: "{colors.blue.300}"
       }
     },
     2: {
       value: {
-        _light: "{colors.orange.500}",
-        _dark: "{colors.orange.500}"
+        _light: "{colors.orange.700}",
+        _dark: "{colors.orange.300}"
       }
     },
     3: {
       value: {
         _light: "{colors.purple.700}",
-        _dark: "{colors.purple.700}"
+        _dark: "{colors.purple.300}"
       }
     },
     4: {
       value: {
-        _light: "{colors.red.500}",
-        _dark: "{colors.red.600}"
+        _light: "{colors.red.700}",
+        _dark: "{colors.red.300}"
       }
     },
     5: {
       value: {
-        _light: "{colors.pink.500}",
-        _dark: "{colors.pink.500}"
+        _light: "{colors.pink.700}",
+        _dark: "{colors.pink.300}"
       }
     },
     6: {
       value: {
-        _light: "{colors.cyan.800}",
-        _dark: "{colors.green.500}"
+        _light: "{colors.teal.700}",
+        _dark: "{colors.teal.300}"
       }
     },
     7: {
       value: {
-        _light: "{colors.red.200}",
-        _dark: "{colors.cyan.700}"
+        _light: "{colors.cyan.700}",
+        _dark: "{colors.cyan.300}"
       }
     }
   },
@@ -2166,7 +3060,7 @@ const A = {
       }
     }
   }
-}, Ee = {
+}, Ye = {
   selectable: {
     primary: {
       value: {
@@ -2175,15 +3069,15 @@ const A = {
       }
     }
   }
-}, Ae = {
-  fg: Fe,
-  bg: ye,
-  border: ke,
-  blue: xe,
-  orange: Se,
-  vis: Ce,
-  text: Ee
-}, De = m({
+}, $e = {
+  fg: Me,
+  bg: Pe,
+  border: Xe,
+  blue: je,
+  orange: Ue,
+  vis: Oe,
+  text: Ye
+}, Ne = F({
   modal: {
     value: {
       paddingInline: "xs",
@@ -2194,7 +3088,7 @@ const A = {
       borderColor: "border"
     }
   }
-}), we = h({
+}), qe = k({
   brand: {
     value: {
       fontFamily: "brand",
@@ -2371,6 +3265,32 @@ const A = {
       letterSpacing: "0.1px"
     }
   },
+  "label/XS/medium": {
+    value: {
+      fontFamily: "label",
+      fontSize: "xs",
+      fontWeight: "500",
+      lineHeight: "150%",
+      letterSpacing: "0.1px"
+    }
+  },
+  "mono/XS": {
+    value: {
+      fontFamily: "mono",
+      fontSize: "xs",
+      fontWeight: "400",
+      lineHeight: "150%"
+    }
+  },
+  "paragraph/S/regular": {
+    value: {
+      fontFamily: "body",
+      fontSize: "sm",
+      fontWeight: "400",
+      lineHeight: "135%",
+      letterSpacing: "0.12px"
+    }
+  },
   "paragraph/M/regular": {
     value: {
       fontFamily: "body",
@@ -2427,52 +3347,57 @@ const A = {
       letterSpacing: "0.14px"
     }
   }
-}), Be = p({
-  globalCss: z,
+}), Ge = E({
+  globalCss: j,
   theme: {
     breakpoints: {
       "3xl": "2560px",
       "4xl": "3840px"
     },
-    textStyles: we,
-    layerStyles: De,
+    textStyles: qe,
+    layerStyles: Ne,
     recipes: {
-      button: ee,
-      divider: oe,
-      input: ie,
-      kbd: se,
-      skeleton: ge,
-      textarea: ve
+      badge: be,
+      button: ge,
+      divider: he,
+      input: _e,
+      kbd: ye,
+      skeleton: Ae,
+      textarea: De
     },
     tokens: {
-      colors: q,
-      fonts: G,
-      fontSizes: K,
-      fontWeights: J,
-      radii: Q,
-      spacing: N
+      colors: te,
+      fonts: ae,
+      fontSizes: ie,
+      fontWeights: ne,
+      radii: ce,
+      sizes: de,
+      spacing: se
     },
     semanticTokens: {
-      colors: Ae,
-      borders: _e
+      colors: $e,
+      borders: Ie
     },
     slotRecipes: {
-      alert: Z,
-      drawer: re,
-      tooltip: me,
-      popover: ue,
-      menu: ne,
-      editable: te,
-      form: ae,
-      dialog: le,
-      progressCircle: ce,
-      tabs: be
+      alert: ue,
+      colorPicker: me,
+      drawer: pe,
+      tooltip: Re,
+      popover: Ce,
+      menu: Se,
+      numberInput: ke,
+      editable: fe,
+      form: xe,
+      dialog: ve,
+      progressCircle: we,
+      tabs: ze,
+      timeline: We
     }
   }
-}), Le = f(fe, Be);
+}), eo = C(Ve, Ge);
 export {
-  He as a,
-  B as c,
-  Le as t
+  Ze as a,
+  X as c,
+  eo as t
 };
-//# sourceMappingURL=theme-25P7ij4C.js.map
+//# sourceMappingURL=theme-CNhnbvcE.js.map