@nexus-cross/design-system 1.0.4-beta.1 → 1.0.4

package/cursor-rules/nexus-ui-components.mdc

@@ -1,114 +1,202 @@
 ---
-description: '@nexus-cross/design-system 공용 컴포넌트 사용 규칙 — AI가 코드 생성 시 반드시 따라야 하는 컴포넌트 사용 지침'
+description: "@nexus-cross/design-system component usage rules — mandatory guidelines for AI code generation"
 alwaysApply: true
 ---
 
-# @nexus-cross/design-system 컴포넌트 사용 규칙
-
-> 이 프로젝트에는 `@nexus-cross/design-system` 디자인 시스템이 설치되어 있다.
-> 코드를 생성할 때 아래 규칙을 반드시 따른다.
-
-## 핵심 원칙
-
-1. **Figma 디자인에 아래 목록에 해당하는 UI 요소가 있으면, 반드시 `@nexus-cross/design-system`에서 import하여 사용한다.**
-2. **동일 기능의 컴포넌트를 직접 구현하지 않는다.** 예: 직접 `<button className="...">` 대신 `<Button>`을 사용.
-3. **스타일 커스텀은 `className` prop으로 오버라이드**한다. 래퍼 div를 추가하지 않는다.
-4. **`asChild` prop**을 지원하는 컴포넌트는 렌더링 요소를 변경할 수 있다.
-5. **variants 함수만 가져다 쓸 수도 있다** (예: `buttonVariants({ semantic: 'primary', variant: 'contained', size: 'lg' })`).
-
-## 컴포넌트 매핑 가이드
-
-| Figma 요소         | 사용할 컴포넌트                | import                                                                   |
-| ------------------ | ------------------------------ | ------------------------------------------------------------------------ |
-| 버튼               | `<Button>`                     | `import { Button } from '@nexus-cross/design-system'`                    |
-| 텍스트 입력 필드   | `<TextInput>`                  | `import { TextInput } from '@nexus-cross/design-system'`                 |
-| 텍스트 영역        | `<TextArea>`                   | `import { TextArea } from '@nexus-cross/design-system'`                  |
-| 셀렉트/드롭다운    | `<Select>` + `<SelectItem>`    | `import { Select, SelectItem } from '@nexus-cross/design-system'`        |
-| 체크박스           | `<CheckBox>`                   | `import { CheckBox } from '@nexus-cross/design-system'`                  |
-| 라디오 그룹        | `<RadioGroup>` + `<RadioItem>` | `import { RadioGroup, RadioItem } from '@nexus-cross/design-system'`     |
-| 토글/스위치        | `<Switch>`                     | `import { Switch } from '@nexus-cross/design-system'`                    |
-| 칩/태그/뱃지       | `<Chip>`                       | `import { Chip } from '@nexus-cross/design-system'`                      |
-| 로딩 스피너        | `<Spinner>`                    | `import { Spinner } from '@nexus-cross/design-system'`                   |
-| 구분선             | `<Divider>`                    | `import { Divider } from '@nexus-cross/design-system'`                   |
-| 툴팁               | `<Tooltip>`                    | `import { Tooltip } from '@nexus-cross/design-system'`                   |
-| 팝오버             | `<Popover>`                    | `import { Popover } from '@nexus-cross/design-system'`                   |
-| 아코디언/접기      | `<Accordion>`                  | `import { Accordion } from '@nexus-cross/design-system'`                 |
-| 드로어/바텀시트    | `<Drawer>`                     | `import { Drawer } from '@nexus-cross/design-system'`                    |
-| 모달/다이얼로그    | `openModal()`                  | `import { openModal } from '@nexus-cross/design-system'`                 |
-| 토스트/알림        | `toast()`                      | `import { toast } from '@nexus-cross/design-system'`                     |
-| 테이블             | `<Table>`                      | `import { Table, TableRow, TdColumn } from '@nexus-cross/design-system'` |
-| 무한 스크롤        | `<InfiniteScroll>`             | `import { InfiniteScroll } from '@nexus-cross/design-system'`            |
-| 텍스트 말줄임      | `<Ellipsis>`                   | `import { Ellipsis } from '@nexus-cross/design-system'`                  |
-| 페이지네이션       | `<Pagination>`                 | `import { Pagination } from '@nexus-cross/design-system'`                |
-| 숫자 입력          | `<NumberInput>`                | `import { NumberInput } from '@nexus-cross/design-system'`               |
-| 아바타/프로필      | `<Avatar>`                     | `import { Avatar } from '@nexus-cross/design-system'`                    |
-| 숫자 카운트        | `<Counter>`                    | `import { Counter } from '@nexus-cross/design-system'`                   |
-| 카운트다운         | `<Countdown>`                  | `import { Countdown } from '@nexus-cross/design-system'`                 |
-| 마퀴/흐르는 텍스트 | `<Marquee>`                    | `import { Marquee } from '@nexus-cross/design-system'`                   |
-| 탭                 | `<Tab>`                        | `import { Tab } from '@nexus-cross/design-system'`                       |
-| 캐러셀/슬라이더    | `<Carousel>`                   | `import { Carousel, CarouselSlide } from '@nexus-cross/design-system'`   |
-| 가상 스크롤 리스트 | `<VirtualList>`                | `import { VirtualList } from '@nexus-cross/design-system'`               |
-| 가상 스크롤 그리드 | `<VirtualGrid>`                | `import { VirtualGrid } from '@nexus-cross/design-system'`               |
-| 데이터 리스트      | `<DataList>`                   | `import { DataList } from '@nexus-cross/design-system'`                  |
-| 스켈레톤 로딩      | `<Skeleton>`                   | `import { Skeleton } from '@nexus-cross/design-system'`                  |
-
-## 유틸리티 & 훅
-
-| 기능                    | 사용                              | import                                                                              |
-| ----------------------- | --------------------------------- | ----------------------------------------------------------------------------------- |
-| 클래스 병합             | `cn()`                            | `import { cn } from '@nexus-cross/design-system'`                                   |
-| 모달 훅                 | `useModal()`                      | `import { useModal } from '@nexus-cross/design-system'`                             |
-| 뷰포트 감지             | `useInView()`                     | `import { useInView } from '@nexus-cross/design-system'`                            |
-| 디바이스 체크           | `useCheckDevice()`                | `import { useCheckDevice } from '@nexus-cross/design-system'`                       |
-| 외부 클릭               | `useClickOutside()`               | `import { useClickOutside } from '@nexus-cross/design-system'`                      |
-| NumberInput 외부 바인딩 | `numberInputBind(ref, direction)` | `import { numberInputBind, type NumberInputRef } from '@nexus-cross/design-system'` |
-
-## asChild 패턴
-
-`asChild`를 지원하는 컴포넌트: **Button**, **Chip**
+# @nexus-cross/design-system Component Rules
+
+> This project uses `@nexus-cross/design-system`.
+> All generated code MUST follow the rules below.
+
+## Core Principles
+
+1. **If a UI element matches any component in the mapping guide below, you MUST import and use it from `@nexus-cross/design-system`.**
+2. **Never re-implement a component that already exists.** e.g. use `<Button>` instead of `<button className="...">`.
+3. **Use the `className` prop for style overrides.** Do not add wrapper divs.
+4. **Use `asChild` prop** to change the rendered element (supported by Button, Chip).
+5. **Variant functions can be used standalone** (e.g. `buttonVariants({ variant: 'primary', size: 'lg' })`).
+
+## Component Mapping Pre-step (MANDATORY)
+
+**Before writing a single line of code**, map every UI element in the design to a NEXUS component.
+
+1. Identify **all interactive and visual elements** from the design (Figma / MCP output / screenshot).
+2. For each element, ask: **"Does this map to a component in the mapping guide below?"**
+3. Document the mapping as a table or list, then start coding.
+4. Before using any native HTML element (`<button>`, `<img>`, `<span>`, etc.), you MUST verify there is no NEXUS replacement.
+
+Example mapping:
+```
+Detected Element          → NEXUS Component
+──────────────────────────────────────────
+Circular profile images (8)  → <Avatar>
+Category filter tabs (5)     → <Tab>
+Icon-only buttons (4)        → <Button variant="ghost">
+Yes/No status badges (12)    → <Chip variant="filled" size="sm">
+Search input field (1)       → <TextInput>
+Dividers (2)                 → <Divider>
+```
+
+## Component Mapping Guide
+
+| UI Element | Component | import |
+|---|---|---|
+| Button | `<Button>` | `import { Button } from '@nexus-cross/design-system'` |
+| Text input | `<TextInput>` | `import { TextInput } from '@nexus-cross/design-system'` |
+| Text area | `<TextArea>` | `import { TextArea } from '@nexus-cross/design-system'` |
+| Select / Dropdown | `<Select>` + `<SelectItem>` | `import { Select, SelectItem } from '@nexus-cross/design-system'` |
+| Checkbox | `<CheckBox>` | `import { CheckBox } from '@nexus-cross/design-system'` |
+| Radio group | `<RadioGroup>` + `<RadioItem>` | `import { RadioGroup, RadioItem } from '@nexus-cross/design-system'` |
+| Toggle / Switch | `<Switch>` | `import { Switch } from '@nexus-cross/design-system'` |
+| Chip / Tag / Badge | `<Chip>` | `import { Chip } from '@nexus-cross/design-system'` |
+| Loading spinner | `<Spinner>` | `import { Spinner } from '@nexus-cross/design-system'` |
+| Divider | `<Divider>` | `import { Divider } from '@nexus-cross/design-system'` |
+| Tooltip | `<Tooltip>` | `import { Tooltip } from '@nexus-cross/design-system'` |
+| Popover | `<Popover>` | `import { Popover } from '@nexus-cross/design-system'` |
+| Accordion / Collapsible | `<Accordion>` | `import { Accordion } from '@nexus-cross/design-system'` |
+| Drawer / Bottom sheet | `<Drawer>` | `import { Drawer } from '@nexus-cross/design-system'` |
+| Modal / Dialog | `openModal()` | `import { openModal } from '@nexus-cross/design-system'` |
+| Toast / Notification | `toast()` | `import { toast } from '@nexus-cross/design-system'` |
+| Table | `<Table>` | `import { Table, TableRow, TdColumn } from '@nexus-cross/design-system'` |
+| Infinite scroll | `<InfiniteScroll>` | `import { InfiniteScroll } from '@nexus-cross/design-system'` |
+| Text ellipsis | `<Ellipsis>` | `import { Ellipsis } from '@nexus-cross/design-system'` |
+| Pagination | `<Pagination>` | `import { Pagination } from '@nexus-cross/design-system'` |
+| Number input | `<NumberInput>` | `import { NumberInput } from '@nexus-cross/design-system'` |
+| Avatar / Profile | `<Avatar>` | `import { Avatar } from '@nexus-cross/design-system'` |
+| Counter | `<Counter>` | `import { Counter } from '@nexus-cross/design-system'` |
+| Countdown | `<Countdown>` | `import { Countdown } from '@nexus-cross/design-system'` |
+| Marquee | `<Marquee>` | `import { Marquee } from '@nexus-cross/design-system'` |
+| Tab | `<Tab>` | `import { Tab } from '@nexus-cross/design-system'` |
+| Carousel / Slider | `<Carousel>` | `import { Carousel, CarouselSlide } from '@nexus-cross/design-system'` |
+| Virtual scroll list | `<VirtualList>` | `import { VirtualList } from '@nexus-cross/design-system'` |
+| Virtual scroll grid | `<VirtualGrid>` | `import { VirtualGrid } from '@nexus-cross/design-system'` |
+| Data list | `<DataList>` | `import { DataList } from '@nexus-cross/design-system'` |
+| Skeleton loader | `<Skeleton>` | `import { Skeleton } from '@nexus-cross/design-system'` |
+
+## Visual Pattern → Component Mapping
+
+The table above maps by Figma element name, which can miss **visual patterns**. If you see any pattern below, you MUST use the corresponding component.
+
+| Visual Pattern on Screen | Component | Common Mistake |
+|---|---|---|
+| Circular/square profile image, user icon | `<Avatar>` | Using `<Image>` + `rounded-full` manually |
+| Icon-only button (hamburger, X, settings, app launcher, etc.) | `<Button variant="ghost">` or `<Button variant="outlined">` | Using native `<button>` |
+| Horizontal filter/tab group (single selection) | `<Tab>` | Repeating `<button>` manually |
+| Small label / badge / status indicator (Yes/No, Active, New, etc.) | `<Chip>` | Using native `<span>` |
+| Number increment/decrement UI (+/- buttons) | `<NumberInput>` + `numberInputBind` | Using `<input type="number">` + custom buttons |
+| Data list with loading/empty states | `<DataList>` | Using `{list.map()}` + manual conditional rendering |
+| Overflowing text | `<Ellipsis>` | Applying `truncate` / `line-clamp` directly |
+
+## Utilities & Hooks
+
+| Feature | Usage | import |
+|---|---|---|
+| Class merge | `cn()` | `import { cn } from '@nexus-cross/design-system'` |
+| Modal hook | `useModal()` | `import { useModal } from '@nexus-cross/design-system'` |
+| Viewport detection | `useInView()` | `import { useInView } from '@nexus-cross/design-system'` |
+| Device check | `useCheckDevice()` | `import { useCheckDevice } from '@nexus-cross/design-system'` |
+| Outside click | `useClickOutside()` | `import { useClickOutside } from '@nexus-cross/design-system'` |
+
+## asChild Pattern
+
+Components supporting `asChild`: **Button**, **Chip**
 
 ```tsx
-// Button을 <a> 태그로 렌더링
-<Button asChild semantic="primary" variant="contained">
+// Render Button as <a>
+<Button asChild variant="primary">
   <a href="/about">About</a>
 </Button>
 
-// Chip을 <li>로 렌더링
+// Render Chip as <li>
 <Chip asChild variant="accent" size="sm">
-  <li>리스트 아이템</li>
+  <li>List item</li>
 </Chip>
 ```
 
-## variants 함수만 사용하기
+## Using Variant Functions Only
 
-컴포넌트를 사용하지 않고 variant 클래스만 필요할 때:
+When you only need variant classes without the component:
 
 ```tsx
-import { buttonVariants } from '@nexus-cross/design-system'
-
-// 직접 <a> 태그에 Button 스타일 적용
-;<a
-  href="/link"
-  className={buttonVariants({
-    semantic: 'primary',
-    variant: 'outlined',
-    size: 'sm',
-  })}
->
-  링크
+import { buttonVariants } from '@nexus-cross/design-system';
+
+<a href="/link" className={buttonVariants({ variant: 'outline', size: 'sm' })}>
+  Link
 </a>
 ```
 
-사용 가능한 variants 함수: `buttonVariants`, `chipVariants`, `switchVariants`, `textInputVariants`, `textAreaVariants`, `checkBoxVariants`, `radioGroupVariants`, `radioItemVariants`, `dividerVariants`, `typographyVariants`, `selectTriggerVariants`, `selectContentVariants`, `tooltipContentVariants`, `popoverContentVariants`, `drawerContentVariants`
+Available variant functions: `buttonVariants`, `chipVariants`, `switchVariants`, `textInputVariants`, `textAreaVariants`, `checkBoxVariants`, `radioGroupVariants`, `radioItemVariants`, `dividerVariants`, `selectTriggerVariants`, `selectContentVariants`, `tooltipContentVariants`, `popoverContentVariants`, `drawerContentVariants`
+
+## When Customization Is Needed
+
+1. **Style-only difference**: Override with `className` prop.
+2. **Project-specific variant**: Create a project wrapper component that uses the NEXUS component internally.
+3. **Completely different structure**: Use native elements ONLY when NEXUS component props and `className` override **cannot produce the desired result by any means**.
+
+### Checklist Before Using Native Elements
+
+Before using any native HTML element (`<button>`, `<img>`, `<span>`, etc.), you MUST confirm all of the following:
+
+- [ ] No matching component exists in both the "Component Mapping Guide" and "Visual Pattern → Component Mapping" tables above?
+- [ ] Cannot achieve the desired style by passing `className` to a NEXUS component?
+- [ ] Cannot use the NEXUS component by placing surrounding elements (icons, labels) outside of it?
+
+### Common Misjudgments (DO NOT make these mistakes)
+
+```
+WRONG: "It only has an icon, so it's not a Button"
+RIGHT: → <Button variant="ghost" size="sm"> + icon children
+
+WRONG: "There's a filter icon next to it, so Tab structure doesn't match"
+RIGHT: → Place the icon outside and use <Tab>
+
+WRONG: "It's a small label, not a Chip"
+RIGHT: → <Chip variant="filled" size="sm"> matches exactly
+
+WRONG: "It displays an image directly, not an Avatar"
+RIGHT: → <Avatar src={url} alt={name} size="sm" />
+```
+
+## className Override Rules
+
+`@nexus-cross/design-system` components internally use Tailwind classes with the `nx:` prefix.
+The `cn()` function automatically resolves cross-prefix conflicts, so **consumers should pass regular Tailwind classes without `!` (important).**
+
+```tsx
+// CORRECT — pass without !
+<Avatar className="size-9" />
+<Button className="bg-red-500 px-8" />
+
+// FORBIDDEN — do not use ! (important modifier)
+<Avatar className="!size-9" />
+<Button className="!bg-red-500 !px-8" />
+```
+
+## CSS Import by Environment (Required)
 
-## 커스텀이 필요한 경우
+Choose one of two CSS entry points depending on the project environment:
 
-1. **스타일만 다를 때**: `className` prop으로 오버라이드
-2. **variant가 프로젝트 전용일 때**: 프로젝트 래퍼 컴포넌트 생성 (공용 컴포넌트를 내부에서 사용)
-3. **구조가 완전히 다를 때**: `<button>` 등 네이티브 요소 직접 사용 가능 (강제 아님)
+| Environment | import |
+|---|---|
+| Tailwind v3 / Plain CSS / CSS Modules | `@nexus-cross/design-system/styles` |
+| Tailwind v4 | `@nexus-cross/design-system/styles/layer` |
+
+```tsx
+// TW v3 / Plain CSS / CSS Modules
+import '@nexus-cross/design-system/styles'
+
+// TW v4 (wrapped in @layer nexus — ensures className utility overrides)
+import '@nexus-cross/design-system/styles/layer'
+```
+
+For Tailwind v4 projects, also declare layer order in `globals.css`:
+```css
+@layer base, nexus, components, utilities;
+```
 
-## 금지 사항
+## Prohibited
 
-- `@nexus-cross/design-system`에 이미 있는 컴포넌트를 직접 구현하지 않는다
-- Radix UI, Headless UI 등을 직접 import하여 동일 기능 컴포넌트를 만들지 않는다
-- `@nexus-cross/design-system` 컴포넌트의 내부 구현을 복사하지 않는다
+- Do NOT re-implement any component that exists in `@nexus-cross/design-system`
+- Do NOT import Radix UI, Headless UI, etc. to build equivalent components
+- Do NOT copy internal implementations of `@nexus-cross/design-system` components
+- **Do NOT use `!` (Tailwind important modifier) in `className` overrides** — `cn()` resolves prefix conflicts automatically

package/dist/accordion.js

@@ -1,28 +1,28 @@
 'use strict';
 
-var chunkMPKRXMCJ_js = require('./chunks/chunk-MPKRXMCJ.js');
-require('./chunks/chunk-QJNQCLMV.js');
+var chunkCSJDDREF_js = require('./chunks/chunk-CSJDDREF.js');
+require('./chunks/chunk-CZC76ZD5.js');
 require('./chunks/chunk-JNMCYWGY.js');
 
 
 
 Object.defineProperty(exports, "Accordion", {
   enumerable: true,
-  get: function () { return chunkMPKRXMCJ_js.Accordion; }
+  get: function () { return chunkCSJDDREF_js.Accordion; }
 });
 Object.defineProperty(exports, "AccordionContent", {
   enumerable: true,
-  get: function () { return chunkMPKRXMCJ_js.AccordionContent; }
+  get: function () { return chunkCSJDDREF_js.AccordionContent; }
 });
 Object.defineProperty(exports, "AccordionItem", {
   enumerable: true,
-  get: function () { return chunkMPKRXMCJ_js.AccordionItem; }
+  get: function () { return chunkCSJDDREF_js.AccordionItem; }
 });
 Object.defineProperty(exports, "AccordionRoot", {
   enumerable: true,
-  get: function () { return chunkMPKRXMCJ_js.AccordionRoot; }
+  get: function () { return chunkCSJDDREF_js.AccordionRoot; }
 });
 Object.defineProperty(exports, "AccordionTrigger", {
   enumerable: true,
-  get: function () { return chunkMPKRXMCJ_js.AccordionTrigger; }
+  get: function () { return chunkCSJDDREF_js.AccordionTrigger; }
 });

package/dist/accordion.mjs

@@ -1,3 +1,3 @@
-export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger } from './chunks/chunk-U6KOUYWX.mjs';
-import './chunks/chunk-XALPBGSC.mjs';
+export { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger } from './chunks/chunk-XG6QG65W.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
 import './chunks/chunk-CVYXRSXT.mjs';

package/dist/alert.d.mts

@@ -0,0 +1,17 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const alertVariants: (props?: ({
+    variant?: "danger" | "info" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+    title?: string;
+    icon?: React.ReactNode;
+    closable?: boolean;
+    onClose?: () => void;
+    action?: React.ReactNode;
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Alert, type AlertProps, alertVariants };

package/dist/alert.d.ts

@@ -0,0 +1,17 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const alertVariants: (props?: ({
+    variant?: "danger" | "info" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+    title?: string;
+    icon?: React.ReactNode;
+    closable?: boolean;
+    onClose?: () => void;
+    action?: React.ReactNode;
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Alert, type AlertProps, alertVariants };

package/dist/alert.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var chunk5PQ3UCKF_js = require('./chunks/chunk-5PQ3UCKF.js');
+require('./chunks/chunk-CZC76ZD5.js');
+require('./chunks/chunk-JNMCYWGY.js');
+
+
+
+Object.defineProperty(exports, "Alert", {
+  enumerable: true,
+  get: function () { return chunk5PQ3UCKF_js.Alert; }
+});
+Object.defineProperty(exports, "alertVariants", {
+  enumerable: true,
+  get: function () { return chunk5PQ3UCKF_js.alertVariants; }
+});

package/dist/alert.mjs

@@ -0,0 +1,3 @@
+export { Alert, alertVariants } from './chunks/chunk-2UPGFY6E.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
+import './chunks/chunk-CVYXRSXT.mjs';

package/dist/avatar.js

@@ -1,16 +1,16 @@
 'use strict';
 
-var chunk377KBJQG_js = require('./chunks/chunk-377KBJQG.js');
-require('./chunks/chunk-QJNQCLMV.js');
+var chunkMA2VCCIY_js = require('./chunks/chunk-MA2VCCIY.js');
+require('./chunks/chunk-CZC76ZD5.js');
 require('./chunks/chunk-JNMCYWGY.js');
 
 
 
 Object.defineProperty(exports, "Avatar", {
   enumerable: true,
-  get: function () { return chunk377KBJQG_js.Avatar; }
+  get: function () { return chunkMA2VCCIY_js.Avatar; }
 });
 Object.defineProperty(exports, "avatarVariants", {
   enumerable: true,
-  get: function () { return chunk377KBJQG_js.avatarVariants; }
+  get: function () { return chunkMA2VCCIY_js.avatarVariants; }
 });

package/dist/avatar.mjs

@@ -1,3 +1,3 @@
-export { Avatar, avatarVariants } from './chunks/chunk-JZ3PWHKS.mjs';
-import './chunks/chunk-XALPBGSC.mjs';
+export { Avatar, avatarVariants } from './chunks/chunk-YLO4UKSC.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
 import './chunks/chunk-CVYXRSXT.mjs';

package/dist/badge.d.mts

@@ -0,0 +1,18 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const badgeVariants: (props?: ({
+    variant?: "primary" | "secondary" | "danger" | "info" | "success" | "warning" | null | undefined;
+    size?: "lg" | "md" | "sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
+    count?: number;
+    max?: number;
+    dot?: boolean;
+    showZero?: boolean;
+    offset?: [number, number];
+}
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Badge, type BadgeProps, badgeVariants };

package/dist/badge.d.ts

@@ -0,0 +1,18 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const badgeVariants: (props?: ({
+    variant?: "primary" | "secondary" | "danger" | "info" | "success" | "warning" | null | undefined;
+    size?: "lg" | "md" | "sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
+    count?: number;
+    max?: number;
+    dot?: boolean;
+    showZero?: boolean;
+    offset?: [number, number];
+}
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Badge, type BadgeProps, badgeVariants };

package/dist/badge.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var chunkS2GMEC43_js = require('./chunks/chunk-S2GMEC43.js');
+require('./chunks/chunk-CZC76ZD5.js');
+require('./chunks/chunk-JNMCYWGY.js');
+
+
+
+Object.defineProperty(exports, "Badge", {
+  enumerable: true,
+  get: function () { return chunkS2GMEC43_js.Badge; }
+});
+Object.defineProperty(exports, "badgeVariants", {
+  enumerable: true,
+  get: function () { return chunkS2GMEC43_js.badgeVariants; }
+});

package/dist/badge.mjs

@@ -0,0 +1,3 @@
+export { Badge, badgeVariants } from './chunks/chunk-CUTMLBC3.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
+import './chunks/chunk-CVYXRSXT.mjs';

package/dist/breadcrumb.d.mts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface BreadcrumbItem {
+    label: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+}
+interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    items: BreadcrumbItem[];
+    separator?: React.ReactNode;
+    maxItems?: number;
+}
+declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+
+export { Breadcrumb, type BreadcrumbItem, type BreadcrumbProps };

package/dist/breadcrumb.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface BreadcrumbItem {
+    label: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+}
+interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    items: BreadcrumbItem[];
+    separator?: React.ReactNode;
+    maxItems?: number;
+}
+declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+
+export { Breadcrumb, type BreadcrumbItem, type BreadcrumbProps };

package/dist/breadcrumb.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var chunk3ZWN66YH_js = require('./chunks/chunk-3ZWN66YH.js');
+require('./chunks/chunk-CZC76ZD5.js');
+require('./chunks/chunk-JNMCYWGY.js');
+
+
+
+Object.defineProperty(exports, "Breadcrumb", {
+  enumerable: true,
+  get: function () { return chunk3ZWN66YH_js.Breadcrumb; }
+});

package/dist/breadcrumb.mjs

@@ -0,0 +1,3 @@
+export { Breadcrumb } from './chunks/chunk-EJY7IVSK.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
+import './chunks/chunk-CVYXRSXT.mjs';

package/dist/button.js

@@ -1,16 +1,16 @@
 'use strict';
 
-var chunkWVIEIRK2_js = require('./chunks/chunk-WVIEIRK2.js');
-require('./chunks/chunk-QJNQCLMV.js');
+var chunkP3DZKXG4_js = require('./chunks/chunk-P3DZKXG4.js');
+require('./chunks/chunk-CZC76ZD5.js');
 require('./chunks/chunk-JNMCYWGY.js');
 
 
 
 Object.defineProperty(exports, "Button", {
   enumerable: true,
-  get: function () { return chunkWVIEIRK2_js.Button; }
+  get: function () { return chunkP3DZKXG4_js.Button; }
 });
 Object.defineProperty(exports, "buttonVariants", {
   enumerable: true,
-  get: function () { return chunkWVIEIRK2_js.buttonVariants; }
+  get: function () { return chunkP3DZKXG4_js.buttonVariants; }
 });

package/dist/button.mjs

@@ -1,3 +1,3 @@
-export { Button, buttonVariants } from './chunks/chunk-NTN55ZIX.mjs';
-import './chunks/chunk-XALPBGSC.mjs';
+export { Button, buttonVariants } from './chunks/chunk-VVXQZ4XH.mjs';
+import './chunks/chunk-MCKOWMLS.mjs';
 import './chunks/chunk-CVYXRSXT.mjs';

package/dist/carousel.js

@@ -1,32 +1,32 @@
 'use strict';
 
-var chunkQ7H6LCNN_js = require('./chunks/chunk-Q7H6LCNN.js');
-require('./chunks/chunk-QJNQCLMV.js');
+var chunkYCG4FZC3_js = require('./chunks/chunk-YCG4FZC3.js');
+require('./chunks/chunk-CZC76ZD5.js');
 require('./chunks/chunk-JNMCYWGY.js');
 
 
 
 Object.defineProperty(exports, "Carousel", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.Carousel; }
+  get: function () { return chunkYCG4FZC3_js.Carousel; }
 });
 Object.defineProperty(exports, "CarouselDots", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.CarouselDots; }
+  get: function () { return chunkYCG4FZC3_js.CarouselDots; }
 });
 Object.defineProperty(exports, "CarouselNext", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.CarouselNext; }
+  get: function () { return chunkYCG4FZC3_js.CarouselNext; }
 });
 Object.defineProperty(exports, "CarouselPrev", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.CarouselPrev; }
+  get: function () { return chunkYCG4FZC3_js.CarouselPrev; }
 });
 Object.defineProperty(exports, "CarouselSlide", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.CarouselSlide; }
+  get: function () { return chunkYCG4FZC3_js.CarouselSlide; }
 });
 Object.defineProperty(exports, "useCarousel", {
   enumerable: true,
-  get: function () { return chunkQ7H6LCNN_js.useCarousel; }
+  get: function () { return chunkYCG4FZC3_js.useCarousel; }
 });