@maggioli-design-system/magma-react 2.10.0 → 2.11.0

package/AGENTS.md

@@ -5,7 +5,7 @@
 -->
 # @maggioli-design-system/magma-react - agent install guide
 
-> Version 2.10.0. You (the agent) are installing Magma into THIS project. Do not
+> Version 2.11.0. You (the agent) are installing Magma into THIS project. Do not
 > assume the setup - detect it from the project, then ask the user only for what you
 > cannot infer. The detailed steps live in [`agents/install.md`](agents/install.md)
 > (this target) and [`agents/assets.md`](agents/assets.md) (shared styles, fonts,

package/CHANGELOG.md

@@ -7,6 +7,27 @@ package.
 It is released together with `magma`, at the same version: the sections are the
 releases of `magma`.
 
+## [magma@2.11.0] - 2026-11-04
+
+### Bug Fixes
+
+- *(mds-pref-theme)* Mark the business item when the theme is left on its default
+
+### Build
+
+- *(stencil)* Build magma again when docs/agents changes
+
+### Documentation
+
+- *(storybook)* Watch the contrast promotion under editorial in the semantic lab
+- *(magma)* Build magma before checking a new or changed preview
+
+### Features
+
+- *(mds-pref-theme-item)* Show in the swatch the theme the item names
+- *(lint)* Let render_preview take the base theme by its name
+- *(magma,lint)* Ship an image of each preview, light and dark, beside its stage
+
 ## [magma@2.10.0] - 2026-11-04
 
 ### Bug Fixes

package/agents/assets.md

@@ -76,7 +76,7 @@ What each file provides:
 | `transitions.css`, `animations.css` | Shared motion |
 | `globals.css` | Global `--magma-*` design decisions |
 | `semantic.css` | The semantic color roles (`--magma-surface-*`, `--magma-text-*`, ..., see [`color.md`](color.md)). Required: without it the page `body` has no colour, the Tailwind role utilities are stuck on their light default (the fallback that gives editors a swatch), and components lose dark mode, named themes and high contrast |
-| `themes.css` | The named themes (`data-theme-name`): retint the semantic roles. Import it after `semantic.css` |
+| `themes.css` | The named themes (`data-theme-name`): retint the semantic roles, and publish the preview of each theme for a picker (`--magma-preview-<name>-*`). Import it after `semantic.css` |
 | `base.css` | Base element styles (sets `--font-info` body font, etc.) |
 
 DO NOT import `colors-hex-*.css` when using components or Tailwind - they cannot be

package/agents/color.md

@@ -169,8 +169,8 @@ Only when the colour encodes data rather than an interface role:
   knockout; not a page or card background.
 
 Never use `--magma-tint-*`: it is the internal pointer a named theme repoints, not a role.
-`tone-porcelain` and `tone-bisque` back the named themes `cool` and `warm`: switch them on
-with `data-theme-name` ([`theming.md`](theming.md)), do not paint them by hand.
+`tone-bisque` backs the named theme `editorial` (and `tone-porcelain` the deprecated `cool`):
+switch it on with `data-theme-name` ([`theming.md`](theming.md)), do not paint it by hand.
 `variant-*` has no role of its own: the accents are `accent` and `accent-ai`.
 
 Deprecated: `--magma-neutral-emphasis` / `--magma-neutral-on-emphasis` are aliases of

package/agents/mcp.md

@@ -113,7 +113,7 @@ of `command`).
 | `explain_class` | what a class does with the Magma theme | the trap of the scale: `p-4` is 0.01rem, `p-400` is 1rem |
 | `find_icon` | a slug that exists, by meaning, or whether a slug exists | an `icon="..."` that renders nothing |
 | `get_guide` | one section of a guide, or of a domain of Foundation, the rules of composition of the design language (`rhythm`, `density`, `actions`, `titles`, `surfaces`, `widths`) | reading the whole file |
-| `get_pattern` | how a task across components is solved in every product (where a message goes, confirming an action, an empty, a loading or a failed part): the list, the patterns for a need, or, with the values of the variables of a pattern, the one case to follow, with its preview (the stage, live, and what to try in it) when Magma has one and in `rules` the rules of the domains it relies on; the layer of the project (`magma/patterns/<id>.md`) applied; the domains of Foundation first in the list, then the building blocks (`kind: block`, the page header), which answer with the regions to lay out, in order | inventing the flow, or reading [`patterns.md`](patterns.md) and each pattern by hand |
+| `get_pattern` | how a task across components is solved in every product (where a message goes, confirming an action, an empty, a loading or a failed part): the list, the patterns for a need, or, with the values of the variables of a pattern, the one case to follow, with its preview (the stage, live, what to try in it and in `images` the paths of its light and dark images, to show where the stage cannot run) when Magma has one and in `rules` the rules of the domains it relies on; the layer of the project (`magma/patterns/<id>.md`) applied; the domains of Foundation first in the list, then the building blocks (`kind: block`, the page header), which answer with the regions to lay out, in order | inventing the flow, or reading [`patterns.md`](patterns.md) and each pattern by hand |
 | `check_markup` | whether a snippet passes the lint, before it is written | a lint run after the fact |
 | `check_setup` | what the Magma integration of the project misses | checking the install steps by hand |
 | `render_preview` | an image of markup with Magma components, or of the preview Magma ships for a case of a pattern (`pattern` and `case`), at the widths (pixels or Magma breakpoints), the mode and the theme you give, with a report of what in it is not representative | describing an interface in words, or a wireframe of your own |

package/agents/theming.md

@@ -39,22 +39,27 @@ inside a component's shadow root it matches nothing.
 ## Named themes
 
 A named theme retints the whole neutral scaffolding of the page at once - surfaces,
-wash, borders, text, the inverse chip - and keeps it contrast-checked. It is one
-attribute on `<html>`, and it needs `themes.css` ([`assets.md`](assets.md)):
+wash, borders, text, the inverse chip - and the accent, and keeps it contrast-checked.
+It is one attribute on `<html>`, and it needs `themes.css` ([`assets.md`](assets.md)):
 
 ```html
-<html data-theme-name="cool"><!-- or "warm"; no attribute = the default theme --></html>
+<html data-theme-name="editorial"><!-- no attribute = business --></html>
 ```
 
-| Theme | Family | Cast |
-| --- | --- | --- |
-| (none) | `neutral` | grey |
-| `cool` | `porcelain` | blue-grey |
-| `warm` | `bisque` | warm grey |
+| Theme | For | Family | Accent |
+| --- | --- | --- | --- |
+| `business` (no attribute) | the management software | `neutral`, grey | the Maggioli brand |
+| `editorial` | the publishing side | `bisque`, warm grey | the Maggioli Editore brand |
+
+No `data-theme-name` means `business`: it is the base `:root` and emits no rule.
+`default` (its old name), `cool` and `warm` still work and are deprecated: they leave at
+the next major.
 
 The status colors (info, success, warning, danger) never change with the theme. To let
 the user choose, use `mds-pref-theme`: it writes the attribute, remembers the choice and
-also carries the corner shape (below). A theme works only on code that paints with the
+also carries the corner shape (below). Each `mds-pref-theme-item` shows the theme it
+names, from the preview every theme publishes on the page (`--magma-preview-<name>-wash`,
+`--magma-preview-<name>-accent`). A theme works only on code that paints with the
 semantic roles; a raw palette step stays as it is. Defining your own theme is not a
 consumer feature yet.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maggioli-design-system/magma-react",
-  "version": "2.10.0",
+  "version": "2.11.0",
   "license": "MIT",
   "main": "dist/components.js",
   "module": "dist/components.js",
@@ -35,7 +35,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@maggioli-design-system/magma": "2.10.0",
+    "@maggioli-design-system/magma": "2.11.0",
     "@stencil/react-output-target": "1.7.0"
   },
   "repository": {