@tuturuuu/ui 0.5.0 → 0.6.0

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # Changelog
 
+## [0.6.0](https://github.com/tutur3u/platform/compare/ui-v0.5.0...ui-v0.6.0) (2026-06-13)
+
+
+### Features
+
+* **finance:** add infinite wallet loading ([76eba7a](https://github.com/tutur3u/platform/commit/76eba7a849c3a6b948e231a1e83e1e2faa10bb16))
+* **finance:** add reconciliation defaults and audited balances ([206f941](https://github.com/tutur3u/platform/commit/206f9416351ade0cfbd1ed822595d44843efbaeb))
+* **finance:** add wallet checkpoint audit history ([11139c7](https://github.com/tutur3u/platform/commit/11139c7e354a8f29e83187748711f6ae39c48e70))
+* **finance:** improve credit wallet support ([3a737fe](https://github.com/tutur3u/platform/commit/3a737fe1f1daf2294ca79a8f0f08f85c69697057))
+* **inventory:** add costing and simulated storefront checkout ([7fcdabb](https://github.com/tutur3u/platform/commit/7fcdabb145e6fa9cc899b563b117e65f7772643a))
+* **inventory:** revamp storefront commerce experience ([72a2bde](https://github.com/tutur3u/platform/commit/72a2bde46a1e6c2815d0b2111fc743373c7bec9b))
+* **tasks:** add compact task dialog AI suggestions ([99058e9](https://github.com/tutur3u/platform/commit/99058e90a4f81153f664eb92fdbacade1e2188c6))
+
+
+### Bug Fixes
+
+* **finance:** improve wallet credit limit and balance ux ([6295d5c](https://github.com/tutur3u/platform/commit/6295d5c0013b2bbe064855712a984d17225d3271))
+* **finance:** reveal wallet audit context on hover ([8b78454](https://github.com/tutur3u/platform/commit/8b784543093243cd44bacec0f0ab59cb4cac7ec7))
+* **inventory:** improve combobox creation and overflow ([a1e1a78](https://github.com/tutur3u/platform/commit/a1e1a78d66384d54b59460f42d04349c4e358cba))
+* **sidebar:** persist collapsed state across refresh ([cb0eb6d](https://github.com/tutur3u/platform/commit/cb0eb6d0d30ecc8b3f3231255f9906e60a895f04))
+* **tasks:** hydrate external dialogs from source workspace ([95a7a23](https://github.com/tutur3u/platform/commit/95a7a23ec8957918cffc81698e8fdc8951adf400))
+* **tasks:** open external task dialogs immediately ([d1535f3](https://github.com/tutur3u/platform/commit/d1535f377cf0d39c5f73d28566322d8dbbdd8331))
+* **tasks:** open task dialogs immediately ([7980e66](https://github.com/tutur3u/platform/commit/7980e66b6a11cd62b9e04ad6d421deee915b2dea))
+* **tasks:** place task title caret at end ([27af729](https://github.com/tutur3u/platform/commit/27af729a673c2bb712819a6d2d95ba0198a558ce))
+* **tasks:** prevent external dialog hydration flash ([8aa7765](https://github.com/tutur3u/platform/commit/8aa7765dfa235c240e2156e404c6255909ec7aee))
+* **tasks:** refine compact task dialog actions ([dcf6b03](https://github.com/tutur3u/platform/commit/dcf6b033f2c134d115d74b53d4b875c16cd7070c))
+* **tasks:** sync task realtime with broadcasts ([8c56154](https://github.com/tutur3u/platform/commit/8c56154e517797dcac0ec0971d8a474b50292706))
+* **ui:** make package graph installable ([f3eb0ff](https://github.com/tutur3u/platform/commit/f3eb0ff3cbed2e43fd77dfb8164e60c5d195a36b))
+
 ## [0.5.0](https://github.com/tutur3u/platform/compare/ui-v0.4.1...ui-v0.5.0) (2026-06-11)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tuturuuu/ui",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -60,36 +60,35 @@
     "@tanstack/react-query": "^5.101.0",
     "@tanstack/react-table": "^8.21.3",
     "@tanstack/react-virtual": "^3.14.2",
-    "@tiptap/core": "3.26.0",
-    "@tiptap/extension-collaboration": "3.26.0",
-    "@tiptap/extension-collaboration-caret": "3.26.0",
-    "@tiptap/extension-drag-handle-react": "3.26.0",
-    "@tiptap/extension-highlight": "3.26.0",
-    "@tiptap/extension-horizontal-rule": "3.26.0",
-    "@tiptap/extension-image": "3.26.0",
-    "@tiptap/extension-link": "3.26.0",
-    "@tiptap/extension-list": "3.26.0",
-    "@tiptap/extension-placeholder": "3.26.0",
-    "@tiptap/extension-strike": "3.26.0",
-    "@tiptap/extension-subscript": "3.26.0",
-    "@tiptap/extension-superscript": "3.26.0",
-    "@tiptap/extension-table": "3.26.0",
-    "@tiptap/extension-table-cell": "3.26.0",
-    "@tiptap/extension-table-header": "3.26.0",
-    "@tiptap/extension-table-row": "3.26.0",
-    "@tiptap/extension-text-align": "3.26.0",
-    "@tiptap/extension-youtube": "3.26.0",
-    "@tiptap/pm": "3.26.0",
-    "@tiptap/react": "3.26.0",
-    "@tiptap/starter-kit": "3.26.0",
+    "@tiptap/core": "3.26.1",
+    "@tiptap/extension-collaboration": "3.26.1",
+    "@tiptap/extension-collaboration-caret": "3.26.1",
+    "@tiptap/extension-drag-handle-react": "3.26.1",
+    "@tiptap/extension-highlight": "3.26.1",
+    "@tiptap/extension-horizontal-rule": "3.26.1",
+    "@tiptap/extension-image": "3.26.1",
+    "@tiptap/extension-link": "3.26.1",
+    "@tiptap/extension-list": "3.26.1",
+    "@tiptap/extension-placeholder": "3.26.1",
+    "@tiptap/extension-strike": "3.26.1",
+    "@tiptap/extension-subscript": "3.26.1",
+    "@tiptap/extension-superscript": "3.26.1",
+    "@tiptap/extension-table": "3.26.1",
+    "@tiptap/extension-table-cell": "3.26.1",
+    "@tiptap/extension-table-header": "3.26.1",
+    "@tiptap/extension-table-row": "3.26.1",
+    "@tiptap/extension-text-align": "3.26.1",
+    "@tiptap/extension-youtube": "3.26.1",
+    "@tiptap/pm": "3.26.1",
+    "@tiptap/react": "3.26.1",
+    "@tiptap/starter-kit": "3.26.1",
     "@tuturuuu/ai": "0.2.1",
-    "@tuturuuu/apis": "0.3.0",
-    "@tuturuuu/hooks": "0.0.1",
-    "@tuturuuu/icons": "0.0.5",
-    "@tuturuuu/internal-api": "0.5.0",
+    "@tuturuuu/apis": "0.4.0",
+    "@tuturuuu/hooks": "0.0.2",
+    "@tuturuuu/icons": "0.0.6",
+    "@tuturuuu/internal-api": "0.7.0",
     "@tuturuuu/supabase": "0.3.3",
-    "@tuturuuu/trigger": "0.2.0",
-    "@tuturuuu/utils": "0.6.0",
+    "@tuturuuu/utils": "0.6.1",
     "@types/debug": "^4.1.13",
     "browser-image-compression": "^2.0.2",
     "class-variance-authority": "^0.7.1",
@@ -109,7 +108,7 @@
     "lodash": "^4.18.1",
     "moment": "^2.30.1",
     "motion": "^12.40.0",
-    "next": "^16.2.7",
+    "next": "^16.2.9",
     "next-intl": "^4.13.0",
     "next-themes": "^0.4.6",
     "nuqs": "^2.8.9",
@@ -136,23 +135,23 @@
     "tiptap-extension-resize-image": "^1.4.3",
     "use-debounce": "^10.1.1",
     "vaul": "^1.1.2",
-    "xlsx": "file:vendor/xlsx-0.20.3.tgz",
+    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
     "y-protocols": "^1.0.7",
     "yjs": "^13.6.31",
     "zod": "^4.4.3"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.3.0",
-    "@tailwindcss/typography": "^0.5.19",
+    "@tailwindcss/typography": "^0.5.20",
     "@tanstack/react-query": "^5.101.0",
     "@tanstack/react-table": "^8.21.3",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
-    "@tuturuuu/types": "0.7.0",
+    "@tuturuuu/types": "0.8.0",
     "@tuturuuu/typescript-config": "0.1.1",
     "@types/html2canvas": "^1.0.0",
     "@types/lodash": "^4.17.24",
-    "@types/node": "^25.9.2",
+    "@types/node": "^25.9.3",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
     "@types/react-resizable": "^4.0.0",
@@ -183,6 +182,10 @@
       "types": "./src/components/ui/button.tsx",
       "import": "./src/components/ui/button.tsx"
     },
+    "./chart": {
+      "types": "./src/components/ui/chart.tsx",
+      "import": "./src/components/ui/chart.tsx"
+    },
     "./command": {
       "types": "./src/components/ui/command.tsx",
       "import": "./src/components/ui/command.tsx"
@@ -207,6 +210,10 @@
       "types": "./src/components/ui/sonner.tsx",
       "import": "./src/components/ui/sonner.tsx"
     },
+    "./storefront": {
+      "types": "./src/components/ui/storefront/index.ts",
+      "import": "./src/components/ui/storefront/index.ts"
+    },
     "./hooks/use-board-actions": "./src/hooks/use-board-actions.ts",
     "./hooks/*": "./src/hooks/*.ts",
     "./hooks/time-blocking-provider": "./src/hooks/time-blocking-provider.tsx",

package/src/components/ui/currency-input.tsx

@@ -50,6 +50,47 @@ function getRoundingUnit(v: number): number {
   return 1;
 }
 
+function escapeRegExp(value: string): string {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function getLocaleNumberSeparators(locale: string) {
+  const parts = new Intl.NumberFormat(locale).formatToParts(1000.1);
+
+  return {
+    decimal: parts.find((part) => part.type === 'decimal')?.value ?? '.',
+    group: parts.find((part) => part.type === 'group')?.value ?? ',',
+  };
+}
+
+function normalizeCurrencyInputText(
+  value: string,
+  separators: ReturnType<typeof getLocaleNumberSeparators>
+) {
+  let normalized = value;
+
+  if (separators.group) {
+    normalized = normalized.replace(
+      new RegExp(escapeRegExp(separators.group), 'g'),
+      ''
+    );
+  }
+
+  if (separators.decimal && separators.decimal !== '.') {
+    normalized = normalized.replace(
+      new RegExp(escapeRegExp(separators.decimal), 'g'),
+      '.'
+    );
+  }
+
+  const numericText = normalized.replace(/[^\d.]/g, '');
+  const [integerPart = '', ...fractionParts] = numericText.split('.');
+
+  if (fractionParts.length === 0) return integerPart;
+
+  return `${integerPart}.${fractionParts.join('')}`;
+}
+
 /**
  * A currency input component that formats numbers while preserving cursor position.
  *
@@ -87,6 +128,10 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
 
     // Expose the input ref
     useImperativeHandle(ref, () => inputRef.current as HTMLInputElement);
+    const localeSeparators = useMemo(
+      () => getLocaleNumberSeparators(locale),
+      [locale]
+    );
 
     // Format number for display (with thousand separators)
     const formatForDisplay = useCallback(
@@ -101,20 +146,17 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
     );
 
     // Parse display string back to number
-    const parseValue = useCallback((str: string): number => {
-      if (!str) return 0;
-      // Remove all non-numeric characters except decimal point
-      // Handle both comma and period as decimal separators
-      const normalized = str
-        .replace(/[^\d.,]/g, '')
-        // If there are both commas and periods, assume the last one is decimal
-        .replace(/,(?=\d{3}(?:[.,]|$))/g, '') // Remove thousand separators (commas followed by 3 digits)
-        .replace(/\.(?=\d{3}(?:[.,]|$))/g, '') // Remove thousand separators (periods followed by 3 digits)
-        .replace(/,/g, '.'); // Convert remaining commas to periods for parsing
-
-      const parsed = parseFloat(normalized);
-      return Number.isNaN(parsed) ? 0 : parsed;
-    }, []);
+    const parseValue = useCallback(
+      (str: string): number => {
+        if (!str) return 0;
+
+        const parsed = parseFloat(
+          normalizeCurrencyInputText(str, localeSeparators)
+        );
+        return Number.isNaN(parsed) ? 0 : parsed;
+      },
+      [localeSeparators]
+    );
 
     // Format the raw input while preserving cursor position
     const formatWithCursor = useCallback(
@@ -122,10 +164,10 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
         rawValue: string,
         cursorPos: number
       ): { formatted: string; newCursor: number } => {
-        // Extract just the numeric characters and decimal
-        const cleanValue = rawValue.replace(/[^\d.]/g, '');
-
-        // Handle multiple decimals - keep only the first
+        const cleanValue = normalizeCurrencyInputText(
+          rawValue,
+          localeSeparators
+        );
         const parts = cleanValue.split('.');
         let normalized = parts[0] || '';
         if (parts.length > 1) {
@@ -162,7 +204,7 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
         // Count how many digits are before the cursor in the original
         let digitsBeforeCursor = 0;
         for (let i = 0; i < cursorPos && i < rawValue.length; i++) {
-          if (/[\d.]/.test(rawValue[i]!)) {
+          if (/[\d.,]/.test(rawValue[i]!)) {
             digitsBeforeCursor++;
           }
         }
@@ -172,7 +214,7 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
         let digitCount = 0;
         for (let i = 0; i < formatted.length; i++) {
           if (digitCount >= digitsBeforeCursor) break;
-          if (/[\d.]/.test(formatted[i]!)) {
+          if (/[\d.,]/.test(formatted[i]!)) {
             digitCount++;
           }
           newCursor = i + 1;
@@ -180,7 +222,7 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
 
         return { formatted, newCursor };
       },
-      [locale, maximumFractionDigits]
+      [locale, localeSeparators, maximumFractionDigits]
     );
 
     // Sync external value to display
@@ -261,8 +303,8 @@ export const CurrencyInput = forwardRef<HTMLInputElement, CurrencyInputProps>(
         return;
       }
 
-      // Allow numbers and decimal point
-      if (/^[\d.]$/.test(e.key)) return;
+      // Allow numbers and common decimal separators
+      if (/^[\d.,]$/.test(e.key)) return;
 
       // Block all other keys
       e.preventDefault();

package/src/components/ui/custom/__tests__/sidebar-context.test.tsx

@@ -0,0 +1,64 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import {
+  SIDEBAR_BEHAVIOR_COOKIE_NAME,
+  SIDEBAR_BEHAVIOR_UPDATED_AT_COOKIE_NAME,
+  SIDEBAR_COOKIE_OPTIONS,
+  SidebarProvider,
+  useSidebar,
+} from '../sidebar-context';
+
+const { mockSetCookie } = vi.hoisted(() => ({
+  mockSetCookie: vi.fn(),
+}));
+
+vi.mock('cookies-next', () => ({
+  setCookie: mockSetCookie,
+}));
+
+vi.mock('../sidebar-remote-behavior-bridge', () => ({
+  SidebarRemoteBehaviorBridge: () => null,
+}));
+
+function SidebarHarness() {
+  const { behavior, handleBehaviorChange } = useSidebar();
+
+  return (
+    <button type="button" onClick={() => handleBehaviorChange('collapsed')}>
+      {behavior}
+    </button>
+  );
+}
+
+describe('SidebarProvider', () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+    mockSetCookie.mockClear();
+  });
+
+  it('writes durable behavior and timestamp cookies for user behavior changes', async () => {
+    vi.spyOn(Date, 'now').mockReturnValue(1_234_567_890);
+
+    render(
+      <SidebarProvider initialBehavior="expanded">
+        <SidebarHarness />
+      </SidebarProvider>
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: 'expanded' }));
+
+    await waitFor(() =>
+      expect(screen.getByRole('button', { name: 'collapsed' })).toBeVisible()
+    );
+    expect(mockSetCookie).toHaveBeenCalledWith(
+      SIDEBAR_BEHAVIOR_COOKIE_NAME,
+      'collapsed',
+      SIDEBAR_COOKIE_OPTIONS
+    );
+    expect(mockSetCookie).toHaveBeenCalledWith(
+      SIDEBAR_BEHAVIOR_UPDATED_AT_COOKIE_NAME,
+      '1234567890',
+      SIDEBAR_COOKIE_OPTIONS
+    );
+  });
+});

package/src/components/ui/custom/__tests__/sidebar-remote-behavior-bridge.test.tsx

@@ -0,0 +1,109 @@
+import { render, waitFor } from '@testing-library/react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { SidebarRemoteBehaviorBridge } from '../sidebar-remote-behavior-bridge';
+
+const { mockConfigState, mockUpdateConfigMutate } = vi.hoisted(() => ({
+  mockConfigState: {
+    remoteBehavior: 'expanded' as string | undefined,
+    remoteLoaded: true,
+  },
+  mockUpdateConfigMutate: vi.fn(),
+}));
+
+vi.mock('@tuturuuu/ui/hooks/use-user-config', () => ({
+  useUpdateUserConfig: () => ({
+    mutate: mockUpdateConfigMutate,
+  }),
+  useUserConfig: () => ({
+    data: mockConfigState.remoteBehavior,
+    isSuccess: mockConfigState.remoteLoaded,
+  }),
+}));
+
+function renderBridge({
+  behavior = 'collapsed',
+  behaviorUpdatedAt = null,
+  localOverride = false,
+  localOverrideVersion = 0,
+  onApplyRemoteBehavior = vi.fn(),
+  onRemoteBehaviorAvailable = vi.fn(),
+  userChangeVersion = 0,
+}: Partial<Parameters<typeof SidebarRemoteBehaviorBridge>[0]> = {}) {
+  render(
+    <SidebarRemoteBehaviorBridge
+      behavior={behavior}
+      behaviorUpdatedAt={behaviorUpdatedAt}
+      localOverride={localOverride}
+      localOverrideVersion={localOverrideVersion}
+      onApplyRemoteBehavior={onApplyRemoteBehavior}
+      onRemoteBehaviorAvailable={onRemoteBehaviorAvailable}
+      userChangeVersion={userChangeVersion}
+    />
+  );
+
+  return { onApplyRemoteBehavior, onRemoteBehaviorAvailable };
+}
+
+describe('SidebarRemoteBehaviorBridge', () => {
+  beforeEach(() => {
+    mockConfigState.remoteBehavior = 'expanded';
+    mockConfigState.remoteLoaded = true;
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('keeps a recent local behavior and persists it over stale remote behavior', async () => {
+    const { onApplyRemoteBehavior } = renderBridge({
+      behavior: 'collapsed',
+      behaviorUpdatedAt: Date.now(),
+    });
+
+    await waitFor(() =>
+      expect(mockUpdateConfigMutate).toHaveBeenCalledWith({
+        configId: 'SIDEBAR_BEHAVIOR',
+        value: 'collapsed',
+      })
+    );
+    expect(onApplyRemoteBehavior).not.toHaveBeenCalled();
+  });
+
+  it('applies stale remote behavior when the local timestamp is stale', async () => {
+    const { onApplyRemoteBehavior } = renderBridge({
+      behavior: 'collapsed',
+      behaviorUpdatedAt: Date.now() - 6 * 60 * 1000,
+    });
+
+    await waitFor(() =>
+      expect(onApplyRemoteBehavior).toHaveBeenCalledWith('expanded')
+    );
+    expect(mockUpdateConfigMutate).not.toHaveBeenCalled();
+  });
+
+  it('applies stale remote behavior when there is no local timestamp', async () => {
+    const { onApplyRemoteBehavior } = renderBridge({
+      behavior: 'collapsed',
+      behaviorUpdatedAt: null,
+    });
+
+    await waitFor(() =>
+      expect(onApplyRemoteBehavior).toHaveBeenCalledWith('expanded')
+    );
+    expect(mockUpdateConfigMutate).not.toHaveBeenCalled();
+  });
+
+  it('does not apply remote behavior while local override is enabled', async () => {
+    const { onApplyRemoteBehavior, onRemoteBehaviorAvailable } = renderBridge({
+      behavior: 'collapsed',
+      behaviorUpdatedAt: null,
+      localOverride: true,
+    });
+
+    await waitFor(() =>
+      expect(onRemoteBehaviorAvailable).toHaveBeenCalledWith('expanded')
+    );
+    expect(onApplyRemoteBehavior).not.toHaveBeenCalled();
+    expect(mockUpdateConfigMutate).not.toHaveBeenCalled();
+  });
+});

package/src/components/ui/custom/combobox.test.tsx

@@ -0,0 +1,141 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeAll, describe, expect, it, vi } from 'vitest';
+import { Combobox } from './combobox';
+
+beforeAll(() => {
+  class ResizeObserverMock {
+    observe() {}
+    unobserve() {}
+    disconnect() {}
+  }
+
+  vi.stubGlobal('ResizeObserver', ResizeObserverMock);
+  window.HTMLElement.prototype.scrollIntoView = vi.fn();
+});
+
+const options = [
+  { label: 'Alpha', value: 'alpha' },
+  { label: 'Beta', value: 'beta' },
+];
+
+function openCombobox() {
+  fireEvent.click(screen.getByRole('combobox'));
+}
+
+describe('Combobox', () => {
+  it('shows create row when the query has no exact normalized match', () => {
+    render(
+      <Combobox
+        createText="Create"
+        onCreate={vi.fn()}
+        options={options}
+        placeholder="Pick item"
+        searchPlaceholder="Search items"
+        selected=""
+      />
+    );
+
+    openCombobox();
+    fireEvent.change(screen.getByPlaceholderText('Search items'), {
+      target: { value: 'Alph' },
+    });
+
+    expect(screen.getByText('Alph')).toBeInTheDocument();
+    expect(screen.getByText('Create')).toBeInTheDocument();
+
+    fireEvent.change(screen.getByPlaceholderText('Search items'), {
+      target: { value: 'Alpha' },
+    });
+
+    expect(screen.queryByText('Create')).not.toBeInTheDocument();
+  });
+
+  it('prevents duplicate async creates and selects returned options', async () => {
+    const onChange = vi.fn();
+    let resolveCreate:
+      | ((value: { label: string; value: string }) => void)
+      | undefined;
+    const onCreate = vi.fn(
+      () =>
+        new Promise<{ label: string; value: string }>((resolve) => {
+          resolveCreate = resolve;
+        })
+    );
+
+    render(
+      <Combobox
+        creatingText="Creating"
+        createText="Create"
+        onChange={onChange}
+        onCreate={onCreate}
+        options={options}
+        placeholder="Pick item"
+        searchPlaceholder="Search items"
+        selected=""
+      />
+    );
+
+    openCombobox();
+    fireEvent.change(screen.getByPlaceholderText('Search items'), {
+      target: { value: 'Gamma' },
+    });
+
+    fireEvent.click(screen.getByText('Gamma'));
+    fireEvent.click(screen.getByText('Gamma'));
+
+    expect(onCreate).toHaveBeenCalledTimes(1);
+    expect(screen.getByText('Creating')).toBeInTheDocument();
+
+    resolveCreate?.({ label: 'Gamma', value: 'gamma' });
+
+    await waitFor(() => expect(onChange).toHaveBeenCalledWith('gamma'));
+  });
+
+  it('selects returned string values from create callbacks', async () => {
+    const onChange = vi.fn();
+
+    render(
+      <Combobox
+        createText="Create"
+        onChange={onChange}
+        onCreate={() => 'delta'}
+        options={options}
+        placeholder="Pick item"
+        searchPlaceholder="Search items"
+        selected=""
+      />
+    );
+
+    openCombobox();
+    fireEvent.change(screen.getByPlaceholderText('Search items'), {
+      target: { value: 'Delta' },
+    });
+    fireEvent.click(screen.getByText('Delta'));
+
+    await waitFor(() => expect(onChange).toHaveBeenCalledWith('delta'));
+  });
+
+  it('keeps action rendering backward compatible', () => {
+    const onSelect = vi.fn();
+
+    render(
+      <Combobox
+        actions={[
+          {
+            key: 'manage',
+            label: 'Manage options',
+            onSelect,
+          },
+        ]}
+        options={options}
+        placeholder="Pick item"
+        selected=""
+      />
+    );
+
+    openCombobox();
+    fireEvent.click(screen.getByText('Manage options'));
+
+    expect(onSelect).toHaveBeenCalledTimes(1);
+  });
+});