@nori-ui/core 1.7.0 → 1.8.0

package/dist/client.d.cts

@@ -18,6 +18,7 @@ export { Button, ButtonProps, ButtonSize, ButtonVariant } from './components/But
 export { ButtonGroup, ButtonGroupOrientation, ButtonGroupProps, ButtonGroupSize } from './components/ButtonGroup/index.cjs';
 export { Calendar, CalendarBehavior, CalendarCaption, CalendarCaptionProps, CalendarChangeMeta, CalendarMode, CalendarProps, CalendarValue, CalendarView, CaptionContextValue, CaptionOption, DateRange, DayContext, useCalendarCaption } from './components/Calendar/index.cjs';
 export { Card, CardProps, CardSectionProps, CardTextProps } from './components/Card/index.cjs';
+export { Carousel, CarouselButtonProps, CarouselContentProps, CarouselDotsProps, CarouselItemProps, CarouselProps } from './components/Carousel/index.cjs';
 export { Checkbox, CheckboxProps } from './components/Checkbox/index.cjs';
 export { Collapsible, CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps } from './components/Collapsible/index.cjs';
 export { Combobox } from './components/Combobox/index.cjs';
@@ -29,8 +30,10 @@ export { DropdownMenu, DropdownMenuContentProps, DropdownMenuProps, DropdownMenu
 export { Empty, EmptyProps } from './components/Empty/index.cjs';
 export { Field, FieldGroupProps, FieldProps } from './components/Field/index.cjs';
 export { FloatButton, FloatButtonBackToTopProps, FloatButtonBadge, FloatButtonGroupDirection, FloatButtonGroupProps, FloatButtonGroupTrigger, FloatButtonPlacement, FloatButtonProps, FloatButtonShape, FloatButtonSize, FloatButtonVariant } from './components/FloatButton/index.cjs';
+export { HoverCard, HoverCardContentProps, HoverCardProps, HoverCardTriggerProps } from './components/HoverCard/index.cjs';
 export { HStack, HStackProps, StackAlign, StackGap, StackJustify } from './components/HStack/index.cjs';
 export { InputGroup, InputGroupAddonProps, InputGroupInputProps, InputGroupProps } from './components/InputGroup/index.cjs';
+export { InputOTP, InputOTPPattern, InputOTPProps } from './components/InputOTP/index.cjs';
 export { Item, ItemProps } from './components/Item/index.cjs';
 export { Kbd, KbdProps } from './components/Kbd/index.cjs';
 export { Label, LabelProps } from './components/Label/index.cjs';

package/dist/client.d.ts

@@ -18,6 +18,7 @@ export { Button, ButtonProps, ButtonSize, ButtonVariant } from './components/But
 export { ButtonGroup, ButtonGroupOrientation, ButtonGroupProps, ButtonGroupSize } from './components/ButtonGroup/index.js';
 export { Calendar, CalendarBehavior, CalendarCaption, CalendarCaptionProps, CalendarChangeMeta, CalendarMode, CalendarProps, CalendarValue, CalendarView, CaptionContextValue, CaptionOption, DateRange, DayContext, useCalendarCaption } from './components/Calendar/index.js';
 export { Card, CardProps, CardSectionProps, CardTextProps } from './components/Card/index.js';
+export { Carousel, CarouselButtonProps, CarouselContentProps, CarouselDotsProps, CarouselItemProps, CarouselProps } from './components/Carousel/index.js';
 export { Checkbox, CheckboxProps } from './components/Checkbox/index.js';
 export { Collapsible, CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps } from './components/Collapsible/index.js';
 export { Combobox } from './components/Combobox/index.js';
@@ -29,8 +30,10 @@ export { DropdownMenu, DropdownMenuContentProps, DropdownMenuProps, DropdownMenu
 export { Empty, EmptyProps } from './components/Empty/index.js';
 export { Field, FieldGroupProps, FieldProps } from './components/Field/index.js';
 export { FloatButton, FloatButtonBackToTopProps, FloatButtonBadge, FloatButtonGroupDirection, FloatButtonGroupProps, FloatButtonGroupTrigger, FloatButtonPlacement, FloatButtonProps, FloatButtonShape, FloatButtonSize, FloatButtonVariant } from './components/FloatButton/index.js';
+export { HoverCard, HoverCardContentProps, HoverCardProps, HoverCardTriggerProps } from './components/HoverCard/index.js';
 export { HStack, HStackProps, StackAlign, StackGap, StackJustify } from './components/HStack/index.js';
 export { InputGroup, InputGroupAddonProps, InputGroupInputProps, InputGroupProps } from './components/InputGroup/index.js';
+export { InputOTP, InputOTPPattern, InputOTPProps } from './components/InputOTP/index.js';
 export { Item, ItemProps } from './components/Item/index.js';
 export { Kbd, KbdProps } from './components/Kbd/index.js';
 export { Label, LabelProps } from './components/Label/index.js';

package/dist/client.js

@@ -1,30 +1,34 @@
 import './chunk-BRCCWMGJ.js';
+export { Icon } from './chunk-33S7ADWM.js';
+export { TextArea } from './chunk-USFXANEU.js';
+export { TextInput } from './chunk-V75O7QQO.js';
+export { Toaster, toast } from './chunk-LWLK6HSW.js';
 export { Toggle } from './chunk-STX5UKYT.js';
 export { Tooltip } from './chunk-VL2WNGPF.js';
 export { VStack } from './chunk-L6VYDM7S.js';
 export { blueTheme, orangeTheme, presetThemes, roseTheme, slateTheme, tealTheme, useTheme, violetTheme } from './chunk-MDOZGILD.js';
 import './chunk-QI6646JZ.js';
-export { Icon } from './chunk-33S7ADWM.js';
+export { Drawer, Sheet, SheetBody, SheetClose, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetTitle, SheetTrigger } from './chunk-SF6WPUC5.js';
+export { Skeleton } from './chunk-3IIIHZHT.js';
+export { Slider, SliderGestureProvider, useSliderInteractionActive } from './chunk-7FSFJA33.js';
 export { Switch } from './chunk-RI4Y2C5U.js';
 import './chunk-VP7DRJUZ.js';
 export { Tabs } from './chunk-EN4CLDGZ.js';
-export { TextArea } from './chunk-USFXANEU.js';
-export { TextInput } from './chunk-V75O7QQO.js';
-export { Toaster, toast } from './chunk-LWLK6HSW.js';
+export { Label } from './chunk-3CEJ5TB4.js';
+export { PAGINATION_COMPACT_BREAKPOINT, Pagination } from './chunk-3B345SQU.js';
 export { Progress } from './chunk-OELY6K44.js';
 export { Radio } from './chunk-UKDDK42K.js';
 export { SegmentedControl } from './chunk-F5UKI7XD.js';
 export { Separator } from './chunk-2XJCLPNH.js';
-export { Drawer, Sheet, SheetBody, SheetClose, SheetDescription, SheetFooter, SheetHeader, SheetPanel, SheetTitle, SheetTrigger } from './chunk-SF6WPUC5.js';
-export { Skeleton } from './chunk-3IIIHZHT.js';
-export { Slider, SliderGestureProvider, useSliderInteractionActive } from './chunk-7FSFJA33.js';
+export { Field } from './chunk-CPIKN4BX.js';
 export { FloatButton } from './chunk-PJXVLE24.js';
 export { HStack } from './chunk-OIHX5B4R.js';
+export { HoverCard } from './chunk-BOMPFNM4.js';
 export { InputGroup } from './chunk-C5HQPXRI.js';
+export { InputOTP } from './chunk-BVLOX4A3.js';
 export { Item } from './chunk-J5LK2XHE.js';
 export { Kbd } from './chunk-IGBXSBF7.js';
-export { Label } from './chunk-3CEJ5TB4.js';
-export { PAGINATION_COMPACT_BREAKPOINT, Pagination } from './chunk-3B345SQU.js';
+export { Collapsible } from './chunk-M4BI63P6.js';
 export { Combobox } from './chunk-IIVTPN62.js';
 export { ContextMenu } from './chunk-TSWPHJIU.js';
 export { DataTable } from './chunk-C32XGHWO.js';
@@ -35,7 +39,6 @@ export { Dialog } from './chunk-PLQPBMG2.js';
 import './chunk-2PESUXE3.js';
 export { DropdownMenu, MenuContent, MenuItem, MenuLabel, MenuSeparator } from './chunk-MK57AOTI.js';
 export { Empty } from './chunk-XQNVWHMN.js';
-export { Field } from './chunk-CPIKN4BX.js';
 export { Box } from './chunk-IWM2XDXH.js';
 import './chunk-VLZANXRZ.js';
 export { Text } from './chunk-ZGFXKYA5.js';
@@ -52,9 +55,9 @@ import { I18nProvider } from './chunk-GJMHNEQ3.js';
 export { I18nProvider, useTranslation } from './chunk-GJMHNEQ3.js';
 export { defaultDictionary, resolveI18n } from './chunk-4UFAZLSZ.js';
 export { Card } from './chunk-PQW5LKAI.js';
+export { Carousel } from './chunk-VFUV6XJR.js';
 import { SemanticIconsProvider } from './chunk-H2LHWJ52.js';
 export { Checkbox, SemanticIconsProvider, useSemanticIcon } from './chunk-H2LHWJ52.js';
-export { Collapsible } from './chunk-M4BI63P6.js';
 export { Accordion } from './chunk-V5QSMDZL.js';
 import './chunk-RB3YBWQ4.js';
 import './chunk-RGJ3NBKE.js';

package/dist/client.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/provider/nori-provider.tsx"],"names":["theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDO,SAAS,YAAA,CAAa,EAAE,KAAA,EAAAA,MAAAA,EAAO,aAAa,IAAA,EAAM,KAAA,EAAO,MAAA,EAAQ,QAAA,EAAS,EAAsB;AAGnG,EAAA,MAAM,aAAaA,MAAAA,KAAU,MAAA,GAAY,EAAC,GAAI,EAAE,OAAAA,MAAAA,EAAM;AACtD,EAAA,MAAM,YAAY,IAAA,KAAS,MAAA,GAAY,EAAC,GAAI,EAAE,IAAA,EAAK;AACnD,EAAA,MAAM,aAAa,KAAA,KAAU,MAAA,GAAY,EAAC,GAAI,EAAE,KAAA,EAAM;AACtD,EAAA,MAAM,cAAc,MAAA,KAAW,MAAA,GAAY,EAAC,GAAI,EAAE,MAAA,EAAO;AAEzD,EAAA,MAAM,KAAA,uBACD,cAAA,EAAA,EAAgB,GAAG,aAChB,QAAA,kBAAA,GAAA,CAAC,aAAA,EAAA,EAAe,GAAG,UAAA,EACf,QAAA,kBAAA,GAAA,CAAC,gBAAc,GAAG,SAAA,EACd,8BAAC,qBAAA,EAAA,EAAuB,GAAG,YAAa,QAAA,EAAS,CAAA,EACrD,GACJ,CAAA,EACJ,CAAA;AAGJ,EAAA,OAAO,gBAAgB,MAAA,GAAY,KAAA,uBAAS,mBAAA,EAAA,EAAoB,KAAA,EAAO,aAAc,QAAA,EAAA,KAAA,EAAM,CAAA;AAC/F;AAnBgB,MAAA,CAAA,YAAA,EAAA,cAAA,CAAA","file":"client.js","sourcesContent":["'use client';\n\nimport type { Theme } from '@nori-ui/tokens';\nimport type { ReactNode } from 'react';\nimport { I18nProvider } from '../i18n/context';\nimport { type LocaleInput, LocaleProvider } from '../i18n/locale';\nimport type { I18nInput } from '../i18n/types';\nimport type { SemanticIcons } from '../icons/default-semantic-icons';\nimport { SemanticIconsProvider } from '../icons/semantic-context';\nimport { type NoriTheme, ThemeProvider } from '../theme/context';\nimport { type ColorScheme, ColorSchemeProvider } from '../theme/use-color-scheme';\n\nexport type NoriProviderProps = {\n    /**\n     * Theme to apply to descendants. Pass:\n     *   - a `NoriTheme` (`{ light, dark }`) — covers both schemes\n     *   - a single `Theme` — used for both schemes (rare)\n     *   - one of the bundled presets: `tealTheme`, `blueTheme`, `roseTheme`,\n     *     `violetTheme`, `orangeTheme`, `slateTheme` (from `@nori-ui/core`)\n     *   - omit — falls back to the default Nori palette (teal)\n     */\n    theme?: NoriTheme | Theme;\n    /**\n     * Force a color scheme for descendants, overriding the OS signal. Use\n     * when an app shell is hard-coded to one scheme (e.g. forced-dark\n     * editorial chrome) and wants library components inside it to render\n     * against the matching half of the theme.\n     *\n     * Omit to track the OS Appearance (native) / `<html>` `dark` class (web).\n     */\n    colorScheme?: ColorScheme;\n    i18n?: I18nInput;\n    icons?: Partial<SemanticIcons>;\n    /**\n     * BCP 47 locale tag (or `Intl.Locale`) used by locale-aware components\n     * (Calendar, Number/Currency formatting, RelativeTime). Defaults to\n     * the runtime's resolved locale (`new Intl.DateTimeFormat().resolvedOptions().locale`),\n     * which mirrors what other `Intl` calls in the consumer's code use.\n     */\n    locale?: LocaleInput;\n    children?: ReactNode;\n};\n\n/**\n * Single root provider composing theme, i18n, and semantic-icons contexts.\n * Place near the root of your app. Only needed to override defaults — the\n * library works out of the box without any provider.\n */\nexport function NoriProvider({ theme, colorScheme, i18n, icons, locale, children }: NoriProviderProps) {\n    // Conditionally spread each optional prop — `exactOptionalPropertyTypes: true`\n    // rejects passing `undefined` to a prop typed as `T | missing`.\n    const themeProps = theme === undefined ? {} : { theme };\n    const i18nProps = i18n === undefined ? {} : { i18n };\n    const iconsProps = icons === undefined ? {} : { icons };\n    const localeProps = locale === undefined ? {} : { locale };\n\n    const inner = (\n        <LocaleProvider {...localeProps}>\n            <ThemeProvider {...themeProps}>\n                <I18nProvider {...i18nProps}>\n                    <SemanticIconsProvider {...iconsProps}>{children}</SemanticIconsProvider>\n                </I18nProvider>\n            </ThemeProvider>\n        </LocaleProvider>\n    );\n\n    return colorScheme === undefined ? inner : <ColorSchemeProvider value={colorScheme}>{inner}</ColorSchemeProvider>;\n}\n"]}
+{"version":3,"sources":["../src/provider/nori-provider.tsx"],"names":["theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDO,SAAS,YAAA,CAAa,EAAE,KAAA,EAAAA,MAAAA,EAAO,aAAa,IAAA,EAAM,KAAA,EAAO,MAAA,EAAQ,QAAA,EAAS,EAAsB;AAGnG,EAAA,MAAM,aAAaA,MAAAA,KAAU,MAAA,GAAY,EAAC,GAAI,EAAE,OAAAA,MAAAA,EAAM;AACtD,EAAA,MAAM,YAAY,IAAA,KAAS,MAAA,GAAY,EAAC,GAAI,EAAE,IAAA,EAAK;AACnD,EAAA,MAAM,aAAa,KAAA,KAAU,MAAA,GAAY,EAAC,GAAI,EAAE,KAAA,EAAM;AACtD,EAAA,MAAM,cAAc,MAAA,KAAW,MAAA,GAAY,EAAC,GAAI,EAAE,MAAA,EAAO;AAEzD,EAAA,MAAM,KAAA,uBACD,cAAA,EAAA,EAAgB,GAAG,aAChB,QAAA,kBAAA,GAAA,CAAC,aAAA,EAAA,EAAe,GAAG,UAAA,EACf,QAAA,kBAAA,GAAA,CAAC,gBAAc,GAAG,SAAA,EACd,8BAAC,qBAAA,EAAA,EAAuB,GAAG,YAAa,QAAA,EAAS,CAAA,EACrD,GACJ,CAAA,EACJ,CAAA;AAGJ,EAAA,OAAO,gBAAgB,MAAA,GAAY,KAAA,uBAAS,mBAAA,EAAA,EAAoB,KAAA,EAAO,aAAc,QAAA,EAAA,KAAA,EAAM,CAAA;AAC/F;AAnBgB,MAAA,CAAA,YAAA,EAAA,cAAA,CAAA","file":"client.js","sourcesContent":["'use client';\n\nimport type { Theme } from '@nori-ui/tokens';\nimport type { ReactNode } from 'react';\nimport { I18nProvider } from '../i18n/context';\nimport { type LocaleInput, LocaleProvider } from '../i18n/locale';\nimport type { I18nInput } from '../i18n/types';\nimport type { SemanticIcons } from '../icons/default-semantic-icons';\nimport { SemanticIconsProvider } from '../icons/semantic-context';\nimport { type NoriTheme, ThemeProvider } from '../theme/context';\nimport { type ColorScheme, ColorSchemeProvider } from '../theme/use-color-scheme';\n\nexport type NoriProviderProps = {\n    /**\n     * Theme to apply to descendants. Pass:\n     *   - a `NoriTheme` (`{ light, dark }`) — covers both schemes\n     *   - a single `Theme` — used for both schemes (rare)\n     *   - one of the bundled presets: `tealTheme`, `blueTheme`, `roseTheme`,\n     *     `violetTheme`, `orangeTheme`, `slateTheme` (from `@nori-ui/core`)\n     *   - omit — falls back to the default Nori palette (teal)\n     */\n    theme?: NoriTheme | Theme;\n    /**\n     * Force a color scheme for descendants, overriding the OS signal. Use\n     * when an app shell is hard-coded to one scheme (e.g. forced-dark\n     * editorial chrome) and wants library components inside it to render\n     * against the matching half of the theme.\n     *\n     * Omit to track the OS Appearance (native) / `<html>` `dark` class (web).\n     */\n    colorScheme?: ColorScheme;\n    i18n?: I18nInput;\n    icons?: Partial<SemanticIcons>;\n    /**\n     * BCP 47 locale tag (or `Intl.Locale`) used by locale-aware components\n     * (Calendar, Number/Currency formatting, RelativeTime). Defaults to\n     * the runtime's resolved locale (`new Intl.DateTimeFormat().resolvedOptions().locale`),\n     * which mirrors what other `Intl` calls in the consumer's code use.\n     */\n    locale?: LocaleInput;\n    children?: ReactNode;\n};\n\n/**\n * Single root provider composing theme, i18n, and semantic-icons contexts.\n * Place near the root of your app. Only needed to override defaults — the\n * library works out of the box without any provider.\n */\nexport function NoriProvider({ theme, colorScheme, i18n, icons, locale, children }: NoriProviderProps) {\n    // Conditionally spread each optional prop — `exactOptionalPropertyTypes: true`\n    // rejects passing `undefined` to a prop typed as `T | missing`.\n    const themeProps = theme === undefined ? {} : { theme };\n    const i18nProps = i18n === undefined ? {} : { i18n };\n    const iconsProps = icons === undefined ? {} : { icons };\n    const localeProps = locale === undefined ? {} : { locale };\n\n    const inner = (\n        <LocaleProvider {...localeProps}>\n            <ThemeProvider {...themeProps}>\n                <I18nProvider {...i18nProps}>\n                    <SemanticIconsProvider {...iconsProps}>{children}</SemanticIconsProvider>\n                </I18nProvider>\n            </ThemeProvider>\n        </LocaleProvider>\n    );\n\n    return colorScheme === undefined ? inner : <ColorSchemeProvider value={colorScheme}>{inner}</ColorSchemeProvider>;\n}\n"]}

package/dist/components/Carousel/index.cjs

@@ -0,0 +1,297 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('nativewind/jsx-runtime');
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  const out = [];
+  for (const input of inputs) {
+    append(out, input);
+  }
+  return out.join(" ");
+}
+__name(cn, "cn");
+function append(out, input) {
+  if (!input) {
+    return;
+  }
+  if (typeof input === "string") {
+    if (input.length > 0) {
+      out.push(input);
+    }
+    return;
+  }
+  if (typeof input === "number") {
+    return;
+  }
+  if (Array.isArray(input)) {
+    for (const inner of input) {
+      append(out, inner);
+    }
+    return;
+  }
+  if (typeof input === "object") {
+    for (const key of Object.keys(input)) {
+      if (input[key]) {
+        out.push(key);
+      }
+    }
+  }
+}
+__name(append, "append");
+var CarouselContext = react.createContext(null);
+function useCarouselContext(caller) {
+  const ctx = react.useContext(CarouselContext);
+  if (!ctx) {
+    throw new Error(`<${caller}> must be rendered inside <Carousel>.`);
+  }
+  return ctx;
+}
+__name(useCarouselContext, "useCarouselContext");
+var CarouselRoot = /* @__PURE__ */ __name(({
+  index: controlledIndex,
+  defaultIndex = 0,
+  onIndexChange,
+  loop = false,
+  orientation = "horizontal",
+  children,
+  className,
+  testID
+}) => {
+  const [inner, setInner] = react.useState(defaultIndex);
+  const isControlled = controlledIndex !== void 0;
+  const index = isControlled ? controlledIndex : inner;
+  const [count, setCount] = react.useState(0);
+  const listRef = react.useRef(null);
+  const id = react.useId();
+  const setIndex = react.useCallback(
+    (next2) => {
+      if (!isControlled) {
+        setInner(next2);
+      }
+      onIndexChange?.(next2);
+    },
+    [isControlled, onIndexChange]
+  );
+  const scrollTo = react.useCallback(
+    (idx) => {
+      const list = listRef.current;
+      if (!list) {
+        return;
+      }
+      const item = list.children[idx];
+      if (!item) {
+        return;
+      }
+      item.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+      setIndex(idx);
+    },
+    [setIndex]
+  );
+  const next = react.useCallback(() => {
+    if (count === 0) {
+      return;
+    }
+    if (index < count - 1) {
+      scrollTo(index + 1);
+    } else if (loop) {
+      scrollTo(0);
+    }
+  }, [index, count, loop, scrollTo]);
+  const prev = react.useCallback(() => {
+    if (count === 0) {
+      return;
+    }
+    if (index > 0) {
+      scrollTo(index - 1);
+    } else if (loop) {
+      scrollTo(count - 1);
+    }
+  }, [index, count, loop, scrollTo]);
+  react.useEffect(() => {
+    const list = listRef.current;
+    if (!list) {
+      return;
+    }
+    const handleScroll = /* @__PURE__ */ __name(() => {
+      const { scrollLeft, scrollTop, offsetWidth, offsetHeight } = list;
+      const pos = orientation === "horizontal" ? scrollLeft : scrollTop;
+      const size = orientation === "horizontal" ? offsetWidth : offsetHeight;
+      if (size === 0) {
+        return;
+      }
+      const newIdx = Math.round(pos / size);
+      if (newIdx !== index) {
+        setIndex(newIdx);
+      }
+    }, "handleScroll");
+    list.addEventListener("scroll", handleScroll, { passive: true });
+    return () => list.removeEventListener("scroll", handleScroll);
+  }, [orientation, index, setIndex]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    CarouselContext.Provider,
+    {
+      value: { index, count, loop, orientation, scrollTo, next, prev, listRef, setCount, id },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "section",
+        {
+          "aria-label": testID ?? "Carousel",
+          className: cn("relative overflow-hidden", className),
+          "data-testid": testID,
+          children
+        }
+      )
+    }
+  );
+}, "CarouselRoot");
+var CarouselContent = /* @__PURE__ */ __name(({ children, className, testID }) => {
+  const ctx = useCarouselContext("Carousel.Content");
+  const childCount = react.Children.count(children);
+  react.useEffect(() => {
+    ctx.setCount(childCount);
+  }, [childCount, ctx.setCount]);
+  const isHorizontal = ctx.orientation === "horizontal";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: ctx.listRef,
+      "data-testid": testID,
+      className: cn(
+        "flex",
+        isHorizontal ? "flex-row overflow-x-auto overflow-y-hidden" : "flex-col overflow-y-auto overflow-x-hidden",
+        className
+      ),
+      style: {
+        scrollSnapType: isHorizontal ? "x mandatory" : "y mandatory",
+        scrollBehavior: "smooth",
+        WebkitOverflowScrolling: "touch",
+        // Hide scrollbar
+        scrollbarWidth: "none",
+        msOverflowStyle: "none"
+      },
+      children
+    }
+  );
+}, "CarouselContent");
+var CarouselItem = /* @__PURE__ */ __name(({ children, className, testID }) => {
+  const ctx = useCarouselContext("Carousel.Item");
+  const isHorizontal = ctx.orientation === "horizontal";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-testid": testID,
+      className: cn("shrink-0", isHorizontal ? "w-full" : "h-full", className),
+      style: {
+        scrollSnapAlign: "start",
+        minWidth: isHorizontal ? "100%" : void 0,
+        minHeight: !isHorizontal ? "100%" : void 0
+      },
+      children
+    }
+  );
+}, "CarouselItem");
+var CarouselPrevious = /* @__PURE__ */ __name(({ className, testID, children }) => {
+  const ctx = useCarouselContext("Carousel.Previous");
+  const disabled = !ctx.loop && ctx.index === 0;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Previous slide",
+      disabled,
+      "data-testid": testID,
+      onClick: ctx.prev,
+      className: cn(
+        "absolute left-2 top-1/2 z-10 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full bg-white/80 shadow hover:bg-white disabled:opacity-40",
+        className
+      ),
+      children: children ?? /* @__PURE__ */ jsxRuntime.jsx(
+        "svg",
+        {
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: 2,
+          className: "h-4 w-4",
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 18l-6-6 6-6", strokeLinecap: "round", strokeLinejoin: "round" })
+        }
+      )
+    }
+  );
+}, "CarouselPrevious");
+var CarouselNext = /* @__PURE__ */ __name(({ className, testID, children }) => {
+  const ctx = useCarouselContext("Carousel.Next");
+  const disabled = !ctx.loop && ctx.index >= ctx.count - 1;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Next slide",
+      disabled,
+      "data-testid": testID,
+      onClick: ctx.next,
+      className: cn(
+        "absolute right-2 top-1/2 z-10 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full bg-white/80 shadow hover:bg-white disabled:opacity-40",
+        className
+      ),
+      children: children ?? /* @__PURE__ */ jsxRuntime.jsx(
+        "svg",
+        {
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: 2,
+          className: "h-4 w-4",
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18l6-6-6-6", strokeLinecap: "round", strokeLinejoin: "round" })
+        }
+      )
+    }
+  );
+}, "CarouselNext");
+var CarouselDots = /* @__PURE__ */ __name(({ className, testID }) => {
+  const ctx = useCarouselContext("Carousel.Dots");
+  if (ctx.count === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": "Slide navigation",
+      "data-testid": testID,
+      className: cn("absolute bottom-3 left-0 right-0 flex items-center justify-center gap-1.5", className),
+      children: Array.from({ length: ctx.count }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": i === ctx.index,
+          "aria-label": `Go to slide ${i + 1}`,
+          onClick: () => ctx.scrollTo(i),
+          className: cn(
+            "h-1.5 w-1.5 rounded-full transition-all",
+            i === ctx.index ? "w-3 bg-white" : "bg-white/50 hover:bg-white/75"
+          )
+        },
+        i
+      ))
+    }
+  );
+}, "CarouselDots");
+var Carousel = Object.assign(CarouselRoot, {
+  Content: CarouselContent,
+  Item: CarouselItem,
+  Previous: CarouselPrevious,
+  Next: CarouselNext,
+  Dots: CarouselDots
+});
+
+exports.Carousel = Carousel;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/components/Carousel/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/components/Carousel/Carousel.web.tsx"],"names":["createContext","useContext","useState","useRef","useId","useCallback","next","useEffect","jsx","Children"],"mappings":"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","file":"index.cjs","sourcesContent":["// cn — class-name merger. clsx-compatible shape.\n//\n// Intentionally does NOT deduplicate Tailwind conflicts (e.g. \"text-sm text-lg\").\n// That's `tailwind-merge`'s job; we defer adding it until a component actually\n// needs it, to keep the core tree-shakable and the runtime zero-dep.\n\nexport type ClassInput =\n    | string\n    | number\n    | boolean\n    | null\n    | undefined\n    | ClassInput[]\n    | Record<string, boolean | number | null | undefined>;\n\nexport function cn(...inputs: ClassInput[]): string {\n    const out: string[] = [];\n    for (const input of inputs) {\n        append(out, input);\n    }\n    return out.join(' ');\n}\n\nfunction append(out: string[], input: ClassInput): void {\n    if (!input) {\n        return;\n    }\n    if (typeof input === 'string') {\n        if (input.length > 0) {\n            out.push(input);\n        }\n        return;\n    }\n    if (typeof input === 'number') {\n        return; // numbers are never class names\n    }\n    if (Array.isArray(input)) {\n        for (const inner of input) {\n            append(out, inner);\n        }\n        return;\n    }\n    if (typeof input === 'object') {\n        for (const key of Object.keys(input)) {\n            if (input[key]) {\n                out.push(key);\n            }\n        }\n    }\n}\n","'use client';\n\nimport {\n    Children,\n    createContext,\n    type ReactNode,\n    useCallback,\n    useContext,\n    useEffect,\n    useId,\n    useRef,\n    useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\ntype CarouselContextValue = {\n    index: number;\n    count: number;\n    loop: boolean;\n    orientation: 'horizontal' | 'vertical';\n    scrollTo: (idx: number) => void;\n    next: () => void;\n    prev: () => void;\n    listRef: React.RefObject<HTMLDivElement | null>;\n    setCount: (n: number) => void;\n    id: string;\n};\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nfunction useCarouselContext(caller: string): CarouselContextValue {\n    const ctx = useContext(CarouselContext);\n    if (!ctx) {\n        throw new Error(`<${caller}> must be rendered inside <Carousel>.`);\n    }\n    return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Root\n// ---------------------------------------------------------------------------\n\nexport type CarouselProps = {\n    /** Controlled current index. */\n    index?: number;\n    /** Initial index (uncontrolled). @defaultValue 0 */\n    defaultIndex?: number;\n    /** Fires with the new index. */\n    onIndexChange?: (index: number) => void;\n    /** Whether navigation wraps from last to first and vice-versa. @defaultValue false */\n    loop?: boolean;\n    /** Scroll axis. @defaultValue 'horizontal' */\n    orientation?: 'horizontal' | 'vertical';\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\nconst CarouselRoot = ({\n    index: controlledIndex,\n    defaultIndex = 0,\n    onIndexChange,\n    loop = false,\n    orientation = 'horizontal',\n    children,\n    className,\n    testID,\n}: CarouselProps) => {\n    const [inner, setInner] = useState(defaultIndex);\n    const isControlled = controlledIndex !== undefined;\n    const index = isControlled ? (controlledIndex as number) : inner;\n    const [count, setCount] = useState(0);\n    const listRef = useRef<HTMLDivElement | null>(null);\n    const id = useId();\n\n    const setIndex = useCallback(\n        (next: number) => {\n            if (!isControlled) {\n                setInner(next);\n            }\n            onIndexChange?.(next);\n        },\n        [isControlled, onIndexChange]\n    );\n\n    const scrollTo = useCallback(\n        (idx: number) => {\n            const list = listRef.current;\n            if (!list) {\n                return;\n            }\n            const item = list.children[idx] as HTMLElement | undefined;\n            if (!item) {\n                return;\n            }\n            item.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });\n            setIndex(idx);\n        },\n        [setIndex]\n    );\n\n    const next = useCallback(() => {\n        if (count === 0) {\n            return;\n        }\n        if (index < count - 1) {\n            scrollTo(index + 1);\n        } else if (loop) {\n            scrollTo(0);\n        }\n    }, [index, count, loop, scrollTo]);\n\n    const prev = useCallback(() => {\n        if (count === 0) {\n            return;\n        }\n        if (index > 0) {\n            scrollTo(index - 1);\n        } else if (loop) {\n            scrollTo(count - 1);\n        }\n    }, [index, count, loop, scrollTo]);\n\n    // Keep index in sync if external scroll happens\n    useEffect(() => {\n        const list = listRef.current;\n        if (!list) {\n            return;\n        }\n        const handleScroll = () => {\n            const { scrollLeft, scrollTop, offsetWidth, offsetHeight } = list;\n            const pos = orientation === 'horizontal' ? scrollLeft : scrollTop;\n            const size = orientation === 'horizontal' ? offsetWidth : offsetHeight;\n            if (size === 0) {\n                return;\n            }\n            const newIdx = Math.round(pos / size);\n            if (newIdx !== index) {\n                setIndex(newIdx);\n            }\n        };\n        list.addEventListener('scroll', handleScroll, { passive: true });\n        return () => list.removeEventListener('scroll', handleScroll);\n    }, [orientation, index, setIndex]);\n\n    return (\n        <CarouselContext.Provider\n            value={{ index, count, loop, orientation, scrollTo, next, prev, listRef, setCount, id }}\n        >\n            <section\n                aria-label={testID ?? 'Carousel'}\n                className={cn('relative overflow-hidden', className)}\n                data-testid={testID}\n            >\n                {children}\n            </section>\n        </CarouselContext.Provider>\n    );\n};\n\n// ---------------------------------------------------------------------------\n// Content — the scroll container\n// ---------------------------------------------------------------------------\n\nexport type CarouselContentProps = {\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\nconst CarouselContent = ({ children, className, testID }: CarouselContentProps) => {\n    const ctx = useCarouselContext('Carousel.Content');\n\n    // Count items\n    const childCount = Children.count(children);\n    useEffect(() => {\n        ctx.setCount(childCount);\n    }, [childCount, ctx.setCount]);\n\n    const isHorizontal = ctx.orientation === 'horizontal';\n\n    return (\n        <div\n            ref={ctx.listRef}\n            data-testid={testID}\n            className={cn(\n                'flex',\n                isHorizontal\n                    ? 'flex-row overflow-x-auto overflow-y-hidden'\n                    : 'flex-col overflow-y-auto overflow-x-hidden',\n                className\n            )}\n            style={{\n                scrollSnapType: isHorizontal ? 'x mandatory' : 'y mandatory',\n                scrollBehavior: 'smooth',\n                WebkitOverflowScrolling: 'touch',\n                // Hide scrollbar\n                scrollbarWidth: 'none',\n                msOverflowStyle: 'none',\n            }}\n        >\n            {children}\n        </div>\n    );\n};\n\n// ---------------------------------------------------------------------------\n// Item\n// ---------------------------------------------------------------------------\n\nexport type CarouselItemProps = {\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\nconst CarouselItem = ({ children, className, testID }: CarouselItemProps) => {\n    const ctx = useCarouselContext('Carousel.Item');\n    const isHorizontal = ctx.orientation === 'horizontal';\n    return (\n        <div\n            data-testid={testID}\n            className={cn('shrink-0', isHorizontal ? 'w-full' : 'h-full', className)}\n            style={{\n                scrollSnapAlign: 'start',\n                minWidth: isHorizontal ? '100%' : undefined,\n                minHeight: !isHorizontal ? '100%' : undefined,\n            }}\n        >\n            {children}\n        </div>\n    );\n};\n\n// ---------------------------------------------------------------------------\n// Previous / Next buttons\n// ---------------------------------------------------------------------------\n\nexport type CarouselButtonProps = {\n    className?: string;\n    testID?: string;\n    children?: ReactNode;\n};\n\nconst CarouselPrevious = ({ className, testID, children }: CarouselButtonProps) => {\n    const ctx = useCarouselContext('Carousel.Previous');\n    const disabled = !ctx.loop && ctx.index === 0;\n    return (\n        <button\n            type=\"button\"\n            aria-label=\"Previous slide\"\n            disabled={disabled}\n            data-testid={testID}\n            onClick={ctx.prev}\n            className={cn(\n                'absolute left-2 top-1/2 z-10 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full bg-white/80 shadow hover:bg-white disabled:opacity-40',\n                className\n            )}\n        >\n            {children ?? (\n                <svg\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth={2}\n                    className=\"h-4 w-4\"\n                    aria-hidden=\"true\"\n                >\n                    <path d=\"M15 18l-6-6 6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n                </svg>\n            )}\n        </button>\n    );\n};\n\nconst CarouselNext = ({ className, testID, children }: CarouselButtonProps) => {\n    const ctx = useCarouselContext('Carousel.Next');\n    const disabled = !ctx.loop && ctx.index >= ctx.count - 1;\n    return (\n        <button\n            type=\"button\"\n            aria-label=\"Next slide\"\n            disabled={disabled}\n            data-testid={testID}\n            onClick={ctx.next}\n            className={cn(\n                'absolute right-2 top-1/2 z-10 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full bg-white/80 shadow hover:bg-white disabled:opacity-40',\n                className\n            )}\n        >\n            {children ?? (\n                <svg\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth={2}\n                    className=\"h-4 w-4\"\n                    aria-hidden=\"true\"\n                >\n                    <path d=\"M9 18l6-6-6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n                </svg>\n            )}\n        </button>\n    );\n};\n\n// ---------------------------------------------------------------------------\n// Dots\n// ---------------------------------------------------------------------------\n\nexport type CarouselDotsProps = {\n    className?: string;\n    testID?: string;\n};\n\nconst CarouselDots = ({ className, testID }: CarouselDotsProps) => {\n    const ctx = useCarouselContext('Carousel.Dots');\n    if (ctx.count === 0) {\n        return null;\n    }\n    return (\n        <div\n            role=\"tablist\"\n            aria-label=\"Slide navigation\"\n            data-testid={testID}\n            className={cn('absolute bottom-3 left-0 right-0 flex items-center justify-center gap-1.5', className)}\n        >\n            {Array.from({ length: ctx.count }, (_, i) => (\n                <button\n                    // biome-ignore lint/suspicious/noArrayIndexKey: dot index IS its stable identity\n                    key={i}\n                    type=\"button\"\n                    role=\"tab\"\n                    aria-selected={i === ctx.index}\n                    aria-label={`Go to slide ${i + 1}`}\n                    onClick={() => ctx.scrollTo(i)}\n                    className={cn(\n                        'h-1.5 w-1.5 rounded-full transition-all',\n                        i === ctx.index ? 'w-3 bg-white' : 'bg-white/50 hover:bg-white/75'\n                    )}\n                />\n            ))}\n        </div>\n    );\n};\n\n// ---------------------------------------------------------------------------\n// Public compound export\n// ---------------------------------------------------------------------------\n\n/**\n * Paged horizontal (or vertical) slider with CSS scroll-snap.\n *\n * Composition:\n * - `Carousel.Content` — the scroll container\n * - `Carousel.Item` — each slide\n * - `Carousel.Previous` / `Carousel.Next` — navigation buttons\n * - `Carousel.Dots` — dot pagination indicators\n *\n * ```tsx\n * <Carousel>\n *   <Carousel.Content>\n *     <Carousel.Item><img src=\"a.jpg\" /></Carousel.Item>\n *     <Carousel.Item><img src=\"b.jpg\" /></Carousel.Item>\n *   </Carousel.Content>\n *   <Carousel.Previous />\n *   <Carousel.Next />\n *   <Carousel.Dots />\n * </Carousel>\n * ```\n */\nexport const Carousel = Object.assign(CarouselRoot, {\n    Content: CarouselContent,\n    Item: CarouselItem,\n    Previous: CarouselPrevious,\n    Next: CarouselNext,\n    Dots: CarouselDots,\n});\n"]}

package/dist/components/Carousel/index.d.cts

@@ -0,0 +1,67 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type CarouselProps = {
+    /** Controlled current index. */
+    index?: number;
+    /** Initial index (uncontrolled). @defaultValue 0 */
+    defaultIndex?: number;
+    /** Fires with the new index. */
+    onIndexChange?: (index: number) => void;
+    /** Whether navigation wraps from last to first and vice-versa. @defaultValue false */
+    loop?: boolean;
+    /** Scroll axis. @defaultValue 'horizontal' */
+    orientation?: 'horizontal' | 'vertical';
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselContentProps = {
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselItemProps = {
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselButtonProps = {
+    className?: string;
+    testID?: string;
+    children?: ReactNode;
+};
+type CarouselDotsProps = {
+    className?: string;
+    testID?: string;
+};
+/**
+ * Paged horizontal (or vertical) slider with CSS scroll-snap.
+ *
+ * Composition:
+ * - `Carousel.Content` — the scroll container
+ * - `Carousel.Item` — each slide
+ * - `Carousel.Previous` / `Carousel.Next` — navigation buttons
+ * - `Carousel.Dots` — dot pagination indicators
+ *
+ * ```tsx
+ * <Carousel>
+ *   <Carousel.Content>
+ *     <Carousel.Item><img src="a.jpg" /></Carousel.Item>
+ *     <Carousel.Item><img src="b.jpg" /></Carousel.Item>
+ *   </Carousel.Content>
+ *   <Carousel.Previous />
+ *   <Carousel.Next />
+ *   <Carousel.Dots />
+ * </Carousel>
+ * ```
+ */
+declare const Carousel: (({ index: controlledIndex, defaultIndex, onIndexChange, loop, orientation, children, className, testID, }: CarouselProps) => react_jsx_runtime.JSX.Element) & {
+    Content: ({ children, className, testID }: CarouselContentProps) => react_jsx_runtime.JSX.Element;
+    Item: ({ children, className, testID }: CarouselItemProps) => react_jsx_runtime.JSX.Element;
+    Previous: ({ className, testID, children }: CarouselButtonProps) => react_jsx_runtime.JSX.Element;
+    Next: ({ className, testID, children }: CarouselButtonProps) => react_jsx_runtime.JSX.Element;
+    Dots: ({ className, testID }: CarouselDotsProps) => react_jsx_runtime.JSX.Element | null;
+};
+
+export { Carousel, type CarouselButtonProps, type CarouselContentProps, type CarouselDotsProps, type CarouselItemProps, type CarouselProps };

package/dist/components/Carousel/index.d.ts

@@ -0,0 +1,67 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type CarouselProps = {
+    /** Controlled current index. */
+    index?: number;
+    /** Initial index (uncontrolled). @defaultValue 0 */
+    defaultIndex?: number;
+    /** Fires with the new index. */
+    onIndexChange?: (index: number) => void;
+    /** Whether navigation wraps from last to first and vice-versa. @defaultValue false */
+    loop?: boolean;
+    /** Scroll axis. @defaultValue 'horizontal' */
+    orientation?: 'horizontal' | 'vertical';
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselContentProps = {
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselItemProps = {
+    children?: ReactNode;
+    className?: string;
+    testID?: string;
+};
+type CarouselButtonProps = {
+    className?: string;
+    testID?: string;
+    children?: ReactNode;
+};
+type CarouselDotsProps = {
+    className?: string;
+    testID?: string;
+};
+/**
+ * Paged horizontal (or vertical) slider with CSS scroll-snap.
+ *
+ * Composition:
+ * - `Carousel.Content` — the scroll container
+ * - `Carousel.Item` — each slide
+ * - `Carousel.Previous` / `Carousel.Next` — navigation buttons
+ * - `Carousel.Dots` — dot pagination indicators
+ *
+ * ```tsx
+ * <Carousel>
+ *   <Carousel.Content>
+ *     <Carousel.Item><img src="a.jpg" /></Carousel.Item>
+ *     <Carousel.Item><img src="b.jpg" /></Carousel.Item>
+ *   </Carousel.Content>
+ *   <Carousel.Previous />
+ *   <Carousel.Next />
+ *   <Carousel.Dots />
+ * </Carousel>
+ * ```
+ */
+declare const Carousel: (({ index: controlledIndex, defaultIndex, onIndexChange, loop, orientation, children, className, testID, }: CarouselProps) => react_jsx_runtime.JSX.Element) & {
+    Content: ({ children, className, testID }: CarouselContentProps) => react_jsx_runtime.JSX.Element;
+    Item: ({ children, className, testID }: CarouselItemProps) => react_jsx_runtime.JSX.Element;
+    Previous: ({ className, testID, children }: CarouselButtonProps) => react_jsx_runtime.JSX.Element;
+    Next: ({ className, testID, children }: CarouselButtonProps) => react_jsx_runtime.JSX.Element;
+    Dots: ({ className, testID }: CarouselDotsProps) => react_jsx_runtime.JSX.Element | null;
+};
+
+export { Carousel, type CarouselButtonProps, type CarouselContentProps, type CarouselDotsProps, type CarouselItemProps, type CarouselProps };

package/dist/components/Carousel/index.js

@@ -0,0 +1,5 @@
+export { Carousel } from '../../chunk-VFUV6XJR.js';
+import '../../chunk-CHXHRJNZ.js';
+import '../../chunk-WCQVDF3K.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/Carousel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}