@forthtilliath/forth-ui 0.3.0 → 0.4.1

package/README.md

@@ -17,6 +17,7 @@ so you don't have to wire the same recipe from scratch in every project.
 - [Why forth-ui](#why-forth-ui)
 - [Installation](#installation)
 - [Usage](#usage)
+- [Language](#language)
 - [Components](#components)
 - [Conventions](#conventions)
 - [Theming](#theming)
@@ -60,6 +61,12 @@ Import the compiled stylesheet once, alongside your component imports:
 import "@forthtilliath/forth-ui/styles/globals.css";
 ```
 
+It covers forth-ui's components and the shadcn-ui ones they're built on
+(Dialog, Popover…) — not every shadcn-ui component. If your app also uses
+others directly (Sidebar, Table…), or has its own Tailwind build anyway,
+use the [Theming](#theming) setup instead: your Tailwind then scans both
+packages.
+
 ### As a workspace package (this monorepo)
 
 Within this monorepo, `forth-ui` is consumed the same way, just via the
@@ -131,6 +138,28 @@ function Example() {
 }
 ```
 
+## Language
+
+Built-in labels (`aria-label`s, default placeholders, empty states, the
+Pagination and ConfirmDialog buttons…) are available in **French** (the
+default) and **English**. For a bilingual site, set the language once with
+`UiLocaleProvider`; a component's own `locale` prop wins over it, and its
+text props (`placeholder`, `emptyMessage`, `ariaLabel`, a ConfirmDialog's
+`cancelLabel`…) still override individual strings.
+
+```tsx
+import { UiLocaleProvider } from "@forthtilliath/forth-ui/locale";
+
+<UiLocaleProvider locale={lang /* "fr" | "en" */}>{children}</UiLocaleProvider>;
+
+// or per component:
+<Spinner locale="en" />;
+```
+
+`UI_MESSAGES` (same entry point) holds every label, grouped by component.
+Components rendered from shadcn-ui as-is (e.g. a Dialog's close button) keep
+shadcn's English text.
+
 ## Components
 
 Grouped the same way as the Storybook sidebar (`forth-ui/<Category>/...`).
@@ -164,10 +193,11 @@ Grouped the same way as the Storybook sidebar (`forth-ui/<Category>/...`).
 
 ### Buttons & Actions
 
-| Component               | Import              | Description                                                                    |
-| ----------------------- | ------------------- | ------------------------------------------------------------------------------ |
-| `Button`, `ButtonGroup` | `components/button` | A button, or a component that looks like one, plus joined button rows/columns. |
-| `Chip`                  | `components/chip`   | A compact, interactive element for status, categories, or filters.             |
+| Component                     | Import                   | Description                                                                     |
+| ----------------------------- | ------------------------ | ------------------------------------------------------------------------------- |
+| `Button`, `ButtonGroup`       | `components/button`      | A button, or a component that looks like one, plus joined button rows/columns.  |
+| `Chip`                        | `components/chip`        | A compact, interactive element for status, categories, or filters.              |
+| `ModeToggle`, `ThemeProvider` | `components/mode-toggle` | A light / dark / system theme switcher (needs the optional `next-themes` peer). |
 
 ### Forms
 
@@ -208,6 +238,7 @@ Grouped the same way as the Storybook sidebar (`forth-ui/<Category>/...`).
 | ---------------- | ---------------------------- | ----------------------------------------------------------------------------------- |
 | `CommandPalette` | `components/command-palette` | A global command menu (Cmd/Ctrl+K to open).                                         |
 | `useConfirm`     | `components/confirm-dialog`  | An imperative `await confirm({...})` alternative to hand-wiring an `AlertDialog`.   |
+| `CopyMenuItem`   | `components/copy-menu-item`  | A `DropdownMenuItem` that copies a value and briefly shows a checkmark.             |
 | `Dropdrawer`     | `components/dropdrawer`      | A menu that renders as a `DropdownMenu` on desktop and a bottom `Drawer` on mobile. |
 
 ### Data Display
@@ -224,6 +255,7 @@ Grouped the same way as the Storybook sidebar (`forth-ui/<Category>/...`).
 | `QrCode`                       | `components/qr-code`          | Generates a QR code from a string, rendered as inline SVG.               |
 | `RelativeTime`                 | `components/relative-time`    | Displays a live-updating time, defaulting to the local timezone.         |
 | `Sortable`                     | `components/sortable`         | A drag-to-reorder list built on native HTML5 drag events.                |
+| `ThemeImage`                   | `components/theme-image`      | An image with a light and a dark version (`as={Image}` for Next.js).     |
 | `Timeline`                     | `components/timeline`         | A vertical sequence of dated events, connected by a line.                |
 | `Tree`                         | `components/tree`             | A hierarchical, expandable/collapsible list of nodes.                    |
 
@@ -294,25 +326,46 @@ Tailwind v4 expects any npm-distributed component library to be consumed.
 
 ### Available themes
 
-11 [tweakcn](https://tweakcn.com)-generated themes ship under
+19 themes ship under
 `@forthtilliath/shadcn-ui/styles/themes/`, all rendered here with the same
-components:
-
-| `default`                                   | `blue`                                | `bubblegum`                                     |
-| ------------------------------------------- | ------------------------------------- | ----------------------------------------------- |
-| ![default theme](./docs/themes/default.png) | ![blue theme](./docs/themes/blue.png) | ![bubblegum theme](./docs/themes/bubblegum.png) |
-
-| `claymorphism`                                        | `green`                                 | `orange`                                  |
-| ----------------------------------------------------- | --------------------------------------- | ----------------------------------------- |
-| ![claymorphism theme](./docs/themes/claymorphism.png) | ![green theme](./docs/themes/green.png) | ![orange theme](./docs/themes/orange.png) |
-
-| `red`                               | `rose`                                | `twitter`                                   |
-| ----------------------------------- | ------------------------------------- | ------------------------------------------- |
-| ![red theme](./docs/themes/red.png) | ![rose theme](./docs/themes/rose.png) | ![twitter theme](./docs/themes/twitter.png) |
-
-| `violet`                                  | `yellow`                                  |
-| ----------------------------------------- | ----------------------------------------- |
-| ![violet theme](./docs/themes/violet.png) | ![yellow theme](./docs/themes/yellow.png) |
+components (light and dark mode).
+
+The first 11 are [tweakcn](https://tweakcn.com)-generated — most of them only
+change the colors:
+
+| Theme          | Style                                                          | Light                                                        | Dark                                                             |
+| -------------- | -------------------------------------------------------------- | ------------------------------------------------------------ | ---------------------------------------------------------------- |
+| `default`      | shadcn's neutral default: black on white, grey accents.        | ![default theme, light](./docs/themes/default.png)           | ![default theme, dark](./docs/themes/default-dark.png)           |
+| `blue`         | The default look with a blue primary.                          | ![blue theme, light](./docs/themes/blue.png)                 | ![blue theme, dark](./docs/themes/blue-dark.png)                 |
+| `bubblegum`    | Candy pink and pastels, Poppins, hard offset shadows.          | ![bubblegum theme, light](./docs/themes/bubblegum.png)       | ![bubblegum theme, dark](./docs/themes/bubblegum-dark.png)       |
+| `claymorphism` | Soft clay: warm greys and indigo, very round, pillowy shadows. | ![claymorphism theme, light](./docs/themes/claymorphism.png) | ![claymorphism theme, dark](./docs/themes/claymorphism-dark.png) |
+| `green`        | The default look with a green primary.                         | ![green theme, light](./docs/themes/green.png)               | ![green theme, dark](./docs/themes/green-dark.png)               |
+| `orange`       | The default look with an orange primary.                       | ![orange theme, light](./docs/themes/orange.png)             | ![orange theme, dark](./docs/themes/orange-dark.png)             |
+| `red`          | The default look with a red primary.                           | ![red theme, light](./docs/themes/red.png)                   | ![red theme, dark](./docs/themes/red-dark.png)                   |
+| `rose`         | The default look with a rose primary.                          | ![rose theme, light](./docs/themes/rose.png)                 | ![rose theme, dark](./docs/themes/rose-dark.png)                 |
+| `twitter`      | Twitter blue, Open Sans, very round corners.                   | ![twitter theme, light](./docs/themes/twitter.png)           | ![twitter theme, dark](./docs/themes/twitter-dark.png)           |
+| `violet`       | The default look with a violet primary.                        | ![violet theme, light](./docs/themes/violet.png)             | ![violet theme, dark](./docs/themes/violet-dark.png)             |
+| `yellow`       | The default look with a yellow primary.                        | ![yellow theme, light](./docs/themes/yellow.png)             | ![yellow theme, dark](./docs/themes/yellow-dark.png)             |
+
+The other 8 go further: besides fonts, radius and shadows, each
+adds **signature effects** — plain CSS rules on shadcn-ui's `data-slot`
+attributes (pixel frames, scanlines, frosted glass, hand-drawn outlines…),
+active only while the theme is imported. The components themselves are
+untouched, and focus stays visible (a theme restyling a button's shadow
+gets an outline instead). Their fonts fall back to system stacks; load the
+fonts named at the top of each file (Google Fonts, `next/font`…) for the
+full look.
+
+| Theme       | Style                                                                                                 | Light                                                  | Dark                                                       |
+| ----------- | ----------------------------------------------------------------------------------------------------- | ------------------------------------------------------ | ---------------------------------------------------------- |
+| `brutalist` | Neo-brutalism: thick black outlines, hard offset shadows, buttons that press in, dotted paper.        | ![brutalist theme, light](./docs/themes/brutalist.png) | ![brutalist theme, dark](./docs/themes/brutalist-dark.png) |
+| `pixel`     | 8-bit: notched pixel frames, pixel type, checkerboard — Game Boy greens (light), PICO-8 night (dark). | ![pixel theme, light](./docs/themes/pixel.png)         | ![pixel theme, dark](./docs/themes/pixel-dark.png)         |
+| `crt`       | CRT monitor: amber phosphor, scanlines and vignette, glowing text, blinking cursor.                   | ![crt theme, light](./docs/themes/crt.png)             | ![crt theme, dark](./docs/themes/crt-dark.png)             |
+| `synthwave` | Synthwave: sunset sky over a perspective grid, chrome titles, neon gradient buttons.                  | ![synthwave theme, light](./docs/themes/synthwave.png) | ![synthwave theme, dark](./docs/themes/synthwave-dark.png) |
+| `glass`     | Glassmorphism: frosted translucent surfaces floating over a colorful gradient mesh.                   | ![glass theme, light](./docs/themes/glass.png)         | ![glass theme, dark](./docs/themes/glass-dark.png)         |
+| `sketch`    | Hand-drawn: wobbly inked outlines and handwriting — lined notebook (light), chalkboard (dark).        | ![sketch theme, light](./docs/themes/sketch.png)       | ![sketch theme, dark](./docs/themes/sketch-dark.png)       |
+| `newspaper` | Newspaper: newsprint and ink, Didone headlines over double rules, halftone dots, small caps.          | ![newspaper theme, light](./docs/themes/newspaper.png) | ![newspaper theme, dark](./docs/themes/newspaper-dark.png) |
+| `memphis`   | Memphis pop: confetti pattern, asymmetric corners, squiggly underlined titles, colored hard shadows.  | ![memphis theme, light](./docs/themes/memphis.png)     | ![memphis theme, dark](./docs/themes/memphis-dark.png)     |
 
 ## Development
 

package/dist/components/accordion/accordion-items.d.ts

@@ -1,3 +1,3 @@
-import type { AccordionProps } from "./types";
+import type { AccordionProps } from "./types.js";
 export declare function Items({ hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, variant, size, generateId, }: Omit<AccordionProps, "multiple" | "className">): import("react").JSX.Element[];
 //# sourceMappingURL=accordion-items.d.ts.map

package/dist/components/accordion/accordion-items.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-items.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-items.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAO9C,wBAAgB,KAAK,CAAC,EACpB,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,OAAO,EACP,IAAI,EACJ,UAA+C,GAChD,EAAE,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,WAAW,CAAC,iCAuEhD"}
+{"version":3,"file":"accordion-items.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-items.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAOjD,wBAAgB,KAAK,CAAC,EACpB,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,OAAO,EACP,IAAI,EACJ,UAA+C,GAChD,EAAE,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,WAAW,CAAC,iCAuEhD"}

package/dist/components/accordion/accordion-items.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AccordionContent, AccordionItem, AccordionTrigger, } from "@forthtilliath/shadcn-ui/components/accordion";
+import { AccordionContent, AccordionItem, } from "@forthtilliath/shadcn-ui/components/accordion";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { accordionContentVariants, accordionItemVariants, accordionTriggerVariants, } from "./variants";
+import { AccordionTrigger } from "./accordion-trigger.js";
+import { accordionContentVariants, accordionItemVariants, accordionTriggerVariants, } from "./variants.js";
 export function Items({ hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, variant, size, generateId = (index) => `item-${String(index)}`, }) {
     return items.map(({ title, subtitle, content, disabled, ...props }, index) => {
         let iconItem = icon;

package/dist/components/accordion/accordion-multiple.d.ts

@@ -1,3 +1,3 @@
-import type { MultipleProps } from "./types";
+import type { MultipleProps } from "./types.js";
 export declare function AccordionMultiple({ className, variant, size, hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, generateId, ...props }: MultipleProps): import("react").JSX.Element;
 //# sourceMappingURL=accordion-multiple.d.ts.map

package/dist/components/accordion/accordion-multiple.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-multiple.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-multiple.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,GAAG,KAAK,EACT,EAAE,aAAa,+BAsBf"}
+{"version":3,"file":"accordion-multiple.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-multiple.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,GAAG,KAAK,EACT,EAAE,aAAa,+BAsBf"}

package/dist/components/accordion/accordion-multiple.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Accordion as AccordionPrimitive } from "@forthtilliath/shadcn-ui/components/accordion";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { Items } from "./accordion-items";
-import { accordionRootVariants } from "./variants";
+import { Items } from "./accordion-items.js";
+import { accordionRootVariants } from "./variants.js";
 export function AccordionMultiple({ className, variant, size, hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, generateId, ...props }) {
     return (_jsx(AccordionPrimitive, { type: "multiple", className: cn(accordionRootVariants({ variant, size }), className), ...props, children: _jsx(Items, { variant: variant, size: size, hideChevron: hideChevron, chevronAlignment: chevronAlignment, customChevron: customChevron, items: items, icon: icon, classNameItem: classNameItem, classNameTrigger: classNameTrigger, classNameContent: classNameContent, generateId: generateId }) }));
 }

package/dist/components/accordion/accordion-single.d.ts

@@ -1,3 +1,3 @@
-import type { SingleProps } from "./types";
+import type { SingleProps } from "./types.js";
 export declare function AccordionSingle({ className, variant, size, hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, generateId, ...props }: SingleProps): import("react").JSX.Element;
 //# sourceMappingURL=accordion-single.d.ts.map

package/dist/components/accordion/accordion-single.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-single.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-single.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAG3C,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,GAAG,KAAK,EACT,EAAE,WAAW,+BAsBb"}
+{"version":3,"file":"accordion-single.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-single.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAG9C,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,KAAK,EACL,IAAI,EACJ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,GAAG,KAAK,EACT,EAAE,WAAW,+BAsBb"}

package/dist/components/accordion/accordion-single.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Accordion as AccordionPrimitive } from "@forthtilliath/shadcn-ui/components/accordion";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { Items } from "./accordion-items";
-import { accordionRootVariants } from "./variants";
+import { Items } from "./accordion-items.js";
+import { accordionRootVariants } from "./variants.js";
 export function AccordionSingle({ className, variant, size, hideChevron, chevronAlignment, customChevron, items, icon, classNameItem, classNameTrigger, classNameContent, generateId, ...props }) {
     return (_jsx(AccordionPrimitive, { type: "single", className: cn(accordionRootVariants({ variant, size }), className), ...props, children: _jsx(Items, { variant: variant, size: size, hideChevron: hideChevron, chevronAlignment: chevronAlignment, customChevron: customChevron, items: items, icon: icon, classNameItem: classNameItem, classNameTrigger: classNameTrigger, classNameContent: classNameContent, generateId: generateId }) }));
 }

package/dist/components/accordion/accordion-trigger.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import type { LucideProps } from "lucide-react";
+export type AccordionTriggerProps = React.ComponentProps<typeof AccordionPrimitive.Trigger> & {
+    hideChevron?: boolean;
+    customChevron?: React.ReactElement<LucideProps>;
+};
+/**
+ * shadcn-ui's `AccordionTrigger` markup, plus `hideChevron` / `customChevron`
+ * — built here on the Radix primitive rather than relying on a customized
+ * shadcn copy, so forth-ui also works with the upstream shadcn `accordion`
+ * (e.g. installed through the registry).
+ */
+export declare function AccordionTrigger({ className, hideChevron, customChevron, children, ...props }: AccordionTriggerProps): React.JSX.Element;
+//# sourceMappingURL=accordion-trigger.d.ts.map

package/dist/components/accordion/accordion-trigger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion-trigger.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion-trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAChE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAKhD,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CACtD,OAAO,kBAAkB,CAAC,OAAO,CAClC,GAAG;IACF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;CACjD,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,WAAmB,EACnB,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,qBAkCvB"}

package/dist/components/accordion/accordion-trigger.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import { ChevronDownIcon } from "lucide-react";
+import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
+/**
+ * shadcn-ui's `AccordionTrigger` markup, plus `hideChevron` / `customChevron`
+ * — built here on the Radix primitive rather than relying on a customized
+ * shadcn copy, so forth-ui also works with the upstream shadcn `accordion`
+ * (e.g. installed through the registry).
+ */
+export function AccordionTrigger({ className, hideChevron = false, customChevron, children, ...props }) {
+    const chevronClassName = cn("text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200", customChevron?.props.className);
+    let chevron = null;
+    if (!hideChevron) {
+        chevron = customChevron ? (
+        // cloneElement (not `Slot`) so the merged className goes through
+        // `cn()`'s tailwind-merge dedup, and the icon stays the trigger's
+        // direct child for the `>svg` selector below.
+        // eslint-disable-next-line @eslint-react/no-clone-element
+        React.cloneElement(customChevron, { className: chevronClassName })) : (_jsx(ChevronDownIcon, { className: chevronClassName }));
+    }
+    return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn("focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180", className), ...props, children: [children, chevron] }) }));
+}

package/dist/components/accordion/accordion.d.ts

@@ -1,4 +1,4 @@
-import type { AccordionProps } from "./types";
+import type { AccordionProps } from "./types.js";
 /**
  * A vertically stacked set of interactive headings that each reveal a section of content.
  *

package/dist/components/accordion/accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAA8B,MAAM,SAAS,CAAC;AAE1E;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAU/D"}
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAA8B,MAAM,YAAY,CAAC;AAE7E;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAU/D"}

package/dist/components/accordion/accordion.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { AccordionMultiple } from "./accordion-multiple";
-import { AccordionSingle } from "./accordion-single";
+import { AccordionMultiple } from "./accordion-multiple.js";
+import { AccordionSingle } from "./accordion-single.js";
 /**
  * A vertically stacked set of interactive headings that each reveal a section of content.
  *

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

@@ -1,2 +1,2 @@
-export { Accordion } from "./accordion";
+export { Accordion } from "./accordion.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/accordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/accordion/index.js

@@ -1 +1 @@
-export { Accordion } from "./accordion";
+export { Accordion } from "./accordion.js";

package/dist/components/accordion/types.d.ts

@@ -1,7 +1,7 @@
 import type React from "react";
 import { type AccordionMultipleProps, type AccordionSingleProps } from "@radix-ui/react-accordion";
 import type { LucideProps } from "lucide-react";
-import type { AccordionTriggerVariants } from "./variants";
+import type { AccordionTriggerVariants } from "./variants.js";
 type AccordionVariantType = "default" | "outline" | "box" | "contained" | "box-contained" | "tabs" | "highlight-active";
 type AccordionSizeType = "sm" | "default" | "lg";
 interface Item {

package/dist/components/accordion/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EAC1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAE3D,KAAK,oBAAoB,GACrB,SAAS,GACT,SAAS,GACT,KAAK,GACL,WAAW,GACX,eAAe,GACf,MAAM,GACN,kBAAkB,CAAC;AAEvB,KAAK,iBAAiB,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;AAEjD,UAAU,IAAI;IACZ,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,YAAa,SAAQ,IAAI;IACjC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB;AAED,UAAU,SAAS;IACjB;;OAEG;IACH,KAAK,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B;;;;OAIG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,wBAAwB,CAAC,kBAAkB,CAAC,CAAC;IAChE;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;IAChD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACxC;AAED,KAAK,YAAY,GAAG,MAAM,GAAG,cAAc,GAAG,aAAa,CAAC;AAC5D,MAAM,MAAM,WAAW,GAAG,SAAS,GACjC,IAAI,CAAC,oBAAoB,EAAE,YAAY,CAAC,GAAG;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AACJ,MAAM,MAAM,aAAa,GAAG,SAAS,GACnC,IAAI,CAAC,sBAAsB,EAAE,YAAY,CAAC,GAAG;IAC3C,QAAQ,EAAE,IAAI,CAAC;IACf,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC;CACpB,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,aAAa,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EAC1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAE9D,KAAK,oBAAoB,GACrB,SAAS,GACT,SAAS,GACT,KAAK,GACL,WAAW,GACX,eAAe,GACf,MAAM,GACN,kBAAkB,CAAC;AAEvB,KAAK,iBAAiB,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;AAEjD,UAAU,IAAI;IACZ,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,YAAa,SAAQ,IAAI;IACjC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB;AAED,UAAU,SAAS;IACjB;;OAEG;IACH,KAAK,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B;;;;OAIG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,wBAAwB,CAAC,kBAAkB,CAAC,CAAC;IAChE;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;IAChD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACxC;AAED,KAAK,YAAY,GAAG,MAAM,GAAG,cAAc,GAAG,aAAa,CAAC;AAC5D,MAAM,MAAM,WAAW,GAAG,SAAS,GACjC,IAAI,CAAC,oBAAoB,EAAE,YAAY,CAAC,GAAG;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AACJ,MAAM,MAAM,aAAa,GAAG,SAAS,GACnC,IAAI,CAAC,sBAAsB,EAAE,YAAY,CAAC,GAAG;IAC3C,QAAQ,EAAE,IAAI,CAAC;IACf,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC;CACpB,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,aAAa,CAAC"}

package/dist/components/alert/alert.d.ts

@@ -1,5 +1,6 @@
 import * as React from "react";
-import type { AlertVariants } from "./variants";
+import { type UiLocale } from "../../locale/locale.js";
+import type { AlertVariants } from "./variants.js";
 export type AlertProps = React.ComponentProps<"div"> & AlertVariants & {
     /**
      * Shows a close button. Uncontrolled by default (the alert hides itself
@@ -20,6 +21,11 @@ export type AlertProps = React.ComponentProps<"div"> & AlertVariants & {
      * close button when `dismissible` is also set.
      */
     action?: React.ReactNode;
+    /**
+     * Language of the built-in labels — French by default, or the nearest
+     * `UiLocaleProvider`'s. Explicit text props still win.
+     */
+    locale?: UiLocale;
 };
 /**
  * Displays a callout for user attention.
@@ -34,5 +40,5 @@ export type AlertProps = React.ComponentProps<"div"> & AlertVariants & {
  * @author Forth
  * @copyright 2026 Forth
  */
-export declare function Alert({ className, variant, look, size, dismissible, open, onOpenChange, action, children, ...props }: AlertProps): React.JSX.Element | null;
+export declare function Alert({ className, variant, look, size, dismissible, open, onOpenChange, action, children, locale, ...props }: AlertProps): React.JSX.Element | null;
 //# sourceMappingURL=alert.d.ts.map

package/dist/components/alert/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/alert/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAClD,aAAa,GAAG;IACd;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEJ;;;;;;;;;;;;GAYG;AACH,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,WAAmB,EACnB,IAAI,EACJ,YAAY,EACZ,MAAM,EACN,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,UAAU,4BA8CZ"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/alert/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,KAAK,QAAQ,EAAiB,MAAM,wBAAwB,CAAC;AAEtE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAGnD,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAClD,aAAa,GAAG;IACd;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAC;CACnB,CAAC;AAEJ;;;;;;;;;;;;GAYG;AACH,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,WAAmB,EACnB,IAAI,EACJ,YAAY,EACZ,MAAM,EACN,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,UAAU,4BA+CZ"}

package/dist/components/alert/alert.js

@@ -3,7 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { X } from "lucide-react";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { alertVariants } from "./variants";
+import { useUiMessages } from "../../locale/locale.js";
+import { alertVariants } from "./variants.js";
 /**
  * Displays a callout for user attention.
  *
@@ -17,7 +18,8 @@ import { alertVariants } from "./variants";
  * @author Forth
  * @copyright 2026 Forth
  */
-export function Alert({ className, variant, look, size, dismissible = false, open, onOpenChange, action, children, ...props }) {
+export function Alert({ className, variant, look, size, dismissible = false, open, onOpenChange, action, children, locale, ...props }) {
+    const messages = useUiMessages(locale);
     const [uncontrolledOpen, setUncontrolledOpen] = React.useState(true);
     const isOpen = open ?? uncontrolledOpen;
     const hasActions = Boolean(action) || dismissible;
@@ -28,5 +30,5 @@ export function Alert({ className, variant, look, size, dismissible = false, ope
     if (!isOpen) {
         return null;
     }
-    return (_jsxs("div", { "data-slot": "alert", role: "alert", className: cn(alertVariants({ variant, look, size }), hasActions && "pr-10", className), ...props, children: [children, hasActions && (_jsxs("div", { "data-slot": "alert-actions", className: "absolute top-2.5 right-2.5 flex items-center gap-1.5", children: [action, dismissible && (_jsx("button", { type: "button", onClick: handleDismiss, "aria-label": "Dismiss", className: "rounded-sm opacity-70 transition-opacity outline-none hover:opacity-100 focus-visible:ring-2 focus-visible:ring-current", children: _jsx(X, { className: "size-3.5" }) }))] }))] }));
+    return (_jsxs("div", { "data-slot": "alert", role: "alert", className: cn(alertVariants({ variant, look, size }), hasActions && "pr-10", className), ...props, children: [children, hasActions && (_jsxs("div", { "data-slot": "alert-actions", className: "absolute top-2.5 right-2.5 flex items-center gap-1.5", children: [action, dismissible && (_jsx("button", { type: "button", onClick: handleDismiss, "aria-label": messages.dismiss, className: "rounded-sm opacity-70 transition-opacity outline-none hover:opacity-100 focus-visible:ring-2 focus-visible:ring-current", children: _jsx(X, { className: "size-3.5" }) }))] }))] }));
 }

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

@@ -1,5 +1,5 @@
-export type { AlertProps } from "./alert";
-export { Alert } from "./alert";
-export type { AlertVariants } from "./variants";
+export type { AlertProps } from "./alert.js";
+export { Alert } from "./alert.js";
+export type { AlertVariants } from "./variants.js";
 export { AlertDescription, AlertTitle, } from "@forthtilliath/shadcn-ui/components/alert";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/alert/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/alert/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAIhD,OAAO,EACL,gBAAgB,EAChB,UAAU,GACX,MAAM,2CAA2C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/alert/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,YAAY,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAInD,OAAO,EACL,gBAAgB,EAChB,UAAU,GACX,MAAM,2CAA2C,CAAC"}

package/dist/components/alert/index.js

@@ -1,4 +1,4 @@
-export { Alert } from "./alert";
+export { Alert } from "./alert.js";
 // Title/description need no forth-ui-specific behavior on top of shadcn-ui's
 // — re-exported here so consumers only need one import path.
 export { AlertDescription, AlertTitle, } from "@forthtilliath/shadcn-ui/components/alert";

package/dist/components/alert/variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/components/alert/variants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAK7D,eAAO,MAAM,aAAa;;;;8EAsHzB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/components/alert/variants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAK7D,eAAO,MAAM,aAAa;;;;8EA6HzB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}

package/dist/components/alert/variants.js

@@ -28,6 +28,13 @@ export const alertVariants = cva("relative grid w-full grid-cols-[0_1fr] items-s
         size: "default",
     },
     compoundVariants: [
+        { variant: "default", look: "outline", className: "bg-card" },
+        // shadcn's AlertDescription is muted-foreground (grey), unreadable on a
+        // colored background: colored alerts give it their own text color.
+        {
+            variant: ["primary", "success", "warning", "info", "destructive"],
+            className: "*:data-[slot=alert-description]:text-current",
+        },
         // default (neutral) ignores `look` — none of the reference sources
         // show a "solid neutral" or "outline neutral" alert, only colored
         // ones vary by look.
@@ -49,7 +56,7 @@ export const alertVariants = cva("relative grid w-full grid-cols-[0_1fr] items-s
         {
             variant: "success",
             look: "solid",
-            className: "bg-green-600 text-white border-transparent",
+            className: "bg-green-700 text-white border-transparent",
         },
         {
             variant: "success",
@@ -64,7 +71,7 @@ export const alertVariants = cva("relative grid w-full grid-cols-[0_1fr] items-s
         {
             variant: "warning",
             look: "solid",
-            className: "bg-amber-500 text-white border-transparent",
+            className: "bg-amber-500 text-amber-950 border-transparent",
         },
         {
             variant: "warning",
@@ -79,7 +86,7 @@ export const alertVariants = cva("relative grid w-full grid-cols-[0_1fr] items-s
         {
             variant: "info",
             look: "solid",
-            className: "bg-sky-600 text-white border-transparent",
+            className: "bg-sky-700 text-white border-transparent",
         },
         {
             variant: "info",
@@ -99,7 +106,7 @@ export const alertVariants = cva("relative grid w-full grid-cols-[0_1fr] items-s
         {
             variant: "destructive",
             look: "soft",
-            className: "bg-destructive/10 text-destructive border-destructive/20 [&>svg]:text-destructive",
+            className: "bg-red-50 text-red-700 border-red-200 [&>svg]:text-red-600 dark:bg-red-950 dark:text-red-300 dark:border-red-900 dark:[&>svg]:text-red-400",
         },
         {
             variant: "destructive",

package/dist/components/avatar/avatar-group.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from "react";
-import type { AvatarProps } from "./avatar";
+import type { AvatarProps } from "./avatar.js";
 export type AvatarGroupProps = React.ComponentProps<"div"> & {
     avatars: AvatarProps[];
     /**

package/dist/components/avatar/avatar-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar-group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIjC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAIF;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,OAAO,EACP,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA6BhC"}
+{"version":3,"file":"avatar-group.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar-group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIjC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAIF;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,OAAO,EACP,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA6BhC"}

package/dist/components/avatar/avatar-group.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { Avatar } from "./avatar";
+import { Avatar } from "./avatar.js";
 const RING_CLASS = "ring-2 ring-background hover:z-10";
 /**
  * A component to group multiple avatars together.

package/dist/components/avatar/avatar.d.ts

@@ -1,7 +1,8 @@
 import type React from "react";
 import { Avatar as AvatarPrimitive } from "@forthtilliath/shadcn-ui/components/avatar";
-import type { Shape, Size } from "./constants";
-import type { BadgeVariants, FallbackVariants, StatusVariants } from "./variants";
+import { type UiLocale } from "../../locale/locale.js";
+import type { Shape, Size } from "./constants.js";
+import type { BadgeVariants, FallbackVariants, StatusVariants } from "./variants.js";
 export type AvatarProps = Omit<React.ComponentProps<typeof AvatarPrimitive>, "className" | "size"> & {
     /**
      * The source URL of the image.
@@ -89,6 +90,11 @@ export type AvatarProps = Omit<React.ComponentProps<typeof AvatarPrimitive>, "cl
      * - `tooltipContent` is the tooltip content element.
      */
     className?: Partial<Record<"root" | "image" | "fallback" | "status" | "badge" | "tooltipTrigger" | "tooltipContent", string>>;
+    /**
+     * Language of the built-in labels — French by default, or the nearest
+     * `UiLocaleProvider`'s. Explicit text props still win.
+     */
+    locale?: UiLocale;
 };
 /**
  * An image element with a fallback for representing the user.
@@ -103,5 +109,5 @@ export type AvatarProps = Omit<React.ComponentProps<typeof AvatarPrimitive>, "cl
  * @author Forth
  * @copyright 2025 Forth
  */
-export declare function Avatar({ src, alt, fallback, fallbackVariant, shape, size, ring, status, position, badge, badgeVariant, badgePosition, className, renderTooltip, ...props }: AvatarProps): React.JSX.Element;
+export declare function Avatar({ src, alt, fallback, fallbackVariant, shape, size, ring, status, position, badge, badgeVariant, badgePosition, className, renderTooltip, locale, ...props }: AvatarProps): React.JSX.Element;
 //# sourceMappingURL=avatar.d.ts.map

package/dist/components/avatar/avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,MAAM,IAAI,eAAe,EAG1B,MAAM,4CAA4C,CAAC;AAQpD,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,KAAK,EACV,aAAa,EACb,gBAAgB,EAChB,cAAc,EACf,MAAM,YAAY,CAAC;AASpB,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,EAC5C,WAAW,GAAG,MAAM,CACrB,GAAG;IACF;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC,iBAAiB,CAAC,CAAC;IACtD;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;IACtC;;;;;;;;;;;;;;OAcG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAC1C;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IAEtC;;;;;;;;;;OAUG;IACH,SAAS,CAAC,EAAE,OAAO,CACjB,MAAM,CACF,MAAM,GACN,OAAO,GACP,UAAU,GACV,QAAQ,GACR,OAAO,GACP,gBAAgB,GAChB,gBAAgB,EAClB,MAAM,CACP,CACF,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,GAAG,EACH,QAAQ,EACR,eAAe,EACf,KAAK,EACL,IAAI,EACJ,IAAY,EACZ,MAAM,EACN,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,aAAsC,EACtC,SAAS,EACT,aAAa,EACb,GAAG,KAAK,EACT,EAAE,WAAW,qBAgEb"}
+{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,MAAM,IAAI,eAAe,EAG1B,MAAM,4CAA4C,CAAC;AAQpD,OAAO,EAAE,KAAK,QAAQ,EAAiB,MAAM,wBAAwB,CAAC;AAEtE,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EACV,aAAa,EACb,gBAAgB,EAChB,cAAc,EACf,MAAM,eAAe,CAAC;AASvB,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,EAC5C,WAAW,GAAG,MAAM,CACrB,GAAG;IACF;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC,iBAAiB,CAAC,CAAC;IACtD;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;IACtC;;;;;;;;;;;;;;OAcG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAC1C;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IAEtC;;;;;;;;;;OAUG;IACH,SAAS,CAAC,EAAE,OAAO,CACjB,MAAM,CACF,MAAM,GACN,OAAO,GACP,UAAU,GACV,QAAQ,GACR,OAAO,GACP,gBAAgB,GAChB,gBAAgB,EAClB,MAAM,CACP,CACF,CAAC;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,GAAG,EACH,QAAQ,EACR,eAAe,EACf,KAAK,EACL,IAAI,EACJ,IAAY,EACZ,MAAM,EACN,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,aAAsC,EACtC,SAAS,EACT,aAAa,EACb,MAAM,EACN,GAAG,KAAK,EACT,EAAE,WAAW,qBAiEb"}

package/dist/components/avatar/avatar.js

@@ -1,9 +1,11 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Avatar as AvatarPrimitive, AvatarFallback, AvatarImage, } from "@forthtilliath/shadcn-ui/components/avatar";
 import { Tooltip, TooltipContent, TooltipTrigger, } from "@forthtilliath/shadcn-ui/components/tooltip";
 import { cn } from "@forthtilliath/shadcn-ui/lib/utils";
-import { DEFAULT_BADGE_POSITION, STATUS_LABEL } from "./constants";
-import { avatarVariants, badgeVariants, fallbackVariants, statusVariants, tooltipTriggerVariants, } from "./variants";
+import { useUiMessages } from "../../locale/locale.js";
+import { DEFAULT_BADGE_POSITION } from "./constants.js";
+import { avatarVariants, badgeVariants, fallbackVariants, statusVariants, tooltipTriggerVariants, } from "./variants.js";
 /**
  * An image element with a fallback for representing the user.
  *
@@ -17,8 +19,9 @@ import { avatarVariants, badgeVariants, fallbackVariants, statusVariants, toolti
  * @author Forth
  * @copyright 2025 Forth
  */
-export function Avatar({ src, alt, fallback, fallbackVariant, shape, size, ring = false, status, position, badge, badgeVariant, badgePosition = DEFAULT_BADGE_POSITION, className, renderTooltip, ...props }) {
-    const avatar = (_jsxs("div", { className: "relative", children: [_jsxs(AvatarPrimitive, { className: cn("block", avatarVariants({ shape, ring, size }), className?.root), ...props, children: [_jsx(AvatarImage, { src: src, alt: alt, className: className?.image }), _jsx(AvatarFallback, { className: cn(fallbackVariants({ fallbackVariant, shape }), className?.fallback), children: fallback })] }), status && (_jsx("div", { className: cn(statusVariants({ status, position }), className?.status), children: _jsx("span", { className: "sr-only", children: STATUS_LABEL[status] }) })), badge !== undefined && (_jsx("div", { className: cn(badgeVariants({ badgeVariant, position: badgePosition }), className?.badge), children: badge }))] }));
+export function Avatar({ src, alt, fallback, fallbackVariant, shape, size, ring = false, status, position, badge, badgeVariant, badgePosition = DEFAULT_BADGE_POSITION, className, renderTooltip, locale, ...props }) {
+    const messages = useUiMessages(locale);
+    const avatar = (_jsxs("div", { className: "relative", children: [_jsxs(AvatarPrimitive, { className: cn("block", avatarVariants({ shape, ring, size }), className?.root), ...props, children: [_jsx(AvatarImage, { src: src, alt: alt, className: className?.image }), _jsx(AvatarFallback, { className: cn(fallbackVariants({ fallbackVariant, shape }), className?.fallback), children: fallback })] }), status && (_jsx("div", { className: cn(statusVariants({ status, position }), className?.status), children: _jsx("span", { className: "sr-only", children: messages.avatar[status] }) })), badge !== undefined && (_jsx("div", { className: cn(badgeVariants({ badgeVariant, position: badgePosition }), className?.badge), children: badge }))] }));
     if (typeof renderTooltip === "function") {
         return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { className: cn(tooltipTriggerVariants({ shape }), className?.tooltipTrigger), asChild: true, children: avatar }), _jsx(TooltipContent, { className: cn(className?.tooltipContent), children: renderTooltip() })] }));
     }

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

@@ -1,5 +1,5 @@
-export type { AvatarProps } from "./avatar";
-export { Avatar } from "./avatar";
-export type { AvatarGroupProps } from "./avatar-group";
-export { AvatarGroup } from "./avatar-group";
+export type { AvatarProps } from "./avatar.js";
+export { Avatar } from "./avatar.js";
+export type { AvatarGroupProps } from "./avatar-group.js";
+export { AvatarGroup } from "./avatar-group.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/avatar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/avatar/index.js

@@ -1,2 +1,2 @@
-export { Avatar } from "./avatar";
-export { AvatarGroup } from "./avatar-group";
+export { Avatar } from "./avatar.js";
+export { AvatarGroup } from "./avatar-group.js";