@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
66 lines (65 loc) • 2.65 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const styles = require("@mui/material/styles");
const useMediaQuery = require("@mui/material/useMediaQuery");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
const EmptyState_styles = require("./EmptyState.styles.cjs");
const Typography = require("../Typography/Typography.cjs");
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
const useMediaQuery__default = /* @__PURE__ */ _interopDefault(useMediaQuery);
const HvEmptyState = React.forwardRef(function HvEmptyState2(props, ref) {
const {
action,
icon,
title,
message,
classes: classesProp,
className,
...others
} = uikitReactUtils.useDefaultProps("HvEmptyState", props);
const { classes, cx, css } = EmptyState_styles.useClasses(classesProp);
const muiTheme = styles.useTheme();
const onlyXs = useMediaQuery__default.default(muiTheme.breakpoints.only("xs"));
const upSm = useMediaQuery__default.default(muiTheme.breakpoints.up("sm"));
const messageOnly = !!(message && !(title || action));
const renderNode = (variant, node, style) => node && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "div", variant, className: style, children: node });
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cx(classes.root, className), ...others, children: /* @__PURE__ */ jsxRuntime.jsxs(
"div",
{
className: cx(
classes.container,
onlyXs && css({
flexDirection: "column",
alignItems: "center",
textAlign: "center"
}),
{
[classes.containerMessageOnly]: messageOnly
},
onlyXs && messageOnly && css({ flexDirection: "row" })
),
children: [
/* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.iconContainer, children: icon }),
/* @__PURE__ */ jsxRuntime.jsxs(
"div",
{
className: cx(
classes.textContainer,
upSm && css({ marginLeft: uikitStyles.theme.space.xs })
),
children: [
renderNode("title4", title, classes.titleContainer),
renderNode("body", message, classes.messageContainer),
renderNode("body", action, classes.actionContainer)
]
}
)
]
}
) });
});
exports.emptyStateClasses = EmptyState_styles.staticClasses;
exports.HvEmptyState = HvEmptyState;