@yamada-ui/popover 0.1.11 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,22 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-body.tsx
6
+ import { ui, forwardRef } from "@yamada-ui/core";
7
+ import { cx } from "@yamada-ui/utils";
8
+ import { jsx } from "react/jsx-runtime";
9
+ var PopoverBody = forwardRef(({ className, ...rest }, ref) => {
10
+ const { styles } = usePopover();
11
+ const css = {
12
+ display: "flex",
13
+ flexDirection: "column",
14
+ alignItems: "flex-start",
15
+ ...styles.body
16
+ };
17
+ return /* @__PURE__ */ jsx(ui.main, { ref, className: cx("ui-popover-body", className), __css: css, ...rest });
18
+ });
19
+
20
+ export {
21
+ PopoverBody
22
+ };
@@ -0,0 +1,117 @@
1
+ import {
2
+ PopoverCloseButton
3
+ } from "./chunk-MRA7DCWU.mjs";
4
+ import {
5
+ usePopover
6
+ } from "./chunk-DQEXAU5O.mjs";
7
+
8
+ // src/popover-content.tsx
9
+ import { ui, forwardRef } from "@yamada-ui/core";
10
+ import { motion } from "@yamada-ui/motion";
11
+ import { scaleFadeProps, slideFadeProps } from "@yamada-ui/transitions";
12
+ import {
13
+ cx,
14
+ findChildren,
15
+ funcAll,
16
+ getValidChildren,
17
+ omitObject
18
+ } from "@yamada-ui/utils";
19
+ import { jsx, jsxs } from "react/jsx-runtime";
20
+ var getPopoverContentProps = (animation = "scale", duration) => {
21
+ const custom = {
22
+ reverse: true,
23
+ duration,
24
+ enter: { visibility: "visible" },
25
+ transitionEnd: { exit: { visibility: "hidden" } }
26
+ };
27
+ switch (animation) {
28
+ case "scale":
29
+ return {
30
+ ...scaleFadeProps,
31
+ custom: { ...custom, scale: 0.95 }
32
+ };
33
+ case "top":
34
+ return {
35
+ ...slideFadeProps,
36
+ custom: { ...custom, offsetX: 0, offsetY: -16 }
37
+ };
38
+ case "right":
39
+ return {
40
+ ...slideFadeProps,
41
+ custom: { ...custom, offsetX: 16, offsetY: 0 }
42
+ };
43
+ case "left":
44
+ return {
45
+ ...slideFadeProps,
46
+ custom: { ...custom, offsetX: -16, offsetY: 0 }
47
+ };
48
+ case "bottom":
49
+ return {
50
+ ...slideFadeProps,
51
+ custom: { ...custom, offsetX: 0, offsetY: 16 }
52
+ };
53
+ }
54
+ };
55
+ var PopoverContent = forwardRef(
56
+ ({ as = "section", className, children, w, width, minW, minWidth, zIndex, __css, ...rest }, ref) => {
57
+ var _a, _b, _c, _d;
58
+ const {
59
+ isOpen,
60
+ closeOnButton,
61
+ getPopperProps,
62
+ getPopoverProps,
63
+ onAnimationComplete,
64
+ animation,
65
+ duration,
66
+ styles
67
+ } = usePopover();
68
+ const validChildren = getValidChildren(children);
69
+ const [customPopoverCloseButton, ...cloneChildren] = findChildren(
70
+ validChildren,
71
+ PopoverCloseButton
72
+ );
73
+ const css = {
74
+ position: "relative",
75
+ w: "100%",
76
+ display: "flex",
77
+ flexDirection: "column",
78
+ outline: 0,
79
+ ...omitObject(__css != null ? __css : styles.container, ["zIndex"])
80
+ };
81
+ w = (_b = w != null ? w : width) != null ? _b : (_a = styles.container.w) != null ? _a : styles.container.width;
82
+ minW = (_d = minW != null ? minW : minWidth) != null ? _d : (_c = styles.container.minW) != null ? _c : styles.container.minWidth;
83
+ zIndex = zIndex != null ? zIndex : styles.container.zIndex;
84
+ return /* @__PURE__ */ jsx(
85
+ ui.div,
86
+ {
87
+ ...getPopperProps({ style: { visibility: isOpen ? "visible" : "hidden" } }),
88
+ className: "ui-popover",
89
+ w,
90
+ minW,
91
+ zIndex,
92
+ children: /* @__PURE__ */ jsxs(
93
+ ui.section,
94
+ {
95
+ as: motion[as],
96
+ className: cx("ui-popover-content", className),
97
+ ...animation !== "none" ? getPopoverContentProps(animation, duration) : {},
98
+ ...getPopoverProps(rest, ref),
99
+ initial: "exit",
100
+ animate: isOpen ? "enter" : "exit",
101
+ exit: "exit",
102
+ onAnimationComplete: funcAll(onAnimationComplete, rest.onAnimationComplete),
103
+ __css: css,
104
+ children: [
105
+ customPopoverCloseButton != null ? customPopoverCloseButton : closeOnButton ? /* @__PURE__ */ jsx(PopoverCloseButton, {}) : null,
106
+ cloneChildren
107
+ ]
108
+ }
109
+ )
110
+ }
111
+ );
112
+ }
113
+ );
114
+
115
+ export {
116
+ PopoverContent
117
+ };
@@ -0,0 +1,36 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-close-button.tsx
6
+ import { CloseButton } from "@yamada-ui/close-button";
7
+ import { forwardRef } from "@yamada-ui/core";
8
+ import { cx, handlerAll } from "@yamada-ui/utils";
9
+ import { jsx } from "react/jsx-runtime";
10
+ var PopoverCloseButton = forwardRef(
11
+ ({ onClick, ...rest }, ref) => {
12
+ const { styles, onClose } = usePopover();
13
+ const css = {
14
+ position: "absolute",
15
+ ...styles.closeButton
16
+ };
17
+ return /* @__PURE__ */ jsx(
18
+ CloseButton,
19
+ {
20
+ ref,
21
+ className: cx("ui-popover-close-button"),
22
+ __css: css,
23
+ onClick: handlerAll(onClick, (event) => {
24
+ event.stopPropagation();
25
+ onClose == null ? void 0 : onClose();
26
+ }),
27
+ size: "sm",
28
+ ...rest
29
+ }
30
+ );
31
+ }
32
+ );
33
+
34
+ export {
35
+ PopoverCloseButton
36
+ };
@@ -0,0 +1,24 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-footer.tsx
6
+ import { ui, forwardRef } from "@yamada-ui/core";
7
+ import { cx } from "@yamada-ui/utils";
8
+ import { jsx } from "react/jsx-runtime";
9
+ var PopoverFooter = forwardRef(
10
+ ({ className, ...rest }, ref) => {
11
+ const { styles } = usePopover();
12
+ const css = {
13
+ display: "flex",
14
+ alignItems: "center",
15
+ justifyContent: "flex-start",
16
+ ...styles.footer
17
+ };
18
+ return /* @__PURE__ */ jsx(ui.footer, { ref, className: cx("ui-popover-footer", className), __css: css, ...rest });
19
+ }
20
+ );
21
+
22
+ export {
23
+ PopoverFooter
24
+ };
@@ -0,0 +1,15 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-trigger.tsx
6
+ import { Children, cloneElement } from "react";
7
+ var PopoverTrigger = ({ children }) => {
8
+ const child = Children.only(children);
9
+ const { getTriggerProps } = usePopover();
10
+ return cloneElement(child, getTriggerProps(child.props, child.ref));
11
+ };
12
+
13
+ export {
14
+ PopoverTrigger
15
+ };
@@ -0,0 +1,15 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-anchor.tsx
6
+ import { Children, cloneElement } from "react";
7
+ var PopoverAnchor = ({ children }) => {
8
+ const child = Children.only(children);
9
+ const { getAnchorProps } = usePopover();
10
+ return cloneElement(child, getAnchorProps(child.props, child.ref));
11
+ };
12
+
13
+ export {
14
+ PopoverAnchor
15
+ };
@@ -0,0 +1,24 @@
1
+ import {
2
+ usePopover
3
+ } from "./chunk-DQEXAU5O.mjs";
4
+
5
+ // src/popover-header.tsx
6
+ import { ui, forwardRef } from "@yamada-ui/core";
7
+ import { cx } from "@yamada-ui/utils";
8
+ import { jsx } from "react/jsx-runtime";
9
+ var PopoverHeader = forwardRef(
10
+ ({ className, ...rest }, ref) => {
11
+ const { styles } = usePopover();
12
+ const css = {
13
+ display: "flex",
14
+ alignItems: "center",
15
+ justifyContent: "flex-start",
16
+ ...styles.header
17
+ };
18
+ return /* @__PURE__ */ jsx(ui.header, { ref, className: cx("ui-popover-header", className), __css: css, ...rest });
19
+ }
20
+ );
21
+
22
+ export {
23
+ PopoverHeader
24
+ };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { Popover, PopoverProps, usePopover } from './popover.js';
1
+ export { Popover, PopoverProps } from './popover.js';
2
2
  export { PopoverTrigger } from './popover-trigger.js';
3
3
  export { PopoverAnchor } from './popover-anchor.js';
4
4
  export { PopoverCloseButton, PopoverCloseButtonProps } from './popover-close-button.js';
package/dist/index.js CHANGED
@@ -27,8 +27,7 @@ __export(src_exports, {
27
27
  PopoverContent: () => PopoverContent,
28
28
  PopoverFooter: () => PopoverFooter,
29
29
  PopoverHeader: () => PopoverHeader,
30
- PopoverTrigger: () => PopoverTrigger,
31
- usePopover: () => usePopover
30
+ PopoverTrigger: () => PopoverTrigger
32
31
  });
33
32
  module.exports = __toCommonJS(src_exports);
34
33
 
@@ -453,6 +452,5 @@ var PopoverFooter = (0, import_core6.forwardRef)(
453
452
  PopoverContent,
454
453
  PopoverFooter,
455
454
  PopoverHeader,
456
- PopoverTrigger,
457
- usePopover
455
+ PopoverTrigger
458
456
  });
package/dist/index.mjs CHANGED
@@ -1,15 +1,26 @@
1
1
  import {
2
- PopoverAnchor,
3
- PopoverBody,
4
- PopoverCloseButton,
5
- PopoverContent,
6
- PopoverFooter,
7
- PopoverHeader,
2
+ PopoverContent
3
+ } from "./chunk-LPYOVPSE.mjs";
4
+ import {
5
+ PopoverAnchor
6
+ } from "./chunk-TUH3DDWH.mjs";
7
+ import {
8
+ PopoverBody
9
+ } from "./chunk-2NALYFOE.mjs";
10
+ import {
11
+ PopoverCloseButton
12
+ } from "./chunk-MRA7DCWU.mjs";
13
+ import {
14
+ PopoverFooter
15
+ } from "./chunk-PGWQGH7T.mjs";
16
+ import {
17
+ PopoverHeader
18
+ } from "./chunk-YLDMHQCU.mjs";
19
+ import {
8
20
  PopoverTrigger
9
- } from "./chunk-O75PU3DP.mjs";
21
+ } from "./chunk-TEP6TGUO.mjs";
10
22
  import {
11
- Popover,
12
- usePopover
23
+ Popover
13
24
  } from "./chunk-DQEXAU5O.mjs";
14
25
  export {
15
26
  Popover,
@@ -19,6 +30,5 @@ export {
19
30
  PopoverContent,
20
31
  PopoverFooter,
21
32
  PopoverHeader,
22
- PopoverTrigger,
23
- usePopover
33
+ PopoverTrigger
24
34
  };
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverAnchor
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-TUH3DDWH.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverAnchor
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverBody
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-2NALYFOE.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverBody
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverCloseButton
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-MRA7DCWU.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverCloseButton
@@ -1,6 +1,12 @@
1
1
  import {
2
2
  PopoverContent
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-LPYOVPSE.mjs";
4
+ import "./chunk-TUH3DDWH.mjs";
5
+ import "./chunk-2NALYFOE.mjs";
6
+ import "./chunk-MRA7DCWU.mjs";
7
+ import "./chunk-PGWQGH7T.mjs";
8
+ import "./chunk-YLDMHQCU.mjs";
9
+ import "./chunk-TEP6TGUO.mjs";
4
10
  import "./chunk-DQEXAU5O.mjs";
5
11
  export {
6
12
  PopoverContent
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverFooter
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-PGWQGH7T.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverFooter
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverHeader
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-YLDMHQCU.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverHeader
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PopoverTrigger
3
- } from "./chunk-O75PU3DP.mjs";
3
+ } from "./chunk-TEP6TGUO.mjs";
4
4
  import "./chunk-DQEXAU5O.mjs";
5
5
  export {
6
6
  PopoverTrigger
package/dist/popover.d.ts CHANGED
@@ -3,29 +3,106 @@ import { MotionTransitionProperties } from '@yamada-ui/motion';
3
3
  import { LazyMode } from '@yamada-ui/use-disclosure';
4
4
  import { UsePopperProps } from '@yamada-ui/use-popper';
5
5
  import { PropGetter } from '@yamada-ui/utils';
6
- import { PropsWithChildren, FC } from 'react';
6
+ import { PropsWithChildren, FC, RefObject } from 'react';
7
7
 
8
- type Trigger = 'click' | 'hover' | 'never';
9
- type Animation = 'scale' | 'top' | 'right' | 'left' | 'bottom' | 'none';
10
8
  type PopoverOptions = {
9
+ /**
10
+ * If `true`, the popover will be opened.
11
+ */
11
12
  isOpen?: boolean;
13
+ /**
14
+ * If `true`, the popover will be initially opened.
15
+ */
12
16
  defaultIsOpen?: boolean;
17
+ /**
18
+ * Callback fired when the popover opens.
19
+ */
13
20
  onOpen?: () => void;
21
+ /**
22
+ * Callback fired when the popover closes.
23
+ */
14
24
  onClose?: () => void;
15
- initialFocusRef?: React.RefObject<{
25
+ /**
26
+ * The `ref` of the element that should receive focus when the popover opens.
27
+ */
28
+ initialFocusRef?: RefObject<{
16
29
  focus(): void;
17
30
  }>;
31
+ /**
32
+ * If `true`, focus will be returned to the element that triggers the popover when it closes.
33
+ *
34
+ * @default true
35
+ */
18
36
  restoreFocus?: boolean;
37
+ /**
38
+ * If `true`, focus will be transferred to the first interactive element when the popover opens.
39
+ *
40
+ * @default true
41
+ */
19
42
  autoFocus?: boolean;
43
+ /**
44
+ * If `true`, the popover will close when you blur out it by clicking outside or tabbing out.
45
+ *
46
+ * @default true
47
+ */
20
48
  closeOnBlur?: boolean;
49
+ /**
50
+ * If `true`, the popover will close when you hit the `Esc` key.
51
+ *
52
+ * @default true
53
+ */
21
54
  closeOnEsc?: boolean;
55
+ /**
56
+ * If `true`, display the popover close button.
57
+ *
58
+ * @default true
59
+ */
22
60
  closeOnButton?: boolean;
23
- trigger?: Trigger;
61
+ /**
62
+ * The interaction that triggers the popover.
63
+ *
64
+ * - `hover`: means the popover will open when you hover with mouse or focus with keyboard on the popover trigger.
65
+ * - `click`: means the popover will open on click or press `Enter` to `Space` on keyboard.
66
+ *
67
+ * @default 'click'
68
+ */
69
+ trigger?: 'click' | 'hover' | 'never';
70
+ /**
71
+ * The number of delay time to open.
72
+ *
73
+ * @default 200
74
+ */
24
75
  openDelay?: number;
76
+ /**
77
+ * The number of delay time to close.
78
+ *
79
+ * @default 200
80
+ */
25
81
  closeDelay?: number;
82
+ /**
83
+ * If `true`, the PopoverContent rendering will be deferred until the popover is open.
84
+ *
85
+ * @default false
86
+ */
26
87
  isLazy?: boolean;
88
+ /**
89
+ * The lazy behavior of popover's content when not visible. Only works when `isLazy={true}`
90
+ *
91
+ * - `unmount`: The popover's content is always unmounted when not open.
92
+ * - `keepMounted`: The popover's content initially unmounted, but stays mounted when popover is open.
93
+ *
94
+ * @default 'unmount'
95
+ */
27
96
  lazyBehavior?: LazyMode;
28
- animation?: Animation;
97
+ /**
98
+ * The animation of the popover.
99
+ *
100
+ * @default 'scale'
101
+ */
102
+ animation?: 'scale' | 'top' | 'right' | 'left' | 'bottom' | 'none';
103
+ /**
104
+ * The animation duration.
105
+ */
29
106
  duration?: MotionTransitionProperties['duration'];
30
107
  };
31
108
  type PopoverProps = ThemeProps<'Popover'> & Omit<UsePopperProps, 'enabled'> & PropsWithChildren<PopoverOptions>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/popover",
3
- "version": "0.1.11",
3
+ "version": "0.2.1",
4
4
  "description": "Yamada UI popover component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -35,15 +35,15 @@
35
35
  "url": "https://github.com/hirotomoyamada/yamada-ui/issues"
36
36
  },
37
37
  "dependencies": {
38
- "@yamada-ui/core": "0.3.0",
38
+ "@yamada-ui/core": "0.4.0",
39
39
  "@yamada-ui/utils": "0.1.1",
40
- "@yamada-ui/close-button": "0.1.11",
41
- "@yamada-ui/transitions": "0.1.11",
42
- "@yamada-ui/motion": "0.1.11",
43
- "@yamada-ui/use-popper": "0.1.11",
40
+ "@yamada-ui/close-button": "0.2.1",
41
+ "@yamada-ui/transitions": "0.2.1",
42
+ "@yamada-ui/motion": "0.2.1",
43
+ "@yamada-ui/use-popper": "0.2.1",
44
44
  "@yamada-ui/use-disclosure": "0.1.1",
45
45
  "@yamada-ui/use-focus": "0.1.1",
46
- "@yamada-ui/use-animation": "0.1.11"
46
+ "@yamada-ui/use-animation": "0.1.13"
47
47
  },
48
48
  "devDependencies": {
49
49
  "react": "^18.0.0",
@@ -77,6 +77,6 @@
77
77
  "build:fast": "tsup src",
78
78
  "clean": "rimraf dist .turbo",
79
79
  "typecheck": "tsc --noEmit",
80
- "gen:types": "tsx ../../../scripts/generate-types"
80
+ "gen:docs": "tsx ../../../scripts/generate-docs"
81
81
  }
82
82
  }
@@ -1,216 +0,0 @@
1
- import {
2
- usePopover
3
- } from "./chunk-DQEXAU5O.mjs";
4
-
5
- // src/popover-trigger.tsx
6
- import { Children as Children2, cloneElement as cloneElement2 } from "react";
7
-
8
- // src/popover-anchor.tsx
9
- import { Children, cloneElement } from "react";
10
- var PopoverAnchor = ({ children }) => {
11
- const child = Children.only(children);
12
- const { getAnchorProps } = usePopover();
13
- return cloneElement(child, getAnchorProps(child.props, child.ref));
14
- };
15
-
16
- // src/popover-close-button.tsx
17
- import { CloseButton } from "@yamada-ui/close-button";
18
- import { forwardRef } from "@yamada-ui/core";
19
- import { cx, handlerAll } from "@yamada-ui/utils";
20
- import { jsx } from "react/jsx-runtime";
21
- var PopoverCloseButton = forwardRef(
22
- ({ onClick, ...rest }, ref) => {
23
- const { styles, onClose } = usePopover();
24
- const css = {
25
- position: "absolute",
26
- ...styles.closeButton
27
- };
28
- return /* @__PURE__ */ jsx(
29
- CloseButton,
30
- {
31
- ref,
32
- className: cx("ui-popover-close-button"),
33
- __css: css,
34
- onClick: handlerAll(onClick, (event) => {
35
- event.stopPropagation();
36
- onClose == null ? void 0 : onClose();
37
- }),
38
- size: "sm",
39
- ...rest
40
- }
41
- );
42
- }
43
- );
44
-
45
- // src/popover-content.tsx
46
- import { ui, forwardRef as forwardRef2 } from "@yamada-ui/core";
47
- import { motion } from "@yamada-ui/motion";
48
- import { scaleFadeProps, slideFadeProps } from "@yamada-ui/transitions";
49
- import {
50
- cx as cx2,
51
- findChildren,
52
- funcAll,
53
- getValidChildren,
54
- omitObject
55
- } from "@yamada-ui/utils";
56
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
57
- var getPopoverContentProps = (animation = "scale", duration) => {
58
- const custom = {
59
- reverse: true,
60
- duration,
61
- enter: { visibility: "visible" },
62
- transitionEnd: { exit: { visibility: "hidden" } }
63
- };
64
- switch (animation) {
65
- case "scale":
66
- return {
67
- ...scaleFadeProps,
68
- custom: { ...custom, scale: 0.95 }
69
- };
70
- case "top":
71
- return {
72
- ...slideFadeProps,
73
- custom: { ...custom, offsetX: 0, offsetY: -16 }
74
- };
75
- case "right":
76
- return {
77
- ...slideFadeProps,
78
- custom: { ...custom, offsetX: 16, offsetY: 0 }
79
- };
80
- case "left":
81
- return {
82
- ...slideFadeProps,
83
- custom: { ...custom, offsetX: -16, offsetY: 0 }
84
- };
85
- case "bottom":
86
- return {
87
- ...slideFadeProps,
88
- custom: { ...custom, offsetX: 0, offsetY: 16 }
89
- };
90
- }
91
- };
92
- var PopoverContent = forwardRef2(
93
- ({ as = "section", className, children, w, width, minW, minWidth, zIndex, __css, ...rest }, ref) => {
94
- var _a, _b, _c, _d;
95
- const {
96
- isOpen,
97
- closeOnButton,
98
- getPopperProps,
99
- getPopoverProps,
100
- onAnimationComplete,
101
- animation,
102
- duration,
103
- styles
104
- } = usePopover();
105
- const validChildren = getValidChildren(children);
106
- const [customPopoverCloseButton, ...cloneChildren] = findChildren(
107
- validChildren,
108
- PopoverCloseButton
109
- );
110
- const css = {
111
- position: "relative",
112
- w: "100%",
113
- display: "flex",
114
- flexDirection: "column",
115
- outline: 0,
116
- ...omitObject(__css != null ? __css : styles.container, ["zIndex"])
117
- };
118
- w = (_b = w != null ? w : width) != null ? _b : (_a = styles.container.w) != null ? _a : styles.container.width;
119
- minW = (_d = minW != null ? minW : minWidth) != null ? _d : (_c = styles.container.minW) != null ? _c : styles.container.minWidth;
120
- zIndex = zIndex != null ? zIndex : styles.container.zIndex;
121
- return /* @__PURE__ */ jsx2(
122
- ui.div,
123
- {
124
- ...getPopperProps({ style: { visibility: isOpen ? "visible" : "hidden" } }),
125
- className: "ui-popover",
126
- w,
127
- minW,
128
- zIndex,
129
- children: /* @__PURE__ */ jsxs(
130
- ui.section,
131
- {
132
- as: motion[as],
133
- className: cx2("ui-popover-content", className),
134
- ...animation !== "none" ? getPopoverContentProps(animation, duration) : {},
135
- ...getPopoverProps(rest, ref),
136
- initial: "exit",
137
- animate: isOpen ? "enter" : "exit",
138
- exit: "exit",
139
- onAnimationComplete: funcAll(onAnimationComplete, rest.onAnimationComplete),
140
- __css: css,
141
- children: [
142
- customPopoverCloseButton != null ? customPopoverCloseButton : closeOnButton ? /* @__PURE__ */ jsx2(PopoverCloseButton, {}) : null,
143
- cloneChildren
144
- ]
145
- }
146
- )
147
- }
148
- );
149
- }
150
- );
151
-
152
- // src/popover-header.tsx
153
- import { ui as ui2, forwardRef as forwardRef3 } from "@yamada-ui/core";
154
- import { cx as cx3 } from "@yamada-ui/utils";
155
- import { jsx as jsx3 } from "react/jsx-runtime";
156
- var PopoverHeader = forwardRef3(
157
- ({ className, ...rest }, ref) => {
158
- const { styles } = usePopover();
159
- const css = {
160
- display: "flex",
161
- alignItems: "center",
162
- justifyContent: "flex-start",
163
- ...styles.header
164
- };
165
- return /* @__PURE__ */ jsx3(ui2.header, { ref, className: cx3("ui-popover-header", className), __css: css, ...rest });
166
- }
167
- );
168
-
169
- // src/popover-body.tsx
170
- import { ui as ui3, forwardRef as forwardRef4 } from "@yamada-ui/core";
171
- import { cx as cx4 } from "@yamada-ui/utils";
172
- import { jsx as jsx4 } from "react/jsx-runtime";
173
- var PopoverBody = forwardRef4(({ className, ...rest }, ref) => {
174
- const { styles } = usePopover();
175
- const css = {
176
- display: "flex",
177
- flexDirection: "column",
178
- alignItems: "flex-start",
179
- ...styles.body
180
- };
181
- return /* @__PURE__ */ jsx4(ui3.main, { ref, className: cx4("ui-popover-body", className), __css: css, ...rest });
182
- });
183
-
184
- // src/popover-footer.tsx
185
- import { ui as ui4, forwardRef as forwardRef5 } from "@yamada-ui/core";
186
- import { cx as cx5 } from "@yamada-ui/utils";
187
- import { jsx as jsx5 } from "react/jsx-runtime";
188
- var PopoverFooter = forwardRef5(
189
- ({ className, ...rest }, ref) => {
190
- const { styles } = usePopover();
191
- const css = {
192
- display: "flex",
193
- alignItems: "center",
194
- justifyContent: "flex-start",
195
- ...styles.footer
196
- };
197
- return /* @__PURE__ */ jsx5(ui4.footer, { ref, className: cx5("ui-popover-footer", className), __css: css, ...rest });
198
- }
199
- );
200
-
201
- // src/popover-trigger.tsx
202
- var PopoverTrigger = ({ children }) => {
203
- const child = Children2.only(children);
204
- const { getTriggerProps } = usePopover();
205
- return cloneElement2(child, getTriggerProps(child.props, child.ref));
206
- };
207
-
208
- export {
209
- PopoverTrigger,
210
- PopoverAnchor,
211
- PopoverCloseButton,
212
- PopoverContent,
213
- PopoverHeader,
214
- PopoverBody,
215
- PopoverFooter
216
- };