Commit Graph

721 Commits

Author SHA1 Message Date
shadcn
28d97b7fc1 fix: github link 2025-03-17 15:10:44 +04:00
Kian Bazza
5085e48241 feat(components): add origin-aware animations (#6945)
This PR adds origin-aware animations to the following components:

- Context menu
- Dropdown menu
- Hover card
- Menu bar
- Popover
- Select
- Tooltip

This is accomplished with the custom property `--radix-<component>-transform-origin`, exposed by Radix on the following components:

For more information on this custom property, see the Radix docs; context menu as an example: https://www.radix-ui.com/primitives/docs/components/context-menu#origin-aware-animations

You can see a side-by-side comparison in the following video:

https://github.com/user-attachments/assets/ad8d548b-eb8d-4818-acb4-73c7cdaecc3f
2025-03-17 11:04:00 +00:00
shadcn
b7afb5aa1e feat(v4): dashboard 02 (#6950)
* feat(v4): dashboard 02

* fix: lint
2025-03-17 15:00:23 +04:00
t.yang
a6e2d3672f fix(sidebar): update type SidebarContext -> SidebarContextProps (#6926)
Hey, I noticed that the original code triggers the `ts/no-redeclare` ESLint error due to the naming conflict between the `SidebarContext` interface and the `SidebarContext` component.

![image](https://github.com/user-attachments/assets/33e6a8de-02bd-43a0-8279-beac8b051602)

I think `ts/no-redeclare` is a pretty common ESLint rule, I renamed the interface to `SidebarContextProps` to avoid the conflict. This naming style is consistent with the `carousel` component: (0f6efb9769/apps/v4/registry/new-york-v4/ui/carousel.tsx (L24)).

Hope this makes sense!
2025-03-14 12:53:22 +00:00
JEM
0f6efb9769 fix(navigation-menu v4): 6888 - Remove "use client" directive (#6913)
Removes unnecessary "use client" directive from navigation menu components to simplify the code and avoid potential issues.

Co-authored-by: shadcn <m@shadcn.com>
2025-03-13 15:03:20 +04:00
shadcn
415b02b4bc docs: add dark mode changelog (#6918)
* docs: dark mode changelog

* docs: add base colors reference
2025-03-13 14:42:19 +04:00
shadcn
f1dd9c6903 feat: update dark mode colors (#6903)
* feat: update dark colors

* feat(v4): update dark mode colors

* fix

* fix

* fix: slate and stone mismatches

* feat(v4): update skeleton and switch colors

* feat(v4): add dashboard example

* fix(v4): update dashboard components

* fix: themes

* feat: update sonner

* feat(v4): update dashboard buttons

* fix: test new colors

* fix: build commands

* feat(v4): more color updates

* feat(v4): update theme selector

* fix(v4): minor component fixes
2025-03-13 13:06:08 +04:00
shadcn
abde54987b chore: create FUNDING.yml 2025-03-12 23:18:49 +04:00
shadcn
79f2498b28 docs(www): add auth section for registry (#6910) 2025-03-12 18:33:36 +04:00
Valentin Gavran
d999f803a8 fix(select): make select content scrollable if height is limited (#6681)
* fix(select): make select content scrollable if height is limited

Select content now becomes scrollable when the browser window height is too small to display the full menu. This improves usability on smaller screens.

Radix also supports the same behavior for other components. I will also submit PRs for the other components separately.

Added the following properties to the Select Content component:

- `max-h-[--radix-select-content-available-height]`
- `overflow-y-auto` & `overflow-x-hidden` instead of `overflow-hidden` (existed before)

* fix(select): make select content scrollable if height is limited

Select content now becomes scrollable when the browser window height is too small to display the full menu. This improves usability on smaller screens.

Radix also supports the same behavior for other components. I will also submit PRs for the other components separately.

Added the following properties to the Select Content component:

- `max-h-[--radix-select-content-available-height]`
- `overflow-y-auto` & `overflow-x-hidden` instead of `overflow-hidden` (existed before)

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-12 11:16:21 +04:00
Valentin Gavran
1d8fe41d64 fix(context-menu): make context menu scrollable if height is limited (#6682)
* fix(context-menu): make context menu scrollable if height is limited

Context menu content now becomes scrollable when the browser window height is too small to display the full menu. This improves usability on smaller screens.

Radix also supports the same behavior for other components. I will also submit PRs for the other components separately.

Added the following properties to the Context Menu Content component:

- `max-h-[--radix-context-menu-content-available-height]`
- `overflow-y-auto` & `overflow-x-hidden` instead of `overflow-hidden` (existed before)

* fix(v4): context menu

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-12 10:48:56 +04:00
Kasper Aamodt
33b6146fde docs(www): fix typo in site-header.tsx (#6897)
Fixed a small typo in the site-header.tsx
2025-03-10 17:41:00 +00:00
shadcn
1d55420629 docs(www): add callout for tailwind v3 2025-03-10 21:15:23 +04:00
shadcn
12d4cf2ab0 Merge branch 'main' of github.com:shadcn-ui/ui 2025-03-06 09:46:06 +04:00
shadcn
5466432b01 docs(www): update registry 2025-03-06 09:45:53 +04:00
Hichem Taboukouyout
f9e4991f15 Add @radix-ui/react-slot dependency to badge registry entry (#6841)
* Add dependency to badge registry entry

Added @radix-ui/react-slot as a dependency for the badge component in the registry. This ensures proper functionality and resolves potential missing dependency issues.

- Updated the "badge" registry entry by including "@radix-ui/react-slot" in its dependencies list.
- Fixed the missing newline at the end of the file for better formatting.

* Revert "Add dependency to badge registry entry"

This reverts commit d12ddaa511.

* Add Radix slot dependency to badge registry entry

Included @radix-ui/react-slot as a dependency for the badge component in the registry. This change ensures the component functions as intended and avoids potential runtime errors.

- Updated "badge" registry entry dependencies list.
- Fixed formatting by adding a missing newline at the file end.

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-05 20:33:53 +04:00
Denish Navadiya
67e7364b3c fix: registry-item-json link (#6485)
Co-authored-by: shadcn <m@shadcn.com>
2025-03-05 20:15:23 +04:00
shadcn
2f6c3e74bb fix(v4): use tailwind var 2025-03-05 16:58:06 +04:00
Valentin Gavran
a106fc5412 fix(dropdown-menu): make dropdown scrollable if height is limited (#6679)
* fix(dropdown-menu): make dropdown content scrollable if height is limited

Dropdown menu content now becomes scrollable when the browser window height is too small to display the full menu. This improves usability on smaller screens.

Radix also supports the same behavior with other components. I will also submit a PR for the other components separately.

* chore: build registry

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-05 16:51:46 +04:00
shadcn
19665adeed feat(shadcn): add --base-color flag (#6864) 2025-03-05 16:14:03 +04:00
omar2205
fc0e8c0c52 use type import in react-hook-form (#4183)
* use type import in react-hook-form

* fix(form): fix type and rebuild registry

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-05 15:34:13 +04:00
shadcn
c16c58d0f9 feat(shadcn): add --template flag (#6863)
* feat(shadcn): add --template flag

* chore: changeset

* fix: type
2025-03-05 15:13:34 +04:00
Kaikai
a3fe5074c1 feat(monorepo): use tailwindcss v4 in monorepo example (#6724)
* feat(monorepo): use tailwindcss v4 in monorepo example

* feat(shadcn): add monorepo tailwind detection

* feat: update default monorepo template

* fix: minor fixes

* chore(shadcn): changeset

* docs(www): update monorepo docs

* docs: updates

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-05 12:07:50 +04:00
shadcn
3baef994d7 feat(v4): add combobox with checkbox example (#6862)
* feat(v4): add combobox with checkbox example

* fix: remove unused checkbox

* fix: rounded
2025-03-05 11:21:07 +04:00
shadcn
a7b3dbf121 feat(www): site updates (#6854)
* feat(www): site updates

* fix: lint

* docs: add tailwind notice
2025-03-04 16:51:58 +04:00
shadcn
26dc03b545 fix: chart and input-otp lint errors (#6853) 2025-03-04 14:00:25 +04:00
shadcn
be3c1a9a98 chore: minor fixes for registry blocks (#6850) 2025-03-04 13:26:40 +04:00
shadcn
418b2d9e14 fix(v4): misc select and tabs fixes (#6836) 2025-03-03 11:56:29 +04:00
JEM
7eb77fb3b9 fix(navigation-menu): 6825 - Update open state styles and remove unused classes (#6827)
* fix(navigation-menu): 6825 - Update open state styles and remove unused classes

Adjusts navigation menu trigger open styles to apply opacity /50 only when not hover/focused.
Removes unused data-[active] and data-[active=true] classes.

Fixes #6825

* Adds data-[active=true] back to NavigationMenuLink component.

Includes text color changes for open/active states to improve UI consistency.

* v3 registry

* v4 registry
2025-03-03 11:56:15 +04:00
Bryan Lee
f759a25354 docs(www): update Tailwind v4 migration guide with CSS and React changes (#6813)
Co-authored-by: shadcn <m@shadcn.com>
2025-03-03 11:53:09 +04:00
JEM
0b288883d2 fix(sidebar, sidebar-16): 6651 - Resolve unnecessary vertical scroll (#6782)
* fix(sidebar, sidebar-16): 6651 - Resolve unnecessary vertical scroll

Includes "label" in registry dependencies for sidebar-16 components.
Adjusts sidebar and sidebar inset dimensions to eliminate unwanted scroll behavior.

Fixes #6651

* chore: build registry

* Add label component to registry and adjust sidebar styles

Adds 'label' component to the registry.
Corrects sidebar styles and layout for better responsiveness.

* fix(sidebar-09): Add missing Label component dependency

Ensures the Label component is included in the registry dependencies for sidebar-09 to prevent missing component errors.

---------

Co-authored-by: shadcn <m@shadcn.com>
2025-03-02 15:33:09 +04:00
Christian Ivicevic
cf4ccb34e2 docs(www): mention to add suppressHydrationWarning in the dark mode docs for next (#5879)
Users have repeatedly run into hydration errors because they don't read the next-themes readme and don't pay attention to the shadcn/ui docs and miss that the `suppressHydrationWarning` prop must be added.

This commit mentions this explicitly and highlights the line in the snippet (as well as fixing the previously wrong highlighting).
2025-03-02 11:27:48 +00:00
shadcn
dc80a326c2 ci: fix stale bot 2025-03-02 15:24:05 +04:00
Lloyd Richards
92e5c7ab2c ci: fix up stale issue handler (#6457)
Co-authored-by: shadcn <m@shadcn.com>
2025-03-02 14:59:26 +04:00
shadcn
d44971b6c2 feat(v4): add products-01 block 2025-02-28 23:14:59 +04:00
shadcn
8539dd6eec fix(shadcn): do not add outline-ring for v3 (#6814)
* fix(shadcn): do not add ring if tailwind v3

* chore: changeset

* test(shadcn): update snapshots
2025-02-28 21:23:08 +04:00
shadcn
bc7df68620 feat(shadcn): install routes for next-pages, laravel and react-router (#6811)
* feat(shadcn): install routes for next-pages, laravel and react-router

* chore: changeset
2025-02-28 18:06:06 +04:00
迷渡
1832f258bd fix(shadcn): Remove duplicate spaces (#6696) 2025-02-28 17:19:28 +04:00
shadcn
e2730f7276 docs(www): update docs for cli, components.json and theming 2025-02-28 16:38:39 +04:00
shadcn
22ba26152a docs(www): update tanstack docs 2025-02-28 16:21:29 +04:00
shadcn
76d6a59f9f docs(www): update all framework docs (#6809)
* docs(www): update all framework docs

* docs(www): update Tailwind v4 docs
2025-02-28 15:53:04 +04:00
shadcn
3a2a87386f fix(v4): badge overflow 2025-02-28 15:44:04 +04:00
shadcn
1822d95883 docs(www): update docs for vite (#6807) 2025-02-28 14:30:10 +04:00
shadcn
f90f5148eb fix(v4): responsive for the demo (#6803)
* fix(v4): responsive

* fix: type

* fix(v4): remove the login link
2025-02-28 13:31:06 +04:00
shadcn
99b0a5ac90 fix(v4): remove login and sandbox links 2025-02-28 13:29:16 +04:00
shadcn
984cb2a1ea feat(v4): update default ring colors 2025-02-28 13:28:17 +04:00
shadcn
fed2bac1d9 Merge branch 'main' of github.com:shadcn-ui/ui 2025-02-27 15:51:17 +04:00
shadcn
1ebfcd7cd9 feat(registry): update sidebars 2025-02-27 15:51:05 +04:00
Keit Oliveira
535a7d9220 fix(form): avoid undefined message error as string (#6729)
Add validation to prevent converting `undefined` error messages to string in the `FormMessage` component.

This fix addresses issues that occur in complex validation structures, such as validating entire objects.

```ts
const formSchema = z.object({
  location: z.object({
    city: z.string().nonempty(),
    state: z.string().nonempty(),
    country: z.string().nonempty(),
  }).superRefine((data, ctx) => {
    ...
  });
```

```tsx
<FormField
  control={form.control}
  name="location"
  render={() => (
    <FormItem>
      <FormField
        control={form.control}
        name="location.city"
        render={({ field }) => (
          <FormItem>
            <FormLabel>City</FormLabel>
            <FormControl>
              <Input placeholder="Enter city" {...field} />
            </FormControl>
          </FormItem>
        )}
      />

      <FormField
        control={form.control}
        name="location.state"
        render={({ field }) => (
          <FormItem>
            <FormLabel>State</FormLabel>
            <FormControl>
              <Input placeholder="Enter state" {...field} />
            </FormControl>
          </FormItem>
        )}
      />

      <FormField
        control={form.control}
        name="location.country"
        render={({ field }) => (
          <FormItem>
            <FormLabel>Country</FormLabel>
            <FormControl>
              <Input placeholder="Enter country" {...field} />
            </FormControl>
          </FormItem>
        )}
      />

      <FormMessage />
    </FormItem>
  )}
/>
```
2025-02-26 20:35:01 +00:00
Cyrus Zei
e7f8cd4566 chore(www): update the user info to use example instead (#6766) 2025-02-26 20:47:23 +04:00