diff --git a/CLAUDE.md b/CLAUDE.md index 3cfd85001..9ee743ae2 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -444,6 +444,11 @@ day of guessing at it: | Expo Go 57.0.5 | 0.86.0 | 0.10.0 | 4.5.0 | 2.32.0 | | Expo Go 57.0.6 | 0.86.2 | 0.10.1 | 4.5.1 | 2.32.0 | | Expo Go 57.0.9 | 0.86.2 | 0.10.1 | 4.5.1 | 2.32.0 | +| Expo Go 58.0.7 | 0.88.0 | not in the strings | not in the strings | 3.3.0 | + +For 58.0.7 the worklets and reanimated versions are not in the binary's strings; they were pinned +to the SDK's own (0.13.0, 4.7.1) and confirmed by running the example, which aborts at start-up on +a mismatch. The same client is what the App Store serves for SDK 58 (2026-11-02). Measured, not read off a manifest — and the measurement is the point, because **`api.expo.dev/v2/versions/latest` reports `facebookReactNativeVersion: 0.86.3` for SDK 57 and diff --git a/apps/docs/components/showcase/themer.tsx b/apps/docs/components/showcase/themer.tsx index 29403e1a7..c6c058eec 100644 --- a/apps/docs/components/showcase/themer.tsx +++ b/apps/docs/components/showcase/themer.tsx @@ -122,8 +122,6 @@ export function Themer({ children }: { children: ReactNode }): React.ReactElemen diff --git a/apps/docs/components/web-demos/badge/icons.tsx b/apps/docs/components/web-demos/badge/icons.tsx new file mode 100644 index 000000000..adf3a267b --- /dev/null +++ b/apps/docs/components/web-demos/badge/icons.tsx @@ -0,0 +1,21 @@ +import { Badge } from 'panelui-web/badge'; +import { LeafIcon, LockIcon, SparklesIcon } from 'lucide-react'; + +export default function BadgeIcons() { + return ( +
+ + + Private + + + + Low carbon + + + + Pro + +
+ ); +} diff --git a/apps/docs/components/web-demos/badge/overview.tsx b/apps/docs/components/web-demos/badge/overview.tsx new file mode 100644 index 000000000..f07eaaf87 --- /dev/null +++ b/apps/docs/components/web-demos/badge/overview.tsx @@ -0,0 +1,23 @@ +import { Badge } from 'panelui-web/badge'; + +export default function BadgeOverview() { + return ( +
+ New + Draft + v2.4 + + Paid + + + Syncing + + + Due Friday + + + Overdue + +
+ ); +} diff --git a/apps/docs/components/web-demos/badge/sizes.tsx b/apps/docs/components/web-demos/badge/sizes.tsx new file mode 100644 index 000000000..1ca608100 --- /dev/null +++ b/apps/docs/components/web-demos/badge/sizes.tsx @@ -0,0 +1,17 @@ +import { Badge } from 'panelui-web/badge'; + +export default function BadgeSizes() { + return ( +
+ + Small + + + Medium + + + Large + +
+ ); +} diff --git a/apps/docs/components/web-demos/badge/statuses.tsx b/apps/docs/components/web-demos/badge/statuses.tsx new file mode 100644 index 000000000..78f3d1b5e --- /dev/null +++ b/apps/docs/components/web-demos/badge/statuses.tsx @@ -0,0 +1,23 @@ +import { Badge } from 'panelui-web/badge'; + +const RUNS = [ + { name: 'Nightly backup', status: 'Running', variant: 'info' as const, live: true }, + { name: 'Image resize queue', status: 'Healthy', variant: 'success' as const, live: false }, + { name: 'Invoice export', status: 'Retrying', variant: 'warning' as const, live: true }, + { name: 'Search reindex', status: 'Stopped', variant: 'destructive' as const, live: false }, +]; + +export default function BadgeStatuses() { + return ( + + ); +} diff --git a/apps/docs/components/web-demos/badge/thumb.tsx b/apps/docs/components/web-demos/badge/thumb.tsx new file mode 100644 index 000000000..47ab421ef --- /dev/null +++ b/apps/docs/components/web-demos/badge/thumb.tsx @@ -0,0 +1,14 @@ +import { Badge } from 'panelui-web/badge'; + +export default function BadgeThumb() { + return ( +
+ + Paid + + + Syncing + +
+ ); +} diff --git a/apps/docs/components/web-demos/card/footer.tsx b/apps/docs/components/web-demos/card/footer.tsx index 1d9452051..52596e144 100644 --- a/apps/docs/components/web-demos/card/footer.tsx +++ b/apps/docs/components/web-demos/card/footer.tsx @@ -1,5 +1,5 @@ -import { Button } from '@/components/ui/button'; -import { Input } from '@/components/ui/input'; +import { Button } from 'panelui-web/button'; +import { Input } from 'panelui-web/input'; import { Card } from 'panelui-web/card'; export default function CardFooterVariants() { diff --git a/apps/docs/components/web-demos/card/form.tsx b/apps/docs/components/web-demos/card/form.tsx index 22fab2fc7..39b2b528f 100644 --- a/apps/docs/components/web-demos/card/form.tsx +++ b/apps/docs/components/web-demos/card/form.tsx @@ -1,6 +1,6 @@ -import { Button } from '@/components/ui/button'; -import { Field, FieldDescription, FieldLabel } from '@/components/ui/field'; -import { Input } from '@/components/ui/input'; +import { Button } from 'panelui-web/button'; +import { Field } from 'panelui-web/field'; +import { Input } from 'panelui-web/input'; import { Card } from 'panelui-web/card'; export default function CardForm() { @@ -18,13 +18,13 @@ export default function CardForm() {
- Work email + Work email - Workspace name + Workspace name - You can change it at any time. + You can change it at any time.
diff --git a/apps/docs/components/web-demos/card/image.tsx b/apps/docs/components/web-demos/card/image.tsx index 7ec8ac7e8..57078343a 100644 --- a/apps/docs/components/web-demos/card/image.tsx +++ b/apps/docs/components/web-demos/card/image.tsx @@ -1,5 +1,5 @@ -import { Badge } from '@/components/ui/badge'; -import { Button } from '@/components/ui/button'; +import { Badge } from 'panelui-web/badge'; +import { Button } from 'panelui-web/button'; import { Card } from 'panelui-web/card'; export default function CardImage() { diff --git a/apps/docs/components/web-demos/card/list.tsx b/apps/docs/components/web-demos/card/list.tsx index e536ebfd0..dd8058266 100644 --- a/apps/docs/components/web-demos/card/list.tsx +++ b/apps/docs/components/web-demos/card/list.tsx @@ -1,4 +1,4 @@ -import { Badge } from '@/components/ui/badge'; +import { Badge } from 'panelui-web/badge'; import { Card } from 'panelui-web/card'; const PROJECTS = [ diff --git a/apps/docs/components/web-demos/card/sizes.tsx b/apps/docs/components/web-demos/card/sizes.tsx index d6e49adbf..ba7baa878 100644 --- a/apps/docs/components/web-demos/card/sizes.tsx +++ b/apps/docs/components/web-demos/card/sizes.tsx @@ -1,4 +1,4 @@ -import { Badge } from '@/components/ui/badge'; +import { Badge } from 'panelui-web/badge'; import { Card } from 'panelui-web/card'; function Report({ size }: { size: 'default' | 'sm' }) { diff --git a/apps/docs/components/web-demos/checkbox/colors.tsx b/apps/docs/components/web-demos/checkbox/colors.tsx new file mode 100644 index 000000000..53fe0fc96 --- /dev/null +++ b/apps/docs/components/web-demos/checkbox/colors.tsx @@ -0,0 +1,23 @@ +import { Checkbox } from 'panelui-web/checkbox'; +import { Label } from 'panelui-web/label'; + +export default function CheckboxColors() { + return ( +
+
+ + + + +
+ + +
+ ); +} diff --git a/apps/docs/components/web-demos/checkbox/form.tsx b/apps/docs/components/web-demos/checkbox/form.tsx new file mode 100644 index 000000000..1fe7684b2 --- /dev/null +++ b/apps/docs/components/web-demos/checkbox/form.tsx @@ -0,0 +1,29 @@ +'use client'; + +import { useState } from 'react'; +import { Button } from 'panelui-web/button'; +import { Checkbox } from 'panelui-web/checkbox'; +import { Field } from 'panelui-web/field'; +import { Label } from 'panelui-web/label'; + +export default function CheckboxForm() { + const [sent, setSent] = useState(false); + return ( +
{ + event.preventDefault(); + setSent(true); + }} + > + + + + I have read the hire agreement + + Tick the box to book the van. + + +
+ ); +} diff --git a/apps/docs/components/web-demos/checkbox/overview.tsx b/apps/docs/components/web-demos/checkbox/overview.tsx new file mode 100644 index 000000000..a3970eac0 --- /dev/null +++ b/apps/docs/components/web-demos/checkbox/overview.tsx @@ -0,0 +1,22 @@ +import { Checkbox } from 'panelui-web/checkbox'; +import { Label } from 'panelui-web/label'; + +export default function CheckboxOverview() { + return ( +
+ + + +
+ ); +} diff --git a/apps/docs/components/web-demos/checkbox/parent.tsx b/apps/docs/components/web-demos/checkbox/parent.tsx new file mode 100644 index 000000000..240f500c0 --- /dev/null +++ b/apps/docs/components/web-demos/checkbox/parent.tsx @@ -0,0 +1,40 @@ +'use client'; + +import { useState } from 'react'; +import { Checkbox } from 'panelui-web/checkbox'; +import { Label } from 'panelui-web/label'; + +const ROOMS = [ + { value: 'kitchen', label: 'Kitchen lights' }, + { value: 'hall', label: 'Hallway lights' }, + { value: 'porch', label: 'Porch light' }, +]; + +export default function CheckboxParent() { + const [on, setOn] = useState(['hall']); + return ( + room.value)} + aria-labelledby="rooms-heading" + className="w-full max-w-xs" + > + +
+ {ROOMS.map((room) => ( + + ))} +
+ + ); +} diff --git a/apps/docs/components/web-demos/checkbox/thumb.tsx b/apps/docs/components/web-demos/checkbox/thumb.tsx new file mode 100644 index 000000000..449535b07 --- /dev/null +++ b/apps/docs/components/web-demos/checkbox/thumb.tsx @@ -0,0 +1,11 @@ +import { Checkbox } from 'panelui-web/checkbox'; + +export default function CheckboxThumb() { + return ( +
+ + + +
+ ); +} diff --git a/apps/docs/components/web-demos/chip/colors.tsx b/apps/docs/components/web-demos/chip/colors.tsx new file mode 100644 index 000000000..687023830 --- /dev/null +++ b/apps/docs/components/web-demos/chip/colors.tsx @@ -0,0 +1,23 @@ +'use client'; + +import { Chip } from 'panelui-web/chip'; + +export default function ChipColors() { + return ( +
+ Primary + + In stock + + + Ships today + + + On sale + + + Discontinued + +
+ ); +} diff --git a/apps/docs/components/web-demos/chip/overview.tsx b/apps/docs/components/web-demos/chip/overview.tsx new file mode 100644 index 000000000..a21423fb1 --- /dev/null +++ b/apps/docs/components/web-demos/chip/overview.tsx @@ -0,0 +1,14 @@ +'use client'; + +import { Chip } from 'panelui-web/chip'; + +export default function ChipOverview() { + return ( + + Vegetarian + Under 30 minutes + One pot + Freezes well + + ); +} diff --git a/apps/docs/components/web-demos/chip/removable.tsx b/apps/docs/components/web-demos/chip/removable.tsx new file mode 100644 index 000000000..a5ef1aeca --- /dev/null +++ b/apps/docs/components/web-demos/chip/removable.tsx @@ -0,0 +1,35 @@ +'use client'; + +import { useState } from 'react'; +import { Chip } from 'panelui-web/chip'; +import { Input } from 'panelui-web/input'; + +export default function ChipRemovable() { + const [tags, setTags] = useState(['kitchen', 'renovation', 'quotes']); + const [draft, setDraft] = useState(''); + + return ( +
+ setDraft(event.target.value)} + onKeyDown={(event) => { + const tag = draft.trim().toLowerCase(); + if (event.key === 'Enter' && tag && !tags.includes(tag)) { + setTags([...tags, tag]); + setDraft(''); + } + }} + /> +
+ {tags.map((tag) => ( + setTags(tags.filter((t) => t !== tag))}> + {tag} + + ))} +
+
+ ); +} diff --git a/apps/docs/components/web-demos/chip/single.tsx b/apps/docs/components/web-demos/chip/single.tsx new file mode 100644 index 000000000..48b445e5e --- /dev/null +++ b/apps/docs/components/web-demos/chip/single.tsx @@ -0,0 +1,27 @@ +'use client'; + +import { useState } from 'react'; +import { Chip } from 'panelui-web/chip'; + +const RANGES = ['Today', 'This week', 'This month', 'All time']; + +export default function ChipSingle() { + const [range, setRange] = useState(['This week']); + return ( +
+ next.length > 0 && setRange(next)} + aria-label="Date range" + > + {RANGES.map((label) => ( + + {label} + + ))} + +

Showing: {range[0]}

+
+ ); +} diff --git a/apps/docs/components/web-demos/chip/thumb.tsx b/apps/docs/components/web-demos/chip/thumb.tsx new file mode 100644 index 000000000..ed0fd305b --- /dev/null +++ b/apps/docs/components/web-demos/chip/thumb.tsx @@ -0,0 +1,12 @@ +'use client'; + +import { Chip } from 'panelui-web/chip'; + +export default function ChipThumb() { + return ( + + Quick + Easy + + ); +} diff --git a/apps/docs/components/web-demos/feedback/blur.tsx b/apps/docs/components/web-demos/feedback/blur.tsx index 237e0e059..28f93e76c 100644 --- a/apps/docs/components/web-demos/feedback/blur.tsx +++ b/apps/docs/components/web-demos/feedback/blur.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { Feedback } from 'panelui-web/feedback'; export default function FeedbackBlur() { diff --git a/apps/docs/components/web-demos/feedback/dialog.tsx b/apps/docs/components/web-demos/feedback/dialog.tsx index bfa69dc51..0ce2fa3d8 100644 --- a/apps/docs/components/web-demos/feedback/dialog.tsx +++ b/apps/docs/components/web-demos/feedback/dialog.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { Feedback } from 'panelui-web/feedback'; export default function FeedbackDialog() { diff --git a/apps/docs/components/web-demos/feedback/draft.tsx b/apps/docs/components/web-demos/feedback/draft.tsx index 60c188e1c..e67959da1 100644 --- a/apps/docs/components/web-demos/feedback/draft.tsx +++ b/apps/docs/components/web-demos/feedback/draft.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { Feedback } from 'panelui-web/feedback'; /** Short answers are rarely useful ones. */ diff --git a/apps/docs/components/web-demos/feedback/failed.tsx b/apps/docs/components/web-demos/feedback/failed.tsx index d65938e37..2dc04fcb4 100644 --- a/apps/docs/components/web-demos/feedback/failed.tsx +++ b/apps/docs/components/web-demos/feedback/failed.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { Feedback } from 'panelui-web/feedback'; /** Stands in for a request. It fails once, so there is a failure to look at. */ diff --git a/apps/docs/components/web-demos/feedback/score.tsx b/apps/docs/components/web-demos/feedback/score.tsx index a34fa5b4b..5dc249b1d 100644 --- a/apps/docs/components/web-demos/feedback/score.tsx +++ b/apps/docs/components/web-demos/feedback/score.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { cn } from '@/lib/utils'; import { Feedback } from 'panelui-web/feedback'; diff --git a/apps/docs/components/web-demos/feedback/tags.tsx b/apps/docs/components/web-demos/feedback/tags.tsx index 35256c65f..2cf09e549 100644 --- a/apps/docs/components/web-demos/feedback/tags.tsx +++ b/apps/docs/components/web-demos/feedback/tags.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { Button } from '@/components/ui/button'; +import { Button } from 'panelui-web/button'; import { cn } from '@/lib/utils'; import { Feedback } from 'panelui-web/feedback'; diff --git a/apps/docs/components/web-demos/field/controls.tsx b/apps/docs/components/web-demos/field/controls.tsx new file mode 100644 index 000000000..65fece761 --- /dev/null +++ b/apps/docs/components/web-demos/field/controls.tsx @@ -0,0 +1,47 @@ +'use client'; + +import { Field } from 'panelui-web/field'; +import { Label } from 'panelui-web/label'; +import { Select } from 'panelui-web/select'; +import { Switch } from 'panelui-web/switch'; +import { Textarea } from 'panelui-web/textarea'; + +const ROOMS = [ + { value: 'studio', label: 'The studio' }, + { value: 'garden', label: 'Garden room' }, + { value: 'loft', label: 'Loft' }, +]; + +export default function FieldControls() { + return ( +
+ + Room + + + + Notes for the host +