From e9f2610d84b06b5cbcbcbb1758128b88ee128575 Mon Sep 17 00:00:00 2001 From: Jim Fung Date: Mon, 31 Aug 2026 21:03:47 +0200 Subject: [PATCH] fix(ui): resolve code-review findings across existing primitives Bugs: - sidebar: write the state cookie via document.cookie (Cookie Store API is unavailable in Firefox/Safari/non-secure contexts) and align the useMediaQuery md breakpoint with Tailwind's 768px so the 768-799px window no longer mixes desktop layout with mobile state - toggle-group: stop defaulting variant/size on the group so per-item props win; the group still renders its default look when unset - menu/context-menu: emit data-inset only when inset is set; the presence selector matched data-inset="false" and applied inset padding - combobox: merge triggerProps/clearProps className via cn instead of letting the spread drop the positioning classes - empty: EmptyMedia no longer spreads props on both the wrapper and the inner icon element (duplicate ids, double-fired handlers) - button: keep type="button" when render is a native button, and use aria-disabled (focusable, pointer-blocked) instead of an invalid disabled attribute for non-button renders - autocomplete: move popup visuals onto the Popup element so the enter/exit animations actually run, and add the missing exit states to Popover Consistency and conventions: - toolbar: honor orientation=vertical with flex-col - alert-dialog: drop the popup focus outline; Header/Footer support render like their dialog/sheet/drawer counterparts - accordion: apply consumer className to the panel element - radio-group: align items to the start like checkbox-group - group: fix the cn import path, default data-orientation, and flip GroupSeparator inside vertical groups - preview-card: use the preview-card-popup data-slot, expose side, add PreviewCardCreateHandle; add SheetCreateHandle - add missing data-slot attributes (checkbox-group, meter, scroll-area, field-control, field-validity) - remove dead utility classes in command, drawer, sheet, otp-field --- apps/ui/content/docs/(root)/changelog.mdx | 8 +++ .../registry/default/hooks/use-media-query.ts | 2 +- apps/ui/registry/default/ui/accordion.tsx | 7 ++- apps/ui/registry/default/ui/alert-dialog.tsx | 60 +++++++++++-------- apps/ui/registry/default/ui/autocomplete.tsx | 16 ++--- apps/ui/registry/default/ui/button.tsx | 11 ++-- .../ui/registry/default/ui/checkbox-group.tsx | 1 + apps/ui/registry/default/ui/combobox.tsx | 6 +- apps/ui/registry/default/ui/command.tsx | 2 +- apps/ui/registry/default/ui/context-menu.tsx | 8 +-- apps/ui/registry/default/ui/drawer.tsx | 2 +- apps/ui/registry/default/ui/empty.tsx | 5 +- apps/ui/registry/default/ui/field.tsx | 15 +++-- apps/ui/registry/default/ui/group.tsx | 6 +- apps/ui/registry/default/ui/menu.tsx | 8 +-- apps/ui/registry/default/ui/meter.tsx | 1 + apps/ui/registry/default/ui/otp-field.tsx | 4 +- apps/ui/registry/default/ui/popover.tsx | 2 +- apps/ui/registry/default/ui/preview-card.tsx | 8 ++- apps/ui/registry/default/ui/radio-group.tsx | 2 +- apps/ui/registry/default/ui/scroll-area.tsx | 1 + apps/ui/registry/default/ui/sheet.tsx | 5 +- apps/ui/registry/default/ui/sidebar.tsx | 9 +-- apps/ui/registry/default/ui/toggle-group.tsx | 15 ++--- apps/ui/registry/default/ui/toolbar.tsx | 2 +- packages/ui/src/components/accordion.tsx | 7 ++- packages/ui/src/components/alert-dialog.tsx | 60 +++++++++++-------- packages/ui/src/components/autocomplete.tsx | 16 ++--- packages/ui/src/components/button.tsx | 11 ++-- packages/ui/src/components/checkbox-group.tsx | 1 + packages/ui/src/components/combobox.tsx | 6 +- packages/ui/src/components/command.tsx | 2 +- packages/ui/src/components/context-menu.tsx | 8 +-- packages/ui/src/components/drawer.tsx | 2 +- packages/ui/src/components/empty.tsx | 5 +- packages/ui/src/components/field.tsx | 15 +++-- packages/ui/src/components/group.tsx | 4 +- packages/ui/src/components/menu.tsx | 8 +-- packages/ui/src/components/meter.tsx | 1 + packages/ui/src/components/otp-field.tsx | 4 +- packages/ui/src/components/popover.tsx | 2 +- packages/ui/src/components/preview-card.tsx | 8 ++- packages/ui/src/components/radio-group.tsx | 2 +- packages/ui/src/components/scroll-area.tsx | 1 + packages/ui/src/components/sheet.tsx | 5 +- packages/ui/src/components/sidebar.tsx | 9 +-- packages/ui/src/components/toggle-group.tsx | 15 ++--- packages/ui/src/components/toolbar.tsx | 2 +- packages/ui/src/hooks/use-media-query.ts | 2 +- packages/ui/tsconfig.tsbuildinfo | 2 +- 50 files changed, 232 insertions(+), 172 deletions(-) diff --git a/apps/ui/content/docs/(root)/changelog.mdx b/apps/ui/content/docs/(root)/changelog.mdx index 650b81ec5..e1262673d 100644 --- a/apps/ui/content/docs/(root)/changelog.mdx +++ b/apps/ui/content/docs/(root)/changelog.mdx @@ -3,6 +3,14 @@ title: Changelog description: Breaking changes, migration guides, and notable updates. --- +## August 31, 2026 + +### Existing component fixes + +**`Sidebar`** now writes its state cookie through `document.cookie` — the previous Cookie Store API call is unavailable in Firefox, Safari, and non-secure contexts — and its mobile breakpoint now matches Tailwind's `md` (768px) instead of 800px. **`ToggleGroup`** no longer forces `variant="default"` / `size="default"` into item context, so per-item `variant` and `size` props are honored. **`Menu`** and **`Context Menu`** items no longer emit `data-inset="false"`, which matched Tailwind's presence selector and incorrectly applied inset padding. + +Also in this batch: `AlertDialog`'s popup no longer shows a focus outline and its Header/Footer support the `render` prop; `ComboboxInput` merges consumer `className` from `triggerProps`/`clearProps` instead of letting the spread drop its positioning classes; `Toolbar` stacks vertically with `orientation="vertical"`; `Button` keeps `type="button"` when `render={