@epam/ai-dial-ui-kit 0.16.0-dev.61 → 0.16.0-dev.66

package/README.md

@@ -270,6 +270,7 @@ breaking change and goes through the migration-guide process.
 | `skeleton`      | `dial-kit-skeleton`       | The root of a `Skeleton`                                                                 |
 | `notification`  | `dial-kit-notification`   | The `Notification` surface, including every toast and section-message wrapper             |
 | `noDataContent` | `dial-kit-no-data-content` | The empty-state root of `NoDataContent`                                                 |
+| `loginScreen`   | `dial-kit-login-screen`   | The `section` root of a `LoginScreen`                                                    |
 | `stateScreen`   | `dial-kit-state-screen`   | The `section` root of a `StateScreen`                                                    |
 | `liveRegion`    | `dial-kit-live-region`    | The always-mounted wrapper of a `LiveRegion`, or of an `announce`d `CaptionText` / `ErrorText` |
 | `transferQueue` | `dial-kit-transfer-queue` | The `role="status"` panel of a `TransferQueue`: header, rows and aggregate bar           |
@@ -386,9 +387,10 @@ target already carries a stable class:
 | `MarkdownEditor`                              | `dial-kit-markdown-editor` |
 | `Grid`                                        | `dial-kit-grid` (exported as `GRID_ROOT_CLASS`) |
 
-Four more contribute no element of their own, and are addressed through what
+Five more contribute no element of their own, and are addressed through what
 they render: `ThemeScope` (a `display: contents` wrapper), `MultiSelectTags`
-(`Tag`s), and `TooltipContainer` / `TooltipTrigger`.
+(`Tag`s), `TooltipContainer` / `TooltipTrigger`, and `ErrorBoundary` (its
+`LiveRegion` and fallback `StateScreen`).
 
 Two neighbouring elements are reached through props instead, and keep being: a
 `Dropdown`'s floating panel takes `listClassName`, and a `Popup`'s backdrop

package/dist/CHANGELOG.md

@@ -31,8 +31,16 @@ Versions match the git tags on the `development` branch.
 
 ### Added
 
+- **`ErrorBoundary` (2.0)** — DIAL Chat (`react-error-boundary` with its own `ErrorAlert`) and Models Garden (a hand-written class around `StateScreen`) each built their crash screen, and only Models Garden announced the crash. It catches a render error in its subtree and shows a `StateScreen` with a warning badge and a focused `PrimaryButton`; the button calls `onReset` and renders the children again, or reloads the page when there is no `onReset`. `resetKeys` clears the error when a value such as the route path changes, and `onError` reports it. The crash is announced through an assertive `LiveRegion` mounted with the boundary, before the error. All text comes from props. No new public class: it is addressed through `dial-kit-state-screen` and `dial-kit-live-region`. Additive.
+
+- **`Spinner` (2.0) — `fullScreen`, `focusRef`** — Quick Apps, the editor and Models Garden each wrapped `Spinner` for their loading screen (`fullWidth` with `h-screen` or `h-dvh`, their own background and layer), and the three drifted apart. `fullScreen` makes the status root a fixed overlay on `bg-layer-base` at the kit's popup layer with the ring centred, so it covers the page and its header wherever it is rendered. `focusRef` makes the ring focusable (`tabIndex={-1}`) and points the ref at it, so a host can move focus to the loading state after a retry removes the focused control; the ring, not the overlay, takes focus, so the outline stays on screen. Both default off. Additive.
+
+- **`LoginScreen` (2.0)** — the full-page sign-in screen DIAL Chat and Models Garden each built by hand: themed artwork (`gradient-1` / `gradient-2`) behind a centred card with the product mark, a focusable `h1`, state content (`children`: a spinner, an error with a retry, a notice) and one full-width link button per identity provider, with a decorative logo that is dropped when it fails to load. Edge-to-edge without the card surface on mobile. Fetching providers and building their URLs stay with the application. Stamps `DIAL_KIT_CLASS.loginScreen`. Additive.
+
 - **`Calendar`, `MarkdownEditor` (2.0) — `ariaDescribedBy`; `MarkdownEditor` — `invalid`** — a host rendering its own `ErrorText` under these controls had nothing to link it with: `Calendar` took `invalid` but no description, and `MarkdownEditor` took neither, so hosts patched the DOM. `Calendar` sets `aria-describedby` on the focusable control — the masked input in `time` mode, which also gets `aria-invalid`, and the popover trigger otherwise. `MarkdownEditor` sets `aria-describedby` and `aria-invalid` on its textarea, and `invalid` draws the card border in the error colour. Reported from pg-ai-chat. Additive.
 
+- **`Calendar` (2.0) — `renderTimeField`, `pickerButtonClassName`** — the `datetime` popover's footer time field could not be swapped for a host's own control, and a host that fitted the `time` field into a denser layout could not reach its clock button. `renderTimeField` (`datetime` mode) replaces the footer's time field with a control of the host's choice, e.g. one that opens its own hour/minute picker; it receives the `"HH:mm"` value, `onChange`, `onBlur`, `disabled`, `invalid`, `ariaLabel` and `timezoneLabel`, and the `Calendar` keeps owning the `Date`. A floating element opened from such a control no longer closes the calendar, because the popover is now registered in a `FloatingTree`. `pickerButtonClassName` (`time` mode) is merged onto the clock button after its defaults, so `size-6 end-1.5` overrides the default `size-8 end-2`, the way `fieldClassName` does for the field. Hosts that set neither prop see no change. Requested from `ai-dial-chat`. Additive.
+
 - **`StateScreen` (2.0) — `announce`** — wraps the screen in a `LiveRegion` of the given politeness, for a state that replaces content the user was working in (a load error, a crash), so hosts no longer wrap it in their own `role="alert"` div. Omitted, the screen renders exactly as before. Reported from pg-ai-chat. Additive.
 
 - **`Notification` (2.0) — `closeAriaLabel`** — the close button was always named "Close notification", so a localised host could not use `closable`. Defaults to the old text, as `Popup` and `BottomSheet` already do. Reported from pg-ai-chat. Additive.