4f: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"] 50: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"] 51:T20de,"use client"; import type { ComponentProps, ReactNode } from "react"; import { cn } from "../../../lib/utils"; import { Collapsible, CollapsiblePanel, CollapsibleTrigger } from "../collapsible/collapsible"; const CLASS_TYPES = new Set([ "ReactNode", "ReactElement", "HTMLElement", "HTMLProps", "MouseEvent", "ChangeEvent", "KeyboardEvent", "FocusEvent", "FormEvent", ]); const SEPARATORS = new Set(["|", "&", "(", ")", "<", ">", "[", "]", ",", " "]); const codeClass = "font-mono text-xs leading-5 text-[var(--prop-code-color,var(--foreground))]"; const typeCodeClass = "font-mono text-xs leading-5 text-[var(--prop-type-color,var(--muted-foreground))]"; const typeClassClass = "text-[var(--prop-type-class-color,var(--foreground))]"; const stringValueClass = "text-[var(--prop-string-color,var(--foreground))]"; const booleanValueClass = "text-[var(--prop-boolean-color,var(--foreground))]"; const numberValueClass = "text-[var(--prop-number-color,var(--foreground))]"; const functionValueClass = "text-[var(--prop-function-color,var(--foreground))]"; function isSeparator(char: string): boolean { return SEPARATORS.has(char); } function isPascalCase(text: string): boolean { if (text.length === 0) { return false; } const firstChar = text[0]; const isFirstCharUppercase = firstChar === firstChar.toUpperCase() && firstChar !== firstChar.toLowerCase(); const hasOnlyLetters = text.split("").every((char) => (char >= "a" && char <= "z") || (char >= "A" && char <= "Z")); return isFirstCharUppercase && hasOnlyLetters; } function isNumber(value: string): boolean { if (value.length === 0) { return false; } let startIndex = 0; if (value[0] === "-") { if (value.length === 1) { return false; } startIndex = 1; } let hasDecimal = false; for (let i = startIndex; i < value.length; i++) { const char = value[i]; if (char === ".") { if (hasDecimal) { return false; // Multiple decimals } hasDecimal = true; } else if (char < "0" || char > "9") { return false; } } return true; } function splitTypeString(typeString: string): string[] { const parts: string[] = []; let current = ""; for (const char of typeString) { if (isSeparator(char)) { if (current) { parts.push(current); current = ""; } parts.push(char); } else { current += char; } } if (current) { parts.push(current); } return parts; } function highlightType(typeString: string) { const parts = splitTypeString(typeString); return parts.map((part, index) => { const key = `${part}-${index}`; if (isSeparator(part)) { return ( {part} ); } if (CLASS_TYPES.has(part) || isPascalCase(part)) { return ( {part} ); } switch (part) { case "boolean": return ( {part} ); case "number": return ( {part} ); case "function": case "void": return ( {part} ); default: return {part}; } }); } function getSimpleType(typeString: string): string { const pipeIndex = typeString.indexOf("|"); const firstType = pipeIndex !== -1 ? typeString.slice(0, pipeIndex).trim() : typeString.trim(); if (firstType.startsWith('"') && firstType.endsWith('"')) { return "string"; } return firstType; } function renderDefaultValue(defaultValue?: string) { if (!defaultValue) { return -; } if (defaultValue.startsWith('"') && defaultValue.endsWith('"')) { return {defaultValue}; } if (defaultValue === "true" || defaultValue === "false") { return {defaultValue}; } if (isNumber(defaultValue)) { return {defaultValue}; } return defaultValue; } function PropTable({ className, children, ...props }: ComponentProps<"section">) { return (

{/* pr-12 = 16px + trigger chevron (16px) + gap (16px), so columns align with rows */}

Prop

Type

Default

{children}

); } type PropTableRowProps = { name: string; type: string; defaultValue?: string; className?: string; children?: ReactNode; }; const panelRowClass = "grid grid-cols-1 items-start gap-2 border-b-[0.5px] border-border/50 px-4 py-3 first:pt-4 last:border-b-0 last:pb-4 md:grid-cols-[200px_1fr_1fr] md:gap-4 md:border-b-0"; const detailLabelClass = "font-normal text-[13px] text-muted-foreground leading-5"; const detailValueClass = "break-words text-[13px] text-foreground leading-[1.6]"; function PropTableRow({ name, type, defaultValue, className, children }: PropTableRowProps) { return (

{name} {highlightType(getSimpleType(type))}

{defaultValue ? ( {renderDefaultValue(defaultValue)} ) : ( renderDefaultValue() )}

Name

{name}

Description

{children}

Type

{highlightType(type)}

Default

{defaultValue ? ( {renderDefaultValue(defaultValue)} ) : ( renderDefaultValue() )}

); } export { PropTable, PropTableRow }; 4e:["$","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":[null,["$","$L4f",null,{"namespace":"@roiui","registryDependencies":["https://roiui.com/r/collapsible-tailwind.json"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"registry/brook/tailwind/ui/prop-table.tsx","content":"$51","type":"registry:file","target":"~/components/ui/prop-table/prop-table.tsx"}],"className":"h-[70svh] min-h-80"}]]}]