@pstdio/ui 0.24.2 → 0.26.0

package/dist/{theme-B5OVwYEU.js → theme-AzJH4Om3.js}

@@ -1,6 +1,6 @@
-import { defineSlotRecipe as t, defineRecipe as c, defaultConfig as d, defineLayerStyles as k, defineTextStyles as C, createSystem as F, defineConfig as E } from "@chakra-ui/react";
-import { alertAnatomy as W, colorPickerAnatomy as z, dialogAnatomy as D, drawerAnatomy as A, fieldsetAnatomy as R, menuAnatomy as B, numberInputAnatomy as H, popoverAnatomy as T, switchAnatomy as I, tabsAnatomy as L, timelineAnatomy as P, tooltipAnatomy as V } from "@chakra-ui/react/anatomy";
-import { progressCircleSlotRecipe as v } from "@chakra-ui/react/theme";
+import { defineSlotRecipe as t, defineRecipe as c, defaultConfig as d, defineLayerStyles as k, defineTextStyles as w, createSystem as C, defineConfig as E } from "@chakra-ui/react";
+import { alertAnatomy as z, colorPickerAnatomy as A, dialogAnatomy as W, drawerAnatomy as R, fieldsetAnatomy as D, menuAnatomy as B, numberInputAnatomy as H, popoverAnatomy as T, switchAnatomy as L, tabsAnatomy as I, timelineAnatomy as V, tooltipAnatomy as P } from "@chakra-ui/react/anatomy";
+import { progressCircleSlotRecipe as p } from "@chakra-ui/react/theme";
 const X = t({
   className: "ps-window-title-bar",
   slots: ["root", "content"],
@@ -168,11 +168,11 @@ const X = t({
   descriptionForeground: ["colors.fg.muted"],
   disabledForeground: ["colors.fg.subtle"],
   border: ["colors.border", "colors.border.subtle"]
-}, O = (o) => `colors.vscode.${o}`, U = (o) => o.replace(/^#/, ""), N = (o) => {
+}, U = (o) => `colors.vscode.${o}`, O = (o) => o.replace(/^#/, ""), Y = (o) => {
   const l = (o.theme.tokenColors ?? []).flatMap((r) => (Array.isArray(r.scope) ? r.scope : r.scope ? [r.scope] : []).map((s) => ({
     token: s,
     ...r.settings?.foreground ? {
-      foreground: U(r.settings.foreground)
+      foreground: O(r.settings.foreground)
     } : {},
     ...r.settings?.fontStyle ? {
       fontStyle: r.settings.fontStyle
@@ -184,25 +184,25 @@ const X = t({
     rules: l,
     colors: o.theme.colors ?? {}
   };
-}, co = (o) => {
+}, io = (o) => {
   const l = {}, r = o.theme.colors ?? {};
   for (const [n, s] of Object.entries(r))
-    l[O(n)] = s;
+    l[U(n)] = s;
   for (const [n, s] of Object.entries(j)) {
-    const b = r[n];
-    if (b)
-      for (const m of s) l[m] = b;
+    const g = r[n];
+    if (g)
+      for (const m of s) l[m] = g;
   }
   return {
     id: o.id,
     mode: o.mode,
     tokens: l,
-    monacoTheme: N({
+    monacoTheme: Y({
       mode: o.mode,
       theme: o.theme
     })
   };
-}, Y = {
+}, $ = {
   "*::selection": {
     bg: {
       base: "bg.accent-secondary.blue-medium",
@@ -263,7 +263,7 @@ const X = t({
       fontSize: "1.5rem"
     }
   }
-}, G = {
+}, N = {
   DEFAULT: {
     value: "#0A0D15"
   },
@@ -312,7 +312,7 @@ const X = t({
   1e3: {
     value: "#000000"
   }
-}, $ = {
+}, q = {
   DEFAULT: {
     value: "#5098FF"
   },
@@ -346,7 +346,7 @@ const X = t({
   900: {
     value: "#002862"
   }
-}, q = {
+}, G = {
   DEFAULT: {
     value: "#3A4BE4"
   },
@@ -794,33 +794,10 @@ const X = t({
       value: "#28C840"
     }
   },
-  illustration: {
-    desktop: {
-      value: "#FF6B1A"
-    },
-    page: {
-      value: "#29ABE2"
-    },
-    command: {
-      value: "#FBB040"
-    },
-    editor: {
-      value: "#29ABE2"
-    },
-    skill: {
-      value: "#E6357F"
-    },
-    hook: {
-      value: "#E6357F"
-    },
-    automation: {
-      value: "#F7931E"
-    }
-  },
   sand: ae,
-  blacks: G,
-  blue: $,
-  sapphire: q,
+  blacks: N,
+  blue: q,
+  sapphire: G,
   pink: K,
   peach: J,
   red: Q,
@@ -961,7 +938,7 @@ const X = t({
   1600: "8rem",
   // 128px
   2e3: "10rem"
-}, ge = {
+}, be = {
   "window-tab-gap": {
     value: "0.4375rem"
   },
@@ -1019,7 +996,7 @@ const X = t({
   "panel-gap": {
     value: e[50]
   }
-}, be = {
+}, ge = {
   "panel-gap": {
     value: e[50]
   },
@@ -1114,7 +1091,7 @@ const X = t({
   selection: {
     value: "0.09375rem"
   }
-}, pe = {
+}, ve = {
   none: {
     value: "0"
   },
@@ -1143,7 +1120,7 @@ const X = t({
     value: "100%"
   }
 }, he = t({
-  slots: W.keys(),
+  slots: z.keys(),
   base: {
     root: {
       px: "xs",
@@ -1215,7 +1192,7 @@ const X = t({
       }
     }
   }]
-}), ve = c({
+}), pe = c({
   className: "chakra-badge",
   base: {
     display: "inline-flex",
@@ -1508,7 +1485,7 @@ const X = t({
     variant: "outline"
   }
 }), u = "border.accent-light", xe = t({
-  slots: z.keys(),
+  slots: A.keys(),
   base: {
     control: {
       display: "flex",
@@ -1628,7 +1605,7 @@ const X = t({
     size: "sm"
   }
 }), ye = t({
-  slots: D.keys(),
+  slots: W.keys(),
   base: {
     content: {
       bg: "bg",
@@ -1638,12 +1615,12 @@ const X = t({
       overflow: "hidden"
     }
   }
-}), Se = c({
+}), _e = c({
   base: {
     borderColor: "border.subtle"
   }
-}), _e = t({
-  slots: A.keys(),
+}), Se = t({
+  slots: R.keys(),
   base: {
     header: {
       fontWeight: "medium",
@@ -1654,7 +1631,7 @@ const X = t({
       bg: "bg"
     }
   }
-}), we = t({
+}), Fe = t({
   slots: ["preview", "input", "textarea"],
   base: {
     preview: {
@@ -1754,13 +1731,13 @@ const X = t({
     }
   }
 }), ke = t({
-  slots: R.keys(),
+  slots: D.keys(),
   base: {
     legend: {
       mb: "2xs"
     }
   }
-}), a = "border.accent-light", Ce = c({
+}), a = "border.accent-light", we = c({
   base: {
     px: "sm",
     borderRadius: "xs",
@@ -1897,7 +1874,7 @@ const X = t({
     size: "sm",
     variant: "outline"
   }
-}), Fe = c({
+}), Ce = c({
   base: {
     display: "inline-flex",
     alignItems: "center",
@@ -1961,670 +1938,6 @@ const X = t({
     variant: "raised"
   }
 }), Ee = t({
-  slots: ["root", "window", "titlebar", "windowControls", "windowControl", "mobileTitlebar", "mobileNav", "sidebar", "status", "body", "main", "hero", "heroCopy", "heroNavigation", "tools", "download", "brandTab", "panelsScroll", "panelScroll"],
-  base: {
-    root: {
-      height: "100dvh",
-      position: "relative",
-      overflow: "hidden",
-      bg: "bg.subtle"
-    },
-    window: {
-      display: "flex",
-      flexDirection: "column",
-      height: "full",
-      width: "full",
-      position: "relative",
-      bg: "bg.subtle",
-      color: "fg",
-      overflow: "hidden"
-    },
-    titlebar: {
-      height: "11",
-      flexShrink: 0,
-      gap: "xs",
-      px: "compact",
-      display: {
-        base: "none",
-        md: "flex"
-      },
-      alignItems: "center"
-    },
-    windowControls: {
-      display: "flex",
-      alignItems: "center",
-      gap: "xs",
-      px: "sm",
-      flexShrink: 0
-    },
-    windowControl: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      width: "icon-2xs",
-      height: "icon-2xs",
-      borderRadius: "full",
-      color: "blackAlpha.700",
-      cursor: "pointer",
-      "& svg": {
-        width: "2",
-        height: "2",
-        visibility: "hidden"
-      },
-      "&[data-control=close]:not(:disabled)": {
-        bg: "windowControl.close"
-      },
-      "&[data-control=minimize]:not(:disabled)": {
-        bg: "windowControl.minimize"
-      },
-      "&[data-control=zoom]": {
-        bg: "windowControl.zoom"
-      },
-      _groupHover: {
-        "&:not(:disabled) svg": {
-          visibility: "visible"
-        }
-      },
-      _focusVisible: {
-        outline: "2px solid",
-        outlineColor: "fg",
-        outlineOffset: "2px",
-        "& svg": {
-          visibility: "visible"
-        }
-      },
-      _disabled: {
-        bg: "bg.muted",
-        cursor: "not-allowed",
-        "& svg": {
-          visibility: "hidden"
-        }
-      }
-    },
-    mobileTitlebar: {
-      height: "mobile-titlebar",
-      flexShrink: 0,
-      gap: "xs",
-      px: "sm",
-      display: {
-        base: "flex",
-        md: "none"
-      },
-      textAlign: "left",
-      alignItems: "center"
-    },
-    mobileNav: {
-      alignItems: "center",
-      height: "10",
-      flexShrink: 0,
-      width: "full",
-      gap: "xs",
-      px: "md",
-      display: {
-        base: "flex",
-        lg: "none"
-      }
-    },
-    sidebar: {
-      display: "flex",
-      flexDirection: "column",
-      layerStyle: "panel",
-      height: "full",
-      width: "full",
-      flexShrink: 0,
-      gap: "2xs",
-      px: "xs",
-      py: "xs",
-      bg: "bg.subtle"
-    },
-    status: {
-      minHeight: "7",
-      flexShrink: 0,
-      flexWrap: "wrap",
-      gap: "xs",
-      rowGap: "2xs",
-      px: "xs",
-      color: "fg.muted"
-    },
-    body: {
-      display: "flex",
-      flex: 1,
-      minHeight: 0,
-      p: "panel-gap"
-    },
-    main: {
-      flex: 1,
-      minHeight: 0,
-      minWidth: 0,
-      position: "relative",
-      overflow: "hidden"
-    },
-    panelsScroll: {
-      "& > [data-part=viewport] > [data-part=content]": {
-        height: {
-          base: "auto",
-          lg: "full"
-        }
-      },
-      "& > [data-part=scrollbar]": {
-        display: {
-          base: "flex",
-          lg: "none"
-        }
-      }
-    },
-    panelScroll: {
-      display: {
-        base: "contents",
-        lg: "flex"
-      },
-      "& > [data-part=viewport]": {
-        display: {
-          base: "contents",
-          lg: "block"
-        }
-      },
-      "& > [data-part=viewport] > [data-part=content]": {
-        display: {
-          base: "contents",
-          lg: "block"
-        }
-      },
-      "& > [data-part=scrollbar]": {
-        display: {
-          base: "none",
-          lg: "flex"
-        }
-      }
-    },
-    hero: {
-      display: "flex",
-      flexDirection: "column",
-      layerStyle: "panel",
-      bg: "bg",
-      width: "full",
-      height: "full",
-      overflow: "hidden"
-    },
-    heroNavigation: {
-      display: "flex",
-      flexWrap: "wrap",
-      justifyContent: "space-between",
-      gap: "sm",
-      flexShrink: 0,
-      px: {
-        base: "lg",
-        xl: "3xl"
-      },
-      py: "lg",
-      "& [data-direction=next]": {
-        marginInlineStart: "auto",
-        flexDirection: "row-reverse"
-      }
-    },
-    heroCopy: {
-      display: "flex",
-      flexDirection: "column",
-      minHeight: "full",
-      width: "full",
-      maxWidth: "2xl",
-      mx: "auto",
-      gap: "xl",
-      px: {
-        base: "lg",
-        xl: "3xl"
-      },
-      py: {
-        base: "xl",
-        xl: "4xl"
-      }
-    },
-    tools: {
-      layerStyle: "panel",
-      bg: "bg",
-      position: "relative",
-      overflow: "hidden",
-      width: "full",
-      height: "full",
-      minHeight: "0"
-    },
-    download: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "sm",
-      alignItems: "start",
-      width: "full"
-    },
-    brandTab: {
-      height: "7",
-      px: "compact",
-      gap: "xs",
-      borderRadius: "xs",
-      bg: "bg.hover",
-      color: "fg",
-      borderWidth: "1px",
-      borderColor: "border.subtle",
-      flexShrink: 0,
-      cursor: "pointer"
-    }
-  },
-  variants: {
-    windowed: {
-      true: {
-        root: {
-          bg: "illustration.desktop"
-        },
-        window: {
-          height: "calc(100dvh - 12rem)",
-          width: "calc(100% - 15rem)",
-          mx: "7.5rem",
-          my: "6rem",
-          borderRadius: "lg",
-          boxShadow: "2xl"
-        },
-        titlebar: {
-          cursor: "grab",
-          _active: {
-            cursor: "grabbing"
-          }
-        }
-      }
-    }
-  }
-}), We = t({
-  slots: ["page", "section", "featureSection", "intro", "visual", "panels", "panel", "panelHeader", "panelBody", "blockGrid", "block", "blockSymbol", "blockMark", "composition"],
-  base: {
-    page: {
-      display: "flex",
-      flexDirection: "column",
-      width: "full",
-      minWidth: 0,
-      gap: "4xl",
-      px: {
-        base: "lg",
-        md: "xl"
-      },
-      py: "3xl",
-      containerType: "inline-size"
-    },
-    section: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "lg",
-      width: "full",
-      minWidth: 0
-    },
-    featureSection: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "xl",
-      width: "full",
-      minWidth: 0,
-      pt: "xl",
-      pb: "xl"
-    },
-    intro: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "sm",
-      maxWidth: "3xl"
-    },
-    visual: {
-      layerStyle: "panel",
-      bg: "bg.subtle",
-      p: "xs",
-      width: "full",
-      minWidth: 0
-    },
-    panels: {
-      display: "grid",
-      gridTemplateColumns: "minmax(0, 1fr)",
-      gap: "panel-gap",
-      "@container (min-width: 36rem)": {
-        gridTemplateColumns: "minmax(0, 1fr) minmax(0, 1.3fr)"
-      }
-    },
-    panel: {
-      layerStyle: "panel",
-      bg: "bg",
-      minWidth: 0,
-      height: "full",
-      display: "flex",
-      flexDirection: "column",
-      "&[data-highlighted=true]": {
-        borderColor: "fg.muted"
-      }
-    },
-    panelHeader: {
-      display: "flex",
-      alignItems: "center",
-      gap: "sm",
-      p: "md",
-      borderBottomWidth: "1px",
-      borderColor: "border.subtle",
-      textStyle: "label/M/medium"
-    },
-    panelBody: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "md",
-      p: "md",
-      flex: 1,
-      minWidth: 0
-    },
-    blockGrid: {
-      display: "grid",
-      gap: "sm",
-      gridTemplateColumns: "minmax(0, 1fr)",
-      "@container (min-width: 26rem)": {
-        gridTemplateColumns: "repeat(2, minmax(0, 1fr))"
-      },
-      "@container (min-width: 55rem)": {
-        gridTemplateColumns: "repeat(3, minmax(0, 1fr))"
-      }
-    },
-    block: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "start",
-      gap: "sm",
-      p: "lg",
-      bg: "bg.subtle",
-      borderRadius: "sm",
-      borderWidth: "1px",
-      borderColor: "border.subtle",
-      textAlign: "left",
-      color: "fg"
-    },
-    blockMark: {
-      display: "inline-flex",
-      flexShrink: 0,
-      "& svg": {
-        height: "full",
-        width: "auto",
-        maxWidth: "none"
-      }
-    },
-    blockSymbol: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "start",
-      height: "16",
-      width: "full"
-    },
-    composition: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "md",
-      borderTopWidth: "1px",
-      borderColor: "border.subtle",
-      pt: "lg"
-    }
-  },
-  variants: {
-    spacing: {
-      normal: {},
-      spacious: {
-        page: {
-          gap: "5xl"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    spacing: "normal"
-  }
-}), ze = t({
-  slots: ["iconEditor", "iconPicker", "iconGrid", "iconTile", "iconName", "tileSymbol", "iconCanvas", "inspectorSymbol", "inspector", "toolbar", "metrics", "metric", "sessions", "session", "sessionStatus", "preview", "checks", "prompt", "plot", "plotGrid", "plotCurve", "plotComparison", "plotCursor", "plotPoint", "shaderCode", "shaderCanvas", "extensionPanels"],
-  base: {
-    extensionPanels: {
-      display: "grid",
-      gridTemplateColumns: "repeat(auto-fit, minmax(min(100%, {sizes.48}), 1fr))",
-      gap: "panel-gap",
-      minHeight: "64",
-      width: "full"
-    },
-    iconPicker: {
-      display: "grid",
-      gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
-      "@container (min-width: 26rem)": {
-        gridTemplateColumns: "repeat(6, minmax(0, 1fr))"
-      },
-      gap: "xs"
-    },
-    shaderCode: {
-      textStyle: "mono/XS",
-      fontSize: "sm",
-      minHeight: "64",
-      flex: 1,
-      resize: "none"
-    },
-    shaderCanvas: {
-      display: "block",
-      width: "full",
-      aspectRatio: "4 / 3",
-      bg: "bg.subtle",
-      borderRadius: "sm"
-    },
-    plot: {
-      width: "full",
-      bg: "bg.subtle",
-      borderRadius: "sm"
-    },
-    plotGrid: {
-      fill: "none",
-      stroke: "border.subtle",
-      strokeWidth: 1
-    },
-    plotComparison: {
-      fill: "none",
-      stroke: "fg.muted",
-      strokeWidth: 2,
-      strokeDasharray: "5 5"
-    },
-    plotCurve: {
-      fill: "none",
-      stroke: "fg.info",
-      strokeWidth: 3,
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    },
-    plotCursor: {
-      stroke: "fg.muted",
-      strokeWidth: 1,
-      strokeDasharray: "4 4"
-    },
-    plotPoint: {
-      fill: "fg",
-      stroke: "bg",
-      strokeWidth: 2
-    },
-    iconEditor: {
-      display: "grid",
-      gridTemplateColumns: "minmax(0, 1fr)",
-      gap: "panel-gap",
-      "@container (min-width: 36rem)": {
-        gridTemplateColumns: "minmax(0, 1.5fr) minmax(0, 1fr)"
-      }
-    },
-    iconGrid: {
-      display: "grid",
-      gridTemplateColumns: "repeat(auto-fill, minmax(min({sizes.24}, 100%), 1fr))",
-      gap: "xs",
-      listStyle: "none",
-      py: "xs"
-    },
-    iconTile: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      justifyContent: "center",
-      gap: "xs",
-      minWidth: 0,
-      minHeight: "28",
-      p: "sm",
-      bg: "bg.subtle",
-      borderWidth: "1px",
-      borderColor: "border.subtle",
-      borderRadius: "sm",
-      color: "fg",
-      transitionProperty: "opacity, background-color, border-color",
-      transitionDuration: "moderate",
-      "&[data-state=pending]": {
-        opacity: 0.25
-      },
-      "&[data-state=active]": {
-        borderColor: "fg.info",
-        bg: "bg.info"
-      },
-      "@media (prefers-reduced-motion: reduce)": {
-        transition: "none"
-      },
-      "&[aria-pressed]": {
-        cursor: "pointer",
-        _hover: {
-          bg: "bg.hover"
-        }
-      },
-      _focusVisible: {
-        outline: "2px solid",
-        outlineColor: "fg",
-        outlineOffset: "2px"
-      },
-      "&[aria-pressed=true]": {
-        borderColor: "fg.info",
-        bg: "bg.info"
-      }
-    },
-    iconName: {
-      textStyle: "label/S/regular",
-      maxWidth: "full",
-      overflow: "hidden",
-      textOverflow: "ellipsis",
-      whiteSpace: "nowrap"
-    },
-    tileSymbol: {
-      boxSize: "8",
-      fontSize: "{sizes.8}",
-      mb: "xs"
-    },
-    iconCanvas: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      bg: "bg.subtle",
-      borderRadius: "sm",
-      minHeight: "44",
-      p: "xl"
-    },
-    inspectorSymbol: {
-      boxSize: "24",
-      fontSize: "{sizes.24}"
-    },
-    inspector: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "md"
-    },
-    toolbar: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      gap: "sm",
-      flexWrap: "wrap"
-    },
-    metrics: {
-      display: "grid",
-      gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
-      gap: "panel-gap"
-    },
-    metric: {
-      layerStyle: "panel",
-      bg: "bg",
-      p: "md",
-      display: "flex",
-      flexDirection: "column",
-      gap: "xs"
-    },
-    sessions: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "sm",
-      listStyle: "none"
-    },
-    session: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "md",
-      width: "full",
-      p: "md",
-      minWidth: 0,
-      textAlign: "left",
-      color: "fg",
-      layerStyle: "panel",
-      bg: "bg.subtle",
-      "&[aria-pressed]": {
-        cursor: "pointer",
-        _hover: {
-          bg: "bg.hover"
-        }
-      },
-      _focusVisible: {
-        outline: "2px solid",
-        outlineColor: "fg",
-        outlineOffset: "2px"
-      },
-      "&[aria-pressed=true]": {
-        borderColor: "fg.muted",
-        bg: "bg.active"
-      },
-      "&[data-status=in_progress]": {
-        borderColor: "fg.info",
-        bg: "bg.info"
-      },
-      "&[data-status=completed]": {
-        borderColor: "fg.success"
-      }
-    },
-    sessionStatus: {
-      gap: "xs",
-      "&[data-status=in_progress] > svg": {
-        animation: "spin 1.2s linear infinite"
-      },
-      "@media (prefers-reduced-motion: reduce)": {
-        "&[data-status=in_progress] > svg": {
-          animation: "none"
-        }
-      }
-    },
-    preview: {
-      layerStyle: "panel",
-      bg: "bg.subtle",
-      p: "md",
-      overflow: "hidden",
-      minWidth: 0,
-      flex: 1
-    },
-    checks: {
-      display: "flex",
-      flexWrap: "wrap",
-      gap: "md",
-      textStyle: "label/S/regular",
-      color: "fg.success"
-    },
-    prompt: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      flexWrap: "wrap",
-      gap: "md",
-      p: "lg",
-      bg: "bg.subtle",
-      layerStyle: "panel",
-      textStyle: "paragraph/L/regular"
-    }
-  }
-}), De = t({
   slots: B.keys(),
   base: {
     itemGroupLabel: {
@@ -2704,7 +2017,7 @@ const X = t({
       textStyle: "label/M/regular"
     }
   }
-}), Ae = "var(--chakra-colors-border)", p = "var(--chakra-colors-border-accent-light)", Re = t({
+}), ze = "var(--chakra-colors-border)", v = "var(--chakra-colors-border-accent-light)", Ae = t({
   slots: H.keys(),
   base: {
     root: {
@@ -2712,15 +2025,15 @@ const X = t({
       zIndex: "0",
       isolation: "isolate",
       boxShadow: "none",
-      "--number-input-border-color": Ae,
+      "--number-input-border-color": ze,
       "&:is(:hover, [data-hover])": {
-        "--number-input-border-color": p
+        "--number-input-border-color": v
       },
       "&:is(:active, [data-active])": {
-        "--number-input-border-color": p
+        "--number-input-border-color": v
       },
       "&:focus-within": {
-        "--number-input-border-color": p
+        "--number-input-border-color": v
       }
     },
     input: {
@@ -2917,7 +2230,7 @@ const X = t({
     size: "sm",
     variant: "outline"
   }
-}), Be = t({
+}), We = t({
   slots: T.keys(),
   base: {
     positioner: {
@@ -2971,12 +2284,12 @@ const X = t({
       }
     }
   }
-}), He = v.variants?.size ?? {}, Te = {
-  ...v,
+}), Re = p.variants?.size ?? {}, De = {
+  ...p,
   variants: {
-    ...v.variants,
+    ...p.variants,
     size: {
-      ...He,
+      ...Re,
       "2xs": {
         circle: {
           "--size": "14px",
@@ -3010,7 +2323,7 @@ const X = t({
   separator: {
     display: "none"
   }
-}, Ie = t({
+}, Be = t({
   slots: ["root", "resizablePanel", "contentPanel", "separator"],
   base: {
     root: {
@@ -3109,13 +2422,13 @@ const X = t({
     orientation: "horizontal",
     layout: "split"
   }
-}), Le = c({
+}), He = c({
   base: {
     "--start-color": "fg",
     "--end-color": "fg.muted"
   }
-}), Pe = t({
-  slots: I.keys(),
+}), Te = t({
+  slots: L.keys(),
   base: {
     control: {
       alignItems: "center",
@@ -3178,8 +2491,8 @@ const X = t({
       }
     }
   }
-}), Ve = t({
-  slots: L.keys(),
+}), Le = t({
+  slots: I.keys(),
   base: {
     root: {
       "--tabs-trigger-radius": "radii.xs"
@@ -3313,7 +2626,7 @@ const X = t({
     size: "xs",
     variant: "subtle"
   }
-}), i = "border.accent-light", Xe = c({
+}), i = "border.accent-light", Ie = c({
   base: {
     paddingX: "sm",
     paddingY: "xs",
@@ -3419,8 +2732,8 @@ const X = t({
     size: "sm",
     variant: "outline"
   }
-}), Me = t({
-  slots: P.keys(),
+}), Ve = t({
+  slots: V.keys(),
   base: {
     root: {
       display: "flex",
@@ -3489,6 +2802,15 @@ const X = t({
   },
   variants: {
     variant: {
+      tool: {
+        content: {
+          minWidth: "0"
+        },
+        title: {
+          flexWrap: "nowrap",
+          whiteSpace: "nowrap"
+        }
+      },
       solid: {},
       subtle: {},
       outline: {
@@ -3566,8 +2888,8 @@ const X = t({
     variant: "solid",
     showLastSeparator: !1
   }
-}), je = t({
-  slots: V.keys(),
+}), Pe = t({
+  slots: P.keys(),
   base: {
     content: {
       bg: "bg.inverted",
@@ -3575,14 +2897,14 @@ const X = t({
       color: "fg.inverted"
     }
   }
-}), Oe = /* @__PURE__ */ new Set(["boxShadow", "boxShadowColor", "textShadow"]), f = /shadow/i, Ue = (o) => {
+}), Xe = /* @__PURE__ */ new Set(["boxShadow", "boxShadowColor", "textShadow"]), f = /shadow/i, Me = (o) => {
   if (!f.test(o)) return o;
   const l = o.split(",").map((r) => r.trim()).filter((r) => !f.test(r));
   if (l.length !== 0)
     return l.join(", ");
-}, g = (o) => Array.isArray(o) ? o.map(g).filter((l) => l !== void 0) : typeof o == "string" ? Ue(o) : !o || typeof o != "object" ? o : Object.fromEntries(Object.entries(o).flatMap(([l, r]) => {
-  if (Oe.has(l) || f.test(l)) return [];
-  const n = g(r);
+}, b = (o) => Array.isArray(o) ? o.map(b).filter((l) => l !== void 0) : typeof o == "string" ? Me(o) : !o || typeof o != "object" ? o : Object.fromEntries(Object.entries(o).flatMap(([l, r]) => {
+  if (Xe.has(l) || f.test(l)) return [];
+  const n = b(r);
   return n === void 0 ? [] : [[l, n]];
 })), y = (o) => {
   const {
@@ -3590,40 +2912,40 @@ const X = t({
     ...r
   } = o ?? {};
   return r;
-}, Ne = {
+}, je = {
   badge: ["surface"],
   button: ["secondary", "surface"]
-}, Ye = (o) => {
+}, Ue = (o) => {
   const l = {
     ...o ?? {}
   };
-  for (const [r, n] of Object.entries(Ne)) {
+  for (const [r, n] of Object.entries(je)) {
     const s = l[r];
     if (!s || typeof s != "object") continue;
-    const b = s, m = b.variants, x = m?.variant;
+    const g = s, m = g.variants, x = m?.variant;
     if (!x) continue;
-    const S = new Set(n), _ = Object.fromEntries(Object.entries(x).filter(([w]) => !S.has(w)));
+    const _ = new Set(n), S = Object.fromEntries(Object.entries(x).filter(([F]) => !_.has(F)));
     l[r] = {
-      ...b,
+      ...g,
       variants: {
         ...m,
-        variant: _
+        variant: S
       }
     };
   }
   return l;
-}, Ge = {
+}, Oe = {
   ...d,
   theme: {
     ...d.theme,
     tokens: y(d.theme?.tokens),
     semanticTokens: y(d.theme?.semanticTokens),
-    recipes: Ye(g(d.theme?.recipes)),
-    slotRecipes: g(d.theme?.slotRecipes),
-    layerStyles: g(d.theme?.layerStyles),
-    animationStyles: g(d.theme?.animationStyles)
+    recipes: Ue(b(d.theme?.recipes)),
+    slotRecipes: b(d.theme?.slotRecipes),
+    layerStyles: b(d.theme?.layerStyles),
+    animationStyles: b(d.theme?.animationStyles)
   }
-}, $e = {
+}, Ye = {
   DEFAULT: {
     value: "1px solid {colors.border}"
   },
@@ -3639,7 +2961,7 @@ const X = t({
   "accent-light": {
     value: "1px solid {colors.border.accent-light}"
   }
-}, qe = {
+}, $e = {
   text: {
     primary: {
       value: {
@@ -3800,7 +3122,7 @@ const X = t({
       }
     }
   }
-}, Ke = {
+}, Ne = {
   DEFAULT: {
     value: {
       _light: "{colors.blacks.50}",
@@ -4059,7 +3381,7 @@ const X = t({
       }
     }
   }
-}, Je = {
+}, qe = {
   DEFAULT: {
     value: {
       _light: "{colors.blacks.800}",
@@ -4155,7 +3477,7 @@ const X = t({
       value: "{colors.fg.muted}"
     }
   }
-}, Qe = {
+}, Ge = {
   DEFAULT: {
     value: {
       _light: "#EAF0EB",
@@ -4215,14 +3537,14 @@ const X = t({
       value: "{colors.border.subtle}"
     }
   }
-}, Ze = {
+}, Ke = {
   border: {
     value: {
       _light: "{colors.mint.200}",
       _dark: "{colors.mint.200}"
     }
   }
-}, eo = {
+}, Je = {
   contrast: {
     value: {
       _light: "black",
@@ -4271,7 +3593,7 @@ const X = t({
       _dark: "{colors.orange.500}"
     }
   }
-}, oo = {
+}, Qe = {
   selectable: {
     primary: {
       value: {
@@ -4280,15 +3602,15 @@ const X = t({
       }
     }
   }
-}, ro = {
-  fg: Je,
-  bg: Ke,
-  border: Qe,
-  blue: Ze,
-  orange: eo,
-  vis: qe,
-  text: oo
-}, lo = k({
+}, Ze = {
+  fg: qe,
+  bg: Ne,
+  border: Ge,
+  blue: Ke,
+  orange: Je,
+  vis: $e,
+  text: Qe
+}, eo = k({
   floatingBar: {
     value: {
       paddingInline: "sm",
@@ -4319,7 +3641,7 @@ const X = t({
       borderColor: "border"
     }
   }
-}), to = C({
+}), oo = w({
   brand: {
     value: {
       fontFamily: "brand",
@@ -4606,8 +3928,8 @@ const X = t({
       letterSpacing: "0.14px"
     }
   }
-}), ao = E({
-  globalCss: Y,
+}), ro = E({
+  globalCss: $,
   utilities: {
     WebkitAppRegion: {
       values: ["drag", "no-drag"],
@@ -4621,16 +3943,16 @@ const X = t({
       "3xl": "2560px",
       "4xl": "3840px"
     },
-    textStyles: to,
-    layerStyles: lo,
+    textStyles: oo,
+    layerStyles: eo,
     recipes: {
-      badge: ve,
+      badge: pe,
       button: fe,
-      divider: Se,
-      input: Ce,
-      kbd: Fe,
-      skeleton: Le,
-      textarea: Xe
+      divider: _e,
+      input: we,
+      kbd: Ce,
+      skeleton: He,
+      textarea: Ie
     },
     tokens: {
       colors: se,
@@ -4638,43 +3960,40 @@ const X = t({
       fonts: de,
       fontSizes: ce,
       fontWeights: ue,
-      radii: pe,
-      sizes: be,
-      spacing: ge
+      radii: ve,
+      sizes: ge,
+      spacing: be
     },
     semanticTokens: {
-      colors: ro,
-      borders: $e
+      colors: Ze,
+      borders: Ye
     },
     slotRecipes: {
       windowTitleBar: X,
       windowTabs: M,
-      landing: Ee,
-      landingStory: We,
-      landingToolDemo: ze,
-      resizableSplitLayout: Ie,
+      resizableSplitLayout: Be,
       alert: he,
       colorPicker: xe,
-      drawer: _e,
-      tooltip: je,
-      popover: Be,
-      menu: De,
-      numberInput: Re,
-      editable: we,
+      drawer: Se,
+      tooltip: Pe,
+      popover: We,
+      menu: Ee,
+      numberInput: Ae,
+      editable: Fe,
       form: ke,
       dialog: ye,
-      progressCircle: Te,
-      switch: Pe,
-      tabs: Ve,
-      timeline: Me
+      progressCircle: De,
+      switch: Te,
+      tabs: Le,
+      timeline: Ve
     }
   }
-}), uo = F(Ge, ao);
+}), no = C(Oe, ro);
 export {
-  co as a,
+  io as a,
   X as b,
-  N as c,
-  uo as t,
+  Y as c,
+  no as t,
   M as w
 };
-//# sourceMappingURL=theme-B5OVwYEU.js.map
+//# sourceMappingURL=theme-AzJH4Om3.js.map