@luscii-healthtech/web-ui 58.6.5 → 58.6.7

package/dist/index.development.js

@@ -5113,14 +5113,27 @@ const typeIcons = {
   information: ActionInformationColoredIcon,
   contact: ActionContactColoredIcon,
   lesson: ActionLessonColoredIcon,
-  calculation: ActionCalculationColoredIcon,
-  measurement: ActionBloodPressureColoredIcon
+  calculation: ActionCalculationColoredIcon
 };
-const ActionCard = ({ type, title, metadata, instruments, actions, draggable = false, titleAs = "h3", variant = "default", onClick, className }) => {
+const ActionIcon = ({ type, iconUrl, size = 20 }) => {
+  const [hasImageError, setHasImageError] = React.useState(false);
+  React.useEffect(() => {
+    setHasImageError(false);
+  }, [type, iconUrl]);
+  if (type === "measurement") {
+    if (!iconUrl || hasImageError) {
+      return jsxRuntime.jsx(ImageIcon, { "aria-hidden": true, width: size, height: size, className: "ui:shrink-0 ui:text-slate-300" });
+    }
+    return jsxRuntime.jsx(Image$1, { src: iconUrl, alt: "", "data-chromatic": "ignore", width: size, height: size, className: "ui:shrink-0", showIconOnFailure: false, onError: () => setHasImageError(true) });
+  }
   const TypeIcon = typeIcons[type];
+  return jsxRuntime.jsx(TypeIcon, { "aria-hidden": true, width: size, height: size, className: "ui:shrink-0" });
+};
+
+const ActionCard = ({ type, iconUrl, title, metadata, instruments, actions, draggable = false, titleAs = "h3", variant = "default", onClick, className }) => {
   const isCompact = variant === "compact";
   const isList = variant === "list";
-  return jsxRuntime.jsx(Card, { borderRadius: "m", elevation: isList ? "surface" : "small", elevationOnHover: isList ? void 0 : "medium", padding: false, className: classNames__default.default("ui:w-full", className), children: jsxRuntime.jsxs(Stack, { axis: "x", align: "start", justify: "between", _gap: "base", _p: "l", children: [draggable && jsxRuntime.jsx(Box, { className: "ui:relative ui:z-[1] ui:shrink-0 ui:self-center", children: jsxRuntime.jsx(DragHandle, { grabbing: false }) }), jsxRuntime.jsxs(Stack, { _gap: isCompact ? "s" : "m", className: "ui:min-w-0 ui:flex-1", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "base", children: [jsxRuntime.jsx(TypeIcon, { "aria-hidden": true, width: 20, height: 20, className: "ui:shrink-0" }), jsxRuntime.jsx(Heading, { as: titleAs, variant: "h4", className: "ui:min-w-0", children: onClick ? (
+  return jsxRuntime.jsx(Card, { borderRadius: "m", elevation: isList ? "surface" : "small", elevationOnHover: isList ? void 0 : "medium", padding: false, className: classNames__default.default("ui:w-full", className), children: jsxRuntime.jsxs(Stack, { axis: "x", align: "start", justify: "between", _gap: "base", _p: "l", children: [draggable && jsxRuntime.jsx(Box, { className: "ui:relative ui:z-[1] ui:shrink-0 ui:self-center", children: jsxRuntime.jsx(DragHandle, { grabbing: false }) }), jsxRuntime.jsxs(Stack, { _gap: isCompact ? "s" : "m", className: "ui:min-w-0 ui:flex-1", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "base", children: [jsxRuntime.jsx(ActionIcon, { type, iconUrl }), jsxRuntime.jsx(Heading, { as: titleAs, variant: "h4", className: "ui:min-w-0", children: onClick ? (
     /**
      * The whole card is the click target, but it cannot be a
      * `<button>` because the `actions` slot and the drag handle
@@ -5142,18 +5155,10 @@ const ActionCard = ({ type, title, metadata, instruments, actions, draggable = f
   }) })] }), actions && jsxRuntime.jsx(Box, { className: "ui:relative ui:z-[1] ui:shrink-0 ui:self-center", children: actions })] }) });
 };
 
-const actionIcons = {
-  information: ActionInformationColoredIcon,
-  contact: ActionContactColoredIcon,
-  lesson: ActionLessonColoredIcon,
-  calculation: ActionCalculationColoredIcon,
-  measurement: ActionBloodPressureColoredIcon
-};
 const ScheduleItem = ({ icon, label, value, detail }) => jsxRuntime.jsxs(Stack, { axis: "x", align: "start", _gap: "base", children: [jsxRuntime.jsx(Box, { "aria-hidden": true, _p: "s", className: "ui:size-[var(--ui-semantic-size-xl)] ui:shrink-0 ui:[border-radius:var(--ui-semantic-radius-s)]", children: icon }), jsxRuntime.jsxs(Stack, { _gap: "none", className: "ui:min-w-0", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "baseline", _gap: "s", wrap: true, children: [jsxRuntime.jsx(Text, { variant: "body-base-light", color: "neutral-secondary", children: label }), jsxRuntime.jsx(Text, { variant: "body-base-regular", color: "neutral-secondary", children: value })] }), detail && jsxRuntime.jsx(Text, { variant: "body-small-regular", color: "neutral-secondary", children: detail })] })] });
-const ActionCardDetailed = ({ type, title, category, metadata, schedule, scheduleHeading = "Schedule settings", instruments, instrumentsHeading = "Instruments in this action", onEdit, onDelete, onClose, className }) => {
-  const ActionIcon = actionIcons[type];
+const ActionCardDetailed = ({ type, iconUrl, title, category, metadata, schedule, scheduleHeading = "Schedule settings", instruments, instrumentsHeading = "Instruments in this action", onEdit, onDelete, onClose, className }) => {
   const hasActions = onEdit || onDelete || onClose;
-  return jsxRuntime.jsx(Card, { border: true, borderRadius: "m", elevation: "medium", className: classNames__default.default("ui:w-full ui:max-w-[600px]", className), children: jsxRuntime.jsxs(Stack, { _gap: "xl", width: "full", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "start", justify: "between", _gap: "base", width: "full", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "start", _gap: "base", className: "ui:min-w-0", children: [jsxRuntime.jsx(ActionIcon, { "aria-hidden": true, width: 24, height: 24, className: "ui:shrink-0" }), jsxRuntime.jsxs(Stack, { _gap: "none", className: "ui:min-w-0", children: [jsxRuntime.jsx(Heading, { variant: "h3", children: title }), category && jsxRuntime.jsx(Text, { variant: "body-base-regular", color: "neutral-secondary", children: category })] })] }), hasActions && jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "base", className: "ui:shrink-0", children: [onEdit && jsxRuntime.jsx(TertiaryIconButton, { label: "Edit action", onClick: onEdit, children: jsxRuntime.jsx(PencilIcon, { "aria-hidden": true }) }), onDelete && jsxRuntime.jsx(TertiaryIconButton, { label: "Delete action", onClick: onDelete, children: jsxRuntime.jsx(TrashBinIcon, { "aria-hidden": true }) }), onClose && jsxRuntime.jsx(TertiaryIconButton, { label: "Close action details", onClick: onClose, children: jsxRuntime.jsx(CrossIcon, { "aria-hidden": true }) })] })] }), metadata && metadata.length > 0 && jsxRuntime.jsx(Stack, { axis: "x", _gap: "base", wrap: true, children: metadata.map((item, index) => jsxRuntime.jsx(
+  return jsxRuntime.jsx(Card, { border: true, borderRadius: "m", elevation: "medium", className: classNames__default.default("ui:w-full ui:max-w-[600px]", className), children: jsxRuntime.jsxs(Stack, { _gap: "xl", width: "full", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "start", justify: "between", _gap: "base", width: "full", children: [jsxRuntime.jsxs(Stack, { axis: "x", align: "start", _gap: "base", className: "ui:min-w-0", children: [jsxRuntime.jsx(ActionIcon, { type, iconUrl, size: 24 }), jsxRuntime.jsxs(Stack, { _gap: "none", className: "ui:min-w-0", children: [jsxRuntime.jsx(Heading, { variant: "h3", children: title }), category && jsxRuntime.jsx(Text, { variant: "body-base-regular", color: "neutral-secondary", children: category })] })] }), hasActions && jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "base", className: "ui:shrink-0", children: [onEdit && jsxRuntime.jsx(TertiaryIconButton, { label: "Edit action", onClick: onEdit, children: jsxRuntime.jsx(PencilIcon, { "aria-hidden": true }) }), onDelete && jsxRuntime.jsx(TertiaryIconButton, { label: "Delete action", onClick: onDelete, children: jsxRuntime.jsx(TrashBinIcon, { "aria-hidden": true }) }), onClose && jsxRuntime.jsx(TertiaryIconButton, { label: "Close action details", onClick: onClose, children: jsxRuntime.jsx(CrossIcon, { "aria-hidden": true }) })] })] }), metadata && metadata.length > 0 && jsxRuntime.jsx(Stack, { axis: "x", _gap: "base", wrap: true, children: metadata.map((item, index) => jsxRuntime.jsx(
     Tag,
     { _size: "large", _type: "neutral", _variant: "flat", children: item },
     `${index}-${item}`