@hitachivantara/uikit-react-lab 6.1.8 → 6.1.10

package/dist/StepNavigation/DefaultNavigation/DefaultNavigation.js

@@ -1,54 +1,38 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { stepSizes, getColor } from "./utils.js";
+import { getColor, stepSizes } from "./utils.js";
 import { HvStep } from "./Step/Step.js";
-const HvDefaultNavigation = ({
-  numSteps,
-  stepSize,
-  getTitles,
-  getDynamicValues,
-  className,
-  children,
-  ...other
-}) => {
-  const { container: maxSize, avatar: minSize } = stepSizes[stepSize];
-  const StepComponent = HvStep;
-  const stepsWidth = maxSize + minSize * (numSteps - 1);
-  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);
-  const maxWidth = Math.max(titleWidth - minSize, separatorWidth);
-  const minWidth = Math.max(
-    titleWidth - (maxSize + minSize) * 0.5,
-    separatorWidth
-  );
-  const Steps = children;
-  const titles = getTitles(({ state }) => ({
-    variant: "label",
-    titleWidth,
-    titleDisabled: state === "Disabled"
-  }));
-  return /* @__PURE__ */ jsxs("div", { ...other, children: [
-    /* @__PURE__ */ jsx(
-      Steps,
-      {
-        ...{
-          stepsWidth,
-          navWidth: width,
-          separatorValues: {
-            minWidth,
-            maxWidth,
-            getColor,
-            height: 1
-          },
-          stepValues: {
-            minSize,
-            maxSize,
-            StepComponent
-          }
-        }
-      }
-    ),
-    titles
-  ] });
-};
-export {
-  HvDefaultNavigation
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/StepNavigation/DefaultNavigation/DefaultNavigation.tsx
+var HvDefaultNavigation = ({ numSteps, stepSize, getTitles, getDynamicValues, className, children, ...other }) => {
+	const { container: maxSize, avatar: minSize } = stepSizes[stepSize];
+	const StepComponent = HvStep;
+	const stepsWidth = maxSize + minSize * (numSteps - 1);
+	const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);
+	const maxWidth = Math.max(titleWidth - minSize, separatorWidth);
+	const minWidth = Math.max(titleWidth - (maxSize + minSize) * .5, separatorWidth);
+	const Steps = children;
+	const titles = getTitles(({ state }) => ({
+		variant: "label",
+		titleWidth,
+		titleDisabled: state === "Disabled"
+	}));
+	return /* @__PURE__ */ jsxs("div", {
+		...other,
+		children: [/* @__PURE__ */ jsx(Steps, {
+			stepsWidth,
+			navWidth: width,
+			separatorValues: {
+				minWidth,
+				maxWidth,
+				getColor,
+				height: 1
+			},
+			stepValues: {
+				minSize,
+				maxSize,
+				StepComponent
+			}
+		}), titles]
+	});
 };
+//#endregion
+export { HvDefaultNavigation };

package/dist/StepNavigation/DefaultNavigation/Step/Step.js

@@ -1,56 +1,45 @@
-import { jsx } from "react/jsx-runtime";
-import { HvButtonBase, HvAvatar } from "@hitachivantara/uikit-react-core";
-import { Level0Good, Level3Bad, HourGlass } from "@hitachivantara/uikit-react-icons";
 import { getSemantic } from "../utils.js";
 import { useClasses } from "./Step.styles.js";
-const iconSizeObject = {
-  xs: 8,
-  sm: 16,
-  md: 24,
-  lg: 32,
-  xl: 40
-};
-const iconStateObject = {
-  Pending: HourGlass,
-  Failed: Level3Bad,
-  Completed: Level0Good
+import { HvAvatar, HvButtonBase } from "@hitachivantara/uikit-react-core";
+import { jsx } from "react/jsx-runtime";
+import { HourGlass, Level0Good, Level3Bad } from "@hitachivantara/uikit-react-icons";
+//#region src/StepNavigation/DefaultNavigation/Step/Step.tsx
+var iconSizeObject = {
+	xs: 8,
+	sm: 16,
+	md: 24,
+	lg: 32,
+	xl: 40
 };
-const HvStep = ({
-  className,
-  classes: classesProp,
-  state,
-  title,
-  onClick,
-  disabled,
-  size = "md",
-  number = 1
-}) => {
-  const { classes, cx } = useClasses(classesProp);
-  const color = state === "Pending" ? "bgPage" : getSemantic(state);
-  const status = state === "Current" ? "textDisabled" : void 0;
-  const IconComponent = iconStateObject[state];
-  return /* @__PURE__ */ jsx(
-    HvButtonBase,
-    {
-      className: cx(classes.root, className, {
-        [classes.notCurrent]: state !== "Current"
-      }),
-      "aria-label": title,
-      disabled: disabled ?? ["Current", "Disabled"].includes(state),
-      onClick,
-      children: /* @__PURE__ */ jsx(
-        HvAvatar,
-        {
-          className: cx(classes.avatar, classes[size]),
-          backgroundColor: getSemantic(state),
-          status,
-          size,
-          children: IconComponent ? /* @__PURE__ */ jsx(IconComponent, { color, size: iconSizeObject[size] }) : number
-        }
-      )
-    }
-  );
+var iconStateObject = {
+	Pending: HourGlass,
+	Failed: Level3Bad,
+	Completed: Level0Good
 };
-export {
-  HvStep
+/**
+* Step element of "Default" Step Navigation root component
+*/
+var HvStep = ({ className, classes: classesProp, state, title, onClick, disabled, size = "md", number = 1 }) => {
+	const { classes, cx } = useClasses(classesProp);
+	const color = state === "Pending" ? "bgPage" : getSemantic(state);
+	const status = state === "Current" ? "textDisabled" : void 0;
+	const IconComponent = iconStateObject[state];
+	return /* @__PURE__ */ jsx(HvButtonBase, {
+		className: cx(classes.root, className, { [classes.notCurrent]: state !== "Current" }),
+		"aria-label": title,
+		disabled: disabled ?? ["Current", "Disabled"].includes(state),
+		onClick,
+		children: /* @__PURE__ */ jsx(HvAvatar, {
+			className: cx(classes.avatar, classes[size]),
+			backgroundColor: getSemantic(state),
+			status,
+			size,
+			children: IconComponent ? /* @__PURE__ */ jsx(IconComponent, {
+				color,
+				size: iconSizeObject[size]
+			}) : number
+		})
+	});
 };
+//#endregion
+export { HvStep };

package/dist/StepNavigation/DefaultNavigation/Step/Step.styles.js

@@ -1,35 +1,24 @@
 import { createClasses, theme } from "@hitachivantara/uikit-react-core";
-const { staticClasses, useClasses } = createClasses("HvStep", {
-  root: {
-    width: "fit-content",
-    height: "fit-content",
-    fontWeight: theme.fontWeights.semibold
-  },
-  notCurrent: { margin: "-8px" },
-  xs: {},
-  sm: {},
-  md: {},
-  lg: {},
-  xl: {},
-  avatar: {
-    "&$xs": {
-      fontSize: "0.625rem"
-    },
-    "&$sm": {
-      fontSize: "1rem"
-    },
-    "&$md": {
-      fontSize: "1.5rem"
-    },
-    "&$lg": {
-      fontSize: "2rem"
-    },
-    "&$xl": {
-      fontSize: "2.5rem"
-    }
-  }
+//#region src/StepNavigation/DefaultNavigation/Step/Step.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvStep", {
+	root: {
+		width: "fit-content",
+		height: "fit-content",
+		fontWeight: theme.fontWeights.semibold
+	},
+	notCurrent: { margin: "-8px" },
+	xs: {},
+	sm: {},
+	md: {},
+	lg: {},
+	xl: {},
+	avatar: {
+		"&$xs": { fontSize: "0.625rem" },
+		"&$sm": { fontSize: "1rem" },
+		"&$md": { fontSize: "1.5rem" },
+		"&$lg": { fontSize: "2rem" },
+		"&$xl": { fontSize: "2.5rem" }
+	}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { useClasses };

package/dist/StepNavigation/DefaultNavigation/utils.js

@@ -1,34 +1,42 @@
 import { theme } from "@hitachivantara/uikit-styles";
-const getColor = (state) => ({
-  Pending: theme.colors.warning ?? "warning",
-  Failed: theme.colors.negative ?? "negative",
-  Completed: theme.colors.positive ?? "positive",
-  Current: theme.colors.text ?? "text",
-  Disabled: theme.colors.textDisabled ?? "textDisabled",
-  Enabled: theme.colors.text ?? "text"
+//#region src/StepNavigation/DefaultNavigation/utils.ts
+var getColor$1 = (state) => ({
+	Pending: theme.colors.warning ?? "warning",
+	Failed: theme.colors.negative ?? "negative",
+	Completed: theme.colors.positive ?? "positive",
+	Current: theme.colors.text ?? "text",
+	Disabled: theme.colors.textDisabled ?? "textDisabled",
+	Enabled: theme.colors.text ?? "text"
 })[state];
-const getSemantic = (state) => ({
-  Pending: "warning",
-  Failed: "negative",
-  Completed: "positive",
-  Current: "text",
-  Disabled: "textDisabled",
-  Enabled: "text"
+var getSemantic = (state) => ({
+	Pending: "warning",
+	Failed: "negative",
+	Completed: "positive",
+	Current: "text",
+	Disabled: "textDisabled",
+	Enabled: "text"
 })[state];
-const EXTRA_SMALL = { container: 32, avatar: 24 };
-const SMALL = { container: 40, avatar: 32 };
-const MEDIUM = { container: 48, avatar: 40 };
-const LARGE = { container: 60, avatar: 52 };
-const EXTRA_LARGE = { container: 96, avatar: 88 };
-const stepSizes = {
-  xs: EXTRA_SMALL,
-  sm: SMALL,
-  md: MEDIUM,
-  lg: LARGE,
-  xl: EXTRA_LARGE
-};
-export {
-  getColor,
-  getSemantic,
-  stepSizes
+var stepSizes = {
+	xs: {
+		container: 32,
+		avatar: 24
+	},
+	sm: {
+		container: 40,
+		avatar: 32
+	},
+	md: {
+		container: 48,
+		avatar: 40
+	},
+	lg: {
+		container: 60,
+		avatar: 52
+	},
+	xl: {
+		container: 96,
+		avatar: 88
+	}
 };
+//#endregion
+export { getColor$1 as getColor, getSemantic, stepSizes };

package/dist/StepNavigation/SimpleNavigation/Dot/Dot.js

@@ -1,44 +1,27 @@
-import { jsx } from "react/jsx-runtime";
+import { dotSizes, getColor } from "../utils.js";
+import { useClasses } from "./Dot.styles.js";
 import { HvButton } from "@hitachivantara/uikit-react-core";
+import { jsx } from "react/jsx-runtime";
 import { mergeStyles } from "@hitachivantara/uikit-react-utils";
-import { getColor, dotSizes } from "../utils.js";
-import { useClasses } from "./Dot.styles.js";
-import { staticClasses } from "./Dot.styles.js";
-const HvDot = ({
-  classes: classesProp,
-  className,
-  state,
-  title,
-  size = "sm",
-  onClick,
-  disabled: disabledProp
-}) => {
-  const { classes, cx } = useClasses(classesProp);
-  const dotSize = dotSizes[size] * (state === "Current" ? 1.5 : 1);
-  const disabled = disabledProp ?? ["Current", "Disabled"].includes(state);
-  return /* @__PURE__ */ jsx(
-    HvButton,
-    {
-      style: mergeStyles(void 0, {
-        "--dotColor": getColor(state),
-        "--dotSize": `${dotSize}px`
-      }),
-      className: cx(
-        classes.root,
-        {
-          [classes.active]: state === "Current",
-          [classes.ghostDisabled]: disabled
-        },
-        className
-      ),
-      "aria-label": title,
-      icon: true,
-      disabled,
-      onClick
-    }
-  );
-};
-export {
-  HvDot,
-  staticClasses as dotClasses
+//#region src/StepNavigation/SimpleNavigation/Dot/Dot.tsx
+var HvDot = ({ classes: classesProp, className, state, title, size = "sm", onClick, disabled: disabledProp }) => {
+	const { classes, cx } = useClasses(classesProp);
+	const dotSize = dotSizes[size] * (state === "Current" ? 1.5 : 1);
+	const disabled = disabledProp ?? ["Current", "Disabled"].includes(state);
+	return /* @__PURE__ */ jsx(HvButton, {
+		style: mergeStyles(void 0, {
+			"--dotColor": getColor(state),
+			"--dotSize": `${dotSize}px`
+		}),
+		className: cx(classes.root, {
+			[classes.active]: state === "Current",
+			[classes.ghostDisabled]: disabled
+		}, className),
+		"aria-label": title,
+		icon: true,
+		disabled,
+		onClick
+	});
 };
+//#endregion
+export { HvDot };

package/dist/StepNavigation/SimpleNavigation/Dot/Dot.styles.js

@@ -1,18 +1,15 @@
 import { createClasses, theme } from "@hitachivantara/uikit-react-core";
-const { staticClasses, useClasses } = createClasses("HvDot", {
-  root: {
-    borderRadius: theme.radii.full,
-    zIndex: 1,
-    width: "var(--dotSize)",
-    height: "var(--dotSize)",
-    "&,:hover,:disabled": {
-      backgroundColor: "var(--dotColor)"
-    }
-  },
-  active: {},
-  ghostDisabled: {}
+//#region src/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvDot", {
+	root: {
+		borderRadius: theme.radii.full,
+		zIndex: 1,
+		width: "var(--dotSize)",
+		height: "var(--dotSize)",
+		"&,:hover,:disabled": { backgroundColor: "var(--dotColor)" }
+	},
+	active: {},
+	ghostDisabled: {}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { useClasses };

package/dist/StepNavigation/SimpleNavigation/SimpleNavigation.js

@@ -1,50 +1,38 @@
-import { jsxs, jsx } from "react/jsx-runtime";
 import { dotSizes, getColor } from "./utils.js";
 import { HvDot } from "./Dot/Dot.js";
-const HvSimpleNavigation = ({
-  numSteps,
-  stepSize = "sm",
-  getTitles,
-  getDynamicValues,
-  children,
-  ...others
-}) => {
-  const dotSize = dotSizes[stepSize];
-  const StepComponent = HvDot;
-  const stepsWidth = (numSteps + 0.5) * dotSize;
-  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);
-  const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);
-  const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);
-  const Steps = children;
-  const titles = getTitles(({ rawTitle, number }) => ({
-    variant: "label",
-    title: `${number}. ${rawTitle}`,
-    titleWidth
-  }));
-  return /* @__PURE__ */ jsxs("div", { ...others, children: [
-    titles,
-    /* @__PURE__ */ jsx(
-      Steps,
-      {
-        ...{
-          stepsWidth,
-          navWidth: width,
-          separatorValues: {
-            minWidth,
-            maxWidth,
-            getColor,
-            height: 1
-          },
-          stepValues: {
-            minSize: dotSize,
-            maxSize: 1.5 * dotSize,
-            StepComponent
-          }
-        }
-      }
-    )
-  ] });
-};
-export {
-  HvSimpleNavigation
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/StepNavigation/SimpleNavigation/SimpleNavigation.tsx
+var HvSimpleNavigation = ({ numSteps, stepSize = "sm", getTitles, getDynamicValues, children, ...others }) => {
+	const dotSize = dotSizes[stepSize];
+	const StepComponent = HvDot;
+	const stepsWidth = (numSteps + .5) * dotSize;
+	const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);
+	const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);
+	const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);
+	const Steps = children;
+	const titles = getTitles(({ rawTitle, number }) => ({
+		variant: "label",
+		title: `${number}. ${rawTitle}`,
+		titleWidth
+	}));
+	return /* @__PURE__ */ jsxs("div", {
+		...others,
+		children: [titles, /* @__PURE__ */ jsx(Steps, {
+			stepsWidth,
+			navWidth: width,
+			separatorValues: {
+				minWidth,
+				maxWidth,
+				getColor,
+				height: 1
+			},
+			stepValues: {
+				minSize: dotSize,
+				maxSize: 1.5 * dotSize,
+				StepComponent
+			}
+		})]
+	});
 };
+//#endregion
+export { HvSimpleNavigation };

package/dist/StepNavigation/SimpleNavigation/utils.js

@@ -1,13 +1,12 @@
 import { theme } from "@hitachivantara/uikit-styles";
-const dotSizes = {
-  xs: 8,
-  sm: 10,
-  md: 12,
-  lg: 14,
-  xl: 16
-};
-const getColor = (state) => state === "Disabled" ? theme.colors.textDisabled : theme.colors.text;
-export {
-  dotSizes,
-  getColor
+//#region src/StepNavigation/SimpleNavigation/utils.ts
+var dotSizes = {
+	xs: 8,
+	sm: 10,
+	md: 12,
+	lg: 14,
+	xl: 16
 };
+var getColor$1 = (state) => state === "Disabled" ? theme.colors.textDisabled : theme.colors.text;
+//#endregion
+export { dotSizes, getColor$1 as getColor };