hisd3-ui-kit 5.3.1 → 5.5.0

package/README.md

@@ -141,6 +141,7 @@ const menuItems = [
 | `HISD3Provider` | Root theme provider (see above). |
 | `HISD3Sidebar` | App shell (see *Scrolling* below): brand block, grouped menu with accent bar on the active route, account dropdown (Settings / Logout with confirm), collapsible, optional top-nav mode (`layoutTop`). `menuItems` accept `{ key, path, name, icon, children, group, hideInMenu, disabled }`. `renderMenuLink` lets you plug in react-router's `<Link>`. Props `bareContent` + `hideHeaderBar` hand the header over to `HISD3PageHeader`. `collapseTrigger` places the collapse control: `"edge"` (default) floats a round chevron on the sidebar's right edge, level with the top bar — it works even when the top bar is hidden, and `collapseTriggerOffset` moves it down — `"header"` puts a square button in the shell's own top bar, `"none"` renders neither. |
 | `HISD3PageHeader` / `HISD3PageBody` | Top bar (breadcrumb left, actions right) that stays pinned while the page scrolls, plus a large title + subtitle that scrolls away; `HISD3PageBody` is the matching padded content area. |
+| `HISD3PageStatus` | A whole-page status in place of a screen: `status` `"404"` (a page or record that does not exist), `"403"` (one the person may not open) or `"error"` (one that failed to load). One quiet icon instead of antd's coloured illustrations, which ignore the theme. The copy is the app's: `title`, `subTitle`, and `extra` with the way out, usually a primary button back to the list, or Retry for an error. |
 | `HISD3Table<T>` | antd `Table` restyled compactly — 45px rows, 14px cell text, uppercase 12px headers in the secondary text colour, hairline row rules. On the page it sits on a white panel with a hairline edge and its cells inset from it; inside a card, a drawer or a modal it lies flat on that surface. A fixed column takes the table's surface and ends in a 1px rule, not a shadow. antd's own `size="small"` tightens it further with the HISD3 pagination bar: "Total N items", square page buttons, page-size toggle. Pass `pagination={{ current, pageSize, total, onChange, pageSizeOptions?, hidePageSize? }}` or `false`. Optional `footer` strip. Cell helper classes: `hisd3-cell-primary`, `hisd3-cell-link`, `hisd3-cell-muted`. |
 | `HISD3Tabs` | Underlined filter tabs; each item may carry a `count`. |
 | `HISD3Tag` | Uppercase status pill, 12px on a 24px pill. `variant`: `neutral` (grey, e.g. ACTIVE / IN PATIENT), `soft` (primary tint, e.g. ER PATIENT), `outline` (2px primary border, e.g. OUT PATIENT), `solid`. `tone`: `primary` \| `success` \| `warning` \| `danger` \| `default`. |
@@ -151,7 +152,7 @@ const menuItems = [
 | `HISD3HeaderActions` | Spacing wrapper for the top-right controls; `divided` inserts a rule before the last child. |
 | `HISD3NotificationButton` | Soft-grey circular button with a solid bell glyph and a count pill on its top-right edge; tints to the primary color while its panel is open. Pass `icon` to swap the glyph. Props: `items` (`{ id, title, description, time, unread, avatarSrc, icon, onClick }`), `count` (defaults to the unread tally), `loading`, `size` (default 40), `icon`, `onMarkAllRead`, `onSeeAll`, `emptyText`. |
 | `HISD3AvatarMenu` | Circular avatar button with a small chevron badge (Facebook-style); clicking it opens a menu with the signed-in identity plus Settings and Logout (confirm dialog by default). Falls back to initials on a grey circle when there is no photo. Props: `account`, `avatarSrc`, `settingsUrl` / `onSettings`, `onLogout`, `confirmLogout`, `extraItems`, `shape` (`circle` \| `square`), `size` (default 40), `hideChevron`. |
-| `HISD3LoginPage` | Split-screen sign-in: a brand panel in the app's primary colour plus a floating form card. Per-app: `appName` (the module name shown on the card), `tagline`, `logoSrc`, `title`/`subtitle`, `panelTitle`/`panelSubtitle`, `panelImage`, `variant` (`"soft"` default, or `"square"`), `side` (`"right"` default, or `"left"`). Form: `onSubmit({ identifier, password, remember })`, `loading`, `error`, `onForgotPassword`, `hideRemember`, the label/placeholder props, and `footer`. The HISD3 watermark on the panel is fixed, so every module still reads as one system. |
+| `HISD3LoginPage` | Split-screen sign-in: a brand panel in the app's primary colour plus a floating form card. Per-app: `appName` (the module name shown on the card), `tagline`, `logoSrc`, `title`/`subtitle`, `panelTitle`/`panelSubtitle`, `panelImage`, `variant` (`"soft"` default, `"square"`, or `"sheet"`: the panel and the form inside one bordered sheet on the page ground, the form with no card of its own, and the panel's headline over an illustration built from the brand), `side` (`"right"` default, or `"left"`). Form: `onSubmit({ identifier, password, remember })`, `loading`, `error`, `onForgotPassword`, `hideRemember`, the label/placeholder props, and `footer`. The HISD3 watermark on the panel is fixed, so every module still reads as one system. |
 | `UserMenu` | The sidebar-footer account card, on its own. |
 
 Theme utilities: `createHisd3Theme`, `hisd3AntdTheme` (red default),
@@ -403,6 +404,24 @@ again — and the instance unmounts once the animation finishes.
 
 ## Migrating
 
+### from 5.4.0
+
+Nothing to change. 5.5.0 adds `HISD3LoginPage`'s `variant="sheet"`: the
+panel and the form side by side inside one bordered sheet on the page
+ground. The form stands on the sheet with no card of its own, a small
+brand line in its corner, a larger title and a compact button; the panel
+carries a short rule, the headline and the tagline over an illustration
+built from the brand (clouds, the HISD3 mark, two record tiles), or
+`panelImage` when given. Below 1024px the sheet frames the form alone; on
+a phone it is the hero-and-sheet layout the other variants use.
+
+### from 5.3.1
+
+Nothing to change. 5.4.0 adds `HISD3PageStatus`, the whole-page 404, 403
+and error status every module drew itself (backoffice-v3's `PageStatus`
+and its `ErrorState`'s `Result`). An app that has its own can replace it
+with the kit's and delete the file.
+
 ### from 5.3.0
 
 Nothing to change. 5.3.1 makes the light-mode field fill white