50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T46d2,"use client" import * as React from "react" import { Field as FieldPrimitive } from "@base-ui/react/field" import { Fieldset as FieldsetPrimitive } from "@base-ui/react/fieldset" import { mergeProps } from "@base-ui/react/merge-props" import { useRender } from "@base-ui/react/use-render" import { IconAlertCircle, IconCheck } from "@tabler/icons-react" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "cn" import { useSizeMorph } from "@/lib/motion" import { useComposedRef } from "@/hooks/use-composed-ref" import { useMergedRef } from "@/hooks/use-merged-ref" import { InputCount, type InputControl, type InputCountProps, } from "@/components/ui/input" import { Separator, type SeparatorProps } from "@/components/ui/separator" type ClassName = string | ((state: State) => string | undefined) | undefined function mergeClassName(base: string, className: ClassName) { return typeof className === "function" ? (state: State) => cn(base, className(state)) : cn(base, className) } const FieldContext = React.createContext(false) type FieldIndicator = "required" | "optional" const FieldIndicatorContext = React.createContext(null) function IndicatorScope({ indicator, children, }: { indicator: FieldIndicator | null | undefined children: React.ReactNode }) { if (indicator === undefined) { return children } return ( {children} ) } type FieldSetProps = FieldsetPrimitive.Root.Props & { indicator?: FieldIndicator | null } function FieldSet({ className, indicator, ...props }: FieldSetProps) { return ( ) } function FieldSetRoot({ className, ...props }: FieldsetPrimitive.Root.Props) { return ( [data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 data-[slot=checkbox-group]:gap-3 data-[slot=radio-group]:gap-3", className )} {...props} /> ) } type FieldLegendProps = FieldsetPrimitive.Legend.Props & { variant?: "legend" | "label" } function FieldLegend({ className, variant = "legend", ...props }: FieldLegendProps) { return ( ) } type FieldGroupProps = useRender.ComponentProps<"div"> & { indicator?: FieldIndicator | null } function FieldGroup({ indicator, ...props }: FieldGroupProps) { return ( ) } function FieldGroupRoot({ className, render, ...props }: useRender.ComponentProps<"div">) { return useRender({ defaultTagName: "div", render, props: mergeProps<"div">( { className: cn( "group/field-group @container/field-group flex w-full min-w-0 flex-col gap-7 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4", className ), }, props, { "data-slot": "field-group" } as React.ComponentProps<"div"> ), }) } const fieldVariants = cva( "group/field flex w-full min-w-0 gap-3 [--field-gap:calc(var(--spacing)*3)]", { variants: { orientation: { vertical: "flex-col *:w-full [&>.sr-only]:w-auto", horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[data-slot=checkbox],[role=checkbox],[role=radio]]:mt-px", responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[data-slot=checkbox],[role=checkbox],[role=radio]]:mt-px", }, }, defaultVariants: { orientation: "vertical", }, } ) type FieldOrientation = NonNullable< VariantProps["orientation"] > type FieldProps = FieldPrimitive.Root.Props & { orientation?: FieldOrientation | null indicator?: FieldIndicator | null } function Field({ className, orientation = "vertical", indicator, ...props }: FieldProps) { const resolvedOrientation = orientation ?? "vertical" return ( ) } function FieldItem({ className, ...props }: FieldPrimitive.Item.Props) { return ( [data-slot=field-content]]:[&>[data-slot=checkbox],[role=checkbox],[role=radio]]:mt-px", className )} {...props} /> ) } function FieldContent({ className, render, ...props }: useRender.ComponentProps<"div">) { return useRender({ defaultTagName: "div", render, props: mergeProps<"div">( { className: cn( "group/field-content flex min-w-0 flex-1 flex-col gap-1 leading-snug [--field-gap:calc(var(--spacing)*1)]", className ), }, props, { "data-slot": "field-content" } as React.ComponentProps<"div"> ), }) } const fieldLabelClassName = "group/field-label peer/field-label flex w-fit min-w-0 items-center gap-2 text-sm leading-snug font-medium text-pretty wrap-anywhere text-foreground select-none group-data-disabled/field:cursor-not-allowed group-data-disabled/field:opacity-50 has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:items-stretch has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:inset-ring-(length:--hairline) has-[>[data-slot=field]]:inset-ring-border has-[>[data-slot=field]]:transition-[background-color,box-shadow] has-[>[data-slot=field]]:duration-150 has-[>[data-slot=field]]:ease-out-cubic has-[>[data-slot=field]]:has-focus-visible:ring-3 has-[>[data-slot=field]]:has-focus-visible:ring-focus-ring has-[>[data-slot=field]]:has-focus-visible:inset-ring-ring has-[>[data-slot=field]]:has-data-checked:bg-muted/60 has-[>[data-slot=field]]:has-data-checked:inset-ring-foreground/25 has-[>[data-slot=field]]:has-[[data-disabled]]:cursor-not-allowed has-[>[data-slot=field]]:has-[[data-disabled]]:opacity-50 *:data-[slot=field]:p-3 has-[>[data-slot=field]]:motion-reduce:transition-none data-disabled:cursor-not-allowed data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-muted-foreground [@media(hover:hover)]:has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50" function StandaloneFieldLabel({ className, render, nativeLabel: _nativeLabel, ...props }: FieldPrimitive.Label.Props) { const resolved = mergeClassName(fieldLabelClassName, className) return useRender({ defaultTagName: "label", render: render as useRender.ComponentProps<"label">["render"], props: mergeProps<"label">( { className: typeof resolved === "function" ? resolved({} as FieldPrimitive.Label.State) : resolved, }, props as React.ComponentProps<"label">, { "data-slot": "field-label" } as React.ComponentProps<"label"> ), }) } function FieldIndicatorMark({ indicator, optionalText, }: { indicator: FieldIndicator optionalText: React.ReactNode }) { return ( ) } type FieldLabelProps = FieldPrimitive.Label.Props & { optionalText?: React.ReactNode } function FieldLabel({ className, children, optionalText = "Optional", ...props }: FieldLabelProps) { const inField = React.useContext(FieldContext) const indicator = React.useContext(FieldIndicatorContext) if (!inField) { return ( {children} ) } return ( {children} {indicator && ( )} ) } function FieldStatus({ className, ...props }: React.ComponentProps<"span">) { return ( ) } const counterControl = "textarea, input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file])" type FieldCounterProps = Omit< InputCountProps, "length" | "maxLength" | "controlRef" > function FieldCounter({ ref, ...props }: FieldCounterProps) { const [counterRef, setRef] = useComposedRef(ref) const controlRef = React.useRef(null) const [count, setCount] = React.useState({ length: 0, maxLength: null as number | null, }) React.useEffect(() => { const field = counterRef.current?.closest("[data-slot=field]") const control = field?.querySelector(counterControl) if (!control) { return } controlRef.current = control let timer: ReturnType | undefined const sync = () => { const length = control.value.length const maxLength = control.maxLength > 0 ? control.maxLength : null setCount((previous) => previous.length === length && previous.maxLength === maxLength ? previous : { length, maxLength } ) } const onReset = () => { clearTimeout(timer) timer = setTimeout(sync) } const onInput = (event: Event) => { if (event.target === control) { sync() } } sync() window.addEventListener("input", onInput) control.form?.addEventListener("reset", onReset) return () => { window.removeEventListener("input", onInput) control.form?.removeEventListener("reset", onReset) clearTimeout(timer) controlRef.current = null } }, [counterRef]) return ( ) } function FieldTitle({ className, render, ...props }: useRender.ComponentProps<"div">) { return useRender({ defaultTagName: "div", render, props: mergeProps<"div">( { className: cn( "flex w-fit min-w-0 items-center gap-2 text-sm leading-snug font-medium text-pretty wrap-anywhere text-foreground group-data-disabled/field:opacity-50", className ), }, props, { "data-slot": "field-title" } as React.ComponentProps<"div"> ), }) } const fieldDescriptionClassName = "min-w-0 text-start text-sm leading-normal font-normal text-pretty wrap-anywhere text-muted-foreground group-data-[orientation=horizontal]/field:text-balance group-data-disabled/field:opacity-50 [&_a:not([data-slot])]:text-foreground [&_a:not([data-slot])]:underline [&_a:not([data-slot])]:decoration-foreground/40 [&_a:not([data-slot])]:underline-offset-4 [&_a:not([data-slot])]:hover:decoration-foreground [[data-variant=legend]+&]:-mt-1.5" function FieldDescription({ className, render, ...props }: FieldPrimitive.Description.Props) { const inField = React.useContext(FieldContext) const resolved = mergeClassName(fieldDescriptionClassName, className) const standalone = useRender({ defaultTagName: "p", render: render as useRender.ComponentProps<"p">["render"], enabled: !inField, props: mergeProps<"p">( { className: typeof resolved === "function" ? resolved({} as FieldPrimitive.Description.State) : resolved, }, props as React.ComponentProps<"p">, { "data-slot": "field-description" } as React.ComponentProps<"p"> ), }) if (!inField) { return standalone } return ( ) } function hasContent(children: React.ReactNode) { return React.Children.toArray(children).some( (child) => typeof child !== "string" || child.trim() !== "" ) } function FieldSeparator({ className, children, ...props }: SeparatorProps) { return ( {children} ) } type FieldErrorMessage = { message?: string } | undefined | null type FieldErrorProps = Omit & { children?: React.ReactNode errors?: FieldErrorMessage[] } function uniqueMessages(errors: FieldErrorMessage[] | undefined) { if (!errors) { return [] } const messages = errors .map((error) => error?.message?.trim()) .filter((message): message is string => Boolean(message)) return [...new Set(messages)] } function renderMessages(messages: string[]) { if (messages.length === 0) { return null } if (messages.length === 1) { return messages[0] } return (

{message}

) } const fieldErrorClassName = "grid min-w-0 grid-rows-[1fr] text-sm leading-normal font-normal text-pretty wrap-anywhere text-destructive transition-[grid-template-rows,opacity,margin-top] duration-200 ease-out-quint data-ending-style:-mt-(--field-gap) data-ending-style:grid-rows-[0fr] data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:-mt-(--field-gap) data-starting-style:grid-rows-[0fr] data-starting-style:opacity-0 motion-reduce:transition-none [&_ul]:flex [&_ul]:list-disc [&_ul]:flex-col [&_ul]:gap-1 [&_ul]:ps-4" function FieldError({ className, children, errors, match, render, ref, ...props }: FieldErrorProps) { const external = errors !== undefined const messages = uniqueMessages(errors) const messageKey = messages.join("\u0000") const [shown, setShown] = React.useState(messages) const [shownKey, setShownKey] = React.useState(messageKey) if (messages.length > 0 && messageKey !== shownKey) { setShownKey(messageKey) setShown(messages) } const content = children ?? (external ? renderMessages(shown) : undefined) const morphRef = useSizeMorph({ axis: "height", duration: 200, }) const errorRef = useMergedRef(ref, morphRef) const resolvedMatch = external ? messages.length > 0 || (children !== undefined && match === true) : match return ( { const inner = (

{errorProps.children}

) const props = errorProps if (typeof render === "function") { return render({ ...props, children: inner }, state) } if (React.isValidElement(render)) { return React.cloneElement(render, props, inner) } return

{inner}

}} {...props} {...(content === undefined ? {} : { children: content })} /> ) } const FieldValidity = FieldPrimitive.Validity export { Field, FieldContent, FieldCounter, FieldDescription, FieldError, FieldGroup, FieldItem, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldStatus, FieldTitle, FieldValidity, fieldVariants, } export type { FieldCounterProps, FieldErrorProps, FieldGroupProps, FieldIndicator, FieldLabelProps, FieldLegendProps, FieldOrientation, FieldProps, FieldSetProps, } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@base-ui/react@^1.8.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40base-ui%2Freact","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@base-ui/react@^1.8.0"}]]}]}],["$","li","@tabler/icons-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40tabler%2Ficons-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@tabler/icons-react"}]]}]}],["$","li","class-variance-authority",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/class-variance-authority","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"class-variance-authority"}]]}]}],["$","li","cn",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/cn","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"cn"}]]}]}]]}],["$","$L50",null,{"namespace":"@hextaui","registryDependencies":["https://hextaui.com/r/theme.json","https://hextaui.com/r/input.json","https://hextaui.com/r/motion.json","https://hextaui.com/r/separator.json","https://hextaui.com/r/use-composed-ref.json","https://hextaui.com/r/use-merged-ref.json"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"components/ui/field.tsx","content":"$52","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]