@luscii-healthtech/web-ui 30.11.0 → 31.1.0

package/dist/components/Breadcrumbs/BreadcrumbItem.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { BreadcrumbDividerProps, Crumb } from "./Breadcrumbs.types";
-export declare const BreadcrumbItem: React.FC<Crumb>;
+import type { BreadcrumbDividerProps, Crumb, CrumbRenderProp } from "./Breadcrumbs.types";
+export declare const BreadcrumbItem: React.FC<Crumb & CrumbRenderProp>;
 export declare const BreadcrumbDividerItem: React.FC<BreadcrumbDividerProps>;

package/dist/components/Breadcrumbs/Breadcrumbs.types.d.ts

@@ -1,16 +1,15 @@
 /// <reference types="react" />
 import Text from "../Text/Text";
-type RenderBreadcrumb = (props: {
+export type RenderBreadcrumbProps = {
     name: string;
     link?: string;
     textProps: React.ComponentProps<typeof Text>;
-}) => React.ReactNode;
-export type Crumb = {
+};
+export type RenderBreadcrumb = (props: RenderBreadcrumbProps) => React.ReactNode;
+export type CrumbRenderProp = {
     render: RenderBreadcrumb;
-    key?: string;
-    name: never;
-    link: never;
-} | {
+};
+export type Crumb = {
     name: string;
     key?: string;
     link?: string;
@@ -18,11 +17,10 @@ export type Crumb = {
 export interface BreadcrumbProps {
     crumbs: Crumb[];
     truncateAfter?: number;
-    renderItem?: RenderBreadcrumb;
+    renderItem: RenderBreadcrumb;
 }
 export type BreadcrumbDividerProps = {
     onClick: () => void;
     truncatedCrumbs: Crumb[];
 };
 export declare const isBreadcrumbDividerProps: (subject: unknown) => subject is BreadcrumbDividerProps;
-export {};

package/dist/components/PageHeader/PageHeader.types.d.ts

@@ -16,20 +16,26 @@ type WithPageHeaderBanner = {
         icon?: string | React.FunctionComponent<IconProps>;
     };
 };
+type AllOrNone<T> = T | {
+    [K in keyof T]?: never;
+};
+type WithBreadcrumbProps = {
+    truncateBreadcrumbsAfter?: number;
+} & AllOrNone<{
+    breadcrumbs: BreadcrumbProps["crumbs"];
+    renderBreadcrumbItem: BreadcrumbProps["renderItem"];
+}>;
 export type PageHeaderProps = {
     /**
      * These are props passed to the `Tabbar` component. The name
      * `navigation` does not convey this well.
      */
     navigation?: Omit<TabbarProps, "withoutPadding">;
-    breadcrumbs?: BreadcrumbProps["crumbs"];
-    truncateBreadcrumbsAfter?: number;
-    renderBreadcrumbItem?: BreadcrumbProps["renderItem"];
     dataTestId?: string;
     title: string | React.ReactNode;
     isPolling?: boolean;
     className?: string;
     contained?: boolean;
     accessories?: React.ReactNode;
-} & WithPageHeaderBanner;
+} & WithPageHeaderBanner & WithBreadcrumbProps;
 export {};

package/dist/index.development.js

@@ -4867,21 +4867,11 @@ const defaultTextProps = {
 };
 const BreadcrumbContent = (_a) => {
   var { name, link } = _a, props = __rest(_a, ["name", "link"]);
-  if ("render" in props && !!props.render) {
-    return React__namespace.default.createElement(React__namespace.default.Fragment, null, props.render({
-      name,
-      link,
-      textProps: link ? linkTextProps : defaultTextProps
-    }));
-  }
-  if (link) {
-    return React__namespace.default.createElement(
-      router.Link,
-      { to: link },
-      React__namespace.default.createElement(Text, Object.assign({}, linkTextProps), name)
-    );
-  }
-  return React__namespace.default.createElement(Text, Object.assign({}, defaultTextProps), name);
+  return React__namespace.default.createElement(React__namespace.default.Fragment, null, props.render({
+    name,
+    link,
+    textProps: link ? linkTextProps : defaultTextProps
+  }));
 };
 const BreadcrumbDividerItem = ({ onClick, truncatedCrumbs }) => {
   return React__namespace.default.createElement(
@@ -4890,12 +4880,32 @@ const BreadcrumbDividerItem = ({ onClick, truncatedCrumbs }) => {
     React__namespace.default.createElement(
       "button",
       { onClick, title: truncatedCrumbs.map((crumb) => crumb.name).join(" / "), className: "ui-px-1" },
-      React__namespace.default.createElement(Text, { color: "blue-800", type: "strong" }, "\u2026")
+      React__namespace.default.createElement(Text, { color: "blue-800", variant: "strong" }, "\u2026")
     )
   );
 };
 
-const Breadcrumbs = ({ crumbs, truncateAfter = Infinity, renderItem }) => {
+const renderBreadcrumbItem = ({ link, name, textProps }) => {
+  if (typeof link !== "undefined" && link !== null) {
+    return React__namespace.default.createElement(
+      "a",
+      { href: link },
+      React__namespace.default.createElement(Text, Object.assign({}, textProps), name)
+    );
+  }
+  return React__namespace.default.createElement(Text, Object.assign({}, textProps), name);
+};
+const Breadcrumbs = ({
+  crumbs,
+  truncateAfter = Infinity,
+  /**
+   * `renderItem` is a required prop, but in Vitals not
+   * everything is type-safe yet. Because of this we
+   * supply a default value here, so we make absolutely
+   * sure that the prop is always present and never breaks.
+   */
+  renderItem = renderBreadcrumbItem
+}) => {
   const [head, ...tail] = crumbs;
   const [isTruncated, setIsTruncated] = React.useState(tail.length > truncateAfter);
   const truncatedCrumbs = [];
@@ -5085,7 +5095,11 @@ const PageHeaderBlock = ({ header, title }) => {
     );
   }
   if (header) {
-    pageHeaderComponent = React__namespace.default.createElement(PageHeader, Object.assign({}, header));
+    if (header.breadcrumbs !== void 0 && header.renderBreadcrumbItem !== void 0) {
+      pageHeaderComponent = React__namespace.default.createElement(PageHeader, Object.assign({}, header, { breadcrumbs: header.breadcrumbs, renderBreadcrumbItem: header.renderBreadcrumbItem }));
+    } else {
+      pageHeaderComponent = React__namespace.default.createElement(PageHeader, Object.assign({}, header, { breadcrumbs: void 0, renderBreadcrumbItem: void 0 }));
+    }
   }
   return React__namespace.default.createElement(
     React__namespace.default.Fragment,