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/1o6_421saitt-.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/1o6_421saitt-.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:T5dda,"use client"; import { cn } from "cn"; import { Slot as SlotPrimitive } from "radix-ui"; import * as React from "react"; import { useComposedRefs } from "@/lib/compose-refs"; import { VisuallyHiddenInput } from "@/registry/bases/radix/components/visually-hidden-input"; import { useAsRef } from "@/registry/bases/radix/hooks/use-as-ref"; import { useIsomorphicLayoutEffect } from "@/registry/bases/radix/hooks/use-isomorphic-layout-effect"; import { useLazyRef } from "@/registry/bases/radix/hooks/use-lazy-ref"; import { Button } from "@/registry/bases/radix/ui/button"; import { Input } from "@/registry/bases/radix/ui/input"; import { Textarea } from "@/registry/bases/radix/ui/textarea"; import { IconPlaceholder } from "@/registry/icons/icon-placeholder"; const ROOT_NAME = "KeyValue"; const LIST_NAME = "KeyValueList"; const ITEM_NAME = "KeyValueItem"; const KEY_INPUT_NAME = "KeyValueKeyInput"; const VALUE_INPUT_NAME = "KeyValueValueInput"; const REMOVE_NAME = "KeyValueRemove"; const ADD_NAME = "KeyValueAdd"; const ERROR_NAME = "KeyValueError"; type Orientation = "vertical" | "horizontal"; type Field = "key" | "value"; interface DivProps extends React.ComponentProps<"div"> { asChild?: boolean; } type RootElement = React.ComponentRef; type KeyInputElement = React.ComponentRef; type RemoveElement = React.ComponentRef; type AddElement = React.ComponentRef; function getErrorId(rootId: string, itemId: string, field: Field) { return `${rootId}-${itemId}-${field}-error`; } function removeQuotes(string: string, shouldStrip: boolean): string { if (!shouldStrip) return string; const trimmed = string.trim(); if ( (trimmed.startsWith('"') && trimmed.endsWith('"')) || (trimmed.startsWith("'") && trimmed.endsWith("'")) ) { return trimmed.slice(1, -1); } return trimmed; } interface Store { subscribe: (callback: () => void) => () => void; getState: () => KeyValueState; setState: ( key: K, value: KeyValueState[K], ) => void; notify: () => void; } function useStore( selector: (state: KeyValueState) => T, ogStore?: Store | null, ): T { const contextStore = React.useContext(StoreContext); const store = ogStore ?? contextStore; if (!store) { throw new Error(`\`useStore\` must be used within \`${ROOT_NAME}\``); } const getSnapshot = React.useCallback( () => selector(store.getState()), [store, selector], ); return React.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot); } interface ItemData { id: string; key: string; value: string; } interface KeyValueState { value: ItemData[]; focusedId: string | null; errors: Record; } const StoreContext = React.createContext(null); function useStoreContext(consumerName: string) { const context = React.useContext(StoreContext); if (!context) { throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``); } return context; } interface KeyValueContextValue { onPaste?: (event: ClipboardEvent, items: ItemData[]) => void; onAdd?: (value: ItemData) => void; onRemove?: (value: ItemData) => void; onKeyValidate?: (key: string, value: ItemData[]) => string | undefined; onValueValidate?: ( value: string, key: string, items: ItemData[], ) => string | undefined; rootId: string; maxItems?: number; minItems: number; keyPlaceholder: string; valuePlaceholder: string; allowDuplicateKeys: boolean; enablePaste: boolean; trim: boolean; stripQuotes: boolean; disabled: boolean; readOnly: boolean; required: boolean; } const KeyValueContext = React.createContext(null); function useKeyValueContext(consumerName: string) { const context = React.useContext(KeyValueContext); if (!context) { throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``); } return context; } interface KeyValueProps extends Omit { id?: string; defaultValue?: ItemData[]; value?: ItemData[]; onValueChange?: (value: ItemData[]) => void; maxItems?: number; minItems?: number; keyPlaceholder?: string; valuePlaceholder?: string; name?: string; allowDuplicateKeys?: boolean; enablePaste?: boolean; trim?: boolean; stripQuotes?: boolean; disabled?: boolean; readOnly?: boolean; required?: boolean; onPaste?: (event: ClipboardEvent, items: ItemData[]) => void; onAdd?: (value: ItemData) => void; onRemove?: (value: ItemData) => void; onKeyValidate?: (key: string, value: ItemData[]) => string | undefined; onValueValidate?: ( value: string, key: string, items: ItemData[], ) => string | undefined; } function KeyValue(props: KeyValueProps) { const { value: valueProp, defaultValue, onValueChange, onPaste, onAdd, onRemove, onKeyValidate, onValueValidate, maxItems, minItems = 0, keyPlaceholder = "Key", valuePlaceholder = "Value", allowDuplicateKeys = false, asChild, enablePaste = true, trim = true, stripQuotes = true, disabled = false, readOnly = false, required = false, className, id, name, ref, ...rootProps } = props; const instanceId = React.useId(); const rootId = id ?? instanceId; const [formTrigger, setFormTrigger] = React.useState( null, ); const composedRef = useComposedRefs(ref, (node) => setFormTrigger(node)); const isFormControl = formTrigger ? !!formTrigger.closest("form") : true; const listenersRef = useLazyRef(() => new Set<() => void>()); const stateRef = useLazyRef(() => ({ value: valueProp ?? defaultValue ?? [{ id: crypto.randomUUID(), key: "", value: "" }], focusedId: null, errors: {}, })); const propsRef = useAsRef({ onValueChange }); const store = React.useMemo(() => { return { subscribe: (cb) => { listenersRef.current.add(cb); return () => listenersRef.current.delete(cb); }, getState: () => stateRef.current, setState: (key, val) => { if (Object.is(stateRef.current[key], val)) return; if (key === "value" && Array.isArray(val)) { stateRef.current.value = val as ItemData[]; propsRef.current.onValueChange?.(val as ItemData[]); } else { stateRef.current[key] = val; } store.notify(); }, notify: () => { for (const cb of listenersRef.current) { cb(); } }, }; }, [listenersRef, stateRef, propsRef]); const value = useStore((state) => state.value, store); const errors = useStore((state) => state.errors, store); const isInvalid = Object.keys(errors).length > 0; useIsomorphicLayoutEffect(() => { if (valueProp !== undefined) { store.setState("value", valueProp); } }, [valueProp]); const contextValue = React.useMemo( () => ({ onPaste, onAdd, onRemove, onKeyValidate, onValueValidate, rootId, maxItems, minItems, keyPlaceholder, valuePlaceholder, allowDuplicateKeys, enablePaste, trim, stripQuotes, disabled, readOnly, required, }), [ onPaste, onAdd, onRemove, onKeyValidate, onValueValidate, rootId, disabled, readOnly, required, maxItems, minItems, keyPlaceholder, valuePlaceholder, allowDuplicateKeys, enablePaste, trim, stripQuotes, ], ); const RootPrimitive = asChild ? SlotPrimitive.Slot : "div"; return ( {isFormControl && ( )} ); } interface KeyValueListProps extends DivProps { orientation?: Orientation; } function KeyValueList(props: KeyValueListProps) { const { orientation = "vertical", asChild, className, ...listProps } = props; const value = useStore((state) => state.value); const ListPrimitive = asChild ? SlotPrimitive.Slot : "div"; return ( {value.map((item) => { const children = React.Children.toArray(props.children); return ( {children} ); })} ); } const KeyValueItemContext = React.createContext(null); function useKeyValueItemContext(consumerName: string) { const context = React.useContext(KeyValueItemContext); if (!context) { throw new Error(`\`${consumerName}\` must be used within \`${LIST_NAME}\``); } return context; } interface KeyValueItemProps extends React.ComponentProps<"div"> { asChild?: boolean; } function KeyValueItem(props: KeyValueItemProps) { const { asChild, className, ...itemProps } = props; const itemData = useKeyValueItemContext(ITEM_NAME); const focusedId = useStore((state) => state.focusedId); const ItemPrimitive = asChild ? SlotPrimitive.Slot : "div"; return ( ); } interface KeyValueKeyInputProps extends React.ComponentProps<"input"> { asChild?: boolean; } function KeyValueKeyInput(props: KeyValueKeyInputProps) { const { onChange: onChangeProp, onPaste: onPasteProp, asChild, disabled, readOnly, required, ...keyInputProps } = props; const context = useKeyValueContext(KEY_INPUT_NAME); const itemData = useKeyValueItemContext(KEY_INPUT_NAME); const store = useStoreContext(KEY_INPUT_NAME); const errors = useStore((state) => state.errors); const propsRef = useAsRef({ onChange: onChangeProp, onPaste: onPasteProp, }); const isDisabled = disabled || context.disabled; const isReadOnly = readOnly || context.readOnly; const isRequired = required || context.required; const isInvalid = errors[itemData.id]?.key !== undefined; const onChange = React.useCallback( (event: React.ChangeEvent) => { const state = store.getState(); const newValue = state.value.map((item) => { if (item.id !== itemData.id) return item; const updated = { ...item, key: event.target.value }; if (context.trim) updated.key = updated.key.trim(); return updated; }); store.setState("value", newValue); const updatedItemData = newValue.find((item) => item.id === itemData.id); if (updatedItemData) { const errors: { key?: string; value?: string } = {}; if (context.onKeyValidate) { const keyError = context.onKeyValidate(updatedItemData.key, newValue); if (keyError) errors.key = keyError; } if (!context.allowDuplicateKeys) { const duplicateKey = newValue.find( (item) => item.id !== updatedItemData.id && item.key === updatedItemData.key && updatedItemData.key !== "", ); if (duplicateKey) { errors.key = "Duplicate key"; } } if (context.onValueValidate) { const valueError = context.onValueValidate( updatedItemData.value, updatedItemData.key, newValue, ); if (valueError) errors.value = valueError; } const newErrorsState = { ...state.errors }; if (Object.keys(errors).length > 0) { newErrorsState[itemData.id] = errors; } else { delete newErrorsState[itemData.id]; } store.setState("errors", newErrorsState); } propsRef.current.onChange?.(event); }, [store, itemData.id, context, propsRef], ); const onPaste = React.useCallback( (event: React.ClipboardEvent) => { if (!context.enablePaste) return; propsRef.current.onPaste?.(event); if (event.defaultPrevented) return; const content = event.clipboardData.getData("text"); const lines = content.split(/\r?\n/).filter((line) => line.trim()); if (lines.length > 1) { event.preventDefault(); const parsed: ItemData[] = []; for (const line of lines) { let key = ""; let value = ""; if (line.includes("=")) { const parts = line.split("="); key = parts[0]?.trim() ?? ""; value = removeQuotes( parts.slice(1).join("=").trim(), context.stripQuotes, ); } else if (line.includes(":")) { const parts = line.split(":"); key = parts[0]?.trim() ?? ""; value = removeQuotes( parts.slice(1).join(":").trim(), context.stripQuotes, ); } else if (/\s{2,}|\t/.test(line)) { const parts = line.split(/\s{2,}|\t/); key = parts[0]?.trim() ?? ""; value = removeQuotes( parts.slice(1).join(" ").trim(), context.stripQuotes, ); } if (key) { parsed.push({ id: crypto.randomUUID(), key, value }); } } if (parsed.length > 0) { const state = store.getState(); const currentIndex = state.value.findIndex( (item) => item.id === itemData.id, ); let newValue: ItemData[]; if (itemData.key === "" && itemData.value === "") { newValue = [ ...state.value.slice(0, currentIndex), ...parsed, ...state.value.slice(currentIndex + 1), ]; } else { newValue = [ ...state.value.slice(0, currentIndex + 1), ...parsed, ...state.value.slice(currentIndex + 1), ]; } if (context.maxItems !== undefined) { newValue = newValue.slice(0, context.maxItems); } store.setState("value", newValue); if (context.onPaste) { context.onPaste( event.nativeEvent as unknown as ClipboardEvent, parsed, ); } } } }, [context, store, itemData, propsRef], ); const KeyInputPrimitive = asChild ? SlotPrimitive.Slot : Input; return ( ); } interface KeyValueValueInputProps extends Omit< React.ComponentProps<"textarea">, "rows" > { maxRows?: number; asChild?: boolean; } function KeyValueValueInput(props: KeyValueValueInputProps) { const { onChange: onChangeProp, asChild, disabled, readOnly, required, className, maxRows, style, ...valueInputProps } = props; const context = useKeyValueContext(VALUE_INPUT_NAME); const itemData = useKeyValueItemContext(VALUE_INPUT_NAME); const store = useStoreContext(VALUE_INPUT_NAME); const errors = useStore((state) => state.errors); const propsRef = useAsRef({ onChange: onChangeProp, }); const isDisabled = disabled || context.disabled; const isReadOnly = readOnly || context.readOnly; const isRequired = required || context.required; const isInvalid = errors[itemData.id]?.value !== undefined; const maxHeight = maxRows ? `calc(${maxRows} * 1.5em + 1rem)` : undefined; const onChange = React.useCallback( (event: React.ChangeEvent) => { propsRef.current.onChange?.(event); const state = store.getState(); const newValue = state.value.map((item) => { if (item.id !== itemData.id) return item; const updated = { ...item, value: event.target.value }; if (context.trim) updated.value = updated.value.trim(); return updated; }); store.setState("value", newValue); const updatedItemData = newValue.find((item) => item.id === itemData.id); if (updatedItemData) { const errors: { key?: string; value?: string } = {}; if (context.onKeyValidate) { const keyError = context.onKeyValidate(updatedItemData.key, newValue); if (keyError) errors.key = keyError; } if (!context.allowDuplicateKeys) { const duplicateKey = newValue.find( (item) => item.id !== updatedItemData.id && item.key === updatedItemData.key && updatedItemData.key !== "", ); if (duplicateKey) { errors.key = "Duplicate key"; } } if (context.onValueValidate) { const valueError = context.onValueValidate( updatedItemData.value, updatedItemData.key, newValue, ); if (valueError) errors.value = valueError; } const newErrorsState = { ...state.errors }; if (Object.keys(errors).length > 0) { newErrorsState[itemData.id] = errors; } else { delete newErrorsState[itemData.id]; } store.setState("errors", newErrorsState); } }, [store, itemData.id, context, propsRef], ); const ValueInputPrimitive = asChild ? SlotPrimitive.Slot : Textarea; return ( ); } interface KeyValueRemoveProps extends React.ComponentProps {} function KeyValueRemove(props: KeyValueRemoveProps) { const { onClick: onClickProp, children, ...removeProps } = props; const context = useKeyValueContext(REMOVE_NAME); const itemData = useKeyValueItemContext(REMOVE_NAME); const store = useStoreContext(REMOVE_NAME); const propsRef = useAsRef({ onClick: onClickProp, }); const value = useStore((state) => state.value); const isDisabled = context.disabled || value.length <= context.minItems; const onClick = React.useCallback( (event: React.MouseEvent) => { propsRef.current.onClick?.(event); const state = store.getState(); if (state.value.length <= context.minItems) return; const itemToRemove = state.value.find((item) => item.id === itemData.id); if (!itemToRemove) return; const newValue = state.value.filter((item) => item.id !== itemData.id); const newErrors = { ...state.errors }; delete newErrors[itemData.id]; store.setState("value", newValue); store.setState("errors", newErrors); context.onRemove?.(itemToRemove); }, [store, context, itemData.id, propsRef], ); return ( ); } function KeyValueAdd(props: React.ComponentProps) { const { onClick: onClickProp, children, ...addProps } = props; const context = useKeyValueContext(ADD_NAME); const store = useStoreContext(ADD_NAME); const propsRef = useAsRef({ onClick: onClickProp, }); const value = useStore((state) => state.value); const isDisabled = context.disabled || (context.maxItems !== undefined && value.length >= context.maxItems); const onClick = React.useCallback( (event: React.MouseEvent) => { propsRef.current.onClick?.(event); const state = store.getState(); if ( context.maxItems !== undefined && state.value.length >= context.maxItems ) { return; } const newItem: ItemData = { id: crypto.randomUUID(), key: "", value: "", }; const newValue = [...state.value, newItem]; store.setState("value", newValue); store.setState("focusedId", newItem.id); context.onAdd?.(newItem); }, [store, context, propsRef], ); return ( ); } interface KeyValueErrorProps extends DivProps { field: Field; } function KeyValueError(props: KeyValueErrorProps) { const { field, asChild, className, ...errorProps } = props; const context = useKeyValueContext(ERROR_NAME); const itemData = useKeyValueItemContext(ERROR_NAME); const errors = useStore((state) => state.errors); const error = errors[itemData.id]?.[field]; if (!error) return null; const ErrorPrimitive = asChild ? SlotPrimitive.Slot : "span"; return ( {error} ); } export { type ItemData as KeyValueItemData, KeyValue, KeyValueAdd, KeyValueError, KeyValueItem, KeyValueKeyInput, KeyValueList, type KeyValueProps, KeyValueRemove, KeyValueValueInput, useStore as useKeyValueStore, }; 53:Tfef,"use client"; import * as React from "react"; type InputValue = string[] | string; interface VisuallyHiddenInputProps extends Omit< React.InputHTMLAttributes, "value" | "checked" | "onReset" > { value?: T; checked?: boolean; control: HTMLElement | null; bubbles?: boolean; } function VisuallyHiddenInput( props: VisuallyHiddenInputProps, ) { const { control, value, checked, bubbles = true, type = "hidden", style, ...inputProps } = props; const isCheckInput = React.useMemo( () => type === "checkbox" || type === "radio" || type === "switch", [type], ); const inputRef = React.useRef(null); const prevValueRef = React.useRef<{ value: T | boolean | undefined; previous: T | boolean | undefined; }>({ value: isCheckInput ? checked : value, previous: isCheckInput ? checked : value, }); const prevValue = React.useMemo(() => { const currentValue = isCheckInput ? checked : value; if (prevValueRef.current.value !== currentValue) { prevValueRef.current.previous = prevValueRef.current.value; prevValueRef.current.value = currentValue; } return prevValueRef.current.previous; }, [isCheckInput, value, checked]); const [controlSize, setControlSize] = React.useState<{ width?: number; height?: number; }>({}); React.useLayoutEffect(() => { if (!control) { setControlSize({}); return; } setControlSize({ width: control.offsetWidth, height: control.offsetHeight, }); if (typeof window === "undefined") return; const resizeObserver = new ResizeObserver((entries) => { if (!Array.isArray(entries) || !entries.length) return; const entry = entries[0]; if (!entry) return; let width: number; let height: number; if ("borderBoxSize" in entry) { const borderSizeEntry = entry.borderBoxSize; const borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry; width = borderSize.inlineSize; height = borderSize.blockSize; } else { width = control.offsetWidth; height = control.offsetHeight; } setControlSize({ width, height }); }); resizeObserver.observe(control, { box: "border-box" }); return () => { resizeObserver.disconnect(); }; }, [control]); React.useEffect(() => { const input = inputRef.current; if (!input) return; const inputProto = window.HTMLInputElement.prototype; const propertyKey = isCheckInput ? "checked" : "value"; const eventType = isCheckInput ? "click" : "input"; const currentValue = isCheckInput ? checked : value; const serializedCurrentValue = isCheckInput ? checked : typeof value === "object" && value !== null ? JSON.stringify(value) : value; const descriptor = Object.getOwnPropertyDescriptor(inputProto, propertyKey); const setter = descriptor?.set; if (prevValue !== currentValue && setter) { const event = new Event(eventType, { bubbles }); setter.call(input, serializedCurrentValue); input.dispatchEvent(event); } }, [prevValue, value, checked, bubbles, isCheckInput]); const composedStyle = React.useMemo(() => { return { ...style, ...(controlSize.width !== undefined && controlSize.height !== undefined ? controlSize : {}), border: 0, clip: "rect(0 0 0 0)", clipPath: "inset(50%)", height: "1px", margin: "-1px", overflow: "hidden", padding: 0, position: "absolute", whiteSpace: "nowrap", width: "1px", }; }, [style, controlSize]); return ( ); } export { VisuallyHiddenInput }; 54:T76f,/** * @see https://github.com/radix-ui/primitives/blob/main/packages/react/compose-refs/src/compose-refs.tsx */ import * as React from "react"; type PossibleRef = React.Ref | undefined; /** * Set a given ref to a given value * This utility takes care of different types of refs: callback refs and RefObject(s) */ function setRef(ref: PossibleRef, value: T) { if (typeof ref === "function") { return ref(value); } if (ref !== null && ref !== undefined) { ref.current = value; } } /** * A utility to compose multiple refs together * Accepts callback refs and RefObject(s) */ function composeRefs(...refs: PossibleRef[]): React.RefCallback { return (node) => { let hasCleanup = false; const cleanups = refs.map((ref) => { const cleanup = setRef(ref, node); if (!hasCleanup && typeof cleanup === "function") { hasCleanup = true; } return cleanup; }); // React <19 will log an error to the console if a callback ref returns a // value. We don't use ref cleanups internally so this will only happen if a // user's ref callback returns a value, which we only expect if they are // using the cleanup functionality added in React 19. if (hasCleanup) { return () => { for (let i = 0; i < cleanups.length; i++) { const cleanup = cleanups[i]; if (typeof cleanup === "function") { cleanup(); } else { setRef(refs[i], null); } } }; } }; } /** * A custom hook that composes multiple refs * Accepts callback refs and RefObject(s) */ function useComposedRefs(...refs: PossibleRef[]): React.RefCallback { // oxlint-disable-next-line react/exhaustive-deps -- we want to memoize by all values return React.useCallback(composeRefs(...refs), refs); } export { composeRefs, useComposedRefs }; 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","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"}]]}]}],["$","li","radix-ui",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/radix-ui","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":"radix-ui"}]]}]}]]}],["$","$L50",null,{"namespace":"@catalogs","registryDependencies":["button","input","textarea","@diceui/use-as-ref","@diceui/use-isomorphic-layout-effect","@diceui/use-lazy-ref"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"ui/key-value.tsx","content":"$52","type":"registry:ui","target":""},{"path":"components/visually-hidden-input.tsx","content":"$53","type":"registry:component","target":""},{"path":"lib/compose-refs.ts","content":"$54","type":"registry:lib","target":""}],"className":"h-[70svh] min-h-80"}]]}]