@chayns-components/core 5.5.64 → 5.5.66

package/lib/cjs/components/context-menu/ContextMenu.test.js

@@ -0,0 +1,234 @@
+"use strict";
+
+require("@testing-library/jest-dom/vitest");
+var _react = require("@testing-library/react");
+var _chaynsApi = require("chayns-api");
+var _react2 = _interopRequireDefault(require("react"));
+var _vitest2 = require("vitest");
+var _ContextMenu = _interopRequireDefault(require("./ContextMenu"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const environment = _vitest2.vi.hoisted(() => ({
+  isTouch: false
+}));
+_vitest2.vi.mock('../../utils/environment', () => ({
+  useIsTouch: () => environment.isTouch
+}));
+_vitest2.vi.mock('chayns-api', async importOriginal => ({
+  ...(await importOriginal()),
+  createDialog: _vitest2.vi.fn(),
+  useSite: () => ({
+    colorMode: 0
+  })
+}));
+const renderMenu = items => {
+  (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_ContextMenu.default, {
+    items: items,
+    coordinates: {
+      x: 0,
+      y: 0
+    }
+  }, /*#__PURE__*/_react2.default.createElement("button", {
+    type: "button"
+  }, "Options")));
+  _react.fireEvent.click(_react.screen.getByRole('button', {
+    name: 'Options'
+  }));
+};
+const createItems = () => [{
+  key: 'edit',
+  text: 'Edit',
+  onClick: _vitest2.vi.fn()
+}, {
+  key: 'delete',
+  text: 'Delete',
+  isDisabled: true,
+  disabledReason: 'You do not have permission to delete this entry.',
+  onClick: _vitest2.vi.fn()
+}];
+(0, _vitest2.beforeEach)(() => {
+  environment.isTouch = false;
+  _vitest2.vi.clearAllMocks();
+});
+(0, _vitest2.describe)('ContextMenu disabled items', () => {
+  (0, _vitest2.it)('keeps disabled items visible and leaves the menu open when clicked', async () => {
+    var _items$, _items$2;
+    const items = createItems();
+    renderMenu(items);
+    const disabledItem = await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    });
+    (0, _vitest2.expect)(disabledItem).toHaveAttribute('aria-disabled', 'true');
+    (0, _vitest2.expect)(disabledItem).toHaveAccessibleDescription((_items$ = items[1]) === null || _items$ === void 0 ? void 0 : _items$.disabledReason);
+    (0, _vitest2.expect)(disabledItem).toHaveStyle({
+      opacity: '0.5',
+      cursor: 'default'
+    });
+    _react.fireEvent.click(disabledItem);
+    (0, _vitest2.expect)((_items$2 = items[1]) === null || _items$2 === void 0 ? void 0 : _items$2.onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)(disabledItem).toBeInTheDocument();
+    await (0, _react.waitFor)(() => {
+      var _items$3;
+      (0, _vitest2.expect)(document.querySelector('[data-ispopup="true"]')).toHaveTextContent(((_items$3 = items[1]) === null || _items$3 === void 0 ? void 0 : _items$3.disabledReason) ?? '');
+    });
+  });
+  (0, _vitest2.it)('shows the disabled reason on hover', async () => {
+    renderMenu(createItems());
+    const disabledItem = await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    });
+    _react.fireEvent.mouseEnter(disabledItem);
+    await (0, _react.waitFor)(() => {
+      (0, _vitest2.expect)(document.querySelector('[data-ispopup="true"]')).toHaveTextContent('You do not have permission to delete this entry.');
+    });
+  });
+  _vitest2.it.each(['Enter', ' '])('does not activate a disabled item using %s', async key => {
+    var _items$4;
+    const items = createItems();
+    renderMenu(items);
+    const disabledItem = await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    });
+    disabledItem.focus();
+    _react.fireEvent.keyDown(disabledItem, {
+      key
+    });
+    (0, _vitest2.expect)((_items$4 = items[1]) === null || _items$4 === void 0 ? void 0 : _items$4.onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)(disabledItem).toBeInTheDocument();
+  });
+  (0, _vitest2.it)('prevents activating disabled items reached using arrow keys', async () => {
+    var _items$5, _items$6;
+    const items = createItems();
+    renderMenu(items);
+    await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    });
+    const trigger = _react.screen.getByRole('button', {
+      name: 'Options'
+    });
+    _react.fireEvent.keyDown(trigger, {
+      key: 'ArrowDown'
+    });
+    _react.fireEvent.keyDown(trigger, {
+      key: 'ArrowDown'
+    });
+    _react.fireEvent.keyDown(trigger, {
+      key: 'Enter'
+    });
+    (0, _vitest2.expect)((_items$5 = items[1]) === null || _items$5 === void 0 ? void 0 : _items$5.onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)(_react.screen.getByRole('menuitem', {
+      name: 'Delete'
+    })).toBeInTheDocument();
+    _react.fireEvent.keyDown(trigger, {
+      key: 'ArrowDown'
+    });
+    _react.fireEvent.keyDown(trigger, {
+      key: 'Enter'
+    });
+    (0, _vitest2.expect)((_items$6 = items[0]) === null || _items$6 === void 0 ? void 0 : _items$6.onClick).toHaveBeenCalledOnce();
+  });
+  (0, _vitest2.it)('does not initially select a disabled item marked as selected', async () => {
+    var _items$7;
+    const items = createItems().map(item => ({
+      ...item,
+      isSelected: item.isDisabled
+    }));
+    renderMenu(items);
+    await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    });
+    _react.fireEvent.keyDown(_react.screen.getByRole('button', {
+      name: 'Options'
+    }), {
+      key: 'Enter'
+    });
+    (0, _vitest2.expect)((_items$7 = items[1]) === null || _items$7 === void 0 ? void 0 : _items$7.onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)(_react.screen.getByRole('menuitem', {
+      name: 'Delete'
+    })).toBeInTheDocument();
+  });
+  (0, _vitest2.it)('still activates enabled items and closes the menu', async () => {
+    var _items$8;
+    const items = createItems();
+    renderMenu(items);
+    _react.fireEvent.click(await _react.screen.findByRole('menuitem', {
+      name: 'Edit'
+    }));
+    (0, _vitest2.expect)((_items$8 = items[0]) === null || _items$8 === void 0 ? void 0 : _items$8.onClick).toHaveBeenCalledOnce();
+    await (0, _react.waitFor)(() => (0, _vitest2.expect)(_react.screen.queryByRole('menuitem')).not.toBeInTheDocument());
+  });
+  (0, _vitest2.it)('supports disabled items without a reason', async () => {
+    const onClick = _vitest2.vi.fn();
+    renderMenu([{
+      key: 'delete',
+      text: 'Delete',
+      isDisabled: true,
+      onClick
+    }]);
+    _react.fireEvent.click(await _react.screen.findByRole('menuitem', {
+      name: 'Delete'
+    }));
+    (0, _vitest2.expect)(onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)(document.querySelector('[data-ispopup="true"]')).not.toBeInTheDocument();
+  });
+  (0, _vitest2.it)('passes disabled items and their reasons to the native select dialog on touch devices', async () => {
+    var _items$9, _items$0, _items$1;
+    environment.isTouch = true;
+    const items = createItems();
+    const open = _vitest2.vi.fn().mockResolvedValue({
+      result: []
+    });
+    _vitest2.vi.mocked(_chaynsApi.createDialog).mockReturnValue({
+      open
+    });
+    renderMenu(items);
+    await (0, _react.waitFor)(() => (0, _vitest2.expect)(open).toHaveBeenCalledOnce());
+    (0, _vitest2.expect)(_chaynsApi.createDialog).toHaveBeenCalledWith(_vitest2.expect.objectContaining({
+      list: [_vitest2.expect.objectContaining({
+        id: 0,
+        name: 'Edit',
+        disabled: undefined,
+        subtitle: undefined
+      }), _vitest2.expect.objectContaining({
+        id: 1,
+        name: 'Delete',
+        disabled: true,
+        subtitle: (_items$9 = items[1]) === null || _items$9 === void 0 ? void 0 : _items$9.disabledReason
+      })]
+    }));
+    (0, _vitest2.expect)(_react.screen.queryByRole('menuitem')).not.toBeInTheDocument();
+    (0, _vitest2.expect)((_items$0 = items[0]) === null || _items$0 === void 0 ? void 0 : _items$0.onClick).not.toHaveBeenCalled();
+    (0, _vitest2.expect)((_items$1 = items[1]) === null || _items$1 === void 0 ? void 0 : _items$1.onClick).not.toHaveBeenCalled();
+  });
+  (0, _vitest2.it)('does not activate a disabled item even if the native dialog returns it', async () => {
+    var _items$10;
+    environment.isTouch = true;
+    const items = createItems();
+    const open = _vitest2.vi.fn().mockResolvedValue({
+      result: [1]
+    });
+    _vitest2.vi.mocked(_chaynsApi.createDialog).mockReturnValue({
+      open
+    });
+    renderMenu(items);
+    await (0, _react.waitFor)(() => (0, _vitest2.expect)(open).toHaveBeenCalledOnce());
+    (0, _vitest2.expect)((_items$10 = items[1]) === null || _items$10 === void 0 ? void 0 : _items$10.onClick).not.toHaveBeenCalled();
+  });
+  (0, _vitest2.it)('keeps using the native select dialog on touch devices for enabled items', async () => {
+    environment.isTouch = true;
+    const onClick = _vitest2.vi.fn();
+    _vitest2.vi.mocked(_chaynsApi.createDialog).mockReturnValue({
+      open: _vitest2.vi.fn().mockResolvedValue({
+        result: [0]
+      })
+    });
+    renderMenu([{
+      key: 'edit',
+      text: 'Edit',
+      onClick
+    }]);
+    await (0, _react.waitFor)(() => (0, _vitest2.expect)(onClick).toHaveBeenCalledOnce());
+    (0, _vitest2.expect)(_chaynsApi.createDialog).toHaveBeenCalledOnce();
+    (0, _vitest2.expect)(_react.screen.queryByRole('menuitem')).not.toBeInTheDocument();
+  });
+});
+//# sourceMappingURL=ContextMenu.test.js.map

package/lib/cjs/components/context-menu/ContextMenu.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenu.test.js","names":["require","_react","_chaynsApi","_react2","_interopRequireDefault","_vitest2","_ContextMenu","e","__esModule","default","environment","vi","hoisted","isTouch","mock","useIsTouch","importOriginal","createDialog","fn","useSite","colorMode","renderMenu","items","render","createElement","coordinates","x","y","type","fireEvent","click","screen","getByRole","name","createItems","key","text","onClick","isDisabled","disabledReason","beforeEach","clearAllMocks","describe","it","_items$","_items$2","disabledItem","findByRole","expect","toHaveAttribute","toHaveAccessibleDescription","toHaveStyle","opacity","cursor","not","toHaveBeenCalled","toBeInTheDocument","waitFor","_items$3","document","querySelector","toHaveTextContent","mouseEnter","each","_items$4","focus","keyDown","_items$5","_items$6","trigger","toHaveBeenCalledOnce","_items$7","map","item","isSelected","_items$8","queryByRole","_items$9","_items$0","_items$1","open","mockResolvedValue","result","mocked","mockReturnValue","toHaveBeenCalledWith","objectContaining","list","id","disabled","undefined","subtitle","_items$10"],"sources":["../../../../src/components/context-menu/ContextMenu.test.tsx"],"sourcesContent":["import '@testing-library/jest-dom/vitest';\nimport { fireEvent, render, screen, waitFor } from '@testing-library/react';\nimport { createDialog } from 'chayns-api';\nimport React from 'react';\nimport { beforeEach, describe, expect, it, vi } from 'vitest';\nimport ContextMenu from './ContextMenu';\nimport type { ContextMenuItem } from './ContextMenu.types';\n\nconst environment = vi.hoisted(() => ({ isTouch: false }));\n\nvi.mock('../../utils/environment', () => ({\n    useIsTouch: () => environment.isTouch,\n}));\n\nvi.mock('chayns-api', async (importOriginal) => ({\n    ...(await importOriginal<typeof import('chayns-api')>()),\n    createDialog: vi.fn(),\n    useSite: () => ({ colorMode: 0 }),\n}));\n\nconst renderMenu = (items: ContextMenuItem[]) => {\n    render(\n        <ContextMenu items={items} coordinates={{ x: 0, y: 0 }}>\n            <button type=\"button\">Options</button>\n        </ContextMenu>,\n    );\n\n    fireEvent.click(screen.getByRole('button', { name: 'Options' }));\n};\n\nconst createItems = (): ContextMenuItem[] => [\n    { key: 'edit', text: 'Edit', onClick: vi.fn() },\n    {\n        key: 'delete',\n        text: 'Delete',\n        isDisabled: true,\n        disabledReason: 'You do not have permission to delete this entry.',\n        onClick: vi.fn(),\n    },\n];\n\nbeforeEach(() => {\n    environment.isTouch = false;\n    vi.clearAllMocks();\n});\n\ndescribe('ContextMenu disabled items', () => {\n    it('keeps disabled items visible and leaves the menu open when clicked', async () => {\n        const items = createItems();\n        renderMenu(items);\n\n        const disabledItem = await screen.findByRole('menuitem', { name: 'Delete' });\n        expect(disabledItem).toHaveAttribute('aria-disabled', 'true');\n        expect(disabledItem).toHaveAccessibleDescription(items[1]?.disabledReason);\n        expect(disabledItem).toHaveStyle({ opacity: '0.5', cursor: 'default' });\n\n        fireEvent.click(disabledItem);\n\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n        expect(disabledItem).toBeInTheDocument();\n        await waitFor(() => {\n            expect(document.querySelector('[data-ispopup=\"true\"]')).toHaveTextContent(\n                items[1]?.disabledReason ?? '',\n            );\n        });\n    });\n\n    it('shows the disabled reason on hover', async () => {\n        renderMenu(createItems());\n        const disabledItem = await screen.findByRole('menuitem', { name: 'Delete' });\n\n        fireEvent.mouseEnter(disabledItem);\n\n        await waitFor(() => {\n            expect(document.querySelector('[data-ispopup=\"true\"]')).toHaveTextContent(\n                'You do not have permission to delete this entry.',\n            );\n        });\n    });\n\n    it.each(['Enter', ' '])('does not activate a disabled item using %s', async (key) => {\n        const items = createItems();\n        renderMenu(items);\n        const disabledItem = await screen.findByRole('menuitem', { name: 'Delete' });\n\n        disabledItem.focus();\n        fireEvent.keyDown(disabledItem, { key });\n\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n        expect(disabledItem).toBeInTheDocument();\n    });\n\n    it('prevents activating disabled items reached using arrow keys', async () => {\n        const items = createItems();\n        renderMenu(items);\n        await screen.findByRole('menuitem', { name: 'Delete' });\n        const trigger = screen.getByRole('button', { name: 'Options' });\n\n        fireEvent.keyDown(trigger, { key: 'ArrowDown' });\n        fireEvent.keyDown(trigger, { key: 'ArrowDown' });\n        fireEvent.keyDown(trigger, { key: 'Enter' });\n\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n        expect(screen.getByRole('menuitem', { name: 'Delete' })).toBeInTheDocument();\n\n        fireEvent.keyDown(trigger, { key: 'ArrowDown' });\n        fireEvent.keyDown(trigger, { key: 'Enter' });\n\n        expect(items[0]?.onClick).toHaveBeenCalledOnce();\n    });\n\n    it('does not initially select a disabled item marked as selected', async () => {\n        const items = createItems().map((item) => ({\n            ...item,\n            isSelected: item.isDisabled,\n        }));\n        renderMenu(items);\n        await screen.findByRole('menuitem', { name: 'Delete' });\n\n        fireEvent.keyDown(screen.getByRole('button', { name: 'Options' }), { key: 'Enter' });\n\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n        expect(screen.getByRole('menuitem', { name: 'Delete' })).toBeInTheDocument();\n    });\n\n    it('still activates enabled items and closes the menu', async () => {\n        const items = createItems();\n        renderMenu(items);\n\n        fireEvent.click(await screen.findByRole('menuitem', { name: 'Edit' }));\n\n        expect(items[0]?.onClick).toHaveBeenCalledOnce();\n        await waitFor(() => expect(screen.queryByRole('menuitem')).not.toBeInTheDocument());\n    });\n\n    it('supports disabled items without a reason', async () => {\n        const onClick = vi.fn();\n        renderMenu([{ key: 'delete', text: 'Delete', isDisabled: true, onClick }]);\n\n        fireEvent.click(await screen.findByRole('menuitem', { name: 'Delete' }));\n\n        expect(onClick).not.toHaveBeenCalled();\n        expect(document.querySelector('[data-ispopup=\"true\"]')).not.toBeInTheDocument();\n    });\n\n    it('passes disabled items and their reasons to the native select dialog on touch devices', async () => {\n        environment.isTouch = true;\n        const items = createItems();\n        const open = vi.fn().mockResolvedValue({ result: [] });\n        vi.mocked(createDialog).mockReturnValue({\n            open,\n        } as unknown as ReturnType<typeof createDialog>);\n\n        renderMenu(items);\n\n        await waitFor(() => expect(open).toHaveBeenCalledOnce());\n        expect(createDialog).toHaveBeenCalledWith(\n            expect.objectContaining({\n                list: [\n                    expect.objectContaining({\n                        id: 0,\n                        name: 'Edit',\n                        disabled: undefined,\n                        subtitle: undefined,\n                    }),\n                    expect.objectContaining({\n                        id: 1,\n                        name: 'Delete',\n                        disabled: true,\n                        subtitle: items[1]?.disabledReason,\n                    }),\n                ],\n            }),\n        );\n        expect(screen.queryByRole('menuitem')).not.toBeInTheDocument();\n        expect(items[0]?.onClick).not.toHaveBeenCalled();\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n    });\n\n    it('does not activate a disabled item even if the native dialog returns it', async () => {\n        environment.isTouch = true;\n        const items = createItems();\n        const open = vi.fn().mockResolvedValue({ result: [1] });\n        vi.mocked(createDialog).mockReturnValue({\n            open,\n        } as unknown as ReturnType<typeof createDialog>);\n\n        renderMenu(items);\n\n        await waitFor(() => expect(open).toHaveBeenCalledOnce());\n        expect(items[1]?.onClick).not.toHaveBeenCalled();\n    });\n\n    it('keeps using the native select dialog on touch devices for enabled items', async () => {\n        environment.isTouch = true;\n        const onClick = vi.fn();\n        vi.mocked(createDialog).mockReturnValue({\n            open: vi.fn().mockResolvedValue({ result: [0] }),\n        } as unknown as ReturnType<typeof createDialog>);\n\n        renderMenu([{ key: 'edit', text: 'Edit', onClick }]);\n\n        await waitFor(() => expect(onClick).toHaveBeenCalledOnce());\n        expect(createDialog).toHaveBeenCalledOnce();\n        expect(screen.queryByRole('menuitem')).not.toBeInTheDocument();\n    });\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/context-menu/ContextMenu.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.types.js","names":["ContextMenuAlignment","exports"],"sources":["../../../../src/components/context-menu/ContextMenu.types.ts"],"sourcesContent":["import type { CSSProperties, MouseEvent, ReactNode } from 'react';\n\n/**\n * Enum representing the possible alignments for the context menu.\n */\nexport enum ContextMenuAlignment {\n    TopLeft,\n    BottomLeft,\n    TopRight,\n    BottomRight,\n    TopCenter,\n    BottomCenter,\n}\n\n/**\n * Type representing the coordinates for positioning the context menu.\n */\nexport type ContextMenuCoordinates = {\n    /** The x-coordinate. */\n    x: number;\n    /** The y-coordinate. */\n    y: number;\n};\n\n/**\n * Type representing an item in the context menu.\n */\nexport type ContextMenuItem = {\n    /** Optional icons for the item. Can be strings or React nodes. */\n    icons?: string[] | ReactNode;\n    /** Whether the item is selected. */\n    isSelected?: boolean;\n    /** Unique key for the item. */\n    key: string;\n    /** Function called when the item is clicked. */\n    onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n    /** Whether to show a spacer after the item. */\n    shouldShowSpacer?: boolean;\n    /** The text displayed for the item. */\n    text: string;\n};\n\n/**\n * Props for the ContextMenu component.\n */\nexport type ContextMenuProps = {\n    /**\n     * Context menu alignment\n     * @description Optional custom alignment used instead of calculating it using the alignment\n     * within the page. The available alignments can be taken from the ContextMenuAlignment enum.\n     * @example alignment={ContextMenuAlignment.TopLeft}\n     * @optional\n     */\n    alignment?: ContextMenuAlignment;\n    /**\n     * Additional class name applied to the trigger wrapper.\n     * @optional\n     */\n    className?: string;\n    /**\n     * Children element\n     * @description The element over which the content of the ContextMenu should be displayed.\n     * @example children={<Icon icons={['fa fa-paper-clip']} />\n     * @default <Icon icons={['ts-ellipsis_v']} size={18} />\n     * @optional\n     */\n    children?: ReactNode;\n    /**\n     * Container element\n     * @description The element where the content of the ContextMenu should be rendered via React Portal.\n     * @example container={document.body}\n     * @optional\n     */\n    container?: Element;\n    /**\n     * Custom coordinates\n     * @description Optional own coordinates to be used instead of calculating the alignment based\n     * on the alignment of the children.\n     * @example coordinates={{ x: 100, y: 200 }}\n     * @optional\n     */\n    coordinates?: ContextMenuCoordinates;\n    /**\n     * Context menu headline\n     * @description The headline of the context menu. If not provided, no headline will be displayed.\n     * @example headline=\"Options\"\n     * @optional\n     */\n    headline?: string;\n    /**\n     * Menu items\n     * @description The items that will be displayed in the content of the ContextMenu. Custom icon\n     * elements only will be displayed on desktop devices.\n     * @example items={[{ key: '1', text: 'Option 1', onClick: () => {} }]}\n     */\n    items: ContextMenuItem[];\n    /**\n     * Hide callback function\n     * @description Function to be executed when the content of the Context menu has been hidden.\n     * @example onHide={() => console.log('Menu hidden')}\n     * @optional\n     */\n    onHide?: VoidFunction;\n    /**\n     * Show callback function\n     * @description Function to be executed when the content of the Context menu has been shown.\n     * @example onShow={() => console.log('Menu shown')}\n     * @optional\n     */\n    onShow?: VoidFunction;\n    /**\n     * Close on popup click flag\n     * @description Whether the popup should be closed if it is clicked.\n     * @default true\n     * @optional\n     */\n    shouldCloseOnPopupClick?: boolean;\n    /**\n     * Disable click flag\n     * @description Whether the click should be disabled.\n     * @default false\n     * @optional\n     */\n    shouldDisableClick?: boolean;\n    /**\n     * Hide popup arrow flag\n     * @description Whether the arrow of the popup should be hidden.\n     * @default false\n     * @optional\n     */\n    shouldHidePopupArrow?: boolean;\n    /**\n     * Whether the default trigger padding/background styles should be applied.\n     * @description Disable this when the trigger child already provides its own full visual styling.\n     * @default true\n     * @optional\n     */\n    shouldUseDefaultTriggerStyles?: boolean;\n    /**\n     * Show hover effect flag\n     * @description Whether the hover effect should be shown.\n     * @default false\n     * @optional\n     */\n    shouldShowHoverEffect?: boolean;\n    /**\n     * Enables keyboard-only focus highlighting for the trigger.\n     * @default false\n     * @optional\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Inline styles applied to the trigger wrapper.\n     * @optional\n     */\n    style?: CSSProperties;\n    /**\n     * Vertical offset between the trigger element and the context menu.\n     * @description Use this prop to fine-tune the context menu position on the Y axis. Positive and\n     * negative values can be used depending on the desired spacing.\n     * @default 0\n     * @example yOffset={8}\n     * @optional\n     */\n    yOffset?: number;\n    /**\n     * Z-index value\n     * @description The z-index of the popup.\n     * @example zIndex={100}\n     * @default 20\n     * @optional\n     */\n    zIndex?: number;\n    /**\n     * Optional text for the select dialog.\n     */\n    dialogText?: string;\n};\n\n/**\n * Ref interface for the ContextMenu component.\n */\nexport interface ContextMenuRef {\n    /** Hides the context menu. */\n    hide: VoidFunction;\n    /** Shows the context menu. */\n    show: VoidFunction;\n}\n"],"mappings":";;;;;;AAEA;AACA;AACA;AAFA,IAGYA,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;AAShC;AACA;AACA;AAQA;AACA;AACA;AAgBA;AACA;AACA;AAuIA;AACA;AACA","ignoreList":[]}
+{"version":3,"file":"ContextMenu.types.js","names":["ContextMenuAlignment","exports"],"sources":["../../../../src/components/context-menu/ContextMenu.types.ts"],"sourcesContent":["import type { CSSProperties, MouseEvent, ReactNode } from 'react';\n\n/**\n * Enum representing the possible alignments for the context menu.\n */\nexport enum ContextMenuAlignment {\n    TopLeft,\n    BottomLeft,\n    TopRight,\n    BottomRight,\n    TopCenter,\n    BottomCenter,\n}\n\n/**\n * Type representing the coordinates for positioning the context menu.\n */\nexport type ContextMenuCoordinates = {\n    /** The x-coordinate. */\n    x: number;\n    /** The y-coordinate. */\n    y: number;\n};\n\n/**\n * Type representing an item in the context menu.\n */\nexport type ContextMenuItem = {\n    /** Optional icons for the item. Can be strings or React nodes. */\n    icons?: string[] | ReactNode;\n    /**\n     * Whether the item is disabled. Disabled items cannot be activated.\n     */\n    isDisabled?: boolean;\n    /**\n     * Reason why the item is disabled. Only shown for disabled items.\n     * Displayed as a tooltip on desktop and a subtitle in the native select dialog on touch devices.\n     */\n    disabledReason?: string;\n    /** Whether the item is selected. */\n    isSelected?: boolean;\n    /** Unique key for the item. */\n    key: string;\n    /** Function called when the item is clicked. */\n    onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n    /** Whether to show a spacer after the item. */\n    shouldShowSpacer?: boolean;\n    /** The text displayed for the item. */\n    text: string;\n};\n\n/**\n * Props for the ContextMenu component.\n */\nexport type ContextMenuProps = {\n    /**\n     * Context menu alignment\n     * @description Optional custom alignment used instead of calculating it using the alignment\n     * within the page. The available alignments can be taken from the ContextMenuAlignment enum.\n     * @example alignment={ContextMenuAlignment.TopLeft}\n     * @optional\n     */\n    alignment?: ContextMenuAlignment;\n    /**\n     * Additional class name applied to the trigger wrapper.\n     * @optional\n     */\n    className?: string;\n    /**\n     * Children element\n     * @description The element over which the content of the ContextMenu should be displayed.\n     * @example children={<Icon icons={['fa fa-paper-clip']} />\n     * @default <Icon icons={['ts-ellipsis_v']} size={18} />\n     * @optional\n     */\n    children?: ReactNode;\n    /**\n     * Container element\n     * @description The element where the content of the ContextMenu should be rendered via React Portal.\n     * @example container={document.body}\n     * @optional\n     */\n    container?: Element;\n    /**\n     * Custom coordinates\n     * @description Optional own coordinates to be used instead of calculating the alignment based\n     * on the alignment of the children.\n     * @example coordinates={{ x: 100, y: 200 }}\n     * @optional\n     */\n    coordinates?: ContextMenuCoordinates;\n    /**\n     * Context menu headline\n     * @description The headline of the context menu. If not provided, no headline will be displayed.\n     * @example headline=\"Options\"\n     * @optional\n     */\n    headline?: string;\n    /**\n     * Menu items\n     * @description The items that will be displayed in the content of the ContextMenu. Custom icon\n     * elements only will be displayed on desktop devices.\n     * @example items={[{ key: '1', text: 'Option 1', onClick: () => {} }]}\n     */\n    items: ContextMenuItem[];\n    /**\n     * Hide callback function\n     * @description Function to be executed when the content of the Context menu has been hidden.\n     * @example onHide={() => console.log('Menu hidden')}\n     * @optional\n     */\n    onHide?: VoidFunction;\n    /**\n     * Show callback function\n     * @description Function to be executed when the content of the Context menu has been shown.\n     * @example onShow={() => console.log('Menu shown')}\n     * @optional\n     */\n    onShow?: VoidFunction;\n    /**\n     * Close on popup click flag\n     * @description Whether the popup should be closed if it is clicked.\n     * @default true\n     * @optional\n     */\n    shouldCloseOnPopupClick?: boolean;\n    /**\n     * Disable click flag\n     * @description Whether the click should be disabled.\n     * @default false\n     * @optional\n     */\n    shouldDisableClick?: boolean;\n    /**\n     * Hide popup arrow flag\n     * @description Whether the arrow of the popup should be hidden.\n     * @default false\n     * @optional\n     */\n    shouldHidePopupArrow?: boolean;\n    /**\n     * Whether the default trigger padding/background styles should be applied.\n     * @description Disable this when the trigger child already provides its own full visual styling.\n     * @default true\n     * @optional\n     */\n    shouldUseDefaultTriggerStyles?: boolean;\n    /**\n     * Show hover effect flag\n     * @description Whether the hover effect should be shown.\n     * @default false\n     * @optional\n     */\n    shouldShowHoverEffect?: boolean;\n    /**\n     * Enables keyboard-only focus highlighting for the trigger.\n     * @default false\n     * @optional\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Inline styles applied to the trigger wrapper.\n     * @optional\n     */\n    style?: CSSProperties;\n    /**\n     * Vertical offset between the trigger element and the context menu.\n     * @description Use this prop to fine-tune the context menu position on the Y axis. Positive and\n     * negative values can be used depending on the desired spacing.\n     * @default 0\n     * @example yOffset={8}\n     * @optional\n     */\n    yOffset?: number;\n    /**\n     * Z-index value\n     * @description The z-index of the popup.\n     * @example zIndex={100}\n     * @default 20\n     * @optional\n     */\n    zIndex?: number;\n    /**\n     * Optional text for the select dialog.\n     */\n    dialogText?: string;\n};\n\n/**\n * Ref interface for the ContextMenu component.\n */\nexport interface ContextMenuRef {\n    /** Hides the context menu. */\n    hide: VoidFunction;\n    /** Shows the context menu. */\n    show: VoidFunction;\n}\n"],"mappings":";;;;;;AAEA;AACA;AACA;AAFA,IAGYA,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;AAShC;AACA;AACA;AAQA;AACA;AACA;AAyBA;AACA;AACA;AAuIA;AACA;AACA","ignoreList":[]}

package/lib/cjs/components/context-menu/ContextMenu.utils.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.selectItem = exports.getDefaultFocusedIndex = exports.getActiveItemIndex = void 0;
-const getDefaultFocusedIndex = items => items.findIndex(item => item.isSelected);
+const getDefaultFocusedIndex = items => items.findIndex(item => item.isSelected && !item.isDisabled);
 exports.getDefaultFocusedIndex = getDefaultFocusedIndex;
 const getActiveItemIndex = ({
   contextMenuContentElement,
@@ -25,6 +25,9 @@ const selectItem = ({
   if (!item) {
     return false;
   }
+  if (item.isDisabled) {
+    return true;
+  }
   void item.onClick();
   if (shouldCloseOnPopupClick) {
     onClose();

package/lib/cjs/components/context-menu/ContextMenu.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.utils.js","names":["getDefaultFocusedIndex","items","findIndex","item","isSelected","exports","getActiveItemIndex","contextMenuContentElement","focusedIndex","activeElement","document","activeItemElement","contains","closest","undefined","Number","dataset","index","selectItem","onClose","shouldCloseOnPopupClick","onClick"],"sources":["../../../../src/components/context-menu/ContextMenu.utils.ts"],"sourcesContent":["import type { ContextMenuItem } from './ContextMenu.types';\n\nexport const getDefaultFocusedIndex = (items: ContextMenuItem[]): number =>\n    items.findIndex((item) => item.isSelected);\n\nexport const getActiveItemIndex = ({\n    contextMenuContentElement,\n    focusedIndex,\n}: {\n    contextMenuContentElement: HTMLDivElement | null;\n    focusedIndex: number;\n}) => {\n    const activeElement = document.activeElement as HTMLElement | null;\n    const activeItemElement = contextMenuContentElement?.contains(activeElement)\n        ? activeElement?.closest<HTMLElement>('[data-index]')\n        : undefined;\n\n    return activeItemElement ? Number(activeItemElement.dataset.index) : focusedIndex;\n};\n\nexport const selectItem = ({\n    index,\n    items,\n    onClose,\n    shouldCloseOnPopupClick,\n}: {\n    index: number;\n    items: ContextMenuItem[];\n    onClose: VoidFunction;\n    shouldCloseOnPopupClick: boolean;\n}) => {\n    const item = items[index];\n\n    if (!item) {\n        return false;\n    }\n\n    void item.onClick();\n\n    if (shouldCloseOnPopupClick) {\n        onClose();\n    }\n\n    return true;\n};\n"],"mappings":";;;;;;AAEO,MAAMA,sBAAsB,GAAIC,KAAwB,IAC3DA,KAAK,CAACC,SAAS,CAAEC,IAAI,IAAKA,IAAI,CAACC,UAAU,CAAC;AAACC,OAAA,CAAAL,sBAAA,GAAAA,sBAAA;AAExC,MAAMM,kBAAkB,GAAGA,CAAC;EAC/BC,yBAAyB;EACzBC;AAIJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAGC,QAAQ,CAACD,aAAmC;EAClE,MAAME,iBAAiB,GAAGJ,yBAAyB,aAAzBA,yBAAyB,eAAzBA,yBAAyB,CAAEK,QAAQ,CAACH,aAAa,CAAC,GACtEA,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEI,OAAO,CAAc,cAAc,CAAC,GACnDC,SAAS;EAEf,OAAOH,iBAAiB,GAAGI,MAAM,CAACJ,iBAAiB,CAACK,OAAO,CAACC,KAAK,CAAC,GAAGT,YAAY;AACrF,CAAC;AAACH,OAAA,CAAAC,kBAAA,GAAAA,kBAAA;AAEK,MAAMY,UAAU,GAAGA,CAAC;EACvBD,KAAK;EACLhB,KAAK;EACLkB,OAAO;EACPC;AAMJ,CAAC,KAAK;EACF,MAAMjB,IAAI,GAAGF,KAAK,CAACgB,KAAK,CAAC;EAEzB,IAAI,CAACd,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EAEA,KAAKA,IAAI,CAACkB,OAAO,CAAC,CAAC;EAEnB,IAAID,uBAAuB,EAAE;IACzBD,OAAO,CAAC,CAAC;EACb;EAEA,OAAO,IAAI;AACf,CAAC;AAACd,OAAA,CAAAa,UAAA,GAAAA,UAAA","ignoreList":[]}
+{"version":3,"file":"ContextMenu.utils.js","names":["getDefaultFocusedIndex","items","findIndex","item","isSelected","isDisabled","exports","getActiveItemIndex","contextMenuContentElement","focusedIndex","activeElement","document","activeItemElement","contains","closest","undefined","Number","dataset","index","selectItem","onClose","shouldCloseOnPopupClick","onClick"],"sources":["../../../../src/components/context-menu/ContextMenu.utils.ts"],"sourcesContent":["import type { ContextMenuItem } from './ContextMenu.types';\n\nexport const getDefaultFocusedIndex = (items: ContextMenuItem[]): number =>\n    items.findIndex((item) => item.isSelected && !item.isDisabled);\n\nexport const getActiveItemIndex = ({\n    contextMenuContentElement,\n    focusedIndex,\n}: {\n    contextMenuContentElement: HTMLDivElement | null;\n    focusedIndex: number;\n}) => {\n    const activeElement = document.activeElement as HTMLElement | null;\n    const activeItemElement = contextMenuContentElement?.contains(activeElement)\n        ? activeElement?.closest<HTMLElement>('[data-index]')\n        : undefined;\n\n    return activeItemElement ? Number(activeItemElement.dataset.index) : focusedIndex;\n};\n\nexport const selectItem = ({\n    index,\n    items,\n    onClose,\n    shouldCloseOnPopupClick,\n}: {\n    index: number;\n    items: ContextMenuItem[];\n    onClose: VoidFunction;\n    shouldCloseOnPopupClick: boolean;\n}) => {\n    const item = items[index];\n\n    if (!item) {\n        return false;\n    }\n\n    if (item.isDisabled) {\n        return true;\n    }\n\n    void item.onClick();\n\n    if (shouldCloseOnPopupClick) {\n        onClose();\n    }\n\n    return true;\n};\n"],"mappings":";;;;;;AAEO,MAAMA,sBAAsB,GAAIC,KAAwB,IAC3DA,KAAK,CAACC,SAAS,CAAEC,IAAI,IAAKA,IAAI,CAACC,UAAU,IAAI,CAACD,IAAI,CAACE,UAAU,CAAC;AAACC,OAAA,CAAAN,sBAAA,GAAAA,sBAAA;AAE5D,MAAMO,kBAAkB,GAAGA,CAAC;EAC/BC,yBAAyB;EACzBC;AAIJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAGC,QAAQ,CAACD,aAAmC;EAClE,MAAME,iBAAiB,GAAGJ,yBAAyB,aAAzBA,yBAAyB,eAAzBA,yBAAyB,CAAEK,QAAQ,CAACH,aAAa,CAAC,GACtEA,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEI,OAAO,CAAc,cAAc,CAAC,GACnDC,SAAS;EAEf,OAAOH,iBAAiB,GAAGI,MAAM,CAACJ,iBAAiB,CAACK,OAAO,CAACC,KAAK,CAAC,GAAGT,YAAY;AACrF,CAAC;AAACH,OAAA,CAAAC,kBAAA,GAAAA,kBAAA;AAEK,MAAMY,UAAU,GAAGA,CAAC;EACvBD,KAAK;EACLjB,KAAK;EACLmB,OAAO;EACPC;AAMJ,CAAC,KAAK;EACF,MAAMlB,IAAI,GAAGF,KAAK,CAACiB,KAAK,CAAC;EAEzB,IAAI,CAACf,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EAEA,IAAIA,IAAI,CAACE,UAAU,EAAE;IACjB,OAAO,IAAI;EACf;EAEA,KAAKF,IAAI,CAACmB,OAAO,CAAC,CAAC;EAEnB,IAAID,uBAAuB,EAAE;IACzBD,OAAO,CAAC,CAAC;EACb;EAEA,OAAO,IAAI;AACf,CAAC;AAACd,OAAA,CAAAa,UAAA,GAAAA,UAAA","ignoreList":[]}

package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _Icon = _interopRequireDefault(require("../../icon/Icon"));
+var _ContextMenuContentItem = _interopRequireDefault(require("./context-menu-content-item/ContextMenuContentItem"));
 var _ContextMenuContent = require("./ContextMenuContent.styles");
 var _ContextMenu = require("../ContextMenu.types");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -48,39 +48,17 @@ const ContextMenuContent = /*#__PURE__*/_react.default.forwardRef(({
   const percentageOffsetY = isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -100 : 0;
   const anchorOffsetY = isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -21 : 21;
   const exitAndInitialY = isTopLeftAlignment || isTopRightAlignment ? -16 : 16;
-  const content = (0, _react.useMemo)(() => items.map(({
-    onClick,
-    key,
-    text,
-    icons,
-    shouldShowSpacer
-  }, index) => {
-    const isFocused = index === focusedIndex;
-    let iconElement = null;
-    if (/*#__PURE__*/(0, _react.isValidElement)(icons)) {
-      iconElement = icons;
-    } else if (Array.isArray(icons) && icons.length > 0) {
-      iconElement = /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemIconWrapper, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
-        icons: icons
-      }));
-    }
-    return /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItem, {
-      key: `context-menu-item-${key}`,
-      "data-index": index
-    }, /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemWrapper, {
-      key: key,
-      onClick: event => {
-        event.preventDefault();
-        event.stopPropagation();
-        void onClick(event);
-      },
-      tabIndex: 0,
-      $shouldHidePopupArrow: shouldHidePopupArrow,
-      $isFocused: isFocused,
-      onFocus: () => onItemFocus(index)
-    }, iconElement, /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemText, null, text)), shouldShowSpacer && /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemSpacer, null));
-  }), [items, focusedIndex, shouldHidePopupArrow, onItemFocus]);
+  const content = (0, _react.useMemo)(() => items.map((item, index) => /*#__PURE__*/_react.default.createElement(_ContextMenuContentItem.default, {
+    key: item.key,
+    item: item,
+    index: index,
+    isFocused: index === focusedIndex,
+    shouldHidePopupArrow: shouldHidePopupArrow,
+    onItemFocus: onItemFocus
+  })), [items, focusedIndex, shouldHidePopupArrow, onItemFocus]);
   return /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledMotionContextMenuContent, {
+    role: "menu",
+    "aria-label": headline,
     animate: {
       opacity: 1,
       y: 0

package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuContent.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_ContextMenuContent","_ContextMenu","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ContextMenuContent","React","forwardRef","alignment","coordinates","items","zIndex","shouldHidePopupArrow","headline","onItemFocus","focusedIndex","onMouseEnter","onMouseLeave","ref","isBottomLeftAlignment","ContextMenuAlignment","BottomLeft","isTopLeftAlignment","TopLeft","isTopRightAlignment","TopRight","isTopCenterAlignment","TopCenter","isBottomCenterAlignment","BottomCenter","percentageOffsetX","useMemo","anchorOffsetX","percentageOffsetY","anchorOffsetY","exitAndInitialY","content","map","onClick","key","text","icons","shouldShowSpacer","index","isFocused","iconElement","isValidElement","Array","isArray","length","createElement","StyledContextMenuContentItemIconWrapper","StyledContextMenuContentItem","StyledContextMenuContentItemWrapper","event","preventDefault","stopPropagation","tabIndex","$shouldHidePopupArrow","$isFocused","onFocus","StyledContextMenuContentItemText","StyledContextMenuContentItemSpacer","StyledMotionContextMenuContent","animate","opacity","y","exit","initial","$position","$zIndex","style","left","x","top","transition","ease","transformTemplate","StyledContextMenuContentHeadline","displayName","_default","exports"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.tsx"],"sourcesContent":["import React, { isValidElement, useMemo } from 'react';\nimport Icon from '../../icon/Icon';\nimport {\n    StyledContextMenuContentHeadline,\n    StyledContextMenuContentItem,\n    StyledContextMenuContentItemIconWrapper,\n    StyledContextMenuContentItemSpacer,\n    StyledContextMenuContentItemText,\n    StyledContextMenuContentItemWrapper,\n    StyledMotionContextMenuContent,\n} from './ContextMenuContent.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuItem,\n} from '../ContextMenu.types';\n\ntype ContextMenuContentProps = {\n    alignment: ContextMenuAlignment;\n    coordinates: ContextMenuCoordinates;\n    items: ContextMenuItem[];\n    shouldHidePopupArrow: boolean;\n    headline?: string;\n    zIndex: number;\n    focusedIndex: number;\n    onItemFocus: (index: number) => void;\n    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\n    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\n};\n\nconst ContextMenuContent = React.forwardRef<HTMLDivElement, ContextMenuContentProps>(\n    (\n        {\n            alignment,\n            coordinates,\n            items,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            onItemFocus,\n            focusedIndex,\n            onMouseEnter,\n            onMouseLeave,\n        },\n        ref,\n    ) => {\n        const isBottomLeftAlignment = alignment === ContextMenuAlignment.BottomLeft;\n        const isTopLeftAlignment = alignment === ContextMenuAlignment.TopLeft;\n        const isTopRightAlignment = alignment === ContextMenuAlignment.TopRight;\n        const isTopCenterAlignment = alignment === ContextMenuAlignment.TopCenter;\n        const isBottomCenterAlignment = alignment === ContextMenuAlignment.BottomCenter;\n\n        const percentageOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return -100;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return -50;\n            }\n\n            return 0;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const anchorOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return 15;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return 0;\n            }\n\n            return -15;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const percentageOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -100 : 0;\n\n        const anchorOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -21 : 21;\n\n        const exitAndInitialY = isTopLeftAlignment || isTopRightAlignment ? -16 : 16;\n\n        const content = useMemo(\n            () =>\n                items.map(({ onClick, key, text, icons, shouldShowSpacer }, index) => {\n                    const isFocused = index === focusedIndex;\n\n                    let iconElement = null;\n\n                    if (isValidElement(icons)) {\n                        iconElement = icons;\n                    } else if (Array.isArray(icons) && icons.length > 0) {\n                        iconElement = (\n                            <StyledContextMenuContentItemIconWrapper>\n                                <Icon icons={icons} />\n                            </StyledContextMenuContentItemIconWrapper>\n                        );\n                    }\n\n                    return (\n                        <StyledContextMenuContentItem\n                            key={`context-menu-item-${key}`}\n                            data-index={index}\n                        >\n                            <StyledContextMenuContentItemWrapper\n                                key={key}\n                                onClick={(event) => {\n                                    event.preventDefault();\n                                    event.stopPropagation();\n                                    void onClick(event);\n                                }}\n                                tabIndex={0}\n                                $shouldHidePopupArrow={shouldHidePopupArrow}\n                                $isFocused={isFocused}\n                                onFocus={() => onItemFocus(index)}\n                            >\n                                {iconElement}\n                                <StyledContextMenuContentItemText>\n                                    {text}\n                                </StyledContextMenuContentItemText>\n                            </StyledContextMenuContentItemWrapper>\n                            {shouldShowSpacer && <StyledContextMenuContentItemSpacer />}\n                        </StyledContextMenuContentItem>\n                    );\n                }),\n            [items, focusedIndex, shouldHidePopupArrow, onItemFocus],\n        );\n\n        return (\n            <StyledMotionContextMenuContent\n                animate={{ opacity: 1, y: 0 }}\n                exit={{ opacity: 0, y: exitAndInitialY }}\n                initial={{ opacity: 0, y: exitAndInitialY }}\n                $position={alignment}\n                $shouldHidePopupArrow={shouldHidePopupArrow}\n                $zIndex={zIndex}\n                ref={ref}\n                style={{ left: coordinates.x, top: coordinates.y }}\n                transition={{ ease: 'anticipate' }}\n                transformTemplate={({ y = '0px' }) => `\n                    translateX(${percentageOffsetX}%)\n                    translateY(${percentageOffsetY}%)\n                    translateX(${anchorOffsetX}px)\n                    translateY(${anchorOffsetY}px)\n                    translateY(${y})\n                `}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n            >\n                {headline && (\n                    <StyledContextMenuContentHeadline>{headline}</StyledContextMenuContentHeadline>\n                )}\n                {content}\n            </StyledMotionContextMenuContent>\n        );\n    },\n);\n\nContextMenuContent.displayName = 'ContextMenuContent';\n\nexport default ContextMenuContent;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ContextMenuContent.js","names":["_react","_interopRequireWildcard","require","_ContextMenuContentItem","_interopRequireDefault","_ContextMenuContent","_ContextMenu","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ContextMenuContent","React","forwardRef","alignment","coordinates","items","zIndex","shouldHidePopupArrow","headline","onItemFocus","focusedIndex","onMouseEnter","onMouseLeave","ref","isBottomLeftAlignment","ContextMenuAlignment","BottomLeft","isTopLeftAlignment","TopLeft","isTopRightAlignment","TopRight","isTopCenterAlignment","TopCenter","isBottomCenterAlignment","BottomCenter","percentageOffsetX","useMemo","anchorOffsetX","percentageOffsetY","anchorOffsetY","exitAndInitialY","content","map","item","index","createElement","key","isFocused","StyledMotionContextMenuContent","role","animate","opacity","y","exit","initial","$position","$shouldHidePopupArrow","$zIndex","style","left","x","top","transition","ease","transformTemplate","StyledContextMenuContentHeadline","displayName","_default","exports"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport ContextMenuContentItem from './context-menu-content-item/ContextMenuContentItem';\nimport {\n    StyledContextMenuContentHeadline,\n    StyledMotionContextMenuContent,\n} from './ContextMenuContent.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuItem,\n} from '../ContextMenu.types';\n\ntype ContextMenuContentProps = {\n    alignment: ContextMenuAlignment;\n    coordinates: ContextMenuCoordinates;\n    items: ContextMenuItem[];\n    shouldHidePopupArrow: boolean;\n    headline?: string;\n    zIndex: number;\n    focusedIndex: number;\n    onItemFocus: (index: number) => void;\n    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\n    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\n};\n\nconst ContextMenuContent = React.forwardRef<HTMLDivElement, ContextMenuContentProps>(\n    (\n        {\n            alignment,\n            coordinates,\n            items,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            onItemFocus,\n            focusedIndex,\n            onMouseEnter,\n            onMouseLeave,\n        },\n        ref,\n    ) => {\n        const isBottomLeftAlignment = alignment === ContextMenuAlignment.BottomLeft;\n        const isTopLeftAlignment = alignment === ContextMenuAlignment.TopLeft;\n        const isTopRightAlignment = alignment === ContextMenuAlignment.TopRight;\n        const isTopCenterAlignment = alignment === ContextMenuAlignment.TopCenter;\n        const isBottomCenterAlignment = alignment === ContextMenuAlignment.BottomCenter;\n\n        const percentageOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return -100;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return -50;\n            }\n\n            return 0;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const anchorOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return 15;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return 0;\n            }\n\n            return -15;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const percentageOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -100 : 0;\n\n        const anchorOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -21 : 21;\n\n        const exitAndInitialY = isTopLeftAlignment || isTopRightAlignment ? -16 : 16;\n\n        const content = useMemo(\n            () =>\n                items.map((item, index) => (\n                    <ContextMenuContentItem\n                        key={item.key}\n                        item={item}\n                        index={index}\n                        isFocused={index === focusedIndex}\n                        shouldHidePopupArrow={shouldHidePopupArrow}\n                        onItemFocus={onItemFocus}\n                    />\n                )),\n            [items, focusedIndex, shouldHidePopupArrow, onItemFocus],\n        );\n\n        return (\n            <StyledMotionContextMenuContent\n                role=\"menu\"\n                aria-label={headline}\n                animate={{ opacity: 1, y: 0 }}\n                exit={{ opacity: 0, y: exitAndInitialY }}\n                initial={{ opacity: 0, y: exitAndInitialY }}\n                $position={alignment}\n                $shouldHidePopupArrow={shouldHidePopupArrow}\n                $zIndex={zIndex}\n                ref={ref}\n                style={{ left: coordinates.x, top: coordinates.y }}\n                transition={{ ease: 'anticipate' }}\n                transformTemplate={({ y = '0px' }) => `\n                    translateX(${percentageOffsetX}%)\n                    translateY(${percentageOffsetY}%)\n                    translateX(${anchorOffsetX}px)\n                    translateY(${anchorOffsetY}px)\n                    translateY(${y})\n                `}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n            >\n                {headline && (\n                    <StyledContextMenuContentHeadline>{headline}</StyledContextMenuContentHeadline>\n                )}\n                {content}\n            </StyledMotionContextMenuContent>\n        );\n    },\n);\n\nContextMenuContent.displayName = 'ContextMenuContent';\n\nexport default ContextMenuContent;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.styles.js

@@ -104,7 +104,9 @@ const StyledMotionContextMenuContent = exports.StyledMotionContextMenuContent =
         z-index: -1;
     }
 `;
-const StyledContextMenuContentItem = exports.StyledContextMenuContentItem = _styledComponents.default.div``;
+const StyledContextMenuContentItem = exports.StyledContextMenuContentItem = _styledComponents.default.div`
+    position: relative;
+`;
 const StyledContextMenuContentItemSpacer = exports.StyledContextMenuContentItemSpacer = _styledComponents.default.div`
     background-color: ${({
   theme
@@ -117,7 +119,12 @@ const StyledContextMenuContentItemWrapper = exports.StyledContextMenuContentItem
     border-radius: ${({
   $shouldHidePopupArrow
 }) => $shouldHidePopupArrow ? '3px' : 0};
-    cursor: pointer;
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default' : 'pointer'};
+    opacity: ${({
+  $isDisabled
+}) => $isDisabled ? 0.5 : 1};
     display: flex;
     gap: 6px;
     margin: ${({
@@ -136,8 +143,9 @@ const StyledContextMenuContentItemWrapper = exports.StyledContextMenuContentItem
 
     &:hover {
         background-color: ${({
+  $isDisabled,
   theme
-}) => theme['secondary-103']};
+}) => $isDisabled ? 'transparent' : theme['secondary-103']};
     }
 `;
 const StyledContextMenuContentItemIconWrapper = exports.StyledContextMenuContentItemIconWrapper = _styledComponents.default.div`

package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuContent.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_ContextMenu","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionContextMenuContent","exports","styled","motion","div","theme","$shouldHidePopupArrow","text","$zIndex","css","$position","ContextMenuAlignment","TopLeft","BottomLeft","TopRight","BottomRight","TopCenter","BottomCenter","undefined","StyledContextMenuContentItem","StyledContextMenuContentItemSpacer","StyledContextMenuContentItemWrapper","$isFocused","StyledContextMenuContentItemIconWrapper","StyledContextMenuContentHeadline","StyledContextMenuContentItemText"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { ContextMenuAlignment } from '../ContextMenu.types';\n\ntype StyledMotionContextMenuContentProps = WithTheme<{\n    $position: ContextMenuAlignment;\n    $zIndex: number;\n    $shouldHidePopupArrow: boolean;\n}>;\n\nexport const StyledMotionContextMenuContent = styled(\n    motion.div,\n)<StyledMotionContextMenuContentProps>`\n    background-color: ${({ theme }: StyledMotionContextMenuContentProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '6px' : '3px')};\n    box-shadow: 1px 3px 8px rgb(0 0 0 / 30%);\n    color: ${({ theme }: StyledMotionContextMenuContentProps) => theme.text};\n    max-width: 500px;\n    pointer-events: all;\n    position: absolute;\n    z-index: ${({ $zIndex }) => $zIndex};\n\n    &::after {\n        background-color: inherit;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n        border-right: 1px solid rgba(0, 0, 0, 0.1);\n        box-shadow: 2px 2px 8px rgb(4 3 4 / 10%);\n        content: '';\n        height: 14px;\n        position: absolute;\n        width: 14px;\n        z-index: -2;\n\n        ${({ $shouldHidePopupArrow }) =>\n            $shouldHidePopupArrow &&\n            css`\n                display: none;\n            `}\n\n        ${({ $position }) => {\n            switch ($position) {\n                case ContextMenuAlignment.TopLeft:\n                    return css`\n                        bottom: -7px;\n                        right: 7px;\n                        transform: rotate(45deg);\n                    `;\n                case ContextMenuAlignment.BottomLeft:\n                    return css`\n                        top: -7px;\n                        right: 7px;\n                        transform: rotate(225deg);\n                    `;\n                case ContextMenuAlignment.TopRight:\n                    return css`\n                        transform: rotate(45deg);\n                        bottom: -7px;\n                        left: 7px;\n                    `;\n                case ContextMenuAlignment.BottomRight:\n                    return css`\n                        transform: rotate(225deg);\n                        top: -7px;\n                        left: 7px;\n                    `;\n                case ContextMenuAlignment.TopCenter:\n                    return css`\n                        bottom: -7px;\n                        right: 45%;\n                        transform: rotate(45deg);\n                    `;\n                case ContextMenuAlignment.BottomCenter:\n                    return css`\n                        transform: rotate(225deg);\n                        top: -7px;\n                        left: 45%;\n                    `;\n\n                default:\n                    return undefined;\n            }\n        }}\n    }\n\n    &::before {\n        background-color: inherit;\n        bottom: 0;\n        content: '';\n        left: 0;\n        position: absolute;\n        right: 0;\n        top: 0;\n        border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '6px' : '3px')};\n        z-index: -1;\n    }\n`;\n\nexport const StyledContextMenuContentItem = styled.div``;\n\ntype StyledContextMenuContentItemSpacerProps = WithTheme<unknown>;\n\nexport const StyledContextMenuContentItemSpacer = styled.div<StyledContextMenuContentItemSpacerProps>`\n    background-color: ${({ theme }) => theme['003']};\n    height: 1px;\n    width: 100%;\n`;\n\ntype StyledContextMenuContentItemWrapperProps = WithTheme<{\n    $shouldHidePopupArrow: boolean;\n    $isFocused: boolean;\n}>;\n\nexport const StyledContextMenuContentItemWrapper = styled.div<StyledContextMenuContentItemWrapperProps>`\n    align-items: center;\n    border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '3px' : 0)};\n    cursor: pointer;\n    display: flex;\n    gap: 6px;\n    margin: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '3px' : 0)};\n    overflow: hidden;\n    padding: 5px 8px;\n    transition: background-color 0.3s ease;\n\n    ${({ $isFocused, theme }) =>\n        $isFocused &&\n        css`\n            background-color: ${theme['secondary-103']};\n        `}\n\n    &:hover {\n        background-color: ${({ theme }: StyledContextMenuContentItemWrapperProps) =>\n            theme['secondary-103']};\n    }\n`;\n\nexport const StyledContextMenuContentItemIconWrapper = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    width: 20px;\n`;\n\nexport const StyledContextMenuContentHeadline = styled.div`\n    width: 100%;\n    margin: 3px 6px;\n    opacity: 50%;\n    font-weight: bold;\n`;\n\nexport const StyledContextMenuContentItemText = styled.div`\n    flex: 0 1 auto;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ContextMenuContent.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_ContextMenu","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionContextMenuContent","exports","styled","motion","div","theme","$shouldHidePopupArrow","text","$zIndex","css","$position","ContextMenuAlignment","TopLeft","BottomLeft","TopRight","BottomRight","TopCenter","BottomCenter","undefined","StyledContextMenuContentItem","StyledContextMenuContentItemSpacer","StyledContextMenuContentItemWrapper","$isDisabled","$isFocused","StyledContextMenuContentItemIconWrapper","StyledContextMenuContentHeadline","StyledContextMenuContentItemText"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { ContextMenuAlignment } from '../ContextMenu.types';\n\ntype StyledMotionContextMenuContentProps = WithTheme<{\n    $position: ContextMenuAlignment;\n    $zIndex: number;\n    $shouldHidePopupArrow: boolean;\n}>;\n\nexport const StyledMotionContextMenuContent = styled(\n    motion.div,\n)<StyledMotionContextMenuContentProps>`\n    background-color: ${({ theme }: StyledMotionContextMenuContentProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '6px' : '3px')};\n    box-shadow: 1px 3px 8px rgb(0 0 0 / 30%);\n    color: ${({ theme }: StyledMotionContextMenuContentProps) => theme.text};\n    max-width: 500px;\n    pointer-events: all;\n    position: absolute;\n    z-index: ${({ $zIndex }) => $zIndex};\n\n    &::after {\n        background-color: inherit;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n        border-right: 1px solid rgba(0, 0, 0, 0.1);\n        box-shadow: 2px 2px 8px rgb(4 3 4 / 10%);\n        content: '';\n        height: 14px;\n        position: absolute;\n        width: 14px;\n        z-index: -2;\n\n        ${({ $shouldHidePopupArrow }) =>\n            $shouldHidePopupArrow &&\n            css`\n                display: none;\n            `}\n\n        ${({ $position }) => {\n            switch ($position) {\n                case ContextMenuAlignment.TopLeft:\n                    return css`\n                        bottom: -7px;\n                        right: 7px;\n                        transform: rotate(45deg);\n                    `;\n                case ContextMenuAlignment.BottomLeft:\n                    return css`\n                        top: -7px;\n                        right: 7px;\n                        transform: rotate(225deg);\n                    `;\n                case ContextMenuAlignment.TopRight:\n                    return css`\n                        transform: rotate(45deg);\n                        bottom: -7px;\n                        left: 7px;\n                    `;\n                case ContextMenuAlignment.BottomRight:\n                    return css`\n                        transform: rotate(225deg);\n                        top: -7px;\n                        left: 7px;\n                    `;\n                case ContextMenuAlignment.TopCenter:\n                    return css`\n                        bottom: -7px;\n                        right: 45%;\n                        transform: rotate(45deg);\n                    `;\n                case ContextMenuAlignment.BottomCenter:\n                    return css`\n                        transform: rotate(225deg);\n                        top: -7px;\n                        left: 45%;\n                    `;\n\n                default:\n                    return undefined;\n            }\n        }}\n    }\n\n    &::before {\n        background-color: inherit;\n        bottom: 0;\n        content: '';\n        left: 0;\n        position: absolute;\n        right: 0;\n        top: 0;\n        border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '6px' : '3px')};\n        z-index: -1;\n    }\n`;\n\nexport const StyledContextMenuContentItem = styled.div`\n    position: relative;\n`;\n\ntype StyledContextMenuContentItemSpacerProps = WithTheme<unknown>;\n\nexport const StyledContextMenuContentItemSpacer = styled.div<StyledContextMenuContentItemSpacerProps>`\n    background-color: ${({ theme }) => theme['003']};\n    height: 1px;\n    width: 100%;\n`;\n\ntype StyledContextMenuContentItemWrapperProps = WithTheme<{\n    $shouldHidePopupArrow: boolean;\n    $isFocused: boolean;\n    $isDisabled: boolean;\n}>;\n\nexport const StyledContextMenuContentItemWrapper = styled.div<StyledContextMenuContentItemWrapperProps>`\n    align-items: center;\n    border-radius: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '3px' : 0)};\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    display: flex;\n    gap: 6px;\n    margin: ${({ $shouldHidePopupArrow }) => ($shouldHidePopupArrow ? '3px' : 0)};\n    overflow: hidden;\n    padding: 5px 8px;\n    transition: background-color 0.3s ease;\n\n    ${({ $isFocused, theme }) =>\n        $isFocused &&\n        css`\n            background-color: ${theme['secondary-103']};\n        `}\n\n    &:hover {\n        background-color: ${({ $isDisabled, theme }) =>\n            $isDisabled ? 'transparent' : theme['secondary-103']};\n    }\n`;\n\nexport const StyledContextMenuContentItemIconWrapper = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    width: 20px;\n`;\n\nexport const StyledContextMenuContentHeadline = styled.div`\n    width: 100%;\n    margin: 3px 6px;\n    opacity: 50%;\n    font-weight: bold;\n`;\n\nexport const StyledContextMenuContentItemText = styled.div`\n    flex: 0 1 auto;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/context-menu/context-menu-content/context-menu-content-item/ContextMenuContentItem.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Icon = _interopRequireDefault(require("../../../icon/Icon"));
+var _Tooltip = _interopRequireDefault(require("../../../tooltip/Tooltip"));
+var _ContextMenuContent = require("../ContextMenuContent.styles");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const ContextMenuContentItem = ({
+  item,
+  index,
+  isFocused,
+  shouldHidePopupArrow,
+  onItemFocus
+}) => {
+  const disabledReasonId = (0, _react.useId)();
+  const [tooltipContainer, setTooltipContainer] = (0, _react.useState)(null);
+  const {
+    icons,
+    text,
+    onClick,
+    isDisabled = false,
+    disabledReason,
+    shouldShowSpacer
+  } = item;
+  let iconElement = null;
+  if (/*#__PURE__*/(0, _react.isValidElement)(icons)) {
+    iconElement = icons;
+  } else if (Array.isArray(icons) && icons.length > 0) {
+    iconElement = /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemIconWrapper, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icons: icons
+    }));
+  }
+  const content = /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemWrapper, {
+    onClick: event => {
+      if (isDisabled) {
+        return;
+      }
+      event.preventDefault();
+      event.stopPropagation();
+      void onClick(event);
+    },
+    tabIndex: 0,
+    role: "menuitem",
+    "aria-disabled": isDisabled,
+    "aria-describedby": isDisabled && disabledReason ? disabledReasonId : undefined,
+    $shouldHidePopupArrow: shouldHidePopupArrow,
+    $isFocused: isFocused,
+    $isDisabled: isDisabled,
+    onFocus: () => onItemFocus(index)
+  }, iconElement, /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemText, null, text));
+  return /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItem, {
+    ref: setTooltipContainer,
+    className: "context-menu-content-item",
+    "data-index": index,
+    "aria-disabled": isDisabled,
+    onClick: isDisabled ? event => event.stopPropagation() : undefined
+  }, isDisabled && disabledReason ? /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+    item: {
+      text: disabledReason
+    },
+    container: tooltipContainer ?? undefined,
+    shouldUseFullWidth: true
+  }, content) : content, isDisabled && disabledReason && /*#__PURE__*/_react.default.createElement("span", {
+    id: disabledReasonId,
+    hidden: true
+  }, disabledReason), shouldShowSpacer && /*#__PURE__*/_react.default.createElement(_ContextMenuContent.StyledContextMenuContentItemSpacer, null));
+};
+var _default = exports.default = ContextMenuContentItem;
+//# sourceMappingURL=ContextMenuContentItem.js.map