@hitachivantara/uikit-react-core 6.8.1 → 6.9.0

package/dist/Dialog/Dialog.js

@@ -1,74 +1,54 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { forwardRef, useMemo } from "react";
-import MuiDialog from "@mui/material/Dialog";
-import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
 import { HvIcon } from "../icons.js";
 import { getElementById } from "../utils/document.js";
+import { HvIconButton } from "../IconButton/IconButton.js";
 import { DialogContext } from "./context.js";
 import { useClasses } from "./Dialog.styles.js";
-import { staticClasses } from "./Dialog.styles.js";
-import { HvIconButton } from "../IconButton/IconButton.js";
-const HvDialog = forwardRef((props, ref) => {
-  const {
-    variant,
-    classes: classesProp,
-    className,
-    children,
-    open = false,
-    onClose,
-    buttonTitle = "Close",
-    fullHeight,
-    fullScreen = false,
-    disableBackdropClick = false,
-    ...others
-  } = useDefaultProps("HvDialog", props);
-  const { classes, cx } = useClasses(classesProp);
-  const { rootId } = useTheme();
-  const contextValue = useMemo(() => ({ fullScreen }), [fullScreen]);
-  return /* @__PURE__ */ jsxs(
-    MuiDialog,
-    {
-      container: getElementById(rootId),
-      className,
-      classes: {
-        root: classes.root,
-        paper: cx(classes.paper, classes[variant], {
-          [classes.fullHeight]: fullHeight,
-          [classes.statusBar]: !!variant,
-          [classes.fullScreen]: fullScreen
-        })
-      },
-      ref,
-      open,
-      fullScreen,
-      onClose: (event, reason) => {
-        if (disableBackdropClick) return;
-        onClose?.(event, reason);
-      },
-      slotProps: {
-        backdrop: {
-          classes: {
-            root: classes.background
-          }
-        }
-      },
-      ...others,
-      children: [
-        onClose && /* @__PURE__ */ jsx(
-          HvIconButton,
-          {
-            title: buttonTitle,
-            className: classes.closeButton,
-            onClick: (event) => onClose?.(event, void 0),
-            children: /* @__PURE__ */ jsx(HvIcon, { name: "Close", compact: true })
-          }
-        ),
-        /* @__PURE__ */ jsx(DialogContext.Provider, { value: contextValue, children })
-      ]
-    }
-  );
+import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
+import { forwardRef, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import MuiDialog from "@mui/material/Dialog";
+//#region src/Dialog/Dialog.tsx
+/**
+* A Dialog is a graphical control element in the form of a small panel that communicates information and prompts for a response.
+*/
+var HvDialog = forwardRef((props, ref) => {
+	const { variant, classes: classesProp, className, children, open = false, onClose, buttonTitle = "Close", fullHeight, fullScreen = false, disableBackdropClick = false, ...others } = useDefaultProps("HvDialog", props);
+	const { classes, cx } = useClasses(classesProp);
+	const { rootId } = useTheme();
+	const contextValue = useMemo(() => ({ fullScreen }), [fullScreen]);
+	return /* @__PURE__ */ jsxs(MuiDialog, {
+		container: getElementById(rootId),
+		className,
+		classes: {
+			root: classes.root,
+			paper: cx(classes.paper, classes[variant], {
+				[classes.fullHeight]: fullHeight,
+				[classes.statusBar]: !!variant,
+				[classes.fullScreen]: fullScreen
+			})
+		},
+		ref,
+		open,
+		fullScreen,
+		onClose: (event, reason) => {
+			if (disableBackdropClick) return;
+			onClose?.(event, reason);
+		},
+		slotProps: { backdrop: { classes: { root: classes.background } } },
+		...others,
+		children: [onClose && /* @__PURE__ */ jsx(HvIconButton, {
+			title: buttonTitle,
+			className: classes.closeButton,
+			onClick: (event) => onClose?.(event, void 0),
+			children: /* @__PURE__ */ jsx(HvIcon, {
+				name: "Close",
+				compact: true
+			})
+		}), /* @__PURE__ */ jsx(DialogContext.Provider, {
+			value: contextValue,
+			children
+		})]
+	});
 });
-export {
-  HvDialog,
-  staticClasses as dialogClasses
-};
+//#endregion
+export { HvDialog };

package/dist/Dialog/Dialog.styles.js

@@ -1,48 +1,35 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvDialog", {
-  root: {},
-  background: {
-    backgroundColor: theme.colors.bgOverlay
-  },
-  paper: {
-    color: theme.colors.text,
-    background: theme.colors.bgContainer,
-    boxShadow: theme.colors.shadow,
-    borderColor: theme.colors.border,
-    borderRadius: theme.radii.round
-  },
-  fullScreen: {
-    borderRadius: 0
-  },
-  fullHeight: {
-    height: "100%"
-  },
-  closeButton: {
-    padding: 0,
-    minWidth: "auto",
-    position: "absolute",
-    top: theme.space.sm,
-    right: theme.space.sm,
-    width: 32,
-    height: 32
-  },
-  statusBar: {
-    borderTopLeftRadius: 0,
-    borderTopRightRadius: 0,
-    borderTopWidth: 4
-  },
-  success: {
-    borderColor: theme.colors.positive
-  },
-  error: {
-    borderColor: theme.colors.negative
-  },
-  warning: {
-    borderColor: theme.colors.warning
-  }
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/Dialog/Dialog.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvDialog", {
+	root: {},
+	background: { backgroundColor: theme.colors.bgOverlay },
+	paper: {
+		color: theme.colors.text,
+		background: theme.colors.bgContainer,
+		boxShadow: theme.colors.shadow,
+		borderColor: theme.colors.border,
+		borderRadius: theme.radii.round
+	},
+	fullScreen: { borderRadius: 0 },
+	fullHeight: { height: "100%" },
+	closeButton: {
+		padding: 0,
+		minWidth: "auto",
+		position: "absolute",
+		top: theme.space.sm,
+		right: theme.space.sm,
+		width: 32,
+		height: 32
+	},
+	statusBar: {
+		borderTopLeftRadius: 0,
+		borderTopRightRadius: 0,
+		borderTopWidth: 4
+	},
+	success: { borderColor: theme.colors.positive },
+	error: { borderColor: theme.colors.negative },
+	warning: { borderColor: theme.colors.warning }
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Dialog/Title/Title.js

@@ -1,45 +1,23 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import MuiDialogTitle from "@mui/material/DialogTitle";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useDialogContext } from "../context.js";
-import { useClasses } from "./Title.styles.js";
-import { staticClasses } from "./Title.styles.js";
 import { HvTypography } from "../../Typography/Typography.js";
 import { HvStatusIcon } from "../../StatusIcon/StatusIcon.js";
-const HvDialogTitle = (props) => {
-  const {
-    classes: classesProp,
-    className,
-    children,
-    variant,
-    showIcon = variant != null,
-    customIcon,
-    ...others
-  } = useDefaultProps("HvDialogTitle", props);
-  const { classes, cx } = useClasses(classesProp);
-  const { fullScreen } = useDialogContext();
-  const icon = customIcon || showIcon && /* @__PURE__ */ jsx(HvStatusIcon, { variant });
-  return /* @__PURE__ */ jsxs(
-    HvTypography,
-    {
-      component: MuiDialogTitle,
-      variant: "title4",
-      className: cx(
-        classes.root,
-        {
-          [classes.fullScreen]: fullScreen
-        },
-        className
-      ),
-      ...others,
-      children: [
-        icon,
-        children
-      ]
-    }
-  );
-};
-export {
-  HvDialogTitle,
-  staticClasses as dialogTitleClasses
+import { useDialogContext } from "../context.js";
+import { useClasses } from "./Title.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+import MuiDialogTitle from "@mui/material/DialogTitle";
+//#region src/Dialog/Title/Title.tsx
+var HvDialogTitle = (props) => {
+	const { classes: classesProp, className, children, variant, showIcon = variant != null, customIcon, ...others } = useDefaultProps("HvDialogTitle", props);
+	const { classes, cx } = useClasses(classesProp);
+	const { fullScreen } = useDialogContext();
+	const icon = customIcon || showIcon && /* @__PURE__ */ jsx(HvStatusIcon, { variant });
+	return /* @__PURE__ */ jsxs(HvTypography, {
+		component: MuiDialogTitle,
+		variant: "title4",
+		className: cx(classes.root, { [classes.fullScreen]: fullScreen }, className),
+		...others,
+		children: [icon, children]
+	});
 };
+//#endregion
+export { HvDialogTitle };

package/dist/Dialog/Title/Title.styles.js

@@ -1,18 +1,16 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvDialogTitle", {
-  root: {
-    padding: theme.space.sm,
-    paddingRight: 32 + 16,
-    // close icon padding
-    backgroundColor: "inherit",
-    display: "flex",
-    alignItems: "center",
-    gap: theme.space.xs
-  },
-  fullScreen: {}
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/Dialog/Title/Title.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvDialogTitle", {
+	root: {
+		padding: theme.space.sm,
+		paddingRight: 48,
+		backgroundColor: "inherit",
+		display: "flex",
+		alignItems: "center",
+		gap: theme.space.xs
+	},
+	fullScreen: {}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Dialog/context.js

@@ -1,7 +1,6 @@
 import { createContext, useContext } from "react";
-const DialogContext = createContext({ fullScreen: false });
-const useDialogContext = () => useContext(DialogContext);
-export {
-  DialogContext,
-  useDialogContext
-};
+//#region src/Dialog/context.ts
+var DialogContext = createContext({ fullScreen: false });
+var useDialogContext = () => useContext(DialogContext);
+//#endregion
+export { DialogContext, useDialogContext };

package/dist/DotPagination/DotPagination.js

@@ -1,63 +1,48 @@
-import { jsx } from "react/jsx-runtime";
-import { cloneElement } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { HvBaseRadio } from "../BaseRadio/BaseRadio.js";
 import { range } from "../utils/helpers.js";
-import { useClasses } from "./DotPagination.styles.js";
-import { staticClasses } from "./DotPagination.styles.js";
 import { HvRadioGroup } from "../RadioGroup/RadioGroup.js";
-import { HvBaseRadio } from "../BaseRadio/BaseRadio.js";
-const currentStep = /* @__PURE__ */ jsx("div", { style: { fontSize: 8 }, children: /* @__PURE__ */ jsx("div", {}) });
-const otherStep = /* @__PURE__ */ jsx("div", { style: { fontSize: 4 }, children: /* @__PURE__ */ jsx("div", {}) });
-const getSelectorIcons = (radioIcon, radioCheckedIcon, classes) => {
-  return {
-    radio: cloneElement(radioIcon || otherStep, {
-      className: classes?.icon
-    }),
-    radioChecked: cloneElement(radioCheckedIcon || currentStep, {
-      className: classes?.icon
-    })
-  };
-};
-const HvDotPagination = (props) => {
-  const {
-    className,
-    classes: classesProp,
-    unselectedIcon,
-    selectedIcon,
-    pages = 1,
-    page = 0,
-    onPageChange,
-    getItemAriaLabel,
-    ...others
-  } = useDefaultProps("HvDotPagination", props);
-  const { classes, cx } = useClasses(classesProp);
-  const icons = getSelectorIcons(unselectedIcon, selectedIcon, classes);
-  return /* @__PURE__ */ jsx(
-    HvRadioGroup,
-    {
-      className: cx(classes.root, className),
-      classes: {
-        horizontal: classes.horizontal
-      },
-      orientation: "horizontal",
-      ...others,
-      children: range(pages).map((i) => /* @__PURE__ */ jsx(
-        HvBaseRadio,
-        {
-          className: classes.radio,
-          value: i,
-          checked: page === i,
-          onChange: (event) => onPageChange?.(event, i),
-          icon: icons.radio,
-          checkedIcon: icons.radioChecked,
-          inputProps: { "aria-label": getItemAriaLabel?.(i) }
-        },
-        i
-      ))
-    }
-  );
+import { useClasses } from "./DotPagination.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { cloneElement } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/DotPagination/DotPagination.tsx
+var currentStep = /* @__PURE__ */ jsx("div", {
+	style: { fontSize: 8 },
+	children: /* @__PURE__ */ jsx("div", {})
+});
+var otherStep = /* @__PURE__ */ jsx("div", {
+	style: { fontSize: 4 },
+	children: /* @__PURE__ */ jsx("div", {})
+});
+var getSelectorIcons = (radioIcon, radioCheckedIcon, classes) => {
+	return {
+		radio: cloneElement(radioIcon || otherStep, { className: classes?.icon }),
+		radioChecked: cloneElement(radioCheckedIcon || currentStep, { className: classes?.icon })
+	};
 };
-export {
-  HvDotPagination,
-  staticClasses as dotPaginationClasses
+/**
+* Pagination is the process of dividing a document into discrete pages. It relates to how users interact with structured content on a website or application.
+* This component uses Radio Buttons to represent each page.
+*/
+var HvDotPagination = (props) => {
+	const { className, classes: classesProp, unselectedIcon, selectedIcon, pages = 1, page = 0, onPageChange, getItemAriaLabel, ...others } = useDefaultProps("HvDotPagination", props);
+	const { classes, cx } = useClasses(classesProp);
+	const icons = getSelectorIcons(unselectedIcon, selectedIcon, classes);
+	return /* @__PURE__ */ jsx(HvRadioGroup, {
+		className: cx(classes.root, className),
+		classes: { horizontal: classes.horizontal },
+		orientation: "horizontal",
+		...others,
+		children: range(pages).map((i) => /* @__PURE__ */ jsx(HvBaseRadio, {
+			className: classes.radio,
+			value: i,
+			checked: page === i,
+			onChange: (event) => onPageChange?.(event, i),
+			icon: icons.radio,
+			checkedIcon: icons.radioChecked,
+			inputProps: { "aria-label": getItemAriaLabel?.(i) }
+		}, i))
+	});
 };
+//#endregion
+export { HvDotPagination };

package/dist/DotPagination/DotPagination.styles.js

@@ -1,49 +1,46 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { useClasses, staticClasses } = createClasses("HvDotPagination", {
-  root: {
-    display: "flex",
-    justifyContent: "center"
-  },
-  horizontal: {
-    width: "auto",
-    gap: theme.space.xs
-  },
-  radio: {
-    height: 16,
-    width: 16,
-    minWidth: 24,
-    minHeight: 24,
-    color: "inherit",
-    borderRadius: theme.radii.full,
-    ":hover,:focus-within": {
-      backgroundColor: theme.colors.bgHover
-    }
-  },
-  icon: {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    minWidth: 0,
-    width: 16,
-    height: 16,
-    color: "inherit",
-    "&& svg": {
-      color: "inherit",
-      border: "none",
-      width: "unset",
-      height: "unset"
-    },
-    "& > div": {
-      color: theme.colors.text,
-      backgroundColor: "currentcolor",
-      width: "1em",
-      height: "1em",
-      borderRadius: theme.radii.full
-    }
-  }
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/DotPagination/DotPagination.styles.tsx
+var { useClasses, staticClasses } = createClasses("HvDotPagination", {
+	root: {
+		display: "flex",
+		justifyContent: "center"
+	},
+	horizontal: {
+		width: "auto",
+		gap: theme.space.xs
+	},
+	radio: {
+		height: 16,
+		width: 16,
+		minWidth: 24,
+		minHeight: 24,
+		color: "inherit",
+		borderRadius: theme.radii.full,
+		":hover,:focus-within": { backgroundColor: theme.colors.bgHover }
+	},
+	icon: {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		minWidth: 0,
+		width: 16,
+		height: 16,
+		color: "inherit",
+		"&& svg": {
+			color: "inherit",
+			border: "none",
+			width: "unset",
+			height: "unset"
+		},
+		"& > div": {
+			color: theme.colors.text,
+			backgroundColor: "currentcolor",
+			width: "1em",
+			height: "1em",
+			borderRadius: theme.radii.full
+		}
+	}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Drawer/Drawer.js

@@ -1,67 +1,40 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import MuiDrawer from "@mui/material/Drawer";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { HvIcon } from "../icons.js";
-import { useClasses } from "./Drawer.styles.js";
-import { staticClasses } from "./Drawer.styles.js";
 import { HvIconButton } from "../IconButton/IconButton.js";
-const HvDrawer = forwardRef(function HvDrawer2(props, ref) {
-  const {
-    className,
-    classes: classesProp,
-    children,
-    open,
-    onClose,
-    anchor = "right",
-    buttonTitle = "Close",
-    hideBackdrop,
-    disableBackdropClick = false,
-    ...others
-  } = useDefaultProps("HvDrawer", props);
-  const { classes, cx } = useClasses(classesProp);
-  const handleOnClose = (event, reason) => {
-    if (reason === "backdropClick" && disableBackdropClick) return;
-    onClose?.(event, reason);
-  };
-  return /* @__PURE__ */ jsxs(
-    MuiDrawer,
-    {
-      ref,
-      className: cx(classes.root, className),
-      anchor,
-      open,
-      classes: {
-        paper: classes.paper
-      },
-      hideBackdrop,
-      ...!hideBackdrop && {
-        slotProps: {
-          backdrop: {
-            classes: {
-              root: classes.background
-            }
-          }
-        }
-      },
-      onClose: handleOnClose,
-      ...others,
-      children: [
-        onClose && /* @__PURE__ */ jsx(
-          HvIconButton,
-          {
-            className: classes.closeButton,
-            onClick: onClose,
-            title: buttonTitle,
-            children: /* @__PURE__ */ jsx(HvIcon, { name: "Close" })
-          }
-        ),
-        children
-      ]
-    }
-  );
+import { useClasses } from "./Drawer.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import MuiDrawer from "@mui/material/Drawer";
+//#region src/Drawer/Drawer.tsx
+/**
+* The Drawer component provides a foundation to create a sliding pane.
+* It only provides the pane with a close button, the rest of the
+* content can be customized.
+*/
+var HvDrawer = forwardRef(function HvDrawer(props, ref) {
+	const { className, classes: classesProp, children, open, onClose, anchor = "right", buttonTitle = "Close", hideBackdrop, disableBackdropClick = false, ...others } = useDefaultProps("HvDrawer", props);
+	const { classes, cx } = useClasses(classesProp);
+	const handleOnClose = (event, reason) => {
+		if (reason === "backdropClick" && disableBackdropClick) return;
+		onClose?.(event, reason);
+	};
+	return /* @__PURE__ */ jsxs(MuiDrawer, {
+		ref,
+		className: cx(classes.root, className),
+		anchor,
+		open,
+		classes: { paper: classes.paper },
+		hideBackdrop,
+		...!hideBackdrop && { slotProps: { backdrop: { classes: { root: classes.background } } } },
+		onClose: handleOnClose,
+		...others,
+		children: [onClose && /* @__PURE__ */ jsx(HvIconButton, {
+			className: classes.closeButton,
+			onClick: onClose,
+			title: buttonTitle,
+			children: /* @__PURE__ */ jsx(HvIcon, { name: "Close" })
+		}), children]
+	});
 });
-export {
-  HvDrawer,
-  staticClasses as drawerClasses
-};
+//#endregion
+export { HvDrawer };