{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "table-shared-core", "title": "Table Shared Core", "dependencies": [ "clsx", "iconify-icon", "rc-util", "tailwind-merge" ], "files": [ { "path": "lib/utils.ts", "content": "import type { ClassValue } from \"clsx\";\nimport { clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const isBrowser = !!(\n typeof window !== \"undefined\" &&\n window.document &&\n window.document.createElement\n);\n", "type": "registry:file", "target": "lib/utils.ts" }, { "path": "shadcn/table.tsx", "content": "\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"@acme/ui/lib/utils\"\n\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n return (\n \n \n \n )\n}\n\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n return (\n \n )\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n return (\n \n )\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n return (\n tr]:last:border-b-0\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n return (\n \n )\n}\n\nfunction TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n return (\n [role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n return (\n [role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableCaption({\n className,\n ...props\n}: React.ComponentProps<\"caption\">) {\n return (\n \n )\n}\n\nexport {\n Table,\n TableHeader,\n TableBody,\n TableFooter,\n TableHead,\n TableRow,\n TableCell,\n TableCaption,\n}\n", "type": "registry:file", "target": "shadcn/table.tsx" }, { "path": "shadcn/skeleton.tsx", "content": "import { cn } from \"@acme/ui/lib/utils\"\n\nfunction Skeleton({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n \n )\n}\n\nexport { Skeleton }\n", "type": "registry:file", "target": "shadcn/skeleton.tsx" }, { "path": "components/skeleton/index.tsx", "content": "import type { XOR } from \"ts-xor\";\n\nimport { Skeleton as SkeletonShadcn } from \"@acme/ui/shadcn/skeleton\";\n\nimport type { SkeletonProps as SkeletonProperties } from \"./skeleton\";\nimport { SkeletonAvatar } from \"./_components/skeleton-avatar\";\nimport { Skeleton } from \"./skeleton\";\n\ntype XorSkeletonProperties = XOR<\n SkeletonProperties,\n React.ComponentProps\n>;\nconst InternalSkeleton = (properties: XorSkeletonProperties) => {\n const { title, ...rest } = properties;\n const isShadcnSkeleton =\n !properties.paragraph &&\n (typeof title === \"string\" || title === undefined) &&\n !properties.avatar;\n if (isShadcnSkeleton) {\n return ;\n }\n return ;\n};\n\ntype CompoundedComponent = typeof InternalSkeleton & {\n // Button: typeof SkeletonButton;\n Avatar: typeof SkeletonAvatar;\n // Input: typeof SkeletonInput;\n // Image: typeof SkeletonImage;\n // Node: typeof SkeletonNode;\n};\nconst ConditionSkeleton = InternalSkeleton as CompoundedComponent;\n\nConditionSkeleton.Avatar = SkeletonAvatar;\n\nexport { ConditionSkeleton as Skeleton };\n", "type": "registry:file", "target": "components/skeleton/index.tsx" }, { "path": "components/skeleton/skeleton.tsx", "content": "import type { Key } from \"react\";\n\nimport { cn } from \"@acme/ui/lib/utils\";\nimport { Skeleton as SkeletonShadcn } from \"@acme/ui/shadcn/skeleton\";\n\nimport type { SkeletonAvatarProps as SkeletonAvatarProperties } from \"./_components/skeleton-avatar\";\nimport type { SkeletonParagraphProps as SkeletonParagraphProperties } from \"./_components/skeleton-paragraph\";\nimport type { SkeletonTitleProps as SkeletonTitleProperties } from \"./_components/skeleton-title\";\nimport { useComponentConfig } from \"../config-provider/context\";\nimport { GenericSlot } from \"../slot\";\nimport { SkeletonElement } from \"./_components/element\";\nimport { SkeletonParagraph } from \"./_components/skeleton-paragraph\";\nimport { SkeletonTitle } from \"./_components/skeleton-title\";\n\ninterface SkeletonProperties {\n key?: Key;\n asChild?: boolean;\n // children?: React.ReactNode;\n className?: string;\n rootClassName?: string;\n style?: React.CSSProperties;\n /** Show animation effect */\n active?: boolean;\n /** Display the skeleton when true */\n loading?: boolean;\n /** Show avatar placeholder */\n avatar?: SkeletonAvatarProperties | boolean;\n /** Show title placeholder */\n title?: SkeletonTitleProperties | boolean;\n /** Show paragraph placeholder */\n paragraph?: SkeletonParagraphProperties | boolean;\n /**Show paragraph and title radius when true */\n round?: boolean;\n}\n\nfunction Skeleton(properties: SkeletonProperties) {\n const {\n asChild,\n className,\n rootClassName,\n style,\n loading,\n round,\n\n active,\n avatar = false,\n title = true,\n paragraph = true,\n ...restProperties\n } = properties;\n const {\n direction,\n className: contextClassName,\n style: contextStyle,\n } = useComponentConfig(\"skeleton\");\n const SkeletonComp = asChild ? GenericSlot : SkeletonShadcn;\n\n if (loading || !(\"loading\" in properties)) {\n const hasAvatar = !!avatar;\n const hasTitle = !!title;\n const hasParagraph = !!paragraph;\n\n // Avatar\n let avatarNode: React.ReactNode;\n if (hasAvatar) {\n const avatarProperties: SkeletonAvatarProperties = {\n ...getAvatarBasicProperties(hasTitle, hasParagraph),\n ...getComponentProperties(avatar),\n };\n // We direct use SkeletonElement as avatar in skeleton internal.\n avatarNode = (\n
\n \n
\n );\n }\n\n let contentNode: React.ReactNode;\n if (hasTitle || hasParagraph) {\n // Title\n let $title: React.ReactNode;\n if (hasTitle) {\n const titleProperties: SkeletonTitleProperties = {\n active,\n ...getTitleBasicProperties(hasAvatar, hasParagraph),\n ...getComponentProperties(title),\n };\n\n $title = ;\n }\n\n // Paragraph\n let paragraphNode: React.ReactNode;\n if (hasParagraph) {\n const paragraphProperties: SkeletonParagraphProperties = {\n ...getParagraphBasicProperties(hasAvatar, hasTitle),\n ...getComponentProperties(paragraph),\n };\n\n paragraphNode = (\n \n );\n }\n\n contentNode = (\n \n {$title}\n {paragraphNode}\n \n );\n }\n\n const cls = cn(\n {\n [`with-avatar`]: hasAvatar,\n // [`active`]: active,\n [`rtl`]: direction === \"rtl\",\n [`round`]: round,\n },\n contextClassName,\n className,\n rootClassName,\n );\n\n return (\n
\n {avatarNode}\n {contentNode}\n
\n );\n }\n\n // if (avatar) {\n // const avatarProps = typeof avatar === \"boolean\" ? {} : avatar;\n // return ;\n // }\n\n return ;\n}\n\nexport type { SkeletonProperties as SkeletonProps };\nexport { Skeleton };\n\nfunction getComponentProperties(\n property?: T | boolean,\n): T | Record {\n if (property && typeof property === \"object\") {\n return property;\n }\n return {};\n}\n\nfunction getAvatarBasicProperties(\n hasTitle: boolean,\n hasParagraph: boolean,\n): SkeletonAvatarProperties {\n if (hasTitle && !hasParagraph) {\n // Square avatar\n return { size: \"large\", shape: \"square\" };\n }\n\n return { size: \"large\", shape: \"circle\" };\n}\nfunction getTitleBasicProperties(\n hasAvatar: boolean,\n hasParagraph: boolean,\n): SkeletonTitleProperties {\n if (!hasAvatar && hasParagraph) {\n return { width: \"38%\" };\n }\n\n if (hasAvatar && hasParagraph) {\n return { width: \"50%\" };\n }\n\n return {};\n}\n\nfunction getParagraphBasicProperties(\n hasAvatar: boolean,\n hasTitle: boolean,\n): SkeletonParagraphProperties {\n const basicProperties: SkeletonParagraphProperties = {};\n\n // Width\n if (!hasAvatar || !hasTitle) {\n basicProperties.width = \"61%\";\n }\n\n // Rows\n if (!hasAvatar && hasTitle) {\n basicProperties.rows = 3;\n } else {\n basicProperties.rows = 2;\n }\n\n return basicProperties;\n}\n", "type": "registry:file", "target": "components/skeleton/skeleton.tsx" }, { "path": "components/skeleton/_components/element.tsx", "content": "import React from \"react\";\n\nimport { cn } from \"@acme/ui/lib/utils\";\nimport { Skeleton as SkeletonShadcn } from \"@acme/ui/shadcn/skeleton\";\n\nimport { GenericSlot } from \"../../slot\";\n\nexport interface SkeletonElementProps {\n className?: string;\n rootClassName?: string;\n style?: React.CSSProperties;\n size?: \"large\" | \"small\" | \"default\" | number;\n shape?: \"circle\" | \"square\" | \"round\" | \"default\";\n active?: boolean;\n asChild?: boolean;\n children?: React.ReactNode;\n}\n\nconst SkeletonElement = (properties: SkeletonElementProps) => {\n const { active, className, style, size, shape, asChild, ...restProperties } =\n properties;\n\n const sizeCls = cn({\n [\"h-10 w-10\"]: size === \"large\",\n [\"h-12 w-12\"]: size === \"small\",\n });\n\n const shapeCls = cn({\n [\"rounded-full\"]: shape === \"circle\",\n [\"rounded-md\"]: shape === \"square\",\n [\"rounded-lg\"]: shape === \"round\",\n });\n\n const sizeStyle = React.useMemo(\n () =>\n typeof size === \"number\"\n ? {\n width: size,\n height: size,\n lineHeight: `${size}px`,\n }\n : {},\n [size],\n );\n\n const Slot = asChild ? GenericSlot : SkeletonShadcn;\n\n return (\n \n );\n};\n\nexport { SkeletonElement };\n", "type": "registry:file", "target": "components/skeleton/_components/element.tsx" }, { "path": "components/skeleton/_components/skeleton-avatar.tsx", "content": "\"use client\";\n\nimport type { SkeletonElementProps as SkeletonElementProperties } from \"./element\";\nimport { SkeletonElement } from \"./element\";\n\nexport interface SkeletonAvatarProps extends Omit<\n SkeletonElementProperties,\n \"shape\"\n> {\n shape?: \"circle\" | \"square\";\n}\n\nconst SkeletonAvatar = (properties: SkeletonAvatarProps) => {\n const { shape = \"circle\", size = \"default\", ...restProperties } = properties;\n return ;\n};\n\nexport { SkeletonAvatar };\n", "type": "registry:file", "target": "components/skeleton/_components/skeleton-avatar.tsx" }, { "path": "components/skeleton/_components/skeleton-paragraph.tsx", "content": "import type * as React from \"react\";\n\nimport { cn } from \"@acme/ui/lib/utils\";\n\nimport { SkeletonElement } from \"./element\";\n\ntype widthUnit = number | string;\n\nexport interface SkeletonParagraphProps {\n className?: string;\n style?: React.CSSProperties;\n width?: widthUnit | Array;\n rows?: number;\n active?: boolean;\n}\n\nconst getWidth = (index: number, properties: SkeletonParagraphProps) => {\n const { width, rows = 2 } = properties;\n if (Array.isArray(width)) {\n return width[index];\n }\n // last paragraph\n if (rows - 1 === index) {\n return width;\n }\n return undefined;\n};\n\nconst SkeletonParagraph: React.FC = ({\n active,\n ...properties\n}) => {\n const { className, style, rows = 0 } = properties;\n const rowList = Array.from({ length: rows }).map((_, index) => (\n \n
  • \n \n ));\n return (\n \n {rowList}\n \n );\n};\n\nexport { SkeletonParagraph };\n", "type": "registry:file", "target": "components/skeleton/_components/skeleton-paragraph.tsx" }, { "path": "components/skeleton/_components/skeleton-title.tsx", "content": "import type * as React from \"react\";\n\nimport { SkeletonElement } from \"./element\";\n\nexport interface SkeletonTitleProps {\n className?: string;\n style?: React.CSSProperties;\n width?: number | string;\n active?: boolean;\n}\n\nconst SkeletonTitle: React.FC = ({\n className,\n width,\n style,\n active,\n}) => (\n // biome-ignore lint/a11y/useHeadingContent: HOC here\n \n \n \n);\n\nexport { SkeletonTitle };\n", "type": "registry:file", "target": "components/skeleton/_components/skeleton-title.tsx" }, { "path": "components/slot/index.ts", "content": "export * from \"./generic-slot\";\n", "type": "registry:file", "target": "components/slot/index.ts" }, { "path": "components/slot/generic-slot.tsx", "content": "import type React from \"react\";\nimport { Slot } from \"radix-ui\";\n\ntype GenericSlotProperties

    > =\n Slot.SlotProps & P;\n\nconst GenericSlot =

    ,>(\n properties: GenericSlotProperties

    ,\n) => {\n return ;\n};\n\nexport type { GenericSlotProperties as GenericSlotProps };\nexport { GenericSlot };\n", "type": "registry:file", "target": "components/slot/generic-slot.tsx" }, { "path": "components/_util/type.ts", "content": "/* eslint-disable @typescript-eslint/no-explicit-any */\n/** https://github.com/Microsoft/TypeScript/issues/29729 */\nexport type LiteralUnion = T | (string & {});\n\nexport type AnyObject = Record;\n", "type": "registry:file", "target": "components/_util/type.ts" }, { "path": "components/_util/scroll-to.ts", "content": "import raf from \"rc-util/es/raf\";\n\nimport { easeInOutCubic } from \"./easings\";\nimport getScroll, { isWindow } from \"./get-scroll\";\n\ninterface ScrollToOptions {\n /** Scroll container, default as window */\n getContainer?: () => HTMLElement | Window | Document;\n /** Scroll end callback */\n callback?: () => void;\n /** Animation duration, default as 450 */\n duration?: number;\n}\n\nexport default function scrollTo(y: number, options: ScrollToOptions = {}) {\n const { getContainer = () => window, callback, duration = 450 } = options;\n const container = getContainer();\n const scrollTop = getScroll(container);\n const startTime = Date.now();\n\n const frameFunction = () => {\n const timestamp = Date.now();\n const time = timestamp - startTime;\n const nextScrollTop = easeInOutCubic(\n time > duration ? duration : time,\n scrollTop,\n y,\n duration,\n );\n if (isWindow(container)) {\n (container as Window).scrollTo(window.pageXOffset, nextScrollTop);\n } else if (\n container instanceof Document ||\n container.constructor.name === \"HTMLDocument\"\n ) {\n (container as Document).documentElement.scrollTop = nextScrollTop;\n } else {\n (container as HTMLElement).scrollTop = nextScrollTop;\n }\n if (time < duration) {\n raf(frameFunction);\n } else if (typeof callback === \"function\") {\n callback();\n }\n };\n raf(frameFunction);\n}\n", "type": "registry:file", "target": "components/_util/scroll-to.ts" }, { "path": "components/_util/get-scroll.ts", "content": "/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport function isWindow(object: any): object is Window {\n return object !== null && object !== undefined && object === object.window;\n}\n\nconst getScroll = (target: HTMLElement | Window | Document | null): number => {\n if (typeof window === \"undefined\") {\n return 0;\n }\n let result = 0;\n if (isWindow(target)) {\n result = target.pageYOffset;\n } else if (target instanceof Document) {\n result = target.documentElement.scrollTop;\n } else if (target instanceof HTMLElement) {\n result = target.scrollTop;\n } else if (target) {\n // According to the type inference, the `target` is `never` type.\n // Since we configured the loose mode type checking, and supports mocking the target with such shape below::\n // `{ documentElement: { scrollLeft: 200, scrollTop: 400 } }`,\n // the program may falls into this branch.\n // Check the corresponding tests for details. Don't sure what is the real scenario this happens.\n /* biome-ignore lint/complexity/useLiteralKeys: target is a never type */\n result = target[\"scrollTop\"];\n }\n\n if (target && !isWindow(target) && typeof result !== \"number\") {\n result = (target.ownerDocument ?? target).documentElement?.scrollTop;\n }\n return result;\n};\n\nexport default getScroll;\n", "type": "registry:file", "target": "components/_util/get-scroll.ts" }, { "path": "components/_util/easings.ts", "content": "export function easeInOutCubic(t: number, b: number, c: number, d: number) {\n const cc = c - b;\n t /= d / 2;\n if (t < 1) {\n return (cc / 2) * t * t * t + b;\n }\n // biome-ignore lint: it is a common easing function\n return (cc / 2) * ((t -= 2) * t * t + 2) + b;\n}\n", "type": "registry:file", "target": "components/_util/easings.ts" }, { "path": "components/_util/warning.ts", "content": "/* eslint-disable @typescript-eslint/no-empty-function */\n\nimport * as React from \"react\";\nimport rcWarning, { resetWarned as rcResetWarned } from \"rc-util/es/warning\";\n\nexport function noop() {}\n\nlet deprecatedWarnList: Record | undefined;\n\nexport function resetWarned() {\n deprecatedWarnList = undefined;\n rcResetWarned();\n}\n\ntype Warning = (valid: boolean, component: string, message?: string) => void;\n\nlet _warning: Warning = noop;\nif (process.env.NODE_ENV !== \"production\") {\n _warning = (valid, component, message) => {\n rcWarning(valid, `[antd: ${component}] ${message}`);\n\n // StrictMode will inject console which will not throw warning in React 17.\n if (process.env.NODE_ENV === \"test\") {\n resetWarned();\n }\n };\n}\nconst warning = _warning;\n\ntype BaseTypeWarning = (\n valid: boolean,\n /**\n * - deprecated: Some API will be removed in future but still support now.\n * - usage: Some API usage is not correct.\n * - breaking: Breaking change like API is removed.\n */\n type: \"deprecated\" | \"usage\" | \"breaking\",\n message?: string,\n) => void;\n\ntype TypeWarning = BaseTypeWarning & {\n deprecated: (\n valid: boolean,\n oldProperty: string,\n newProperty: string,\n message?: string,\n ) => void;\n};\n\nexport interface WarningContextProps {\n /**\n * @descEN Set the warning level. When set to `false`, discard related information will be aggregated into a single message.\n * @since 5.10.0\n */\n strict?: boolean;\n}\n\nexport const WarningContext = React.createContext({});\n\n/**\n * This is a hook but we not named as `useWarning`\n * since this is only used in development.\n * We should always wrap this in `if (process.env.NODE_ENV !== 'production')` condition\n */\nexport const devUseWarning: (component: string) => TypeWarning =\n process.env.NODE_ENV !== \"production\"\n ? (component) => {\n const { strict } = React.useContext(WarningContext);\n\n const typeWarning: TypeWarning = (valid, type, message) => {\n if (!valid) {\n if (strict === false && type === \"deprecated\") {\n const existWarning = deprecatedWarnList;\n\n if (!deprecatedWarnList) {\n deprecatedWarnList = {};\n }\n\n deprecatedWarnList[component] =\n deprecatedWarnList[component] || [];\n if (!deprecatedWarnList[component].includes(message || \"\")) {\n deprecatedWarnList[component].push(message || \"\");\n }\n\n // Warning for the first time\n if (!existWarning) {\n console.warn(\n \"[antd] There exists deprecated usage in your code:\",\n deprecatedWarnList,\n );\n }\n } else {\n warning(valid, component, message);\n }\n }\n };\n\n typeWarning.deprecated = (valid, oldProperty, newProperty, message) => {\n typeWarning(\n valid,\n \"deprecated\",\n `\\`${oldProperty}\\` is deprecated. Please use \\`${newProperty}\\` instead.${\n message ? ` ${message}` : \"\"\n }`,\n );\n };\n\n return typeWarning;\n }\n : () => {\n const noopWarning: TypeWarning = () => {};\n\n noopWarning.deprecated = noop;\n\n return noopWarning;\n };\n\nexport default warning;\n", "type": "registry:file", "target": "components/_util/warning.ts" }, { "path": "components/_util/extends-object.ts", "content": "/* eslint-disable @typescript-eslint/no-explicit-any */\n\n// copied https://github.com/ant-design/ant-design-mobile/blob/d3b3bae/src/utils/with-default-props.tsx\nfunction mergeProperties(a: A, b: B): B & A;\nfunction mergeProperties(a: A, b: B, c: C): C & B & A;\nfunction mergeProperties(a: A, b: B, c: C, d: D): D & C & B & A;\nfunction mergeProperties(...items: any[]) {\n const returnValue: any = {};\n items.forEach((item) => {\n if (item) {\n Object.keys(item).forEach((key) => {\n if (item[key] !== undefined) {\n returnValue[key] = item[key];\n }\n });\n }\n });\n return returnValue;\n}\n\nexport default mergeProperties;\n", "type": "registry:file", "target": "components/_util/extends-object.ts" }, { "path": "components/_util/responsive-observer.ts", "content": "import React from \"react\";\n\nimport {\n addMediaQueryListener,\n removeMediaQueryListener,\n} from \"./media-query-util\";\n\nexport type Breakpoint = \"xxl\" | \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\nexport type BreakpointMap = Record;\nexport type ScreenMap = Partial>;\nexport type ScreenSizeMap = Partial>;\n\nexport const responsiveArray: Breakpoint[] = [\n \"xxl\",\n \"xl\",\n \"lg\",\n \"md\",\n \"sm\",\n \"xs\",\n];\ntype SubscribeFunction = (screens: ScreenMap) => void;\n\nconst responsiveMap: BreakpointMap = {\n xs: \"(max-width: 575px)\",\n sm: \"(min-width: 576px)\",\n md: \"(min-width: 768px)\",\n lg: \"(min-width: 992px)\",\n xl: \"(min-width: 1200px)\",\n xxl: \"(min-width: 1600px)\",\n};\n\nexport const matchScreen = (\n screens: ScreenMap,\n screenSizes?: ScreenSizeMap,\n) => {\n if (!screenSizes) {\n return;\n }\n for (const breakpoint of responsiveArray) {\n if (screens[breakpoint] && screenSizes?.[breakpoint] !== undefined) {\n return screenSizes[breakpoint];\n }\n }\n};\n\ninterface ResponsiveObserverType {\n responsiveMap: BreakpointMap;\n dispatch: (map: ScreenMap) => boolean;\n subscribe: (function_: SubscribeFunction) => number;\n unsubscribe: (token: number) => void;\n register: () => void;\n unregister: () => void;\n matchHandlers: Record<\n PropertyKey,\n {\n mql: MediaQueryList;\n listener: (this: MediaQueryList, event: MediaQueryListEvent) => void;\n }\n >;\n}\n\nconst useResponsiveObserver = () => {\n const subscribersReference = React.useRef(\n new Map(),\n );\n const subUidReference = React.useRef(-1);\n const screensReference = React.useRef({});\n\n // To avoid repeat create instance, we add `useMemo` here.\n return React.useMemo(() => {\n const subscribers = subscribersReference.current;\n return {\n responsiveMap,\n matchHandlers: {},\n dispatch(pointMap: ScreenMap) {\n screensReference.current = pointMap;\n subscribers.forEach((function_) => function_(screensReference.current));\n return subscribers.size > 0;\n },\n subscribe(function_: SubscribeFunction): number {\n if (subscribers.size === 0) {\n this.register();\n }\n subUidReference.current += 1;\n subscribers.set(subUidReference.current, function_);\n function_(screensReference.current);\n return subUidReference.current;\n },\n unsubscribe(parameterToken: number) {\n subscribers.delete(parameterToken);\n if (subscribers.size === 0) {\n this.unregister();\n }\n },\n register() {\n for (const [screen, mediaQuery] of Object.entries(responsiveMap)) {\n const listener = ({ matches }: { matches: boolean }) => {\n this.dispatch({ ...screensReference.current, [screen]: matches });\n };\n const mql = globalThis.matchMedia(mediaQuery);\n addMediaQueryListener(mql, listener);\n this.matchHandlers[mediaQuery] = { mql, listener };\n listener(mql);\n }\n },\n unregister() {\n Object.values(responsiveMap).forEach((mediaQuery) => {\n const handler = this.matchHandlers[mediaQuery]!;\n removeMediaQueryListener(handler?.mql, handler?.listener);\n });\n subscribers.clear();\n },\n };\n }, []);\n};\n\nexport default useResponsiveObserver;\n", "type": "registry:file", "target": "components/_util/responsive-observer.ts" }, { "path": "components/_util/media-query-util.ts", "content": "type MQListenerHandler = (\n mql: MediaQueryList,\n handler: (e: MediaQueryListEvent) => void,\n) => void;\n\nexport const addMediaQueryListener: MQListenerHandler = (mql, handler) => {\n // Don't delete here, please keep the code compatible\n if (typeof mql?.addEventListener !== \"undefined\") {\n mql.addEventListener(\"change\", handler);\n } else if (typeof mql?.addListener !== \"undefined\") {\n mql.addListener(handler);\n }\n};\n\nexport const removeMediaQueryListener: MQListenerHandler = (mql, handler) => {\n // Don't delete here, please keep the code compatible\n if (typeof mql?.removeEventListener !== \"undefined\") {\n mql.removeEventListener(\"change\", handler);\n } else if (typeof mql?.removeListener !== \"undefined\") {\n mql.removeListener(handler);\n }\n};\n", "type": "registry:file", "target": "components/_util/media-query-util.ts" }, { "path": "components/config-provider/context.ts", "content": "/* eslint-disable @typescript-eslint/no-explicit-any */\n\"use client\";\n\nimport React from \"react\";\n\nimport type { WarningContextProps } from \"../_util/warning\";\nimport type { Locale } from \"../locale\";\nimport type { PaginationProps } from \"../pagination\";\nimport type { TableProps } from \"../table\";\n\nexport type AliasToken = Record;\nexport type MappingAlgorithm = (...args: any[]) => AliasToken;\nexport type OverrideToken = Record;\n\nexport type RenderEmptyHandler = (\n componentName?:\n | \"Table\"\n | \"Table.filter\"\n | \"List\"\n | \"Select\"\n | \"TreeSelect\"\n | \"Cascader\"\n | \"Transfer\"\n | \"Mentions\",\n) => React.ReactNode;\n\nexport type WaveComponent = \"Tag\" | \"Button\" | \"Checkbox\" | \"Radio\" | \"Switch\";\nexport type ShowWaveEffect = (\n element: HTMLElement,\n info: {\n className: string;\n component?: WaveComponent;\n event: MouseEvent;\n },\n) => void;\n\nexport interface CSPConfig {\n nonce?: string;\n}\n\nexport type DirectionType = \"ltr\" | \"rtl\" | undefined;\n\ntype ComponentsConfig = {\n [key in keyof OverrideToken]?: OverrideToken[key] & {\n algorithm?: boolean | MappingAlgorithm | MappingAlgorithm[];\n };\n};\n\nexport interface ThemeConfig {\n /**\n * @descEN Modify Design Token.\n */\n token?: Partial;\n /**\n * @descEN Modify Component Token and Alias Token applied to components.\n */\n components?: ComponentsConfig;\n}\nexport interface ComponentStyleConfig {\n className?: string;\n style?: React.CSSProperties;\n}\n\ntype SemanticClassNames = Record;\ntype SemanticStyles = Record;\ntype AllowClearConfig = boolean | { clearIcon?: React.ReactNode };\n\n// Keep these config shapes local instead of deriving them from button/form/tag\n// modules. This context is copied into registry artifacts in isolation, so\n// importing those modules here would reintroduce broader transitive fanout.\ntype ButtonTypeConfig =\n | \"default\"\n | \"primary\"\n | \"dashed\"\n | \"link\"\n | \"text\"\n | \"submit\"\n | \"reset\"\n | \"button\";\ntype ButtonVariantConfig =\n | \"solid\"\n | \"outlined\"\n | \"dashed\"\n | \"filled\"\n | \"link\"\n | \"text\";\ntype ButtonColorConfig =\n | \"default\"\n | \"primary\"\n | \"danger\"\n | \"link\"\n | \"success\"\n | \"gray\"\n | \"red\"\n | \"orange\"\n | \"amber\"\n | \"yellow\"\n | \"lime\"\n | \"green\"\n | \"emerald\"\n | \"teal\"\n | \"cyan\"\n | \"sky\"\n | \"blue\"\n | \"indigo\"\n | \"violet\"\n | \"purple\"\n | \"fuchsia\"\n | \"pink\"\n | \"rose\";\ntype ButtonSizeConfig = \"small\" | \"middle\" | \"large\";\ntype DatePickerCaptionLayout =\n | \"label\"\n | \"dropdown\"\n | \"dropdown-months\"\n | \"dropdown-years\";\ntype FormLayoutConfig = \"horizontal\" | \"vertical\";\ntype FormLabelAlignConfig = \"left\" | \"right\";\ntype TagVariantConfig = \"filled\" | \"solid\" | \"outlined\";\ntype LiteralUnion = T | (U & Record);\ntype TagNamedColorConfig =\n | \"default\"\n | \"primary\"\n | \"success\"\n | \"processing\"\n | \"error\"\n | \"warning\"\n | \"slate\"\n | \"gray\"\n | \"zinc\"\n | \"neutral\"\n | \"stone\"\n | \"red\"\n | \"orange\"\n | \"amber\"\n | \"yellow\"\n | \"lime\"\n | \"green\"\n | \"emerald\"\n | \"teal\"\n | \"cyan\"\n | \"sky\"\n | \"blue\"\n | \"indigo\"\n | \"violet\"\n | \"purple\"\n | \"fuchsia\"\n | \"pink\"\n | \"rose\"\n | \"black\"\n | \"white\"\n | \"magenta\"\n | \"volcano\"\n | \"geekblue\"\n | \"gold\"\n | \"green-solid\";\n\ntype TagColorConfig = LiteralUnion;\ntype TagSizeConfig = \"small\" | \"default\" | \"large\";\n\nexport type ButtonConfig = ComponentStyleConfig & {\n classNames?: {\n variants?: Record;\n };\n type?: ButtonTypeConfig;\n variant?: ButtonVariantConfig;\n color?: ButtonColorConfig;\n size?: ButtonSizeConfig;\n};\n\nexport type DatePickerConfig = ComponentStyleConfig & {\n variant?: Variant;\n styles?: {\n root?: React.CSSProperties;\n };\n classNames?: {\n root?: string;\n };\n format?: string;\n captionLayout?: DatePickerCaptionLayout;\n commitYearOnClose?: boolean;\n};\n\nexport type FormConfig = ComponentStyleConfig & {\n layout?: FormLayoutConfig;\n labelCol?: unknown;\n wrapperCol?: unknown;\n labelAlign?: FormLabelAlignConfig;\n labelWrap?: boolean;\n colon?: boolean;\n};\n\nexport type InputConfig = ComponentStyleConfig & {\n autoComplete?: string;\n classNames?: SemanticClassNames;\n styles?: SemanticStyles;\n allowClear?: AllowClearConfig;\n variant?: Variant;\n};\n\nexport type InputNumberConfig = ComponentStyleConfig & {\n variant?: Variant;\n};\n\nexport type MentionsConfig = ComponentStyleConfig & {\n variant?: Variant;\n};\n\nexport type SelectConfig = ComponentStyleConfig & {\n showSearch?: boolean;\n variant?: Variant;\n classNames?: SemanticClassNames & {\n popup?: SemanticClassNames;\n };\n styles?: SemanticStyles & {\n popup?: SemanticStyles;\n };\n};\n\nexport type PaginationConfig = ComponentStyleConfig &\n Pick;\n\nexport interface ResultStatusConfig {\n icon?: React.ReactNode;\n title?: React.ReactNode;\n subTitle?: React.ReactNode;\n}\n\nexport interface ResultConfig extends ComponentStyleConfig {\n status?: {\n success?: ResultStatusConfig;\n info?: ResultStatusConfig;\n warning?: ResultStatusConfig;\n error?: ResultStatusConfig;\n \"500\"?: ResultStatusConfig;\n \"404\"?: ResultStatusConfig;\n };\n}\nexport interface TableConfig extends ComponentStyleConfig {\n bordered?: TableProps[\"bordered\"];\n expandable?: {\n expandIcon?: NonNullable[\"expandIcon\"];\n };\n}\n\nexport type TagConfig = ComponentStyleConfig & {\n variant?: TagVariantConfig;\n color?: TagColorConfig;\n size?: TagSizeConfig;\n};\n\nexport type TextAreaConfig = ComponentStyleConfig & {\n autoComplete?: string;\n classNames?: SemanticClassNames;\n styles?: SemanticStyles;\n allowClear?: AllowClearConfig;\n variant?: Variant;\n};\n\nexport interface PageContainerConfig {\n loadingRender?: React.ReactNode;\n}\n\nexport interface LayoutConfig extends ComponentStyleConfig {\n pageContainer?: PageContainerConfig;\n}\n\nexport type PopupOverflow = \"viewport\" | \"scroll\";\n\nexport const Variants = [\n \"outlined\",\n \"borderless\",\n \"filled\",\n \"underlined\",\n] as const;\n\nexport type Variant = (typeof Variants)[number];\n\nexport interface WaveConfig {\n /**\n * @descEN Whether to use wave effect. If it needs to close, set to `false`.\n * @default true\n */\n disabled?: boolean;\n /**\n * @descEN Customized wave effect.\n */\n showEffect?: ShowWaveEffect;\n}\n\nexport interface ConfigComponentProps {\n avatar?: ComponentStyleConfig;\n checkbox?: ComponentStyleConfig;\n input?: InputConfig;\n inputNumber?: InputNumberConfig;\n mentions?: MentionsConfig;\n // space?: SpaceConfig;\n // splitter?: ComponentStyleConfig;\n form?: FormConfig;\n select?: SelectConfig;\n // alert?: AlertConfig;\n // anchor?: ComponentStyleConfig;\n button?: ButtonConfig;\n // divider?: ComponentStyleConfig;\n // drawer?: DrawerConfig;\n // calendar?: ComponentStyleConfig;\n // carousel?: ComponentStyleConfig;\n // cascader?: CascaderConfig;\n // treeSelect?: TreeSelectConfig;\n // collapse?: CollapseConfig;\n // floatButtonGroup?: FloatButtonGroupConfig;\n // typography?: ComponentStyleConfig;\n pagination?: PaginationConfig;\n skeleton?: ComponentStyleConfig;\n // spin?: SpinConfig;\n // segmented?: ComponentStyleConfig;\n // steps?: ComponentStyleConfig;\n // statistic?: ComponentStyleConfig;\n // image?: ImageConfig;\n layout?: LayoutConfig;\n // list?: ListConfig;\n // modal?: ModalConfig;\n progress?: ComponentStyleConfig;\n result?: ResultConfig;\n // slider?: SliderConfig;\n // slider?: SliderConfig;\n // breadcrumb?: ComponentStyleConfig;\n // menu?: MenuConfig;\n // descriptions?: DescriptionsConfig;\n // empty?: EmptyConfig;\n // badge?: BadgeConfig;\n // radio?: ComponentStyleConfig;\n // rate?: ComponentStyleConfig;\n // switch?: ComponentStyleConfig;\n // transfer?: TransferConfig;\n // message?: ComponentStyleConfig;\n tag?: TagConfig;\n table?: TableConfig;\n textArea?: TextAreaConfig;\n // card?: CardConfig;\n // tabs?: TabsConfig;\n // timeline?: ComponentStyleConfig;\n // timePicker?: TimePickerConfig;\n // tour?: TourConfig;\n // tooltip?: TooltipConfig;\n // popover?: PopoverConfig;\n // popconfirm?: PopconfirmConfig;\n // upload?: ComponentStyleConfig;\n // notification?: NotificationConfig;\n // tree?: ComponentStyleConfig;\n // colorPicker?: ComponentStyleConfig;\n datePicker?: DatePickerConfig;\n // rangePicker?: RangePickerConfig;\n // dropdown?: ComponentStyleConfig;\n // flex?: FlexConfig;\n wave?: WaveConfig;\n}\n\nexport interface ConfigConsumerProps extends ConfigComponentProps {\n getTargetContainer?: () => HTMLElement;\n getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;\n // rootPrefixCls?: string;\n // iconPrefixCls: string;\n // getPrefixCls: (suffixCls?: string, customizePrefixCls?: string) => string;\n renderEmpty?: RenderEmptyHandler;\n /**\n * @descEN Set the [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) config.\n */\n csp?: CSPConfig;\n /** @deprecated Please use `{ button: { autoInsertSpace: boolean }}` instead */\n autoInsertSpaceInButton?: boolean;\n variant?: Variant;\n virtual?: boolean;\n locale?: Locale;\n direction?: DirectionType;\n popupMatchSelectWidth?: boolean;\n popupOverflow?: PopupOverflow;\n // theme?: ThemeConfig;\n warning?: WarningContextProps;\n}\n\n// zombieJ: 🚨 Do not pass `defaultRenderEmpty` here since it will cause circular dependency.\nexport const ConfigContext = React.createContext({\n // We provide a default function for Context without provider\n // getPrefixCls: defaultGetPrefixCls,\n // iconPrefixCls: defaultIconPrefixCls,\n});\n\nexport const { Consumer: ConfigConsumer } = ConfigContext;\n\nconst EMPTY_OBJECT = {};\n\ntype GetClassNamesOrEmptyObject =\n Config extends {\n classNames?: infer ClassNames;\n }\n ? ClassNames\n : object;\n\ntype GetStylesOrEmptyObject = Config extends {\n styles?: infer Styles;\n}\n ? Styles\n : object;\n\ntype ComponentReturnType = Omit<\n NonNullable,\n \"classNames\" | \"styles\"\n> & {\n classNames: GetClassNamesOrEmptyObject>;\n styles: GetStylesOrEmptyObject>;\n direction: ConfigConsumerProps[\"direction\"];\n getPopupContainer: ConfigConsumerProps[\"getPopupContainer\"];\n};\n\n/**\n * Get ConfigProvider configured component props.\n * This help to reduce bundle size for saving `?.` operator.\n * Do not use as `useMemo` deps since we do not cache the object here.\n *\n * NOTE: not refactor this with `useMemo` since memo will cost another memory space,\n * which will waste both compare calculation & memory.\n */\nexport function useComponentConfig(\n propName: T,\n) {\n const context = React.useContext(ConfigContext);\n const { direction, getPopupContainer } = context;\n\n const propValue = context[propName];\n return {\n classNames: EMPTY_OBJECT,\n styles: EMPTY_OBJECT,\n ...propValue,\n direction,\n getPopupContainer,\n } as ComponentReturnType;\n}\n", "type": "registry:file", "target": "components/config-provider/context.ts" }, { "path": "components/config-provider/size-context.tsx", "content": "import * as React from \"react\";\n\nimport type { InputSizeVariants } from \"../input/variants\";\n\nexport type SizeType = InputSizeVariants[\"size\"];\n\nconst SizeContext = React.createContext(undefined);\n\nexport interface SizeContextProps {\n size?: SizeType;\n children?: React.ReactNode;\n}\n\nexport const SizeContextProvider: React.FC = ({\n children,\n size,\n}) => {\n const originSize = React.useContext(SizeContext);\n return (\n \n {children}\n \n );\n};\n\nexport default SizeContext;\n", "type": "registry:file", "target": "components/config-provider/size-context.tsx" }, { "path": "components/input/variants.ts", "content": "import type { VariantProps } from \"tailwind-variants\";\nimport { tv } from \"tailwind-variants\";\n\nconst inputDisabledVariants = tv({\n variants: {\n disabled: {\n true: [\n \"bg-background-active hover:border-input! cursor-not-allowed opacity-50\",\n ],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n});\nconst inputVariants = tv({\n base: [\n \"font-normal\",\n // disable shadcn focus-visible classes\n \"outline-0\",\n // \"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex w-full min-w-0 rounded-md border bg-transparent px-3 py-1 shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\",\n \"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n ],\n variants: {\n disabled: inputDisabledVariants.variants.disabled,\n // readOnly: {\n // true: [\"pointer-events-none cursor-not-allowed\"],\n // },\n status: {\n default: [\n \"border-input\",\n \"hover:border-primary-500\",\n \"focus-within:border-primary-500 focus-within:ring-primary-500/20\",\n \"focus-visible:border-primary-500 focus-visible:ring-primary-500/20\",\n ],\n error: [\n \"border-error\",\n \"hover:border-error-hover\",\n \"focus-within:border-error focus-within:ring-error/20\",\n \"focus-visible:border-error focus-visible:ring-error/20\",\n ],\n warning: [\n \"border-warning\",\n \"hover:border-warning-hover\",\n \"focus-within:border-warning focus-within:ring-warning/20\",\n \"focus-visible:border-warning focus-visible:ring-warning/20\",\n ],\n success: [\n \"border-success\",\n \"hover:border-success-hover\",\n \"focus-within:border-success focus-within:ring-success/20\",\n \"focus-visible:border-success focus-visible:ring-success/20\",\n ],\n },\n variant: {\n outlined: [\n \"border\",\n \"rounded-md\",\n \"transition-colors\",\n \"focus-within:ring-[3px]\",\n ],\n filled: [\n \"bg-accent rounded-md border-none shadow-none\",\n \"transition-colors\",\n ],\n borderless: [\"border-none\", \"transition-colors\"],\n underlined: [\n \"border-b\",\n \"border-t-0 border-r-0 border-l-0\",\n \"rounded-none\",\n \"transition-colors\",\n ],\n },\n },\n defaultVariants: {\n variant: \"outlined\",\n status: \"default\",\n disabled: false,\n },\n});\nconst inputInlineInsetClassName = \"pl-3\";\n\nconst inputAffixWrapperSizeVariants = tv({\n variants: {\n size: {\n small: \"h-6\",\n middle: \"h-8\",\n large: \"h-10\",\n },\n },\n defaultVariants: {\n size: \"middle\",\n },\n});\n\nconst inputSizeVariants = tv({\n variants: {\n size: {\n // sm: \"px-[7px] py-px\",\n // default: \"h-8 px-[11px] py-[5px]\",\n // lg: \"px-[11px] py-[9px]\",\n // xl: \"px-[11px] py-[13px]\",\n small: \"h-6 px-2 py-1\",\n middle: \"h-8 px-3 py-1 text-sm\",\n large: \"h-10 px-3 py-2 text-base\",\n // xl: \"px-[11px] py-[13px]\",\n },\n },\n defaultVariants: {\n size: \"middle\",\n },\n});\ntype InputVariants = VariantProps;\ntype InputSizeVariants = VariantProps;\ntype InputVariant = VariantProps[\"variant\"];\ntype InputStatus = VariantProps[\"status\"];\n\nexport type { InputVariants, InputSizeVariants, InputVariant, InputStatus };\nexport {\n inputVariants,\n inputDisabledVariants,\n inputInlineInsetClassName,\n inputAffixWrapperSizeVariants,\n inputSizeVariants,\n};\n", "type": "registry:file", "target": "components/input/variants.ts" }, { "path": "components/locale/index.tsx", "content": "/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { PaginationLocale } from \"../pagination/types\";\nimport type { TableLocale } from \"../table/types\";\n\nexport { default as useLocale } from \"./use-locale\";\n\ninterface EmptyLocale {\n description: string;\n}\n\nexport interface Locale {\n locale: string;\n Pagination?: PaginationLocale;\n // DatePicker?: DatePickerLocale;\n TimePicker?: Record;\n Calendar?: Record;\n Table?: TableLocale;\n // Modal?: ModalLocale;\n // Tour?: TourLocale;\n // Popconfirm?: PopconfirmLocale;\n // Transfer?: TransferLocale;\n Select?: Record;\n // Upload?: UploadLocale;\n Empty?: EmptyLocale;\n global?: {\n placeholder?: string;\n close?: string;\n };\n Icon?: Record;\n Text?: {\n edit?: any;\n copy?: any;\n copied?: any;\n expand?: any;\n collapse?: any;\n };\n Form?: {\n optional?: string;\n // defaultValidateMessages: ValidateMessages;\n };\n Image?: {\n preview: string;\n };\n QRCode?: {\n expired?: string;\n refresh?: string;\n scanned?: string;\n };\n ColorPicker?: {\n presetEmpty: string;\n transparent: string;\n singleColor: string;\n gradientColor: string;\n };\n}\n", "type": "registry:file", "target": "components/locale/index.tsx" }, { "path": "components/locale/en-us.ts", "content": "import type { Locale } from \".\";\n\nconst localeValues: Locale = {\n locale: \"en\",\n Empty: {\n description: \"No data\",\n },\n};\nexport default localeValues;\n", "type": "registry:file", "target": "components/locale/en-us.ts" }, { "path": "components/locale/context.ts", "content": "\"use client\";\n\nimport { createContext } from \"react\";\n\nimport type { Locale } from \".\";\n\nexport type LocaleContextProps = Locale & { exist?: boolean };\n\nconst LocaleContext = createContext(undefined);\n\nexport default LocaleContext;\n", "type": "registry:file", "target": "components/locale/context.ts" }, { "path": "components/locale/use-locale.ts", "content": "import * as React from \"react\";\n\nimport type { Locale } from \".\";\nimport type { LocaleContextProps as LocaleContextProperties } from \"./context\";\nimport LocaleContext from \"./context\";\nimport defaultLocaleData from \"./en-us\";\n\nexport type LocaleComponentName = Exclude;\n\nconst useLocale = (\n componentName: C,\n defaultLocale?: Locale[C] | (() => Locale[C]),\n): readonly [NonNullable, string] => {\n const fullLocale = React.useContext(\n LocaleContext,\n );\n\n const getLocale = React.useMemo>(() => {\n const locale = defaultLocale || defaultLocaleData[componentName];\n const localeFromContext = fullLocale?.[componentName] ?? {};\n return {\n ...(typeof locale === \"function\"\n ? (locale as () => Locale[C])()\n : locale),\n ...(localeFromContext || {}),\n };\n }, [componentName, defaultLocale, fullLocale]);\n\n const getLocaleCode = React.useMemo(() => {\n const localeCode = fullLocale?.locale;\n // Had use LocaleProvide but didn't set locale\n if (fullLocale?.exist && !localeCode) {\n return defaultLocaleData.locale;\n }\n return localeCode!;\n }, [fullLocale]);\n\n return [getLocale, getLocaleCode] as const;\n};\n\nexport default useLocale;\n", "type": "registry:file", "target": "components/locale/use-locale.ts" }, { "path": "components/grid/hooks/use-breakpoint.ts", "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport useLayoutEffect from \"rc-util/es/hooks/useLayoutEffect\";\n\nimport type { ScreenMap } from \"../../_util/responsive-observer\";\nimport useResponsiveObserver from \"../../_util/responsive-observer\";\n\nfunction useBreakpoint(\n refreshOnChange: boolean,\n defaultScreens: null,\n): ScreenMap | null;\nfunction useBreakpoint(\n refreshOnChange?: boolean,\n defaultScreens?: ScreenMap,\n): ScreenMap;\n\nfunction useBreakpoint(\n refreshOnChange = true,\n defaultScreens: ScreenMap | null = {} as ScreenMap,\n): ScreenMap | null {\n const [screens, setScreens] = useState(defaultScreens);\n const responsiveObserver = useResponsiveObserver();\n\n useLayoutEffect(() => {\n const token = responsiveObserver.subscribe((supportScreens) => {\n if (refreshOnChange) {\n setScreens(supportScreens);\n }\n });\n\n return () => responsiveObserver.unsubscribe(token);\n }, [refreshOnChange, responsiveObserver]);\n\n return screens;\n}\n\nexport default useBreakpoint;\n// const responsiveMap = {\n// xs: '(max-width: 575px)',\n// sm: '(min-width: 576px)',\n// md: '(min-width: 768px)',\n// lg: '(min-width: 992px)',\n// xl: '(min-width: 1200px)',\n// xxl: '(min-width: 1600px)',\n// } as const;\n\n// type Breakpoint = keyof typeof responsiveMap;\n// type BreakpointMap = Record;\n\n// const useInternalBreakpoint = (): BreakpointMap => {\n// const [screens, setScreens] = useState({\n// xs: false,\n// sm: false,\n// md: false,\n// lg: false,\n// xl: false,\n// xxl: false,\n// });\n\n// const getMatch = useCallback(\n// (breakpoint: Breakpoint): boolean => {\n// if (typeof window === 'undefined') {\n// return false;\n// }\n// const mediaQuery = window.matchMedia(responsiveMap[breakpoint]);\n// return mediaQuery.matches;\n// },\n// []\n// );\n\n// useEffect(() => {\n// const updateBreakpoints = () => {\n// const newScreens: BreakpointMap = {} as BreakpointMap;\n// let breakpointChecked: Breakpoint;\n\n// for (breakpointChecked in responsiveMap) {\n// newScreens[breakpointChecked] = getMatch(breakpointChecked);\n// }\n// setScreens(newScreens);\n// };\n\n// updateBreakpoints();\n// window.addEventListener('resize', updateBreakpoints);\n// return () => window.removeEventListener('resize', updateBreakpoints);\n// }, [getMatch]);\n\n// return screens;\n// };\n\n// export default useInternalBreakpoint;\n", "type": "registry:file", "target": "components/grid/hooks/use-breakpoint.ts" }, { "path": "icons/index.ts", "content": "export { Icon, type IconProps } from \"./icon-component\";\nexport * from \"./wrapper\";\n\nexport * from \"./arrow-down-filled\";\nexport * from \"./arrow-left-outlined\";\nexport * from \"./check-filled\";\nexport * from \"./csv-icon\";\nexport * from \"./arrow-right-outlined\";\nexport * from \"./check-outlined\";\nexport * from \"./chevron-right-outlined\";\nexport * from \"./circle-filled\";\nexport * from \"./circle-outlined\";\nexport * from \"./close-outlined\";\nexport * from \"./delete-icon\";\nexport * from \"./download-icon\";\nexport * from \"./edit-icon\";\nexport * from \"./info-filled\";\nexport * from \"./logout-outlined\";\nexport * from \"./mail-outlined\";\nexport * from \"./user-outlined\";\nexport { default as WarningFilled } from \"./warning-filled\";\n", "type": "registry:file", "target": "icons/index.ts" }, { "path": "icons/icon-component.tsx", "content": "import type { DetailedHTMLProps, HTMLAttributes } from \"react\";\n\nimport \"iconify-icon\";\n\nimport { cn } from \"../lib/utils\";\n\ndeclare module \"react\" {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n namespace JSX {\n interface IntrinsicElements {\n \"iconify-icon\": React.DetailedHTMLProps<\n React.HTMLAttributes & {\n icon: string;\n width?: string | number;\n height?: string | number;\n flip?: string;\n rotate?: string;\n inline?: boolean;\n class?: string;\n },\n HTMLElement\n >;\n }\n }\n}\n\n// https://icon-sets.iconify.design/\nexport type IconProps = DetailedHTMLProps<\n HTMLAttributes,\n HTMLSpanElement\n> & {\n icon: string;\n srOnly?: string;\n /**\n * Use iconify-icon web component for on-demand loading from Iconify API.\n * This is useful for dynamic icon names that can't be statically analyzed.\n */\n demand?: boolean;\n};\n\n// Normalize icon name for iconify-icon web component\nconst normalizeIconName = (icon: string): string => {\n // Remove icon-[ prefix and ] suffix if present\n let normalized = icon.replace(/^icon-\\[/, \"\").replace(/\\]$/, \"\");\n\n // if not has \"--\" auto add \"lucide:\"\n if (!normalized.includes(\"--\") && !normalized.includes(\":\")) {\n normalized = `lucide:${normalized}`;\n }\n\n // Convert lucide-- to lucide:\n normalized = normalized.replace(/^lucide--/, \"lucide:\");\n\n return normalized;\n};\n\nexport const Icon = ({\n icon,\n className,\n srOnly,\n demand = false,\n style,\n ...properties\n}: IconProps) => {\n if (demand) {\n // Use iconify-icon web component for on-demand loading\n const normalizedIcon = normalizeIconName(icon);\n\n return (\n <>\n \n {srOnly && {srOnly}}\n \n );\n }\n\n // Use Tailwind class-based approach\n return (\n <>\n \n {srOnly && {srOnly}}\n \n );\n};\n", "type": "registry:file", "target": "icons/icon-component.tsx" }, { "path": "icons/wrapper.tsx", "content": "import type { HTMLAttributes, ReactElement } from \"react\";\nimport { cloneElement } from \"react\";\n\nimport { cn } from \"../lib/utils\";\n\ntype IconWrapperProperties = Omit<\n HTMLAttributes,\n \"children\"\n> & {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n children: ReactElement;\n srOnly?: string;\n};\nconst IconWrapper = ({\n children,\n className,\n srOnly,\n ...properties\n}: IconWrapperProperties) => {\n return (\n <>\n \n {cloneElement(children, {\n \"aria-hidden\": \"true\",\n style: {\n width: \"100%\",\n height: \"100%\",\n },\n ...properties,\n })}\n \n {srOnly && {srOnly}}\n \n );\n};\n\nexport type { IconWrapperProperties as IconWrapperProps };\nexport { IconWrapper };\n", "type": "registry:file", "target": "icons/wrapper.tsx" }, { "path": "icons/arrow-down-filled.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype ArrowDownFilledProperties = Omit;\nexport const ArrowDownFilled = (properties: ArrowDownFilledProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/arrow-down-filled.tsx" }, { "path": "icons/arrow-left-outlined.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype ArrowLeftOutlinedProperties = Omit;\nexport const ArrowLeftOutlined = (properties: ArrowLeftOutlinedProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/arrow-left-outlined.tsx" }, { "path": "icons/arrow-right-outlined.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype ArrowRightOutlinedProperties = Omit;\nexport const ArrowRightOutlined = (\n properties: ArrowRightOutlinedProperties,\n) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/arrow-right-outlined.tsx" }, { "path": "icons/check-filled.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype CheckFilledProperties = Omit;\nexport const CheckFilled = (properties: CheckFilledProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/check-filled.tsx" }, { "path": "icons/check-outlined.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\n// lucide\nexport const CheckOutlined = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/check-outlined.tsx" }, { "path": "icons/chevron-right-outlined.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\n// lucide\nexport const ChevronRightOutlined = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/chevron-right-outlined.tsx" }, { "path": "icons/circle-filled.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype CircleFilledProperties = Omit;\nexport const CircleFilled = (properties: CircleFilledProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/circle-filled.tsx" }, { "path": "icons/circle-outlined.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\n// lucide\nexport const CircleOutlined = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/circle-outlined.tsx" }, { "path": "icons/close-outlined.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\nexport const CloseOutlined = (properties: Omit) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/close-outlined.tsx" }, { "path": "icons/csv-icon.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\nexport const CsvIcon = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/csv-icon.tsx" }, { "path": "icons/delete-icon.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype DeleteOutlinedProperties = Omit;\nexport const DeleteIcon = (properties: DeleteOutlinedProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/delete-icon.tsx" }, { "path": "icons/download-icon.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype DownloadIconProperties = Omit;\nexport const DownloadIcon = (properties: DownloadIconProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/download-icon.tsx" }, { "path": "icons/edit-icon.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype EditIconProperties = Omit;\nexport const EditIcon = (properties: EditIconProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/edit-icon.tsx" }, { "path": "icons/info-filled.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype EditIconProperties = Omit;\nexport const InfoFilled = (properties: EditIconProperties) => {\n return (\n \n );\n};\n", "type": "registry:file", "target": "icons/info-filled.tsx" }, { "path": "icons/logout-outlined.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\n// lucide\nexport const LogoutOutlined = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/logout-outlined.tsx" }, { "path": "icons/mail-outlined.tsx", "content": "import type { IconProps as IconProperties } from \"./icon-component\";\nimport { Icon } from \"./icon-component\";\n\ntype MailOutlinedProperties = Omit;\nexport const MailOutlined = (properties: MailOutlinedProperties) => {\n return ;\n};\n", "type": "registry:file", "target": "icons/mail-outlined.tsx" }, { "path": "icons/user-outlined.tsx", "content": "import type { IconWrapperProps as IconWrapperProperties } from \"./wrapper\";\nimport { IconWrapper } from \"./wrapper\";\n\n// lucide\nexport const UserOutlined = (\n properties: Omit,\n) => {\n return (\n \n \n \n \n \n \n \n \n );\n};\n", "type": "registry:file", "target": "icons/user-outlined.tsx" }, { "path": "icons/warning-filled.tsx", "content": "import type { SVGProps } from \"react\";\n\n// ep\nconst WarningFilled = ({\n className,\n ...properties\n}: SVGProps) => {\n return (\n \n \n \n \n \n );\n};\nexport default WarningFilled;\n", "type": "registry:file", "target": "icons/warning-filled.tsx" }, { "path": "types.ts", "content": "export type Direction = \"ltr\" | \"rtl\";\n\nexport type Placement =\n | \"bottom\"\n | \"bottomLeft\"\n | \"bottomRight\"\n | \"top\"\n | \"topLeft\"\n | \"topRight\"\n | \"rightTop\";\nexport type AlignPointTopBottom = \"t\" | \"b\" | \"c\";\nexport type AlignPointLeftRight = \"l\" | \"r\" | \"c\";\n/** Two char of 't' 'b' 'c' 'l' 'r'. Example: 'lt' */\nexport type AlignPoint = `${AlignPointTopBottom}${AlignPointLeftRight}`;\n// export type OffsetType = number | `${number}%`;\nexport type OffsetType = number;\n\nexport interface AlignType {\n /**\n * move point of source node to align with point of target node.\n * Such as ['tr','cc'], align top right point of source node with center point of target node.\n * Point can be 't'(top), 'b'(bottom), 'c'(center), 'l'(left), 'r'(right) */\n\n points?: (string | AlignPoint)[];\n /**\n * @private Do not use in your production code\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n _experimental?: Record;\n /**\n * offset source node by offset[0] in x and offset[1] in y.\n * If offset contains percentage string value, it is relative to sourceNode region.\n */\n offset?: OffsetType[];\n /**\n * offset target node by offset[0] in x and offset[1] in y.\n * If targetOffset contains percentage string value, it is relative to targetNode region.\n */\n targetOffset?: OffsetType[];\n /**\n * If adjustX field is true, will adjust source node in x direction if source node is invisible.\n * If adjustY field is true, will adjust source node in y direction if source node is invisible.\n */\n overflow?: {\n adjustX?: boolean | number;\n adjustY?: boolean | number;\n shiftX?: boolean | number;\n shiftY?: boolean | number;\n };\n /** Auto adjust arrow position */\n autoArrow?: boolean;\n /**\n * Config visible region check of html node. Default `visible`:\n * - `visible`:\n * The visible region of user browser window.\n * Use `clientHeight` for check.\n * If `visible` region not satisfy, fallback to `scroll`.\n * - `scroll`:\n * The whole region of the html scroll area.\n * Use `scrollHeight` for check.\n * - `visibleFirst`:\n * Similar to `visible`, but if `visible` region not satisfy, fallback to `scroll`.\n */\n htmlRegion?: \"visible\" | \"scroll\" | \"visibleFirst\";\n /**\n * Auto chose position with `top` or `bottom` by the align result\n */\n dynamicInset?: boolean;\n /**\n * Whether use css right instead of left to position\n */\n useCssRight?: boolean;\n /**\n * Whether use css bottom instead of top to position\n */\n useCssBottom?: boolean;\n /**\n * Whether use css transform instead of left/top/right/bottom to position if browser supports.\n * Defaults to false.\n */\n useCssTransform?: boolean;\n ignoreShake?: boolean;\n}\n\n// export const Variants = [\"outlined\", \"borderless\", \"filled\"] as const;\n\n// export type Variant = (typeof Variants)[number];\n\nexport type Screens = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\n\nexport type { AnyObject } from \"./components/_util/type\";\n", "type": "registry:file", "target": "types.ts" } ], "type": "registry:component" }