@nxgt/material 3.91.0 → 3.93.0

package/CHANGELOG.md

@@ -1,5 +1,60 @@
 # @nxgt/material
 
+## 3.93.0
+
+### Minor Changes
+
+- [#2722](https://github.com/softistx/nxgt-material/pull/2722) [`b79a80f`](https://github.com/softistx/nxgt-material/commit/b79a80f77a12d136c557326247dce03a03c9cc25) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ChoiceListField` and `ChoiceListFormField`: an opt-in `rowDetail` (`true`, or `{ label, placeholder, maxLength }`) adds a textarea under each row, stored as `ChoiceRow.explanation` (why a choice is right or wrong). It is kept through reorder, add and remove; a resolver's issue on `choices.<i>.explanation` shows under it and `setFocus` reaches it. `ChoiceListField` also takes `rowDetailErrors`, and `ChoiceRowDetail` is exported. New string `material.choice-list.detail`. Off by default: existing forms are unchanged. The Vue twin is softistx/nxgt-material#2720.
+
+- [#2682](https://github.com/softistx/nxgt-material/pull/2682) [`2c416c3`](https://github.com/softistx/nxgt-material/commit/2c416c37baa0d4f3447f7d26f72f483ee02f4ce2) Thanks [@SteveGT96](https://github.com/SteveGT96)! - EventCalendar: a `CalendarEvent` can carry `badges`, further badges drawn after `badge` (a status, a priority, a progress count) in every view and the preview, each part of the event's accessible name and a tone dot where the box is narrow or short. `EventChip` takes the same `badges`. [#2654](https://github.com/softistx/nxgt-material/issues/2654)
+
+- [#2682](https://github.com/softistx/nxgt-material/pull/2682) [`2c416c3`](https://github.com/softistx/nxgt-material/commit/2c416c37baa0d4f3447f7d26f72f483ee02f4ce2) Thanks [@SteveGT96](https://github.com/SteveGT96)! - EventCalendar: `readOnlyEvents` forbids dragging, resizing, key moves, and edits or deletes from the preview for every event, while events stay focusable, clickable (`onEventClick`) and drawn at full strength, `onSlotClick` still fires, and no drag instruction is announced. Adds the `material.event-calendar.label` string (English and French). [#2655](https://github.com/softistx/nxgt-material/issues/2655)
+
+- [#2682](https://github.com/softistx/nxgt-material/pull/2682) [`2c416c3`](https://github.com/softistx/nxgt-material/commit/2c416c37baa0d4f3447f7d26f72f483ee02f4ce2) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `EventCalendar` events take a `tone` and a `status`. `tone` draws an event in one of the library's tones (a `color` still wins, then the `tone`, then its resource's), in every view and in `mode="template"`. `status: 'cancelled'` strikes the title (`<del>`), mutes the chip with a dashed outline, and adds "Cancelled" to the event's accessible name (`material.event-calendar.cancelled`, translated in English and French); a cancelled event stays draggable. `EventChip` gains `tone` and `cancelled`, and `CalendarEventStatus` is exported.
+  
+  `EventCalendarSpan` is exported: a stretch of time (a holiday, a term, a half day off) with a `label`, a `tone` and an optional `resourceId`, where a date-only `start`/`end` means whole days read in the calendar's `timeZone` and `end` is exclusive. Spans never block a slot. `EventCalendar` takes `spans` and shades them behind the events, in the thin hatch of the Refined direction (CSS classes, no inline gradient). The week and day views draw a hatched band under the hours with its label and a bar in the all-day strip (a half day only the band; with `resources`, a span shades its own column); the month shades the cell or its half, with the label from 7rem of cell width and a dot under it; the agenda and the phone's day list add a row. The shading is `aria-hidden` (the agenda and day-list rows are plain text, not controls), takes no pointer event and no tab stop, and the label is read in the name of the day or column it falls on.
+  
+  `EventCalendar` also takes `dayBadges` and `weekBadges`: records of `{ label, tone? }` keyed by a `YYYY-MM-DD` date, the week's key being its first day per `weekStartsOn`. The week and day views draw the day's badge in its header and the week's in the gutter corner; the month draws the day's next to its number and the week's on the first cell of the row (with room below its events). On a phone a badge is a small tone bar, distinct from the event dots, and the labels are read in the name of the day header or cell (`material.event-calendar.week-badge`, translated in English and French). `EventCalendarBadges` and `EventCalendarDayMarksProps` (with `spans`) are exported.
+  
+  Behaviour change: the week view now starts its days on `weekStartsOn`; before, it always used the locale's first day, so an app whose `weekStartsOn` differs from its locale sees its week view shift.
+  
+  `EventChip` is restyled: its colour bar is a thin accent inset from the chip's edges (no border on the chip's start side), and a cancelled chip fades it. `EventChip` has its own `material.event-chip.cancelled` string (English and French).
+
+### Patch Changes
+
+- [#2710](https://github.com/softistx/nxgt-material/pull/2710) [`e0a3231`](https://github.com/softistx/nxgt-material/commit/e0a32318cc3db3e9d29cf1d69277af1093db59d5) Thanks [@SteveGT96](https://github.com/SteveGT96)! - fix(entity-header): align each metadata value on its label's baseline, so a value taller than its label (a link with a touch target) no longer sits lower than it ([#2709](https://github.com/softistx/nxgt-material/issues/2709))
+
+- [#2682](https://github.com/softistx/nxgt-material/pull/2682) [`2c416c3`](https://github.com/softistx/nxgt-material/commit/2c416c37baa0d4f3447f7d26f72f483ee02f4ce2) Thanks [@SteveGT96](https://github.com/SteveGT96)! - EventCalendar: a README section and a guide for spans, day and week badges, event tones, cancelled and read-only events.
+
+- [#2704](https://github.com/softistx/nxgt-material/pull/2704) [`2cc5f19`](https://github.com/softistx/nxgt-material/commit/2cc5f19b0aea3087e65a08f3ddfea70e396521bd) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `RecordDetails`'s card title is set on the type scale (`title-md` emphasized, the section-title step of `FormSection variant="heading"`) at any heading level, instead of the global `h2` size (`headline-sm`) that made it larger than the page's other section headings.
+
+## 3.92.1
+
+### Patch Changes
+
+- [#2712](https://github.com/softistx/nxgt-material/pull/2712) [`d254f1c`](https://github.com/softistx/nxgt-material/commit/d254f1c5440e71279fdb67af2fe280b69b8c9ef0) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ActivityLayout`: the breadcrumb trail no longer carries its own left padding, so its first crumb starts on the content column's left edge (an `ActivityContent` without `inset`).
+
+- [#2696](https://github.com/softistx/nxgt-material/pull/2696) [`7d80591`](https://github.com/softistx/nxgt-material/commit/7d8059148bcffb501305e76653611a2b010d4006) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `AttributeValuesFormFieldSet` is generic over the form values like the other `*FormField` wrappers: `control` takes the typed form's `Control<T>` and `name` a `Path<T>`, so `control as never` and `name as never` are no longer needed.
+
+- [#2705](https://github.com/softistx/nxgt-material/pull/2705) [`2a7debc`](https://github.com/softistx/nxgt-material/commit/2a7debcfb9688d7428e7ae52cf808af8eba5ac36) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `DayGroupedList`, its `useDayGroups` hook, `groupByDay`, `dayGroupOf`, `DAY_GROUP_ORDER` and the `DayGroupedListProps`, `DayGroupsOptions`, `ResolvedDayGroup`, `DayGroup`, `DayGroupKey` and `DayGroupDate` types are now exported from `@nxgt/material` and `@nxgt/material/components`, as the docs describe; only `groupByDate` was reachable before.
+
+- [#2701](https://github.com/softistx/nxgt-material/pull/2701) [`a9057e8`](https://github.com/softistx/nxgt-material/commit/a9057e8e32d999ff633de37a806484a33d6316d7) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `RecordDetails` takes the props of a `div` (`data-*`, `id`, `aria-*`, `className`, …) and spreads them on its root card; `className` is merged with the component's own classes.
+
+## 3.92.0
+
+### Minor Changes
+
+- [#2686](https://github.com/softistx/nxgt-material/pull/2686) [`f86235f`](https://github.com/softistx/nxgt-material/commit/f86235ffd945e7a9574777e934a842912985dc31) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `DayGroupedList` can group by calendar date: `groupBy="date"` gives each distinct date its own sticky section, past and future, in `order` `asc` (default) or `desc`, headed by the date written for the `locale` (the active language, else English) and replaceable with `formatHeading(day, items)`. `timeZone` fixes the zone instants are read in, so the server and the browser agree (an unknown zone falls back to the runtime's with a development warning); a date-only string is that date in any zone. `renderAside(key, items)` puts content beside each heading, outside the `<hN>`, such as a day's total, in both modes. `groupByDate` is exported beside `groupByDay`; `calendarDateOf`, `formatCalendarDate` and `isValidTimeZone` stay in `@nxgt/material-core/day-math`. The relative buckets stay the default.
+
+- [#2691](https://github.com/softistx/nxgt-material/pull/2691) [`3ee6ce1`](https://github.com/softistx/nxgt-material/commit/3ee6ce1c469c9d526ba840e9cb777094f874563a) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(editor): strikethrough can be left out of the editor. `editorFeatures.marks({ strike: false })` (default `true`, compact and full editors alike) drops the `strike` mark and its button. The mark buttons hide any mark the schema lacks instead of throwing (`toggleStrike is not a function`, "There is no mark type named 'strike'"). Fixes [#2690](https://github.com/softistx/nxgt-material/issues/2690).
+
+- [#2684](https://github.com/softistx/nxgt-material/pull/2684) [`8d88ce0`](https://github.com/softistx/nxgt-material/commit/8d88ce0a7c070238ae2e16fb4438060dc66acbf6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `FileListField`, `FileListS3Field` and their form fields show the files they already hold by name, size and type, and let the user reorder them. `describe(value)` returns a `FileDescription` (`{ name, size, type, href }`) for a kept value (`value: string[]` is unchanged, and a value `describe` does not know shows as before); `reorderable` adds move up / move down buttons, reachable by keyboard, and `onValueChange` receives the new order. The move is announced politely and the focus stays on the pressed button; a value that is not a safe link (http(s), blob:, a safe data: URL or a relative path) now gets no Download button, even without `describe` (a visible change for existing consumers whose stored value was, say, a `javascript:` URL). New keys `material.file-list.move-up`, `move-down` and `moved`. The Vue twin is tracked separately. Fixes [#2679](https://github.com/softistx/nxgt-material/issues/2679).
+
+### Patch Changes
+
+- Updated dependencies [[`f86235f`](https://github.com/softistx/nxgt-material/commit/f86235ffd945e7a9574777e934a842912985dc31)]:
+  - @nxgt/material-core@0.54.0
+
 ## 3.91.0
 
 ### Minor Changes

package/README.md

@@ -664,7 +664,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-field.webp" width="120" alt="Field"> | [`Field`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#field) · `FormField` | Renders the field matching a config `type` (text, select, date, upload, otp…). | `Field` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-formsection.webp" width="120" alt="FormSection"> | [`FormSection`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#formsection) | A titled section of a form (an `h2` by default) with an optional description and actions (`variant="heading"` puts the title on the type scale), its fields in the form grid's columns, one column on a phone. | `FormSection` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-repeatablegroup.webp" width="120" alt="RepeatableGroup"> | [`RepeatableGroup`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#repeatablegroup) · `RepeatableGroupFormField` | Rows of fields a user adds, removes and reorders (`useFieldArray`), a list for assistive tech, focus that follows each change, one column on a phone. | `RepeatableGroup`, `RepeatableGroupFormField` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-choicelistfield.webp" width="120" alt="ChoiceListField"> | [`ChoiceListField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#choicelistfield) · `ChoiceListFormField` | An editable list of answer choices with correct marks: single (radios) or multiple (checkboxes), min and max rows, reorder buttons, a stable id per row, errors per row and for the list. | not yet |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-choicelistfield.webp" width="120" alt="ChoiceListField"> | [`ChoiceListField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#choicelistfield) · `ChoiceListFormField` | An editable list of answer choices with correct marks: single (radios) or multiple (checkboxes), min and max rows, reorder buttons, a stable id per row, errors per row and for the list; `rowDetail` adds an explanation textarea under each row (`ChoiceRow.explanation`). | not yet (#2720) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-textfield.webp" width="120" alt="TextField"> | [`TextField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#textfield) · `TextFormField` | Labelled input with leading / trailing adornments and helper text. | `TextField`, `TextFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-textareafield.webp" width="120" alt="TextareaField"> | [`TextareaField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#textareafield) · `TextareaFormField` | Labelled textarea with row sizing and a `maxLength` counter. | `TextareaField`, `TextareaFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/form-fields-emailfield.webp" width="120" alt="EmailField"> | [`EmailField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/form-fields.md#emailfield) · `EmailFormField` | Validates on blur; shows a `mailto:` button once the address is valid. | `EmailField`, `EmailFormField` |
@@ -789,7 +789,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-listempty.webp" width="120" alt="ListEmpty"> | [`ListEmpty`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#listempty) | A list's empty page: nothing yet (a title, or a scene, a line and an action), or nothing matches with what narrows it and a way out (a button or a link); its title is an `h2` (`headingLevel`). | `ListEmpty` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-pagefooter.webp" width="120" alt="PageFooter"> | [`PageFooter`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#pagefooter) | The page footer of a feed that is not a table (a list of cards, a news feed) under a `FilterBar`: the range ("21–40 of 134") and Previous / Next as real links built from the URL's cursor trail (`pageInfo`, `totalCount`, `params`; `totalCount` is optional: a feed with no total shows no range, only Previous / Next; `hideOnSinglePage` renders nothing when there is no previous and no next page), the same footer `ServerTable` draws, icon-only with `pageControls="icon"` (44px targets on a touch screen); an end with no page is a disabled button, `aria-disabled`. | `PageFooter` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-datagrid.webp" width="120" alt="DataGrid"> | [`DataGrid`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#datagrid) | An editable grid over `DataTable`'s columns: spreadsheet keys, a selected range, editors for text, numbers (with codes such as "abs"), options, dates and checkboxes, or your own; paste from Excel or Sheets, a fill handle that continues series, resizable, hideable and reorderable columns, undo, totals, and saving per cell, per row or in a batch with versions and conflicts ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/guides/data-grid.md)). Long grids render only what is in view; on a phone it is a list of rows that open a panel. Columns take the same `meta.cellClassName`, `meta.tone` and `meta.toneLabel` as `DataTable` ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#cells-toned-by-their-value)). | — (later) |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-daygroupedlist.webp" width="120" alt="DayGroupedList"> | [`DayGroupedList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#daygroupedlist), `groupByDay` | A list split by day — Today, Yesterday, This week, Earlier — under headings that stick while their items scroll. | — (later) |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-daygroupedlist.webp" width="120" alt="DayGroupedList"> | [`DayGroupedList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#daygroupedlist), `groupByDay`, `groupByDate` | A list split by day — Today, Yesterday, This week, Earlier — or by calendar date (`groupBy="date"`, future days too, an aside beside each heading), under headings that stick while their items scroll. | — (later) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-filter.webp" width="120" alt="Filter"> | [`Filter`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#filter), `FilterProvider`, `FilterContent`, `FilterChips`, `FilterPresets`, `FilterSheetTrigger`, `FilterBar`, `useFilterUrlQuery` · `FilterFormField` | Schema-driven filters with chips, presets, validation, and URL or storage persistence, and a query-driven `variant="bar"` / `"facets"` (quick filters, locked conditions, a phone sheet, a URL codec for a loader; `bandDensity="compact"` as on `ServerTable`), and `FilterBar`, the same bar bound to the URL for a feed or list without a table (`useFilterUrlQuery` is its hook, also `ServerTable`'s), a field `default` shown as an uncounted hint chip (a button that opens the editor on the default), a pressed toggle or checked values with a "Default" word (`defaults` prop), a `scope` field as a leading pill kept by "Clear all", a server refusal shown on the chip (`errors`, its words in the Alert under the bar unless `errorSummary={false}`), on the search box (`searchError`) or as an Alert under the bar (`formError`) and a model with `search: false`; the filter bar's "Filters (N)" (`FilterSheetTrigger`) can be placed inside a `ServerTable` (its actions). | `Filter`, `FilterProvider`, `FilterContent`, `FilterChips`, `FilterPresets`, `FilterSheetTrigger`, `FilterFormField`; `FilterBar`, `useFilterUrlQuery`: — (later, #1569) |
 | — | [`FilterInline`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#filterinline-filterpopover-filterdialog-filtersheet-filterdrawer), `FilterPopover`, `FilterDialog`, `FilterSheet`, `FilterDrawer` | The filter panel shown inline, or in a popover, dialog, sheet or drawer. | `FilterInline`, `FilterPopover`, `FilterDialog`, `FilterSheet`, `FilterDrawer` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-facetgroup.webp" width="120" alt="FacetGroup"> | [`FacetGroup`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#facetgroup) | A collapsible facet: a header button with the title, a count Badge of the active values, Clear and a chevron, over the values (typically a `CheckboxGroup` with counts). | `FacetGroup` |
@@ -911,7 +911,7 @@ Not components: what the stylesheet gives any element.
 | --- | --- | --- | --- |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-chat-overview.webp" width="120" alt="ChatInbox"> | [`ChatInbox`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#chat-kit), `ChatThread`, `ChatMessageList`, `ChatMessage`, `ChatComposer`, `ChatThreadHeader`, `ChatWidget`, `ChatConversationItem`, `ChatActionProposal`, `ChatToolActivity`… | Chat kit: inbox (list + thread, container queries from `@md`), bubbles grouped by sender or flat rows, read receipts, replies, reactions and a message toolbar, a pill composer with quick replies, attachments and stop, a floating chat widget, an approval card for an assistant's proposed action and a compact tool-step row; 320 px to desktop, light and dark. | `ChatInbox`, `ChatThread`, `ChatMessageList`, `ChatMessage`, `ChatComposer` (same parts; `ChatActionProposal` and `ChatToolActivity` not yet, [#2145](https://github.com/softistx/nxgt-material/issues/2145)) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-kanban.webp" width="120" alt="Kanban"> | [`Kanban`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#kanban) | Board with columns, swimlanes, WIP limits, search, and drag-and-drop cards and columns. | `Kanban` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-eventcalendar.webp" width="120" alt="EventCalendar"> | [`EventCalendar`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#eventcalendar) | Month / week / day / agenda calendar with drag, resize and slot creation, a day view split by resource, a named time zone, a recurring template week (`mode="template"`), an event preview you can route to your own edit and delete (`onEventEdit`, `onEventDelete`, `eventPreview`, `previewFields`), a now line, a mini-month side panel and a phone layout. | `EventCalendar` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-eventcalendar.webp" width="120" alt="EventCalendar"> | [`EventCalendar`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#eventcalendar) | Month / week / day / agenda calendar with drag, resize and slot creation, a day view split by resource, a named time zone, a recurring template week (`mode="template"`), an event preview you can route to your own edit and delete (`onEventEdit`, `onEventDelete`, `eventPreview`, `previewFields`), a now line, a mini-month side panel, a phone layout, background `spans` (closures, half days), `dayBadges` / `weekBadges`, an event `tone`, `status: 'cancelled'` and `readOnlyEvents` ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/guides/event-calendar.md)). | `EventCalendar` (without `spans`, `dayBadges`, `weekBadges`, `readOnlyEvents`, `badges`, `tone` and `status`, React only for now: [#2526](https://github.com/softistx/nxgt-material/issues/2526)) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-native-charts-linechart.webp" width="120" alt="LineChart"> | [`LineChart`, `AreaChart`, `BarChart`, `PieChart`, `DonutChart`, `Gauge`, `RadialBarChart`, `FunnelChart`, `HeatmapChart`, `RadarChart`, `ScatterChart`, `ComboChart`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#charts) from `@nxgt/material/charts` | Native SVG charts with keyboard point navigation, a screen-reader summary, a "View data" table, `patterns`, a hide/isolate legend, zoom and phone scroll (client-only entry; [guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/guides/charts.md)). | [not yet](https://github.com/softistx/nxgt-material/issues/1255) (#1255) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-emojipicker.webp" width="120" alt="EmojiPicker"> | [`EmojiPicker`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#emojipicker), `EmojiList` | Shared picker. `ChatComposer` takes `emojis`; `Markdown` expands `:shortcode:`; the RTE toolbar uses the same picker. | `EmojiPicker`, `EmojiList` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/rich-widgets-mentionlist.webp" width="120" alt="MentionList"> | [`MentionList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/rich-widgets.md#mentionlist) | `@` mention list from an `items` prop (local search). ChatComposer and the RTE suggestion list use it. | `MentionList` |

package/dist/{alert-dialog-BFk4ye-3.js → alert-dialog-D37eph4I.js}

@@ -4,7 +4,7 @@ import { o as n } from "./dist-DVRQkaTK.js";
 import { r } from "./dist-DWZXlCZR.js";
 import { a as i } from "./dist-DHdUUM1w.js";
 import { t as a } from "./in-dialog-D61Yeaol.js";
-import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-CLEnhfka.js";
+import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-B_enQxp5.js";
 import { i as _ } from "./escape-owner-DpaP0lm1.js";
 import * as v from "react";
 import { Fragment as y, isValidElement as b } from "react";

package/dist/{async-slice-gGyfyUw2.js → async-slice-BSqwhAj-.js}

@@ -1,4 +1,4 @@
-import { l as e, r as t, s as n, u as r } from "./translator-CfoXTrZd.js";
+import { l as e, r as t, s as n, u as r } from "./translator-6XuDmqUJ.js";
 import { t as i } from "./_baseIsEqual-C6ksIHya.js";
 import { useMemo as a } from "react";
 import { asyncThunkCreator as o, buildCreateSlice as s } from "@reduxjs/toolkit";

package/dist/{button-C5OEq9bi.js → button-CG9SBAT-.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { n as t, t as n } from "./dist-DVRQkaTK.js";
-import { n as r, t as i } from "./spinner-JnLLiLIO.js";
+import { n as r, t as i } from "./spinner-CQqRWxAW.js";
 import { t as a } from "./dist-DkQbkF9T.js";
 import { a as o, i as s, n as c, o as l, s as u, t as d } from "./use-click-lock-Bwg_caHO.js";
 import { t as f } from "./is-production-GLw59WU8.js";

package/dist/{calculator-Dg_L6d3R.js → calculator-YD3I3y-I.js}

@@ -1,8 +1,8 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { d as t, n, r, t as i } from "./tabs-dXCZGShv.js";
-import { t as a } from "./button-C5OEq9bi.js";
-import { t as o } from "./use-material-translation-DoymV6IP.js";
-import { t as s } from "./icon-button-D0xjBCst.js";
+import { d as t, n, r, t as i } from "./tabs-DQTx3C8e.js";
+import { t as a } from "./button-CG9SBAT-.js";
+import { t as o } from "./use-material-translation-BUPqNmAg.js";
+import { t as s } from "./icon-button-Ch0PThsa.js";
 import { t as c } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as l } from "./useEvent-2fKq-6w8.js";
 import { t as u } from "./useLatest-C2PnQEeD.js";
@@ -11,7 +11,7 @@ import { t as f } from "./skeleton-DSdtr2qc.js";
 import { t as p } from "./live-status-BGPaN8r8.js";
 import { n as m, t as h } from "./calculator-context-BugcKuVG.js";
 import { a as g, c as _, i as v, l as y, n as b, o as ee, r as te, s as ne } from "./calculator-announce-DRd2c6Dq.js";
-import { i as re, t as ie } from "./pos-types-BrZBX0Zg.js";
+import { i as re, t as ie } from "./pos-types-BQqv-kb6.js";
 import { a as ae, r as oe } from "./key-layout-cR79xfGE.js";
 import { n as x, r as se, t as ce } from "./programmer-word-CNCF7DJF.js";
 import { t as le } from "./standard-layout-BuSRr3TY.js";
@@ -279,11 +279,11 @@ function Le({ helpId: e }) {
 //#endregion
 //#region lib/components/ui/widgets/calculator/variants/variant-loader.ts
 var Re = {
-	scientific: () => import("./scientific-variant-BvutlF8a.js"),
-	pos: () => import("./pos-variant-G12HCSfQ.js"),
-	programmer: () => import("./programmer-variant-WWLwTGRF.js"),
-	financial: () => import("./financial-variant-D80C1hVD.js"),
-	conversion: () => import("./conversion-variant-4gCdFWV-.js")
+	scientific: () => import("./scientific-variant-1L7brNNT.js"),
+	pos: () => import("./pos-variant-D043n5y8.js"),
+	programmer: () => import("./programmer-variant-jneMqtLs.js"),
+	financial: () => import("./financial-variant-P8gFA9aI.js"),
+	conversion: () => import("./conversion-variant-DmEtTCSP.js")
 }, B = "failed", V = /* @__PURE__ */ new Map(), H = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Set(), W = () => {
 	for (let e of U) e();
 };

package/dist/calculator-field.js

@@ -1,11 +1,11 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { t } from "./button-C5OEq9bi.js";
-import { t as n } from "./use-material-translation-DoymV6IP.js";
-import { t as r } from "./icon-button-D0xjBCst.js";
-import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-CnlOKQ3D.js";
-import { r as l, t as u } from "./currency-field-CIqe7Wg4.js";
+import { t } from "./button-CG9SBAT-.js";
+import { t as n } from "./use-material-translation-BUPqNmAg.js";
+import { t as r } from "./icon-button-Ch0PThsa.js";
+import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-CoNsDWxX.js";
+import { r as l, t as u } from "./currency-field-CabGnVO9.js";
 import { r as d, t as f } from "./field-blur-DkiZOVNV.js";
-import { t as p } from "./calculator-Dg_L6d3R.js";
+import { t as p } from "./calculator-YD3I3y-I.js";
 import { useId as m, useState as h } from "react";
 import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
 import { Calculator as y } from "lucide-react";

package/dist/{calculator-segment-CvAaDqKf.js → calculator-segment-Cjec9zi7.js}

@@ -1,4 +1,4 @@
-import { t as e } from "./use-material-translation-DoymV6IP.js";
+import { t as e } from "./use-material-translation-BUPqNmAg.js";
 import { jsx as t } from "react/jsx-runtime";
 //#region lib/components/ui/widgets/calculator/partials/calculator-segment.tsx
 function n({ label: n, choices: r, value: i, nameKey: a, onChange: o }) {

package/dist/calculator.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./calculator-Dg_L6d3R.js";
+import { n as e, t } from "./calculator-YD3I3y-I.js";
 export { e as CALCULATOR_VARIANTS, t as Calculator };

package/dist/charts.js

@@ -1,12 +1,12 @@
 import { t as e } from "./ui.utils-CAnKTCw5.js";
 import { t } from "./utils-BLfntITJ.js";
 import { t as n } from "./warn-once-C_e47JM8.js";
-import { t as r } from "./button-C5OEq9bi.js";
-import { t as i } from "./use-material-translation-DoymV6IP.js";
+import { t as r } from "./button-CG9SBAT-.js";
+import { t as i } from "./use-material-translation-BUPqNmAg.js";
 import { t as a } from "./use-ssr-media-query-C6M5m8sf.js";
 import { i as o, n as s, r as c, t as l } from "./util-4heV2LPI.js";
 import { t as u } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
-import { t as d } from "./chip-DOxFA4BI.js";
+import { t as d } from "./chip-BbUSBl3i.js";
 import { c as f, d as p, f as m, i as h, o as g, p as _, s as v, t as y } from "./line-path-C5pZGC49.js";
 import { t as b } from "./live-status-BGPaN8r8.js";
 import { t as x } from "./linear-G97mfnKF.js";

package/dist/{chip-DOxFA4BI.js → chip-BbUSBl3i.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { n as t } from "./spinner-JnLLiLIO.js";
+import { n as t } from "./spinner-CQqRWxAW.js";
 import { s as n } from "./use-click-lock-Bwg_caHO.js";
-import { t as r } from "./use-material-translation-DoymV6IP.js";
+import { t as r } from "./use-material-translation-BUPqNmAg.js";
 import { t as i } from "./react-node-text-Crkpfpco.js";
 import { cloneElement as a, isValidElement as o } from "react";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";

package/dist/{code-editor-tiAjhXW-.js → code-editor-ZEM7AAcs.js}

@@ -1,12 +1,12 @@
 import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { t } from "./utils-BLfntITJ.js";
 import { t as n } from "./dist-DWZXlCZR.js";
-import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-DO5kUvof.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-nl0Q3tQ2.js";
 import { a as c, i as l, n as u } from "./field-blur-context-BLGgf_3z.js";
-import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-B-kMYsDT.js";
+import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-BYCdJGUf.js";
 import { t as g } from "./is-production-GLw59WU8.js";
-import { t as _ } from "./use-material-translation-DoymV6IP.js";
-import { i as v, n as y, o as b, t as x } from "./code-language-items-CcdzQvLT.js";
+import { t as _ } from "./use-material-translation-BUPqNmAg.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-CAuHPrHd.js";
 import { t as S } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
 import { n as C, t as w } from "./escape-owner-DpaP0lm1.js";
 import { t as T } from "./skeleton-DSdtr2qc.js";

package/dist/code-editor.js

@@ -1,13 +1,13 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DWZXlCZR.js";
-import { o as n, r, s as i, t as a } from "./toolbar-items-B-kMYsDT.js";
-import { t as o } from "./use-material-translation-DoymV6IP.js";
-import { i as s, n as c, o as l } from "./code-language-items-CcdzQvLT.js";
+import { o as n, r, s as i, t as a } from "./toolbar-items-BYCdJGUf.js";
+import { t as o } from "./use-material-translation-BUPqNmAg.js";
+import { i as s, n as c, o as l } from "./code-language-items-CAuHPrHd.js";
 import { t as u } from "./skeleton-DSdtr2qc.js";
 import { t as d } from "./live-status-BGPaN8r8.js";
 import { t as f } from "./use-mobile-BDro060N.js";
 import { t as p } from "./react-node-text-Crkpfpco.js";
-import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-tiAjhXW-.js";
+import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-ZEM7AAcs.js";
 import { r as D, t as O } from "./field-blur-DkiZOVNV.js";
 import { useEffect as k, useRef as A, useState as j } from "react";
 import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";

package/dist/{code-language-items-CcdzQvLT.js → code-language-items-CAuHPrHd.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-DO5kUvof.js";
-import { t as n } from "./use-material-translation-DoymV6IP.js";
+import { d as e, f as t } from "./dropdown-menu-nl0Q3tQ2.js";
+import { t as n } from "./use-material-translation-BUPqNmAg.js";
 import { t as r } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as i } from "./live-status-BGPaN8r8.js";
 import { useEffect as a, useRef as o, useState as s } from "react";

package/dist/components/components.css

@@ -216,5 +216,6 @@
 @import "./background-shared.css";
 @import "./ui/layout/app-search/app-search.css"; /* AppSearchBar, SearchView */
 @import "./ui/widgets/drawing/drawing.css"; /* @nxgt/material/draw: role colours, focus ring */
+@import "./ui/widgets/event-calendar/event-calendar-backdrop.css"; /* EventCalendar spans: the hatch and its label */
 @import "./ui/widgets/drawing/drawing-animate.css";
 @import "./ui/widgets/barcode/barcode.css"; /* @nxgt/material/barcode: symbol colours, label sheet */

package/dist/components/ui/widgets/event-calendar/event-calendar-backdrop.css

@@ -0,0 +1,43 @@
+/* EventCalendar spans (holidays, terms, closures): the thin hatch of direction
+ * A Refined, as CSS classes (no inline gradient, so the CSP holds). The
+ * shading is decoration under the events; the label sits on an opaque pill in
+ * the tone's text colour, which keeps it AA on the hatch. The tone comes from
+ * the nearest `data-tone`. */
+@layer components {
+	.nxgt-ec-backdrop {
+		background-image: repeating-linear-gradient(
+			135deg,
+			color-mix(in oklab, var(--nxgt-tone) 42%, transparent) 0 1px,
+			transparent 1px 7px
+		);
+	}
+	.nxgt-ec-backdrop-bar {
+		box-shadow: inset 0 0 0 1px
+			color-mix(in oklab, var(--nxgt-tone) 28%, transparent);
+	}
+	.nxgt-ec-backdrop-label {
+		display: block;
+		width: fit-content;
+		max-width: 100%;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		padding: 2px 6px;
+		border-radius: 4px;
+		border: 1px solid var(--border);
+		background: var(--card);
+		color: var(--nxgt-tone-text);
+		font-size: 11px;
+		font-weight: 500;
+		line-height: 1.2;
+	}
+	.nxgt-ec-backdrop-label-css::before {
+		content: attr(data-label);
+	}
+	.nxgt-ec-backdrop-dot {
+		width: 0.375rem;
+		height: 0.375rem;
+		border-radius: 9999px;
+		background: var(--nxgt-tone);
+	}
+}