@luscii-healthtech/web-ui 42.13.2 → 43.0.0

package/dist/src/components/Page/CRUDPage.types.d.ts

@@ -1,6 +1,5 @@
 import type { BaseButtonProps } from "../ButtonV2/ButtonProps.type";
 import type { PageHeaderProps } from "../PageHeader";
-import type { StepsProps } from "../Steps/Steps";
 type CRUDPageButtonProps = Pick<BaseButtonProps, "onClick" | "text" | "isDisabled" | "form" | "type">;
 type CRUDPageTitle = {
     text: string;
@@ -32,9 +31,11 @@ type CRUDPagePropsWithoutHeaderOrTitle = {
     isSubmitting?: boolean;
     children?: React.ReactNode;
     steps?: {
-        titles: StepsProps["orderedStepTitles"];
-        currentStep: StepsProps["currentStep"];
-        localization: StepsProps["localization"];
+        titles: Array<string>;
+        currentStep: number;
+        localization: {
+            step: string;
+        };
     };
     /**
      * When `true` will set the height of the

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

@@ -16,6 +16,11 @@ type HeaderProps = ComponentProps<typeof Box> & {
      * A 36x36 slot for an action (usually a SecondaryIconButton) to be placed on the right side of the header.
      */
     rightActionSlot?: ReactNode;
+    /**
+     * In some cases you want the action slots to be aligned differently than centered.
+     * @default "center"
+     */
+    slotsAlignment?: "start" | "center";
 };
 declare const Header: FC<HeaderProps>;
 declare const Main: FC<ComponentProps<typeof Box>>;

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

@@ -26,7 +26,7 @@ type Props<C extends React.ElementType> = React.ComponentPropsWithoutRef<C> & {
      * Positioning of items along the Stack’s main axis.
      * The values are based on Tailwind's classnames and are therefore limited to the following:
      */
-    justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly";
+    justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly" | "stretch";
     /**
      * Positioning of items along the Stack’s x (horizontal) or y (vertical) axis
      */

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

@@ -1,9 +1,11 @@
-export interface StepsProps {
-    orderedStepTitles: Array<string>;
-    currentStep: number;
+import React from "react";
+import { Step } from "./subcomponents/Step";
+type Props = {
+    children?: React.ReactNode;
     className?: string;
-    localization: {
-        step: string;
-    };
-}
-export declare const Steps: ({ orderedStepTitles, currentStep, className, localization, }: StepsProps) => JSX.Element;
+};
+type StaticProperties = {
+    Step: typeof Step;
+};
+export declare const Steps: React.FC<Props> & StaticProperties;
+export {};

package/dist/src/components/Steps/subcomponents/Step.d.ts

@@ -0,0 +1,7 @@
+type Props = {
+    title: string;
+    subtitle?: string;
+    state: "completed" | "current" | "upcoming";
+};
+export declare const Step: React.FC<Props>;
+export {};

package/dist/stories/Divider.stories.d.ts

@@ -11,7 +11,7 @@ declare const meta: {
         as?: import("react").ElementType | undefined;
         gap?: "none" | "s" | "xs" | "xl" | "m" | "xxxxs" | "xxxs" | "xxs" | "l" | "xxl";
         align?: "start" | "end" | "center" | "baseline" | "stretch" | "normal";
-        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly";
+        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly" | "stretch";
         axis?: "x" | "y";
         reverse?: boolean;
         wrap?: boolean;
@@ -35,7 +35,7 @@ declare const meta: {
         as?: import("react").ElementType | undefined;
         gap?: "none" | "s" | "xs" | "xl" | "m" | "xxxxs" | "xxxs" | "xxs" | "l" | "xxl";
         align?: "start" | "end" | "center" | "baseline" | "stretch" | "normal";
-        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly";
+        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly" | "stretch";
         axis?: "x" | "y";
         reverse?: boolean;
         wrap?: boolean;

package/dist/stories/PageWithCenteredContentLayout.stories.d.ts

@@ -27,6 +27,7 @@ declare const meta: {
         } & {
             leftActionSlot?: import("react").ReactNode;
             rightActionSlot?: import("react").ReactNode;
+            slotsAlignment?: "start" | "center";
         }>;
         Main: import("react").FC<Omit<any, "ref"> & Partial<Record<"p" | "m" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "mt" | "mr" | "mb" | "ml" | "mx" | "my", "none" | "s" | "xs" | "xl" | "m" | "xxxxs" | "xxxs" | "xxs" | "l" | "xxl">> & {
             as?: import("react").ElementType | undefined;
@@ -49,3 +50,4 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Simple: Story;
 export declare const Overflow: Story;
+export declare const ActionsAlignment: Story;

package/dist/stories/Steps.stories.d.ts

@@ -1,14 +1,26 @@
 declare const _default: {
     title: string;
-    component: ({ orderedStepTitles, currentStep, className, localization, }: import("../src/components/Steps/Steps").StepsProps) => JSX.Element;
+    component: import("react").FC<{
+        children?: React.ReactNode;
+        className?: string;
+    }> & {
+        Step: typeof import("../src/components/Steps/subcomponents/Step").Step;
+    };
+    subcomponents: {
+        Step: import("react").FC<{
+            title: string;
+            subtitle?: string;
+            state: "completed" | "current" | "upcoming";
+        }>;
+    };
 };
 export default _default;
 export declare const Full: {
-    args: {
-        orderedStepTitles: string[];
-        currentStep: number;
-        localization: {
-            step: string;
-        };
-    };
+    render: () => import("react/jsx-runtime").JSX.Element;
+};
+export declare const WithSubcomponents: {
+    render: () => import("react/jsx-runtime").JSX.Element;
+};
+export declare const WithSubcomponentsAndSubtitles: {
+    render: () => import("react/jsx-runtime").JSX.Element;
 };

package/dist/stories/TimelineCardLayout.stories.d.ts

@@ -8,7 +8,7 @@ declare const meta: {
         as?: import("react").ElementType | undefined;
         gap?: "none" | "s" | "xs" | "xl" | "m" | "xxxxs" | "xxxs" | "xxs" | "l" | "xxl";
         align?: "start" | "end" | "center" | "baseline" | "stretch" | "normal";
-        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly";
+        justify?: "normal" | "start" | "end" | "center" | "between" | "around" | "evenly" | "stretch";
         axis?: "x" | "y";
         reverse?: boolean;
         wrap?: boolean;

package/dist/web-ui-tailwind.css

@@ -1591,8 +1591,8 @@ button, input:where([type='button'], [type='reset'], [type='submit']), ::file-se
 .ui\:justify-start {
   justify-content: flex-start;
 }
-.ui\:justify-items-stretch {
-  justify-items: stretch;
+.ui\:justify-stretch {
+  justify-content: stretch;
 }
 .ui\:gap-2 {
   gap: calc(var(--ui-spacing) * 2);
@@ -1711,13 +1711,6 @@ button, input:where([type='button'], [type='reset'], [type='submit']), ::file-se
     margin-inline-end: calc(calc(var(--ui-spacing) * 4) * calc(1 - var(--tw-space-x-reverse)));
   }
 }
-.ui\:space-x-6 {
-  :where(& > :not(:last-child)) {
-    --tw-space-x-reverse: 0;
-    margin-inline-start: calc(calc(var(--ui-spacing) * 6) * var(--tw-space-x-reverse));
-    margin-inline-end: calc(calc(var(--ui-spacing) * 6) * calc(1 - var(--tw-space-x-reverse)));
-  }
-}
 .ui\:space-x-8 {
   :where(& > :not(:last-child)) {
     --tw-space-x-reverse: 0;