@hitachivantara/uikit-react-core 6.8.2 → 6.9.0

package/dist/Snackbar/Snackbar.styles.js

@@ -1,44 +1,27 @@
-import { snackbarClasses } from "@mui/material/Snackbar";
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { useClasses, staticClasses } = createClasses("HvSnackbar", {
-  root: {},
-  anchorOriginTopRight: {
-    [`&.${snackbarClasses.anchorOriginTopRight}`]: {
-      top: theme.space.xs,
-      right: theme.space.xs
-    }
-  },
-  anchorOriginTopLeft: {
-    [`&.${snackbarClasses.anchorOriginTopLeft}`]: {
-      top: theme.space.xs,
-      left: theme.space.xs
-    }
-  },
-  anchorOriginTopCenter: {
-    [`&.${snackbarClasses.anchorOriginTopCenter}`]: {
-      top: theme.space.xs
-    }
-  },
-  anchorOriginBottomCenter: {
-    [`&.${snackbarClasses.anchorOriginBottomCenter}`]: {
-      bottom: theme.space.xs
-    }
-  },
-  anchorOriginBottomLeft: {
-    [`&.${snackbarClasses.anchorOriginBottomLeft}`]: {
-      bottom: theme.space.xs,
-      left: theme.space.xs
-    }
-  },
-  anchorOriginBottomRight: {
-    [`&.${snackbarClasses.anchorOriginBottomRight}`]: {
-      bottom: theme.space.xs,
-      right: theme.space.xs
-    }
-  }
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+import { snackbarClasses } from "@mui/material/Snackbar";
+//#region src/Snackbar/Snackbar.styles.tsx
+var { useClasses, staticClasses } = createClasses("HvSnackbar", {
+	root: {},
+	anchorOriginTopRight: { [`&.${snackbarClasses.anchorOriginTopRight}`]: {
+		top: theme.space.xs,
+		right: theme.space.xs
+	} },
+	anchorOriginTopLeft: { [`&.${snackbarClasses.anchorOriginTopLeft}`]: {
+		top: theme.space.xs,
+		left: theme.space.xs
+	} },
+	anchorOriginTopCenter: { [`&.${snackbarClasses.anchorOriginTopCenter}`]: { top: theme.space.xs } },
+	anchorOriginBottomCenter: { [`&.${snackbarClasses.anchorOriginBottomCenter}`]: { bottom: theme.space.xs } },
+	anchorOriginBottomLeft: { [`&.${snackbarClasses.anchorOriginBottomLeft}`]: {
+		bottom: theme.space.xs,
+		left: theme.space.xs
+	} },
+	anchorOriginBottomRight: { [`&.${snackbarClasses.anchorOriginBottomRight}`]: {
+		bottom: theme.space.xs,
+		right: theme.space.xs
+	} }
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Snackbar/SnackbarContent/SnackbarContent.js

@@ -1,53 +1,34 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { HvCallout } from "../../utils/Callout.js";
 import { useClasses } from "./SnackbarContent.styles.js";
-import { staticClasses } from "./SnackbarContent.styles.js";
-const isActionGeneric = (action) => action && typeof action === "object" && "id" in action && "label" in action;
-const HvSnackbarContent = forwardRef(function HvSnackbarContent2(props, ref) {
-  const {
-    className,
-    id,
-    classes: classesProp,
-    label,
-    variant = "default",
-    showIcon,
-    showClose,
-    customIcon,
-    action,
-    onAction,
-    onClose,
-    size,
-    ...others
-  } = useDefaultProps("HvSnackbarContent", props);
-  const { classes, cx } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx(
-    HvCallout,
-    {
-      ref,
-      id,
-      variant,
-      classes: {
-        root: cx(classes.root, classes[variant], className),
-        message: classes.message,
-        messageIcon: classes.iconVariant,
-        messageContent: classes.messageText,
-        action: classes.action
-      },
-      showIcon,
-      showClose,
-      customIcon,
-      actions: isActionGeneric(action) ? [action] : action,
-      onClose,
-      onAction,
-      size,
-      ...others,
-      children: label
-    }
-  );
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Snackbar/SnackbarContent/SnackbarContent.tsx
+var isActionGeneric = (action) => action && typeof action === "object" && "id" in action && "label" in action;
+var HvSnackbarContent = forwardRef(function HvSnackbarContent(props, ref) {
+	const { className, id, classes: classesProp, label, variant = "default", showIcon, showClose, customIcon, action, onAction, onClose, size, ...others } = useDefaultProps("HvSnackbarContent", props);
+	const { classes, cx } = useClasses(classesProp);
+	return /* @__PURE__ */ jsx(HvCallout, {
+		ref,
+		id,
+		variant,
+		classes: {
+			root: cx(classes.root, classes[variant], className),
+			message: classes.message,
+			messageIcon: classes.iconVariant,
+			messageContent: classes.messageText,
+			action: classes.action
+		},
+		showIcon,
+		showClose,
+		customIcon,
+		actions: isActionGeneric(action) ? [action] : action,
+		onClose,
+		onAction,
+		size,
+		...others,
+		children: label
+	});
 });
-export {
-  HvSnackbarContent,
-  staticClasses as snackbarContentClasses
-};
+//#endregion
+export { HvSnackbarContent };

package/dist/Snackbar/SnackbarContent/SnackbarContent.styles.js

@@ -1,32 +1,29 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const name = "HvSnackbarContent";
-const { useClasses, staticClasses } = createClasses(name, {
-  root: {
-    width: "310px",
-    minHeight: "52px",
-    maxHeight: "92px",
-    padding: theme.space.xs
-  },
-  success: {},
-  error: {},
-  default: {},
-  warning: {},
-  info: {},
-  accent: {},
-  message: {
-    padding: 0,
-    width: "100%",
-    minHeight: "32px"
-  },
-  action: {},
-  messageText: {
-    paddingLeft: theme.space.xs,
-    maxHeight: "72px"
-  },
-  iconVariant: {}
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+var { useClasses, staticClasses } = createClasses("HvSnackbarContent", {
+	root: {
+		width: "310px",
+		minHeight: "52px",
+		maxHeight: "92px",
+		padding: theme.space.xs
+	},
+	success: {},
+	error: {},
+	default: {},
+	warning: {},
+	info: {},
+	accent: {},
+	message: {
+		padding: 0,
+		width: "100%",
+		minHeight: "32px"
+	},
+	action: {},
+	messageText: {
+		paddingLeft: theme.space.xs,
+		maxHeight: "72px"
+	},
+	iconVariant: {}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/SnackbarProvider/SnackbarProvider.js

@@ -1,109 +1,77 @@
-import { jsx } from "react/jsx-runtime";
-import { useCallback, useMemo, forwardRef } from "react";
-import { SnackbarProvider, useSnackbar, SnackbarContent } from "notistack";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useClasses } from "./SnackbarProvider.styles.js";
-import { staticClasses } from "./SnackbarProvider.styles.js";
 import { HvSnackbarContent } from "../Snackbar/SnackbarContent/SnackbarContent.js";
-const HvNotistackSnackMessage = forwardRef(function HvNotistackSnackMessage2(props, ref) {
-  const { id, message, variant = "success", snackbarContentProps } = props;
-  return /* @__PURE__ */ jsx(SnackbarContent, { ref, children: /* @__PURE__ */ jsx(
-    HvSnackbarContent,
-    {
-      id,
-      variant,
-      showIcon: true,
-      label: message,
-      role: "none",
-      ...snackbarContentProps
-    }
-  ) });
+import { useClasses } from "./SnackbarProvider.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef, useCallback, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { SnackbarContent, SnackbarProvider, useSnackbar } from "notistack";
+//#region src/SnackbarProvider/SnackbarProvider.tsx
+var HvNotistackSnackMessage = forwardRef(function HvNotistackSnackMessage(props, ref) {
+	const { id, message, variant = "success", snackbarContentProps } = props;
+	return /* @__PURE__ */ jsx(SnackbarContent, {
+		ref,
+		children: /* @__PURE__ */ jsx(HvSnackbarContent, {
+			id,
+			variant,
+			showIcon: true,
+			label: message,
+			role: "none",
+			...snackbarContentProps
+		})
+	});
 });
-const useHvSnackbar = () => {
-  const snackbarContext = useSnackbar();
-  if (!snackbarContext) {
-    throw new Error("useHvSnackbar must be used within an HvSnackbarProvider");
-  }
-  const { enqueueSnackbar: enqueueNotistackSnackbar, closeSnackbar } = snackbarContext;
-  const enqueueSnackbar = useCallback(
-    (message, options = {}) => {
-      const {
-        id,
-        variant = "success",
-        snackbarContentProps,
-        className,
-        ...otherOptions
-      } = options;
-      return enqueueNotistackSnackbar(
-        /* @__PURE__ */ jsx(
-          HvNotistackSnackMessage,
-          {
-            id,
-            message,
-            variant,
-            snackbarContentProps
-          }
-        ),
-        { ...otherOptions, className }
-      );
-    },
-    [enqueueNotistackSnackbar]
-  );
-  return useMemo(
-    () => ({
-      enqueueSnackbar,
-      closeSnackbar
-    }),
-    [enqueueSnackbar, closeSnackbar]
-  );
-};
-const HvSnackbarProvider = (props) => {
-  const {
-    children,
-    notistackClassesOverride,
-    maxSnack = 5,
-    autoHideDuration = 5e3,
-    anchorOrigin = {
-      vertical: "top",
-      horizontal: "right"
-    },
-    classes: classesProp,
-    className,
-    container,
-    ...others
-  } = useDefaultProps("HvSnackbarProvider", props);
-  const { classes, css, cx } = useClasses(classesProp);
-  const { containerRoot, ...otherNotistackClasses } = notistackClassesOverride || {};
-  const notistackClasses = {
-    containerRoot: cx(
-      css({
-        pointerEvents: "all",
-        "& > div > div": {
-          // Overrides notistack extra padding
-          padding: "0 !important",
-          transition: "all 0s ease 0s !important"
-        }
-      }),
-      containerRoot
-    ),
-    ...otherNotistackClasses
-  };
-  return /* @__PURE__ */ jsx(
-    SnackbarProvider,
-    {
-      classes: notistackClasses,
-      maxSnack,
-      autoHideDuration,
-      anchorOrigin,
-      className: cx(classes.snackItemRoot, className),
-      domRoot: container,
-      ...others,
-      children
-    }
-  );
+var useHvSnackbar = () => {
+	const snackbarContext = useSnackbar();
+	if (!snackbarContext) throw new Error("useHvSnackbar must be used within an HvSnackbarProvider");
+	const { enqueueSnackbar: enqueueNotistackSnackbar, closeSnackbar } = snackbarContext;
+	const enqueueSnackbar = useCallback((message, options = {}) => {
+		const { id, variant = "success", snackbarContentProps, className, ...otherOptions } = options;
+		return enqueueNotistackSnackbar(/* @__PURE__ */ jsx(HvNotistackSnackMessage, {
+			id,
+			message,
+			variant,
+			snackbarContentProps
+		}), {
+			...otherOptions,
+			className
+		});
+	}, [enqueueNotistackSnackbar]);
+	return useMemo(() => ({
+		enqueueSnackbar,
+		closeSnackbar
+	}), [enqueueSnackbar, closeSnackbar]);
 };
-export {
-  HvSnackbarProvider,
-  staticClasses as snackbarProviderClasses,
-  useHvSnackbar
+/**
+* A snackbar provider to control the stacking of multiple snackbars in the app.
+*
+* This component uses of the [Notistack](https://github.com/iamhosseindhv/notistack) library.
+* Please refer to its [API Reference](https://notistack.com/api-reference) for more complex usage scenarios.
+*/
+var HvSnackbarProvider = (props) => {
+	const { children, notistackClassesOverride, maxSnack = 5, autoHideDuration = 5e3, anchorOrigin = {
+		vertical: "top",
+		horizontal: "right"
+	}, classes: classesProp, className, container, ...others } = useDefaultProps("HvSnackbarProvider", props);
+	const { classes, css, cx } = useClasses(classesProp);
+	const { containerRoot, ...otherNotistackClasses } = notistackClassesOverride || {};
+	return /* @__PURE__ */ jsx(SnackbarProvider, {
+		classes: {
+			containerRoot: cx(css({
+				pointerEvents: "all",
+				"& > div > div": {
+					padding: "0 !important",
+					transition: "all 0s ease 0s !important"
+				}
+			}), containerRoot),
+			...otherNotistackClasses
+		},
+		maxSnack,
+		autoHideDuration,
+		anchorOrigin,
+		className: cx(classes.snackItemRoot, className),
+		domRoot: container,
+		...others,
+		children
+	});
 };
+//#endregion
+export { HvSnackbarProvider, useHvSnackbar };

package/dist/SnackbarProvider/SnackbarProvider.styles.js

@@ -1,27 +1,21 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
-const { useClasses, staticClasses } = createClasses(
-  "HvSnackbarProvider",
-  {
-    snackItemRoot: {
-      backgroundColor: "transparent !important",
-      boxShadow: "none !important",
-      "&&": {
-        color: "inherit",
-        padding: "0",
-        fontSize: "inherit",
-        boxShadow: "none",
-        alignItems: "center",
-        fontFamily: "inherit",
-        fontWeight: "inherit",
-        lineHeight: "inherit",
-        borderRadius: 0,
-        letterSpacing: "inherit",
-        backgroundColor: "inherit"
-      }
-    }
-  }
-);
-export {
-  staticClasses,
-  useClasses
-};
+//#region src/SnackbarProvider/SnackbarProvider.styles.ts
+var { useClasses, staticClasses } = createClasses("HvSnackbarProvider", { snackItemRoot: {
+	backgroundColor: "transparent !important",
+	boxShadow: "none !important",
+	"&&": {
+		color: "inherit",
+		padding: "0",
+		fontSize: "inherit",
+		boxShadow: "none",
+		alignItems: "center",
+		fontFamily: "inherit",
+		fontWeight: "inherit",
+		lineHeight: "inherit",
+		borderRadius: 0,
+		letterSpacing: "inherit",
+		backgroundColor: "inherit"
+	}
+} });
+//#endregion
+export { staticClasses, useClasses };

package/dist/Stack/Stack.js

@@ -1,88 +1,78 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { useRef, useMemo, useCallback, Children } from "react";
-import MuiDivider from "@mui/material/Divider";
-import { useTheme } from "@mui/material/styles";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { HvFocus } from "../Focus/Focus.js";
 import { useWidth } from "../hooks/useWidth.js";
 import { useClasses } from "./Stack.styles.js";
-import { staticClasses } from "./Stack.styles.js";
-import { HvFocus } from "../Focus/Focus.js";
-const getDirection = (direction, width, breakpoints) => {
-  if (typeof direction === "string") return direction;
-  for (let i = breakpoints.indexOf(width); i >= 0; i -= 1) {
-    if (direction[breakpoints[i]] !== void 0) {
-      return direction[breakpoints[i]];
-    }
-  }
-  return "column";
-};
-const HvStack = (props) => {
-  const {
-    classes: classesProp,
-    className,
-    children,
-    direction: directionProp = "column",
-    spacing = "sm",
-    divider = false,
-    withNavigation = false,
-    dividerProps = {},
-    ...others
-  } = useDefaultProps("HvStack", props);
-  const { classes, cx } = useClasses(classesProp);
-  const width = useWidth();
-  const containerRef = useRef(null);
-  const { breakpoints } = useTheme();
-  const direction = useMemo(
-    () => getDirection(directionProp, width, breakpoints.keys),
-    [directionProp, width, breakpoints]
-  );
-  const getDividerComponent = useCallback(() => {
-    if (typeof divider === "boolean" && divider) {
-      return /* @__PURE__ */ jsx(
-        MuiDivider,
-        {
-          orientation: direction === "column" ? "horizontal" : "vertical",
-          flexItem: direction === "row",
-          classes: {
-            root: classes.divider
-          },
-          ...dividerProps
-        }
-      );
-    }
-    return divider;
-  }, [classes.divider, divider, dividerProps, direction]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: containerRef,
-      className: cx(
-        classes.root,
-        classes[direction],
-        classes[spacing],
-        className
-      ),
-      ...others,
-      children: Children.map(children, (child, i) => {
-        return /* @__PURE__ */ jsxs(Fragment, { children: [
-          divider && i !== 0 && getDividerComponent(),
-          withNavigation ? /* @__PURE__ */ jsx(
-            HvFocus,
-            {
-              rootRef: containerRef,
-              focusDisabled: false,
-              strategy: "grid",
-              navigationJump: direction === "column" ? 1 : Children.count(children) || 0,
-              filterClass: "child",
-              children: /* @__PURE__ */ jsx("div", { className: "child", children: child })
-            }
-          ) : child
-        ] });
-      })
-    }
-  );
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { Children, useCallback, useMemo, useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useTheme as useTheme$1 } from "@mui/material/styles";
+import MuiDivider from "@mui/material/Divider";
+//#region src/Stack/Stack.tsx
+/**
+* @returns {string} - Returns a direction for the stack: column or row. If the
+*                     `direction` property is a string and a valid direction then we
+*                     use it. If it's an object with multiple directions by breakpoint
+*                     we use the appropriate one or search for the nearest breakpoint
+*                     smaller than the current one to use.
+*/
+var getDirection = (direction, width, breakpoints) => {
+	if (typeof direction === "string") return direction;
+	for (let i = breakpoints.indexOf(width); i >= 0; i -= 1) if (direction[breakpoints[i]] !== void 0) return direction[breakpoints[i]];
+	return "column";
 };
-export {
-  HvStack,
-  staticClasses as stackClasses
+/**
+* The Stack component arranges its children in a vertical or horizontal layout.
+*
+* It supports customizable spacing and optional dividers between elements.
+*
+*/
+var HvStack = (props) => {
+	const { classes: classesProp, className, children, direction: directionProp = "column", spacing = "sm", divider = false, withNavigation = false, dividerProps = {}, ...others } = useDefaultProps("HvStack", props);
+	const { classes, cx } = useClasses(classesProp);
+	const width = useWidth();
+	const containerRef = useRef(null);
+	const { breakpoints } = useTheme$1();
+	const direction = useMemo(() => getDirection(directionProp, width, breakpoints.keys), [
+		directionProp,
+		width,
+		breakpoints
+	]);
+	/**
+	* @returns {node} - The divider component to use. If the property `divider` is
+	*                   set to `true` then the Material-UI divider is used, otherwise
+	*                   we use the custom divider the user passed.
+	*/
+	const getDividerComponent = useCallback(() => {
+		if (typeof divider === "boolean" && divider) return /* @__PURE__ */ jsx(MuiDivider, {
+			orientation: direction === "column" ? "horizontal" : "vertical",
+			flexItem: direction === "row",
+			classes: { root: classes.divider },
+			...dividerProps
+		});
+		return divider;
+	}, [
+		classes.divider,
+		divider,
+		dividerProps,
+		direction
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		ref: containerRef,
+		className: cx(classes.root, classes[direction], classes[spacing], className),
+		...others,
+		children: Children.map(children, (child, i) => {
+			return /* @__PURE__ */ jsxs(Fragment$1, { children: [divider && i !== 0 && getDividerComponent(), withNavigation ? /* @__PURE__ */ jsx(HvFocus, {
+				rootRef: containerRef,
+				focusDisabled: false,
+				strategy: "grid",
+				navigationJump: direction === "column" ? 1 : Children.count(children) || 0,
+				filterClass: "child",
+				children: /* @__PURE__ */ jsx("div", {
+					className: "child",
+					children: child
+				})
+			}) : child] });
+		})
+	});
 };
+//#endregion
+export { HvStack };

package/dist/Stack/Stack.styles.js

@@ -1,35 +1,16 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvStack", {
-  root: {
-    display: "flex"
-  },
-  column: {
-    flexDirection: "column"
-  },
-  row: {
-    flexDirection: "row"
-  },
-  divider: {
-    borderColor: theme.colors.border
-  },
-  xs: {
-    gap: theme.space.xs
-  },
-  sm: {
-    gap: theme.space.sm
-  },
-  md: {
-    gap: theme.spacing(4)
-  },
-  lg: {
-    gap: theme.spacing(6)
-  },
-  xl: {
-    gap: theme.spacing(11)
-  }
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/Stack/Stack.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvStack", {
+	root: { display: "flex" },
+	column: { flexDirection: "column" },
+	row: { flexDirection: "row" },
+	divider: { borderColor: theme.colors.border },
+	xs: { gap: theme.space.xs },
+	sm: { gap: theme.space.sm },
+	md: { gap: theme.spacing(4) },
+	lg: { gap: theme.spacing(6) },
+	xl: { gap: theme.spacing(11) }
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };