Compare commits

...
Author SHA1 Message Date
e8ceada600 chore(deps): update https://data.forgejo.org/actions/checkout action to v7
Some checks failed
renovate/stability-days Updates have met minimum release age requirement
Dependency builds / Build & Lint (pull_request) Failing after 6s
2026-08-20 22:01:25 +03:00
98a6dde805
Update workflows
All checks were successful
/ deploy-and-package (push) Successful in 17s
2026-08-20 20:58:40 +02:00
e4c2d705e8
feat(mobile): add safe area padding
All checks were successful
/ deploy-and-package (push) Successful in 1m16s
2026-08-11 20:36:07 +02:00
56891acfe2
chore(deps): update codebase
All checks were successful
/ deploy-and-package (push) Successful in 1m22s
2026-08-10 22:33:54 +02:00
2f93b682eb
Merge remote-tracking branch 'refs/remotes/origin/main' 2026-08-10 22:33:33 +02:00
25fd556c3d
feat(legal): add privacy policy notice 2026-08-10 22:33:27 +02:00
5a2fd1b3ec Merge pull request 'chore(deps): lock file maintenance' (#17) from renovate/lock-file-maintenance into main
All checks were successful
/ deploy-and-package (push) Successful in 1m16s
2026-08-10 00:07:28 +02:00
03325797bf
fix(markdown): replace annotation with edited indicator
Some checks failed
/ deploy-and-package (push) Has been cancelled
2026-08-10 00:07:22 +02:00
5b52e1ae29 chore(deps): lock file maintenance
Some checks failed
renovate/stability-days Updates have not met minimum release age requirement
Dependency builds / Build & Lint (pull_request) Failing after 49s
2026-08-10 00:02:40 +02:00
5e2120906e
feat(markdown): add code fencing for ??++
All checks were successful
/ deploy-and-package (push) Successful in 1m17s
2026-08-09 23:56:58 +02:00
f50e7e9b71
feat(markdown): add ??++
All checks were successful
/ deploy-and-package (push) Successful in 1m17s
2026-08-09 23:41:51 +02:00
b48e346001
feat(code-block): last-minute styling
All checks were successful
/ deploy-and-package (push) Successful in 1m18s
2026-08-09 23:22:24 +02:00
358d2a26a0
feat(code-block): last-minute styling
All checks were successful
/ deploy-and-package (push) Successful in 1m18s
2026-08-09 23:20:12 +02:00
dcebbd0943
fix(markdown): respect emoji tooltip option
All checks were successful
/ deploy-and-package (push) Successful in 1m18s
2026-08-09 23:02:49 +02:00
33 changed files with 216 additions and 390 deletions

View file

@ -4,7 +4,6 @@ on:
pull_request:
env:
NIX_CONFIG: experimental-features = nix-command flakes
FORGEJO_TOKEN: ""
GITHUB_TOKEN: ""
@ -14,8 +13,7 @@ jobs:
name: Build & Lint
runs-on: nixos
steps:
- run: nix profile add nixpkgs#nodejs_24
- uses: https://data.forgejo.org/actions/checkout@v4
- uses: https://data.forgejo.org/actions/checkout@v7
with:
persist-credentials: false
- run: nix develop .#electron --command pnpm install --frozen-lockfile

View file

@ -14,7 +14,7 @@ jobs:
run: nix profile add nixpkgs#nodejs_24 nixpkgs#pnpm nixpkgs#rsync nixpkgs#jq nixpkgs#gnused
- name: Check out repo
uses: https://data.forgejo.org/actions/checkout@v4
uses: https://data.forgejo.org/actions/checkout@v7
- name: Install dependencies
run: pnpm install --frozen-lockfile

View file

@ -3,37 +3,3 @@
```sh
pnpm install https://git.methanium.net/methanium/ui/releases/download/latest/methanium-ui.tgz
```
## Markdown
The renderer is available from the package root. The live editor, compact text
renderer, and emoji APIs use the `@methanium/ui/markdown` entry point.
```tsx
import { Markdown } from "@methanium/ui";
import {
EmojiProvider,
Input,
createEmojiRegistry,
} from "@methanium/ui/markdown";
const registry = createEmojiRegistry({
customEmojis: [
{
shortcode: ":party_parrot:",
aliases: [":parrot_party:"],
src: "/emoji/party-parrot.webp",
},
],
});
<EmojiProvider registry={registry}>
<Input value={value} setValue={setValue} />
<Markdown content={value} />
</EmojiProvider>;
```
Custom shortcodes and aliases must be unique and may not collide with built-in
Twemoji names. Twemoji graphics are bundled locally and do not use a CDN. The
graphics are provided by the [Twemoji project](https://github.com/jdecked/twemoji)
under CC-BY 4.0; code is licensed under MIT.

View file

@ -2,7 +2,10 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
/>
<meta name="theme-color" content="#111827" />
<title>Methanium UI Showcase</title>
</head>

View file

@ -17,6 +17,7 @@ import {
SelectValue,
Sidebar,
SidebarContent,
SidebarFooter,
SidebarGroup,
SidebarGroupContent,
SidebarInset,
@ -205,6 +206,15 @@ export default function App() {
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
<SidebarFooter>
<a
href="https://legal.methanium.net/methanium/privacy-policy"
target="_blank"
className="hover:underline"
>
Privacy Policy
</a>
</SidebarFooter>
</Sidebar>
<SidebarInset>

View file

@ -28,7 +28,7 @@ const markdownContent = [
"",
"Shortcodes use local Twemoji assets :fire: :white_check_mark:, while applications can register their own images :methanium:.",
"",
"Visit the [Methanium repository](https://github.com/methanium) or jump to the [code examples](#code-examples). Bare URLs are supported too: https://example.com.",
"Visit the [Methanium](https://methanium.net) or jump to the [code examples](#code-examples). Bare URLs are supported too: https://example.com.",
"",
"![Methanium logo](" + methaniumLogo + ")",
"",

View file

@ -1,6 +1,6 @@
{
"name": "@methanium/ui",
"version": "0.0.23",
"version": "0.0.29",
"type": "module",
"main": "./dist/index.js",
"types": "./dist/index.d.ts",
@ -66,8 +66,8 @@
"emojibase-data": "^17.0.0",
"hast-util-to-jsx-runtime": "^2.3.6",
"input-otp": "^1.4.2",
"katex": "^0.18.2",
"lucide-react": "^1.30.0",
"katex": "^0.18.3",
"lucide-react": "^1.31.0",
"next-themes": "^0.4.6",
"react-markdown": "^10.1.0",
"react-resizable-panels": "^4.12.2",
@ -80,7 +80,7 @@
"remark-math": "^6.0.0",
"shadcn": "^4.16.2",
"shiki": "^4.4.2",
"sonner": "^2.0.7",
"sonner": "^2.0.8",
"tailwind-merge": "^3.6.0",
"tw-animate-css": "^1.4.0",
"unist-util-visit": "^5.1.0",

362
pnpm-lock.yaml generated
View file

@ -10,7 +10,7 @@ importers:
dependencies:
'@base-ui/react':
specifier: ^1.7.0
version: 1.7.0(@date-fns/tz@1.5.0)(@types/react@19.2.18)(date-fns@4.4.0)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
version: 1.7.0(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
'@codemirror/autocomplete':
specifier: ^6.20.3
version: 6.20.3
@ -57,11 +57,11 @@ importers:
specifier: ^1.4.2
version: 1.4.2(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
katex:
specifier: ^0.18.2
version: 0.18.2
specifier: ^0.18.3
version: 0.18.3
lucide-react:
specifier: ^1.30.0
version: 1.30.0(react@19.2.8)
specifier: ^1.31.0
version: 1.31.0(react@19.2.8)
next-themes:
specifier: ^0.4.6
version: 0.4.6(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
@ -79,7 +79,7 @@ importers:
version: 4.12.2(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
recharts:
specifier: 3.10.1
version: 3.10.1(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react-is@19.2.7)(react@19.2.8)(redux@5.0.1)
version: 3.10.1(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react-is@19.2.8)(react@19.2.8)(redux@5.0.1)
rehype-autolink-headings:
specifier: ^7.1.0
version: 7.1.0
@ -105,8 +105,8 @@ importers:
specifier: ^4.4.2
version: 4.4.2
sonner:
specifier: ^2.0.7
version: 2.0.7(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
specifier: ^2.0.8
version: 2.0.8(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
tailwind-merge:
specifier: ^3.6.0
version: 3.6.0
@ -146,7 +146,7 @@ importers:
version: 7.0.2
vite:
specifier: ^8.2.1
version: 8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0)
version: 8.2.1(@types/node@26.2.0)(jiti@2.7.0)
apps/showcase:
dependencies:
@ -165,7 +165,7 @@ importers:
version: 10.0.1(eslint@10.8.1(jiti@2.7.0))
'@tailwindcss/vite':
specifier: ^4.3.3
version: 4.3.3(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0))
version: 4.3.3(vite@8.2.1(@types/node@26.2.0)(jiti@2.7.0))
'@types/node':
specifier: ^26.2.0
version: 26.2.0
@ -180,7 +180,7 @@ importers:
version: typescript@7.0.2
'@vitejs/plugin-react':
specifier: ^6.0.5
version: 6.0.5(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0))
version: 6.0.5(vite@8.2.1(@types/node@26.2.0)(jiti@2.7.0))
eslint:
specifier: ^10.8.1
version: 10.8.1(jiti@2.7.0)
@ -201,7 +201,7 @@ importers:
version: 8.66.0(@typescript/typescript6@6.0.2)(eslint@10.8.1(jiti@2.7.0))
vite:
specifier: ^8.2.1
version: 8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0)
version: 8.2.1(@types/node@26.2.0)(jiti@2.7.0)
packages:
@ -395,9 +395,6 @@ packages:
'@codemirror/view@6.43.8':
resolution: {integrity: sha512-qtItTDssZ/5GFfi94hrILu9j/VUeFPDPkhovEfmWFj2ipTxnzPB8DdHgfbb8HYTzLTYhrndKmyQxXUz/PDLenw==}
'@date-fns/tz@1.5.0':
resolution: {integrity: sha512-lwYN/vDPeNRULcepoE/LO2Pgx+7/RV+S9ARfbc9lr2DtGkOD7pAiruHvbR1RX3Qyf6ja47EWJDMsNK5vK08DJg==}
'@dotenvx/dotenvx@1.75.1':
resolution: {integrity: sha512-/BITOC9dmS/edY2zQwZNicQ059O6RKabtQfyEafV0nGtfYRNHYy1DIPiYVcov40+tob9hfmBnbR963dS+EQ1DQ==}
hasBin: true
@ -405,162 +402,6 @@ packages:
'@dotenvx/primitives@0.8.0':
resolution: {integrity: sha512-VYJy0uhFm9zTJ1TxBaW/pA8bjbOM/OttaNMwZ1RHG4JKyRG7DhSdiqD1ipQoAyoD22olUtxbP78W9xY3Wd11bg==}
'@esbuild/aix-ppc64@0.28.1':
resolution: {integrity: sha512-Svl7tq8k/08+p6CXPpRjQ1fKX+1odH/BQbb48fV6fj3CWHhsoIOoY87w1oHXm0qEpkIK3ZfVgp0hed3XBXzXMQ==}
engines: {node: '>=18'}
cpu: [ppc64]
os: [aix]
'@esbuild/android-arm64@0.28.1':
resolution: {integrity: sha512-34EGEbCIAgosYz6goLcopX6Mo7NyGv9tfwEM2/7Ce2VcVRk568iSvniGWcUXIy7wEDR1wzolcxcriFVrWYcwBg==}
engines: {node: '>=18'}
cpu: [arm64]
os: [android]
'@esbuild/android-arm@0.28.1':
resolution: {integrity: sha512-0k2F129Xdio1TdJfzJ8sy1Q47vUD2NnwdhiAf7drUN1EBTfPf4hsFCtmMgu/6m8JSzsBrlmVjudMBQqOfG8usQ==}
engines: {node: '>=18'}
cpu: [arm]
os: [android]
'@esbuild/android-x64@0.28.1':
resolution: {integrity: sha512-dbwY7ltSMDWsRatcRpCnES4F+im88OCUgGZjy52shC7GqHRE/cYlxNbB4Z4UpJswpcc4Qxd2oE/ufM0p61IKng==}
engines: {node: '>=18'}
cpu: [x64]
os: [android]
'@esbuild/darwin-arm64@0.28.1':
resolution: {integrity: sha512-TZbWkQY7kvTAXbXUT7uVACR5cMHsDiSz9z7ZKAX/RTq/WJEk3QyRr0wZpNhBDX+/0CtdqUIJlOiodQcta6tY3Q==}
engines: {node: '>=18'}
cpu: [arm64]
os: [darwin]
'@esbuild/darwin-x64@0.28.1':
resolution: {integrity: sha512-zfdzgK9ACBNZLI/CyHTOx81SyNbM6YXn7rxSgX97VjyiPl9W1i4Ka4fgKECEoFCKGpvBj5qArWIGgQjOwkgskQ==}
engines: {node: '>=18'}
cpu: [x64]
os: [darwin]
'@esbuild/freebsd-arm64@0.28.1':
resolution: {integrity: sha512-wG2EA8ENdEI0qhkSZMjfqrdY+ziCYCPMmtZjjIwOmXFjmyzEHn+UUxk5of+SYsjtfs3VpnlC7QLzSI5hY/rOAw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [freebsd]
'@esbuild/freebsd-x64@0.28.1':
resolution: {integrity: sha512-i7dZ9vQgnvSCzi/rYCXNgtF/U+eKZNJBzu3eTQbRgHnM7tNSizLOkRFAl3qzVc/Op/u5YkHHa4pf/3DOYHthLQ==}
engines: {node: '>=18'}
cpu: [x64]
os: [freebsd]
'@esbuild/linux-arm64@0.28.1':
resolution: {integrity: sha512-yHs+0uc8+nvEAfAfxrWQKK5peSNzBc4PegcMO0EJ2hT71uA7vB8Ihg2e77R2P7SG5uYjPbHlLLmve4LLLRCf0g==}
engines: {node: '>=18'}
cpu: [arm64]
os: [linux]
'@esbuild/linux-arm@0.28.1':
resolution: {integrity: sha512-qVXBOHQS+d5Y722GwJzJUtOLlX7km3CraOaGormF1pDtPd2C/l1SHRPgjLunLGe51Sh5YYWKMFDyV4SxgMQYTQ==}
engines: {node: '>=18'}
cpu: [arm]
os: [linux]
'@esbuild/linux-ia32@0.28.1':
resolution: {integrity: sha512-d1z4ZuP0ajrfz/FhGT4vv278rX8KnPPJx8i5+AtK7TYbx9Le9F1hyzurZpkEyjkGa9dUGhQow4C1NmeGvqxN2w==}
engines: {node: '>=18'}
cpu: [ia32]
os: [linux]
'@esbuild/linux-loong64@0.28.1':
resolution: {integrity: sha512-M5sRjUVZrkm1OAPR3dlOYzNmN+loZKGVi1VUQGrwuqLcbR6qeAz+famMhjASeH3YVKvZz+zT1jlh/keC3Rj/lg==}
engines: {node: '>=18'}
cpu: [loong64]
os: [linux]
'@esbuild/linux-mips64el@0.28.1':
resolution: {integrity: sha512-mRObBZeHh2OxcBFPWE/FjylkRgZdYuiTR3vaTozquCGOH14iP9oN4x4Ge81CoIDYQrXmIxpFumJBu5MtZpnQJQ==}
engines: {node: '>=18'}
cpu: [mips64el]
os: [linux]
'@esbuild/linux-ppc64@0.28.1':
resolution: {integrity: sha512-slScBsMAb3GFDcdrCgLwZtPYRoH2H/youv10QiZyRjmsP48fznoveWytSgCI/R0ZcUgpc0ZhIUEx6LHts8yrfQ==}
engines: {node: '>=18'}
cpu: [ppc64]
os: [linux]
'@esbuild/linux-riscv64@0.28.1':
resolution: {integrity: sha512-kw0owk1o0GFETUJyW0jc0G4Yzs0BHZn0JDZ8JRT088vjJYX777BAs1fDGxAC+q831qOs2DTC96mNsG2opdfyyQ==}
engines: {node: '>=18'}
cpu: [riscv64]
os: [linux]
'@esbuild/linux-s390x@0.28.1':
resolution: {integrity: sha512-/lAIjX8aYFRByhh6L5rYtPEDRqa9de/4V/juOXcta5frjvzXO4/sqEtyytse0g3zZFuWu5cDN0MkLz2qRDD2Ag==}
engines: {node: '>=18'}
cpu: [s390x]
os: [linux]
'@esbuild/linux-x64@0.28.1':
resolution: {integrity: sha512-u/anNYF2mmVOEDwLtnQ1wOr3EZ9sTNGLWrsYGYwHWzGA3Si84IOkHXlbWTD1NB+9/1lcnweYKO54uhxZydNzfA==}
engines: {node: '>=18'}
cpu: [x64]
os: [linux]
'@esbuild/netbsd-arm64@0.28.1':
resolution: {integrity: sha512-oks0DYbLwWMmaakTsCb+zL4E+aHRVLom9IJZOAthMQEPiQmydXHkziYEsGYRx0uNV/IjEKGAV941JzH02pflqw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [netbsd]
'@esbuild/netbsd-x64@0.28.1':
resolution: {integrity: sha512-aeL6lAnN89Hz43Mlh1G8ARasbuoYvSITDEx0tHh5b7jJnHcssqgjy9Yx430GDpmCa6OyrKoS0aNRjKundRizGg==}
engines: {node: '>=18'}
cpu: [x64]
os: [netbsd]
'@esbuild/openbsd-arm64@0.28.1':
resolution: {integrity: sha512-MEFJe5C3R8pwXdZ5Y21oo6m7ePiS0d9pWucn99O/wvyJZChoIQKrQDxKrGeW8F5+T0okTHesAmDeiHDTIq0V/Q==}
engines: {node: '>=18'}
cpu: [arm64]
os: [openbsd]
'@esbuild/openbsd-x64@0.28.1':
resolution: {integrity: sha512-i/ZLIOafE0Z8cI/XANJAixoJL/uRAoS2xOA3rb0xN+KK0K177cMAsQYkzHtBrtMXAKuAc7HGgcWiZ/sRC1Nxgw==}
engines: {node: '>=18'}
cpu: [x64]
os: [openbsd]
'@esbuild/openharmony-arm64@0.28.1':
resolution: {integrity: sha512-ge+Z7EXFNt2BO1oAMsVpiQ8EwndV9i1xXerAeTIK7AtPs3bKFXQM7nlRxDSIUIMeueR1CNXxqztLzdNeReKBJg==}
engines: {node: '>=18'}
cpu: [arm64]
os: [openharmony]
'@esbuild/sunos-x64@0.28.1':
resolution: {integrity: sha512-BEjgtECkL3vY+SaSQ6nzVfiALUeFxpawyp8Jmf5PtYhf1Ug40N1h/hxlhts+f1FvSvarEigdxS3BlSMI2PJLcQ==}
engines: {node: '>=18'}
cpu: [x64]
os: [sunos]
'@esbuild/win32-arm64@0.28.1':
resolution: {integrity: sha512-lCv9eK/H6ZJWbE7bh2nw54CZ9M2nupBxJcTsdk/QQnWkdSjKGuxmmH8/GWrlT1eMmZfn4dGcCjRte397WqfQXA==}
engines: {node: '>=18'}
cpu: [arm64]
os: [win32]
'@esbuild/win32-ia32@0.28.1':
resolution: {integrity: sha512-zvb/mB2bSCoJOpoCBgYKKpX6YM6mJBlBUVUtVj41DlZJVEB6/0CKlRYxP5wWl1C1ILiCoAU5wZZ4q1P3qeS6Eg==}
engines: {node: '>=18'}
cpu: [ia32]
os: [win32]
'@esbuild/win32-x64@0.28.1':
resolution: {integrity: sha512-bm4Mowrv+GXMlpWX++EcXw/iLyd1o3+bJkC2DkWXYVvgZCqD/bSj9ctZeAMC3cIxgjRVR2Dufaiu4YPxr5gW1A==}
engines: {node: '>=18'}
cpu: [x64]
os: [win32]
'@eslint-community/eslint-utils@4.10.1':
resolution: {integrity: sha512-cuadcxVFE8sDK6iWJbs8Sn0av2Nrh2QSGQhVlBW9AaAHqHwjWsZHT8LJ4hFGPh7ASBV2deFdM7H/DPjulmh8rg==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@ -1756,9 +1597,6 @@ packages:
resolution: {integrity: sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==}
engines: {node: '>=12'}
date-fns@4.4.0:
resolution: {integrity: sha512-+1UMbeh68lH1SegH83CGWwpb6OHHbpSgr3+s5Eww5M4CAgswBpoWS0AjTOfEJ33HiYKz1hdj/KTFprzXHmq/6w==}
debounce-fn@4.0.0:
resolution: {integrity: sha512-8pYCQiL9Xdcg0UPSD3d+0KMlOjp+KGU5EPwYddgzQ7DATsg4fuUDjQtsYLmWjnk2obnNHgV3vE2Y4jejSOJVBQ==}
engines: {node: '>=10'}
@ -1851,8 +1689,8 @@ packages:
ee-first@1.1.1:
resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==}
electron-to-chromium@1.5.402:
resolution: {integrity: sha512-/oOpMaPT6Yg+6/1XQhyIPlzgj7Ye9zf+nNM2Uh6OcE2G2oNptWazFa+qB2Pdqqbsc9KnIDzgAntoYN0dbwOXwA==}
electron-to-chromium@1.5.403:
resolution: {integrity: sha512-MQsYmdaLzvaCX5j+ZZBr5Fm6uCCnPQcRtlvmvRlWqrXy+BH2O4ffXIAScF+JQznQWB9brWp4lSD9Z4yNmaf2BA==}
embla-carousel-react@8.6.0:
resolution: {integrity: sha512-0/PjqU7geVmo6F734pmPqpyHqiM99olvyecY7zdweCw+6tKEXnrE90pBiBbMMU8s5tICemzpQ3hi5EpxzGW+JA==}
@ -1917,11 +1755,6 @@ packages:
es-toolkit@1.50.0:
resolution: {integrity: sha512-OyZKhUVvEep9ITEiwHn8GKnMRQIVqoSIX7WnRbkWgJkllCujilqP2rD0u979tkl8wqyc8ICwlc1UBVv/Sl1G6w==}
esbuild@0.28.1:
resolution: {integrity: sha512-HrJrvZv5ayxBzPfwphOoNzkzOIIlifzk0KJrGK2c8R4+LKpMtpYLQeUdjnwjWv/LZlkH2laZk+4w78pi99D4Vw==}
engines: {node: '>=18'}
hasBin: true
escalade@3.2.0:
resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
engines: {node: '>=6'}
@ -2444,8 +2277,8 @@ packages:
resolution: {integrity: sha512-Eeo8Ys1doU1z+x8AZsPpQu+p/QcZBI5PeOo7QGQdy2x2m0MU/hYagBbGOmXwr5KVbEfVuWv9LpnQWeehogurjg==}
hasBin: true
katex@0.18.2:
resolution: {integrity: sha512-3snve4y0SXTMequLim1FMiPvLGElySam0blN5xQZBqEY3lOJz1TnuaaiugnBZBqHzlSAGmFTYL7MCQkORuLKCA==}
katex@0.18.3:
resolution: {integrity: sha512-6kbPr8KiYZpRfNNIw+8Td33njnFzK/ELcw6bI9FzIHysYPatAUdepQimfCX1vG2VCD/5Lv+Gu6P5YA58k8HHmw==}
hasBin: true
keyv@4.5.4:
@ -2632,8 +2465,8 @@ packages:
lru-cache@5.1.1:
resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
lucide-react@1.30.0:
resolution: {integrity: sha512-tUIr2jXLbWpCkdtH8XP7P7YppM9ueWgTky99lpWDY6z5REs6B+O6ZQ3U5tHkUUY59ANyOv/PBcs8E4Fe3KO3eA==}
lucide-react@1.31.0:
resolution: {integrity: sha512-G8u2eEtoHUnUa9f8lbvqDhCiORMnYLdUEo06EEG9MQvHQrInKcX3Pa2TH39MM5qyzRcWETxB0+aOwAPI1g1kEg==}
peerDependencies:
react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0
@ -3058,8 +2891,8 @@ packages:
peerDependencies:
react: ^19.2.8
react-is@19.2.7:
resolution: {integrity: sha512-kZFnouyVv7eP/Phmrlo9FK+zcAdriZJvzxXHF1Sl1P377WSGe2G/JxVolhTrB/jeV47lKImhNUsijjHAAbcl/A==}
react-is@19.2.8:
resolution: {integrity: sha512-s5un28nYxKJw5gvUHyW5PCC28CvBqLu9r3cWgzHT4Vo/5fqqkFcdRYsGcKf50WMPpjjFZS5d76fn3YCo2njKwQ==}
react-markdown@10.1.0:
resolution: {integrity: sha512-qKxVopLT/TyA6BX3Ue5NwabOsAzm0Q7kAPwq6L+wWDwisYs7R8vZ0nRXqq6rkueboxpkjvLGU9fWifiX/ZZFxQ==}
@ -3279,11 +3112,15 @@ packages:
sisteransi@1.0.5:
resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
sonner@2.0.7:
resolution: {integrity: sha512-W6ZN4p58k8aDKA4XPcx2hpIQXBRAgyiWVkYhT7CvK6D3iAu7xjvVyhQHg2/iaKJZ1XVJ4r7XuwGL+WGEK37i9w==}
sonner@2.0.8:
resolution: {integrity: sha512-UM/ByIoFra8yzV75n1o0Puu0bw5U/9UNnDacrJNspekBewIfsQ3D6ez1nvlWpt7aTsO6rujQtifBpycwIivqlg==}
peerDependencies:
'@types/react': ^18.0.0 || ^19.0.0
react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
source-map-js@1.2.1:
resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
@ -3826,7 +3663,7 @@ snapshots:
'@babel/helper-string-parser': 7.29.7
'@babel/helper-validator-identifier': 7.29.7
'@base-ui/react@1.7.0(@date-fns/tz@1.5.0)(@types/react@19.2.18)(date-fns@4.4.0)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)':
'@base-ui/react@1.7.0(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)':
dependencies:
'@babel/runtime': 7.29.7
'@base-ui/utils': 0.3.2(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)
@ -3836,9 +3673,7 @@ snapshots:
react-dom: 19.2.8(react@19.2.8)
use-sync-external-store: 1.6.0(react@19.2.8)
optionalDependencies:
'@date-fns/tz': 1.5.0
'@types/react': 19.2.18
date-fns: 4.4.0
'@base-ui/utils@0.3.2(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8)':
dependencies:
@ -3931,9 +3766,6 @@ snapshots:
style-mod: 4.1.3
w3c-keyname: 2.2.8
'@date-fns/tz@1.5.0':
optional: true
'@dotenvx/dotenvx@1.75.1':
dependencies:
'@dotenvx/primitives': 0.8.0
@ -3955,84 +3787,6 @@ snapshots:
'@dotenvx/primitives@0.8.0': {}
'@esbuild/aix-ppc64@0.28.1':
optional: true
'@esbuild/android-arm64@0.28.1':
optional: true
'@esbuild/android-arm@0.28.1':
optional: true
'@esbuild/android-x64@0.28.1':
optional: true
'@esbuild/darwin-arm64@0.28.1':
optional: true
'@esbuild/darwin-x64@0.28.1':
optional: true
'@esbuild/freebsd-arm64@0.28.1':
optional: true
'@esbuild/freebsd-x64@0.28.1':
optional: true
'@esbuild/linux-arm64@0.28.1':
optional: true
'@esbuild/linux-arm@0.28.1':
optional: true
'@esbuild/linux-ia32@0.28.1':
optional: true
'@esbuild/linux-loong64@0.28.1':
optional: true
'@esbuild/linux-mips64el@0.28.1':
optional: true
'@esbuild/linux-ppc64@0.28.1':
optional: true
'@esbuild/linux-riscv64@0.28.1':
optional: true
'@esbuild/linux-s390x@0.28.1':
optional: true
'@esbuild/linux-x64@0.28.1':
optional: true
'@esbuild/netbsd-arm64@0.28.1':
optional: true
'@esbuild/netbsd-x64@0.28.1':
optional: true
'@esbuild/openbsd-arm64@0.28.1':
optional: true
'@esbuild/openbsd-x64@0.28.1':
optional: true
'@esbuild/openharmony-arm64@0.28.1':
optional: true
'@esbuild/sunos-x64@0.28.1':
optional: true
'@esbuild/win32-arm64@0.28.1':
optional: true
'@esbuild/win32-ia32@0.28.1':
optional: true
'@esbuild/win32-x64@0.28.1':
optional: true
'@eslint-community/eslint-utils@4.10.1(eslint@10.8.1(jiti@2.7.0))':
dependencies:
eslint: 10.8.1(jiti@2.7.0)
@ -4566,12 +4320,12 @@ snapshots:
'@tailwindcss/oxide-win32-arm64-msvc': 4.3.3
'@tailwindcss/oxide-win32-x64-msvc': 4.3.3
'@tailwindcss/vite@4.3.3(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0))':
'@tailwindcss/vite@4.3.3(vite@8.2.1(@types/node@26.2.0)(jiti@2.7.0))':
dependencies:
'@tailwindcss/node': 4.3.3
'@tailwindcss/oxide': 4.3.3
tailwindcss: 4.3.3
vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0)
vite: 8.2.1(@types/node@26.2.0)(jiti@2.7.0)
'@tauri-apps/api@2.11.1': {}
@ -4808,10 +4562,10 @@ snapshots:
'@ungap/structured-clone@1.3.3': {}
'@vitejs/plugin-react@6.0.5(vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0))':
'@vitejs/plugin-react@6.0.5(vite@8.2.1(@types/node@26.2.0)(jiti@2.7.0))':
dependencies:
'@rolldown/pluginutils': 1.0.1
vite: 8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0)
vite: 8.2.1(@types/node@26.2.0)(jiti@2.7.0)
accepts@2.0.0:
dependencies:
@ -4896,7 +4650,7 @@ snapshots:
dependencies:
baseline-browser-mapping: 2.11.13
caniuse-lite: 1.0.30001809
electron-to-chromium: 1.5.402
electron-to-chromium: 1.5.403
node-releases: 2.0.53
update-browserslist-db: 1.3.0(browserslist@4.28.8)
@ -5055,9 +4809,6 @@ snapshots:
d3-timer@3.0.1: {}
date-fns@4.4.0:
optional: true
debounce-fn@4.0.0:
dependencies:
mimic-fn: 3.1.0
@ -5119,7 +4870,7 @@ snapshots:
ee-first@1.1.1: {}
electron-to-chromium@1.5.402: {}
electron-to-chromium@1.5.403: {}
embla-carousel-react@8.6.0(react@19.2.8):
dependencies:
@ -5171,36 +4922,6 @@ snapshots:
es-toolkit@1.50.0: {}
esbuild@0.28.1:
optionalDependencies:
'@esbuild/aix-ppc64': 0.28.1
'@esbuild/android-arm': 0.28.1
'@esbuild/android-arm64': 0.28.1
'@esbuild/android-x64': 0.28.1
'@esbuild/darwin-arm64': 0.28.1
'@esbuild/darwin-x64': 0.28.1
'@esbuild/freebsd-arm64': 0.28.1
'@esbuild/freebsd-x64': 0.28.1
'@esbuild/linux-arm': 0.28.1
'@esbuild/linux-arm64': 0.28.1
'@esbuild/linux-ia32': 0.28.1
'@esbuild/linux-loong64': 0.28.1
'@esbuild/linux-mips64el': 0.28.1
'@esbuild/linux-ppc64': 0.28.1
'@esbuild/linux-riscv64': 0.28.1
'@esbuild/linux-s390x': 0.28.1
'@esbuild/linux-x64': 0.28.1
'@esbuild/netbsd-arm64': 0.28.1
'@esbuild/netbsd-x64': 0.28.1
'@esbuild/openbsd-arm64': 0.28.1
'@esbuild/openbsd-x64': 0.28.1
'@esbuild/openharmony-arm64': 0.28.1
'@esbuild/sunos-x64': 0.28.1
'@esbuild/win32-arm64': 0.28.1
'@esbuild/win32-ia32': 0.28.1
'@esbuild/win32-x64': 0.28.1
optional: true
escalade@3.2.0: {}
escape-html@1.0.3: {}
@ -5768,7 +5489,7 @@ snapshots:
dependencies:
commander: 8.3.0
katex@0.18.2:
katex@0.18.3:
dependencies:
commander: 8.3.0
@ -5905,7 +5626,7 @@ snapshots:
dependencies:
yallist: 3.1.1
lucide-react@1.30.0(react@19.2.8):
lucide-react@1.31.0(react@19.2.8):
dependencies:
react: 19.2.8
@ -6538,7 +6259,7 @@ snapshots:
react: 19.2.8
scheduler: 0.27.0
react-is@19.2.7: {}
react-is@19.2.8: {}
react-markdown@10.1.0(@types/react@19.2.18)(react@19.2.8):
dependencies:
@ -6609,7 +6330,7 @@ snapshots:
tiny-invariant: 1.3.3
tslib: 2.8.1
recharts@3.10.1(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react-is@19.2.7)(react@19.2.8)(redux@5.0.1):
recharts@3.10.1(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react-is@19.2.8)(react@19.2.8)(redux@5.0.1):
dependencies:
'@reduxjs/toolkit': 2.12.0(react-redux@9.3.0(@types/react@19.2.18)(react@19.2.8)(redux@5.0.1))(react@19.2.8)
clsx: 2.1.1
@ -6619,7 +6340,7 @@ snapshots:
immer: 11.1.16
react: 19.2.8
react-dom: 19.2.8(react@19.2.8)
react-is: 19.2.7
react-is: 19.2.8
react-redux: 9.3.0(@types/react@19.2.18)(react@19.2.8)(redux@5.0.1)
reselect: 5.2.0
tiny-invariant: 1.3.3
@ -6896,10 +6617,12 @@ snapshots:
sisteransi@1.0.5: {}
sonner@2.0.7(react-dom@19.2.8(react@19.2.8))(react@19.2.8):
sonner@2.0.8(@types/react@19.2.18)(react-dom@19.2.8(react@19.2.8))(react@19.2.8):
dependencies:
react: 19.2.8
react-dom: 19.2.8(react@19.2.8)
optionalDependencies:
'@types/react': 19.2.18
source-map-js@1.2.1: {}
@ -7171,7 +6894,7 @@ snapshots:
d3-time: 3.1.0
d3-timer: 3.0.1
vite@8.2.1(@types/node@26.2.0)(esbuild@0.28.1)(jiti@2.7.0):
vite@8.2.1(@types/node@26.2.0)(jiti@2.7.0):
dependencies:
lightningcss: 1.33.0
picomatch: 4.0.5
@ -7180,7 +6903,6 @@ snapshots:
tinyglobby: 0.2.17
optionalDependencies:
'@types/node': 26.2.0
esbuild: 0.28.1
fsevents: 2.3.3
jiti: 2.7.0

View file

@ -52,7 +52,7 @@ function AlertDialogContent({
data-slot="alert-dialog-content"
data-size={size}
className={cn(
"group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
"group/alert-dialog-content fixed top-[calc((100dvh+max(1rem,var(--ui-safe-area-top))-max(1rem,var(--ui-safe-area-bottom)))/2)] left-[calc((100%+max(1rem,var(--ui-safe-area-left))-max(1rem,var(--ui-safe-area-right)))/2)] z-50 grid w-[calc(100%-max(1rem,var(--ui-safe-area-left))-max(1rem,var(--ui-safe-area-right)))] max-h-[calc(100dvh-max(1rem,var(--ui-safe-area-top))-max(1rem,var(--ui-safe-area-bottom)))] -translate-x-1/2 -translate-y-1/2 gap-4 overflow-y-auto rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
className,
)}
{...props}

View file

@ -2,6 +2,7 @@ import * as React from "react";
import { Combobox as ComboboxPrimitive } from "@base-ui/react";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
import { Button } from "./button";
import {
InputGroup,
@ -89,12 +90,20 @@ function ComboboxContent({
align = "start",
alignOffset = 0,
anchor,
collisionPadding,
...props
}: ComboboxPrimitive.Popup.Props &
Pick<
ComboboxPrimitive.Positioner.Props,
"side" | "align" | "sideOffset" | "alignOffset" | "anchor"
| "side"
| "align"
| "sideOffset"
| "alignOffset"
| "anchor"
| "collisionPadding"
>) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<ComboboxPrimitive.Portal>
<ComboboxPrimitive.Positioner
@ -103,6 +112,7 @@ function ComboboxContent({
align={align}
alignOffset={alignOffset}
anchor={anchor}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className="isolate z-50"
>
<ComboboxPrimitive.Popup

View file

@ -52,7 +52,7 @@ function CommandDialog({
</DialogHeader>
<DialogContent
className={cn(
"top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0",
"top-[calc(var(--ui-safe-area-top)+(100dvh-var(--ui-safe-area-top)-var(--ui-safe-area-bottom))/3)] max-h-[calc((100dvh-var(--ui-safe-area-top)-var(--ui-safe-area-bottom))*2/3-1rem)] translate-y-0 overflow-hidden rounded-xl! p-0",
className,
)}
showCloseButton={showCloseButton}

View file

@ -4,6 +4,7 @@ import * as React from "react";
import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
import { ChevronRightIcon, CheckIcon } from "lucide-react";
function ContextMenu({ ...props }: ContextMenuPrimitive.Root.Props) {
@ -35,12 +36,15 @@ function ContextMenuContent({
alignOffset = 4,
side = "right",
sideOffset = 0,
collisionPadding,
...props
}: ContextMenuPrimitive.Popup.Props &
Pick<
ContextMenuPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset"
"align" | "alignOffset" | "side" | "sideOffset" | "collisionPadding"
>) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<ContextMenuPrimitive.Portal>
<ContextMenuPrimitive.Positioner
@ -49,6 +53,7 @@ function ContextMenuContent({
alignOffset={alignOffset}
side={side}
sideOffset={sideOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
>
<ContextMenuPrimitive.Popup
data-slot="context-menu-content"

View file

@ -53,7 +53,7 @@ function DialogContent({
<DialogPrimitive.Popup
data-slot="dialog-content"
className={cn(
"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground border duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
"fixed top-[calc((100dvh+max(1rem,var(--ui-safe-area-top))-max(1rem,var(--ui-safe-area-bottom)))/2)] left-[calc((100%+max(1rem,var(--ui-safe-area-left))-max(1rem,var(--ui-safe-area-right)))/2)] z-50 grid w-[calc(100%-max(1rem,var(--ui-safe-area-left))-max(1rem,var(--ui-safe-area-right)))] max-h-[calc(100dvh-max(1rem,var(--ui-safe-area-top))-max(1rem,var(--ui-safe-area-bottom)))] -translate-x-1/2 -translate-y-1/2 gap-4 overflow-y-auto rounded-xl bg-popover p-4 text-sm text-popover-foreground border duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
className,
)}
{...props}

View file

@ -56,7 +56,7 @@ function DrawerContent({
<DrawerPrimitive.Content
data-slot="drawer-content"
className={cn(
"group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm",
"group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80dvh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:pr-[var(--ui-safe-area-right)] data-[vaul-drawer-direction=bottom]:pb-[var(--ui-safe-area-bottom)] data-[vaul-drawer-direction=bottom]:pl-[var(--ui-safe-area-left)] data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:pt-[var(--ui-safe-area-top)] data-[vaul-drawer-direction=left]:pb-[var(--ui-safe-area-bottom)] data-[vaul-drawer-direction=left]:pl-[var(--ui-safe-area-left)] data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:pt-[var(--ui-safe-area-top)] data-[vaul-drawer-direction=right]:pr-[var(--ui-safe-area-right)] data-[vaul-drawer-direction=right]:pb-[var(--ui-safe-area-bottom)] data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80dvh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:pt-[var(--ui-safe-area-top)] data-[vaul-drawer-direction=top]:pr-[var(--ui-safe-area-right)] data-[vaul-drawer-direction=top]:pl-[var(--ui-safe-area-left)] data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm",
className,
)}
{...props}

View file

@ -2,6 +2,7 @@ import * as React from "react";
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
import { ChevronRightIcon, CheckIcon } from "lucide-react";
function DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {
@ -21,13 +22,16 @@ function DropdownMenuContent({
alignOffset = 0,
side = "bottom",
sideOffset = 4,
collisionPadding,
className,
...props
}: MenuPrimitive.Popup.Props &
Pick<
MenuPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset"
"align" | "alignOffset" | "side" | "sideOffset" | "collisionPadding"
>) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<MenuPrimitive.Portal>
<MenuPrimitive.Positioner
@ -36,6 +40,7 @@ function DropdownMenuContent({
alignOffset={alignOffset}
side={side}
sideOffset={sideOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
>
<MenuPrimitive.Popup
data-slot="dropdown-menu-content"

View file

@ -3,6 +3,7 @@
import { PreviewCard as PreviewCardPrimitive } from "@base-ui/react/preview-card";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
function HoverCard({ ...props }: PreviewCardPrimitive.Root.Props) {
return <PreviewCardPrimitive.Root data-slot="hover-card" {...props} />;
@ -20,12 +21,15 @@ function HoverCardContent({
sideOffset = 4,
align = "center",
alignOffset = 4,
collisionPadding,
...props
}: PreviewCardPrimitive.Popup.Props &
Pick<
PreviewCardPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset"
"align" | "alignOffset" | "side" | "sideOffset" | "collisionPadding"
>) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<PreviewCardPrimitive.Portal data-slot="hover-card-portal">
<PreviewCardPrimitive.Positioner
@ -33,6 +37,7 @@ function HoverCardContent({
alignOffset={alignOffset}
side={side}
sideOffset={sideOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className="isolate z-50"
>
<PreviewCardPrimitive.Popup

View file

@ -2,6 +2,7 @@ import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/naviga
import { cva } from "class-variance-authority";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
import { ChevronDownIcon } from "lucide-react";
function NavigationMenu({
@ -101,8 +102,11 @@ function NavigationMenuPositioner({
sideOffset = 8,
align = "start",
alignOffset = 0,
collisionPadding,
...props
}: NavigationMenuPrimitive.Positioner.Props) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<NavigationMenuPrimitive.Portal>
<NavigationMenuPrimitive.Positioner
@ -110,6 +114,7 @@ function NavigationMenuPositioner({
sideOffset={sideOffset}
align={align}
alignOffset={alignOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className={cn(
"isolate z-50 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0",
className,

View file

@ -123,7 +123,7 @@ function OnboardingFlow({
</ConfigureStepContext.Provider>
</main>
<footer className="shrink-0 px-6 pt-4 pb-[max(1.5rem,env(safe-area-inset-bottom))] md:px-10">
<footer className="shrink-0 px-6 pt-4 pb-6 md:px-10">
<div className="flex justify-center md:justify-end">
<Button
size="lg"

View file

@ -2,6 +2,7 @@ import * as React from "react";
import { Popover as PopoverPrimitive } from "@base-ui/react/popover";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
function Popover({ ...props }: PopoverPrimitive.Root.Props) {
return <PopoverPrimitive.Root data-slot="popover" {...props} />;
@ -17,15 +18,18 @@ function PopoverContent({
alignOffset = 0,
side = "bottom",
sideOffset = 4,
collisionPadding,
portalProps,
...props
}: PopoverPrimitive.Popup.Props &
Pick<
PopoverPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset"
"align" | "alignOffset" | "side" | "sideOffset" | "collisionPadding"
> & {
portalProps?: PopoverPrimitive.Portal.Props;
}) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<PopoverPrimitive.Portal {...portalProps}>
<PopoverPrimitive.Positioner
@ -33,6 +37,7 @@ function PopoverContent({
alignOffset={alignOffset}
side={side}
sideOffset={sideOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className="isolate z-50"
>
<PopoverPrimitive.Popup

View file

@ -4,6 +4,7 @@ import * as React from "react";
import { Select as SelectPrimitive } from "@base-ui/react/select";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react";
const Select = SelectPrimitive.Root;
@ -64,12 +65,20 @@ function SelectContent({
align = "center",
alignOffset = 0,
alignItemWithTrigger = true,
collisionPadding,
...props
}: SelectPrimitive.Popup.Props &
Pick<
SelectPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset" | "alignItemWithTrigger"
| "align"
| "alignOffset"
| "side"
| "sideOffset"
| "alignItemWithTrigger"
| "collisionPadding"
>) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<SelectPrimitive.Portal>
<SelectPrimitive.Positioner
@ -78,6 +87,7 @@ function SelectContent({
align={align}
alignOffset={alignOffset}
alignItemWithTrigger={alignItemWithTrigger}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className="isolate z-50"
>
<SelectPrimitive.Popup

View file

@ -53,7 +53,7 @@ function SheetContent({
data-slot="sheet-content"
data-side={side}
className={cn(
"fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
"group/sheet-content fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:pr-[var(--ui-safe-area-right)] data-[side=bottom]:pb-[var(--ui-safe-area-bottom)] data-[side=bottom]:pl-[var(--ui-safe-area-left)] data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:pt-[var(--ui-safe-area-top)] data-[side=left]:pb-[var(--ui-safe-area-bottom)] data-[side=left]:pl-[var(--ui-safe-area-left)] data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:pt-[var(--ui-safe-area-top)] data-[side=right]:pr-[var(--ui-safe-area-right)] data-[side=right]:pb-[var(--ui-safe-area-bottom)] data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:pt-[var(--ui-safe-area-top)] data-[side=top]:pr-[var(--ui-safe-area-right)] data-[side=top]:pl-[var(--ui-safe-area-left)] data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
className,
)}
{...props}
@ -65,7 +65,7 @@ function SheetContent({
render={
<Button
variant="ghost"
className="absolute top-3 right-3"
className="absolute top-3 right-3 group-data-[side=bottom]/sheet-content:right-[max(0.75rem,var(--ui-safe-area-right))] group-data-[side=left]/sheet-content:top-[max(0.75rem,var(--ui-safe-area-top))] group-data-[side=right]/sheet-content:top-[max(0.75rem,var(--ui-safe-area-top))] group-data-[side=right]/sheet-content:right-[max(0.75rem,var(--ui-safe-area-right))] group-data-[side=top]/sheet-content:top-[max(0.75rem,var(--ui-safe-area-top))] group-data-[side=top]/sheet-content:right-[max(0.75rem,var(--ui-safe-area-right))]"
size="icon-sm"
/>
}

View file

@ -215,10 +215,10 @@ function Sidebar({
data-side={side}
style={{ width: SIDEBAR_WIDTH }}
className={cn(
"fixed inset-y-0 z-10 hidden h-svh transition-[left,right,width,transform] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:-translate-x-full data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:translate-x-full md:flex",
"fixed inset-y-0 z-10 hidden h-svh pt-[var(--ui-safe-area-top)] pb-[var(--ui-safe-area-bottom)] transition-[left,right,width,transform] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:pl-[var(--ui-safe-area-left)] data-[side=left]:group-data-[collapsible=offcanvas]:-translate-x-full data-[side=right]:right-0 data-[side=right]:pr-[var(--ui-safe-area-right)] data-[side=right]:group-data-[collapsible=offcanvas]:translate-x-full md:flex",
// Adjust the padding for floating and inset variants.
variant === "floating" || variant === "inset"
? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
? "pt-[max(0.5rem,var(--ui-safe-area-top))] pr-2 pb-[max(0.5rem,var(--ui-safe-area-bottom))] pl-2 data-[side=left]:pl-[max(0.5rem,var(--ui-safe-area-left))] data-[side=right]:pr-[max(0.5rem,var(--ui-safe-area-right))] group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
: "group-data-[collapsible=icon]:w-(--sidebar-width-icon)",
className,
)}

View file

@ -17,6 +17,18 @@ const Toaster = ({ ...props }: ToasterProps) => {
<Sonner
theme={theme as ToasterProps["theme"]}
className="toaster group"
offset={{
top: "max(1rem, var(--ui-safe-area-top))",
right: "max(1rem, var(--ui-safe-area-right))",
bottom: "max(1rem, var(--ui-safe-area-bottom))",
left: "max(1rem, var(--ui-safe-area-left))",
}}
mobileOffset={{
top: "max(1rem, var(--ui-safe-area-top))",
right: "max(1rem, var(--ui-safe-area-right), var(--ui-safe-area-left))",
bottom: "max(1rem, var(--ui-safe-area-bottom))",
left: "max(1rem, var(--ui-safe-area-right), var(--ui-safe-area-left))",
}}
icons={{
success: <CircleCheckIcon className="size-4" />,
info: <InfoIcon className="size-4" />,

View file

@ -2,6 +2,7 @@ import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
import type { ReactElement, ReactNode } from "react";
import { cn } from "../lib/utils";
import { useSafeAreaCollisionPadding } from "../hooks/use-safe-area";
function TooltipProvider({
delay = 0,
@ -31,15 +32,18 @@ function TooltipContent({
align = "center",
alignOffset = 0,
children,
collisionPadding,
portalProps,
...props
}: TooltipPrimitive.Popup.Props &
Pick<
TooltipPrimitive.Positioner.Props,
"align" | "alignOffset" | "side" | "sideOffset"
"align" | "alignOffset" | "side" | "sideOffset" | "collisionPadding"
> & {
portalProps?: TooltipPrimitive.Portal.Props;
}) {
const safeAreaCollisionPadding = useSafeAreaCollisionPadding();
return (
<TooltipPrimitive.Portal {...portalProps}>
<TooltipPrimitive.Positioner
@ -47,6 +51,7 @@ function TooltipContent({
alignOffset={alignOffset}
side={side}
sideOffset={sideOffset}
collisionPadding={collisionPadding ?? safeAreaCollisionPadding}
className="isolate z-50"
>
<TooltipPrimitive.Popup

View file

@ -0,0 +1,40 @@
import * as React from "react";
const properties = [
"--ui-safe-area-top",
"--ui-safe-area-right",
"--ui-safe-area-bottom",
"--ui-safe-area-left",
] as const;
function getSnapshot() {
const styles = getComputedStyle(document.documentElement);
return properties
.map((property) => styles.getPropertyValue(property))
.join(",");
}
function subscribe(onChange: () => void) {
window.addEventListener("resize", onChange);
window.addEventListener("orientationchange", onChange);
window.visualViewport?.addEventListener("resize", onChange);
return () => {
window.removeEventListener("resize", onChange);
window.removeEventListener("orientationchange", onChange);
window.visualViewport?.removeEventListener("resize", onChange);
};
}
export function useSafeAreaCollisionPadding() {
const snapshot = React.useSyncExternalStore(
subscribe,
getSnapshot,
() => "0,0,0,0",
);
const [top, right, bottom, left] = snapshot
.split(",")
.map((value) => Math.max(5, Number.parseFloat(value) || 0));
return { top, right, bottom, left };
}

View file

@ -88,6 +88,10 @@
}
:root {
--ui-safe-area-top: env(safe-area-inset-top, 0px);
--ui-safe-area-right: env(safe-area-inset-right, 0px);
--ui-safe-area-bottom: env(safe-area-inset-bottom, 0px);
--ui-safe-area-left: env(safe-area-inset-left, 0px);
--ui-density: 1;
--ui-border-width: 1px;
--ui-shadow-strength: 0;

View file

@ -8,6 +8,7 @@ export { toast } from "sonner";
export * from "./theme";
export * from "./screens/util";
export * from "./hooks/use-mobile";
export * from "./hooks/use-safe-area";
export * from "./lib/utils";
export * from "./cmp/accordion";

View file

@ -71,7 +71,7 @@ function CodeBlock({
data-slot="code-block"
data-line-numbers={showLineNumbers || undefined}
data-language={language || undefined}
className="group/code-block overflow-hidden rounded-lg border-[length:var(--ui-border-width)] border-border bg-[var(--markdown-code-background)] group-data-[variant=compact]/markdown:my-[0.45rem]"
className="group/code-block overflow-hidden rounded-lg border-[length:var(--ui-border-width)] border-border bg-[var(--markdown-code-background)] my-2!"
>
<figcaption
data-slot="code-block-header"
@ -109,7 +109,7 @@ function CodeBlock({
</figcaption>
<div
data-slot="code-block-content"
className="max-w-full overflow-x-auto"
className="max-w-full overflow-x-auto pb-2"
>
{highlighted ?? (
<pre

View file

@ -15,6 +15,7 @@ export default function Emoji({
className = "size-6",
registry: registryOverride,
shortcode,
tooltip = true,
}: EmojiProps) {
const registry = useEmojiRegistry(registryOverride);
const emoji = registry.resolve(shortcode);
@ -37,6 +38,8 @@ export default function Emoji({
<span>{shortcode}</span>
);
if (!tooltip) return content;
return (
<Tooltip>
<TooltipTrigger render={content} />

View file

@ -60,7 +60,7 @@
}
.cm-editor.tm-md-editor.cm-focused {
outline: none;
outline: 0px !important;
box-shadow: none;
}

View file

@ -6,7 +6,7 @@ import rehypeSlug from "rehype-slug";
import remarkBreaks from "remark-breaks";
import remarkGfm from "remark-gfm";
import remarkMath from "remark-math";
import type { ComponentProps } from "react";
import type { ComponentProps, ReactNode } from "react";
import { cn } from "../lib/utils";
import { CodeBlock } from "./code-block";
@ -47,6 +47,7 @@ export type MarkdownProps = Omit<ComponentProps<"div">, "children"> & {
components?: Partial<MarkdownComponents>;
registry?: EmojiRegistry;
theme?: MarkdownTheme;
trailingContent?: ReactNode;
variant?: MarkdownVariant;
};
@ -136,6 +137,7 @@ function Markdown({
components,
registry: registryOverride,
theme,
trailingContent,
variant = "article",
...props
}: MarkdownProps) {
@ -171,6 +173,7 @@ function Markdown({
>
{content}
</ReactMarkdown>
{trailingContent}
</div>
</EmojiProvider>
);

View file

@ -6,14 +6,30 @@ import { Markdown } from "./markdown";
export type TextProps = {
fontSize?: CSSProperties["fontSize"];
registry?: EmojiRegistry;
showEditedIndicator?: boolean;
value: string;
};
export default function Text({ fontSize, registry, value }: TextProps) {
export default function Text({
fontSize,
registry,
showEditedIndicator = false,
value,
}: TextProps) {
return (
<Markdown
className={
showEditedIndicator
? "[&>p:nth-last-child(2)]:my-0 [&>p:nth-last-child(2)]:inline"
: undefined
}
content={value}
registry={registry}
trailingContent={
showEditedIndicator ? (
<span className="ms-1 text-xs text-muted-foreground">(edited)</span>
) : undefined
}
variant="compact"
style={{ fontSize: fontSize ?? "1rem" }}
/>

View file

@ -1,6 +1,5 @@
import { cn } from "../lib/utils";
import Controls from "../windowControls";
import { isTauri } from "@tauri-apps/api/core";
export default function CreateScreen({
children,
@ -12,13 +11,13 @@ export default function CreateScreen({
return (
<div
className={cn(
"bg-background w-screen h-screen flex flex-col justify-center items-center",
"bg-background flex h-dvh w-screen flex-col items-center justify-center pt-[var(--ui-safe-area-top)] pr-[var(--ui-safe-area-right)] pb-[var(--ui-safe-area-bottom)] pl-[var(--ui-safe-area-left)]",
className,
)}
data-tauri-drag-region
>
<>
<Controls className="fixed top-0 right-0 m-1.75 mr-[7.6px]! ring-foreground/15" />
<Controls className="fixed top-[max(0.4375rem,var(--ui-safe-area-top))] right-[max(0.475rem,var(--ui-safe-area-right))] ring-foreground/15" />
{children}
</>
</div>
@ -87,9 +86,8 @@ export function StorageDestoryer() {
return (
<div
className={cn(
"fixed p-5 bottom-0",
"fixed bottom-0 p-5 pr-[max(1.25rem,var(--ui-safe-area-right))] pb-[max(1.25rem,var(--ui-safe-area-bottom))] pl-[max(1.25rem,var(--ui-safe-area-left))]",
isMobile ? "w-full" : "right-0",
isTauri() ? "py-10" : "",
)}
>
<ClearStorageButton />