@wordpress/notices
Version:
State management for notices.
62 lines (61 loc) • 1.95 kB
JavaScript
// packages/notices/src/components/inline-notices/index.tsx
import clsx from "clsx";
import { NoticeList } from "@wordpress/components";
import { useDispatch, useSelect } from "@wordpress/data";
import { store as noticesStore } from "../../store/index.mjs";
import { jsx, jsxs } from "react/jsx-runtime";
function hasRenderableChildren(children) {
return children !== null && children !== void 0 && children !== false && children !== "";
}
function InlineNotices({
children,
className,
pinnedNoticesClassName,
dismissibleNoticesClassName,
context
}) {
const notices = useSelect(
(select) => select(noticesStore).getNotices(context),
[context]
);
const { removeNotice } = useDispatch(noticesStore);
const dismissibleNotices = notices.filter(
({ isDismissible, type }) => isDismissible && type === "default"
);
const nonDismissibleNotices = notices.filter(
({ isDismissible, type }) => !isDismissible && type === "default"
);
const hasPinnedNotices = nonDismissibleNotices.length > 0;
const hasDismissibleNotices = dismissibleNotices.length > 0 || hasRenderableChildren(children);
if (!hasPinnedNotices && !hasDismissibleNotices) {
return null;
}
return /* @__PURE__ */ jsxs("div", { className: clsx("notices-inline-notices-wrapper", className), children: [
hasPinnedNotices && /* @__PURE__ */ jsx(
NoticeList,
{
notices: nonDismissibleNotices,
className: clsx(
"components-notices__pinned",
pinnedNoticesClassName
)
}
),
hasDismissibleNotices && /* @__PURE__ */ jsx(
NoticeList,
{
notices: dismissibleNotices,
className: clsx(
"components-notices__dismissible",
dismissibleNoticesClassName
),
onRemove: (id) => removeNotice(id, context),
children
}
)
] });
}
export {
InlineNotices as default
};
//# sourceMappingURL=index.mjs.map