@aircall/ds 0.13.0 → 0.15.0

package/dist/index.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { createContext, useContext } from "react";
+import { createContext, useCallback, useContext, useSyncExternalStore } from "react";
 import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
 import { clsx } from "clsx";
 import { extendTailwindMerge } from "tailwind-merge";
@@ -7,6 +7,7 @@ import { ArrowDownToLine, ArrowLeft, ArrowRight, CheckIcon, ChevronDownIcon, Che
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button as Button$1 } from "@base-ui/react/button";
 import { cva } from "class-variance-authority";
+import i18next from "i18next";
 import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
 import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
 import { mergeProps } from "@base-ui/react/merge-props";
@@ -209,6 +210,194 @@ const Button = React.forwardRef((componentProps, forwardRef) => {
 });
 Button.displayName = "Button";
 
+//#endregion
+//#region src/i18n/locales/de.ts
+const de = {
+	"spinner.loading": "Laden",
+	"pagination.label": "Seitennavigation",
+	"pagination.previousPage": "Zur vorherigen Seite",
+	"pagination.nextPage": "Zur nächsten Seite",
+	"dataTable.selectAllRows": "Alle Zeilen auswählen",
+	"dataTable.selectRow": "Zeile auswählen",
+	"tree.collapse": "Minimieren",
+	"tree.expand": "Erweitern",
+	"multiselect.remove": "Entfernen",
+	"multiselect.clearAll": "Alles löschen",
+	"sidebar.toggle": "Seitenleiste umschalten",
+	"drawer.close": "Schließen",
+	"emojiPicker.emoji": "Emoji",
+	"emojiPicker.choose": "Emoji auswählen",
+	"actionBar.selectionActions": "Auswahlaktionen",
+	"pagination.previous": "Zurück",
+	"pagination.next": "Weiter",
+	"actionBar.clearSelection": "Auswahl aufheben",
+	"actionBar.itemsSelected": "{{count}} Elemente ausgewählt."
+};
+var de_default = de;
+
+//#endregion
+//#region src/i18n/locales/en.ts
+const en = {
+	"spinner.loading": "Loading",
+	"pagination.label": "pagination",
+	"pagination.previousPage": "Go to previous page",
+	"pagination.nextPage": "Go to next page",
+	"dataTable.selectAllRows": "Select all rows",
+	"dataTable.selectRow": "Select row",
+	"tree.collapse": "Collapse",
+	"tree.expand": "Expand",
+	"multiselect.remove": "Remove",
+	"multiselect.clearAll": "Clear all",
+	"sidebar.toggle": "Toggle Sidebar",
+	"drawer.close": "Close",
+	"emojiPicker.emoji": "Emoji",
+	"emojiPicker.choose": "Choose an emoji",
+	"actionBar.selectionActions": "Selection actions",
+	"pagination.previous": "Previous",
+	"pagination.next": "Next",
+	"actionBar.clearSelection": "Clear selection",
+	"actionBar.itemsSelected": "{{count}} items selected."
+};
+var en_default = en;
+
+//#endregion
+//#region src/i18n/locales/es.ts
+const es = {
+	"spinner.loading": "Cargando",
+	"pagination.label": "paginación",
+	"pagination.previousPage": "Ir a la página anterior",
+	"pagination.nextPage": "Ir a la página siguiente",
+	"dataTable.selectAllRows": "Seleccionar todas las filas",
+	"dataTable.selectRow": "Seleccionar fila",
+	"tree.collapse": "Minimizar",
+	"tree.expand": "Ampliar",
+	"multiselect.remove": "Eliminar",
+	"multiselect.clearAll": "Borrar todo",
+	"sidebar.toggle": "Alternar barra lateral",
+	"drawer.close": "Cerrar",
+	"emojiPicker.emoji": "Emoji",
+	"emojiPicker.choose": "Elegir un emoji",
+	"actionBar.selectionActions": "Acciones de selección",
+	"pagination.previous": "Anterior",
+	"pagination.next": "Siguiente",
+	"actionBar.clearSelection": "Borrar selección",
+	"actionBar.itemsSelected": "{{count}} elementos seleccionados."
+};
+var es_default = es;
+
+//#endregion
+//#region src/i18n/locales/fr.ts
+const fr = {
+	"spinner.loading": "Chargement",
+	"pagination.label": "pagination",
+	"pagination.previousPage": "Aller à la page précédente",
+	"pagination.nextPage": "Aller à la page suivante",
+	"dataTable.selectAllRows": "Sélectionner toutes les lignes",
+	"dataTable.selectRow": "Sélectionner la ligne",
+	"tree.collapse": "Réduire",
+	"tree.expand": "Développer",
+	"multiselect.remove": "Supprimer",
+	"multiselect.clearAll": "Tout effacer",
+	"sidebar.toggle": "Basculer la barre latérale",
+	"drawer.close": "Fermer",
+	"emojiPicker.emoji": "Émoji",
+	"emojiPicker.choose": "Choisir un émoji",
+	"actionBar.selectionActions": "Actions de sélection",
+	"pagination.previous": "Précédent",
+	"pagination.next": "Suivant",
+	"actionBar.clearSelection": "Effacer la sélection",
+	"actionBar.itemsSelected": "{{count}} éléments sélectionnés."
+};
+var fr_default = fr;
+
+//#endregion
+//#region src/i18n/locales/it.ts
+const it = {
+	"spinner.loading": "Caricamento",
+	"pagination.label": "paginazione",
+	"pagination.nextPage": "Vai alla pagina successiva",
+	"pagination.previousPage": "Vai alla pagina precedente",
+	"dataTable.selectAllRows": "Seleziona tutte le righe",
+	"dataTable.selectRow": "Seleziona riga",
+	"tree.collapse": "Ridurre",
+	"tree.expand": "Espandi",
+	"multiselect.remove": "Rimuovi",
+	"multiselect.clearAll": "Cancella tutto",
+	"sidebar.toggle": "Attiva/disattiva barra laterale",
+	"drawer.close": "Chiudi",
+	"emojiPicker.emoji": "Emoji",
+	"emojiPicker.choose": "Scegli un emoji",
+	"actionBar.selectionActions": "Azioni di selezione",
+	"pagination.previous": "Precedente",
+	"pagination.next": "Successivo",
+	"actionBar.clearSelection": "Cancella selezione",
+	"actionBar.itemsSelected": "{{count}} elementi selezionati."
+};
+var it_default = it;
+
+//#endregion
+//#region src/i18n/instance.ts
+const SUPPORTED_LANGUAGES = [
+	"en",
+	"fr",
+	"es",
+	"de",
+	"it"
+];
+const FALLBACK_LANGUAGE = "en";
+/** Resolve the initial language from the environment, falling back to English. */
+function detectInitialLanguage() {
+	if (typeof navigator === "undefined" || !navigator.language) return FALLBACK_LANGUAGE;
+	const base = navigator.language.split("-")[0];
+	return SUPPORTED_LANGUAGES.includes(base) ? base : FALLBACK_LANGUAGE;
+}
+/** The single private i18next instance owned by @aircall/ds. Isolated from any consumer instance. */
+const dsI18n = i18next.createInstance();
+dsI18n.init({
+	lng: detectInitialLanguage(),
+	fallbackLng: FALLBACK_LANGUAGE,
+	supportedLngs: [...SUPPORTED_LANGUAGES],
+	load: "languageOnly",
+	ns: ["ds"],
+	defaultNS: "ds",
+	resources: {
+		en: { ds: en_default },
+		fr: { ds: fr_default },
+		es: { ds: es_default },
+		de: { ds: de_default },
+		it: { ds: it_default }
+	},
+	interpolation: { escapeValue: false },
+	keySeparator: false,
+	returnNull: false,
+	initImmediate: false
+});
+/** Register an additional namespace's resources into the shared instance (used by @aircall/blocks). */
+function registerI18nNamespace(ns, resources) {
+	for (const [lng, bundle] of Object.entries(resources)) dsI18n.addResourceBundle(lng, ns, bundle, true, true);
+}
+
+//#endregion
+//#region src/i18n/use-ds-translation.ts
+function subscribe(onChange) {
+	dsI18n.on("languageChanged", onChange);
+	return () => dsI18n.off("languageChanged", onChange);
+}
+function getLanguageSnapshot() {
+	return dsI18n.language;
+}
+/**
+* @internal
+* Reads translations from the shared ds instance and re-renders on language change.
+* Used by @aircall/ds and @aircall/blocks components only — not part of the consumer contract.
+*/
+function useDsTranslation(ns) {
+	return useCallback((key, opts) => dsI18n.t(key, {
+		ns,
+		...opts
+	}), [ns, useSyncExternalStore(subscribe, getLanguageSnapshot, getLanguageSnapshot)]);
+}
+
 //#endregion
 //#region src/components/action-bar.tsx
 /** Fixed height of the ActionBar (px). Single source of truth — the bar uses it
@@ -232,14 +421,16 @@ const ActionBarButton = React.forwardRef((componentProps, forwardRef) => {
 });
 ActionBarButton.displayName = "ActionBarButton";
 const ActionBar = React.forwardRef((componentProps, forwardRef) => {
-	const { className, count, onClear, children, label, clearLabel = "Clear selection", style, ...props } = componentProps;
+	const { className, count, onClear, children, label, clearLabel, style, ...props } = componentProps;
+	const t = useDsTranslation("ds");
 	const ctx = React.useContext(ActionBarContext);
 	const resolvedCount = count ?? ctx?.count ?? 0;
 	const resolvedOnClear = onClear ?? ctx?.onClear;
+	const resolvedClearLabel = clearLabel ?? t("actionBar.clearSelection");
 	return /* @__PURE__ */ jsxs("div", {
 		ref: forwardRef,
 		role: "toolbar",
-		"aria-label": "Selection actions",
+		"aria-label": t("actionBar.selectionActions"),
 		"data-slot": "action-bar",
 		className: cn("relative flex w-full items-center gap-2 rounded-md border border-border bg-popover px-2 text-popover-foreground shadow-lg", className),
 		style: {
@@ -251,12 +442,12 @@ const ActionBar = React.forwardRef((componentProps, forwardRef) => {
 			resolvedOnClear ? /* @__PURE__ */ jsx(ActionBarButton, {
 				size: "icon",
 				onClick: resolvedOnClear,
-				"aria-label": clearLabel,
+				"aria-label": resolvedClearLabel,
 				children: /* @__PURE__ */ jsx(XIcon, {})
 			}) : null,
 			/* @__PURE__ */ jsx("span", {
 				className: "flex-1 truncate text-sm",
-				children: label ? label(resolvedCount) : `${resolvedCount} items selected.`
+				children: label ? label(resolvedCount) : t("actionBar.itemsSelected", { count: resolvedCount })
 			}),
 			children ? /* @__PURE__ */ jsx("div", {
 				className: "flex shrink-0 items-center gap-2",
@@ -2217,11 +2408,12 @@ const spinnerVariants = cva("animate-spin text-current", {
 });
 const Spinner = React.forwardRef((componentProps, forwardRef) => {
 	const { className, size, ...props } = componentProps;
+	const t = useDsTranslation("ds");
 	return /* @__PURE__ */ jsx(Loader2Icon, {
 		ref: forwardRef,
 		"data-slot": "spinner",
 		role: "status",
-		"aria-label": "Loading",
+		"aria-label": t("spinner.loading"),
 		className: cn(spinnerVariants({ size }), className),
 		...props
 	});
@@ -2239,7 +2431,7 @@ const Table = React.forwardRef((componentProps, forwardRef) => {
 		children: /* @__PURE__ */ jsx("table", {
 			ref: forwardRef,
 			"data-slot": "table",
-			className: cn("w-full caption-bottom text-sm [&_tbody_tr:last-child]:border-b-0", className),
+			className: cn("w-full caption-bottom text-sm text-foreground [&_tbody_tr:last-child]:border-b-0", className),
 			...props
 		})
 	});
@@ -2448,29 +2640,35 @@ function DataTable(componentProps) {
 		]
 	});
 }
+function SelectAllHeader({ table }) {
+	const t = useDsTranslation("ds");
+	const allSelected = table.getIsAllRowsSelected();
+	const someSelected = table.getIsSomeRowsSelected();
+	return /* @__PURE__ */ jsx(Checkbox, {
+		checked: allSelected,
+		indeterminate: !allSelected && someSelected,
+		onCheckedChange: (value) => table.toggleAllRowsSelected(value === true),
+		"aria-label": t("dataTable.selectAllRows")
+	});
+}
+function SelectRowCell({ row }) {
+	const t = useDsTranslation("ds");
+	return /* @__PURE__ */ jsx("span", {
+		className: "contents",
+		onClick: (e) => e.stopPropagation(),
+		children: /* @__PURE__ */ jsx(Checkbox, {
+			checked: row.getIsSelected(),
+			disabled: !row.getCanSelect(),
+			onCheckedChange: (value) => row.toggleSelected(value === true),
+			"aria-label": t("dataTable.selectRow")
+		})
+	});
+}
 function makeSelectColumn() {
 	return {
 		id: SELECT_COLUMN_ID,
-		header: ({ table }) => {
-			const allSelected = table.getIsAllRowsSelected();
-			const someSelected = table.getIsSomeRowsSelected();
-			return /* @__PURE__ */ jsx(Checkbox, {
-				checked: allSelected,
-				indeterminate: !allSelected && someSelected,
-				onCheckedChange: (value) => table.toggleAllRowsSelected(value === true),
-				"aria-label": "Select all rows"
-			});
-		},
-		cell: ({ row }) => /* @__PURE__ */ jsx("span", {
-			className: "contents",
-			onClick: (e) => e.stopPropagation(),
-			children: /* @__PURE__ */ jsx(Checkbox, {
-				checked: row.getIsSelected(),
-				disabled: !row.getCanSelect(),
-				onCheckedChange: (value) => row.toggleSelected(value === true),
-				"aria-label": "Select row"
-			})
-		}),
+		header: ({ table }) => /* @__PURE__ */ jsx(SelectAllHeader, { table }),
+		cell: ({ row }) => /* @__PURE__ */ jsx(SelectRowCell, { row }),
 		enableSorting: false,
 		enableHiding: false,
 		enableResizing: false,
@@ -2644,6 +2842,7 @@ function TreeItem({ item, className, children, onActivate, onClick: userOnClick,
 }
 function TreeItemLabel({ item: propItem, children, className, ...props }) {
 	const { currentItem } = useTreeContext();
+	const t = useDsTranslation("ds");
 	const item = propItem || currentItem;
 	if (!item) {
 		console.warn("TreeItemLabel: No item provided via props or context");
@@ -2656,7 +2855,7 @@ function TreeItemLabel({ item: propItem, children, className, ...props }) {
 		"data-slot": "tree-item-label",
 		...props,
 		children: [isFolder ? /* @__PURE__ */ jsx(Button, {
-			"aria-label": isExpanded ? "Collapse" : "Expand",
+			"aria-label": isExpanded ? t("tree.collapse") : t("tree.expand"),
 			className: "shrink-0 text-muted-foreground",
 			onClick: (event) => {
 				event.stopPropagation();
@@ -2873,6 +3072,7 @@ const DrawerViewport = React.forwardRef((componentProps, forwardRef) => {
 DrawerViewport.displayName = "DrawerViewport";
 const DrawerPopup = React.forwardRef((componentProps, forwardRef) => {
 	const { className, children, showCloseButton = false, position: positionProp, variant = "default", showBar = false, container, ...props } = componentProps;
+	const t = useDsTranslation("ds");
 	const { position: contextPosition } = useContext(DrawerContext);
 	const position = positionProp ?? contextPosition;
 	const inContainer = !!container;
@@ -2890,7 +3090,7 @@ const DrawerPopup = React.forwardRef((componentProps, forwardRef) => {
 				children: [
 					children,
 					showCloseButton && /* @__PURE__ */ jsx(DrawerPrimitive.Close, {
-						"aria-label": "Close",
+						"aria-label": t("drawer.close"),
 						className: "absolute end-2 top-2",
 						render: /* @__PURE__ */ jsx(Button, {
 							size: "icon",
@@ -3812,9 +4012,10 @@ function EmojiPicker({ onEmojiSelect, children }) {
 }
 const EmojiPickerTrigger = React.forwardRef((componentProps, forwardRef) => {
 	const { render, children, ...props } = componentProps;
+	const t = useDsTranslation("ds");
 	return /* @__PURE__ */ jsx(PopoverTrigger, {
 		ref: forwardRef,
-		"aria-label": "Emoji",
+		"aria-label": t("emojiPicker.emoji"),
 		render: render ?? /* @__PURE__ */ jsx(Button, {
 			variant: "outline",
 			size: "icon"
@@ -3827,10 +4028,11 @@ EmojiPickerTrigger.displayName = "EmojiPickerTrigger";
 function EmojiPickerContent({ className, align = "start", searchPlaceholder, categories, width = 300, suggestedEmojisMode = SuggestionMode.RECENT, ...props }) {
 	const { onSelect } = useEmojiPickerContext();
 	const { resolvedTheme } = useTheme();
+	const t = useDsTranslation("ds");
 	const pickerTheme = resolvedTheme === "dark" ? Theme.DARK : Theme.LIGHT;
 	const handleClick = React.useCallback((emojiData) => onSelect(emojiData.emoji), [onSelect]);
 	return /* @__PURE__ */ jsx(PopoverContent, {
-		"aria-label": "Choose an emoji",
+		"aria-label": t("emojiPicker.choose"),
 		className: cn("p-0 w-auto overflow-hidden ring-foreground/5", className),
 		align,
 		...props,
@@ -4305,10 +4507,11 @@ ListCol.displayName = "ListCol";
 //#region src/components/pagination.tsx
 const Pagination = React.forwardRef((componentProps, forwardRef) => {
 	const { className, ...props } = componentProps;
+	const t = useDsTranslation("ds");
 	return /* @__PURE__ */ jsx("nav", {
 		ref: forwardRef,
 		role: "navigation",
-		"aria-label": "pagination",
+		"aria-label": t("pagination.label"),
 		"data-slot": "pagination",
 		className: cn("mx-auto flex w-full justify-center", className),
 		...props
@@ -4352,31 +4555,35 @@ const PaginationLink = React.forwardRef((componentProps, forwardRef) => {
 });
 PaginationLink.displayName = "PaginationLink";
 const PaginationPrevious = React.forwardRef((componentProps, forwardRef) => {
-	const { className, text = "Previous", ...props } = componentProps;
+	const { className, text, ...props } = componentProps;
+	const t = useDsTranslation("ds");
+	const resolvedText = text ?? t("pagination.previous");
 	return /* @__PURE__ */ jsxs(PaginationLink, {
 		ref: forwardRef,
-		"aria-label": "Go to previous page",
+		"aria-label": t("pagination.previousPage"),
 		size: "default",
 		className: cn("pl-2!", className),
 		...props,
 		children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { "data-icon": "inline-start" }), /* @__PURE__ */ jsx("span", {
 			className: "hidden sm:block",
-			children: text
+			children: resolvedText
 		})]
 	});
 });
 PaginationPrevious.displayName = "PaginationPrevious";
 const PaginationNext = React.forwardRef((componentProps, forwardRef) => {
-	const { className, text = "Next", ...props } = componentProps;
+	const { className, text, ...props } = componentProps;
+	const t = useDsTranslation("ds");
+	const resolvedText = text ?? t("pagination.next");
 	return /* @__PURE__ */ jsxs(PaginationLink, {
 		ref: forwardRef,
-		"aria-label": "Go to next page",
+		"aria-label": t("pagination.nextPage"),
 		size: "default",
 		className: cn("pr-2!", className),
 		...props,
 		children: [/* @__PURE__ */ jsx("span", {
 			className: "hidden sm:block",
-			children: text
+			children: resolvedText
 		}), /* @__PURE__ */ jsx(ChevronRightIcon, { "data-icon": "inline-end" })]
 	});
 });
@@ -4914,6 +5121,7 @@ Sidebar.displayName = "Sidebar";
 const SidebarTrigger = React.forwardRef((componentProps, forwardRef) => {
 	const { className, onClick, ...props } = componentProps;
 	const { toggleSidebar } = useSidebar();
+	const t = useDsTranslation("ds");
 	return /* @__PURE__ */ jsxs(Button, {
 		ref: forwardRef,
 		"data-sidebar": "trigger",
@@ -4928,7 +5136,7 @@ const SidebarTrigger = React.forwardRef((componentProps, forwardRef) => {
 		...props,
 		children: [/* @__PURE__ */ jsx(PanelLeftIcon, {}), /* @__PURE__ */ jsx("span", {
 			className: "sr-only",
-			children: "Toggle Sidebar"
+			children: t("sidebar.toggle")
 		})]
 	});
 });
@@ -4936,14 +5144,15 @@ SidebarTrigger.displayName = "SidebarTrigger";
 const SidebarRail = React.forwardRef((componentProps, forwardRef) => {
 	const { className, ...props } = componentProps;
 	const { toggleSidebar } = useSidebar();
+	const t = useDsTranslation("ds");
 	return /* @__PURE__ */ jsx("button", {
 		ref: forwardRef,
 		"data-sidebar": "rail",
 		"data-slot": "sidebar-rail",
-		"aria-label": "Toggle Sidebar",
+		"aria-label": t("sidebar.toggle"),
 		tabIndex: -1,
 		onClick: toggleSidebar,
-		title: "Toggle Sidebar",
+		title: t("sidebar.toggle"),
 		className: cn("absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", className),
 		...props
 	});
@@ -5566,6 +5775,47 @@ const ToggleGroupItem = React.forwardRef((componentProps, forwardRef) => {
 });
 ToggleGroupItem.displayName = "ToggleGroupItem";
 
+//#endregion
+//#region src/components/ds-i18n-provider.tsx
+/**
+* Drives the language of the shared `dsI18n` singleton from React.
+*
+* PRODUCTION INVARIANT — mount EXACTLY ONE `DsI18nProvider` at the app root, as an
+* ancestor of all DS components. This is NOT a context provider: it mutates the single
+* shared `dsI18n` singleton inside an effect. Therefore NEVER nest two providers with
+* differing languages — they are competing singleton mutators, and because React runs
+* effects inside-out, the OUTERMOST provider's effect runs last and wins, silently
+* overriding the inner one. DS apps are single-locale, so one root provider is correct.
+*
+* Use either `DsI18nProvider` (React apps) OR `syncDsLanguage` (non-React startup) — not
+* both, for the same reason: each mutates the same singleton and they would compete.
+*/
+function DsI18nProvider(componentProps) {
+	const { language, children } = componentProps;
+	React.useEffect(() => {
+		const target = language ?? detectInitialLanguage();
+		if (dsI18n.language !== target) dsI18n.changeLanguage(target);
+	}, [language]);
+	return children;
+}
+/**
+* Escape hatch for non-React / global-instance startup (e.g. the browser extension).
+* Mirrors `instance`'s current language onto the ds instance and follows its changes.
+* Returns an unsubscribe function.
+*
+* PRODUCTION INVARIANT — call this OR mount `DsI18nProvider`, never both. Both mutate the
+* same `dsI18n` singleton, so running them together makes them compete (last writer wins).
+* Like the provider, the singleton is single-locale: drive it from exactly one source.
+*/
+function syncDsLanguage(instance) {
+	if (instance.language && dsI18n.language !== instance.language) dsI18n.changeLanguage(instance.language);
+	const handler = (lng) => {
+		dsI18n.changeLanguage(lng);
+	};
+	instance.on("languageChanged", handler);
+	return () => instance.off("languageChanged", handler);
+}
+
 //#endregion
 //#region src/hooks/use-audio-gauge.ts
 /**
@@ -5641,4 +5891,4 @@ function useAudioGauge(options = {}) {
 }
 
 //#endregion
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionBar, ActionBarButton, ActionBarContext, ActionBarHeight, Alert, AlertAction, AlertAction as BannerAction, AlertDescription, AlertDescription as BannerDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlertTitle as BannerTitle, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, BadgeGroup, BadgeGroupCount, Banner, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Chip, ChipRemove, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CounterBadge, CountryFlag, DataTable, DataTree, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerBackdrop, DrawerBar, DrawerClose, DrawerContent, DrawerCreateHandle, DrawerDescription, DrawerFooter, DrawerHeader, DrawerMenu, DrawerMenuCheckboxItem, DrawerMenuGroup, DrawerMenuGroupLabel, DrawerMenuItem, DrawerMenuRadioGroup, DrawerMenuRadioItem, DrawerMenuSeparator, DrawerMenuTrigger, DrawerPanel, DrawerPopup, DrawerPortal, DrawerPrimitive, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DropdownMenu, DropdownMenuAddon, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Dropzone, DropzoneActions, DropzoneContent, DropzoneDescription, DropzoneIcon, DropzoneTitle, DropzoneTrigger, EmojiPicker, EmojiPickerCategories, EmojiPickerContent, EmojiPickerTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FAB, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Filter, FilterClearAllButton, FilterGroup, Gauge, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Label, List, ListCol, ListRow, NotificationQueueProvider, NotificationSlot, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, RadioGroup, RadioGroupItem, ScrollArea, ScrollAreaPrimitive, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Stepper, StepperContent, StepperCounter, StepperPanel, StepperProgress, Switch, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeProvider, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, TreeDragLine, TreeItem, TreeItemLabel, alertVariants, bannerVariants, buttonGroupVariants, buttonVariants, cn, counterBadgeVariants, fabVariants, selectTriggerVariants, spinnerVariants, toast, toggleVariants, useAudioGauge, useComboboxAnchor, useNotification, useNotificationQueue, useSidebar, useStepper, useTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActionBar, ActionBarButton, ActionBarContext, ActionBarHeight, Alert, AlertAction, AlertAction as BannerAction, AlertDescription, AlertDescription as BannerDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlertTitle as BannerTitle, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, BadgeGroup, BadgeGroupCount, Banner, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Chip, ChipRemove, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CounterBadge, CountryFlag, DataTable, DataTree, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerBackdrop, DrawerBar, DrawerClose, DrawerContent, DrawerCreateHandle, DrawerDescription, DrawerFooter, DrawerHeader, DrawerMenu, DrawerMenuCheckboxItem, DrawerMenuGroup, DrawerMenuGroupLabel, DrawerMenuItem, DrawerMenuRadioGroup, DrawerMenuRadioItem, DrawerMenuSeparator, DrawerMenuTrigger, DrawerPanel, DrawerPopup, DrawerPortal, DrawerPrimitive, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DropdownMenu, DropdownMenuAddon, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Dropzone, DropzoneActions, DropzoneContent, DropzoneDescription, DropzoneIcon, DropzoneTitle, DropzoneTrigger, DsI18nProvider, EmojiPicker, EmojiPickerCategories, EmojiPickerContent, EmojiPickerTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FAB, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Filter, FilterClearAllButton, FilterGroup, Gauge, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Label, List, ListCol, ListRow, NotificationQueueProvider, NotificationSlot, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, RadioGroup, RadioGroupItem, SUPPORTED_LANGUAGES, ScrollArea, ScrollAreaPrimitive, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Stepper, StepperContent, StepperCounter, StepperPanel, StepperProgress, Switch, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeProvider, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, TreeDragLine, TreeItem, TreeItemLabel, alertVariants, bannerVariants, buttonGroupVariants, buttonVariants, cn, counterBadgeVariants, detectInitialLanguage, fabVariants, registerI18nNamespace, selectTriggerVariants, spinnerVariants, syncDsLanguage, toast, toggleVariants, useAudioGauge, useComboboxAnchor, useDsTranslation, useNotification, useNotificationQueue, useSidebar, useStepper, useTheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aircall/ds",
-  "version": "0.13.0",
+  "version": "0.15.0",
   "type": "module",
   "private": false,
   "sideEffects": [
@@ -17,7 +17,8 @@
     "src/fonts",
     "README.md",
     "AGENTS.consumer.md",
-    "package.json"
+    "package.json",
+    "skills"
   ],
   "exports": {
     ".": {
@@ -33,6 +34,7 @@
     "@aircall/react-icons": "*",
     "@tanstack/react-table": "^8.0.0",
     "date-fns": "^4.0.0",
+    "i18next": ">=20.3.0 <24",
     "react": "^18.0.0 || ^19.0.0",
     "react-day-picker": "^9.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
@@ -80,6 +82,7 @@
     "@storybook/react-vite": "10.3.3",
     "@tailwindcss/cli": "4.1.18",
     "@tailwindcss/postcss": "4.1.18",
+    "@tanstack/intent": "0.1.1",
     "@tanstack/react-table": "8.20.6",
     "@turbo/gen": "2.4.2",
     "@types/node": "24",
@@ -89,6 +92,7 @@
     "@vitest/coverage-v8": "4.0.17",
     "chromatic": "13.3.5",
     "date-fns": "4.1.0",
+    "i18next": "23.11.5",
     "playwright": "1.57.0",
     "react": "19.2.3",
     "react-compiler-runtime": "1.0.0",
@@ -103,6 +107,14 @@
     "vitest": "4.0.17",
     "@aircall/hooks": "0.5.1"
   },
+  "keywords": [
+    "tanstack-intent"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitlab.com/aircall/shared/hydra.git",
+    "directory": "packages/ds"
+  },
   "scripts": {
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
     "build:js": "tsdown --config ./tsdown.config.ts",
@@ -116,7 +128,8 @@
     "sb:build:deploy": "pnpm run registry:build && storybook build",
     "sb:test": "vitest --project=storybook",
     "sb:build:chromatic": "storybook build --test --stats-json",
-    "chromatic": "chromatic --storybook-build-dir=./storybook-static"
+    "chromatic": "chromatic --storybook-build-dir=./storybook-static",
+    "typecheck": "tsc --noEmit -p tsconfig.typecheck.json"
   },
   "types": "./dist/index.d.ts",
   "module": "./dist/index.js",