dima/supabase

0 Fork 0

mirror of https://github.com/supabase/supabase.git synced 2026-10-19 16:19:10 +03:00

Files

T

Danny White 3960e6ac41 chore(deps): bump lucide-react to v1 (#51770 )

## Problem

Lucide React v1 improves screen reader behaviour (icons are hidden from
assistive tech by default). It also removes brand icons such as GitHub.
We were still on Lucide 0.x across the monorepo.

## Solution

- Move every workspace onto one shared Lucide React v1 version via the
pnpm catalog.
- But Lucide React v1 [deprecated brand
icons](https://github.com/lucide-icons/lucide/blob/main/BRAND_LOGOS_STATEMENT.md)
- Meaning we need to handle any _old_ brand icons we used from Lucide
0.x.
- Luckily, that was just `GitHubIcon`. So...
- Add a `GithubIcon` in `packages/ui` that matches Lucide’s previous
GitHub icon, and use it wherever we imported GitHub from Lucide.
- No other Lucide brand icons were in use.
- Studio “Continue with GitHub” sign-in still uses the existing SVG
asset (`github-icon.svg`), not this component.
- Keep the `Icon` suffix import style [recently
introduced](https://github.com/supabase/supabase/pull/51659)
- Monorepo apps now use `catalog` Lucide React v1.

## Review instructions

1. Open [Studio
preview](https://studio-staging-git-dnywh-bump-lucide-react-v1-supabase.vercel.app/dashboard/org)
on a project that is connected to GitHub:
- Project home → Activity stats “GitHub” row
- Org project list → GitHub badge on a connected project card/row
- Branches → GitHub link on a branch row, or “Sync with a GitHub branch”
- Project Settings → Integrations → GitHub integration panel
2. Open
[/kb/guides/sample-guide](https://supabase.com/kb/guides/sample-guide) →
confirm “Go to the GitHub discussion” shows the icon.
3. Open
[/docs/reference/javascript](https://supabase.com/docs/reference/javascript)
→ confirm the header GitHub control still shows the icon. Or
[/docs/guides/troubleshooting/rls-simplified-BJTcS8](https://supabase.com/docs/guides/troubleshooting/rls-simplified-BJTcS8)
→ “View discussion on GitHub”.

2026-10-15 23:00:55 +00:00

build/css

docs(design-system): rewrite sidebar page for monorepo tokens (#51165 )

2026-10-07 10:36:41 +11:00

scripts

chore: Remove dead code and unused files from the packages/ui (#45169 )

2026-04-24 10:30:35 +02:00

src

chore(deps): bump lucide-react to v1 (#51770 )

2026-10-15 23:00:55 +00:00

.gitignore

remove Next/Link deps

2023-06-26 01:08:20 +08:00

components.json

chore: Expand prettier commands to also run on packages (#32550 )

2025-01-03 16:23:32 +01:00

index.tsx

chore(deps): bump lucide-react to v1 (#51770 )

2026-10-15 23:00:55 +00:00

package.json

chore(deps): bump lucide-react to v1 (#51770 )

2026-10-15 23:00:55 +00:00

README.md

chore: migrate from clsx + tailwind-merge to shadcn-ui/cn (#49938 )

2026-09-07 21:35:06 +08:00

tailwind.config.css

chore: Migrate the main Tailwind JS config to CSS (#45686 )

2026-05-13 13:14:58 +02:00

tsconfig.json

chore: Bump Typescript to v6 (#44204 )

2026-03-26 15:27:35 +01:00

vitest.config.ts

Add coveralls integration (#35424 )

2025-05-08 12:23:37 +02:00

vitest.setup.ts

chire: Sort imports in all packages, cms, design-system and ui-library apps (#41610 )

2026-02-05 13:54:10 +01:00

README.md

`packages/ui`

Supabase's shared React component library. Built on Radix UI primitives and shadcn/ui, styled with Tailwind CSS, and used across all Supabase apps.

Usage

Import from the 'ui' package alias:

import { Badge, Button, Input } from 'ui'

Some of the components have the _Shadcn_ suffix. These components should be preferred, they're in a process of replacing the other ones.

Utilities

// deep object merge (used for themes)
import { clipboard, cn, mergeDeep } from 'ui' // Tailwind class merging (shadcn-ui/cn)

// copy-to-clipboard helper

Styling conventions

Tailwind only — no inline styles or CSS modules.
Prefer shadcn semantic pairs (bg-card text-card-foreground, bg-muted text-muted-foreground, bg-tertiary text-tertiary-foreground) over hardcoded colors. Legacy utilities such as text-foreground-light and border-default are compatibility aliases only.
Control surface roles (bg-field, bg-control-raised, border-control-hover; CSS --control aliases raised) live in build/css/source/semantic.css. Prefer those over inventing fills. Legacy bg-control is still the accent wash alias.
Themes set the core --hue (or the split --surface-hue / --primary-hue), --chroma, --surface, --foreground-lightness, and --contrast inputs, plus their --muted-foreground-level and --tertiary-foreground-level hierarchy. Semantic colors are derived from them in OKLCH; --contrast: 1 is the baseline and the supported adjustment range is 0.75 to 1.25.
The workspace root owns the actual tailwind.config.js. The file in this package is a stub for IntelliSense only.