reflex-silverpoint-react 0.2.0__tar.gz → 0.3.0__tar.gz

{reflex_silverpoint_react-0.2.0 → reflex_silverpoint_react-0.3.0}/PKG-INFO

@@ -1,14 +1,14 @@
 Metadata-Version: 2.4
 Name: reflex-silverpoint-react
-Version: 0.2.0
-Summary: The 33 silverpoint charts and the linked Dashboard (Renaissance silverpoint drawing style) for Reflex, wrapping @silverpoint/react
+Version: 0.3.0
+Summary: The 33 silverpoint charts, the linked Dashboard and the 17 UI components (Renaissance silverpoint drawing style) for Reflex, wrapping @silverpoint/react
 Author-email: Ernesto Crespo <ecrespo@gmail.com>
 License: MIT
 Project-URL: Homepage, https://github.com/ecrespo/reflex-silverpoint-react
 Project-URL: Source, https://github.com/ecrespo/reflex-silverpoint-react
 Project-URL: Issues, https://github.com/ecrespo/reflex-silverpoint-react/issues
 Project-URL: Upstream, https://github.com/ecrespo/silverpoint
-Keywords: reflex,reflex-custom-components,charts,silverpoint,data-visualization,svg
+Keywords: reflex,reflex-custom-components,charts,silverpoint,data-visualization,svg,ui-components
 Classifier: Development Status :: 4 - Beta
 Classifier: License :: OSI Approved :: MIT License
 Classifier: Programming Language :: Python :: 3
@@ -33,10 +33,22 @@ prepared ground, tone built from hatching, and white heightening on the live val
 The hand-drawn irregularity lives only in the ornament. The data geometry is exact, and every chart
 has a `precision` mode that turns the inking off.
 
-It wraps [`@silverpoint/react`](https://www.npmjs.com/package/@silverpoint/react) 0.2.0 and exposes
-**all 33 charts**, the **`Dashboard`** (a laid-out, linkable grid of charts), the
-`SilverpointProvider`, both grounds (`silverpoint` and `cyanotype`), the interaction events, custom
-readouts and the imperative handle (SVG export and geometry) as Python.
+It wraps [`@silverpoint/react`](https://www.npmjs.com/package/@silverpoint/react) 0.3.0 and exposes
+**all 33 charts**, the **`Dashboard`** (a laid-out, linkable grid of charts), the **17 UI
+components** (buttons, inputs, tabs, cards, alerts…), the `SilverpointProvider`, both grounds
+(`silverpoint` and `cyanotype`), the interaction events, custom readouts and the imperative handle
+(SVG export and geometry) as Python.
+
+### New in 0.3
+
+- **17 UI components**, drawn as the charts are: `sp_button`, `sp_input`, `sp_checkbox`,
+  `sp_switch`, `sp_radio_group`, `sp_slider`, `sp_rate`, `sp_segmented`, `sp_tabs` (with
+  `sp_tab_panel`), `sp_steps`, `sp_card`, `sp_tag`, `sp_badge`, `sp_divider`, `sp_progress`,
+  `sp_alert` and `sp_skeleton`. Native controls underneath, controlled from Python. See
+  [UI components](#ui-components).
+- `UI_COMPONENTS` and `UI_DEMOS`: the catalog's 17 components, their 45 reference states, and
+  `ui_demo(slug, state)` to render any of them.
+- `substrate="prussian"` is accepted everywhere (the `cyanotype` ground's substrate).
 
 ### New in 0.2
 
@@ -58,7 +70,8 @@ uv add reflex-silverpoint-react
 Nothing else to do on the JavaScript side: Reflex installs `@silverpoint/react`,
 `@silverpoint/core`, `@silverpoint/grounds` and `@silverpoint/fonts`, and every chart imports the two
 stylesheets it needs (`@silverpoint/grounds/styles.css` and the self-hosted EB Garamond of
-`@silverpoint/fonts/fonts.css`). No Tailwind, no CDN.
+`@silverpoint/fonts/fonts.css`); the UI components also import `@silverpoint/grounds/ui.css`. No
+Tailwind, no CDN.
 
 Requires Reflex 0.9.12 or later (React 19).
 
@@ -192,6 +205,88 @@ dashboard(
   can also pass a plain dict.
 - The layout values and the charts' props can be state vars.
 
+## UI components
+
+New in silverpoint 0.3: seventeen interface components with frames hand-drawn by each ground's own
+inker and tone laid as hatching (`silverpoint`) or as the weight of an exact white line
+(`cyanotype`). Each is a native control underneath (a `<button>`, an `<input>`, a `<fieldset>` of
+radios), so forms submit natively and the keyboard follows the WAI-ARIA patterns. They are imported
+from `@silverpoint/react/ui`.
+
+![The UI components in the demo app](docs/ui-components.png)
+
+| Group | Components |
+|---|---|
+| Actions | `sp_button` |
+| Data entry | `sp_input`, `sp_checkbox`, `sp_radio_group`, `sp_switch`, `sp_slider`, `sp_rate`, `sp_segmented` |
+| Navigation | `sp_tabs` + `sp_tab_panel`, `sp_steps` |
+| Data display | `sp_card`, `sp_tag`, `sp_badge`, `sp_divider` |
+| Feedback | `sp_progress`, `sp_alert`, `sp_skeleton` |
+
+```python
+from reflex_silverpoint_react import sp_button, sp_input, sp_switch, sp_tab_panel, sp_tabs, ui_item
+
+
+class State(rx.State):
+    city: str = "Caracas"
+    precision: bool = False
+    view: str = "traffic"
+
+    @rx.event
+    def set_city(self, value: str):  # on_change gets the value, not an event
+        self.city = value
+
+    @rx.event
+    def set_precision(self, value: bool):
+        self.precision = value
+
+    @rx.event
+    def set_view(self, value: str):
+        self.view = value
+
+    @rx.event
+    def save(self, form: dict):
+        print(form)  # {"city": "Caracas", ...}: the native inputs submit under their name
+
+
+rx.el.form(
+    sp_input(
+        label="City",
+        name="city",
+        value=State.city,
+        on_change=State.set_city,
+        invalid=State.city == "",
+        message="Required: pick a city",
+    ),
+    sp_switch(label="Precision", checked=State.precision, on_change=State.set_precision),
+    sp_tabs(
+        sp_tab_panel(line_chart(...), value="traffic"),
+        sp_tab_panel(bar_chart(...), value="errors"),
+        items=[ui_item("traffic", "Traffic"), ui_item("errors", "Errors")],
+        value=State.view,
+        on_change=State.set_view,
+    ),
+    sp_button("Save", type="submit", variant="primary"),
+    on_submit=State.save,
+)
+```
+
+- **Shared props**: `id`, `ground`, `substrate`, `mode`, `seed`, `size` (`sm`/`md`/`lg`) and
+  `class_name`. Like charts, they fall back to the dashboard, then to `silverpoint_provider`.
+- **Values**: value components are controlled (`value=` / `checked=` with `on_change`) or
+  uncontrolled (`default_value=` / `default_checked=`). `on_change` receives the new value itself (a
+  string, a bool or a number), never a DOM event.
+- **Items**: `ui_item(key, label, disabled=False)` for tabs, segmented and radio groups;
+  `step_item(key, title, description=None, status=None)` for steps.
+- **Slots**: children are a button's or tag's text, a card's or alert's body; `sp_card` also takes
+  `extra` and `footer`, and `sp_input` takes `prefix` and `suffix` (components or text).
+- **Close events**: `sp_tag(closable=True, on_close=...)` and `sp_alert(closable=True, on_close=...)`.
+- `UI_COMPONENTS` is the catalog (group, declared states, props reference) and `UI_DEMOS` the 45
+  reference states upstream ships; `ui_demo("radio-group", "selected", ground="cyanotype")` renders
+  one, uncontrolled.
+- Text inputs controlled from state make a round trip per keystroke; for long text, prefer
+  `default_value` and read the value on submit.
+
 ## Interaction
 
 ```python
@@ -263,8 +358,10 @@ controls, demo datasets vs data from Python state with a re-roll), **Playground*
 rendering choice and the Python that reproduces it), **Interaction** (events, custom readout, a
 volvelle that turns on click, live KPI/gauge/meter, SVG and geometry export), **Dashboard** (a
 linked operations dashboard fed from Python state with ground, substrate, mode and column controls, a
-KPI strip, and `dashboard_link` on its own) and one **reference page per chart** (`/chart/<slug>`)
-with its props. The Gallery and Playground also get a ground control, for `cyanotype`.
+KPI strip, and `dashboard_link` on its own), **UI components** (`/ui`: the components controlled from
+Python state with a native form submit, and the three reference panels of the upstream example apps
+in silverpoint ink, precision and cyanotype), one **reference page per chart** (`/chart/<slug>`) and
+one per UI component (`/ui/<slug>`: every declared state on both grounds, usage and props). The Gallery and Playground also get a ground control, for `cyanotype`.
 
 ![Interaction page](docs/interaction.png)
 

{reflex_silverpoint_react-0.2.0 → reflex_silverpoint_react-0.3.0}/README.md

@@ -7,10 +7,22 @@ prepared ground, tone built from hatching, and white heightening on the live val
 The hand-drawn irregularity lives only in the ornament. The data geometry is exact, and every chart
 has a `precision` mode that turns the inking off.
 
-It wraps [`@silverpoint/react`](https://www.npmjs.com/package/@silverpoint/react) 0.2.0 and exposes
-**all 33 charts**, the **`Dashboard`** (a laid-out, linkable grid of charts), the
-`SilverpointProvider`, both grounds (`silverpoint` and `cyanotype`), the interaction events, custom
-readouts and the imperative handle (SVG export and geometry) as Python.
+It wraps [`@silverpoint/react`](https://www.npmjs.com/package/@silverpoint/react) 0.3.0 and exposes
+**all 33 charts**, the **`Dashboard`** (a laid-out, linkable grid of charts), the **17 UI
+components** (buttons, inputs, tabs, cards, alerts…), the `SilverpointProvider`, both grounds
+(`silverpoint` and `cyanotype`), the interaction events, custom readouts and the imperative handle
+(SVG export and geometry) as Python.
+
+### New in 0.3
+
+- **17 UI components**, drawn as the charts are: `sp_button`, `sp_input`, `sp_checkbox`,
+  `sp_switch`, `sp_radio_group`, `sp_slider`, `sp_rate`, `sp_segmented`, `sp_tabs` (with
+  `sp_tab_panel`), `sp_steps`, `sp_card`, `sp_tag`, `sp_badge`, `sp_divider`, `sp_progress`,
+  `sp_alert` and `sp_skeleton`. Native controls underneath, controlled from Python. See
+  [UI components](#ui-components).
+- `UI_COMPONENTS` and `UI_DEMOS`: the catalog's 17 components, their 45 reference states, and
+  `ui_demo(slug, state)` to render any of them.
+- `substrate="prussian"` is accepted everywhere (the `cyanotype` ground's substrate).
 
 ### New in 0.2
 
@@ -32,7 +44,8 @@ uv add reflex-silverpoint-react
 Nothing else to do on the JavaScript side: Reflex installs `@silverpoint/react`,
 `@silverpoint/core`, `@silverpoint/grounds` and `@silverpoint/fonts`, and every chart imports the two
 stylesheets it needs (`@silverpoint/grounds/styles.css` and the self-hosted EB Garamond of
-`@silverpoint/fonts/fonts.css`). No Tailwind, no CDN.
+`@silverpoint/fonts/fonts.css`); the UI components also import `@silverpoint/grounds/ui.css`. No
+Tailwind, no CDN.
 
 Requires Reflex 0.9.12 or later (React 19).
 
@@ -166,6 +179,88 @@ dashboard(
   can also pass a plain dict.
 - The layout values and the charts' props can be state vars.
 
+## UI components
+
+New in silverpoint 0.3: seventeen interface components with frames hand-drawn by each ground's own
+inker and tone laid as hatching (`silverpoint`) or as the weight of an exact white line
+(`cyanotype`). Each is a native control underneath (a `<button>`, an `<input>`, a `<fieldset>` of
+radios), so forms submit natively and the keyboard follows the WAI-ARIA patterns. They are imported
+from `@silverpoint/react/ui`.
+
+![The UI components in the demo app](docs/ui-components.png)
+
+| Group | Components |
+|---|---|
+| Actions | `sp_button` |
+| Data entry | `sp_input`, `sp_checkbox`, `sp_radio_group`, `sp_switch`, `sp_slider`, `sp_rate`, `sp_segmented` |
+| Navigation | `sp_tabs` + `sp_tab_panel`, `sp_steps` |
+| Data display | `sp_card`, `sp_tag`, `sp_badge`, `sp_divider` |
+| Feedback | `sp_progress`, `sp_alert`, `sp_skeleton` |
+
+```python
+from reflex_silverpoint_react import sp_button, sp_input, sp_switch, sp_tab_panel, sp_tabs, ui_item
+
+
+class State(rx.State):
+    city: str = "Caracas"
+    precision: bool = False
+    view: str = "traffic"
+
+    @rx.event
+    def set_city(self, value: str):  # on_change gets the value, not an event
+        self.city = value
+
+    @rx.event
+    def set_precision(self, value: bool):
+        self.precision = value
+
+    @rx.event
+    def set_view(self, value: str):
+        self.view = value
+
+    @rx.event
+    def save(self, form: dict):
+        print(form)  # {"city": "Caracas", ...}: the native inputs submit under their name
+
+
+rx.el.form(
+    sp_input(
+        label="City",
+        name="city",
+        value=State.city,
+        on_change=State.set_city,
+        invalid=State.city == "",
+        message="Required: pick a city",
+    ),
+    sp_switch(label="Precision", checked=State.precision, on_change=State.set_precision),
+    sp_tabs(
+        sp_tab_panel(line_chart(...), value="traffic"),
+        sp_tab_panel(bar_chart(...), value="errors"),
+        items=[ui_item("traffic", "Traffic"), ui_item("errors", "Errors")],
+        value=State.view,
+        on_change=State.set_view,
+    ),
+    sp_button("Save", type="submit", variant="primary"),
+    on_submit=State.save,
+)
+```
+
+- **Shared props**: `id`, `ground`, `substrate`, `mode`, `seed`, `size` (`sm`/`md`/`lg`) and
+  `class_name`. Like charts, they fall back to the dashboard, then to `silverpoint_provider`.
+- **Values**: value components are controlled (`value=` / `checked=` with `on_change`) or
+  uncontrolled (`default_value=` / `default_checked=`). `on_change` receives the new value itself (a
+  string, a bool or a number), never a DOM event.
+- **Items**: `ui_item(key, label, disabled=False)` for tabs, segmented and radio groups;
+  `step_item(key, title, description=None, status=None)` for steps.
+- **Slots**: children are a button's or tag's text, a card's or alert's body; `sp_card` also takes
+  `extra` and `footer`, and `sp_input` takes `prefix` and `suffix` (components or text).
+- **Close events**: `sp_tag(closable=True, on_close=...)` and `sp_alert(closable=True, on_close=...)`.
+- `UI_COMPONENTS` is the catalog (group, declared states, props reference) and `UI_DEMOS` the 45
+  reference states upstream ships; `ui_demo("radio-group", "selected", ground="cyanotype")` renders
+  one, uncontrolled.
+- Text inputs controlled from state make a round trip per keystroke; for long text, prefer
+  `default_value` and read the value on submit.
+
 ## Interaction
 
 ```python
@@ -237,8 +332,10 @@ controls, demo datasets vs data from Python state with a re-roll), **Playground*
 rendering choice and the Python that reproduces it), **Interaction** (events, custom readout, a
 volvelle that turns on click, live KPI/gauge/meter, SVG and geometry export), **Dashboard** (a
 linked operations dashboard fed from Python state with ground, substrate, mode and column controls, a
-KPI strip, and `dashboard_link` on its own) and one **reference page per chart** (`/chart/<slug>`)
-with its props. The Gallery and Playground also get a ground control, for `cyanotype`.
+KPI strip, and `dashboard_link` on its own), **UI components** (`/ui`: the components controlled from
+Python state with a native form submit, and the three reference panels of the upstream example apps
+in silverpoint ink, precision and cyanotype), one **reference page per chart** (`/chart/<slug>`) and
+one per UI component (`/ui/<slug>`: every declared state on both grounds, usage and props). The Gallery and Playground also get a ground control, for `cyanotype`.
 
 ![Interaction page](docs/interaction.png)
 

{reflex_silverpoint_react-0.2.0 → reflex_silverpoint_react-0.3.0}/custom_components/reflex_silverpoint_react/__init__.py

@@ -1,6 +1,7 @@
-"""reflex-silverpoint-react: silverpoint charts for Reflex.
+"""reflex-silverpoint-react: silverpoint charts and UI components for Reflex.
 
-Charts drawn in the manner of a Renaissance silverpoint drawing, wrapping ``@silverpoint/react``.
+Charts and interface components drawn in the manner of a Renaissance silverpoint drawing,
+wrapping ``@silverpoint/react``.
 """
 
 from .base import (
@@ -93,6 +94,58 @@ from .dashboard import (
     dashboard_link,
 )
 from .helpers import chart_ref, download_svg, get_geometry, get_svg, tooltip_template
+from .ui import (
+    SILVERPOINT_UI_STYLESHEET,
+    SilverpointUi,
+    SpAlert,
+    SpBadge,
+    SpButton,
+    SpCard,
+    SpCheckbox,
+    SpDivider,
+    SpInput,
+    SpProgress,
+    SpRadioGroup,
+    SpRate,
+    SpSegmented,
+    SpSkeleton,
+    SpSlider,
+    SpSteps,
+    SpSwitch,
+    SpTabPanel,
+    SpTabs,
+    SpTag,
+    sp_alert,
+    sp_badge,
+    sp_button,
+    sp_card,
+    sp_checkbox,
+    sp_divider,
+    sp_input,
+    sp_progress,
+    sp_radio_group,
+    sp_rate,
+    sp_segmented,
+    sp_skeleton,
+    sp_slider,
+    sp_steps,
+    sp_switch,
+    sp_tab_panel,
+    sp_tabs,
+    sp_tag,
+    step_item,
+    ui_item,
+)
+from .ui_catalog import (
+    UI_COMMON_PROPS,
+    UI_COMPONENTS,
+    UI_DEMOS,
+    UI_GROUPS,
+    UI_VALUE_COMPONENTS,
+    UiComponentInfo,
+    ui_component_by_slug,
+    ui_demo,
+)
 
 __all__ = [
     "CHARTS",
@@ -101,7 +154,13 @@ __all__ = [
     "FAMILIES",
     "SILVERPOINT_LIBRARY",
     "SILVERPOINT_STYLESHEETS",
+    "SILVERPOINT_UI_STYLESHEET",
     "SILVERPOINT_VERSION",
+    "UI_COMMON_PROPS",
+    "UI_COMPONENTS",
+    "UI_DEMOS",
+    "UI_GROUPS",
+    "UI_VALUE_COMPONENTS",
     "ActivityGrid",
     "AreaChart",
     "BarChart",
@@ -135,11 +194,31 @@ __all__ = [
     "ScatterChart",
     "SilverpointChart",
     "SilverpointProvider",
+    "SilverpointUi",
+    "SpAlert",
+    "SpBadge",
+    "SpButton",
+    "SpCard",
+    "SpCheckbox",
+    "SpDivider",
+    "SpInput",
+    "SpProgress",
+    "SpRadioGroup",
+    "SpRate",
+    "SpSegmented",
+    "SpSkeleton",
+    "SpSlider",
+    "SpSteps",
+    "SpSwitch",
+    "SpTabPanel",
+    "SpTabs",
+    "SpTag",
     "SparklineRows",
     "StackedBarChart",
     "StepChart",
     "StreamChart",
     "TreemapChart",
+    "UiComponentInfo",
     "VolvelleChart",
     "WaterfallChart",
     "WindRose",
@@ -180,12 +259,34 @@ __all__ = [
     "sankey_chart",
     "scatter_chart",
     "silverpoint_provider",
+    "sp_alert",
+    "sp_badge",
+    "sp_button",
+    "sp_card",
+    "sp_checkbox",
+    "sp_divider",
+    "sp_input",
+    "sp_progress",
+    "sp_radio_group",
+    "sp_rate",
+    "sp_segmented",
+    "sp_skeleton",
+    "sp_slider",
+    "sp_steps",
+    "sp_switch",
+    "sp_tab_panel",
+    "sp_tabs",
+    "sp_tag",
     "sparkline_rows",
     "stacked_bar_chart",
     "step_chart",
+    "step_item",
     "stream_chart",
     "tooltip_template",
     "treemap_chart",
+    "ui_component_by_slug",
+    "ui_demo",
+    "ui_item",
     "volvelle_chart",
     "waterfall_chart",
     "wind_rose",

{reflex_silverpoint_react-0.2.0 → reflex_silverpoint_react-0.3.0}/custom_components/reflex_silverpoint_react/base.py

@@ -5,9 +5,10 @@ on a prepared ground, tone built from hatching, and white heightening on the liv
 irregularity lives only in the ornament; the data geometry is exact, and every chart has a
 ``precision`` mode that switches the inking off.
 
-The npm side is ``@silverpoint/react`` (client components, and since 0.2 the ``Dashboard`` grid), ``@silverpoint/grounds`` (the
-stylesheet that colours the strokes, required) and ``@silverpoint/fonts`` (self-hosted
-EB Garamond). Both stylesheets are imported once by any page that renders a chart.
+The npm side is ``@silverpoint/react`` (client components; since 0.2 the ``Dashboard`` grid and
+since 0.3 the ``Sp`` UI components), ``@silverpoint/grounds`` (the stylesheet that colours the
+strokes, required, plus ``ui.css`` for the UI components) and ``@silverpoint/fonts`` (self-hosted
+EB Garamond). The stylesheets are imported once by any page that renders a chart or a component.
 """
 
 from typing import Any, Literal
@@ -15,7 +16,7 @@ from typing import Any, Literal
 import reflex as rx
 
 #: The silverpoint npm release these wrappers are written against.
-SILVERPOINT_VERSION = "0.2.0"
+SILVERPOINT_VERSION = "0.3.0"
 
 #: The npm package every chart is imported from (the barrel; it is side-effect free, so the
 #: bundler keeps only the charts a page uses).
@@ -31,9 +32,9 @@ SILVERPOINT_STYLESHEETS = (
 #: hatching; ``cyanotype`` (new in 0.2) by the weight of an exact white line on Prussian blue.
 GroundName = Literal["silverpoint", "cyanotype"]
 
-#: The ``silverpoint`` ground's substrates. ``cyanotype`` has one substrate (``prussian``) and
-#: prints on it whatever substrate a chart names.
-Substrate = Literal["cream", "green", "blue", "ochre"]
+#: The substrates of the two grounds: ``silverpoint`` has cream, green, blue and ochre;
+#: ``cyanotype`` has one, ``prussian``, and prints on it whatever substrate a component names.
+Substrate = Literal["cream", "green", "blue", "ochre", "prussian"]
 InkMode = Literal["ink", "precision"]
 Chrome = Literal["card", "bare"]
 HatchFill = Literal["tile", "per-shape"]

{reflex_silverpoint_react-0.2.0 → reflex_silverpoint_react-0.3.0}/custom_components/reflex_silverpoint_react/base.pyi

@@ -14,11 +14,11 @@ from reflex_base.event import (
 from reflex_base.vars.base import Var
 from reflex_components_core.core.breakpoints import Breakpoints
 
-SILVERPOINT_VERSION = "0.2.0"
+SILVERPOINT_VERSION = "0.3.0"
 SILVERPOINT_LIBRARY = ...
 SILVERPOINT_STYLESHEETS = ("@silverpoint/fonts/fonts.css", "@silverpoint/grounds/styles.css")
 GroundName: TypeAlias = Literal["silverpoint", "cyanotype"]
-Substrate: TypeAlias = Literal["cream", "green", "blue", "ochre"]
+Substrate: TypeAlias = Literal["cream", "green", "blue", "ochre", "prussian"]
 InkMode: TypeAlias = Literal["ink", "precision"]
 Chrome: TypeAlias = Literal["card", "bare"]
 HatchFill: TypeAlias = Literal["tile", "per-shape"]
@@ -96,8 +96,8 @@ class SilverpointChart(_SilverpointBase):
         | dict[str, Any]
         | str
         | None = None,
-        substrate: Literal["blue", "cream", "green", "ochre"]
-        | Var[Literal["blue", "cream", "green", "ochre"]]
+        substrate: Literal["blue", "cream", "green", "ochre", "prussian"]
+        | Var[Literal["blue", "cream", "green", "ochre", "prussian"]]
         | None = None,
         mode: Literal["ink", "precision"] | Var[Literal["ink", "precision"]] | None = None,
         seed: Var[int | str] | int | str | None = None,
@@ -207,8 +207,8 @@ class SilverpointProvider(_SilverpointBase):
         | dict[str, Any]
         | str
         | None = None,
-        substrate: Literal["blue", "cream", "green", "ochre"]
-        | Var[Literal["blue", "cream", "green", "ochre"]]
+        substrate: Literal["blue", "cream", "green", "ochre", "prussian"]
+        | Var[Literal["blue", "cream", "green", "ochre", "prussian"]]
         | None = None,
         mode: Literal["ink", "precision"] | Var[Literal["ink", "precision"]] | None = None,
         locale: Var[str] | str | None = None,