@synerise/ds-mocks 0.1.16 → 0.2.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.2.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-mocks@0.1.16...@synerise/ds-mocks@0.2.0) (2026-04-14)
+
+### Features
+
+- **mocks:** add vitest and jest mocks for all 99 DS components ([792e6ed](https://github.com/Synerise/synerise-design/commit/792e6ed1c778cc3f7a231c379650d8e7dbaa6662))
+
 ## [0.1.16](https://github.com/Synerise/synerise-design/compare/@synerise/ds-mocks@0.1.15...@synerise/ds-mocks@0.1.16) (2026-04-10)
 
 **Note:** Version bump only for package @synerise/ds-mocks

package/README.md

@@ -5,23 +5,15 @@ title: Mocks
 
 # @synerise/ds-mocks
 
-Testing utilities and mock components for Synerise Design System.
+Testing utilities and mock components for the Synerise Design System. Provides standardized Vitest and Jest mocks for all `@synerise/ds-*` component packages.
 
 ## Installation
 
 ```bash
-npm i @synerise/ds-mocks
-# or
-yarn add @synerise/ds-mocks
-# or
-pnpm add @synerise/ds-mocks
+pnpm add -D @synerise/ds-mocks
 ```
 
-## Vitest Mocks
-
-This package provides ready-to-use mocks for Synerise DS components in Vitest tests.
-
-### Usage
+## Vitest Usage
 
 Use factory functions with `vi.mock()` and dynamic import to avoid hoisting issues:
 
@@ -36,391 +28,254 @@ vi.mock('@synerise/ds-modal', async () => {
   return { ...modalMockFactory() };
 });
 
-vi.mock('@synerise/ds-icon', async () => {
-  const { iconMockFactory } = await import('@synerise/ds-mocks');
-  return { ...iconMockFactory() };
-});
-
 describe('MyComponent', () => {
-  it('renders button with custom testid', () => {
+  it('renders button', () => {
     render(<MyComponent />);
-
-    // Default testid
     expect(screen.getByTestId('ds-button')).toBeInTheDocument();
-
-    // Or custom testid if passed via props
-    expect(screen.getByTestId('submit-button')).toBeInTheDocument();
   });
 
   it('opens modal on click', () => {
     render(<MyComponent />);
-
     fireEvent.click(screen.getByTestId('ds-button'));
-
     expect(screen.getByTestId('ds-modal')).toBeInTheDocument();
     expect(screen.getByTestId('ds-modal-title')).toHaveTextContent('My Modal');
   });
 });
 ```
 
-### Available Mocks
-
-| Component | Factory Functions                                                        |
-| --------- | ------------------------------------------------------------------------ |
-| Button    | `buttonMockFactory`, `buttonMinimalMockFactory`                          |
-| Cruds     | `crudsMockFactory`, `crudsMinimalMockFactory`                            |
-| Dropdown  | `dropdownMockFactory`, `dropdownMinimalMockFactory`                      |
-| Form      | `formMockFactory`, `formMinimalMockFactory`                              |
-| Icon      | `iconMockFactory`, `iconMinimalMockFactory`, `iconWithRenderMockFactory` |
-| Input     | `inputMockFactory`, `inputMinimalMockFactory`                            |
-| Modal     | `modalMockFactory`, `modalMinimalMockFactory`                            |
-| Select    | `selectMockFactory`, `selectMinimalMockFactory`                          |
-| Table     | `tableMockFactory`, `tableMinimalMockFactory`                            |
-| Tabs      | `tabsMockFactory`, `tabsMinimalMockFactory`                              |
-| Tooltip   | `tooltipMockFactory`, `tooltipMinimalMockFactory`                        |
-
-### Mock Variants
+## Jest Usage
 
-Each component has two factory variants:
-
-#### Standard Mock Factory
+```typescript
+import { jest as dsMocks } from '@synerise/ds-mocks';
 
-Full-featured mock with all props and data-testid support.
+describe('MyComponent', () => {
+  dsMocks.mockButton();
+  dsMocks.mockModal();
 
-```typescript
-vi.mock('@synerise/ds-button', async () => {
-  const { buttonMockFactory } = await import('@synerise/ds-mocks');
-  return { ...buttonMockFactory() };
+  it('renders button', () => {
+    render(<MyComponent />);
+    expect(screen.getByTestId('ds-button')).toBeInTheDocument();
+  });
 });
-
-// Renders actual button element with:
-// - data-testid (default: 'ds-button' or custom)
-// - data-type, data-mode, data-loading attributes
-// - onClick handler
-// - disabled state
 ```
 
-#### Minimal Mock Factory
+## Mock Variants
+
+Each component provides two factory variants:
+
+| Variant | Description | Use case |
+|---------|------------|----------|
+| `{component}MockFactory` | Full mock with props, data-testid, sub-components | Most tests |
+| `{component}MinimalMockFactory` | Returns `null` | When you need the component out of the way |
 
-Returns `null` - useful when you don't need the component rendered.
+### Minimal Mock Example
 
 ```typescript
-vi.mock('@synerise/ds-button', async () => {
-  const { buttonMinimalMockFactory } = await import('@synerise/ds-mocks');
-  return { ...buttonMinimalMockFactory() };
+vi.mock('@synerise/ds-tooltip', async () => {
+  const { tooltipMinimalMockFactory } = await import('@synerise/ds-mocks');
+  return { ...tooltipMinimalMockFactory() };
 });
-
-// Component renders nothing
+// Tooltip renders nothing — useful when testing content without wrapper noise
 ```
 
-### Custom data-testid
+## Custom data-testid
 
-All mocks support custom `data-testid` via props:
+All mocks accept `data-testid` via props. If the component under test passes a custom `data-testid`, the mock will use it; otherwise it falls back to the default `ds-{component}` pattern:
 
 ```tsx
-// In your component:
+// Component passes custom testid:
 <Button data-testid="submit-btn">Submit</Button>
-<Modal data-testid="confirm-modal" open>...</Modal>
-<Icon data-testid="close-icon" icon="CloseM" />
 
-// In tests:
+// Test queries by custom testid:
 screen.getByTestId('submit-btn')
-screen.getByTestId('confirm-modal')
-screen.getByTestId('close-icon')
 ```
 
-### Component-specific Features
-
-#### Modal
-
-Provides additional test ids for internal elements:
-
-- `{testId}-header`
-- `{testId}-title`
-- `{testId}-close`
-- `{testId}-body`
-- `{testId}-footer`
-- `{testId}-ok`
-- `{testId}-cancel`
-
-#### Table
-
-Provides test ids for rows and cells:
-
-- `{testId}-header`
-- `{testId}-row-{index}`
-- `{testId}-cell-{rowIndex}-{colIndex}`
-- `{testId}-checkbox-{index}` (when rowSelection enabled)
-
-#### Form
-
-Mocks the entire `@synerise/ds-form` package including:
-
-- `Form` (default export)
-- `Form.FieldSet`
-- `EditableList`
+## Available Mocks (111 components)
+
+### Simple Components
+
+| Component | Package | Factory | Default test ID |
+|-----------|---------|---------|----------------|
+| ActionArea | `ds-action-area` | `actionAreaMockFactory` | `ds-action-area` |
+| AvatarGroup | `ds-avatar-group` | `avatarGroupMockFactory` | `ds-avatar-group` |
+| Badge | `ds-badge` | `badgeMockFactory` | `ds-badge` |
+| Banner | `ds-banner` | `bannerMockFactory` | `ds-banner` |
+| BroadcastBar | `ds-broadcast-bar` | `broadcastBarMockFactory` | `ds-broadcast-bar` |
+| CodeSnippet | `ds-code-snippet` | `codeSnippetMockFactory` | `ds-code-snippet` |
+| ColorPicker | `ds-color-picker` | `colorPickerMockFactory` | `ds-color-picker` |
+| CompletedWithin | `ds-completed-within` | `completedWithinMockFactory` | `ds-completed-within` |
+| Condition | `ds-condition` | `conditionMockFactory` | `ds-condition` |
+| ContextSelector | `ds-context-selector` | `contextSelectorMockFactory` | `ds-context-selector` |
+| CopyIcon | `ds-copy-icon` | `copyIconMockFactory` | `ds-copy-icon` |
+| Divider | `ds-divider` | `dividerMockFactory` | `ds-divider` |
+| EditableItemsList | `ds-editable-items-list` | `editableItemsListMockFactory` | `ds-editable-items-list` |
+| EmojiPicker | `ds-emoji-picker` | `emojiPickerMockFactory` | `ds-emoji-picker` |
+| EmptyStates | `ds-empty-states` | `emptyStatesMockFactory` | `ds-empty-states` |
+| Estimation | `ds-estimation` | `estimationMockFactory` | `ds-estimation` |
+| FieldSet | `ds-field-set` | `fieldSetMockFactory` | `ds-field-set` |
+| Filter | `ds-filter` | `filterMockFactory` | `ds-filter` |
+| Flag | `ds-flag` | `flagMockFactory` | `ds-flag` |
+| Footer | `ds-footer` | `footerMockFactory` | `ds-footer` |
+| FormatPicker | `ds-format-picker` | `formatPickerMockFactory` | `ds-format-picker` |
+| IconPicker | `ds-icon-picker` | `iconPickerMockFactory` | `ds-icon-picker` |
+| InlineAlert | `ds-inline-alert` | `inlineAlertMockFactory` | `ds-inline-alert` |
+| InputNumber | `ds-input-number` | `inputNumberMockFactory` | `ds-input-number` |
+| Insight | `ds-insight` | `insightMockFactory` | `ds-insight` |
+| ItemFilter | `ds-item-filter` | `itemFilterMockFactory` | `ds-item-filter` |
+| ItemsRoll | `ds-items-roll` | `itemsRollMockFactory` | `ds-items-roll` |
+| Loader | `ds-loader` | `loaderMockFactory` | `ds-loader` |
+| Mapping | `ds-mapping` | `mappingMockFactory` | `ds-mapping` |
+| MetricCard | `ds-metric-card` | `metricCardMockFactory` | `ds-metric-card` |
+| OrderedList | `ds-ordered-list` | `orderedListMockFactory` | `ds-ordered-list` |
+| PageHeader | `ds-page-header` | `pageHeaderMockFactory` | `ds-page-header` |
+| Pagination | `ds-pagination` | `paginationMockFactory` | `ds-pagination` |
+| Panel | `ds-panel` | `panelMockFactory` | `ds-panel` |
+| PanelsResizer | `ds-panels-resizer` | `panelsResizerMockFactory` | `ds-panels-resizer` |
+| Result | `ds-result` | `resultMockFactory` | `ds-result` |
+| SectionMessage | `ds-section-message` | `sectionMessageMockFactory` | `ds-section-message` |
+| ShortCuts | `ds-short-cuts` | `shortCutsMockFactory` | `ds-short-cuts` |
+| SidebarObject | `ds-sidebar-object` | `sidebarObjectMockFactory` | `ds-sidebar-object` |
+| Status | `ds-status` | `statusMockFactory` | `ds-status` |
+| StepCard | `ds-step-card` | `stepCardMockFactory` | `ds-step-card` |
+| Subject | `ds-subject` | `subjectMockFactory` | `ds-subject` |
+| UnorderedList | `ds-unordered-list` | `unorderedListMockFactory` | `ds-unordered-list` |
+
+### Components with Sub-components
+
+| Component | Package | Factory | Sub-components |
+|-----------|---------|---------|---------------|
+| Alert | `ds-alert` | `alertMockFactory` | Toast, SectionMessage, BroadcastBar, IconAlert, InlineAlert, AlertInfo |
+| AppMenu | `ds-app-menu` | `appMenuMockFactory` | + `useMenu`, `useSubMenu` hooks |
+| Avatar | `ds-avatar` | `avatarMockFactory` | UserAvatar, ObjectAvatar, DefaultAvatarIcon |
+| Button | `ds-button` | `buttonMockFactory` | |
+| ButtonGroup | `ds-button-group` | `buttonGroupMockFactory` | ButtonDivider |
+| Card | `ds-card` | `cardMockFactory` | CardGroup, CardBadge, CardSummary |
+| CardSelect | `ds-card-select` | `cardSelectMockFactory` | CardSelectGroup |
+| CardTabs | `ds-card-tabs` | `cardTabsMockFactory` | CardTab |
+| Cascader | `ds-cascader` | `cascaderMockFactory` | Breadcrumb |
+| Checkbox | `ds-checkbox` | `checkboxMockFactory` | Checkbox.Group |
+| Collector | `ds-collector` | `collectorMockFactory` | .Values, .ButtonPanel, .OptionsDropdown, .NavigationHint |
+| Confirmation | `ds-confirmation` | `confirmationMockFactory` | Prompt |
+| Cruds | `ds-cruds` | `crudsMockFactory` | |
+| Description | `ds-description` | `descriptionMockFactory` | DescriptionRow, DescriptionCopyable |
+| Drawer | `ds-drawer` | `drawerMockFactory` | .DrawerHeader, .DrawerHeaderBar, .DrawerBody, .DrawerContent, etc. |
+| Dropdown | `ds-dropdown` | `dropdownMockFactory` | |
+| FileUploader | `ds-file-uploader` | `fileUploaderMockFactory` | AvatarUploader, ItemUploader |
+| FlexBox | `ds-flex-box` | `flexBoxMockFactory` | Flex, Box (named exports, no default) |
+| Form | `ds-form` | `formMockFactory` | Form.FieldSet, EditableList |
+| FormField | `ds-form-field` | `formFieldMockFactory` | FormFieldLabel, ContentAboveElement, ContentBelowElement |
+| Grid | `ds-grid` | `gridMockFactory` | Grid.Item |
+| Icon | `ds-icon` | `iconMockFactory` | |
+| InformationCard | `ds-information-card` | `informationCardMockFactory` | InformationCardPropertyList, InformationCardTooltip |
+| InlineEdit | `ds-inline-edit` | `inlineEditMockFactory` | InlineSelect |
+| Input | `ds-input` | `inputMockFactory` | TextArea |
+| ItemPicker | `ds-item-picker` | `itemPickerMockFactory` | ItemPickerNew, ItemPickerLegacy, ItemPickerList, ItemPickerTrigger |
+| Layout | `ds-layout` | `layoutMockFactory` | Page |
+| List | `ds-list` | `listMockFactory` | List.Item, List.ItemWrapper, List.Divider |
+| ListItem | `ds-list-item` | `listItemMockFactory` | HoverTooltip, GroupItem, ListWrapper, ListContextProvider |
+| Logic | `ds-logic` | `logicMockFactory` | Logic.Matching, Placeholder |
+| ManageableList | `ds-manageable-list` | `manageableListMockFactory` | ContentItem, FilterItem, SimpleItem, AddItem |
+| Menu | `ds-menu` | `menuMockFactory` | Menu.Item, .Breadcrumb, .Header, .Divider, .SubMenu, .ItemGroup |
+| Modal | `ds-modal` | `modalMockFactory` | |
+| Navbar | `ds-navbar` | `navbarMockFactory` | Navbar.Divider |
+| Popconfirm | `ds-popconfirm` | `popconfirmMockFactory` | ConfirmMessage |
+| Popover | `ds-popover` | `popoverMockFactory` | PopoverTrigger, PopoverContent, PopoverArrow, PopoverClose |
+| ProgressBar | `ds-progress-bar` | `progressBarMockFactory` | Multivalue, ProgressTiles |
+| Radio | `ds-radio` | `radioMockFactory` | Radio.Group, Radio.Button |
+| Scrollbar | `ds-scrollbar` | `scrollbarMockFactory` | |
+| Search | `ds-search` | `searchMockFactory` | SearchInput, SearchHeader, SearchItems, SearchButton |
+| Select | `ds-select` | `selectMockFactory` | Option |
+| Sidebar | `ds-sidebar` | `sidebarMockFactory` | Sidebar.Panel, SidebarWithButton |
+| Skeleton | `ds-skeleton` | `skeletonMockFactory` | CheckboxSkeleton, DropdownSkeleton, OrderedListSkeleton, SkeletonAvatar |
+| Sortable | `ds-sortable` | `sortableMockFactory` | SortableContainer, useSortable, arrayMove |
+| Stepper | `ds-stepper` | `stepperMockFactory` | Stepper.Step |
+| SubtleForm | `ds-subtle-form` | `subtleFormMockFactory` | .TextArea, .Input, .Select, .DatePicker, .Field |
+| Switch | `ds-switch` | `switchMockFactory` | RawSwitch |
+| Table | `ds-table` | `tableMockFactory` | |
+| TableNew | `ds-table-new` | `tableNewMockFactory` | VirtualTable |
+| Tabs | `ds-tabs` | `tabsMockFactory` | |
+| Tag | `ds-tag` | `tagMockFactory` | TagShape, useDefaultTexts |
+| Tags | `ds-tags` | `tagsMockFactory` | AddTags |
+| Toolbar | `ds-toolbar` | `toolbarMockFactory` | ToolbarGroup, ToolbarButton, ToolbarLabel, ToolbarDivider |
+| Tooltip | `ds-tooltip` | `tooltipMockFactory` | |
+| Tray | `ds-tray` | `trayMockFactory` | TrayProvider, useTray |
+| Typography | `ds-typography` | `typographyMockFactory` | Title, Text, Paragraph, Description, ErrorText, Label, macro |
+| Wizard | `ds-wizard` | `wizardMockFactory` | Wizard.OnModal |
+
+### Complex Components (imperative APIs)
+
+| Component | Package | Factory | API mocked |
+|-----------|---------|---------|-----------|
+| CodeArea | `ds-code-area` | `codeAreaMockFactory` | Monaco Editor replaced with textarea |
+| DatePicker | `ds-date-picker` | `datePickerMockFactory` | + RawDatePicker, DayPicker, MonthPicker, YearPicker, TimePicker |
+| DateRangePicker | `ds-date-range-picker` | `dateRangePickerMockFactory` | + 4 filter types, TimeWindow, utils, CONST, fnsFormat |
+| Factors | `ds-factors` | `factorsMockFactory` | + factorTypes, ALL_FACTOR_TYPES |
+| Slider | `ds-slider` | `sliderMockFactory` | Handles single value + range mode |
+| TimePicker | `ds-time-picker` | `timePickerMockFactory` | + AM, PM, HOUR_12, HOUR, CLOCK_MODES constants |
+| Toast | `ds-toast` | `toastMockFactory` | showToast, dismissToast, removeToast + Toast.success/error/info/warning |
+
+## Component-specific Features
+
+### Modal
+
+Test IDs: `{testId}-header`, `{testId}-title`, `{testId}-close`, `{testId}-body`, `{testId}-footer`, `{testId}-ok`, `{testId}-cancel`
+
+### Table
+
+Test IDs: `{testId}-header`, `{testId}-row-{index}`, `{testId}-cell-{rowIndex}-{colIndex}`, `{testId}-checkbox-{index}`
+
+### Form
+
+Mocks `Form`, `Form.FieldSet`, and `EditableList`. Test IDs: `ds-fieldset`, `ds-editable-list`, `ds-editable-list-row-{index}`, `ds-editable-list-add`
+
+### Toast (imperative API)
 
 ```typescript
-vi.mock('@synerise/ds-form', async () => {
-  const { formMockFactory } = await import('@synerise/ds-mocks');
-  return { ...formMockFactory() };
+vi.mock('@synerise/ds-toast', async () => {
+  const { toastMockFactory } = await import('@synerise/ds-mocks');
+  return { ...toastMockFactory() };
 });
 
-// Test ids:
-// - ds-fieldset, ds-fieldset-heading, ds-fieldset-description
-// - ds-editable-list, ds-editable-list-header, ds-editable-list-rows
-// - ds-editable-list-row-{index}, ds-editable-list-delete-{index}, ds-editable-list-add
+// Test imperative calls
+import { showToast, dismissToast } from '@synerise/ds-toast';
+showToast('success', { message: 'Saved' }); // returns 'mock-toast-id'
+Toast.success({ message: 'Saved' }); // static method
+dismissToast('mock-toast-id');
 ```
 
-#### Tooltip
-
-Factory accepts options parameter:
+### Tooltip (with content)
 
 ```typescript
 vi.mock('@synerise/ds-tooltip', async () => {
   const { tooltipMockFactory } = await import('@synerise/ds-mocks');
   return { ...tooltipMockFactory({ showContent: true })() };
 });
-
-// Now you can test tooltip content
-screen.getByTestId('ds-tooltip-content');
-screen.getByTestId('ds-tooltip-title');
 ```
 
-#### Icon
-
-Additional factory for custom render:
+### Icon (custom render)
 
 ```typescript
-// Standard mock
-vi.mock('@synerise/ds-icon', async () => {
-  const { iconMockFactory } = await import('@synerise/ds-mocks');
-  return { ...iconMockFactory() };
-});
-
-// Custom render function
 vi.mock('@synerise/ds-icon', async () => {
   const { iconWithRenderMockFactory } = await import('@synerise/ds-mocks');
   return { ...iconWithRenderMockFactory(({ icon }) => <span>{icon}</span>)() };
 });
 ```
 
-### TypeScript Support
+## TypeScript Support
 
 All mocks export their prop types:
 
 ```typescript
-import type {
-  MockButtonProps,
-  MockIconProps,
-  MockModalProps,
-  MockTableProps,
-  // ... etc
-} from '@synerise/ds-mocks';
+import type { MockButtonProps, MockModalProps, MockTableProps } from '@synerise/ds-mocks';
 ```
 
-## Jest Mocks
-
-This package also provides mocks for Jest test framework.
-
-### Usage
-
-```typescript
-import { jest as dsMocks } from '@synerise/ds-mocks';
-import { render, screen, fireEvent } from '@testing-library/react';
-
-describe('MyComponent', () => {
-  // Call mocks at the top level of describe block
-  dsMocks.mockButton();
-  dsMocks.mockModal();
-  dsMocks.mockIcon();
-
-  it('renders button with custom testid', () => {
-    render(<MyComponent />);
-
-    // Default testid
-    expect(screen.getByTestId('ds-button')).toBeInTheDocument();
-
-    // Or custom testid if passed via props
-    expect(screen.getByTestId('submit-button')).toBeInTheDocument();
-  });
-
-  it('opens modal on click', () => {
-    render(<MyComponent />);
-
-    fireEvent.click(screen.getByTestId('ds-button'));
-
-    expect(screen.getByTestId('ds-modal')).toBeInTheDocument();
-    expect(screen.getByTestId('ds-modal-title')).toHaveTextContent('My Modal');
-  });
-});
-```
-
-### Available Jest Mocks
-
-| Component | Mock Functions                                      |
-| --------- | --------------------------------------------------- |
-| Button    | `mockButton`, `mockButtonMinimal`                   |
-| Cruds     | `mockCruds`, `mockCrudsMinimal`                     |
-| Dropdown  | `mockDropdown`, `mockDropdownMinimal`               |
-| Form      | `mockForm`, `mockFormMinimal`                       |
-| Icon      | `mockIcon`, `mockIconMinimal`, `mockIconWithRender` |
-| Input     | `mockInput`, `mockInputMinimal`                     |
-| Modal     | `mockModal`, `mockModalMinimal`                     |
-| Select    | `mockSelect`, `mockSelectMinimal`                   |
-| Table     | `mockTable`, `mockTableMinimal`                     |
-| Tabs      | `mockTabs`, `mockTabsMinimal`                       |
-| Tooltip   | `mockTooltip`, `mockTooltipMinimal`                 |
-
-### Jest TypeScript Support
-
-All Jest mocks export their prop types:
-
-```typescript
-import type {
-  MockButtonProps,
-  MockIconProps,
-  MockModalProps,
-  MockTableProps,
-  // ... etc
-} from '@synerise/ds-mocks/jest';
-```
-
-## DS Components Coverage
-
-### Available Mocks
-
-- [x] Button (`@synerise/ds-button`)
-- [x] Cruds (`@synerise/ds-cruds`)
-- [x] Dropdown (`@synerise/ds-dropdown`)
-- [x] Form (`@synerise/ds-form`) - includes Form.FieldSet and EditableList
-- [x] Icon (`@synerise/ds-icon`)
-- [x] Input (`@synerise/ds-input`) - includes TextArea
-- [x] Modal (`@synerise/ds-modal`)
-- [x] Select (`@synerise/ds-select`) - includes Option
-- [x] Table (`@synerise/ds-table`)
-- [x] Tabs (`@synerise/ds-tabs`)
-- [x] Tooltip (`@synerise/ds-tooltip`)
-
-### Pending Mocks (TODO)
-
-- [ ] ActionArea (`@synerise/ds-action-area`)
-- [ ] Alert (`@synerise/ds-alert`)
-- [ ] AppMenu (`@synerise/ds-app-menu`)
-- [ ] Autocomplete (`@synerise/ds-autocomplete`)
-- [ ] Avatar (`@synerise/ds-avatar`)
-- [ ] AvatarGroup (`@synerise/ds-avatar-group`)
-- [ ] Badge (`@synerise/ds-badge`)
-- [ ] Banner (`@synerise/ds-banner`)
-- [ ] Block (`@synerise/ds-block`)
-- [ ] BroadcastBar (`@synerise/ds-broadcast-bar`)
-- [ ] ButtonGroup (`@synerise/ds-button-group`)
-- [ ] Card (`@synerise/ds-card`)
-- [ ] CardSelect (`@synerise/ds-card-select`)
-- [ ] CardTabs (`@synerise/ds-card-tabs`)
-- [ ] Cascader (`@synerise/ds-cascader`)
-- [ ] Checkbox (`@synerise/ds-checkbox`)
-- [ ] CheckboxTristate (`@synerise/ds-checkbox-tristate`)
-- [ ] CodeArea (`@synerise/ds-code-area`)
-- [ ] CodeSnippet (`@synerise/ds-code-snippet`)
-- [ ] Collector (`@synerise/ds-collector`)
-- [ ] ColorPicker (`@synerise/ds-color-picker`)
-- [ ] ColumnManager (`@synerise/ds-column-manager`)
-- [ ] CompletedWithin (`@synerise/ds-completed-within`)
-- [ ] Condition (`@synerise/ds-condition`)
-- [ ] Confirmation (`@synerise/ds-confirmation`)
-- [ ] ContextSelector (`@synerise/ds-context-selector`)
-- [ ] CopyIcon (`@synerise/ds-copy-icon`)
-- [ ] DataFormat (`@synerise/ds-data-format`)
-- [ ] DatePicker (`@synerise/ds-date-picker`)
-- [ ] DateRangePicker (`@synerise/ds-date-range-picker`)
-- [ ] Description (`@synerise/ds-description`)
-- [ ] Divider (`@synerise/ds-divider`)
-- [ ] Drawer (`@synerise/ds-drawer`)
-- [ ] EditableItemsList (`@synerise/ds-editable-items-list`)
-- [ ] EmojiPicker (`@synerise/ds-emoji-picker`)
-- [ ] EmptyStates (`@synerise/ds-empty-states`)
-- [ ] Estimation (`@synerise/ds-estimation`)
-- [ ] Factors (`@synerise/ds-factors`)
-- [ ] FieldSet (`@synerise/ds-field-set`)
-- [ ] FileUploader (`@synerise/ds-file-uploader`)
-- [ ] Filter (`@synerise/ds-filter`)
-- [ ] Flag (`@synerise/ds-flag`)
-- [ ] FlexBox (`@synerise/ds-flex-box`)
-- [ ] Footer (`@synerise/ds-footer`)
-- [ ] FormField (`@synerise/ds-form-field`)
-- [ ] FormatPicker (`@synerise/ds-format-picker`)
-- [ ] Grid (`@synerise/ds-grid`)
-- [ ] IconPicker (`@synerise/ds-icon-picker`)
-- [ ] InformationCard (`@synerise/ds-information-card`)
-- [ ] InlineAlert (`@synerise/ds-inline-alert`)
-- [ ] InlineEdit (`@synerise/ds-inline-edit`)
-- [ ] InputNumber (`@synerise/ds-input-number`)
-- [ ] Insight (`@synerise/ds-insight`)
-- [ ] ItemFilter (`@synerise/ds-item-filter`)
-- [ ] ItemPicker (`@synerise/ds-item-picker`)
-- [ ] ItemsRoll (`@synerise/ds-items-roll`)
-- [ ] Layout (`@synerise/ds-layout`)
-- [ ] List (`@synerise/ds-list`)
-- [ ] ListItem (`@synerise/ds-list-item`)
-- [ ] Loader (`@synerise/ds-loader`)
-- [ ] Logic (`@synerise/ds-logic`)
-- [ ] ManageableList (`@synerise/ds-manageable-list`)
-- [ ] Mapping (`@synerise/ds-mapping`)
-- [ ] Menu (`@synerise/ds-menu`)
-- [ ] MetricCard (`@synerise/ds-metric-card`)
-- [ ] Navbar (`@synerise/ds-navbar`)
-- [ ] Operators (`@synerise/ds-operators`)
-- [ ] OrderedList (`@synerise/ds-ordered-list`)
-- [ ] PageHeader (`@synerise/ds-page-header`)
-- [ ] Pagination (`@synerise/ds-pagination`)
-- [ ] Panel (`@synerise/ds-panel`)
-- [ ] PanelsResizer (`@synerise/ds-panels-resizer`)
-- [ ] Popconfirm (`@synerise/ds-popconfirm`)
-- [ ] Popover (`@synerise/ds-popover`)
-- [ ] ProgressBar (`@synerise/ds-progress-bar`)
-- [ ] Radio (`@synerise/ds-radio`)
-- [ ] Result (`@synerise/ds-result`)
-- [ ] Scrollbar (`@synerise/ds-scrollbar`)
-- [ ] Search (`@synerise/ds-search`)
-- [ ] SearchBar (`@synerise/ds-search-bar`)
-- [ ] SectionMessage (`@synerise/ds-section-message`)
-- [ ] ShortCuts (`@synerise/ds-short-cuts`)
-- [ ] Sidebar (`@synerise/ds-sidebar`)
-- [ ] SidebarObject (`@synerise/ds-sidebar-object`)
-- [ ] Skeleton (`@synerise/ds-skeleton`)
-- [ ] Slider (`@synerise/ds-slider`)
-- [ ] Sortable (`@synerise/ds-sortable`)
-- [ ] Status (`@synerise/ds-status`)
-- [ ] StepCard (`@synerise/ds-step-card`)
-- [ ] Stepper (`@synerise/ds-stepper`)
-- [ ] Subject (`@synerise/ds-subject`)
-- [ ] SubtleForm (`@synerise/ds-subtle-form`)
-- [ ] Switch (`@synerise/ds-switch`)
-- [ ] Tag (`@synerise/ds-tag`)
-- [ ] Tags (`@synerise/ds-tags`)
-- [ ] TimePicker (`@synerise/ds-time-picker`)
-- [ ] Toast (`@synerise/ds-toast`)
-- [ ] Toolbar (`@synerise/ds-toolbar`)
-- [ ] Tray (`@synerise/ds-tray`)
-- [ ] Typography (`@synerise/ds-typography`)
-- [ ] UnorderedList (`@synerise/ds-unordered-list`)
-- [ ] Wizard (`@synerise/ds-wizard`)
-
 ## Requirements
 
-### Vitest
-
-- Vitest with `globals: true` in config
-- React 16.8+ or 17+ or 18+
-- `@testing-library/react` (recommended)
-
-### Jest
-
-- Jest 27+ or 28+ or 29+
-- React 16.8+ or 17+ or 18+
-- `@testing-library/react` (recommended)
+- **Vitest**: `globals: true` in config
+- **Jest**: 27+
+- **React**: 16.8+ / 17+ / 18+
+- **@testing-library/react** (recommended)
 
 ## License
 
-MIT
+ISC

package/dist/ActionArea/index.d.ts

@@ -0,0 +1 @@
+export * from './vi';

package/dist/ActionArea/index.js

@@ -0,0 +1,5 @@
+import { actionAreaMinimalMockFactory, actionAreaMockFactory } from "./vi.js";
+export {
+  actionAreaMinimalMockFactory,
+  actionAreaMockFactory
+};

package/dist/ActionArea/jest.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+const mockActionArea = () => {
+  jest.mock("@synerise/ds-action-area", () => ({
+    __esModule: true,
+    default: jest.fn(({
+      children,
+      className,
+      "data-testid": dataTestId
+    }) => /* @__PURE__ */ jsx("div", { className: `ds-action-area ${className || ""}`, "data-testid": dataTestId || "ds-action-area", children }))
+  }));
+};
+const mockActionAreaMinimal = () => {
+  jest.mock("@synerise/ds-action-area", () => ({
+    __esModule: true,
+    default: jest.fn(() => null)
+  }));
+};
+export {
+  mockActionArea,
+  mockActionAreaMinimal
+};

package/dist/ActionArea/vi.d.ts

@@ -0,0 +1,10 @@
+import { ActionAreaProps } from '@synerise/ds-action-area';
+export type MockActionAreaProps = ActionAreaProps & {
+    'data-testid'?: string;
+};
+export declare const actionAreaMockFactory: () => {
+    default: any;
+};
+export declare const actionAreaMinimalMockFactory: () => {
+    default: any;
+};