Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions .changeset/item-show-actions-on-hover.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
---
"@cube-dev/ui-kit": minor
---

Add `showActionsOnHover` prop to Item component. When enabled, actions are hidden by default and revealed smoothly on hover, focus, or focus-within states using opacity transitions. This provides a cleaner interface while keeping actions easily accessible without content shifting.

2 changes: 1 addition & 1 deletion .cursor/rules/documentation.mdc
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
description: When updating the component documentation file *.docs.mdx
description: When creating or updating the component documentation file *.docs.mdx
alwaysApply: false
---
# Component Documentation Guidelines
Expand Down
6 changes: 3 additions & 3 deletions .cursor/rules/storybook.mdc
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
---
description: When updating storybook files and documentatino files *.stories.tsx, *.docs.mdx
description: When creating or updating storybook files and documentatino files *.stories.tsx, *.docs.mdx
alwaysApply: false
---
## Imports

### Stories Files (.stories.tsx)
- Import types: `import type { Meta, StoryObj } from '@storybook/react-vite';`
- Import `StoryFn` for custom template functions
- For interactive tests: `import { userEvent, within } from 'storybook/test';` (NOT from `@testing-library/react`)
- For interactive tests: `import { userEvent, within } from '@storybook/test';` (NOT from `@testing-library/react`)

### Documentation Files (.docs.mdx)
- `import { Meta, Canvas, Story, Controls } from '@storybook/addon-docs/blocks';`
Expand Down Expand Up @@ -103,7 +103,7 @@ export const Interactive: StoryObj = {
};
```

**Important:** Always import `userEvent` and `within` from `'storybook/test'` in story files. This ensures they respect Storybook's configuration (e.g., `testIdAttribute: 'data-qa'` set in `.storybook/preview.jsx`). Do NOT use `@testing-library/react` imports in stories.
**Important:** Always import `userEvent` and `within` from `'@storybook/test'` in story files. This ensures they respect Storybook's configuration (e.g., `testIdAttribute: 'data-qa'` set in `.storybook/preview.jsx`). Do NOT use `@testing-library/react` imports in stories.

## MDX Documentation Structure

Expand Down
2 changes: 1 addition & 1 deletion .storybook/preview.jsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { configure } from '@storybook/test';
import isChromatic from 'chromatic/isChromatic';
import { config } from 'react-transition-group';
import { configure } from 'storybook/test';

import { Root } from '../src';

Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@
"@react-stately/utils": "^3.10.8",
"@react-types/shared": "^3.31.0",
"@sparticuz/chromium": "^137.0.1",
"@storybook/test": "^8.6.14",
"@tabler/icons-react": "^3.31.0",
"@tanstack/react-virtual": "^3.13.12",
"@trivago/prettier-plugin-sort-imports": "^5.2.2",
Expand Down
143 changes: 137 additions & 6 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 7 additions & 1 deletion src/components/actions/CommandMenu/CommandMenu.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,10 @@
import {
expect,
findByRole,
userEvent,
waitFor,
within,
} from '@storybook/test';
import {
IconArrowBack,
IconArrowForward,
Expand All @@ -11,7 +18,6 @@ import {
IconSelect,
} from '@tabler/icons-react';
import React, { useState } from 'react';
import { expect, findByRole, userEvent, waitFor, within } from 'storybook/test';

import { EditIcon, TrashIcon } from '../../../icons';
import { tasty } from '../../../tasty';
Expand Down
Loading
Loading