mirror of
https://github.com/LukeHagar/better-auth.git
synced 2025-12-09 20:27:44 +00:00
64 lines
2.2 KiB
TypeScript
64 lines
2.2 KiB
TypeScript
import { cn } from "@/libs/cn";
|
|
import type { DynamicProps, HandleProps, RootProps } from "@corvu/resizable";
|
|
import ResizablePrimitive from "@corvu/resizable";
|
|
import type { ValidComponent, VoidProps } from "solid-js";
|
|
import { Show, splitProps } from "solid-js";
|
|
|
|
export const ResizablePanel = ResizablePrimitive.Panel;
|
|
|
|
type resizableProps<T extends ValidComponent = "div"> = RootProps<T> & {
|
|
class?: string;
|
|
};
|
|
|
|
export const Resizable = <T extends ValidComponent = "div">(
|
|
props: DynamicProps<T, resizableProps<T>>,
|
|
) => {
|
|
const [local, rest] = splitProps(props as resizableProps, ["class"]);
|
|
|
|
return <ResizablePrimitive class={cn("size-full", local.class)} {...rest} />;
|
|
};
|
|
|
|
type resizableHandleProps<T extends ValidComponent = "button"> = VoidProps<
|
|
HandleProps<T> & {
|
|
class?: string;
|
|
withHandle?: boolean;
|
|
}
|
|
>;
|
|
|
|
export const ResizableHandle = <T extends ValidComponent = "button">(
|
|
props: DynamicProps<T, resizableHandleProps<T>>,
|
|
) => {
|
|
const [local, rest] = splitProps(props as resizableHandleProps, [
|
|
"class",
|
|
"withHandle",
|
|
]);
|
|
|
|
return (
|
|
<ResizablePrimitive.Handle
|
|
class={cn(
|
|
"flex w-px items-center justify-center bg-border transition-shadow focus-visible:outline-none focus-visible:ring-[1.5px] focus-visible:ring-ring focus-visible:ring-offset-1 data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full",
|
|
local.class,
|
|
)}
|
|
{...rest}
|
|
>
|
|
<Show when={local.withHandle}>
|
|
<div class="z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-2.5 w-2.5"
|
|
viewBox="0 0 15 15"
|
|
>
|
|
<path
|
|
fill="currentColor"
|
|
fill-rule="evenodd"
|
|
d="M5.5 4.625a1.125 1.125 0 1 0 0-2.25a1.125 1.125 0 0 0 0 2.25m4 0a1.125 1.125 0 1 0 0-2.25a1.125 1.125 0 0 0 0 2.25M10.625 7.5a1.125 1.125 0 1 1-2.25 0a1.125 1.125 0 0 1 2.25 0M5.5 8.625a1.125 1.125 0 1 0 0-2.25a1.125 1.125 0 0 0 0 2.25m5.125 2.875a1.125 1.125 0 1 1-2.25 0a1.125 1.125 0 0 1 2.25 0M5.5 12.625a1.125 1.125 0 1 0 0-2.25a1.125 1.125 0 0 0 0 2.25"
|
|
clip-rule="evenodd"
|
|
/>
|
|
<title>Resizable handle</title>
|
|
</svg>
|
|
</div>
|
|
</Show>
|
|
</ResizablePrimitive.Handle>
|
|
);
|
|
};
|