@codefast/ui 0.3.11-canary.1 → 0.3.11

package/dist/components/progress-circle.js

@@ -1,148 +1,116 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { useAnimatedValue } from "../hooks/use-animated-value.js";
+import { Indicator as ProgressCircleIndicator, ProgressCircle as ProgressCircle$1, ProgressCircleProvider, ProgressCircleSVG, ProgressCircleTrack, ProgressCircleValue } from "../primitives/progress-circle.js";
 import { tv } from "@codefast/tailwind-variants";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
-import { useAnimatedValue } from "../hooks/use-animated-value.js";
-import { Indicator, Provider, Root, SVG, Track, Value } from "../primitives/progress-circle.js";
+//#region src/components/progress-circle.tsx
 const progressCircleVariants = tv({
-    defaultVariants: {
-        size: "md",
-        thickness: "regular",
-        variant: "default"
-    },
-    slots: {
-        indicator: "origin-center",
-        label: "absolute inset-0 flex items-center justify-center text-xs font-medium",
-        root: "relative inline-flex items-center justify-center",
-        svg: "size-full",
-        track: "origin-center"
-    },
-    variants: {
-        size: {
-            sm: {
-                label: "text-[0.625rem]"
-            },
-            md: {
-                label: "text-xs"
-            },
-            lg: {
-                label: "text-sm"
-            },
-            xl: {
-                label: "text-base"
-            },
-            "2xl": {
-                label: "text-lg"
-            }
-        },
-        thickness: {
-            regular: {},
-            thick: {},
-            thin: {}
-        },
-        variant: {
-            default: {
-                indicator: "text-primary",
-                track: "text-primary/20"
-            },
-            destructive: {
-                indicator: "text-destructive",
-                track: "text-destructive/20"
-            }
-        }
-    }
+	defaultVariants: {
+		size: "md",
+		thickness: "regular",
+		variant: "default"
+	},
+	slots: {
+		indicator: "origin-center",
+		label: "absolute inset-0 flex items-center justify-center text-xs font-medium",
+		root: "relative inline-flex items-center justify-center",
+		svg: "size-full",
+		track: "origin-center"
+	},
+	variants: {
+		size: {
+			sm: { label: "text-[0.625rem]" },
+			md: { label: "text-xs" },
+			lg: { label: "text-sm" },
+			xl: { label: "text-base" },
+			"2xl": { label: "text-lg" }
+		},
+		thickness: {
+			regular: {},
+			thick: {},
+			thin: {}
+		},
+		variant: {
+			default: {
+				indicator: "text-primary",
+				track: "text-primary/20"
+			},
+			destructive: {
+				indicator: "text-destructive",
+				track: "text-destructive/20"
+			}
+		}
+	}
 });
-function ProgressCircle({ animate = true, animationDuration = 1000, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = "regular", value = 0, variant = "default", ...props }) {
-    const displayValue = useAnimatedValue(value, animationDuration, animate);
-    const actualSize = useMemo(()=>sizeInPixels ?? getActualSize(size), [
-        sizeInPixels,
-        size
-    ]);
-    const actualThickness = useMemo(()=>strokeWidth ?? getStrokeWidth(thickness, actualSize), [
-        strokeWidth,
-        thickness,
-        actualSize
-    ]);
-    const slots = useMemo(()=>progressCircleVariants({
-            size,
-            thickness,
-            variant
-        }), [
-        variant,
-        size,
-        thickness
-    ]);
-    const shouldShowLabel = showValue || Boolean(customLabel);
-    const renderLabel = useCallback(()=>{
-        if (customLabel) return customLabel({
-            value: displayValue
-        });
-        return `${displayValue.toString()}%`;
-    }, [
-        customLabel,
-        displayValue
-    ]);
-    return /*#__PURE__*/ jsx(Provider, {
-        size: actualSize,
-        strokeWidth: actualThickness,
-        value: value,
-        ...props,
-        children: /*#__PURE__*/ jsxs(Root, {
-            className: slots.root({
-                className: [
-                    className,
-                    classNames?.root
-                ]
-            }),
-            children: [
-                /*#__PURE__*/ jsxs(SVG, {
-                    className: slots.svg({
-                        className: classNames?.svg
-                    }),
-                    children: [
-                        /*#__PURE__*/ jsx(Track, {
-                            className: slots.track({
-                                className: classNames?.track
-                            })
-                        }),
-                        /*#__PURE__*/ jsx(Indicator, {
-                            className: slots.indicator({
-                                className: classNames?.indicator
-                            }),
-                            style: {
-                                transitionDuration: `${animationDuration.toString()}ms`,
-                                transitionProperty: "stroke-dashoffset"
-                            }
-                        })
-                    ]
-                }),
-                shouldShowLabel ? /*#__PURE__*/ jsx(Value, {
-                    className: slots.label({
-                        className: classNames?.label
-                    }),
-                    children: renderLabel()
-                }) : null
-            ]
-        })
-    });
+function ProgressCircle({ animate = true, animationDuration = 1e3, className, classNames, customLabel, showValue = false, size, sizeInPixels, strokeWidth, thickness = "regular", value = 0, variant = "default", ...props }) {
+	const displayValue = useAnimatedValue(value, animationDuration, animate);
+	const actualSize = useMemo(() => sizeInPixels ?? getActualSize(size), [sizeInPixels, size]);
+	const actualThickness = useMemo(() => strokeWidth ?? getStrokeWidth(thickness, actualSize), [
+		strokeWidth,
+		thickness,
+		actualSize
+	]);
+	const slots = useMemo(() => progressCircleVariants({
+		size,
+		thickness,
+		variant
+	}), [
+		variant,
+		size,
+		thickness
+	]);
+	const shouldShowLabel = showValue || Boolean(customLabel);
+	const renderLabel = useCallback(() => {
+		if (customLabel) return customLabel({ value: displayValue });
+		return `${displayValue.toString()}%`;
+	}, [customLabel, displayValue]);
+	return /* @__PURE__ */ jsx(ProgressCircleProvider, {
+		size: actualSize,
+		strokeWidth: actualThickness,
+		value,
+		...props,
+		children: /* @__PURE__ */ jsxs(ProgressCircle$1, {
+			className: slots.root({ className: [className, classNames?.root] }),
+			children: [/* @__PURE__ */ jsxs(ProgressCircleSVG, {
+				className: slots.svg({ className: classNames?.svg }),
+				children: [/* @__PURE__ */ jsx(ProgressCircleTrack, { className: slots.track({ className: classNames?.track }) }), /* @__PURE__ */ jsx(ProgressCircleIndicator, {
+					className: slots.indicator({ className: classNames?.indicator }),
+					style: {
+						transitionDuration: `${animationDuration.toString()}ms`,
+						transitionProperty: "stroke-dashoffset"
+					}
+				})]
+			}), shouldShowLabel ? /* @__PURE__ */ jsx(ProgressCircleValue, {
+				className: slots.label({ className: classNames?.label }),
+				children: renderLabel()
+			}) : null]
+		})
+	});
 }
 ProgressCircle.displayName = "ProgressCircle";
-const getActualSize = (size)=>{
-    const sizeMap = {
-        "2xl": 128,
-        lg: 64,
-        md: 48,
-        sm: 32,
-        xl: 96
-    };
-    return size ? sizeMap[size] : 48;
+/**
+* Maps size variants to actual pixel sizes
+*/
+const getActualSize = (size) => {
+	return size ? {
+		"2xl": 128,
+		lg: 64,
+		md: 48,
+		sm: 32,
+		xl: 96
+	}[size] : 48;
 };
-const getStrokeWidth = (thickness, size)=>{
-    const thicknessMap = {
-        regular: Math.max(3, 0.05 * size),
-        thick: Math.max(4, 0.075 * size),
-        thin: Math.max(2, 0.025 * size)
-    };
-    return thickness ? thicknessMap[thickness] : Math.max(3, 0.05 * size);
+/**
+* Calculates stroke width based on thickness variant and circle size
+*/
+const getStrokeWidth = (thickness, size) => {
+	const thicknessMap = {
+		regular: Math.max(3, size * .05),
+		thick: Math.max(4, size * .075),
+		thin: Math.max(2, size * .025)
+	};
+	return thickness ? thicknessMap[thickness] : Math.max(3, size * .05);
 };
+//#endregion
 export { ProgressCircle, progressCircleVariants };

package/dist/components/progress.d.ts

@@ -1,6 +1,12 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
+
+//#region src/components/progress.d.ts
 type ProgressProps = ComponentProps<typeof ProgressPrimitive.Root>;
-declare function Progress({ className, value, ...props }: ProgressProps): JSX.Element;
-export { Progress };
-export type { ProgressProps };
+declare function Progress({
+  className,
+  value,
+  ...props
+}: ProgressProps): JSX.Element;
+//#endregion
+export { Progress, type ProgressProps };

package/dist/components/progress.js

@@ -1,19 +1,19 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
-import { Indicator, Root } from "@radix-ui/react-progress";
+import { jsx } from "react/jsx-runtime";
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+//#region src/components/progress.tsx
 function Progress({ className, value, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        className: cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
-        "data-slot": "progress",
-        ...props,
-        children: /*#__PURE__*/ jsx(Indicator, {
-            className: "size-full flex-1 bg-primary transition-all",
-            "data-slot": "progress-indicator",
-            style: {
-                transform: `translateX(-${(100 - (value ?? 0)).toString()}%)`
-            }
-        })
-    });
+	return /* @__PURE__ */ jsx(ProgressPrimitive.Root, {
+		className: cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
+		"data-slot": "progress",
+		...props,
+		children: /* @__PURE__ */ jsx(ProgressPrimitive.Indicator, {
+			className: "size-full flex-1 bg-primary transition-all",
+			"data-slot": "progress-indicator",
+			style: { transform: `translateX(-${(100 - (value ?? 0)).toString()}%)` }
+		})
+	});
 }
+//#endregion
 export { Progress };

package/dist/components/radio-cards.d.ts

@@ -1,8 +1,14 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+
+//#region src/components/radio-cards.d.ts
 type RadioCardsProps = ComponentProps<typeof RadioGroupPrimitive.Root>;
 declare function RadioCards(props: RadioCardsProps): JSX.Element;
 type RadioCardsItemProps = ComponentProps<typeof RadioGroupPrimitive.Item>;
-declare function RadioCardsItem({ children, className, ...props }: RadioCardsItemProps): JSX.Element;
-export { RadioCards, RadioCardsItem };
-export type { RadioCardsItemProps, RadioCardsProps };
+declare function RadioCardsItem({
+  children,
+  className,
+  ...props
+}: RadioCardsItemProps): JSX.Element;
+//#endregion
+export { RadioCards, RadioCardsItem, type RadioCardsItemProps, type RadioCardsProps };

package/dist/components/radio-cards.js

@@ -1,30 +1,29 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "@codefast/tailwind-variants";
-import { Indicator, Item, Root } from "@radix-ui/react-radio-group";
 import { Label } from "./label.js";
+import { cn } from "@codefast/tailwind-variants";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+//#region src/components/radio-cards.tsx
 function RadioCards(props) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "radio-cards",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(RadioGroupPrimitive.Root, {
+		"data-slot": "radio-cards",
+		...props
+	});
 }
 function RadioCardsItem({ children, className, ...props }) {
-    return /*#__PURE__*/ jsxs(Label, {
-        className: "flex items-start gap-3 rounded-lg border border-input p-3 transition hover:not-has-disabled:not-has-aria-checked:bg-secondary has-focus-visible:border-ring has-disabled:opacity-50 has-aria-checked:border-primary has-aria-checked:bg-primary/10",
-        "data-slot": "radio-card",
-        children: [
-            /*#__PURE__*/ jsx(Item, {
-                className: cn("peer flex size-4 shrink-0 items-center justify-center rounded-full border border-input text-primary-foreground shadow-xs outline-hidden transition focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:not-aria-checked:border-ring aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40", className),
-                "data-slot": "radio-card-item",
-                ...props,
-                children: /*#__PURE__*/ jsx(Indicator, {
-                    className: "size-1 rounded-full bg-background",
-                    "data-slot": "radio-card-indicator"
-                })
-            }),
-            children
-        ]
-    });
+	return /* @__PURE__ */ jsxs(Label, {
+		className: "flex items-start gap-3 rounded-lg border border-input p-3 transition hover:not-has-disabled:not-has-aria-checked:bg-secondary has-focus-visible:border-ring has-disabled:opacity-50 has-aria-checked:border-primary has-aria-checked:bg-primary/10",
+		"data-slot": "radio-card",
+		children: [/* @__PURE__ */ jsx(RadioGroupPrimitive.Item, {
+			className: cn("peer flex size-4 shrink-0 items-center justify-center rounded-full border border-input text-primary-foreground shadow-xs outline-hidden transition focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:not-aria-checked:border-ring aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40", className),
+			"data-slot": "radio-card-item",
+			...props,
+			children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, {
+				className: "size-1 rounded-full bg-background",
+				"data-slot": "radio-card-indicator"
+			})
+		}), children]
+	});
 }
+//#endregion
 export { RadioCards, RadioCardsItem };

package/dist/components/radio-group.d.ts

@@ -1,8 +1,16 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+
+//#region src/components/radio-group.d.ts
 type RadioGroupProps = ComponentProps<typeof RadioGroupPrimitive.Root>;
-declare function RadioGroup({ className, ...props }: RadioGroupProps): JSX.Element;
+declare function RadioGroup({
+  className,
+  ...props
+}: RadioGroupProps): JSX.Element;
 type RadioGroupItemProps = ComponentProps<typeof RadioGroupPrimitive.Item>;
-declare function RadioGroupItem({ className, ...props }: RadioGroupItemProps): JSX.Element;
-export { RadioGroup, RadioGroupItem };
-export type { RadioGroupItemProps, RadioGroupProps };
+declare function RadioGroupItem({
+  className,
+  ...props
+}: RadioGroupItemProps): JSX.Element;
+//#endregion
+export { RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps };

package/dist/components/radio-group.js

@@ -1,23 +1,25 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
-import { Indicator, Item, Root } from "@radix-ui/react-radio-group";
+import { jsx } from "react/jsx-runtime";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+//#region src/components/radio-group.tsx
 function RadioGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        className: cn("grid gap-2", className),
-        "data-slot": "radio-group",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(RadioGroupPrimitive.Root, {
+		className: cn("grid gap-2", className),
+		"data-slot": "radio-group",
+		...props
+	});
 }
 function RadioGroupItem({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Item, {
-        className: cn("peer inline-flex size-4 shrink-0 items-center justify-center rounded-full border border-input shadow-xs outline-hidden transition hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 aria-invalid:border-destructive aria-invalid:ring-destructive/20 hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 aria-checked:aria-invalid:bg-destructive dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
-        "data-slot": "radio-group-item",
-        ...props,
-        children: /*#__PURE__*/ jsx(Indicator, {
-            className: "size-1 rounded-full bg-background",
-            "data-slot": "radio-group-indicator"
-        })
-    });
+	return /* @__PURE__ */ jsx(RadioGroupPrimitive.Item, {
+		className: cn("peer inline-flex size-4 shrink-0 items-center justify-center rounded-full border border-input shadow-xs outline-hidden transition hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 aria-invalid:border-destructive aria-invalid:ring-destructive/20 hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 aria-checked:aria-invalid:bg-destructive dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
+		"data-slot": "radio-group-item",
+		...props,
+		children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, {
+			className: "size-1 rounded-full bg-background",
+			"data-slot": "radio-group-indicator"
+		})
+	});
 }
+//#endregion
 export { RadioGroup, RadioGroupItem };

package/dist/components/radio.d.ts

@@ -1,7 +1,14 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
+
+//#region src/components/radio.d.ts
 interface RadioProps extends Omit<ComponentProps<"input">, "type"> {
-    onValueChange?: (value: string) => void;
+  onValueChange?: (value: string) => void;
 }
-declare function Radio({ className, onChange, onValueChange, ...props }: RadioProps): JSX.Element;
-export { Radio };
-export type { RadioProps };
+declare function Radio({
+  className,
+  onChange,
+  onValueChange,
+  ...props
+}: RadioProps): JSX.Element;
+//#endregion
+export { Radio, type RadioProps };

package/dist/components/radio.js

@@ -1,14 +1,16 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
+import { jsx } from "react/jsx-runtime";
 import { composeEventHandlers } from "@radix-ui/primitive";
+//#region src/components/radio.tsx
 function Radio({ className, onChange, onValueChange, ...props }) {
-    return /*#__PURE__*/ jsx("input", {
-        className: cn("peer inline-flex size-4 shrink-0 appearance-none items-center justify-center rounded-full border border-input shadow-xs outline-hidden after:size-full after:rounded-full after:bg-background after:transition-[width,height] checked:border-primary checked:bg-primary checked:after:size-1 hover:not-disabled:not-checked:border-ring/60 focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:not-checked:border-ring focus-visible:checked:ring-primary/20 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 checked:aria-invalid:bg-destructive hover:not-disabled:not-checked:aria-invalid:border-destructive/60 dark:not-checked:after:bg-input/30 dark:focus-visible:checked:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
-        "data-slot": "radio",
-        type: "radio",
-        onChange: composeEventHandlers(onChange, (event)=>onValueChange?.(event.currentTarget.value)),
-        ...props
-    });
+	return /* @__PURE__ */ jsx("input", {
+		className: cn("peer inline-flex size-4 shrink-0 appearance-none items-center justify-center rounded-full border border-input shadow-xs outline-hidden after:size-full after:rounded-full after:bg-background after:transition-[width,height] checked:border-primary checked:bg-primary checked:after:size-1 hover:not-disabled:not-checked:border-ring/60 focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:not-checked:border-ring focus-visible:checked:ring-primary/20 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 checked:aria-invalid:bg-destructive hover:not-disabled:not-checked:aria-invalid:border-destructive/60 dark:not-checked:after:bg-input/30 dark:focus-visible:checked:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
+		"data-slot": "radio",
+		type: "radio",
+		onChange: composeEventHandlers(onChange, (event) => onValueChange?.(event.currentTarget.value)),
+		...props
+	});
 }
+//#endregion
 export { Radio };

package/dist/components/resizable.d.ts

@@ -1,12 +1,23 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as ResizablePrimitive from "react-resizable-panels";
+
+//#region src/components/resizable.d.ts
 type ResizableGroupProps = ComponentProps<typeof ResizablePrimitive.Group>;
-declare function ResizableGroup({ className, ...props }: ResizableGroupProps): JSX.Element;
+declare function ResizableGroup({
+  className,
+  ...props
+}: ResizableGroupProps): JSX.Element;
 type ResizablePanelProps = ComponentProps<typeof ResizablePrimitive.Panel>;
-declare function ResizablePanel({ ...props }: ResizablePanelProps): JSX.Element;
+declare function ResizablePanel({
+  ...props
+}: ResizablePanelProps): JSX.Element;
 interface ResizableSeparatorProps extends ComponentProps<typeof ResizablePrimitive.Separator> {
-    withHandle?: boolean;
+  withHandle?: boolean;
 }
-declare function ResizableSeparator({ className, withHandle, ...props }: ResizableSeparatorProps): JSX.Element;
-export { ResizableGroup, ResizablePanel, ResizableSeparator };
-export type { ResizableGroupProps, ResizablePanelProps, ResizableSeparatorProps };
+declare function ResizableSeparator({
+  className,
+  withHandle,
+  ...props
+}: ResizableSeparatorProps): JSX.Element;
+//#endregion
+export { ResizableGroup, type ResizableGroupProps, ResizablePanel, type ResizablePanelProps, ResizableSeparator, type ResizableSeparatorProps };

package/dist/components/resizable.js

@@ -1,32 +1,32 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
 import { GripVerticalIcon } from "lucide-react";
-import { Group, Panel, Separator } from "react-resizable-panels";
+import { jsx } from "react/jsx-runtime";
+import * as ResizablePrimitive from "react-resizable-panels";
+//#region src/components/resizable.tsx
 function ResizableGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Group, {
-        className: cn("flex size-full", className),
-        "data-slot": "resizable-group",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(ResizablePrimitive.Group, {
+		className: cn("flex size-full", className),
+		"data-slot": "resizable-group",
+		...props
+	});
 }
 function ResizablePanel({ ...props }) {
-    return /*#__PURE__*/ jsx(Panel, {
-        "data-slot": "resizable-panel",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(ResizablePrimitive.Panel, {
+		"data-slot": "resizable-panel",
+		...props
+	});
 }
 function ResizableSeparator({ className, withHandle, ...props }) {
-    return /*#__PURE__*/ jsx(Separator, {
-        className: cn("flex items-center justify-center bg-border outline-hidden focus-visible:bg-ring focus-visible:ring-3 focus-visible:ring-ring/50", "aria-[orientation=vertical]:w-px", "aria-[orientation=horizontal]:h-px", className),
-        "data-slot": "resizable-separator",
-        ...props,
-        children: withHandle ? /*#__PURE__*/ jsx("div", {
-            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border",
-            children: /*#__PURE__*/ jsx(GripVerticalIcon, {
-                className: "size-2.5"
-            })
-        }) : null
-    });
+	return /* @__PURE__ */ jsx(ResizablePrimitive.Separator, {
+		className: cn("flex items-center justify-center bg-border outline-hidden focus-visible:bg-ring focus-visible:ring-3 focus-visible:ring-ring/50", "aria-[orientation=vertical]:w-px", "aria-[orientation=horizontal]:h-px", className),
+		"data-slot": "resizable-separator",
+		...props,
+		children: withHandle ? /* @__PURE__ */ jsx("div", {
+			className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border",
+			children: /* @__PURE__ */ jsx(GripVerticalIcon, { className: "size-2.5" })
+		}) : null
+	});
 }
+//#endregion
 export { ResizableGroup, ResizablePanel, ResizableSeparator };