@pstdio/ui 0.22.0 → 0.24.1

package/dist/theme/recipes/resizable-split-layout.d.ts

@@ -0,0 +1,106 @@
+export declare const resizableSplitLayoutSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "separator" | "resizablePanel" | "contentPanel", {
+    orientation: {
+        horizontal: {
+            root: {
+                "--split-direction": "row";
+                "--split-width": "var(--split-size)";
+                "--split-height": "100%";
+            };
+        };
+        vertical: {
+            root: {
+                "--split-direction": "column";
+                "--split-width": "100%";
+                "--split-height": "var(--split-size)";
+            };
+        };
+    };
+    layout: {
+        split: {
+            root: {
+                flexDirection: "var(--split-direction)";
+                height: "full";
+                overflow: "hidden";
+                gap: "0";
+            };
+            resizablePanel: {
+                display: "flex";
+                width: "var(--split-width)";
+                height: "var(--split-height)";
+                flex: "0 0 var(--split-size)";
+                overflow: "hidden";
+            };
+            contentPanel: {
+                height: "full";
+                flex: "1";
+                overflow: "hidden";
+            };
+            separator: {
+                display: "flex";
+            };
+        };
+        stacked: {
+            readonly root: {
+                readonly flexDirection: "column";
+                readonly height: "auto";
+                readonly overflow: "visible";
+                readonly gap: "panel-gap";
+            };
+            readonly resizablePanel: {
+                readonly display: "flex";
+                readonly width: "full";
+                readonly height: "auto";
+                readonly flex: "initial";
+                readonly overflow: "visible";
+            };
+            readonly contentPanel: {
+                readonly height: "auto";
+                readonly flex: "initial";
+                readonly overflow: "visible";
+            };
+            readonly separator: {
+                readonly display: "none";
+            };
+        };
+        "stacked-reverse": {
+            root: {
+                flexDirection: "column-reverse";
+                height: "auto";
+                overflow: "visible";
+                gap: "panel-gap";
+            };
+            resizablePanel: {
+                readonly display: "flex";
+                readonly width: "full";
+                readonly height: "auto";
+                readonly flex: "initial";
+                readonly overflow: "visible";
+            };
+            contentPanel: {
+                readonly height: "auto";
+                readonly flex: "initial";
+                readonly overflow: "visible";
+            };
+            separator: {
+                readonly display: "none";
+            };
+        };
+        content: {
+            root: {
+                height: "full";
+                overflow: "hidden";
+            };
+            resizablePanel: {
+                display: "none";
+            };
+            contentPanel: {
+                height: "full";
+                flex: "1";
+                overflow: "hidden";
+            };
+            separator: {
+                display: "none";
+            };
+        };
+    };
+}>;

package/dist/theme/recipes/window-title-bar.d.ts

@@ -0,0 +1,16 @@
+export declare const windowTitleBarRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root", {
+    controls: {
+        mac: {
+            content: {
+                paddingInlineStart: "window-controls-mac";
+            };
+        };
+        overlay: {
+            content: {
+                marginLeft: "env(titlebar-area-x, 0px)";
+                width: "env(titlebar-area-width, 100%)";
+            };
+        };
+    };
+}>;
+export declare const windowTabsRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "list" | "tab" | "trigger" | "close", import('@chakra-ui/react').SlotRecipeVariantRecord<"label" | "list" | "tab" | "trigger" | "close">>;

package/dist/theme/tokens/colors-background.d.ts

@@ -0,0 +1,260 @@
+export declare const bg: {
+    DEFAULT: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    muted: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    subtle: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    hover: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    active: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    info: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    warning: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    success: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    error: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    code: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    emphasized: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    elevated: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    inverted: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    panel: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    dark: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    white: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    button: {
+        primary: {
+            default: {
+                value: string;
+            };
+            hover: {
+                value: string;
+            };
+            pressed: {
+                value: string;
+            };
+            disabled: {
+                value: string;
+            };
+        };
+    };
+    "menu-item": {
+        default: {
+            value: string;
+        };
+        hover: {
+            value: string;
+        };
+        focus: {
+            value: string;
+        };
+        selected: {
+            value: string;
+        };
+    };
+    display: {
+        "very-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+    };
+    "accent-primary": {
+        default: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        hover: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        pressed: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "very-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        light: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        medium: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        dark: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+    };
+    "accent-secondary": {
+        "grey-dark": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "grey-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "red-very-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "red-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "pink-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "pink-medium": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "blue-very-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "blue-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "blue-medium": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "blue-dark": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "cyan-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "green-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        "sand-light": {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+    };
+};

package/dist/theme/tokens/colors-visualization.d.ts

@@ -0,0 +1,162 @@
+export declare const vis: {
+    text: {
+        primary: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        secondary: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+    };
+    grid: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    axis: {
+        value: {
+            _light: string;
+            _dark: string;
+        };
+    };
+    categorical: {
+        1: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        2: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        3: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        4: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        5: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        6: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+        7: {
+            value: {
+                _light: string;
+                _dark: string;
+            };
+        };
+    };
+    sequential: {
+        blue: {
+            "low-3": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "low-2": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "low-1": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            default: {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-1": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-2": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-3": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+        };
+        red: {
+            "low-3": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "low-2": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "low-1": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            default: {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-1": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-2": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+            "high-3": {
+                value: {
+                    _light: string;
+                    _dark: string;
+                };
+            };
+        };
+    };
+};