diff --git a/.changeset/professional-theme-presets.md b/.changeset/professional-theme-presets.md deleted file mode 100644 index 451a22e..0000000 --- a/.changeset/professional-theme-presets.md +++ /dev/null @@ -1,38 +0,0 @@ ---- -"@prescriptive/tokens": minor -"@prescriptive/skill": patch ---- - -Redesign the predefined themes so the presets look like current products rather -than tinted washes of one hue. - -The old presets pushed their hue through the whole neutral ramp — indigo -surfaces, indigo borders, indigo text — which read as monochromatic and dated, -and left steps 300–600 as the unrelated warm grays of the baseline. Every theme -is now built the way modern product palettes are: **the ramp stays close to -gray, and saturation is spent on the accent, status, and chart roles.** The -theme's hue survives in surfaces and text only as a few percent of chroma. - -- **Twelve themes**, each with a `description` of what it is for: `monochrome`, - `graphite`, `indigo`, `azure`, `ocean`, `forest`, `violet`, `plum`, `coral`, - `sunset`, `editorial`, `terminal`. `vibrant` and `candy` are gone; `graphite`, - `azure`, `violet` and `plum` are new. -- **Complete ramps.** Each theme defines all twelve neutral steps on a shared - OKLCH lightness ladder, so no theme mixes its own tint with baseline grays and - every theme has the same contrast structure. -- **Categorical chart sets.** Themes now set `color.chart.1…6` to six - distinguishable hues rotated off their own, instead of inheriting the - grayscale ramp where every series looked alike. -- **Dark mode that works.** The `dark` mode overlay puts `surface` a step - *above* `paper` (so cards read as raised, as they do in light mode), re-tunes - every status color for a dark page, and swaps the shadows for near-black ones - — a 5%-alpha warm gray was invisible on a dark surface. Each theme's own - `dark` block re-tints those surfaces to its hue and lifts its accent. -- **Tinted shadows, per-theme type and radii.** Ambient shadows carry a hint of - the theme's hue; `graphite` and `editorial` invert to a light accent fill in - dark mode, and `terminal`'s signal-green fill carries a dark label. -- **AA by construction.** Accents, status colors, and chart series are derived - from the contrast requirement itself, so ink/paper, muted/surface, - label/accent-fill, status/paper and series/paper all clear WCAG AA in both - modes. The baseline `color.status.*` values move with them (`success` and - `warning` previously failed AA as text on `paper`). diff --git a/.changeset/reativa-components-batch-three.md b/.changeset/reativa-components-batch-three.md deleted file mode 100644 index e70d456..0000000 --- a/.changeset/reativa-components-batch-three.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -"@prescriptive/reativa": minor ---- - -Add the final batch of reativa example implementations, reaching **full parity** -with the Xote examples — every spec that has a Xote demo now has a matching -**Reativa** preview, mirroring `website/src/Examples.res`. - -- **components**: `form`, `resizable`, `search`, `comment` -- **pages**: `dashboard`, `landing-page`, `pricing`, `settings`, `sign-in` -- **flows**: `authentication`, `checkout`, `onboarding` - -`search` filters a list live with `View.for_`; `resizable` binds a range input -to a reactive `style` on both panels; `form` submits with `View.On.submit` + -`prevent_default` and reveals a success message via `View.show`; `sign-in` wires -a native checkbox through a reactive `checked` binding; the `authentication` and -`onboarding` flows step through their states from a single `step` signal. -Registered in `Registry.mlx`'s `example_for` / `example_ids`. reativa now covers -26 elements, 42 components, 13 blocks, 5 pages, and 3 flows — the same set Xote -implements. diff --git a/.changeset/reativa-components-batch-two.md b/.changeset/reativa-components-batch-two.md deleted file mode 100644 index e1a0cd7..0000000 --- a/.changeset/reativa-components-batch-two.md +++ /dev/null @@ -1,23 +0,0 @@ ---- -"@prescriptive/reativa": minor ---- - -Add the second batch of 20 more `@prescriptive/reativa` example implementations — -the overlay, data, picker, and navigation components — so each spec gets a -**Reativa** preview alongside the Xote one, matching the demos in -`website/src/Examples.res`. - -- **overlays & menus**: `alert-dialog`, `dropdown-menu`, `context-menu`, - `popover`, `hover-card`, `sheet`, `drawer`, `toast` -- **data & pickers**: `table`, `data-table`, `chart`, `carousel`, `combobox`, - `command`, `calendar`, `date-picker` -- **navigation**: `navbar`, `menubar`, `navigation-menu`, `sidebar` - -These lean on `Reativa.View`'s reactive primitives: `View.show` for the -open/closed overlays (dismissed via the existing `Backdrop`), `View.for_` for -the live-filtered lists (`combobox`, `command`, `data-table`), `class_reactive` -for the selected-day / active-dot state (`calendar`, `date-picker`, `carousel`), -and a reactive `style` for the carousel track. `context-menu` and `hover-card` -use `View.On.on` for the `contextmenu` / `mouseenter` / `mouseleave` events. -Registered in `Registry.mlx`'s `example_for` / `example_ids`. This brings -reativa to 26 elements, 38 components, and 13 blocks. diff --git a/.changeset/reativa-playground-render.md b/.changeset/reativa-playground-render.md deleted file mode 100644 index 4455f83..0000000 --- a/.changeset/reativa-playground-render.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -"@prescriptive/reativa": minor ---- - -Render the website's playground with reativa too. `Registry.mlx` gains -`playground_for` — a knob-driven render of a single component for each of the 30 -specs the playground covers (`button`, `badge`, `avatar`, `alert`, `checkbox`, -`switch`, `slider`, `progress`, `spinner`, `skeleton`, `separator`, `kbd`, -`icon`, `icon-button`, `link`, `input`, `textarea`, `toggle`, `toggle-group`, -`radio-group`, `aspect-ratio`, `scroll-area`, `input-otp`, `select`, `field`, -`tooltip`, `tabs`, `accordion`, `collapsible`, `dialog`) — mirroring the Xote -render functions prop for prop, with the generated contract types keeping the -allowed values honest. - -Two new exports join the JS surface the website consumes: -`mount_playground(specId, containerId, props)`, which renders a spec from the -knob values the props panel currently holds, and `playground_ids`, so the site -knows which specs reativa can drive. diff --git a/packages/reativa/CHANGELOG.md b/packages/reativa/CHANGELOG.md index 63c399d..a5487f4 100644 --- a/packages/reativa/CHANGELOG.md +++ b/packages/reativa/CHANGELOG.md @@ -1,5 +1,66 @@ # @prescriptive/reativa +## 0.4.0 + +### Minor Changes + +- 19d5252: Add the final batch of reativa example implementations, reaching **full parity** + with the Xote examples — every spec that has a Xote demo now has a matching + **Reativa** preview, mirroring `website/src/Examples.res`. + + - **components**: `form`, `resizable`, `search`, `comment` + - **pages**: `dashboard`, `landing-page`, `pricing`, `settings`, `sign-in` + - **flows**: `authentication`, `checkout`, `onboarding` + + `search` filters a list live with `View.for_`; `resizable` binds a range input + to a reactive `style` on both panels; `form` submits with `View.On.submit` + + `prevent_default` and reveals a success message via `View.show`; `sign-in` wires + a native checkbox through a reactive `checked` binding; the `authentication` and + `onboarding` flows step through their states from a single `step` signal. + Registered in `Registry.mlx`'s `example_for` / `example_ids`. reativa now covers + 26 elements, 42 components, 13 blocks, 5 pages, and 3 flows — the same set Xote + implements. + +- 19d5252: Add the second batch of 20 more `@prescriptive/reativa` example implementations — + the overlay, data, picker, and navigation components — so each spec gets a + **Reativa** preview alongside the Xote one, matching the demos in + `website/src/Examples.res`. + + - **overlays & menus**: `alert-dialog`, `dropdown-menu`, `context-menu`, + `popover`, `hover-card`, `sheet`, `drawer`, `toast` + - **data & pickers**: `table`, `data-table`, `chart`, `carousel`, `combobox`, + `command`, `calendar`, `date-picker` + - **navigation**: `navbar`, `menubar`, `navigation-menu`, `sidebar` + + These lean on `Reativa.View`'s reactive primitives: `View.show` for the + open/closed overlays (dismissed via the existing `Backdrop`), `View.for_` for + the live-filtered lists (`combobox`, `command`, `data-table`), `class_reactive` + for the selected-day / active-dot state (`calendar`, `date-picker`, `carousel`), + and a reactive `style` for the carousel track. `context-menu` and `hover-card` + use `View.On.on` for the `contextmenu` / `mouseenter` / `mouseleave` events. + Registered in `Registry.mlx`'s `example_for` / `example_ids`. This brings + reativa to 26 elements, 38 components, and 13 blocks. + +- c3d692e: Render the website's playground with reativa too. `Registry.mlx` gains + `playground_for` — a knob-driven render of a single component for each of the 30 + specs the playground covers (`button`, `badge`, `avatar`, `alert`, `checkbox`, + `switch`, `slider`, `progress`, `spinner`, `skeleton`, `separator`, `kbd`, + `icon`, `icon-button`, `link`, `input`, `textarea`, `toggle`, `toggle-group`, + `radio-group`, `aspect-ratio`, `scroll-area`, `input-otp`, `select`, `field`, + `tooltip`, `tabs`, `accordion`, `collapsible`, `dialog`) — mirroring the Xote + render functions prop for prop, with the generated contract types keeping the + allowed values honest. + + Two new exports join the JS surface the website consumes: + `mount_playground(specId, containerId, props)`, which renders a spec from the + knob values the props panel currently holds, and `playground_ids`, so the site + knows which specs reativa can drive. + +### Patch Changes + +- Updated dependencies [e646367] + - @prescriptive/tokens@0.2.0 + ## 0.3.0 ### Minor Changes diff --git a/packages/reativa/package.json b/packages/reativa/package.json index 3c2314e..fb6c574 100644 --- a/packages/reativa/package.json +++ b/packages/reativa/package.json @@ -1,6 +1,6 @@ { "name": "@prescriptive/reativa", - "version": "0.3.0", + "version": "0.4.0", "description": "Accessible UI components for Reativa (OCaml + Melange) that implement the Prescriptive contracts — the ReasonML/OCaml sibling of @prescriptive/xote. Styled against @prescriptive/tokens; prop types are generated from the spec API contracts, so the implementation can't drift from the spec.", "license": "MIT", "author": "brnrdog", @@ -27,7 +27,7 @@ "prepack": "npm run contracts" }, "dependencies": { - "@prescriptive/tokens": "^0.1.0" + "@prescriptive/tokens": "^0.2.0" }, "repository": { "type": "git", diff --git a/packages/tokens/CHANGELOG.md b/packages/tokens/CHANGELOG.md new file mode 100644 index 0000000..61ae090 --- /dev/null +++ b/packages/tokens/CHANGELOG.md @@ -0,0 +1,39 @@ +# @prescriptive/tokens + +## 0.2.0 + +### Minor Changes + +- e646367: Redesign the predefined themes so the presets look like current products rather + than tinted washes of one hue. + + The old presets pushed their hue through the whole neutral ramp — indigo + surfaces, indigo borders, indigo text — which read as monochromatic and dated, + and left steps 300–600 as the unrelated warm grays of the baseline. Every theme + is now built the way modern product palettes are: **the ramp stays close to + gray, and saturation is spent on the accent, status, and chart roles.** The + theme's hue survives in surfaces and text only as a few percent of chroma. + + - **Twelve themes**, each with a `description` of what it is for: `monochrome`, + `graphite`, `indigo`, `azure`, `ocean`, `forest`, `violet`, `plum`, `coral`, + `sunset`, `editorial`, `terminal`. `vibrant` and `candy` are gone; `graphite`, + `azure`, `violet` and `plum` are new. + - **Complete ramps.** Each theme defines all twelve neutral steps on a shared + OKLCH lightness ladder, so no theme mixes its own tint with baseline grays and + every theme has the same contrast structure. + - **Categorical chart sets.** Themes now set `color.chart.1…6` to six + distinguishable hues rotated off their own, instead of inheriting the + grayscale ramp where every series looked alike. + - **Dark mode that works.** The `dark` mode overlay puts `surface` a step + _above_ `paper` (so cards read as raised, as they do in light mode), re-tunes + every status color for a dark page, and swaps the shadows for near-black ones + — a 5%-alpha warm gray was invisible on a dark surface. Each theme's own + `dark` block re-tints those surfaces to its hue and lifts its accent. + - **Tinted shadows, per-theme type and radii.** Ambient shadows carry a hint of + the theme's hue; `graphite` and `editorial` invert to a light accent fill in + dark mode, and `terminal`'s signal-green fill carries a dark label. + - **AA by construction.** Accents, status colors, and chart series are derived + from the contrast requirement itself, so ink/paper, muted/surface, + label/accent-fill, status/paper and series/paper all clear WCAG AA in both + modes. The baseline `color.status.*` values move with them (`success` and + `warning` previously failed AA as text on `paper`). diff --git a/packages/tokens/package.json b/packages/tokens/package.json index 00206f3..61d1c5d 100644 --- a/packages/tokens/package.json +++ b/packages/tokens/package.json @@ -1,6 +1,6 @@ { "name": "@prescriptive/tokens", - "version": "0.1.0", + "version": "0.2.0", "description": "Design tokens for Prescriptive — CSS custom properties, a Tailwind v4 preset, theme overlays, and a typed JS export. Generated from the framework's W3C DTCG tokens.", "license": "MIT", "author": "brnrdog", diff --git a/packages/xote/CHANGELOG.md b/packages/xote/CHANGELOG.md index f7ab7a8..1a0e24a 100644 --- a/packages/xote/CHANGELOG.md +++ b/packages/xote/CHANGELOG.md @@ -1,5 +1,12 @@ # @prescriptive/xote +## 0.2.1 + +### Patch Changes + +- Updated dependencies [e646367] + - @prescriptive/tokens@0.2.0 + ## 0.2.0 ### Minor Changes diff --git a/packages/xote/package.json b/packages/xote/package.json index 65f6da8..ca9edcf 100644 --- a/packages/xote/package.json +++ b/packages/xote/package.json @@ -1,6 +1,6 @@ { "name": "@prescriptive/xote", - "version": "0.2.0", + "version": "0.2.1", "description": "Accessible UI components for Xote/ReScript that implement the Prescriptive contracts. Styled against @prescriptive/tokens; prop types are generated from the spec API contracts, so the implementation can't drift from the spec.", "license": "MIT", "author": "brnrdog", @@ -32,7 +32,7 @@ "xote": ">=7.0.0" }, "dependencies": { - "@prescriptive/tokens": "^0.1.0" + "@prescriptive/tokens": "^0.2.0" }, "repository": { "type": "git", diff --git a/skill/CHANGELOG.md b/skill/CHANGELOG.md new file mode 100644 index 0000000..d7b7f32 --- /dev/null +++ b/skill/CHANGELOG.md @@ -0,0 +1,39 @@ +# @prescriptive/skill + +## 0.1.1 + +### Patch Changes + +- e646367: Redesign the predefined themes so the presets look like current products rather + than tinted washes of one hue. + + The old presets pushed their hue through the whole neutral ramp — indigo + surfaces, indigo borders, indigo text — which read as monochromatic and dated, + and left steps 300–600 as the unrelated warm grays of the baseline. Every theme + is now built the way modern product palettes are: **the ramp stays close to + gray, and saturation is spent on the accent, status, and chart roles.** The + theme's hue survives in surfaces and text only as a few percent of chroma. + + - **Twelve themes**, each with a `description` of what it is for: `monochrome`, + `graphite`, `indigo`, `azure`, `ocean`, `forest`, `violet`, `plum`, `coral`, + `sunset`, `editorial`, `terminal`. `vibrant` and `candy` are gone; `graphite`, + `azure`, `violet` and `plum` are new. + - **Complete ramps.** Each theme defines all twelve neutral steps on a shared + OKLCH lightness ladder, so no theme mixes its own tint with baseline grays and + every theme has the same contrast structure. + - **Categorical chart sets.** Themes now set `color.chart.1…6` to six + distinguishable hues rotated off their own, instead of inheriting the + grayscale ramp where every series looked alike. + - **Dark mode that works.** The `dark` mode overlay puts `surface` a step + _above_ `paper` (so cards read as raised, as they do in light mode), re-tunes + every status color for a dark page, and swaps the shadows for near-black ones + — a 5%-alpha warm gray was invisible on a dark surface. Each theme's own + `dark` block re-tints those surfaces to its hue and lifts its accent. + - **Tinted shadows, per-theme type and radii.** Ambient shadows carry a hint of + the theme's hue; `graphite` and `editorial` invert to a light accent fill in + dark mode, and `terminal`'s signal-green fill carries a dark label. + - **AA by construction.** Accents, status colors, and chart series are derived + from the contrast requirement itself, so ink/paper, muted/surface, + label/accent-fill, status/paper and series/paper all clear WCAG AA in both + modes. The baseline `color.status.*` values move with them (`success` and + `warning` previously failed AA as text on `paper`). diff --git a/skill/package.json b/skill/package.json index dcbe530..9845a24 100644 --- a/skill/package.json +++ b/skill/package.json @@ -1,6 +1,6 @@ { "name": "@prescriptive/skill", - "version": "0.1.0", + "version": "0.1.1", "description": "The Prescriptive Agent Skill — UI specs, traits, design tokens, and the responsive vocabulary compiled into a reference an AI coding agent loads to implement UI to the contracts.", "license": "MIT", "author": "brnrdog",