@lobehub/ui/es/base-ui/DatePicker/PickerShell.mjs

Lobe UI is an open-source UI component library for building AIGC web apps

"use client";
import { rootVariants } from "../Input/style.mjs";
import ClearButton from "../Input/ClearButton.mjs";
import { panelStyles } from "../panelStyles.mjs";
import { PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTriggerElement } from "../Popover/atoms.mjs";
import { memo, useRef } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { cx, useThemeMode } from "antd-style";
//#region src/base-ui/DatePicker/PickerShell.tsx
const PickerShell = memo(({ children, className, disabled, icon, onClear, onOpenChange, open, shadow, showClear, size = "middle", style, trigger, variant }) => {
	const { isDarkMode } = useThemeMode();
	const anchorRef = useRef(null);
	const popupRef = useRef(null);
	return /* @__PURE__ */ jsxs("div", {
		"data-disabled": disabled ? "" : void 0,
		ref: anchorRef,
		style,
		className: cx(rootVariants({
			shadow,
			size,
			variant: variant || (isDarkMode ? "filled" : "outlined")
		}), className),
		children: [/* @__PURE__ */ jsxs(PopoverRoot, {
			open,
			onOpenChange: (next) => !disabled && onOpenChange(next),
			children: [/* @__PURE__ */ jsx(PopoverTriggerElement, { children: trigger }), /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsx(PopoverPositioner, {
				anchor: anchorRef,
				placement: "bottomLeft",
				children: /* @__PURE__ */ jsx(PopoverPopup, {
					className: panelStyles.popup,
					ref: popupRef,
					initialFocus: () => popupRef.current?.querySelector("[data-focus-target]") ?? true,
					children
				})
			}) })]
		}), showClear && !disabled ? /* @__PURE__ */ jsx(ClearButton, { onClear }) : icon]
	});
});
PickerShell.displayName = "PickerShell";
//#endregion
export { PickerShell as default };

//# sourceMappingURL=PickerShell.mjs.map