@yamada-ui/button 1.0.44-next-20241005220055 → 1.0.44
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/button-group.d.mts +1 -1
- package/dist/button-group.d.ts +1 -1
- package/dist/button-group.js +8 -8
- package/dist/button-group.js.map +1 -1
- package/dist/button-group.mjs +1 -1
- package/dist/button.d.mts +21 -21
- package/dist/button.d.ts +21 -21
- package/dist/button.js +34 -34
- package/dist/button.js.map +1 -1
- package/dist/button.mjs +2 -2
- package/dist/{chunk-NINEAP5U.mjs → chunk-4SLEPBN4.mjs} +4 -4
- package/dist/chunk-4SLEPBN4.mjs.map +1 -0
- package/dist/{chunk-NBGNMVB2.mjs → chunk-I3FAJDDX.mjs} +10 -10
- package/dist/chunk-I3FAJDDX.mjs.map +1 -0
- package/dist/{chunk-DASXATSK.mjs → chunk-ZDI6LWYD.mjs} +32 -32
- package/dist/chunk-ZDI6LWYD.mjs.map +1 -0
- package/dist/icon-button.d.mts +1 -1
- package/dist/icon-button.d.ts +1 -1
- package/dist/icon-button.js +36 -36
- package/dist/icon-button.js.map +1 -1
- package/dist/icon-button.mjs +3 -3
- package/dist/index.js +36 -36
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3 -3
- package/package.json +6 -6
- package/dist/chunk-DASXATSK.mjs.map +0 -1
- package/dist/chunk-NBGNMVB2.mjs.map +0 -1
- package/dist/chunk-NINEAP5U.mjs.map +0 -1
@@ -1,18 +1,18 @@
|
|
1
1
|
"use client"
|
2
2
|
import {
|
3
3
|
useButtonGroup
|
4
|
-
} from "./chunk-
|
4
|
+
} from "./chunk-I3FAJDDX.mjs";
|
5
5
|
|
6
6
|
// src/button.tsx
|
7
7
|
import {
|
8
|
-
ui,
|
9
8
|
forwardRef,
|
10
|
-
|
11
|
-
|
9
|
+
omitThemeProps,
|
10
|
+
ui,
|
11
|
+
useComponentStyle
|
12
12
|
} from "@yamada-ui/core";
|
13
13
|
import { Loading as LoadingIcon } from "@yamada-ui/loading";
|
14
14
|
import { Ripple, useRipple } from "@yamada-ui/ripple";
|
15
|
-
import { cx,
|
15
|
+
import { cx, dataAttr, merge, mergeRefs } from "@yamada-ui/utils";
|
16
16
|
import { useCallback, useMemo, useRef } from "react";
|
17
17
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
18
18
|
var Button = forwardRef(
|
@@ -27,19 +27,19 @@ var Button = forwardRef(
|
|
27
27
|
{ isProcessSkip: __isProcessSkip, styles: __styles }
|
28
28
|
);
|
29
29
|
const {
|
30
|
-
className,
|
31
30
|
as,
|
32
31
|
type,
|
33
|
-
|
34
|
-
|
32
|
+
className,
|
33
|
+
disableRipple,
|
35
34
|
isActive,
|
36
35
|
isDisabled = group == null ? void 0 : group.isDisabled,
|
36
|
+
isLoading,
|
37
|
+
isRounded,
|
37
38
|
leftIcon,
|
38
|
-
rightIcon,
|
39
39
|
loadingIcon,
|
40
|
-
loadingText,
|
41
40
|
loadingPlacement = "start",
|
42
|
-
|
41
|
+
loadingText,
|
42
|
+
rightIcon,
|
43
43
|
__css,
|
44
44
|
...rest
|
45
45
|
} = omitThemeProps(mergedProps);
|
@@ -53,17 +53,17 @@ var Button = forwardRef(
|
|
53
53
|
var _a;
|
54
54
|
const _focus = "_focus" in styles ? merge((_a = styles._focus) != null ? _a : {}, { zIndex: "fallback(yamcha, 1)" }) : {};
|
55
55
|
return {
|
56
|
-
display: "inline-flex",
|
57
56
|
alignItems: "center",
|
58
|
-
justifyContent: "center",
|
59
|
-
gap: "fallback(2, 0.5rem)",
|
60
57
|
appearance: "none",
|
61
|
-
|
58
|
+
display: "inline-flex",
|
59
|
+
gap: "fallback(2, 0.5rem)",
|
60
|
+
justifyContent: "center",
|
61
|
+
outline: "none",
|
62
|
+
overflow: "hidden",
|
62
63
|
position: "relative",
|
63
|
-
|
64
|
+
userSelect: "none",
|
64
65
|
verticalAlign: "middle",
|
65
|
-
|
66
|
-
outline: "none",
|
66
|
+
whiteSpace: "nowrap",
|
67
67
|
...styles,
|
68
68
|
...__css,
|
69
69
|
...!!group ? { _focus } : {},
|
@@ -71,9 +71,9 @@ var Button = forwardRef(
|
|
71
71
|
};
|
72
72
|
}, [styles, __css, group, isRounded]);
|
73
73
|
const contentProps = {
|
74
|
+
children,
|
74
75
|
leftIcon,
|
75
|
-
rightIcon
|
76
|
-
children
|
76
|
+
rightIcon
|
77
77
|
};
|
78
78
|
const loadingProps = {
|
79
79
|
loadingIcon,
|
@@ -84,11 +84,11 @@ var Button = forwardRef(
|
|
84
84
|
{
|
85
85
|
ref: mergeRefs(ref, buttonRef),
|
86
86
|
as,
|
87
|
-
className: cx("ui-button", className),
|
88
87
|
type: type != null ? type : defaultType,
|
89
|
-
|
88
|
+
className: cx("ui-button", className),
|
90
89
|
"data-active": dataAttr(isActive),
|
91
90
|
"data-loading": dataAttr(isLoading),
|
91
|
+
disabled: trulyDisabled,
|
92
92
|
__css: css,
|
93
93
|
...rest,
|
94
94
|
onPointerDown,
|
@@ -123,17 +123,17 @@ var ButtonLoading = ({
|
|
123
123
|
}) => {
|
124
124
|
const css = useMemo(
|
125
125
|
() => ({
|
126
|
-
display: "flex",
|
127
126
|
alignItems: "center",
|
128
|
-
|
127
|
+
display: "flex",
|
129
128
|
fontSize: "1em",
|
130
|
-
lineHeight: "normal"
|
129
|
+
lineHeight: "normal",
|
130
|
+
position: loadingText ? "relative" : "absolute"
|
131
131
|
}),
|
132
132
|
[loadingText]
|
133
133
|
);
|
134
134
|
const element = useMemo(() => {
|
135
135
|
if (typeof loadingIcon === "string") {
|
136
|
-
return /* @__PURE__ */ jsx(LoadingIcon, { color: "current"
|
136
|
+
return /* @__PURE__ */ jsx(LoadingIcon, { variant: loadingIcon, color: "current" });
|
137
137
|
} else {
|
138
138
|
return loadingIcon || /* @__PURE__ */ jsx(LoadingIcon, { color: "current" });
|
139
139
|
}
|
@@ -143,9 +143,9 @@ var ButtonLoading = ({
|
|
143
143
|
ButtonLoading.displayName = "ButtonLoading";
|
144
144
|
ButtonLoading.__ui__ = "ButtonLoading";
|
145
145
|
var ButtonContent = ({
|
146
|
+
children,
|
146
147
|
leftIcon,
|
147
|
-
rightIcon
|
148
|
-
children
|
148
|
+
rightIcon
|
149
149
|
}) => {
|
150
150
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
151
151
|
leftIcon ? /* @__PURE__ */ jsx(ButtonIcon, { children: leftIcon }) : null,
|
@@ -155,15 +155,15 @@ var ButtonContent = ({
|
|
155
155
|
};
|
156
156
|
ButtonContent.displayName = "ButtonContent";
|
157
157
|
ButtonContent.__ui__ = "ButtonContent";
|
158
|
-
var ButtonIcon = ({
|
158
|
+
var ButtonIcon = ({ className, children, ...rest }) => {
|
159
159
|
return /* @__PURE__ */ jsx(
|
160
160
|
ui.span,
|
161
161
|
{
|
162
162
|
className: cx("ui-button__icon", className),
|
163
|
-
|
163
|
+
"aria-hidden": true,
|
164
164
|
alignSelf: "center",
|
165
|
+
display: "inline-flex",
|
165
166
|
flexShrink: 0,
|
166
|
-
"aria-hidden": true,
|
167
167
|
...rest,
|
168
168
|
children
|
169
169
|
}
|
@@ -184,4 +184,4 @@ export {
|
|
184
184
|
Button,
|
185
185
|
useButtonType
|
186
186
|
};
|
187
|
-
//# sourceMappingURL=chunk-
|
187
|
+
//# sourceMappingURL=chunk-ZDI6LWYD.mjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/button.tsx"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { ElementType, ReactElement } from \"react\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentStyle,\n} from \"@yamada-ui/core\"\nimport { Loading as LoadingIcon } from \"@yamada-ui/loading\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx, dataAttr, merge, mergeRefs } from \"@yamada-ui/utils\"\nimport { useCallback, useMemo, useRef } from \"react\"\nimport { useButtonGroup } from \"./button-group\"\n\ninterface ButtonOptions {\n /**\n * The type of button. Accepts `button`, `reset`, or `submit`.\n *\n * @default 'button'\n */\n type?: \"button\" | \"reset\" | \"submit\"\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 represented as active.\n *\n * @default false\n */\n isActive?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the loading state of the button is represented.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * If true, the button is full rounded. Else, it'll be slightly round.\n *\n * @default false\n */\n isRounded?: boolean\n /**\n * The icon to display at the left side of the button.\n */\n leftIcon?: ReactElement\n /**\n * The icon to display when the button is loading.\n */\n loadingIcon?: LoadingProps[\"variant\"] | ReactElement\n /**\n * The placement of the loading indicator. Accepts `start` or `end`.\n *\n * @default 'start'\n */\n loadingPlacement?: \"end\" | \"start\"\n /**\n * The text to display when the button is loading.\n */\n loadingText?: string\n /**\n * The icon to display at the right side of the button.\n */\n rightIcon?: ReactElement\n}\n\nexport interface ButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"Button\">,\n ButtonOptions {}\n\n/**\n * `Button` is an interactive component that allows users to perform actions such as submitting forms and toggling modals.\n *\n * @see Docs https://yamada-ui.com/components/forms/button\n */\nexport const Button = forwardRef<ButtonProps, \"button\">(\n ({ children, __isProcessSkip, __styles, ...props }, ref) => {\n const group = useButtonGroup()\n const [styles, mergedProps] = useComponentStyle(\n \"Button\",\n {\n ...group,\n ...props,\n },\n { isProcessSkip: __isProcessSkip, styles: __styles },\n )\n const {\n as,\n type,\n className,\n disableRipple,\n isActive,\n isDisabled = group?.isDisabled,\n isLoading,\n isRounded,\n leftIcon,\n loadingIcon,\n loadingPlacement = \"start\",\n loadingText,\n rightIcon,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const trulyDisabled = isDisabled || isLoading\n\n const { ref: buttonRef, type: defaultType } = useButtonType(as)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || trulyDisabled,\n })\n\n const css: CSSUIObject = useMemo(() => {\n const _focus =\n \"_focus\" in styles\n ? merge(styles._focus ?? {}, { zIndex: \"fallback(yamcha, 1)\" })\n : {}\n\n return {\n alignItems: \"center\",\n appearance: \"none\",\n display: \"inline-flex\",\n gap: \"fallback(2, 0.5rem)\",\n justifyContent: \"center\",\n outline: \"none\",\n overflow: \"hidden\",\n position: \"relative\",\n userSelect: \"none\",\n verticalAlign: \"middle\",\n whiteSpace: \"nowrap\",\n ...styles,\n ...__css,\n ...(!!group ? { _focus } : {}),\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n }, [styles, __css, group, isRounded])\n\n const contentProps = {\n children,\n leftIcon,\n rightIcon,\n }\n\n const loadingProps = {\n loadingIcon,\n loadingText,\n }\n\n return (\n <ui.button\n ref={mergeRefs(ref, buttonRef)}\n as={as}\n type={type ?? defaultType}\n className={cx(\"ui-button\", className)}\n data-active={dataAttr(isActive)}\n data-loading={dataAttr(isLoading)}\n disabled={trulyDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {isLoading && loadingPlacement === \"start\" ? (\n <ButtonLoading\n className=\"ui-button__loading--start\"\n {...loadingProps}\n />\n ) : null}\n\n {isLoading ? (\n loadingText || (\n <ui.span opacity={0}>\n <ButtonContent {...contentProps} />\n </ui.span>\n )\n ) : (\n <ButtonContent {...contentProps} />\n )}\n\n {isLoading && loadingPlacement === \"end\" ? (\n <ButtonLoading\n className=\"ui-button__loading--end\"\n {...loadingProps}\n />\n ) : null}\n\n <Ripple isDisabled={disableRipple || trulyDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nButton.displayName = \"Button\"\nButton.__ui__ = \"Button\"\n\ninterface ButtonLoadingProps\n extends Pick<ButtonProps, \"className\" | \"loadingIcon\" | \"loadingText\"> {}\n\nconst ButtonLoading: FC<ButtonLoadingProps> = ({\n className,\n loadingIcon,\n loadingText,\n}) => {\n const css = useMemo(\n (): CSSUIObject => ({\n alignItems: \"center\",\n display: \"flex\",\n fontSize: \"1em\",\n lineHeight: \"normal\",\n position: loadingText ? \"relative\" : \"absolute\",\n }),\n [loadingText],\n )\n\n const element = useMemo(() => {\n if (typeof loadingIcon === \"string\") {\n return <LoadingIcon variant={loadingIcon} color=\"current\" />\n } else {\n return loadingIcon || <LoadingIcon color=\"current\" />\n }\n }, [loadingIcon])\n\n return (\n <ui.div className={cx(\"ui-button__loading\", className)} __css={css}>\n {element}\n </ui.div>\n )\n}\n\nButtonLoading.displayName = \"ButtonLoading\"\nButtonLoading.__ui__ = \"ButtonLoading\"\n\ninterface ButtonContentProps\n extends Pick<ButtonProps, \"children\" | \"leftIcon\" | \"rightIcon\"> {}\n\nconst ButtonContent: FC<ButtonContentProps> = ({\n children,\n leftIcon,\n rightIcon,\n}) => {\n return (\n <>\n {leftIcon ? <ButtonIcon>{leftIcon}</ButtonIcon> : null}\n {children}\n {rightIcon ? <ButtonIcon>{rightIcon}</ButtonIcon> : null}\n </>\n )\n}\n\nButtonContent.displayName = \"ButtonContent\"\nButtonContent.__ui__ = \"ButtonContent\"\n\ninterface ButtonIconProps extends HTMLUIProps<\"span\"> {}\n\nconst ButtonIcon: FC<ButtonIconProps> = ({ className, children, ...rest }) => {\n return (\n <ui.span\n className={cx(\"ui-button__icon\", className)}\n aria-hidden\n alignSelf=\"center\"\n display=\"inline-flex\"\n flexShrink={0}\n {...rest}\n >\n {children}\n </ui.span>\n )\n}\n\nButtonIcon.displayName = \"ButtonIcon\"\nButtonIcon.__ui__ = \"ButtonIcon\"\n\nexport const useButtonType = (value?: ElementType) => {\n const isButton = useRef(!value)\n\n const ref = useCallback((node: HTMLElement | null) => {\n if (node) isButton.current = node.tagName === \"BUTTON\"\n }, [])\n\n const type = isButton.current ? \"button\" : undefined\n\n return { ref, type } as const\n}\n"],"mappings":"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","names":[]}
|
package/dist/icon-button.d.mts
CHANGED
@@ -9,7 +9,7 @@ interface IconButtonOptions {
|
|
9
9
|
*/
|
10
10
|
icon?: ReactElement;
|
11
11
|
}
|
12
|
-
interface IconButtonProps extends Omit<ButtonProps, "leftIcon" | "
|
12
|
+
interface IconButtonProps extends Omit<ButtonProps, "leftIcon" | "loadingIcon" | "loadingPlacement" | "loadingText" | "rightIcon">, IconButtonOptions {
|
13
13
|
}
|
14
14
|
/**
|
15
15
|
* `IconButton` is a component that displays an icon within a button.
|
package/dist/icon-button.d.ts
CHANGED
@@ -9,7 +9,7 @@ interface IconButtonOptions {
|
|
9
9
|
*/
|
10
10
|
icon?: ReactElement;
|
11
11
|
}
|
12
|
-
interface IconButtonProps extends Omit<ButtonProps, "leftIcon" | "
|
12
|
+
interface IconButtonProps extends Omit<ButtonProps, "leftIcon" | "loadingIcon" | "loadingPlacement" | "loadingText" | "rightIcon">, IconButtonOptions {
|
13
13
|
}
|
14
14
|
/**
|
15
15
|
* `IconButton` is a component that displays an icon within a button.
|
package/dist/icon-button.js
CHANGED
@@ -41,8 +41,8 @@ var import_react = require("react");
|
|
41
41
|
var import_jsx_runtime = require("react/jsx-runtime");
|
42
42
|
var [ButtonGroupProvider, useButtonGroup] = (0, import_utils.createContext)(
|
43
43
|
{
|
44
|
-
|
45
|
-
|
44
|
+
name: "ButtonGroupContext",
|
45
|
+
strict: false
|
46
46
|
}
|
47
47
|
);
|
48
48
|
var ButtonGroup = (0, import_core.forwardRef)(
|
@@ -50,11 +50,11 @@ var ButtonGroup = (0, import_core.forwardRef)(
|
|
50
50
|
className,
|
51
51
|
size,
|
52
52
|
variant,
|
53
|
+
columnGap,
|
53
54
|
direction: flexDirection,
|
55
|
+
gap,
|
54
56
|
isAttached,
|
55
57
|
isDisabled,
|
56
|
-
gap,
|
57
|
-
columnGap,
|
58
58
|
rowGap,
|
59
59
|
...rest
|
60
60
|
}, ref) => {
|
@@ -70,13 +70,13 @@ var ButtonGroup = (0, import_core.forwardRef)(
|
|
70
70
|
if (isAttached) {
|
71
71
|
Object.assign(css, {
|
72
72
|
"> *:first-of-type:not(:last-of-type)": isColumn ? { borderBottomRadius: 0, marginBlockEnd: "-1px" } : { borderRightRadius: 0, marginInlineEnd: "-1px" },
|
73
|
-
"> *:not(:first-of-type):
|
74
|
-
"> *:not(:first-of-type):last-of-type": isColumn ? {
|
73
|
+
"> *:not(:first-of-type):last-of-type": isColumn ? { borderTopRadius: 0, marginBlockStart: "-1px" } : { borderLeftRadius: 0 },
|
74
|
+
"> *:not(:first-of-type):not(:last-of-type)": isColumn ? { borderRadius: 0, marginBlockStart: "-1px" } : { borderRadius: 0, marginInlineEnd: "-1px" }
|
75
75
|
});
|
76
76
|
} else {
|
77
77
|
Object.assign(css, {
|
78
|
-
gap,
|
79
78
|
columnGap,
|
79
|
+
gap,
|
80
80
|
rowGap
|
81
81
|
});
|
82
82
|
}
|
@@ -84,9 +84,9 @@ var ButtonGroup = (0, import_core.forwardRef)(
|
|
84
84
|
import_core.ui.div,
|
85
85
|
{
|
86
86
|
ref,
|
87
|
-
role: "group",
|
88
87
|
className: (0, import_utils.cx)("ui-button-group", className),
|
89
88
|
"data-attached": (0, import_utils.dataAttr)(isAttached),
|
89
|
+
role: "group",
|
90
90
|
__css: css,
|
91
91
|
...rest
|
92
92
|
}
|
@@ -110,19 +110,19 @@ var Button = (0, import_core2.forwardRef)(
|
|
110
110
|
{ isProcessSkip: __isProcessSkip, styles: __styles }
|
111
111
|
);
|
112
112
|
const {
|
113
|
-
className,
|
114
113
|
as,
|
115
114
|
type,
|
116
|
-
|
117
|
-
|
115
|
+
className,
|
116
|
+
disableRipple,
|
118
117
|
isActive,
|
119
118
|
isDisabled = group == null ? void 0 : group.isDisabled,
|
119
|
+
isLoading,
|
120
|
+
isRounded,
|
120
121
|
leftIcon,
|
121
|
-
rightIcon,
|
122
122
|
loadingIcon,
|
123
|
-
loadingText,
|
124
123
|
loadingPlacement = "start",
|
125
|
-
|
124
|
+
loadingText,
|
125
|
+
rightIcon,
|
126
126
|
__css,
|
127
127
|
...rest
|
128
128
|
} = (0, import_core2.omitThemeProps)(mergedProps);
|
@@ -136,17 +136,17 @@ var Button = (0, import_core2.forwardRef)(
|
|
136
136
|
var _a;
|
137
137
|
const _focus = "_focus" in styles ? (0, import_utils2.merge)((_a = styles._focus) != null ? _a : {}, { zIndex: "fallback(yamcha, 1)" }) : {};
|
138
138
|
return {
|
139
|
-
display: "inline-flex",
|
140
139
|
alignItems: "center",
|
141
|
-
justifyContent: "center",
|
142
|
-
gap: "fallback(2, 0.5rem)",
|
143
140
|
appearance: "none",
|
144
|
-
|
141
|
+
display: "inline-flex",
|
142
|
+
gap: "fallback(2, 0.5rem)",
|
143
|
+
justifyContent: "center",
|
144
|
+
outline: "none",
|
145
|
+
overflow: "hidden",
|
145
146
|
position: "relative",
|
146
|
-
|
147
|
+
userSelect: "none",
|
147
148
|
verticalAlign: "middle",
|
148
|
-
|
149
|
-
outline: "none",
|
149
|
+
whiteSpace: "nowrap",
|
150
150
|
...styles,
|
151
151
|
...__css,
|
152
152
|
...!!group ? { _focus } : {},
|
@@ -154,9 +154,9 @@ var Button = (0, import_core2.forwardRef)(
|
|
154
154
|
};
|
155
155
|
}, [styles, __css, group, isRounded]);
|
156
156
|
const contentProps = {
|
157
|
+
children,
|
157
158
|
leftIcon,
|
158
|
-
rightIcon
|
159
|
-
children
|
159
|
+
rightIcon
|
160
160
|
};
|
161
161
|
const loadingProps = {
|
162
162
|
loadingIcon,
|
@@ -167,11 +167,11 @@ var Button = (0, import_core2.forwardRef)(
|
|
167
167
|
{
|
168
168
|
ref: (0, import_utils2.mergeRefs)(ref, buttonRef),
|
169
169
|
as,
|
170
|
-
className: (0, import_utils2.cx)("ui-button", className),
|
171
170
|
type: type != null ? type : defaultType,
|
172
|
-
|
171
|
+
className: (0, import_utils2.cx)("ui-button", className),
|
173
172
|
"data-active": (0, import_utils2.dataAttr)(isActive),
|
174
173
|
"data-loading": (0, import_utils2.dataAttr)(isLoading),
|
174
|
+
disabled: trulyDisabled,
|
175
175
|
__css: css,
|
176
176
|
...rest,
|
177
177
|
onPointerDown,
|
@@ -206,17 +206,17 @@ var ButtonLoading = ({
|
|
206
206
|
}) => {
|
207
207
|
const css = (0, import_react2.useMemo)(
|
208
208
|
() => ({
|
209
|
-
display: "flex",
|
210
209
|
alignItems: "center",
|
211
|
-
|
210
|
+
display: "flex",
|
212
211
|
fontSize: "1em",
|
213
|
-
lineHeight: "normal"
|
212
|
+
lineHeight: "normal",
|
213
|
+
position: loadingText ? "relative" : "absolute"
|
214
214
|
}),
|
215
215
|
[loadingText]
|
216
216
|
);
|
217
217
|
const element = (0, import_react2.useMemo)(() => {
|
218
218
|
if (typeof loadingIcon === "string") {
|
219
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_loading.Loading, { color: "current"
|
219
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_loading.Loading, { variant: loadingIcon, color: "current" });
|
220
220
|
} else {
|
221
221
|
return loadingIcon || /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_loading.Loading, { color: "current" });
|
222
222
|
}
|
@@ -226,9 +226,9 @@ var ButtonLoading = ({
|
|
226
226
|
ButtonLoading.displayName = "ButtonLoading";
|
227
227
|
ButtonLoading.__ui__ = "ButtonLoading";
|
228
228
|
var ButtonContent = ({
|
229
|
+
children,
|
229
230
|
leftIcon,
|
230
|
-
rightIcon
|
231
|
-
children
|
231
|
+
rightIcon
|
232
232
|
}) => {
|
233
233
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
234
234
|
leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ButtonIcon, { children: leftIcon }) : null,
|
@@ -238,15 +238,15 @@ var ButtonContent = ({
|
|
238
238
|
};
|
239
239
|
ButtonContent.displayName = "ButtonContent";
|
240
240
|
ButtonContent.__ui__ = "ButtonContent";
|
241
|
-
var ButtonIcon = ({
|
241
|
+
var ButtonIcon = ({ className, children, ...rest }) => {
|
242
242
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
243
243
|
import_core2.ui.span,
|
244
244
|
{
|
245
245
|
className: (0, import_utils2.cx)("ui-button__icon", className),
|
246
|
-
|
246
|
+
"aria-hidden": true,
|
247
247
|
alignSelf: "center",
|
248
|
+
display: "inline-flex",
|
248
249
|
flexShrink: 0,
|
249
|
-
"aria-hidden": true,
|
250
250
|
...rest,
|
251
251
|
children
|
252
252
|
}
|
@@ -266,12 +266,12 @@ var useButtonType = (value) => {
|
|
266
266
|
// src/icon-button.tsx
|
267
267
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
268
268
|
var IconButton = (0, import_core3.forwardRef)(
|
269
|
-
({
|
269
|
+
({ className, children, icon, ...rest }, ref) => {
|
270
270
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
271
271
|
Button,
|
272
272
|
{
|
273
|
-
className: (0, import_utils3.cx)("ui-icon-button", className),
|
274
273
|
ref,
|
274
|
+
className: (0, import_utils3.cx)("ui-icon-button", className),
|
275
275
|
p: 0,
|
276
276
|
...rest,
|
277
277
|
children: icon || children
|
package/dist/icon-button.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/icon-button.tsx","../src/button.tsx","../src/button-group.tsx"],"sourcesContent":["import { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport type { ReactElement } from \"react\"\nimport type { ButtonProps } from \"./button\"\nimport { Button } from \"./button\"\n\ninterface IconButtonOptions {\n /**\n * The icon to be used in the button.\n */\n icon?: ReactElement\n}\n\nexport interface IconButtonProps\n extends Omit<\n ButtonProps,\n | \"leftIcon\"\n | \"rightIcon\"\n | \"loadingIcon\"\n | \"loadingText\"\n | \"loadingPlacement\"\n >,\n IconButtonOptions {}\n\n/**\n * `IconButton` is a component that displays an icon within a button.\n *\n * @see Docs https://yamada-ui.com/components/forms/icon-button\n */\nexport const IconButton = forwardRef<IconButtonProps, \"button\">(\n ({ icon, children, className, ...rest }, ref) => {\n return (\n <Button\n className={cx(\"ui-icon-button\", className)}\n ref={ref}\n p={0}\n {...rest}\n >\n {icon || children}\n </Button>\n )\n },\n)\n\nIconButton.displayName = \"IconButton\"\nIconButton.__ui__ = \"IconButton\"\n","import type { HTMLUIProps, ThemeProps, CSSUIObject, FC } from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading as LoadingIcon } from \"@yamada-ui/loading\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx, merge, dataAttr, mergeRefs } from \"@yamada-ui/utils\"\nimport type { ElementType, ReactElement } from \"react\"\nimport { useCallback, useMemo, useRef } from \"react\"\nimport { useButtonGroup } from \"./button-group\"\n\ninterface ButtonOptions {\n /**\n * The type of button. Accepts `button`, `reset`, or `submit`.\n *\n * @default 'button'\n */\n type?: \"button\" | \"reset\" | \"submit\"\n /**\n * If true, the button is full rounded. Else, it'll be slightly round.\n *\n * @default false\n */\n isRounded?: boolean\n /**\n * If `true`, the loading state of the button is represented.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * If `true`, the button is represented as active.\n *\n * @default false\n */\n isActive?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * The icon to display at the left side of the button.\n */\n leftIcon?: ReactElement\n /**\n * The icon to display at the right side of the button.\n */\n rightIcon?: ReactElement\n /**\n * The icon to display when the button is loading.\n */\n loadingIcon?: ReactElement | LoadingProps[\"variant\"]\n /**\n * The text to display when the button is loading.\n */\n loadingText?: string\n /**\n * The placement of the loading indicator. Accepts `start` or `end`.\n *\n * @default 'start'\n */\n loadingPlacement?: \"start\" | \"end\"\n /**\n * If `true`, disable ripple effects when pressing a element.\n *\n * @default false\n */\n disableRipple?: boolean\n}\n\nexport interface ButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"Button\">,\n ButtonOptions {}\n\n/**\n * `Button` is an interactive component that allows users to perform actions such as submitting forms and toggling modals.\n *\n * @see Docs https://yamada-ui.com/components/forms/button\n */\nexport const Button = forwardRef<ButtonProps, \"button\">(\n ({ children, __isProcessSkip, __styles, ...props }, ref) => {\n const group = useButtonGroup()\n const [styles, mergedProps] = useComponentStyle(\n \"Button\",\n {\n ...group,\n ...props,\n },\n { isProcessSkip: __isProcessSkip, styles: __styles },\n )\n const {\n className,\n as,\n type,\n isRounded,\n isLoading,\n isActive,\n isDisabled = group?.isDisabled,\n leftIcon,\n rightIcon,\n loadingIcon,\n loadingText,\n loadingPlacement = \"start\",\n disableRipple,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const trulyDisabled = isDisabled || isLoading\n\n const { ref: buttonRef, type: defaultType } = useButtonType(as)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || trulyDisabled,\n })\n\n const css: CSSUIObject = useMemo(() => {\n const _focus =\n \"_focus\" in styles\n ? merge(styles._focus ?? {}, { zIndex: \"fallback(yamcha, 1)\" })\n : {}\n\n return {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: \"fallback(2, 0.5rem)\",\n appearance: \"none\",\n userSelect: \"none\",\n position: \"relative\",\n whiteSpace: \"nowrap\",\n verticalAlign: \"middle\",\n overflow: \"hidden\",\n outline: \"none\",\n ...styles,\n ...__css,\n ...(!!group ? { _focus } : {}),\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n }, [styles, __css, group, isRounded])\n\n const contentProps = {\n leftIcon,\n rightIcon,\n children,\n }\n\n const loadingProps = {\n loadingIcon,\n loadingText,\n }\n\n return (\n <ui.button\n ref={mergeRefs(ref, buttonRef)}\n as={as}\n className={cx(\"ui-button\", className)}\n type={type ?? defaultType}\n disabled={trulyDisabled}\n data-active={dataAttr(isActive)}\n data-loading={dataAttr(isLoading)}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {isLoading && loadingPlacement === \"start\" ? (\n <ButtonLoading\n className=\"ui-button__loading--start\"\n {...loadingProps}\n />\n ) : null}\n\n {isLoading ? (\n loadingText || (\n <ui.span opacity={0}>\n <ButtonContent {...contentProps} />\n </ui.span>\n )\n ) : (\n <ButtonContent {...contentProps} />\n )}\n\n {isLoading && loadingPlacement === \"end\" ? (\n <ButtonLoading\n className=\"ui-button__loading--end\"\n {...loadingProps}\n />\n ) : null}\n\n <Ripple isDisabled={disableRipple || trulyDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nButton.displayName = \"Button\"\nButton.__ui__ = \"Button\"\n\ninterface ButtonLoadingProps\n extends Pick<ButtonProps, \"className\" | \"loadingIcon\" | \"loadingText\"> {}\n\nconst ButtonLoading: FC<ButtonLoadingProps> = ({\n className,\n loadingIcon,\n loadingText,\n}) => {\n const css = useMemo(\n (): CSSUIObject => ({\n display: \"flex\",\n alignItems: \"center\",\n position: loadingText ? \"relative\" : \"absolute\",\n fontSize: \"1em\",\n lineHeight: \"normal\",\n }),\n [loadingText],\n )\n\n const element = useMemo(() => {\n if (typeof loadingIcon === \"string\") {\n return <LoadingIcon color=\"current\" variant={loadingIcon} />\n } else {\n return loadingIcon || <LoadingIcon color=\"current\" />\n }\n }, [loadingIcon])\n\n return (\n <ui.div className={cx(\"ui-button__loading\", className)} __css={css}>\n {element}\n </ui.div>\n )\n}\n\nButtonLoading.displayName = \"ButtonLoading\"\nButtonLoading.__ui__ = \"ButtonLoading\"\n\ninterface ButtonContentProps\n extends Pick<ButtonProps, \"leftIcon\" | \"rightIcon\" | \"children\"> {}\n\nconst ButtonContent: FC<ButtonContentProps> = ({\n leftIcon,\n rightIcon,\n children,\n}) => {\n return (\n <>\n {leftIcon ? <ButtonIcon>{leftIcon}</ButtonIcon> : null}\n {children}\n {rightIcon ? <ButtonIcon>{rightIcon}</ButtonIcon> : null}\n </>\n )\n}\n\nButtonContent.displayName = \"ButtonContent\"\nButtonContent.__ui__ = \"ButtonContent\"\n\ninterface ButtonIconProps extends HTMLUIProps<\"span\"> {}\n\nconst ButtonIcon: FC<ButtonIconProps> = ({ children, className, ...rest }) => {\n return (\n <ui.span\n className={cx(\"ui-button__icon\", className)}\n display=\"inline-flex\"\n alignSelf=\"center\"\n flexShrink={0}\n aria-hidden={true}\n {...rest}\n >\n {children}\n </ui.span>\n )\n}\n\nButtonIcon.displayName = \"ButtonIcon\"\nButtonIcon.__ui__ = \"ButtonIcon\"\n\nexport const useButtonType = (value?: ElementType) => {\n const isButton = useRef(!value)\n\n const ref = useCallback((node: HTMLElement | null) => {\n if (node) isButton.current = node.tagName === \"BUTTON\"\n }, [])\n\n const type = isButton.current ? \"button\" : undefined\n\n return { ref, type } as const\n}\n","import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { createContext, cx, dataAttr } from \"@yamada-ui/utils\"\nimport { useMemo } from \"react\"\n\ninterface ButtonGroupOptions {\n /**\n * The CSS `flex-direction` property.\n */\n direction?: CSSUIObject[\"flexDirection\"]\n /**\n * If `true`, the borderRadius of button that are direct children will be altered to look flushed together.\n *\n * @default false\n */\n isAttached?: boolean\n /**\n * If `true`, all wrapped button will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n}\n\nexport interface ButtonGroupProps\n extends Omit<HTMLUIProps, \"direction\">,\n ThemeProps<\"Button\">,\n ButtonGroupOptions {}\n\ninterface ButtonGroupContext extends ThemeProps<\"Button\"> {\n isDisabled?: boolean\n}\n\nconst [ButtonGroupProvider, useButtonGroup] = createContext<ButtonGroupContext>(\n {\n strict: false,\n name: \"ButtonGroupContext\",\n },\n)\n\nexport { useButtonGroup }\n\nexport const ButtonGroup = forwardRef<ButtonGroupProps, \"div\">(\n (\n {\n className,\n size,\n variant,\n direction: flexDirection,\n isAttached,\n isDisabled,\n gap,\n columnGap,\n rowGap,\n ...rest\n },\n ref,\n ) => {\n const isColumn =\n flexDirection === \"column\" || flexDirection === \"column-reverse\"\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n flexDirection,\n }\n\n const context: ButtonGroupContext = useMemo(\n () => ({ size, variant, isDisabled }),\n [size, variant, isDisabled],\n )\n\n if (isAttached) {\n Object.assign(css, {\n \"> *:first-of-type:not(:last-of-type)\": isColumn\n ? { borderBottomRadius: 0, marginBlockEnd: \"-1px\" }\n : { borderRightRadius: 0, marginInlineEnd: \"-1px\" },\n \"> *:not(:first-of-type):not(:last-of-type)\": isColumn\n ? { borderRadius: 0, marginBlockStart: \"-1px\" }\n : { borderRadius: 0, marginInlineEnd: \"-1px\" },\n \"> *:not(:first-of-type):last-of-type\": isColumn\n ? { borderTopRadius: 0, marginBlockStart: \"-1px\" }\n : { borderLeftRadius: 0 },\n })\n } else {\n Object.assign(css, {\n gap,\n columnGap,\n rowGap,\n })\n }\n\n return (\n <ButtonGroupProvider value={context}>\n <ui.div\n ref={ref}\n role=\"group\"\n className={cx(\"ui-button-group\", className)}\n data-attached={dataAttr(isAttached)}\n __css={css}\n {...rest}\n />\n </ButtonGroupProvider>\n )\n },\n)\n\nButtonGroup.displayName = \"ButtonGroup\"\nButtonGroup.__ui__ = \"ButtonGroup\"\n"],"mappings":"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","names":["import_core","import_utils","import_core","import_utils","import_react","import_jsx_runtime","LoadingIcon","import_jsx_runtime"]}
|
1
|
+
{"version":3,"sources":["../src/icon-button.tsx","../src/button.tsx","../src/button-group.tsx"],"sourcesContent":["import type { ReactElement } from \"react\"\nimport type { ButtonProps } from \"./button\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { Button } from \"./button\"\n\ninterface IconButtonOptions {\n /**\n * The icon to be used in the button.\n */\n icon?: ReactElement\n}\n\nexport interface IconButtonProps\n extends Omit<\n ButtonProps,\n | \"leftIcon\"\n | \"loadingIcon\"\n | \"loadingPlacement\"\n | \"loadingText\"\n | \"rightIcon\"\n >,\n IconButtonOptions {}\n\n/**\n * `IconButton` is a component that displays an icon within a button.\n *\n * @see Docs https://yamada-ui.com/components/forms/icon-button\n */\nexport const IconButton = forwardRef<IconButtonProps, \"button\">(\n ({ className, children, icon, ...rest }, ref) => {\n return (\n <Button\n ref={ref}\n className={cx(\"ui-icon-button\", className)}\n p={0}\n {...rest}\n >\n {icon || children}\n </Button>\n )\n },\n)\n\nIconButton.displayName = \"IconButton\"\nIconButton.__ui__ = \"IconButton\"\n","import type { CSSUIObject, FC, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport type { ElementType, ReactElement } from \"react\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentStyle,\n} from \"@yamada-ui/core\"\nimport { Loading as LoadingIcon } from \"@yamada-ui/loading\"\nimport { Ripple, useRipple } from \"@yamada-ui/ripple\"\nimport { cx, dataAttr, merge, mergeRefs } from \"@yamada-ui/utils\"\nimport { useCallback, useMemo, useRef } from \"react\"\nimport { useButtonGroup } from \"./button-group\"\n\ninterface ButtonOptions {\n /**\n * The type of button. Accepts `button`, `reset`, or `submit`.\n *\n * @default 'button'\n */\n type?: \"button\" | \"reset\" | \"submit\"\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 represented as active.\n *\n * @default false\n */\n isActive?: boolean\n /**\n * If `true`, the button is disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the loading state of the button is represented.\n *\n * @default false\n */\n isLoading?: boolean\n /**\n * If true, the button is full rounded. Else, it'll be slightly round.\n *\n * @default false\n */\n isRounded?: boolean\n /**\n * The icon to display at the left side of the button.\n */\n leftIcon?: ReactElement\n /**\n * The icon to display when the button is loading.\n */\n loadingIcon?: LoadingProps[\"variant\"] | ReactElement\n /**\n * The placement of the loading indicator. Accepts `start` or `end`.\n *\n * @default 'start'\n */\n loadingPlacement?: \"end\" | \"start\"\n /**\n * The text to display when the button is loading.\n */\n loadingText?: string\n /**\n * The icon to display at the right side of the button.\n */\n rightIcon?: ReactElement\n}\n\nexport interface ButtonProps\n extends HTMLUIProps<\"button\">,\n ThemeProps<\"Button\">,\n ButtonOptions {}\n\n/**\n * `Button` is an interactive component that allows users to perform actions such as submitting forms and toggling modals.\n *\n * @see Docs https://yamada-ui.com/components/forms/button\n */\nexport const Button = forwardRef<ButtonProps, \"button\">(\n ({ children, __isProcessSkip, __styles, ...props }, ref) => {\n const group = useButtonGroup()\n const [styles, mergedProps] = useComponentStyle(\n \"Button\",\n {\n ...group,\n ...props,\n },\n { isProcessSkip: __isProcessSkip, styles: __styles },\n )\n const {\n as,\n type,\n className,\n disableRipple,\n isActive,\n isDisabled = group?.isDisabled,\n isLoading,\n isRounded,\n leftIcon,\n loadingIcon,\n loadingPlacement = \"start\",\n loadingText,\n rightIcon,\n __css,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const trulyDisabled = isDisabled || isLoading\n\n const { ref: buttonRef, type: defaultType } = useButtonType(as)\n const { onPointerDown, ...rippleProps } = useRipple({\n ...rest,\n isDisabled: disableRipple || trulyDisabled,\n })\n\n const css: CSSUIObject = useMemo(() => {\n const _focus =\n \"_focus\" in styles\n ? merge(styles._focus ?? {}, { zIndex: \"fallback(yamcha, 1)\" })\n : {}\n\n return {\n alignItems: \"center\",\n appearance: \"none\",\n display: \"inline-flex\",\n gap: \"fallback(2, 0.5rem)\",\n justifyContent: \"center\",\n outline: \"none\",\n overflow: \"hidden\",\n position: \"relative\",\n userSelect: \"none\",\n verticalAlign: \"middle\",\n whiteSpace: \"nowrap\",\n ...styles,\n ...__css,\n ...(!!group ? { _focus } : {}),\n ...(isRounded ? { borderRadius: \"fallback(full, 9999px)\" } : {}),\n }\n }, [styles, __css, group, isRounded])\n\n const contentProps = {\n children,\n leftIcon,\n rightIcon,\n }\n\n const loadingProps = {\n loadingIcon,\n loadingText,\n }\n\n return (\n <ui.button\n ref={mergeRefs(ref, buttonRef)}\n as={as}\n type={type ?? defaultType}\n className={cx(\"ui-button\", className)}\n data-active={dataAttr(isActive)}\n data-loading={dataAttr(isLoading)}\n disabled={trulyDisabled}\n __css={css}\n {...rest}\n onPointerDown={onPointerDown}\n >\n {isLoading && loadingPlacement === \"start\" ? (\n <ButtonLoading\n className=\"ui-button__loading--start\"\n {...loadingProps}\n />\n ) : null}\n\n {isLoading ? (\n loadingText || (\n <ui.span opacity={0}>\n <ButtonContent {...contentProps} />\n </ui.span>\n )\n ) : (\n <ButtonContent {...contentProps} />\n )}\n\n {isLoading && loadingPlacement === \"end\" ? (\n <ButtonLoading\n className=\"ui-button__loading--end\"\n {...loadingProps}\n />\n ) : null}\n\n <Ripple isDisabled={disableRipple || trulyDisabled} {...rippleProps} />\n </ui.button>\n )\n },\n)\n\nButton.displayName = \"Button\"\nButton.__ui__ = \"Button\"\n\ninterface ButtonLoadingProps\n extends Pick<ButtonProps, \"className\" | \"loadingIcon\" | \"loadingText\"> {}\n\nconst ButtonLoading: FC<ButtonLoadingProps> = ({\n className,\n loadingIcon,\n loadingText,\n}) => {\n const css = useMemo(\n (): CSSUIObject => ({\n alignItems: \"center\",\n display: \"flex\",\n fontSize: \"1em\",\n lineHeight: \"normal\",\n position: loadingText ? \"relative\" : \"absolute\",\n }),\n [loadingText],\n )\n\n const element = useMemo(() => {\n if (typeof loadingIcon === \"string\") {\n return <LoadingIcon variant={loadingIcon} color=\"current\" />\n } else {\n return loadingIcon || <LoadingIcon color=\"current\" />\n }\n }, [loadingIcon])\n\n return (\n <ui.div className={cx(\"ui-button__loading\", className)} __css={css}>\n {element}\n </ui.div>\n )\n}\n\nButtonLoading.displayName = \"ButtonLoading\"\nButtonLoading.__ui__ = \"ButtonLoading\"\n\ninterface ButtonContentProps\n extends Pick<ButtonProps, \"children\" | \"leftIcon\" | \"rightIcon\"> {}\n\nconst ButtonContent: FC<ButtonContentProps> = ({\n children,\n leftIcon,\n rightIcon,\n}) => {\n return (\n <>\n {leftIcon ? <ButtonIcon>{leftIcon}</ButtonIcon> : null}\n {children}\n {rightIcon ? <ButtonIcon>{rightIcon}</ButtonIcon> : null}\n </>\n )\n}\n\nButtonContent.displayName = \"ButtonContent\"\nButtonContent.__ui__ = \"ButtonContent\"\n\ninterface ButtonIconProps extends HTMLUIProps<\"span\"> {}\n\nconst ButtonIcon: FC<ButtonIconProps> = ({ className, children, ...rest }) => {\n return (\n <ui.span\n className={cx(\"ui-button__icon\", className)}\n aria-hidden\n alignSelf=\"center\"\n display=\"inline-flex\"\n flexShrink={0}\n {...rest}\n >\n {children}\n </ui.span>\n )\n}\n\nButtonIcon.displayName = \"ButtonIcon\"\nButtonIcon.__ui__ = \"ButtonIcon\"\n\nexport const useButtonType = (value?: ElementType) => {\n const isButton = useRef(!value)\n\n const ref = useCallback((node: HTMLElement | null) => {\n if (node) isButton.current = node.tagName === \"BUTTON\"\n }, [])\n\n const type = isButton.current ? \"button\" : undefined\n\n return { ref, type } as const\n}\n","import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { createContext, cx, dataAttr } from \"@yamada-ui/utils\"\nimport { useMemo } from \"react\"\n\ninterface ButtonGroupOptions {\n /**\n * The CSS `flex-direction` property.\n */\n direction?: CSSUIObject[\"flexDirection\"]\n /**\n * If `true`, the borderRadius of button that are direct children will be altered to look flushed together.\n *\n * @default false\n */\n isAttached?: boolean\n /**\n * If `true`, all wrapped button will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n}\n\nexport interface ButtonGroupProps\n extends Omit<HTMLUIProps, \"direction\">,\n ThemeProps<\"Button\">,\n ButtonGroupOptions {}\n\ninterface ButtonGroupContext extends ThemeProps<\"Button\"> {\n isDisabled?: boolean\n}\n\nconst [ButtonGroupProvider, useButtonGroup] = createContext<ButtonGroupContext>(\n {\n name: \"ButtonGroupContext\",\n strict: false,\n },\n)\n\nexport { useButtonGroup }\n\nexport const ButtonGroup = forwardRef<ButtonGroupProps, \"div\">(\n (\n {\n className,\n size,\n variant,\n columnGap,\n direction: flexDirection,\n gap,\n isAttached,\n isDisabled,\n rowGap,\n ...rest\n },\n ref,\n ) => {\n const isColumn =\n flexDirection === \"column\" || flexDirection === \"column-reverse\"\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n flexDirection,\n }\n\n const context: ButtonGroupContext = useMemo(\n () => ({ size, variant, isDisabled }),\n [size, variant, isDisabled],\n )\n\n if (isAttached) {\n Object.assign(css, {\n \"> *:first-of-type:not(:last-of-type)\": isColumn\n ? { borderBottomRadius: 0, marginBlockEnd: \"-1px\" }\n : { borderRightRadius: 0, marginInlineEnd: \"-1px\" },\n \"> *:not(:first-of-type):last-of-type\": isColumn\n ? { borderTopRadius: 0, marginBlockStart: \"-1px\" }\n : { borderLeftRadius: 0 },\n \"> *:not(:first-of-type):not(:last-of-type)\": isColumn\n ? { borderRadius: 0, marginBlockStart: \"-1px\" }\n : { borderRadius: 0, marginInlineEnd: \"-1px\" },\n })\n } else {\n Object.assign(css, {\n columnGap,\n gap,\n rowGap,\n })\n }\n\n return (\n <ButtonGroupProvider value={context}>\n <ui.div\n ref={ref}\n className={cx(\"ui-button-group\", className)}\n data-attached={dataAttr(isAttached)}\n role=\"group\"\n __css={css}\n {...rest}\n />\n </ButtonGroupProvider>\n )\n },\n)\n\nButtonGroup.displayName = \"ButtonGroup\"\nButtonGroup.__ui__ = \"ButtonGroup\"\n"],"mappings":"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","names":["import_core","import_utils","import_core","import_utils","import_react","import_jsx_runtime","LoadingIcon","import_jsx_runtime"]}
|
package/dist/icon-button.mjs
CHANGED
@@ -1,9 +1,9 @@
|
|
1
1
|
"use client"
|
2
2
|
import {
|
3
3
|
IconButton
|
4
|
-
} from "./chunk-
|
5
|
-
import "./chunk-
|
6
|
-
import "./chunk-
|
4
|
+
} from "./chunk-4SLEPBN4.mjs";
|
5
|
+
import "./chunk-ZDI6LWYD.mjs";
|
6
|
+
import "./chunk-I3FAJDDX.mjs";
|
7
7
|
export {
|
8
8
|
IconButton
|
9
9
|
};
|