@cube-dev/ui-kit 0.145.4 → 0.146.1

package/dist/components/actions/Menu/Menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _CollectionItem } from "../../CollectionItem.js";

package/dist/components/actions/Menu/MenuItem.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { filterCollectionItemProps } from "../../CollectionItem.js";
 import { _Item } from "../../content/Item/Item.js";

package/dist/components/actions/Menu/MenuSection.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { MenuItem } from "./MenuItem.js";
 import { StyledMenu, StyledSection, StyledSectionHeading } from "./styled.js";

package/dist/components/actions/Menu/MenuTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { SlotProvider } from "../../../utils/react/Slots.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/actions/Menu/SubMenuTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { MenuContext, useMenuContext } from "./context.js";

package/dist/components/actions/Menu/SubmenuTriggerContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import React from "react";
 
 //#region src/components/actions/Menu/SubmenuTriggerContext.tsx

package/dist/components/actions/Menu/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import React, { useContext } from "react";
 
 //#region src/components/actions/Menu/context.ts

package/dist/components/actions/Menu/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { DEFAULT_CLEAR_STYLES } from "../../../data/item-themes.js";
 import { Space } from "../../layout/Space.js";
 import { DEFAULT_BUTTON_STYLES } from "../Button/Button.js";

package/dist/components/actions/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { ItemActionProvider, useItemActionContext } from "./ItemActionContext.js";
 import { openLink, parseTo, performClickHandler, useAction } from "./use-action.js";
 import { ItemAction } from "./ItemAction/ItemAction.js";

package/dist/components/actions/use-action.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";
 import { useFocus as useFocus$1 } from "../../utils/react/interactions.js";

package/dist/components/actions/use-anchored-menu.js

@@ -1,7 +1,8 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { usePopoverSync } from "../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";
+import { useI18n } from "../../i18n/useI18n.js";
 import { generateRandomId } from "../../utils/random.js";
 import { _MenuTrigger } from "./Menu/MenuTrigger.js";
 import { useEffect, useMemo, useRef, useState } from "react";
@@ -19,6 +20,7 @@ import { Pressable } from "@react-aria/interactions";
 * @returns An object with `anchorRef` to position the menu, `open` function to open the menu with provided props, `close` function to close the menu, and `rendered` JSX element to include in your component tree.
 */
 function useAnchoredMenu(Component, defaultTriggerProps, defaultMenuProps) {
+	const { t } = useI18n();
 	const [isOpen, setIsOpen] = useState(false);
 	const [componentProps, setComponentProps] = useState(null);
 	const [triggerProps, setTriggerProps] = useState(null);
@@ -74,13 +76,14 @@ function useAnchoredMenu(Component, defaultTriggerProps, defaultMenuProps) {
 			targetRef: anchorRef,
 			popoverRef,
 			onOpenChange: setIsOpen,
-			children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx("button", { "aria-label": "context-menu" }) }) }), /* @__PURE__ */ jsx(Component, { ...componentProps })]
+			children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx("button", { "aria-label": t("contextMenu.contextMenu", "context-menu") }) }) }), /* @__PURE__ */ jsx(Component, { ...componentProps })]
 		});
 	}, [
 		componentProps,
 		triggerProps,
 		isOpen,
-		defaultTriggerProps
+		defaultTriggerProps,
+		t
 	]);
 	return {
 		anchorRef,

package/dist/components/actions/use-anchored-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-anchored-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-anchored-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\n\nimport { useEvent } from '../../_internal';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\nexport interface UseAnchoredMenuReturn<P, T> {\n  /** Ref to attach to the anchor element for positioning the menu. */\n  anchorRef: RefObject<HTMLElement | null>;\n\n  /**\n   * Programmatically opens the menu with the provided props.\n   * @param props - Props to pass to the menu component\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   */\n  open(props?: P, triggerProps?: T): void;\n\n  /**\n   * Updates the props of the currently open menu.\n   * Props are merged if defaults are provided.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage an anchored menu component.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `anchorRef` to position the menu, `open` function to open the menu with provided props, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useAnchoredMenu<P, T = ComponentProps<typeof MenuTrigger>>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseAnchoredMenuReturn<P, T> {\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const anchorRef = useRef<HTMLElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  useEffect(() => {\n    const el = anchorRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the anchor (`triggerRef`) and the popover container\n  // (`containerRef`) into the sync. The container ref is shared with the\n  // rendered `MenuTrigger` via its `popoverRef` prop — the dummy `MenuTrigger`\n  // opts out of `usePopoverSync` (`enabled: !isDummy`), so without this the\n  // nested-popover guard would have no container to match against and a\n  // `SubMenuTrigger` opened inside this menu would close the whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => setIsOpen(false),\n    triggerRef: anchorRef,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useAnchoredMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  // 'open' accepts props required by the Component and opens the menu\n  const open = useEvent((props: P = {} as P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps);\n    setTriggerProps(triggerProps ?? null);\n    setIsOpen(true);\n  });\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n  });\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps) return null;\n\n    return (\n      <MenuTrigger\n        placement=\"bottom start\"\n        {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n        isDummy\n        isOpen={isOpen}\n        targetRef={anchorRef}\n        popoverRef={popoverRef}\n        onOpenChange={setIsOpen}\n      >\n        <VisuallyHidden>\n          <Pressable>\n            <button aria-label=\"context-menu\" />\n          </Pressable>\n        </VisuallyHidden>\n        <Component {...componentProps} />\n      </MenuTrigger>\n    );\n  }, [componentProps, triggerProps, isOpen, defaultTriggerProps]);\n\n  return {\n    anchorRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA0DA,SAAgB,gBACd,WACA,qBAIA,kBAC6B;CAC7B,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAC3C,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB,KAAK;CACpE,MAAM,CAAC,cAAc,mBAAmB,SAAmB,KAAK;CAChE,MAAM,YAAY,OAAoB,KAAK;CAC3C,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,WAAW,OAAO,MAAM;AAE9B,iBAAgB;EACd,MAAM,KAAK,UAAU;AACrB,MAAI,IAAI;AACN,MAAG,QAAQ,iBAAiB;AAC5B,gBAAa;AACX,WAAO,GAAG,QAAQ;;;IAGrB,EAAE,CAAC;AAWN,gBAAe;EACb,QATa,cAAc,kBAAkB,EAAE,EAAE,CAAC;EAUlD;EACA,eAAe,UAAU,MAAM;EAC/B,YAAY;EACZ,cAAc;EACf,CAAC;CAEF,SAAS,aAAa;AACpB,MAAI,CAAC,SAAS,QACZ,OAAM,IAAI,MACR,+GACD;;CAKL,MAAM,OAAO,UAAU,QAAW,EAAE,EAAO,iBAAqB;AAC9D,cAAY;AAOZ,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAEyB;AAC7B,kBAAgB,gBAAgB,KAAK;AACrC,YAAU,KAAK;GACf;CAEF,MAAM,SAAS,UAAU,OAAU,iBAAqB;AACtD,cAAY;AAOZ,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAEyB;AAC7B,kBAAgB,gBAAgB,KAAK;GACrC;CAEF,MAAM,QAAQ,eAAe;AAC3B,YAAU,MAAM;GAChB;CAGF,MAAM,eAAe,cAAc;AACjC,MAAI,CAAC,eAAgB,QAAO;AAE5B,SACE,qBAACA;GACC,WAAU;GACV,GAAIC,aAAW,qBAAqB,gBAAgB,OAAU;GAC9D;GACQ;GACR,WAAW;GACC;GACZ,cAAc;cAEd,oBAAC,4BACC,oBAAC,uBACC,oBAAC,YAAO,cAAW,iBAAiB,GAC1B,GACG,EACjB,oBAAC,aAAU,GAAI,iBAAkB;IACrB;IAEf;EAAC;EAAgB;EAAc;EAAQ;EAAoB,CAAC;AAE/D,QAAO;EACL;EACA;EACA;EACA;EACA;EACA,IAAI,WAAW;AACb,YAAS,UAAU;AAEnB,UAAO;;EAEV"}
+{"version":3,"file":"use-anchored-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-anchored-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\n\nimport { useEvent } from '../../_internal';\nimport { useI18n } from '../../i18n';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\nexport interface UseAnchoredMenuReturn<P, T> {\n  /** Ref to attach to the anchor element for positioning the menu. */\n  anchorRef: RefObject<HTMLElement | null>;\n\n  /**\n   * Programmatically opens the menu with the provided props.\n   * @param props - Props to pass to the menu component\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   */\n  open(props?: P, triggerProps?: T): void;\n\n  /**\n   * Updates the props of the currently open menu.\n   * Props are merged if defaults are provided.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage an anchored menu component.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `anchorRef` to position the menu, `open` function to open the menu with provided props, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useAnchoredMenu<P, T = ComponentProps<typeof MenuTrigger>>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseAnchoredMenuReturn<P, T> {\n  const { t } = useI18n();\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const anchorRef = useRef<HTMLElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  useEffect(() => {\n    const el = anchorRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the anchor (`triggerRef`) and the popover container\n  // (`containerRef`) into the sync. The container ref is shared with the\n  // rendered `MenuTrigger` via its `popoverRef` prop — the dummy `MenuTrigger`\n  // opts out of `usePopoverSync` (`enabled: !isDummy`), so without this the\n  // nested-popover guard would have no container to match against and a\n  // `SubMenuTrigger` opened inside this menu would close the whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => setIsOpen(false),\n    triggerRef: anchorRef,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useAnchoredMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  // 'open' accepts props required by the Component and opens the menu\n  const open = useEvent((props: P = {} as P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps);\n    setTriggerProps(triggerProps ?? null);\n    setIsOpen(true);\n  });\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n  });\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps) return null;\n\n    return (\n      <MenuTrigger\n        placement=\"bottom start\"\n        {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n        isDummy\n        isOpen={isOpen}\n        targetRef={anchorRef}\n        popoverRef={popoverRef}\n        onOpenChange={setIsOpen}\n      >\n        <VisuallyHidden>\n          <Pressable>\n            <button aria-label={t('contextMenu.contextMenu', 'context-menu')} />\n          </Pressable>\n        </VisuallyHidden>\n        <Component {...componentProps} />\n      </MenuTrigger>\n    );\n  }, [componentProps, triggerProps, isOpen, defaultTriggerProps, t]);\n\n  return {\n    anchorRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA2DA,SAAgB,gBACd,WACA,qBAIA,kBAC6B;CAC7B,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAC3C,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB,KAAK;CACpE,MAAM,CAAC,cAAc,mBAAmB,SAAmB,KAAK;CAChE,MAAM,YAAY,OAAoB,KAAK;CAC3C,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,WAAW,OAAO,MAAM;AAE9B,iBAAgB;EACd,MAAM,KAAK,UAAU;AACrB,MAAI,IAAI;AACN,MAAG,QAAQ,iBAAiB;AAC5B,gBAAa;AACX,WAAO,GAAG,QAAQ;;;IAGrB,EAAE,CAAC;AAWN,gBAAe;EACb,QATa,cAAc,kBAAkB,EAAE,EAAE,CAAC;EAUlD;EACA,eAAe,UAAU,MAAM;EAC/B,YAAY;EACZ,cAAc;EACf,CAAC;CAEF,SAAS,aAAa;AACpB,MAAI,CAAC,SAAS,QACZ,OAAM,IAAI,MACR,+GACD;;CAKL,MAAM,OAAO,UAAU,QAAW,EAAE,EAAO,iBAAqB;AAC9D,cAAY;AAOZ,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAEyB;AAC7B,kBAAgB,gBAAgB,KAAK;AACrC,YAAU,KAAK;GACf;CAEF,MAAM,SAAS,UAAU,OAAU,iBAAqB;AACtD,cAAY;AAOZ,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAEyB;AAC7B,kBAAgB,gBAAgB,KAAK;GACrC;CAEF,MAAM,QAAQ,eAAe;AAC3B,YAAU,MAAM;GAChB;CAGF,MAAM,eAAe,cAAc;AACjC,MAAI,CAAC,eAAgB,QAAO;AAE5B,SACE,qBAACA;GACC,WAAU;GACV,GAAIC,aAAW,qBAAqB,gBAAgB,OAAU;GAC9D;GACQ;GACR,WAAW;GACC;GACZ,cAAc;cAEd,oBAAC,4BACC,oBAAC,uBACC,oBAAC,YAAO,cAAY,EAAE,2BAA2B,eAAe,GAAI,GAC1D,GACG,EACjB,oBAAC,aAAU,GAAI,iBAAkB;IACrB;IAEf;EAAC;EAAgB;EAAc;EAAQ;EAAqB;EAAE,CAAC;AAElE,QAAO;EACL;EACA;EACA;EACA;EACA;EACA,IAAI,WAAW;AACb,YAAS,UAAU;AAEnB,UAAO;;EAEV"}

package/dist/components/actions/use-context-menu.js

@@ -1,7 +1,8 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { usePopoverSync } from "../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";
+import { useI18n } from "../../i18n/useI18n.js";
 import { generateRandomId } from "../../utils/random.js";
 import { _MenuTrigger } from "./Menu/MenuTrigger.js";
 import { useEffect, useMemo, useRef, useState } from "react";
@@ -19,6 +20,7 @@ import { Pressable } from "@react-aria/interactions";
 * @returns An object with `targetRef` to attach to the container element, `open` function to open the menu at event coordinates, `close` function to close the menu, and `rendered` JSX element to include in your component tree.
 */
 function useContextMenu(Component, defaultTriggerProps, defaultMenuProps) {
+	const { t } = useI18n();
 	const [isOpen, setIsOpen] = useState(false);
 	const [componentProps, setComponentProps] = useState(null);
 	const [triggerProps, setTriggerProps] = useState(null);
@@ -157,14 +159,15 @@ function useContextMenu(Component, defaultTriggerProps, defaultMenuProps) {
 			targetRef: invisibleAnchorRef,
 			popoverRef,
 			onOpenChange: setIsOpen,
-			children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx("button", { "aria-label": "Open context menu" }) }) }), /* @__PURE__ */ jsx(Component, { ...componentProps })]
+			children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx("button", { "aria-label": t("contextMenu.openContextMenu", "Open context menu") }) }) }), /* @__PURE__ */ jsx(Component, { ...componentProps })]
 		})] });
 	}, [
 		componentProps,
 		triggerProps,
 		isOpen,
 		defaultTriggerProps,
-		anchorPosition
+		anchorPosition,
+		t
 	]);
 	return {
 		targetRef,

package/dist/components/actions/use-context-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-context-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-context-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  MouseEvent,\n  PointerEvent,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\n\nimport { useEvent } from '../../_internal';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\ntype NativeMouseEvent = globalThis.MouseEvent;\ntype NativePointerEvent = globalThis.PointerEvent;\n\nexport interface UseContextMenuReturn<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n> {\n  /** Container element that receives context menu events. Attach this ref to your target element. */\n  targetRef: RefObject<E | null>;\n\n  /**\n   * Programmatically opens the menu at the specified coordinates or element center.\n   * Runtime props are merged with defaultMenuProps (runtime props take precedence).\n   *\n   * @param props - Props to pass to the menu component (optional, defaults to defaultMenuProps)\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   * @param event - The pointer/mouse event containing coordinates for positioning (optional, centers on element if not provided)\n   */\n  open(\n    props?: P,\n    triggerProps?: T,\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ): void;\n\n  /**\n   * Updates the props of the currently open menu without repositioning.\n   * Props are merged with defaultMenuProps.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   * IMPORTANT: Must be placed directly inside the target container (the element with targetRef).\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage a context menu component that opens at pointer coordinates.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `targetRef` to attach to the container element, `open` function to open the menu at event coordinates, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useContextMenu<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseContextMenuReturn<E, P, T> {\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const [anchorPosition, setAnchorPosition] = useState<{\n    x: number;\n    y: number;\n  } | null>(null);\n  const targetRef = useRef<E>(null);\n  const invisibleAnchorRef = useRef<HTMLSpanElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  // Mark the container as a popover trigger so that other open menus' close-on-\n  // outside predicates treat clicks inside it (including programmatic\n  // open buttons rendered alongside a context-menu target) as a legitimate\n  // trigger interaction instead of a generic outside click. This mirrors the\n  // pattern in `useAnchoredMenu`.\n  useEffect(() => {\n    const el = targetRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the context-menu target (`triggerRef`) and the popover\n  // container (`containerRef`) into the sync. The container ref is shared with\n  // the rendered `MenuTrigger` via its `popoverRef` prop — the dummy\n  // `MenuTrigger` opts out of `usePopoverSync` (`enabled: !isDummy`), so\n  // without this the nested-popover guard would have no container to match\n  // against and a `SubMenuTrigger` opened inside this menu would close the\n  // whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => {\n      setIsOpen(false);\n      setAnchorPosition(null);\n    },\n    triggerRef: targetRef as RefObject<HTMLElement | null>,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useContextMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  // Helper function to calculate position relative to targetRef, taking the\n  // element's scroll offset into account. Without the scroll offset the menu\n  // would be rendered at the wrong place inside scrollable containers.\n  const calculatePosition = (\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ) => {\n    const container = targetRef.current;\n\n    // If no event is provided, position at the center of the element\n    if (!event) {\n      if (!container) {\n        return { x: 0, y: 0 };\n      }\n\n      const containerRect = container.getBoundingClientRect();\n      const scrollLeft = container.scrollLeft;\n      const scrollTop = container.scrollTop;\n\n      const computed = window.getComputedStyle(container);\n      const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n      const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n      // Position at the center of the element's content area\n      const x = container.clientWidth / 2 + scrollLeft;\n      const y = container.clientHeight / 2 + scrollTop;\n\n      // Clamp to the full scroll size\n      const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n      const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n      return { x: clampedX, y: clampedY };\n    }\n\n    // If the target reference is missing, fall back to viewport coordinates.\n    if (!container) {\n      const { clientX = 0, clientY = 0 } = event;\n\n      return { x: clientX, y: clientY };\n    }\n\n    const containerRect = container.getBoundingClientRect();\n\n    // Get coordinates from the event (viewport-relative)\n    const { clientX, clientY } = event;\n\n    // Take the element's scroll offset into account so that the coordinates are\n    // relative to the **content** box, not the visible viewport of the\n    // element.\n    const scrollLeft = container.scrollLeft;\n    const scrollTop = container.scrollTop;\n\n    const computed = window.getComputedStyle(container);\n    const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n    const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n    const x = clientX - containerRect.left - borderLeft + scrollLeft;\n    const y = clientY - containerRect.top - borderTop + scrollTop;\n\n    // Clamp to the full scroll size so that the invisible anchor always stays\n    // inside the element regardless of the scroll position.\n    const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n    const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n    return { x: clampedX, y: clampedY };\n  };\n\n  // 'open' accepts props, trigger props, and optional event for positioning, then opens the menu\n  const open = useEvent(\n    (\n      props: P = {} as P,\n      triggerProps?: T,\n      event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n    ) => {\n      setupCheck();\n\n      // Ensure the target element can serve as a positioning context for the\n      // invisible target element. If the consumer hasn't explicitly set\n      // `position: relative | absolute | fixed | sticky` we switch it to\n      // `relative` so that absolutely-positioned children are laid out correctly.\n      if (targetRef.current) {\n        const computedStyle = window.getComputedStyle(targetRef.current);\n\n        if (computedStyle.position === 'static') {\n          targetRef.current.style.position = 'relative';\n        }\n      }\n\n      // Prevent default context menu if it's a context menu event\n      if (\n        event &&\n        'preventDefault' in event &&\n        typeof event.preventDefault === 'function'\n      ) {\n        event.preventDefault();\n      }\n\n      const { x, y } = calculatePosition(event);\n      setAnchorPosition({ x, y });\n\n      // Merge defaultMenuProps with provided props\n      const finalProps = defaultMenuProps\n        ? { ...defaultMenuProps, ...props }\n        : props;\n\n      setComponentProps(finalProps);\n      setTriggerProps(triggerProps ?? null);\n      setIsOpen(true);\n    },\n  );\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps as P);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n    setAnchorPosition(null);\n  });\n\n  // Context menu event handler\n  const onContextMenu = useEvent(\n    (event: MouseEvent | PointerEvent | MouseEvent | PointerEvent) => {\n      event.preventDefault();\n      if (isOpen) {\n        const pos = calculatePosition(event);\n        setAnchorPosition(pos);\n      } else {\n        open(defaultMenuProps, undefined, event);\n      }\n    },\n  );\n\n  // Bind the onContextMenu event to targetRef\n  useEffect(() => {\n    const element = targetRef.current;\n    if (!element) return;\n\n    element.addEventListener('contextmenu', onContextMenu as any);\n\n    return () => {\n      element.removeEventListener('contextmenu', onContextMenu as any);\n    };\n  }, [onContextMenu]);\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps || !anchorPosition) return null;\n\n    return (\n      <>\n        {/* Invisible anchor element positioned at click coordinates */}\n        <span\n          ref={invisibleAnchorRef}\n          style={{\n            position: 'absolute',\n            left: `${anchorPosition.x}px`,\n            top: `${anchorPosition.y}px`,\n            width: '0px',\n            height: '0px',\n            lineHeight: '0',\n            pointerEvents: 'none',\n            visibility: 'hidden',\n          }}\n        />\n        <MenuTrigger\n          offset={0}\n          crossOffset={0}\n          placement={\n            (triggerProps as ComponentProps<typeof MenuTrigger>)?.placement ||\n            defaultTriggerProps?.placement ||\n            'bottom start'\n          }\n          {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n          isDummy\n          isOpen={isOpen}\n          targetRef={invisibleAnchorRef}\n          popoverRef={popoverRef}\n          onOpenChange={setIsOpen}\n        >\n          <VisuallyHidden>\n            <Pressable>\n              <button aria-label=\"Open context menu\" />\n            </Pressable>\n          </VisuallyHidden>\n          <Component {...componentProps} />\n        </MenuTrigger>\n      </>\n    );\n  }, [\n    componentProps,\n    triggerProps,\n    isOpen,\n    defaultTriggerProps,\n    anchorPosition,\n  ]);\n\n  return {\n    targetRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-context-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-context-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  MouseEvent,\n  PointerEvent,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\n\nimport { useEvent } from '../../_internal';\nimport { useI18n } from '../../i18n';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\ntype NativeMouseEvent = globalThis.MouseEvent;\ntype NativePointerEvent = globalThis.PointerEvent;\n\nexport interface UseContextMenuReturn<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n> {\n  /** Container element that receives context menu events. Attach this ref to your target element. */\n  targetRef: RefObject<E | null>;\n\n  /**\n   * Programmatically opens the menu at the specified coordinates or element center.\n   * Runtime props are merged with defaultMenuProps (runtime props take precedence).\n   *\n   * @param props - Props to pass to the menu component (optional, defaults to defaultMenuProps)\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   * @param event - The pointer/mouse event containing coordinates for positioning (optional, centers on element if not provided)\n   */\n  open(\n    props?: P,\n    triggerProps?: T,\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ): void;\n\n  /**\n   * Updates the props of the currently open menu without repositioning.\n   * Props are merged with defaultMenuProps.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   * IMPORTANT: Must be placed directly inside the target container (the element with targetRef).\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage a context menu component that opens at pointer coordinates.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `targetRef` to attach to the container element, `open` function to open the menu at event coordinates, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useContextMenu<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseContextMenuReturn<E, P, T> {\n  const { t } = useI18n();\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const [anchorPosition, setAnchorPosition] = useState<{\n    x: number;\n    y: number;\n  } | null>(null);\n  const targetRef = useRef<E>(null);\n  const invisibleAnchorRef = useRef<HTMLSpanElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  // Mark the container as a popover trigger so that other open menus' close-on-\n  // outside predicates treat clicks inside it (including programmatic\n  // open buttons rendered alongside a context-menu target) as a legitimate\n  // trigger interaction instead of a generic outside click. This mirrors the\n  // pattern in `useAnchoredMenu`.\n  useEffect(() => {\n    const el = targetRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the context-menu target (`triggerRef`) and the popover\n  // container (`containerRef`) into the sync. The container ref is shared with\n  // the rendered `MenuTrigger` via its `popoverRef` prop — the dummy\n  // `MenuTrigger` opts out of `usePopoverSync` (`enabled: !isDummy`), so\n  // without this the nested-popover guard would have no container to match\n  // against and a `SubMenuTrigger` opened inside this menu would close the\n  // whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => {\n      setIsOpen(false);\n      setAnchorPosition(null);\n    },\n    triggerRef: targetRef as RefObject<HTMLElement | null>,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useContextMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  // Helper function to calculate position relative to targetRef, taking the\n  // element's scroll offset into account. Without the scroll offset the menu\n  // would be rendered at the wrong place inside scrollable containers.\n  const calculatePosition = (\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ) => {\n    const container = targetRef.current;\n\n    // If no event is provided, position at the center of the element\n    if (!event) {\n      if (!container) {\n        return { x: 0, y: 0 };\n      }\n\n      const containerRect = container.getBoundingClientRect();\n      const scrollLeft = container.scrollLeft;\n      const scrollTop = container.scrollTop;\n\n      const computed = window.getComputedStyle(container);\n      const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n      const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n      // Position at the center of the element's content area\n      const x = container.clientWidth / 2 + scrollLeft;\n      const y = container.clientHeight / 2 + scrollTop;\n\n      // Clamp to the full scroll size\n      const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n      const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n      return { x: clampedX, y: clampedY };\n    }\n\n    // If the target reference is missing, fall back to viewport coordinates.\n    if (!container) {\n      const { clientX = 0, clientY = 0 } = event;\n\n      return { x: clientX, y: clientY };\n    }\n\n    const containerRect = container.getBoundingClientRect();\n\n    // Get coordinates from the event (viewport-relative)\n    const { clientX, clientY } = event;\n\n    // Take the element's scroll offset into account so that the coordinates are\n    // relative to the **content** box, not the visible viewport of the\n    // element.\n    const scrollLeft = container.scrollLeft;\n    const scrollTop = container.scrollTop;\n\n    const computed = window.getComputedStyle(container);\n    const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n    const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n    const x = clientX - containerRect.left - borderLeft + scrollLeft;\n    const y = clientY - containerRect.top - borderTop + scrollTop;\n\n    // Clamp to the full scroll size so that the invisible anchor always stays\n    // inside the element regardless of the scroll position.\n    const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n    const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n    return { x: clampedX, y: clampedY };\n  };\n\n  // 'open' accepts props, trigger props, and optional event for positioning, then opens the menu\n  const open = useEvent(\n    (\n      props: P = {} as P,\n      triggerProps?: T,\n      event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n    ) => {\n      setupCheck();\n\n      // Ensure the target element can serve as a positioning context for the\n      // invisible target element. If the consumer hasn't explicitly set\n      // `position: relative | absolute | fixed | sticky` we switch it to\n      // `relative` so that absolutely-positioned children are laid out correctly.\n      if (targetRef.current) {\n        const computedStyle = window.getComputedStyle(targetRef.current);\n\n        if (computedStyle.position === 'static') {\n          targetRef.current.style.position = 'relative';\n        }\n      }\n\n      // Prevent default context menu if it's a context menu event\n      if (\n        event &&\n        'preventDefault' in event &&\n        typeof event.preventDefault === 'function'\n      ) {\n        event.preventDefault();\n      }\n\n      const { x, y } = calculatePosition(event);\n      setAnchorPosition({ x, y });\n\n      // Merge defaultMenuProps with provided props\n      const finalProps = defaultMenuProps\n        ? { ...defaultMenuProps, ...props }\n        : props;\n\n      setComponentProps(finalProps);\n      setTriggerProps(triggerProps ?? null);\n      setIsOpen(true);\n    },\n  );\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps as P);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n    setAnchorPosition(null);\n  });\n\n  // Context menu event handler\n  const onContextMenu = useEvent(\n    (event: MouseEvent | PointerEvent | MouseEvent | PointerEvent) => {\n      event.preventDefault();\n      if (isOpen) {\n        const pos = calculatePosition(event);\n        setAnchorPosition(pos);\n      } else {\n        open(defaultMenuProps, undefined, event);\n      }\n    },\n  );\n\n  // Bind the onContextMenu event to targetRef\n  useEffect(() => {\n    const element = targetRef.current;\n    if (!element) return;\n\n    element.addEventListener('contextmenu', onContextMenu as any);\n\n    return () => {\n      element.removeEventListener('contextmenu', onContextMenu as any);\n    };\n  }, [onContextMenu]);\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps || !anchorPosition) return null;\n\n    return (\n      <>\n        {/* Invisible anchor element positioned at click coordinates */}\n        <span\n          ref={invisibleAnchorRef}\n          style={{\n            position: 'absolute',\n            left: `${anchorPosition.x}px`,\n            top: `${anchorPosition.y}px`,\n            width: '0px',\n            height: '0px',\n            lineHeight: '0',\n            pointerEvents: 'none',\n            visibility: 'hidden',\n          }}\n        />\n        <MenuTrigger\n          offset={0}\n          crossOffset={0}\n          placement={\n            (triggerProps as ComponentProps<typeof MenuTrigger>)?.placement ||\n            defaultTriggerProps?.placement ||\n            'bottom start'\n          }\n          {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n          isDummy\n          isOpen={isOpen}\n          targetRef={invisibleAnchorRef}\n          popoverRef={popoverRef}\n          onOpenChange={setIsOpen}\n        >\n          <VisuallyHidden>\n            <Pressable>\n              <button\n                aria-label={t(\n                  'contextMenu.openContextMenu',\n                  'Open context menu',\n                )}\n              />\n            </Pressable>\n          </VisuallyHidden>\n          <Component {...componentProps} />\n        </MenuTrigger>\n      </>\n    );\n  }, [\n    componentProps,\n    triggerProps,\n    isOpen,\n    defaultTriggerProps,\n    anchorPosition,\n    t,\n  ]);\n\n  return {\n    targetRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/components/content/ActiveZone/ActiveZone.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/content/Alert/Alert.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import themes_default from "../../../data/themes.js";
 import { useAlert } from "./use-alert.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Alert/use-alert.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useDeprecationWarning } from "../../../_internal/hooks/use-deprecation-warning.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps } from "@tenphi/tasty";

package/dist/components/content/Avatar/Avatar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, Element, filterBaseProps } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Badge/Badge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { _Item } from "../Item/Item.js";
 import themes_default from "../../../data/themes.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Card/Card.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Content.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js

@@ -1,6 +1,7 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useTimer } from "../../../_internal/hooks/use-timer/use-timer.js";
+import { useI18n } from "../../../i18n/useI18n.js";
 import { CopyIcon } from "../../../icons/CopyIcon.js";
 import { Button } from "../../actions/index.js";
 import { useToast } from "../../overlays/Toast/useToast.js";
@@ -77,7 +78,6 @@ const CopyPasteBlockElement = tasty(Card, {
 const CopyButton = tasty(Button, {
 	type: "clear",
 	icon: /* @__PURE__ */ jsx(CopyIcon, {}),
-	"aria-label": "Copy to clipboard",
 	styles: {
 		placeSelf: "stretch",
 		border: "#clear",
@@ -96,6 +96,7 @@ const CopyButton = tasty(Button, {
 function CopyPasteBlock(allProps, ref) {
 	const { value = "", onPaste, placeholder, title, size = "medium", ...props } = allProps;
 	const styles = extractStyles(props, POSITION_STYLES);
+	const { t } = useI18n();
 	const [error, setError] = useState(null);
 	const toast = useToast();
 	const { clipboardProps } = useClipboard({
@@ -111,7 +112,7 @@ function CopyPasteBlock(allProps, ref) {
 			return value ? [{ "text/plain": value }] : [];
 		},
 		onCopy() {
-			if (value) toast.success(`${title || "Text"} copied`);
+			if (value) toast.success(t("copyPasteBlock.copied", "{{title}} copied", { title: title || t("copyPasteBlock.defaultTitle", "Text") }));
 		}
 	});
 	useTimer({
@@ -123,7 +124,7 @@ function CopyPasteBlock(allProps, ref) {
 	});
 	async function onCopy() {
 		await copy(value);
-		toast.success(`${title || "Text"} copied`);
+		toast.success(t("copyPasteBlock.copied", "{{title}} copied", { title: title || t("copyPasteBlock.defaultTitle", "Text") }));
 	}
 	const pristineValue = value.replace(/\n/, " ");
 	return /* @__PURE__ */ jsx(CopyPasteBlockElement, {
@@ -141,7 +142,7 @@ function CopyPasteBlock(allProps, ref) {
 				mods: { placeholder: !!placeholder || !value },
 				children: [/* @__PURE__ */ jsx("div", {
 					"data-element": "Label",
-					children: error != null ? error || "Invalid data" : value ? pristineValue : /* @__PURE__ */ jsx(Fragment$1, { children: placeholder ? placeholder : "Select and paste" })
+					children: error != null ? error || t("copyPasteBlock.invalidData", "Invalid data") : value ? pristineValue : /* @__PURE__ */ jsx(Fragment$1, { children: placeholder ? placeholder : t("copyPasteBlock.selectAndPaste", "Select and paste") })
 				}), /* @__PURE__ */ jsxs("span", {
 					"data-element": "Shortcut",
 					children: [
@@ -152,7 +153,7 @@ function CopyPasteBlock(allProps, ref) {
 				})]
 			}), value && !error && /* @__PURE__ */ jsx(CopyButton, {
 				size,
-				"aria-label": `Copy ${title}`,
+				"aria-label": t("copyPasteBlock.copyToClipboard", "Copy {{title}} to clipboard", { title: title || t("copyPasteBlock.defaultTitle", "Text") }),
 				onPress: onCopy
 			})]
 		})

package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyPasteBlock.js","names":[],"sources":["../../../../src/components/content/CopyPasteBlock/CopyPasteBlock.tsx"],"sourcesContent":["import {\n  POSITION_STYLES,\n  PositionStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ForwardedRef, forwardRef, ReactNode, useState } from 'react';\nimport { TextDropItem, useClipboard } from 'react-aria';\n\nimport { useTimer } from '../../../_internal';\nimport { CopyIcon } from '../../../icons';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../../actions';\nimport { useToast } from '../../overlays/Toast';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst StyledBlock = tasty({\n  styles: {\n    display: 'grid',\n    flow: 'column',\n    placeContent: 'center space-between',\n    placeItems: 'center stretch',\n    gap: '1x',\n    position: 'relative',\n    width: 'max 100%',\n    color: 'inherit',\n    padding: '0 1.5x',\n    // height: {\n    //   '': '4.5x',\n    //   '[data-size=\"small\"]': '3.5x',\n    //   '[data-size=\"large\"]': '5.5x',\n    // },\n    userSelect: 'none',\n\n    Label: {\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n  },\n});\n\nconst CopyPasteBlockElement = tasty(Card, {\n  qa: 'CopyPasteBlock',\n  styles: {\n    display: 'grid',\n    fill: '#surface-2',\n    radius: '1r',\n    padding: {\n      '': '0 1px',\n      ':focus': '0',\n    },\n    color: {\n      '': '#dark',\n      error: '#danger-text',\n    },\n    border: {\n      '': 'dashed #dark-03',\n      ':focus': '2px dashed #primary-text',\n      error: 'dashed #danger',\n    },\n    cursor: '$pointer',\n    preset: {\n      '': 't3',\n      'size=large': 't2',\n    },\n    height: {\n      '': '5x',\n      'size=small': '4x',\n      'size=large': '6x',\n    },\n    boxSizing: 'border-box',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) min-content',\n      placeContent: 'stretch',\n      width: 'min 20x',\n      radius: '1r',\n      position: 'relative',\n    },\n\n    Shortcut: {\n      display: {\n        '': 'none',\n        ':focus & !error': 'inline',\n      },\n    },\n  },\n});\n\nconst CopyButton = tasty(Button, {\n  type: 'clear',\n  icon: <CopyIcon />,\n  'aria-label': 'Copy to clipboard',\n  styles: {\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': '0 0 0 1ow #purple-03.0 inset',\n      focused: '0 0 0 1ow #purple-03 inset',\n    },\n    radius: {\n      '': '0 1r 1r 0',\n      'multiline | has-scroll': '0 1r 0 0',\n    },\n    height: 'auto',\n    outline: false,\n  },\n});\n\nexport interface CubeCopyPasteBlockProps\n  extends Omit<CubeCardProps, 'onPaste' | 'onCopy'>,\n    PositionStyleProps {\n  padding?: Styles['padding'];\n  /** The code snippet */\n  value?: string;\n  placeholder?: ReactNode;\n  /** The title of the snippet */\n  title?: string;\n  onPaste?: (text: string) => void | Promise<void | string>;\n  onCopy?: () => void;\n  size?: 'small' | 'medium' | 'large';\n}\n\nfunction CopyPasteBlock(\n  allProps: CubeCopyPasteBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    value = '',\n    onPaste,\n    placeholder,\n    title,\n    size = 'medium',\n    ...props\n  } = allProps;\n  const styles = extractStyles(props, POSITION_STYLES);\n\n  const [error, setError] = useState<string | null>(null);\n  const toast = useToast();\n\n  const { clipboardProps } = useClipboard({\n    async onPaste(items) {\n      let pasted = await Promise.all(\n        items\n          .filter(\n            (item) => item.kind === 'text' && item.types.has('text/plain'),\n          )\n          .map((item) => (item as TextDropItem).getText('text/plain')),\n      );\n      try {\n        await onPaste?.(pasted.join('\\n'));\n      } catch (e) {\n        setError(String(e));\n      }\n    },\n    getItems() {\n      return value\n        ? [\n            {\n              'text/plain': value,\n            },\n          ]\n        : [];\n    },\n    onCopy() {\n      if (value) {\n        toast.success(`${title || 'Text'} copied`);\n      }\n    },\n  });\n\n  useTimer({\n    delay: 1000,\n    callback() {\n      setError(null);\n    },\n    isDisabled: !error,\n  });\n\n  async function onCopy() {\n    await copy(value);\n\n    toast.success(`${title || 'Text'} copied`);\n  }\n\n  const pristineValue = value.replace(/\\n/, ' ');\n\n  return (\n    <CopyPasteBlockElement\n      ref={ref}\n      mods={{ error: !!error }}\n      data-size={size}\n      styles={styles}\n      tabIndex=\"0\"\n      {...props}\n      {...clipboardProps}\n    >\n      <div data-element=\"Grid\">\n        <StyledBlock\n          data-size={size}\n          mods={{\n            placeholder: !!placeholder || !value,\n          }}\n        >\n          <div data-element=\"Label\">\n            {error != null ? (\n              error || 'Invalid data'\n            ) : value ? (\n              pristineValue\n            ) : (\n              <>{placeholder ? placeholder : 'Select and paste'}</>\n            )}\n          </div>\n          <span data-element=\"Shortcut\">\n            <kbd>Cmd</kbd> + <kbd>V</kbd>\n          </span>\n        </StyledBlock>\n        {value && !error && (\n          <CopyButton\n            size={size}\n            aria-label={`Copy ${title}`}\n            onPress={onCopy}\n          />\n        )}\n      </div>\n    </CopyPasteBlockElement>\n  );\n}\n\nconst _CopyPasteBlock = forwardRef(CopyPasteBlock);\n\n_CopyPasteBlock.displayName = 'CopyPasteBlock';\n\nexport { _CopyPasteBlock as CopyPasteBlock };\n"],"mappings":"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"}
+{"version":3,"file":"CopyPasteBlock.js","names":[],"sources":["../../../../src/components/content/CopyPasteBlock/CopyPasteBlock.tsx"],"sourcesContent":["import {\n  POSITION_STYLES,\n  PositionStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ForwardedRef, forwardRef, ReactNode, useState } from 'react';\nimport { TextDropItem, useClipboard } from 'react-aria';\n\nimport { useTimer } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon } from '../../../icons';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../../actions';\nimport { useToast } from '../../overlays/Toast';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst StyledBlock = tasty({\n  styles: {\n    display: 'grid',\n    flow: 'column',\n    placeContent: 'center space-between',\n    placeItems: 'center stretch',\n    gap: '1x',\n    position: 'relative',\n    width: 'max 100%',\n    color: 'inherit',\n    padding: '0 1.5x',\n    // height: {\n    //   '': '4.5x',\n    //   '[data-size=\"small\"]': '3.5x',\n    //   '[data-size=\"large\"]': '5.5x',\n    // },\n    userSelect: 'none',\n\n    Label: {\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n  },\n});\n\nconst CopyPasteBlockElement = tasty(Card, {\n  qa: 'CopyPasteBlock',\n  styles: {\n    display: 'grid',\n    fill: '#surface-2',\n    radius: '1r',\n    padding: {\n      '': '0 1px',\n      ':focus': '0',\n    },\n    color: {\n      '': '#dark',\n      error: '#danger-text',\n    },\n    border: {\n      '': 'dashed #dark-03',\n      ':focus': '2px dashed #primary-text',\n      error: 'dashed #danger',\n    },\n    cursor: '$pointer',\n    preset: {\n      '': 't3',\n      'size=large': 't2',\n    },\n    height: {\n      '': '5x',\n      'size=small': '4x',\n      'size=large': '6x',\n    },\n    boxSizing: 'border-box',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) min-content',\n      placeContent: 'stretch',\n      width: 'min 20x',\n      radius: '1r',\n      position: 'relative',\n    },\n\n    Shortcut: {\n      display: {\n        '': 'none',\n        ':focus & !error': 'inline',\n      },\n    },\n  },\n});\n\nconst CopyButton = tasty(Button, {\n  type: 'clear',\n  icon: <CopyIcon />,\n  styles: {\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': '0 0 0 1ow #purple-03.0 inset',\n      focused: '0 0 0 1ow #purple-03 inset',\n    },\n    radius: {\n      '': '0 1r 1r 0',\n      'multiline | has-scroll': '0 1r 0 0',\n    },\n    height: 'auto',\n    outline: false,\n  },\n});\n\nexport interface CubeCopyPasteBlockProps\n  extends Omit<CubeCardProps, 'onPaste' | 'onCopy'>,\n    PositionStyleProps {\n  padding?: Styles['padding'];\n  /** The code snippet */\n  value?: string;\n  placeholder?: ReactNode;\n  /** The title of the snippet */\n  title?: string;\n  onPaste?: (text: string) => void | Promise<void | string>;\n  onCopy?: () => void;\n  size?: 'small' | 'medium' | 'large';\n}\n\nfunction CopyPasteBlock(\n  allProps: CubeCopyPasteBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    value = '',\n    onPaste,\n    placeholder,\n    title,\n    size = 'medium',\n    ...props\n  } = allProps;\n  const styles = extractStyles(props, POSITION_STYLES);\n\n  const { t } = useI18n();\n  const [error, setError] = useState<string | null>(null);\n  const toast = useToast();\n\n  const { clipboardProps } = useClipboard({\n    async onPaste(items) {\n      let pasted = await Promise.all(\n        items\n          .filter(\n            (item) => item.kind === 'text' && item.types.has('text/plain'),\n          )\n          .map((item) => (item as TextDropItem).getText('text/plain')),\n      );\n      try {\n        await onPaste?.(pasted.join('\\n'));\n      } catch (e) {\n        setError(String(e));\n      }\n    },\n    getItems() {\n      return value\n        ? [\n            {\n              'text/plain': value,\n            },\n          ]\n        : [];\n    },\n    onCopy() {\n      if (value) {\n        toast.success(\n          t('copyPasteBlock.copied', '{{title}} copied', {\n            title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n          }),\n        );\n      }\n    },\n  });\n\n  useTimer({\n    delay: 1000,\n    callback() {\n      setError(null);\n    },\n    isDisabled: !error,\n  });\n\n  async function onCopy() {\n    await copy(value);\n\n    toast.success(\n      t('copyPasteBlock.copied', '{{title}} copied', {\n        title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n      }),\n    );\n  }\n\n  const pristineValue = value.replace(/\\n/, ' ');\n\n  return (\n    <CopyPasteBlockElement\n      ref={ref}\n      mods={{ error: !!error }}\n      data-size={size}\n      styles={styles}\n      tabIndex=\"0\"\n      {...props}\n      {...clipboardProps}\n    >\n      <div data-element=\"Grid\">\n        <StyledBlock\n          data-size={size}\n          mods={{\n            placeholder: !!placeholder || !value,\n          }}\n        >\n          <div data-element=\"Label\">\n            {error != null ? (\n              error || t('copyPasteBlock.invalidData', 'Invalid data')\n            ) : value ? (\n              pristineValue\n            ) : (\n              <>\n                {placeholder\n                  ? placeholder\n                  : t('copyPasteBlock.selectAndPaste', 'Select and paste')}\n              </>\n            )}\n          </div>\n          <span data-element=\"Shortcut\">\n            <kbd>Cmd</kbd> + <kbd>V</kbd>\n          </span>\n        </StyledBlock>\n        {value && !error && (\n          <CopyButton\n            size={size}\n            aria-label={t(\n              'copyPasteBlock.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              {\n                title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n              },\n            )}\n            onPress={onCopy}\n          />\n        )}\n      </div>\n    </CopyPasteBlockElement>\n  );\n}\n\nconst _CopyPasteBlock = forwardRef(CopyPasteBlock);\n\n_CopyPasteBlock.displayName = 'CopyPasteBlock';\n\nexport { _CopyPasteBlock as CopyPasteBlock };\n"],"mappings":"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"}

package/dist/components/content/CopySnippet/CopySnippet.js

@@ -1,6 +1,7 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { _Tooltip } from "../../overlays/Tooltip/Tooltip.js";
 import { TooltipTrigger } from "../../overlays/Tooltip/TooltipTrigger.js";
+import { useI18n } from "../../../i18n/useI18n.js";
 import { CopyIcon } from "../../../icons/CopyIcon.js";
 import { EyeIcon } from "../../../icons/EyeIcon.js";
 import { EyeInvisibleIcon } from "../../../icons/EyeInvisibleIcon.js";
@@ -119,22 +120,20 @@ const ActionButton = tasty(Button, {
 		}
 	}
 });
-const CopyButton = tasty(ActionButton, {
-	icon: /* @__PURE__ */ jsx(CopyIcon, {}),
-	"aria-label": "Copy to clipboard"
-});
-const ShowButton = tasty(ActionButton, { "aria-label": "Show hidden parts" });
+const CopyButton = tasty(ActionButton, { icon: /* @__PURE__ */ jsx(CopyIcon, {}) });
+const ShowButton = tasty(ActionButton, {});
 const HIDDEN_SYMBOL = "•";
 function replaceSymbolsToHidden(str) {
 	return HIDDEN_SYMBOL.repeat(str.length);
 }
 function CopySnippet(allProps) {
-	const { code = "", title = "Code example", nowrap, prefix = "", language, serif, actions, showTooltip = false, hideText, ...props } = allProps;
+	const { t } = useI18n();
+	const { code = "", title = t("copySnippet.title", "Code example"), nowrap, prefix = "", language, serif, actions, showTooltip = false, hideText, ...props } = allProps;
 	const toast = useToast();
 	const [showHidden, setShowHidden] = useState(false);
 	async function onCopy() {
 		await copy(code);
-		toast.success(`${title} copied`);
+		toast.success(t("copySnippet.copied", "{{title}} copied", { title }));
 	}
 	const pristineCode = code.replace(/\n$/, "");
 	const multiline = pristineCode.includes("\n") && !nowrap;
@@ -178,10 +177,11 @@ function CopySnippet(allProps) {
 				mods,
 				children: [
 					/* @__PURE__ */ jsx(CopyButton, {
-						"aria-label": `Copy ${title}`,
+						"aria-label": t("copySnippet.copyToClipboard", "Copy {{title}} to clipboard", { title }),
 						onPress: onCopy
 					}),
 					hideText && /* @__PURE__ */ jsx(ShowButton, {
+						"aria-label": t("copySnippet.showHiddenParts", "Show hidden parts"),
 						icon: showHidden ? /* @__PURE__ */ jsx(EyeInvisibleIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {}),
 						onPress: () => setShowHidden(!showHidden)
 					}),

package/dist/components/content/CopySnippet/CopySnippet.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopySnippet.js","names":["PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useMemo, useState } from 'react';\n\nimport { CopyIcon, EyeIcon, EyeInvisibleIcon } from '../../../icons';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n  'aria-label': 'Copy to clipboard',\n});\n\nconst ShowButton = tasty(ActionButton, {\n  'aria-label': 'Show hidden parts',\n});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const {\n    code = '',\n    title = 'Code example',\n    nowrap,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(`${title} copied`);\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = useMemo(() => {\n    return {\n      nowrap,\n      multiline,\n      serif,\n      hidden: !!hideText,\n    };\n  }, [nowrap, multiline, hideText, serif]);\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            style={{ margin: 0, overflow: 'visible' }}\n            code={formattedCode}\n            language={language || 'javascript'}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton aria-label={`Copy ${title}`} onPress={onCopy} />\n          {hideText && (\n            <ShowButton\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":"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"}
+{"version":3,"file":"CopySnippet.js","names":["PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useMemo, useState } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon, EyeIcon, EyeInvisibleIcon } from '../../../icons';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n});\n\nconst ShowButton = tasty(ActionButton, {});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const { t } = useI18n();\n\n  const {\n    code = '',\n    title = t('copySnippet.title', 'Code example'),\n    nowrap,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(t('copySnippet.copied', '{{title}} copied', { title }));\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = useMemo(() => {\n    return {\n      nowrap,\n      multiline,\n      serif,\n      hidden: !!hideText,\n    };\n  }, [nowrap, multiline, hideText, serif]);\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            style={{ margin: 0, overflow: 'visible' }}\n            code={formattedCode}\n            language={language || 'javascript'}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton\n            aria-label={t(\n              'copySnippet.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              { title },\n            )}\n            onPress={onCopy}\n          />\n          {hideText && (\n            <ShowButton\n              aria-label={t('copySnippet.showHiddenParts', 'Show hidden parts')}\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgBA,MAAM,gBAAgB,MAAM,QAAQ,EAClC,QAAQ;CACN,SAAS;CACT,QAAQ;CACR,OAAO;CACR,EACF,CAAC;AAEF,MAAM,cAAc,MAAM,EACxB,QAAQ;CACN,UAAU;CACV,UAAU;EACR,IAAI;EACJ,WAAW;EACZ;CACD,OAAO;CACP,QAAQ;EACN,IAAI;EACJ,WAAW;EACZ;CACD,WAAW;CACX,YAAY;EACV,IAAI;EACJ,QAAQ;EACT;CACD,WAAW;CACX,SAAS;CACT,MAAM;EACJ,IAAI;EACJ,WAAW;EACZ;CAED,MAAM;EACJ,GAAG;EACH,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACF,EACF,CAAC;AAEF,MAAM,kBAAkB,MAAM,EAC5B,QAAQ;CACN,UAAU;CACV,SAAS;CACT,MAAM;EACJ,IAAI;EACJ,WAAW;EACZ;CACD,cAAc;CAEd,gBAAgB;EACd,IAAI;EACJ,WAAW;EACZ;CAED,wBAAwB;EACtB,IAAI;EACJ,WAAW;EACZ;CAED,uBAAuB;EACrB,IAAI;EACJ,WAAW;EACZ;CAED,iCAAiC;EAC/B,IAAI;EACJ,WAAW;EACZ;CAGD,QAAQ;CACT,EACF,CAAC;AAEF,MAAM,qBAAqB,MAAM,MAAM;CACrC,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,UAAU;EACV,MAAM;EACN,QAAQ;EACR,SAAS;EACT,QAAQ;EACR,QAAQ;EACR,UAAU;EACV,QAAQ;EAER,MAAM;GACJ,SAAS;GACT,MAAM;GACN,aAAa;GACb,UAAU;GACV,OAAO;GACP,UAAU;GACX;EACF;CACF,CAAC;AAEF,MAAM,eAAe,MAAM,QAAQ;CACjC,MAAM;CACN,QAAQ;EACN,OAAO;EACP,SAAS;EACT,WAAW;EACX,QAAQ;EACR,QAAQ;GACN,IAAI;GACJ,SAAS;GACV;EACD,SAAS;EACT,QAAQ;EACR,QAAQ;GACN,IAAI;GACJ,eAAe;GACf,gBAAgB;GAChB,8BAA8B;GAC/B;EACF;CACF,CAAC;AAEF,MAAM,aAAa,MAAM,cAAc,EACrC,MAAM,oBAAC,aAAW,EACnB,CAAC;AAEF,MAAM,aAAa,MAAM,cAAc,EAAE,CAAC;AAsB1C,MAAM,gBAAgB;AAEtB,SAAS,uBAAuB,KAAa;AAC3C,QAAO,cAAc,OAAO,IAAI,OAAO;;AAGzC,SAAS,YAAY,UAAgC;CACnD,MAAM,EAAE,MAAM,SAAS;CAEvB,MAAM,EACJ,OAAO,IACP,QAAQ,EAAE,qBAAqB,eAAe,EAC9C,QACA,SAAS,IACT,UACA,OACA,SACA,cAAc,OACd,UACA,GAAG,UACD;CAEJ,MAAM,QAAQ,UAAU;CAExB,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CAEnD,eAAe,SAAS;AACtB,QAAM,KAAK,KAAK;AAEhB,QAAM,QAAQ,EAAE,sBAAsB,oBAAoB,EAAE,OAAO,CAAC,CAAC;;CAGvE,MAAM,eAAe,KAAK,QAAQ,OAAO,GAAG;CAE5C,MAAM,YAAY,aAAa,SAAS,KAAK,IAAI,CAAC;CAClD,IAAI,gBAAgB,aACjB,QAAQ,OAAO,GAAG,CAClB,MAAM,MAAM,CACZ,KAAK,SAAS,GAAG,SAAS,OAAO,CACjC,KAAK,KAAK,CACV,MAAM;AAET,KAAI,CAAC,YACH;MAAI,aAAa,KACf,iBAAgB,uBAAuB,cAAc;WAC5C,OAAO,aAAa,SAC7B,iBAAgB,cAAc,WAC5B,UACA,uBAAuB,SAAS,CACjC;WACQ,MAAM,QAAQ,SAAS,CAChC,UAAS,SAAS,SAAS;AACzB,mBAAgB,cAAc,WAC5B,MACA,uBAAuB,KAAK,CAC7B;IACD;;CAIN,MAAM,OAAO,cAAc;AACzB,SAAO;GACL;GACA;GACA;GACA,QAAQ,CAAC,CAAC;GACX;IACA;EAAC;EAAQ;EAAW;EAAU;EAAM,CAAC;CAExC,MAAM,UACJ,oBAAC;EAAyB;EAAM,GAAI;YAClC,qBAAC;GAAI,gBAAa;cAChB,oBAAC;IAAkB;cACjB,oBAACA;KACC,OAAO;MAAE,QAAQ;MAAG,UAAU;MAAW;KACzC,MAAM;KACN,UAAU,YAAY;MACtB;KACU,EACd,qBAAC;IAAsB;;KACrB,oBAAC;MACC,cAAY,EACV,+BACA,+BACA,EAAE,OAAO,CACV;MACD,SAAS;OACT;KACD,YACC,oBAAC;MACC,cAAY,EAAE,+BAA+B,oBAAoB;MACjE,MAAM,aAAa,oBAAC,qBAAmB,GAAG,oBAAC,YAAU;MACrD,eAAe,cAAc,CAAC,WAAW;OACzC;KAEH;;KACe;IACd;GACa;AAGvB,KAAI,YACF,QACE,qBAAC,6BACC,oBAAC,2BAAe,UAAwB,EACxC,oBAACC,sBAAS,gBAAwB,IACnB;AAIrB,QAAO;;AAGT,MAAM,eAAe,OAAO,OAC1B,aAGA,EACE,QAAQ,cACT,CACF;AAED,AAAC,aAAqB,cAAc"}

package/dist/components/content/Disclosure/Disclosure.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";

package/dist/components/content/Divider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { BASE_STYLES, COLOR_STYLES, OUTER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Footer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Header.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/HotKeys/HotKeys.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { _Text } from "../Text.js";
 import { useKeySymbols } from "../../../utils/react/useKeySymbols.js";

package/dist/components/content/InlineInput/InlineInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/content/Item/Item.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { resolveIcon } from "../../../utils/react/resolveIcon.js";
 import { highlightText } from "../highlightText.js";

package/dist/components/content/ItemBadge/ItemBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES } from "../../../data/item-themes.js";

package/dist/components/content/ItemCard/ItemCard.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { _Item } from "../Item/Item.js";
 import { forwardRef } from "react";