Commit Graph
7 Commits
Author SHA1 Message Date
Joshen Lim 04a11b715a Fix some colors (#47996)
## Context

In the table editor when hovering over a row that has fixed columns, the
wordings could appear like they're overlapping
<img width="339" height="95" alt="image"
src="https://github.com/user-attachments/assets/9de8252c-08fc-4dec-a2f2-21461e47691e"
/>

This is due to the `bg-surface-200` class that gets applied to rows on
hover which use alpha values, hence why it's happening. Opting to use
`bg-200` instead which doesn't have alpha values.

Also small fix for the copy button in `CodeBlock` as well which is
running into the same issue - opting to use a set of colors that doesn't
have alpha values instead.
<img width="127" height="115" alt="image"
src="https://github.com/user-attachments/assets/4d773474-49e0-4c3b-bea1-042ff3102f9c"
/>


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Style**
* Updated table header, row hover, and selected-row background colors
for a more consistent appearance.
* Enhanced the code block copy button’s dark-mode and hover background
styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-16 17:59:50 +08:00
a3f2c4ffc1 chore(deps): upgrade to TypeScript 7 (native compiler) (#47757)
Upgrades the monorepo to TypeScript 7.0.2, released 2026-07-08. `tsc` is
now the native Go compiler
([announcement](https://devblogs.microsoft.com/typescript/announcing-typescript-7-0/))
— full turbo typecheck drops from ~56s to ~19s locally.

TS 7.0 ships **without a programmatic API** (it lands in 7.1), so this
uses Microsoft's recommended side-by-side setup: the `typescript` name
resolves to `@typescript/typescript6` (the 6.0 API republished) for API
consumers — typescript-eslint and Next.js build typechecking — while
`@typescript/native` (the real `typescript@7.0.2`) owns the `tsc` bin
that typecheck scripts run. Exactly one version of each is in the
lockfile; nothing imports the native package as a library. When 7.1 +
tool support lands we can collapse back to a single `typescript` dep in
the catalog.

**Changed:**
- `pnpm-workspace.yaml`: catalog aliases for `typescript` /
`@typescript/native`
- 17 package.json files: `@typescript/native` added beside each
`typescript` dep so every package's `tsc` is the native binary
- `apps/studio/tsconfig.json`: exclude `dist/` (gitignored build output)
from typechecking

**Fixed** (real type errors TS 6 under-reported):
- `packages/ui-patterns` CodeBlock: `borderLeft: null` → `undefined`
(`CSSProperties` doesn't accept null)
- `apps/www` CodeBlock: removed a JSX `@ts-ignore` comment that tsgo
doesn't honor and fixed what it masked (untyped `.js` theme objects,
possibly-undefined highlighter children)

⚠️ **Merge timing:** the new packages are inside pnpm's 3-day
`minimumReleaseAge` window until ~July 11. Installs from the committed
lockfile are unaffected (resolution is skipped), but anything that
forces a re-resolution before then will fail — hold off merging until
the window passes.

Note for editors: the compat package has no `lib/tsserver.js`, so VS
Code's "Use Workspace Version" won't work — use the bundled TS or the
TypeScript Native Preview extension.

## To test

- `pnpm install && pnpm typecheck` — all 15 tasks green, and
`./node_modules/.bin/tsc --version` prints 7.0.2
- `pnpm lint --filter=studio` — typescript-eslint still parses (resolves
the 6.0 API)
- `pnpm build --filter=design-system` (or any Next app) — Next's
tsconfig validation and build typecheck still work
- CodeBlock rendering on www (syntax highlighting, line highlights
with/without border) — the two fixes are behavior-neutral but worth an
eyeball

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Improvements / New Features**
* Enhanced TypeScript tooling support across the workspace for smoother
development builds and checks.

* **Bug Fixes**
  * Code blocks render more reliably when content is empty or missing.
  * Highlighted code line styling applies more consistently.

* **Maintenance**
* Studio TypeScript builds now avoid including generated output (such as
`dist`) during compilation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-07-09 14:07:17 +02:00
Saxon FletcherandClaude Opus 4.8 fb02182e86 Color system (#47288)
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES/NO

## What kind of change does this PR introduce?

Bug fix, feature, docs update, ...

## What is the current behavior?

Please link any relevant issues here.

## What is the new behavior?

Feel free to include screenshots if it includes visual changes.

## Additional context

Add any other context or screenshots.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Refreshed theming across the UI to use modern color expressions and
shared theme variables (including OKLCH-based gradients), improving
consistency for charts, code blocks, overlays, icons, and decorative
backgrounds.
* **Bug Fixes**
* Improved light/dark color and gradient consistency across axis/grid
styling, reference lines, buttons/badges, sidebar accents, loaders, and
other visual components.
* **Documentation**
* Updated styling/theming guidance to align with the revised semantic
token system and the updated theme variable usage patterns.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-03 15:00:43 +10:00
74881cbb73 feat: render the mcp config component as markdown (#47292)
Renders the MCP config component as markdown for static markdown builds.
Currently we have no special case for `<McpConfigPanel />`, so it gets
stripped out during markdown rendering. This adds a static markdown
version of this component that renders all agents/tools consecutively.

Adds a new `McpConfigPanel.md.tsx` component that reuses data structures
used by `McpConfigPanel.tsx` but renders as markdown instead of React.
Instead of building the markdown via string concatenation, we use
[supabase-community/mdast-jsx](https://github.com/supabase-community/mdast-jsx)
which allows you to author markdown using JSX (providing type safety,
better DX, maintainability). E.g.

```jsx
<code lang="json" value='{ "key": "value" }' />
```
produces:
````md
```json
{ "key": "value" }
```
````

## Preview

https://docs-git-feat-mcp-config-markdown-supabase.vercel.app/docs/guides/ai-tools/mcp.md

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## Summary by CodeRabbit

- **New Features**
- Added a docs-only MCP configuration panel with client-specific setup
steps, deep links, and generated configuration snippets.
- Enhanced guide generation to render richer, component-produced
markdown content.

- **Bug Fixes**
- Improved MCP config serialization and display for consistent
JSON/YAML/TOML output.

- **Refactor**
- Centralized MCP client metadata, instruction content, and config
build/serialization logic for reuse.

- **Chores**
- Expanded package exports for MCP URL builder assets and utilities;
improved runtime code-block language validation and updated PNG asset
typing.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Chris Chinchilla <chris@chrischinchilla.com>
Co-authored-by: Chris Chinchilla <chris.ward@supabase.io>
2026-07-02 14:00:33 +02:00
Gildas GarciaandIvan Vasilov 96d43099bb chore: refactor Button API so that it can be used a standard button (#46880)
## Problem

Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.

## Solution

- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code

## How to test

As this is just prop renaming, if it builds it's ok

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-06-16 23:59:58 +02:00
Ivan VasilovandJordi Enric 56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318)
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
2026-04-30 10:53:24 +00:00
Ivan Vasilov ee8eae7309 chore: Clean the ui package from next imports (#44278)
This PR moves several components which rely on `next` out of the `ui`
package to the `ui-patterns` package.

`ui-patterns` package is intented to be imported with specific imports
so it's ok if there are components reliant on `next` in there.

The `SonnerToaster` component has removed its dependency by requiring a
prop for `theme`.
2026-03-30 10:58:37 +02:00