@luscii-healthtech/web-ui 27.7.0 → 27.8.1

package/dist/components/FilterBar/ActiveFilters.d.ts

@@ -3,7 +3,7 @@ import { CategorizedFilters, FilterBarLocalization, OnFilterBarFilterChange } fr
 type ActiveFiltersProps = {
     filters: CategorizedFilters;
     onRemoveActiveFilter: OnFilterBarFilterChange;
-    localization: Pick<FilterBarLocalization, "filtersLabel">;
+    localization: Pick<FilterBarLocalization, "filtersLabel" | "removeFilterOptionLabelGetter">;
 };
 export declare const ActiveFilters: React.FC<ActiveFiltersProps>;
 export {};

package/dist/components/FilterBar/FilterBarProps.type.d.ts

@@ -57,6 +57,12 @@ export type FilterBarLocalization = {
      * @default "Filters"
      */
     filtersLabel: string;
+    /**
+     * Function for assigning a label to the remove button of an active filter.
+     * @param {TransformedFilterOption} activeFilter
+     * @default (activeFilter) => `Remove filter ${activeFilter.label}`
+     */
+    removeFilterOptionLabelGetter?: (activeFilter: TransformedFilterOption) => string;
 };
 export type TransformedFilterOption = {
     id: string;

package/dist/components/TimelineCard/TimelineCard.d.ts

@@ -25,6 +25,8 @@ type Props = {
      * @default "default"
      */
     state?: "default" | "highlighted" | "bold";
+    disabled?: boolean;
+    onClick?: () => void;
 };
 export declare const TimelineCard: FC<Props>;
 export {};

package/dist/index.development.js

@@ -5657,8 +5657,11 @@ const CloseIcon = () => React__namespace.default.createElement(
   { className: "ui-h-2 ui-w-2", stroke: "currentColor", fill: "none", viewBox: "0 0 8 8" },
   React__namespace.default.createElement("path", { strokeLinecap: "round", strokeWidth: "1.5", d: "M1 1l6 6m0-6L1 7" })
 );
+const defaultRemoveFilterOptionLabelGetter = (activeFilter) => `Remove filter ${activeFilter.label}`;
 const ActiveFilters = (props) => {
+  var _a;
   const { onRemoveActiveFilter, filters, localization } = props;
+  const removeFilterOptionLabelGetter = (_a = localization === null || localization === void 0 ? void 0 : localization.removeFilterOptionLabelGetter) !== null && _a !== void 0 ? _a : defaultRemoveFilterOptionLabelGetter;
   const activeFilters = filters.flatMap((categorizedFilter) => {
     return categorizedFilter.options.map((categorizedFilterOption) => {
       return categorizedFilterOption;
@@ -5681,7 +5684,7 @@ const ActiveFilters = (props) => {
           React__namespace.default.createElement("span", null, activeFilter.label),
           React__namespace.default.createElement(
             "button",
-            { type: "button", className: "ui-mx-1 ui-inline-flex ui-h-4 ui-w-4 ui-flex-shrink-0 ui-rounded-full ui-p-1 ui-text-gray-400 hover:ui-bg-gray-200 hover:ui-text-gray-500", onClick: () => onRemoveActiveFilter({
+            { type: "button", "aria-label": removeFilterOptionLabelGetter(activeFilter), className: "ui-mx-1 ui-inline-flex ui-h-4 ui-w-4 ui-flex-shrink-0 ui-rounded-full ui-p-1 ui-text-gray-400 hover:ui-bg-gray-200 hover:ui-text-gray-500", onClick: () => onRemoveActiveFilter({
               changedFilterOption: {
                 isChecked: false,
                 id: activeFilter.id,
@@ -6052,13 +6055,15 @@ const StatusIndicator = (props) => {
   );
 };
 
-const TimelineCard = ({ title, subtitle, icon, statusText, state = "default" }) => {
+const TimelineCard = ({ title, subtitle, icon, statusText, state = "default", disabled = false, onClick }) => {
   return React__namespace.default.createElement(
     Stack,
     { axis: "x", width: "full", align: "center" },
     React__namespace.default.createElement(
       Card,
-      { className: "ui-w-full ui-border ui-border-primary-dark ui-border-slate-200", padding: false, elevation: state === "highlighted" ? "medium" : "surface" },
+      { as: onClick ? "button" : "div", className: classNames__default.default("ui-w-full ui-border ui-border-slate-100", {
+        "hover:ui-border-slate-200 focus:ui-border-blue-800 focus:ui-outline-primary": onClick
+      }), padding: false, elevation: state === "highlighted" ? "medium" : "surface", onClick, disabled },
       React__namespace.default.createElement(
         Box,
         { className: classNames__default.default({
@@ -6071,8 +6076,8 @@ const TimelineCard = ({ title, subtitle, icon, statusText, state = "default" })
           React__namespace.default.createElement(
             Stack,
             { gap: "m", axis: "x", align: "center" },
-            icon && icon.url && React__namespace.default.createElement("img", { className: "ui-flex-shrink-0", width: 24, height: 24, src: icon.url }),
-            icon && icon.iconKey && React__namespace.default.createElement(Icon, { className: "ui-flex-shrink-0", name: icon.iconKey }),
+            (icon === null || icon === void 0 ? void 0 : icon.url) && React__namespace.default.createElement("img", { className: "ui-flex-shrink-0", width: 24, height: 24, src: icon.url }),
+            (icon === null || icon === void 0 ? void 0 : icon.iconKey) && React__namespace.default.createElement(Icon, { className: "ui-flex-shrink-0", name: icon.iconKey }),
             React__namespace.default.createElement(
               Stack,
               null,