@yamada-ui/close-button 1.0.42-next-20241005220055 → 1.0.42-next-20241008193728

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.
@@ -2,10 +2,10 @@
2
2
 
3
3
  // src/close-button.tsx
4
4
  import {
5
- ui,
6
5
  forwardRef,
7
- useComponentStyle,
8
- omitThemeProps
6
+ omitThemeProps,
7
+ ui,
8
+ useComponentStyle
9
9
  } from "@yamada-ui/core";
10
10
  import { CloseIcon } from "@yamada-ui/icon";
11
11
  import { Ripple, useRipple } from "@yamada-ui/ripple";
@@ -17,10 +17,10 @@ var CloseButton = forwardRef(
17
17
  const {
18
18
  className,
19
19
  children,
20
+ disableRipple,
20
21
  isDisabled,
21
22
  isRounded,
22
23
  __css,
23
- disableRipple,
24
24
  ...rest
25
25
  } = omitThemeProps(mergedProps);
26
26
  const { onPointerDown, ...rippleProps } = useRipple({
@@ -28,13 +28,13 @@ var CloseButton = forwardRef(
28
28
  isDisabled: disableRipple || isDisabled
29
29
  });
30
30
  const css = {
31
- position: "relative",
32
- overflow: "hidden",
33
- outline: 0,
34
- display: "flex",
35
- justifyContent: "center",
36
31
  alignItems: "center",
32
+ display: "flex",
37
33
  flexShrink: 0,
34
+ justifyContent: "center",
35
+ outline: 0,
36
+ overflow: "hidden",
37
+ position: "relative",
38
38
  ...styles,
39
39
  ...__css,
40
40
  ...isRounded ? { borderRadius: "fallback(full, 9999px)" } : {}
@@ -44,14 +44,14 @@ var CloseButton = forwardRef(
44
44
  {
45
45
  ref,
46
46
  type: "button",
47
- "aria-label": "Close",
48
47
  className: cx("ui-close-button", className),
48
+ "aria-label": "Close",
49
49
  disabled: isDisabled,
50
50
  __css: css,
51
51
  ...rest,
52
52
  onPointerDown,
53
53
  children: [
54
- children || /* @__PURE__ */ jsx(CloseIcon, { width: "1em", height: "1em" }),
54
+ children || /* @__PURE__ */ jsx(CloseIcon, { height: "1em", width: "1em" }),
55
55
  /* @__PURE__ */ jsx(Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
56
56
  ]
57
57
  }
@@ -64,4 +64,4 @@ CloseButton.__ui__ = "CloseButton";
64
64
  export {
65
65
  CloseButton
66
66
  };
67
- //# sourceMappingURL=chunk-KN54MZIG.mjs.map
67
+ //# sourceMappingURL=chunk-IUGYU5VA.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/close-button.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, CSSUIObject } from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n isDisabled,\n isRounded,\n __css,\n disableRipple,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n position: \"relative\",\n overflow: \"hidden\",\n outline: 0,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flexShrink: 0,\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n aria-label=\"Close\"\n className={cx(\"ui-close-button\", className)}\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon width=\"1em\" height=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB;AAC1B,SAAS,QAAQ,iBAAiB;AAClC,SAAS,UAAU;AAiEb,SAUe,KAVf;AA/BC,IAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,IAAI,kBAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,IAAI,UAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,UAAU;AAAA,MACV,SAAS;AAAA,MACT,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,cAAW;AAAA,QACX,WAAW,GAAG,mBAAmB,SAAS;AAAA,QAC1C,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,oBAAC,aAAU,OAAM,OAAM,QAAO,OAAM;AAAA,UAEjD,oBAAC,UAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
1
+ {"version":3,"sources":["../src/close-button.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentStyle,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n disableRipple,\n isDisabled,\n isRounded,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n flexShrink: 0,\n justifyContent: \"center\",\n outline: 0,\n overflow: \"hidden\",\n position: \"relative\",\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n className={cx(\"ui-close-button\", className)}\n aria-label=\"Close\"\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon height=\"1em\" width=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB;AAC1B,SAAS,QAAQ,iBAAiB;AAClC,SAAS,UAAU;AAiEb,SAUe,KAVf;AA/BC,IAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,IAAI,kBAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,IAAI,UAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,WAAW,GAAG,mBAAmB,SAAS;AAAA,QAC1C,cAAW;AAAA,QACX,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,oBAAC,aAAU,QAAO,OAAM,OAAM,OAAM;AAAA,UAEjD,oBAAC,UAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
@@ -3,17 +3,17 @@ import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
3
 
4
4
  interface CloseButtonOptions {
5
5
  /**
6
- * If `true`, the button is disabled.
6
+ * If `true`, disable ripple effects when pressing a element.
7
7
  *
8
8
  * @default false
9
9
  */
10
- isDisabled?: boolean;
10
+ disableRipple?: boolean;
11
11
  /**
12
- * If `true`, disable ripple effects when pressing a element.
12
+ * If `true`, the button is disabled.
13
13
  *
14
14
  * @default false
15
15
  */
16
- disableRipple?: boolean;
16
+ isDisabled?: boolean;
17
17
  /**
18
18
  * If true, the button is full rounded.
19
19
  *
@@ -3,17 +3,17 @@ import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
3
 
4
4
  interface CloseButtonOptions {
5
5
  /**
6
- * If `true`, the button is disabled.
6
+ * If `true`, disable ripple effects when pressing a element.
7
7
  *
8
8
  * @default false
9
9
  */
10
- isDisabled?: boolean;
10
+ disableRipple?: boolean;
11
11
  /**
12
- * If `true`, disable ripple effects when pressing a element.
12
+ * If `true`, the button is disabled.
13
13
  *
14
14
  * @default false
15
15
  */
16
- disableRipple?: boolean;
16
+ isDisabled?: boolean;
17
17
  /**
18
18
  * If true, the button is full rounded.
19
19
  *
@@ -35,10 +35,10 @@ var CloseButton = (0, import_core.forwardRef)(
35
35
  const {
36
36
  className,
37
37
  children,
38
+ disableRipple,
38
39
  isDisabled,
39
40
  isRounded,
40
41
  __css,
41
- disableRipple,
42
42
  ...rest
43
43
  } = (0, import_core.omitThemeProps)(mergedProps);
44
44
  const { onPointerDown, ...rippleProps } = (0, import_ripple.useRipple)({
@@ -46,13 +46,13 @@ var CloseButton = (0, import_core.forwardRef)(
46
46
  isDisabled: disableRipple || isDisabled
47
47
  });
48
48
  const css = {
49
- position: "relative",
50
- overflow: "hidden",
51
- outline: 0,
52
- display: "flex",
53
- justifyContent: "center",
54
49
  alignItems: "center",
50
+ display: "flex",
55
51
  flexShrink: 0,
52
+ justifyContent: "center",
53
+ outline: 0,
54
+ overflow: "hidden",
55
+ position: "relative",
56
56
  ...styles,
57
57
  ...__css,
58
58
  ...isRounded ? { borderRadius: "fallback(full, 9999px)" } : {}
@@ -62,14 +62,14 @@ var CloseButton = (0, import_core.forwardRef)(
62
62
  {
63
63
  ref,
64
64
  type: "button",
65
- "aria-label": "Close",
66
65
  className: (0, import_utils.cx)("ui-close-button", className),
66
+ "aria-label": "Close",
67
67
  disabled: isDisabled,
68
68
  __css: css,
69
69
  ...rest,
70
70
  onPointerDown,
71
71
  children: [
72
- children || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.CloseIcon, { width: "1em", height: "1em" }),
72
+ children || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.CloseIcon, { height: "1em", width: "1em" }),
73
73
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ripple.Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
74
74
  ]
75
75
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/close-button.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps, CSSUIObject } from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n isDisabled,\n isRounded,\n __css,\n disableRipple,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n position: \"relative\",\n overflow: \"hidden\",\n outline: 0,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flexShrink: 0,\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n aria-label=\"Close\"\n className={cx(\"ui-close-button\", className)}\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon width=\"1em\" height=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAKO;AACP,kBAA0B;AAC1B,oBAAkC;AAClC,mBAAmB;AAiEb;AA/BC,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,+BAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,QAAI,yBAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,UAAU;AAAA,MACV,SAAS;AAAA,MACT,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,cAAW;AAAA,QACX,eAAW,iBAAG,mBAAmB,SAAS;AAAA,QAC1C,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,4CAAC,yBAAU,OAAM,OAAM,QAAO,OAAM;AAAA,UAEjD,4CAAC,wBAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
1
+ {"version":3,"sources":["../src/close-button.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentStyle,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n disableRipple,\n isDisabled,\n isRounded,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n flexShrink: 0,\n justifyContent: \"center\",\n outline: 0,\n overflow: \"hidden\",\n position: \"relative\",\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n className={cx(\"ui-close-button\", className)}\n aria-label=\"Close\"\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon height=\"1em\" width=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAKO;AACP,kBAA0B;AAC1B,oBAAkC;AAClC,mBAAmB;AAiEb;AA/BC,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,+BAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,QAAI,yBAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAW,iBAAG,mBAAmB,SAAS;AAAA,QAC1C,cAAW;AAAA,QACX,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,4CAAC,yBAAU,QAAO,OAAM,OAAM,OAAM;AAAA,UAEjD,4CAAC,wBAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  CloseButton
4
- } from "./chunk-KN54MZIG.mjs";
4
+ } from "./chunk-IUGYU5VA.mjs";
5
5
  export {
6
6
  CloseButton
7
7
  };
package/dist/index.js CHANGED
@@ -37,10 +37,10 @@ var CloseButton = (0, import_core.forwardRef)(
37
37
  const {
38
38
  className,
39
39
  children,
40
+ disableRipple,
40
41
  isDisabled,
41
42
  isRounded,
42
43
  __css,
43
- disableRipple,
44
44
  ...rest
45
45
  } = (0, import_core.omitThemeProps)(mergedProps);
46
46
  const { onPointerDown, ...rippleProps } = (0, import_ripple.useRipple)({
@@ -48,13 +48,13 @@ var CloseButton = (0, import_core.forwardRef)(
48
48
  isDisabled: disableRipple || isDisabled
49
49
  });
50
50
  const css = {
51
- position: "relative",
52
- overflow: "hidden",
53
- outline: 0,
54
- display: "flex",
55
- justifyContent: "center",
56
51
  alignItems: "center",
52
+ display: "flex",
57
53
  flexShrink: 0,
54
+ justifyContent: "center",
55
+ outline: 0,
56
+ overflow: "hidden",
57
+ position: "relative",
58
58
  ...styles,
59
59
  ...__css,
60
60
  ...isRounded ? { borderRadius: "fallback(full, 9999px)" } : {}
@@ -64,14 +64,14 @@ var CloseButton = (0, import_core.forwardRef)(
64
64
  {
65
65
  ref,
66
66
  type: "button",
67
- "aria-label": "Close",
68
67
  className: (0, import_utils.cx)("ui-close-button", className),
68
+ "aria-label": "Close",
69
69
  disabled: isDisabled,
70
70
  __css: css,
71
71
  ...rest,
72
72
  onPointerDown,
73
73
  children: [
74
- children || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.CloseIcon, { width: "1em", height: "1em" }),
74
+ children || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.CloseIcon, { height: "1em", width: "1em" }),
75
75
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ripple.Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
76
76
  ]
77
77
  }
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/close-button.tsx"],"sourcesContent":["export { CloseButton } from \"./close-button\"\nexport type { CloseButtonProps } from \"./close-button\"\n","import type { HTMLUIProps, ThemeProps, CSSUIObject } from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n isDisabled,\n isRounded,\n __css,\n disableRipple,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n position: \"relative\",\n overflow: \"hidden\",\n outline: 0,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flexShrink: 0,\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n aria-label=\"Close\"\n className={cx(\"ui-close-button\", className)}\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon width=\"1em\" height=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,kBAKO;AACP,kBAA0B;AAC1B,oBAAkC;AAClC,mBAAmB;AAiEb;AA/BC,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,+BAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,QAAI,yBAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,UAAU;AAAA,MACV,SAAS;AAAA,MACT,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,cAAW;AAAA,QACX,eAAW,iBAAG,mBAAmB,SAAS;AAAA,QAC1C,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,4CAAC,yBAAU,OAAM,OAAM,QAAO,OAAM;AAAA,UAEjD,4CAAC,wBAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/close-button.tsx"],"sourcesContent":["export { CloseButton } from \"./close-button\"\nexport type { CloseButtonProps } from \"./close-button\"\n","import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentStyle,\n} from \"@yamada-ui/core\"\nimport { CloseIcon } from \"@yamada-ui/icon\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx } from \"@yamada-ui/utils\"\n\ninterface CloseButtonOptions {\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If true, the button is full rounded.\n *\n * @default false\n */\n isRounded?: boolean\n}\n\nexport interface CloseButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"CloseButton\">,\n CloseButtonOptions {}\n\n/**\n * `CloseButton` is a component used primarily to trigger the close functionality of a component.\n *\n * @see Docs https://yamada-ui.com/components/other/close-button\n */\n\nexport const CloseButton = forwardRef<CloseButtonProps, \"button\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentStyle(\"CloseButton\", props)\n const {\n className,\n children,\n disableRipple,\n isDisabled,\n isRounded,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || isDisabled,\n })\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n flexShrink: 0,\n justifyContent: \"center\",\n outline: 0,\n overflow: \"hidden\",\n position: \"relative\",\n ...styles,\n ...__css,\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n\n return (\n <ui.button\n ref={ref}\n type=\"button\"\n className={cx(\"ui-close-button\", className)}\n aria-label=\"Close\"\n disabled={isDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {children || <CloseIcon height=\"1em\" width=\"1em\" />}\n\n <Ripple isDisabled={disableRipple || isDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nCloseButton.displayName = \"CloseButton\"\nCloseButton.__ui__ = \"CloseButton\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,kBAKO;AACP,kBAA0B;AAC1B,oBAAkC;AAClC,mBAAmB;AAiEb;AA/BC,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,+BAAkB,eAAe,KAAK;AACpE,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM,EAAE,eAAe,GAAG,YAAY,QAAI,yBAAU;AAAA,MAClD,GAAG;AAAA,MACH,YAAY,iBAAiB;AAAA,IAC/B,CAAC;AAED,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,cAAc,yBAAyB,IAAI,CAAC;AAAA,IAChE;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAW,iBAAG,mBAAmB,SAAS;AAAA,QAC1C,cAAW;AAAA,QACX,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,sBAAY,4CAAC,yBAAU,QAAO,OAAM,OAAM,OAAM;AAAA,UAEjD,4CAAC,wBAAO,YAAY,iBAAiB,YAAa,GAAG,aAAa;AAAA;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  CloseButton
4
- } from "./chunk-KN54MZIG.mjs";
4
+ } from "./chunk-IUGYU5VA.mjs";
5
5
  export {
6
6
  CloseButton
7
7
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/close-button",
3
- "version": "1.0.42-next-20241005220055",
3
+ "version": "1.0.42-next-20241008193728",
4
4
  "description": "Yamada UI close button component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -36,10 +36,10 @@
36
36
  "url": "https://github.com/yamada-ui/yamada-ui/issues"
37
37
  },
38
38
  "dependencies": {
39
- "@yamada-ui/core": "1.15.2-next-20241005220055",
40
- "@yamada-ui/icon": "1.1.8-next-20241005220055",
41
- "@yamada-ui/ripple": "1.0.40-next-20241005220055",
42
- "@yamada-ui/utils": "1.5.2"
39
+ "@yamada-ui/core": "1.15.2-next-20241008193728",
40
+ "@yamada-ui/icon": "1.1.8-next-20241008193728",
41
+ "@yamada-ui/ripple": "1.0.40-next-20241008193728",
42
+ "@yamada-ui/utils": "1.5.3-next-20241008193728"
43
43
  },
44
44
  "devDependencies": {
45
45
  "clean-package": "2.2.0",