@ctrl-ui/react 0.9.16 → 0.9.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -25,6 +25,21 @@
|
|
|
25
25
|
--cui-resizable-group-radius: 0px;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
+
/* biome-ignore-start lint/complexity/noImportantStyles: react-resizable-panels sets inline display on the group and panels. */
|
|
29
|
+
:where([data-control-family="resizable"][data-slot="panel-group"][data-layout="contents"]) {
|
|
30
|
+
display: contents !important;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
:where([data-control-family="resizable"][data-slot="panel-group"]:not([data-layout="resizable"]) > [data-slot="panel"]),
|
|
34
|
+
:where([data-control-family="resizable"][data-slot="panel-group"]:not([data-layout="resizable"]) > [data-slot="panel"] > div) {
|
|
35
|
+
display: contents !important;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
:where([data-control-family="resizable"][data-slot="panel-group"]:not([data-layout="resizable"]) > [data-slot="handle"]) {
|
|
39
|
+
display: none !important;
|
|
40
|
+
}
|
|
41
|
+
/* biome-ignore-end lint/complexity/noImportantStyles: react-resizable-panels sets inline display on the group and panels. */
|
|
42
|
+
|
|
28
43
|
:where([data-control-family="resizable"][data-slot="handle"]) {
|
|
29
44
|
--_resizable-gradient-color: var(--cui-resizable-handle-hover-background);
|
|
30
45
|
background-color: var(--cui-resizable-handle-background);
|
package/dist/ui/resizable.d.ts
CHANGED
|
@@ -5,10 +5,12 @@ export type ResizableLayout = {
|
|
|
5
5
|
[panelId: string]: number;
|
|
6
6
|
};
|
|
7
7
|
export type ResizablePanelGroupVariant = "framed" | "nested";
|
|
8
|
+
export type ResizablePanelGroupLayout = "resizable" | "static" | "contents";
|
|
8
9
|
export type ResizableHandleVariant = "solid" | "hover";
|
|
9
10
|
export type ResizablePanelGroupProps = Omit<ComponentProps<"div">, "style"> & {
|
|
10
11
|
orientation?: "horizontal" | "vertical";
|
|
11
12
|
variant?: ResizablePanelGroupVariant;
|
|
13
|
+
layout?: ResizablePanelGroupLayout;
|
|
12
14
|
defaultLayout?: ResizableLayout;
|
|
13
15
|
disableCursor?: boolean;
|
|
14
16
|
disabled?: boolean;
|
|
@@ -66,7 +68,7 @@ export type ResizableFloatingPanelProps = Omit<ComponentProps<"div">, "style"> &
|
|
|
66
68
|
getAriaValueText?: (size: number) => string;
|
|
67
69
|
style?: ResizableFloatingPanelStyle;
|
|
68
70
|
};
|
|
69
|
-
export declare function ResizablePanelGroup({ className, orientation, variant, disableCursor, children, ...props }: ResizablePanelGroupProps): import("react").JSX.Element;
|
|
71
|
+
export declare function ResizablePanelGroup({ className, orientation, variant, layout, disabled, disableCursor, children, ...props }: ResizablePanelGroupProps): import("react").JSX.Element;
|
|
70
72
|
export declare function ResizablePanel({ className, ...props }: ResizablePanelProps): import("react").JSX.Element;
|
|
71
73
|
export declare function ResizableHandle({ className, variant, withHandle, children, "aria-label": ariaLabel, ...props }: ResizableHandleProps): import("react").JSX.Element;
|
|
72
74
|
export declare function ResizableFloatingPanel({ side, size: controlledSize, defaultSize, onSizeChange, minSize, maxSize, handleVariant, handleLabel, getAriaValueText, className, style, children, ...props }: ResizableFloatingPanelProps): import("react").JSX.Element;
|
package/dist/ui/resizable.js
CHANGED
|
@@ -39,7 +39,7 @@ function useResizeCursor(handleRef, disableCursor) {
|
|
|
39
39
|
};
|
|
40
40
|
}, [handleRef, disableCursor]);
|
|
41
41
|
}
|
|
42
|
-
function ResizablePanelGroup({ className, orientation = "horizontal", variant = "framed", disableCursor = false, children, ...props }) {
|
|
42
|
+
function ResizablePanelGroup({ className, orientation = "horizontal", variant = "framed", layout = "resizable", disabled = false, disableCursor = false, children, ...props }) {
|
|
43
43
|
return /* @__PURE__ */ jsx(ResizableGroupContext.Provider, {
|
|
44
44
|
value: {
|
|
45
45
|
orientation,
|
|
@@ -51,7 +51,9 @@ function ResizablePanelGroup({ className, orientation = "horizontal", variant =
|
|
|
51
51
|
"data-slot": "panel-group",
|
|
52
52
|
"data-surface": "panel",
|
|
53
53
|
"data-variant": variant,
|
|
54
|
+
"data-layout": layout,
|
|
54
55
|
orientation,
|
|
56
|
+
disabled: disabled || layout !== "resizable",
|
|
55
57
|
disableCursor: true,
|
|
56
58
|
className: cn("flex h-full w-full", className),
|
|
57
59
|
...props,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ctrl-ui/react",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.17",
|
|
4
4
|
"description": "100+ React components for Tailwind CSS and shadcn/ui: pickers, trees, editors, canvases, app templates, and AI chat surfaces, with neutral defaults and consumer-owned themes.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|