@luscii-healthtech/web-ui 58.8.2 → 58.9.1

package/dist/src/components/ActionCardDetailed/ActionCardDetailed.d.ts

@@ -49,6 +49,17 @@ export type Props = {
     instruments?: DistributiveOmit<InstrumentCardProps, "variant">[];
     /** @default "Instruments in this action" */
     instrumentsHeading?: string;
+    /**
+     * Page-specific content rendered at the foot of the panel, e.g. which
+     * protocols include the action or its Self Care visibility.
+     */
+    children?: ReactNode;
+    /** @default "Edit action" */
+    editLabel?: string;
+    /** @default "Delete action" */
+    deleteLabel?: string;
+    /** @default "Close action details" */
+    closeLabel?: string;
     /** Renders the pencil button in the header. Omitted when not provided. */
     onEdit?: () => void;
     /** Renders the trash button in the header. Omitted when not provided. */
@@ -63,10 +74,10 @@ export type Props = {
  * `ActionCard` list row.
  *
  * Four sections stack vertically: header, metadata tags, schedule and
- * instruments. The schedule and instrument sections are omitted entirely when
- * their data is absent or empty, and each header button appears only when its
- * handler is provided, so the Figma variant matrix is expressed by which props
- * are passed rather than by a `variant` prop.
+ * instruments, followed by optional footer content. The schedule and instrument
+ * sections are omitted entirely when their data is absent or empty, and each
+ * header button appears only when its handler is provided, so the Figma variant
+ * matrix is expressed by which props are passed rather than by a `variant` prop.
  *
  * The panel is capped at 600px wide to match the design; pass `className` to
  * override that if the surrounding layout needs it.
@@ -95,5 +106,5 @@ export type Props = {
  * />
  * ```
  */
-export declare const ActionCardDetailed: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, onEdit, onDelete, onClose, className, }: Props) => import("react").JSX.Element;
+export declare const ActionCardDetailed: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, children, editLabel, deleteLabel, closeLabel, onEdit, onDelete, onClose, className, }: Props) => import("react").JSX.Element;
 export {};

package/dist/src/components/Checkbox/LabeledCheckboxCardGroup.d.ts

@@ -7,6 +7,11 @@ type Props = React.ComponentPropsWithoutRef<"fieldset"> & {
      * Over how many columns the checkbox cards should be distributed.
      */
     columns?: 1 | 2 | 3 | 4;
+    /**
+     * Stretch the group, and therefore its checkbox cards, to the full width of
+     * its container. By default the group is only as wide as its content.
+     */
+    stretch?: boolean;
     /**
      * Any additional information to show underneath the radio group.
      */

package/dist/src/components/InstrumentCard/InstrumentCard.d.ts

@@ -43,6 +43,12 @@ type BaseProps = {
      * @default "compact"
      */
     variant?: "compact" | "detailed";
+    /**
+     * Makes the detailed card clickable. Ignored in the compact variant because
+     * ActionCard's title button stretches an overlay over the whole card, so a
+     * nested click target would conflict.
+     */
+    onClick?: () => void;
     /** Merged onto the root element. */
     className?: string;
 };

package/dist/src/generated/components/ActionCardDetailed/ActionCardDetailed.d.ts

@@ -49,6 +49,17 @@ export type Props = {
     instruments?: DistributiveOmit<InstrumentCardProps, "variant">[];
     /** @default "Instruments in this action" */
     instrumentsHeading?: string;
+    /**
+     * Page-specific content rendered at the foot of the panel, e.g. which
+     * protocols include the action or its Self Care visibility.
+     */
+    children?: ReactNode;
+    /** @default "Edit action" */
+    editLabel?: string;
+    /** @default "Delete action" */
+    deleteLabel?: string;
+    /** @default "Close action details" */
+    closeLabel?: string;
     /** Renders the pencil button in the header. Omitted when not provided. */
     onEdit?: () => void;
     /** Renders the trash button in the header. Omitted when not provided. */
@@ -63,10 +74,10 @@ export type Props = {
  * `ActionCard` list row.
  *
  * Four sections stack vertically: header, metadata tags, schedule and
- * instruments. The schedule and instrument sections are omitted entirely when
- * their data is absent or empty, and each header button appears only when its
- * handler is provided, so the Figma variant matrix is expressed by which props
- * are passed rather than by a `variant` prop.
+ * instruments, followed by optional footer content. The schedule and instrument
+ * sections are omitted entirely when their data is absent or empty, and each
+ * header button appears only when its handler is provided, so the Figma variant
+ * matrix is expressed by which props are passed rather than by a `variant` prop.
  *
  * The panel is capped at 600px wide to match the design; pass `className` to
  * override that if the surrounding layout needs it.
@@ -95,5 +106,5 @@ export type Props = {
  * />
  * ```
  */
-export declare const ActionCardDetailed: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, onEdit, onDelete, onClose, className, }: Props) => import("react").JSX.Element;
+export declare const ActionCardDetailed: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, children, editLabel, deleteLabel, closeLabel, onEdit, onDelete, onClose, className, }: Props) => import("react").JSX.Element;
 export {};

package/dist/src/generated/components/Checkbox/LabeledCheckboxCardGroup.d.ts

@@ -7,6 +7,11 @@ type Props = React.ComponentPropsWithoutRef<"fieldset"> & {
      * Over how many columns the checkbox cards should be distributed.
      */
     columns?: 1 | 2 | 3 | 4;
+    /**
+     * Stretch the group, and therefore its checkbox cards, to the full width of
+     * its container. By default the group is only as wide as its content.
+     */
+    stretch?: boolean;
     /**
      * Any additional information to show underneath the radio group.
      */

package/dist/src/generated/components/InstrumentCard/InstrumentCard.d.ts

@@ -43,6 +43,12 @@ type BaseProps = {
      * @default "compact"
      */
     variant?: "compact" | "detailed";
+    /**
+     * Makes the detailed card clickable. Ignored in the compact variant because
+     * ActionCard's title button stretches an overlay over the whole card, so a
+     * nested click target would conflict.
+     */
+    onClick?: () => void;
     /** Merged onto the root element. */
     className?: string;
 };

package/dist/stories/ActionCardDetailed.stories.d.ts

@@ -3,7 +3,7 @@ import { type ActionType } from "../src/components/ActionCard/ActionCard";
 import { type Props as ActionCardDetailedProps } from "../src/components/ActionCardDetailed/ActionCardDetailed";
 declare const meta: {
     title: string;
-    component: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, onEdit, onDelete, onClose, className, }: ActionCardDetailedProps) => import("react").JSX.Element;
+    component: ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading, instruments, instrumentsHeading, children, editLabel, deleteLabel, closeLabel, onEdit, onDelete, onClose, className, }: ActionCardDetailedProps) => import("react").JSX.Element;
     parameters: {
         layout: string;
         backgrounds: {
@@ -70,3 +70,5 @@ export declare const ScheduleAndInstruments: Story;
 export declare const ScheduleOnly: Story;
 export declare const InstrumentsOnly: Story;
 export declare const WithoutScheduleOrInstruments: Story;
+export declare const WithFooterContent: Story;
+export declare const CustomLabels: Story;

package/dist/stories/InstrumentCard.stories.d.ts

@@ -41,3 +41,4 @@ export declare const EveryTypeCompact: Story;
 export declare const EveryTypeDetailed: Story;
 export declare const DetailedOptionalFields: Story;
 export declare const ErrorStates: Story;
+export declare const Clickable: Story;

package/dist/stories/LabeledCheckbox.stories.d.ts

@@ -31,6 +31,12 @@ export declare const Base: Story;
 export declare const Overview: Story;
 export declare const OverviewLabeledCheckboxCard: Story;
 export declare const LabeledCheckboxCardGroupLarge: Story;
+/**
+ * By default a `LabeledCheckboxCardGroup` is only as wide as its content, so its
+ * cards don't fill the available space. Pass `stretch` to make the group, and
+ * its cards, take up the full width of the container.
+ */
+export declare const LabeledCheckboxCardGroupStretch: Story;
 export declare const Disabled: Story;
 export declare const Indeterminate: Story;
 export declare const MultipleCheckboxes: Story;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luscii-healthtech/web-ui",
-  "version": "58.8.2",
+  "version": "58.9.1",
   "license": "MIT",
   "author": {
     "name": "Joris Janssen"