@xsolla/xui-b2b-sidebar 0.194.0 → 0.195.0

package/web/index.d.mts

@@ -1,5 +1,56 @@
 import React, { MouseEvent, ReactNode } from 'react';
 
+/**
+ * Every user-visible string the sidebar renders on its own behalf.
+ *
+ * Labels for menu items, groups and popovers come from the consumer as props,
+ * so they are already localisable. The strings collected here are the ones the
+ * component library hard-codes internally — visible text (`chat`, `beta`) and
+ * assistive-technology text (`navigation`, `expandSidebar`, `pinItem`, …).
+ *
+ * Override them once on `SidebarProvider`:
+ *
+ * ```tsx
+ * <SidebarProvider labels={{ chat: "Chat", expandSidebar: "Ouvrir le menu" }}>
+ * ```
+ *
+ * Every override is optional — omitted keys fall back to
+ * {@link DEFAULT_SIDEBAR_LABELS}. Individual components also accept per-instance
+ * label props that take precedence over the provider value.
+ */
+interface SidebarLabels {
+    /** `aria-label` on the root `role="navigation"` landmark. */
+    navigation: string;
+    /** `aria-label` on the toggle when the sidebar is collapsed. */
+    expandSidebar: string;
+    /** `aria-label` on the toggle when the sidebar is expanded. */
+    collapseSidebar: string;
+    /** Visible text on the expanded-mode chat button. */
+    chat: string;
+    /** `aria-label` on the collapsed-mode icon-only chat button. */
+    openChat: string;
+    /** Pin-toggle tooltip when the item is not pinned. */
+    pin: string;
+    /** Pin-toggle tooltip when the item is pinned. */
+    unpin: string;
+    /** Pin-toggle `aria-label` when the item is not pinned. */
+    pinItem: string;
+    /** Pin-toggle `aria-label` when the item is pinned. */
+    unpinItem: string;
+    /** Visible text in the trailing "Beta" tag. */
+    beta: string;
+    /** Default label for the collapsed-mode pinned-shortcuts popover. */
+    pinned: string;
+}
+/** English defaults — used whenever a label is not overridden. */
+declare const DEFAULT_SIDEBAR_LABELS: SidebarLabels;
+/**
+ * Merge a partial override map over {@link DEFAULT_SIDEBAR_LABELS}. Returns the
+ * shared default object untouched when there is nothing to override, so the
+ * common case allocates nothing.
+ */
+declare const resolveSidebarLabels: (overrides?: Partial<SidebarLabels>) => SidebarLabels;
+
 type SidebarLinkClickHandler = (event?: MouseEvent<HTMLElement>) => void;
 type SidebarLinkActiveCheck = (match: unknown, location: {
     pathname: string;
@@ -27,12 +78,20 @@ interface SidebarContextValue {
     LinkComponent: React.ComponentType<SidebarLinkProps>;
     expandedId: string | null;
     onExpandedIdChange: (id: string | null) => void;
+    /** Fully-resolved label set — provider overrides merged over the defaults. */
+    labels: SidebarLabels;
 }
 interface SidebarProviderProps {
     collapsed?: boolean;
     onCollapsedChange?: (collapsed: boolean) => void;
     pathname?: string;
     linkComponent?: React.ComponentType<SidebarLinkProps>;
+    /**
+     * Translations for the strings the sidebar renders on its own behalf
+     * (chat button, collapse/expand toggle, pin controls, "Beta" tag, nav
+     * landmark). Partial — omitted keys keep their English default.
+     */
+    labels?: Partial<SidebarLabels>;
     children: ReactNode;
     testID?: string;
 }
@@ -91,6 +150,10 @@ type SidebarItemType = {
  *       </SidebarFooter>
  *     </Sidebar>
  *   </SidebarProvider>
+ *
+ * Strings the sidebar renders on its own behalf (nav landmark, chat button,
+ * collapse toggle, pin controls, "Beta" tag) are localised through the
+ * `labels` prop on `SidebarProvider`.
  */
 
 interface SidebarProps {
@@ -106,6 +169,12 @@ interface SidebarProps {
     onChatClick?: () => void;
     /** Whether the chat button shows a notification badge */
     chatBadge?: boolean;
+    /**
+     * `aria-label` for the navigation landmark. Defaults to the provider's
+     * `navigation` label; set this when a page renders more than one sidebar and
+     * each landmark needs a distinct name.
+     */
+    navigationLabel?: string;
     children: ReactNode;
     testID?: string;
 }
@@ -119,7 +188,14 @@ declare const SidebarFooter: React.FC<{
     children: ReactNode;
 }>;
 
-declare const SidebarTrigger: React.FC;
+interface SidebarTriggerProps {
+    /** `aria-label` used while collapsed. Defaults to the provider's `expandSidebar` label. */
+    expandLabel?: string;
+    /** `aria-label` used while expanded. Defaults to the provider's `collapseSidebar` label. */
+    collapseLabel?: string;
+    testID?: string;
+}
+declare const SidebarTrigger: React.FC<SidebarTriggerProps>;
 
 interface SidebarGroupProps {
     label?: string;
@@ -158,6 +234,16 @@ interface SidebarMenuItemProps {
     extra?: ReactNode;
     /** Whether this item is inside a SidebarMenuSub (parent collapsible sets nested styling) */
     isNested?: boolean;
+    /** Pin-toggle tooltip while unpinned. Defaults to the provider's `pin` label. */
+    pinLabel?: string;
+    /** Pin-toggle tooltip while pinned. Defaults to the provider's `unpin` label. */
+    unpinLabel?: string;
+    /** Pin-toggle `aria-label` while unpinned. Defaults to the provider's `pinItem` label. */
+    pinAriaLabel?: string;
+    /** Pin-toggle `aria-label` while pinned. Defaults to the provider's `unpinItem` label. */
+    unpinAriaLabel?: string;
+    /** Text inside the trailing tag when `beta` is set. Defaults to the provider's `beta` label. */
+    betaLabel?: string;
     testID?: string;
 }
 declare const SidebarMenuItem: React.FC<SidebarMenuItemProps>;
@@ -185,6 +271,8 @@ declare const SidebarMenuSub: React.FC<{
 interface SidebarChatButtonProps {
     onClick?: () => void;
     badge?: boolean;
+    /** Visible button text. Defaults to the provider's `chat` label. */
+    label?: string;
     testID?: string;
 }
 declare const SidebarChatButton: React.FC<SidebarChatButtonProps>;
@@ -197,6 +285,10 @@ interface SidebarCollapsedProps {
     onChatClick?: () => void;
     showChat?: boolean;
     chatBadge?: boolean;
+    /** `aria-label` for the icon-only chat button. Defaults to the provider's `openChat` label. */
+    chatAriaLabel?: string;
+    /** `aria-label` for the expand toggle. Defaults to the provider's `expandSidebar` label. */
+    expandLabel?: string;
     testID?: string;
 }
 declare const SidebarCollapsed: React.FC<SidebarCollapsedProps>;
@@ -234,10 +326,14 @@ declare const SidebarPinnedList: React.FC<SidebarPinnedListProps>;
  * Helper for the collapsed sidebar: returns a single `SidebarItemType` whose
  * popover lists every pinned shortcut. Spread it into `collapsedItems` at the
  * position you want the Pin button to appear. Returns `null` when no items.
+ *
+ * This is a plain function rather than a component, so it cannot read the
+ * `SidebarProvider` labels — pass `options.label` with your translated string
+ * to localise the popover title (defaults to the English "Pinned").
  */
 declare const getPinnedCollapsedItem: (items: SidebarPinnedItem[], options?: {
     label?: string;
     dataId?: string;
 }) => SidebarItemType | null;
 
-export { Sidebar, SidebarChatButton, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarPinnedItem, SidebarPinnedList, type SidebarPinnedListProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, getPinnedCollapsedItem, useSidebar };
+export { DEFAULT_SIDEBAR_LABELS, Sidebar, SidebarChatButton, type SidebarChatButtonProps, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLabels, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarPinnedItem, SidebarPinnedList, type SidebarPinnedListProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, type SidebarTriggerProps, getPinnedCollapsedItem, resolveSidebarLabels, useSidebar };

package/web/index.d.ts

@@ -1,5 +1,56 @@
 import React, { MouseEvent, ReactNode } from 'react';
 
+/**
+ * Every user-visible string the sidebar renders on its own behalf.
+ *
+ * Labels for menu items, groups and popovers come from the consumer as props,
+ * so they are already localisable. The strings collected here are the ones the
+ * component library hard-codes internally — visible text (`chat`, `beta`) and
+ * assistive-technology text (`navigation`, `expandSidebar`, `pinItem`, …).
+ *
+ * Override them once on `SidebarProvider`:
+ *
+ * ```tsx
+ * <SidebarProvider labels={{ chat: "Chat", expandSidebar: "Ouvrir le menu" }}>
+ * ```
+ *
+ * Every override is optional — omitted keys fall back to
+ * {@link DEFAULT_SIDEBAR_LABELS}. Individual components also accept per-instance
+ * label props that take precedence over the provider value.
+ */
+interface SidebarLabels {
+    /** `aria-label` on the root `role="navigation"` landmark. */
+    navigation: string;
+    /** `aria-label` on the toggle when the sidebar is collapsed. */
+    expandSidebar: string;
+    /** `aria-label` on the toggle when the sidebar is expanded. */
+    collapseSidebar: string;
+    /** Visible text on the expanded-mode chat button. */
+    chat: string;
+    /** `aria-label` on the collapsed-mode icon-only chat button. */
+    openChat: string;
+    /** Pin-toggle tooltip when the item is not pinned. */
+    pin: string;
+    /** Pin-toggle tooltip when the item is pinned. */
+    unpin: string;
+    /** Pin-toggle `aria-label` when the item is not pinned. */
+    pinItem: string;
+    /** Pin-toggle `aria-label` when the item is pinned. */
+    unpinItem: string;
+    /** Visible text in the trailing "Beta" tag. */
+    beta: string;
+    /** Default label for the collapsed-mode pinned-shortcuts popover. */
+    pinned: string;
+}
+/** English defaults — used whenever a label is not overridden. */
+declare const DEFAULT_SIDEBAR_LABELS: SidebarLabels;
+/**
+ * Merge a partial override map over {@link DEFAULT_SIDEBAR_LABELS}. Returns the
+ * shared default object untouched when there is nothing to override, so the
+ * common case allocates nothing.
+ */
+declare const resolveSidebarLabels: (overrides?: Partial<SidebarLabels>) => SidebarLabels;
+
 type SidebarLinkClickHandler = (event?: MouseEvent<HTMLElement>) => void;
 type SidebarLinkActiveCheck = (match: unknown, location: {
     pathname: string;
@@ -27,12 +78,20 @@ interface SidebarContextValue {
     LinkComponent: React.ComponentType<SidebarLinkProps>;
     expandedId: string | null;
     onExpandedIdChange: (id: string | null) => void;
+    /** Fully-resolved label set — provider overrides merged over the defaults. */
+    labels: SidebarLabels;
 }
 interface SidebarProviderProps {
     collapsed?: boolean;
     onCollapsedChange?: (collapsed: boolean) => void;
     pathname?: string;
     linkComponent?: React.ComponentType<SidebarLinkProps>;
+    /**
+     * Translations for the strings the sidebar renders on its own behalf
+     * (chat button, collapse/expand toggle, pin controls, "Beta" tag, nav
+     * landmark). Partial — omitted keys keep their English default.
+     */
+    labels?: Partial<SidebarLabels>;
     children: ReactNode;
     testID?: string;
 }
@@ -91,6 +150,10 @@ type SidebarItemType = {
  *       </SidebarFooter>
  *     </Sidebar>
  *   </SidebarProvider>
+ *
+ * Strings the sidebar renders on its own behalf (nav landmark, chat button,
+ * collapse toggle, pin controls, "Beta" tag) are localised through the
+ * `labels` prop on `SidebarProvider`.
  */
 
 interface SidebarProps {
@@ -106,6 +169,12 @@ interface SidebarProps {
     onChatClick?: () => void;
     /** Whether the chat button shows a notification badge */
     chatBadge?: boolean;
+    /**
+     * `aria-label` for the navigation landmark. Defaults to the provider's
+     * `navigation` label; set this when a page renders more than one sidebar and
+     * each landmark needs a distinct name.
+     */
+    navigationLabel?: string;
     children: ReactNode;
     testID?: string;
 }
@@ -119,7 +188,14 @@ declare const SidebarFooter: React.FC<{
     children: ReactNode;
 }>;
 
-declare const SidebarTrigger: React.FC;
+interface SidebarTriggerProps {
+    /** `aria-label` used while collapsed. Defaults to the provider's `expandSidebar` label. */
+    expandLabel?: string;
+    /** `aria-label` used while expanded. Defaults to the provider's `collapseSidebar` label. */
+    collapseLabel?: string;
+    testID?: string;
+}
+declare const SidebarTrigger: React.FC<SidebarTriggerProps>;
 
 interface SidebarGroupProps {
     label?: string;
@@ -158,6 +234,16 @@ interface SidebarMenuItemProps {
     extra?: ReactNode;
     /** Whether this item is inside a SidebarMenuSub (parent collapsible sets nested styling) */
     isNested?: boolean;
+    /** Pin-toggle tooltip while unpinned. Defaults to the provider's `pin` label. */
+    pinLabel?: string;
+    /** Pin-toggle tooltip while pinned. Defaults to the provider's `unpin` label. */
+    unpinLabel?: string;
+    /** Pin-toggle `aria-label` while unpinned. Defaults to the provider's `pinItem` label. */
+    pinAriaLabel?: string;
+    /** Pin-toggle `aria-label` while pinned. Defaults to the provider's `unpinItem` label. */
+    unpinAriaLabel?: string;
+    /** Text inside the trailing tag when `beta` is set. Defaults to the provider's `beta` label. */
+    betaLabel?: string;
     testID?: string;
 }
 declare const SidebarMenuItem: React.FC<SidebarMenuItemProps>;
@@ -185,6 +271,8 @@ declare const SidebarMenuSub: React.FC<{
 interface SidebarChatButtonProps {
     onClick?: () => void;
     badge?: boolean;
+    /** Visible button text. Defaults to the provider's `chat` label. */
+    label?: string;
     testID?: string;
 }
 declare const SidebarChatButton: React.FC<SidebarChatButtonProps>;
@@ -197,6 +285,10 @@ interface SidebarCollapsedProps {
     onChatClick?: () => void;
     showChat?: boolean;
     chatBadge?: boolean;
+    /** `aria-label` for the icon-only chat button. Defaults to the provider's `openChat` label. */
+    chatAriaLabel?: string;
+    /** `aria-label` for the expand toggle. Defaults to the provider's `expandSidebar` label. */
+    expandLabel?: string;
     testID?: string;
 }
 declare const SidebarCollapsed: React.FC<SidebarCollapsedProps>;
@@ -234,10 +326,14 @@ declare const SidebarPinnedList: React.FC<SidebarPinnedListProps>;
  * Helper for the collapsed sidebar: returns a single `SidebarItemType` whose
  * popover lists every pinned shortcut. Spread it into `collapsedItems` at the
  * position you want the Pin button to appear. Returns `null` when no items.
+ *
+ * This is a plain function rather than a component, so it cannot read the
+ * `SidebarProvider` labels — pass `options.label` with your translated string
+ * to localise the popover title (defaults to the English "Pinned").
  */
 declare const getPinnedCollapsedItem: (items: SidebarPinnedItem[], options?: {
     label?: string;
     dataId?: string;
 }) => SidebarItemType | null;
 
-export { Sidebar, SidebarChatButton, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarPinnedItem, SidebarPinnedList, type SidebarPinnedListProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, getPinnedCollapsedItem, useSidebar };
+export { DEFAULT_SIDEBAR_LABELS, Sidebar, SidebarChatButton, type SidebarChatButtonProps, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLabels, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarPinnedItem, SidebarPinnedList, type SidebarPinnedListProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, type SidebarTriggerProps, getPinnedCollapsedItem, resolveSidebarLabels, useSidebar };

package/web/index.js

@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.tsx
 var index_exports = {};
 __export(index_exports, {
+  DEFAULT_SIDEBAR_LABELS: () => DEFAULT_SIDEBAR_LABELS,
   Sidebar: () => Sidebar,
   SidebarChatButton: () => SidebarChatButton,
   SidebarCollapsed: () => SidebarCollapsed,
@@ -44,6 +45,7 @@ __export(index_exports, {
   SidebarProvider: () => SidebarProvider,
   SidebarTrigger: () => SidebarTrigger,
   getPinnedCollapsedItem: () => getPinnedCollapsedItem,
+  resolveSidebarLabels: () => resolveSidebarLabels,
   useSidebar: () => useSidebar
 });
 module.exports = __toCommonJS(index_exports);
@@ -54,6 +56,24 @@ var import_xui_core2 = require("@xsolla/xui-core");
 
 // src/SidebarContext.tsx
 var import_react = require("react");
+
+// src/labels.ts
+var DEFAULT_SIDEBAR_LABELS = {
+  navigation: "Sidebar navigation",
+  expandSidebar: "Expand sidebar",
+  collapseSidebar: "Collapse sidebar",
+  chat: "Chat",
+  openChat: "Open chat",
+  pin: "Pin",
+  unpin: "Unpin",
+  pinItem: "Pin item",
+  unpinItem: "Unpin item",
+  beta: "Beta",
+  pinned: "Pinned"
+};
+var resolveSidebarLabels = (overrides) => overrides ? { ...DEFAULT_SIDEBAR_LABELS, ...overrides } : DEFAULT_SIDEBAR_LABELS;
+
+// src/SidebarContext.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var DefaultLink = ({
   to,
@@ -87,13 +107,15 @@ var SidebarContext = (0, import_react.createContext)({
   LinkComponent: DefaultLink,
   expandedId: null,
   onExpandedIdChange: () => {
-  }
+  },
+  labels: DEFAULT_SIDEBAR_LABELS
 });
 var SidebarProvider = ({
   collapsed: collapsedProp,
   onCollapsedChange,
   pathname = "",
   linkComponent,
+  labels: labelsProp,
   children
 }) => {
   const [internalCollapsed, setInternalCollapsed] = (0, import_react.useState)(false);
@@ -109,6 +131,12 @@ var SidebarProvider = ({
   const onExpandedIdChange = (0, import_react.useCallback)((id) => {
     setExpandedId(id);
   }, []);
+  const labelsKey = labelsProp ? JSON.stringify(labelsProp) : "";
+  const labels = (0, import_react.useMemo)(
+    () => resolveSidebarLabels(labelsProp),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [labelsKey]
+  );
   const value = (0, import_react.useMemo)(
     () => ({
       collapsed,
@@ -116,7 +144,8 @@ var SidebarProvider = ({
       pathname,
       LinkComponent: linkComponent || DefaultLink,
       expandedId,
-      onExpandedIdChange
+      onExpandedIdChange,
+      labels
     }),
     [
       collapsed,
@@ -124,7 +153,8 @@ var SidebarProvider = ({
       pathname,
       linkComponent,
       expandedId,
-      onExpandedIdChange
+      onExpandedIdChange,
+      labels
     ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SidebarContext.Provider, { value, children });
@@ -740,9 +770,11 @@ var SidebarCollapsed = ({
   onToggleCollapse,
   onChatClick,
   showChat = true,
-  chatBadge = false
+  chatBadge = false,
+  chatAriaLabel,
+  expandLabel
 }) => {
-  const { pathname } = useSidebar();
+  const { pathname, labels } = useSidebar();
   const { theme } = (0, import_xui_core.useResolvedTheme)();
   const sizing = theme.sizing.sidebar();
   const colors = theme.colors;
@@ -829,7 +861,7 @@ var SidebarCollapsed = ({
             {
               onClick: onChatClick,
               type: "button",
-              "aria-label": "Open chat",
+              "aria-label": chatAriaLabel ?? labels.openChat,
               $size: sizing.itemHeight,
               $radius: sizing.radius,
               $bg: colors.control.brand.primary.bg,
@@ -854,7 +886,7 @@ var SidebarCollapsed = ({
             {
               onClick: onToggleCollapse,
               type: "button",
-              "aria-label": "Expand sidebar",
+              "aria-label": expandLabel ?? labels.expandSidebar,
               "aria-pressed": true,
               $size: sizing.itemHeight,
               $radius: sizing.radius,
@@ -940,16 +972,17 @@ var Sidebar = ({
   showChat = true,
   onChatClick,
   chatBadge = false,
+  navigationLabel,
   children
 }) => {
-  const { collapsed, onCollapsedChange } = useSidebar();
+  const { collapsed, onCollapsedChange, labels } = useSidebar();
   const { theme } = (0, import_xui_core2.useResolvedTheme)();
   const sizing = theme.sizing.sidebar();
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     Outer2,
     {
       role: "navigation",
-      "aria-label": "Sidebar navigation",
+      "aria-label": navigationLabel ?? labels.navigation,
       $expanded: sizing.widthExpanded,
       $collapsed: sizing.widthCollapsed,
       $width: collapsed ? sizing.widthCollapsed : sizing.widthExpanded,
@@ -1345,8 +1378,11 @@ var ToggleButton = import_styled_components5.default.button`
     height: ${(p) => p.$iconSize}px;
   }
 `;
-var SidebarTrigger = () => {
-  const { collapsed, onCollapsedChange } = useSidebar();
+var SidebarTrigger = ({
+  expandLabel,
+  collapseLabel
+}) => {
+  const { collapsed, onCollapsedChange, labels } = useSidebar();
   const { theme } = (0, import_xui_core5.useResolvedTheme)();
   const sizing = theme.sizing.sidebar();
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -1354,7 +1390,7 @@ var SidebarTrigger = () => {
     {
       type: "button",
       onClick: () => onCollapsedChange(!collapsed),
-      "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
+      "aria-label": collapsed ? expandLabel ?? labels.expandSidebar : collapseLabel ?? labels.collapseSidebar,
       "aria-pressed": collapsed,
       $size: sizing.itemHeight,
       $radius: sizing.radius,
@@ -1609,13 +1645,20 @@ var SidebarMenuItem = ({
   beta,
   multiLine,
   extra,
-  isNested = false
+  isNested = false,
+  pinLabel,
+  unpinLabel,
+  pinAriaLabel,
+  unpinAriaLabel,
+  betaLabel
 }) => {
-  const { LinkComponent } = useSidebar();
+  const { LinkComponent, labels } = useSidebar();
   const { theme } = (0, import_xui_core7.useResolvedTheme)();
   const sizing = theme.sizing.sidebar();
   const shouldTruncate = Boolean(hasTooltip) && typeof label === "string" && label.length > TOOLTIP_TRUNCATE_LENGTH;
   const displayLabel = shouldTruncate ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_tooltip.Tooltip, { content: label, placement: "right", size: "md", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: `${label.slice(0, TOOLTIP_TRUNCATE_LENGTH)}\u2026` }) }) : label;
+  const pinTooltip = isPinned ? unpinLabel ?? labels.unpin : pinLabel ?? labels.pin;
+  const pinAria = isPinned ? unpinAriaLabel ?? labels.unpinItem : pinAriaLabel ?? labels.pinItem;
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     ItemWrapper,
     {
@@ -1667,40 +1710,32 @@ var SidebarMenuItem = ({
                 }
               )
             ] }),
-            onPinToggle && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-              import_xui_tooltip.Tooltip,
+            onPinToggle && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_tooltip.Tooltip, { content: pinTooltip, placement: "top", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+              PinButton,
               {
-                content: isPinned ? "Unpin" : "Pin",
-                placement: "top",
-                size: "sm",
-                children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-                  PinButton,
-                  {
-                    type: "button",
-                    "aria-label": isPinned ? "Unpin item" : "Pin item",
-                    "aria-pressed": Boolean(isPinned),
-                    $size: sizing.iconSize,
-                    $color: theme.colors.content.tertiary,
-                    $hoverColor: theme.colors.content.primary,
-                    $activeColor: theme.colors.content.primary,
-                    $isPinned: Boolean(isPinned),
-                    onClick: (e) => {
-                      e.preventDefault();
-                      e.stopPropagation();
-                      onPinToggle(e);
-                    },
-                    children: isPinned ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_icons_base2.Remove, { size: 12, variant: "line" }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_icons_base2.Pin, { size: 12, variant: "solid" })
-                  }
-                )
+                type: "button",
+                "aria-label": pinAria,
+                "aria-pressed": Boolean(isPinned),
+                $size: sizing.iconSize,
+                $color: theme.colors.content.tertiary,
+                $hoverColor: theme.colors.content.primary,
+                $activeColor: theme.colors.content.primary,
+                $isPinned: Boolean(isPinned),
+                onClick: (e) => {
+                  e.preventDefault();
+                  e.stopPropagation();
+                  onPinToggle(e);
+                },
+                children: isPinned ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_icons_base2.Remove, { size: 12, variant: "line" }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_xui_icons_base2.Pin, { size: 12, variant: "solid" })
               }
-            ),
+            ) }),
             beta && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
               BetaTag,
               {
                 $bg: theme.colors.overlay.mono,
                 $color: theme.colors.content.tertiary,
                 $radius: sizing.radius,
-                children: "Beta"
+                children: betaLabel ?? labels.beta
               }
             ),
             external && hasExternalIcon && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
@@ -1976,9 +2011,11 @@ var Badge = import_styled_components8.default.span`
 `;
 var SidebarChatButton = ({
   onClick,
-  badge
+  badge,
+  label
 }) => {
   const { theme } = (0, import_xui_core9.useResolvedTheme)();
+  const { labels } = useSidebar();
   const sizing = theme.sizing.sidebar();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     ChatButton,
@@ -1995,7 +2032,7 @@ var SidebarChatButton = ({
       $focusOutlineWidth: sizing.focusOutlineWidth,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_xui_icons_base4.ChatTwoMessages, { size: 16, variant: "line" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_xui_typography5.Typography, { variant: "bodySmAccent", color: "inherit", children: "Chat" }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_xui_typography5.Typography, { variant: "bodySmAccent", color: "inherit", children: label ?? labels.chat }),
         badge && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           Badge,
           {
@@ -2083,7 +2120,7 @@ var SidebarPinnedList = ({
 var getPinnedCollapsedItem = (items, options = {}) => {
   if (items.length === 0) return null;
   return {
-    label: options.label ?? "Pinned",
+    label: options.label ?? DEFAULT_SIDEBAR_LABELS.pinned,
     icon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_xui_icons_base5.Pin, { size: 18, variant: "solid" }),
     dataId: options.dataId ?? "sidebar-collapsed-pinned",
     children: items.map((i) => ({
@@ -2095,6 +2132,7 @@ var getPinnedCollapsedItem = (items, options = {}) => {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  DEFAULT_SIDEBAR_LABELS,
   Sidebar,
   SidebarChatButton,
   SidebarCollapsed,
@@ -2109,6 +2147,7 @@ var getPinnedCollapsedItem = (items, options = {}) => {
   SidebarProvider,
   SidebarTrigger,
   getPinnedCollapsedItem,
+  resolveSidebarLabels,
   useSidebar
 });
 //# sourceMappingURL=index.js.map