@luscii-healthtech/web-ui 58.2.4 → 58.3.0

package/dist/index.development.js

@@ -5050,6 +5050,33 @@ const MediaPicker = React__namespace.default.forwardRef((props, ref) => {
 
 const TagGroup = ({ children, tags, tagSize = "large", className }) => jsxRuntime.jsxs("div", { className: classNames__default.default("ui:flex ui:flex-row ui:flex-wrap ui:gap-2", className), children: [children, tags === null || tags === void 0 ? void 0 : tags.map((tag) => jsxRuntime.jsx(Tag, Object.assign({ _size: tagSize }, tag)))] });
 
+const typeIcons = {
+  info: BookOpenIcon,
+  questionnaire: ClipboardListIcon,
+  numeric: HashIcon,
+  document: DocumentLinesIcon,
+  contact: PersonIcon,
+  other: CircleEllipsisIcon,
+  scripted: SigmaSquareIcon,
+  sum: SigmaSquareIcon
+};
+const InstrumentCard = ({ type, title, category, meta, id, count, variant = "compact", state = "default", errorMessage, className }) => {
+  const isDetailed = variant === "detailed";
+  const isError = state === "error";
+  const TypeIcon = isError ? ExclamationMarkIcon : typeIcons[type];
+  const textColor = isError ? "error" : "neutral";
+  if (!isDetailed) {
+    return jsxRuntime.jsxs(Stack, { axis: "x", align: "center", _gap: "base", _py: "base", _pl: "base", _pr: "m", className: classNames__default.default("ui:inline-flex ui:bg-background-neutral-primary-default ui:[border-radius:var(--ui-semantic-radius-m)]", className), children: [jsxRuntime.jsx(TypeIcon, { "aria-hidden": true, width: 14, height: 14, className: classNames__default.default("ui:shrink-0", {
+      "ui:text-icon-error-primary-default": isError,
+      "ui:text-icon-brand-primary-default": !isError
+    }) }), jsxRuntime.jsx(Text, { variant: "body-small-regular", color: textColor, children: isError ? errorMessage : title })] });
+  }
+  return jsxRuntime.jsxs(Stack, { axis: "x", align: "start", justify: "between", width: "full", _py: "m", _pl: "m", _pr: "base", className: classNames__default.default("ui:bg-background-neutral-primary-default ui:[border-radius:var(--ui-semantic-radius-m)]", className), children: [jsxRuntime.jsxs(Stack, { axis: "x", _gap: "base", className: "ui:min-w-0 ui:flex-1", children: [jsxRuntime.jsx(Box, { _py: "xs", className: "ui:shrink-0", children: jsxRuntime.jsx(TypeIcon, { "aria-hidden": true, width: 16, height: 16, className: classNames__default.default({
+    "ui:text-icon-error-primary-default": isError,
+    "ui:text-icon-brand-primary-default": !isError
+  }) }) }), jsxRuntime.jsxs(Stack, { _gap: "base", className: "ui:min-w-0 ui:flex-1", children: [jsxRuntime.jsx(Text, { variant: "body-medium-regular", color: textColor, truncate: true, className: "ui:min-w-0", children: title }), isError && jsxRuntime.jsx(Text, { variant: "body-small-regular", color: "error", children: errorMessage }), !isError && (category || meta) && jsxRuntime.jsxs(Stack, { axis: "x", align: "center", children: [category && jsxRuntime.jsx(Text, { variant: "body-small-regular", color: "neutral", children: category }), category && meta && jsxRuntime.jsx(Box, { _mx: "base", className: "ui:h-[12px] ui:w-px ui:shrink-0 ui:bg-border-neutral-primary-default" }), meta && jsxRuntime.jsx(Text, { variant: "body-small-regular", color: "neutral", children: meta })] }), id && jsxRuntime.jsx(Tag, { _size: "small", _variant: "bordered", _leadingIcon: jsxRuntime.jsx(CopyToClipboardIcon, { "aria-hidden": true }), children: id })] })] }), count !== void 0 && jsxRuntime.jsx(Tag, { _size: "small", _variant: "flat", _leadingIcon: jsxRuntime.jsx(CopyToClipboardIcon, { "aria-hidden": true }), className: "ui:shrink-0", children: jsxRuntime.jsx(Text, { variant: "body-small-bold", as: "span", children: count }) })] });
+};
+
 var css_248z$1 = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n.cweb-textarea {\n  resize: none;\n  background-color: field;\n}\n.cweb-textarea.has-icon {\n  background-size: 24px;\n  background-position: 10px 10px;\n  background-repeat: no-repeat;\n  padding-left: 44px;\n}\n.cweb-textarea.resizable {\n  resize: both;\n}\n.cweb-textarea.resizable-x {\n  resize: horizontal;\n}\n.cweb-textarea.resizable-y {\n  resize: vertical;\n}\n.cweb-textarea:focus {\n  border-color: var(--color-primary);\n}\n.cweb-textarea:disabled {\n  cursor: not-allowed;\n}\n.cweb-textarea.has-error {\n  border: 1px solid #b91c1c;\n  color: #991b1b;\n}";
 styleInject(css_248z$1);
 
@@ -7288,6 +7315,7 @@ exports.InfoField = InfoField;
 exports.InfoIcon = InfoIcon;
 exports.Input = Input;
 exports.InputSelect = InputSelectWithSubComponents;
+exports.InstrumentCard = InstrumentCard;
 exports.LabelText = LabelText;
 exports.LabeledCheckbox = LabeledCheckbox;
 exports.LabeledCheckboxCard = LabeledCheckboxCard;