@lobehub/ui 5.19.0 → 5.19.2
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.
|
@@ -1,9 +1,19 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useMotionComponent } from "../../MotionProvider/index.mjs";
|
|
3
|
+
import Icon from "../../Icon/Icon.mjs";
|
|
3
4
|
import { styles } from "./style.mjs";
|
|
4
|
-
import {
|
|
5
|
+
import { isValidElement } from "react";
|
|
6
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
5
7
|
import { cx } from "antd-style";
|
|
6
8
|
//#region src/base-ui/Button/Button.tsx
|
|
9
|
+
const resolveIconNode = (node) => {
|
|
10
|
+
if (node === void 0 || node === null) return null;
|
|
11
|
+
if (isValidElement(node) || typeof node === "string" || typeof node === "number") return node;
|
|
12
|
+
return /* @__PURE__ */ jsx(Icon, {
|
|
13
|
+
icon: node,
|
|
14
|
+
size: "small"
|
|
15
|
+
});
|
|
16
|
+
};
|
|
7
17
|
const resolveSizeCls = (size) => {
|
|
8
18
|
if (size === "small") return styles.sizeSmall;
|
|
9
19
|
if (size === "large") return styles.sizeLarge;
|
|
@@ -49,7 +59,7 @@ const Button = ({ block, children, className, classNames, danger = false, disabl
|
|
|
49
59
|
const shapeCls = shape === "circle" ? styles.shapeCircle : shape === "round" ? styles.shapeRound : void 0;
|
|
50
60
|
const iconOnlySizeCls = !(children !== void 0 && children !== null && children !== false && children !== "") && !!(loading || icon) ? resolveIconOnlySizeCls(size) : void 0;
|
|
51
61
|
const composedClassName = cx(styles.base, sizeCls, variantCls, shapeCls, block && styles.block, iconPosition === "end" && styles.iconEnd, iconOnlySizeCls, className);
|
|
52
|
-
const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
62
|
+
const inner = /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
53
63
|
/* @__PURE__ */ jsx("span", {
|
|
54
64
|
"aria-hidden": !loading,
|
|
55
65
|
style: userStyles?.icon,
|
|
@@ -59,7 +69,7 @@ const Button = ({ block, children, className, classNames, danger = false, disabl
|
|
|
59
69
|
icon && !loading ? /* @__PURE__ */ jsx("span", {
|
|
60
70
|
className: cx(styles.iconBox, classNames?.icon),
|
|
61
71
|
style: userStyles?.icon,
|
|
62
|
-
children: icon
|
|
72
|
+
children: resolveIconNode(icon)
|
|
63
73
|
}) : null,
|
|
64
74
|
children
|
|
65
75
|
] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/base-ui/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type
|
|
1
|
+
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/base-ui/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { isValidElement, type MouseEvent, type ReactNode, type Ref } from 'react';\n\nimport Icon, { type IconProps } from '@/Icon';\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { styles } from './style';\nimport type { ButtonProps } from './type';\n\nconst resolveIconNode = (node: ReactNode | IconProps['icon'] | undefined | null) => {\n if (node === undefined || node === null) return null;\n if (isValidElement(node) || typeof node === 'string' || typeof node === 'number') {\n return node;\n }\n return <Icon icon={node as any} size={'small'} />;\n};\n\nconst resolveSizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.sizeSmall;\n if (size === 'large') return styles.sizeLarge;\n return styles.sizeMiddle;\n};\n\nconst resolveIconOnlySizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.iconOnlySmall;\n if (size === 'large') return styles.iconOnlyLarge;\n return styles.iconOnlyMiddle;\n};\n\nconst resolveVariantCls = ({\n danger,\n ghost,\n type,\n}: {\n danger: boolean;\n ghost: boolean;\n type: NonNullable<ButtonProps['type']>;\n}): string => {\n if (ghost) {\n if (danger) return styles.ghostDanger;\n if (type === 'primary') return styles.ghostPrimary;\n if (type === 'dashed') return cx(styles.ghostDefault, styles.ghostDashed);\n return styles.ghostDefault;\n }\n\n switch (type) {\n case 'primary': {\n return danger ? styles.dangerSolid : styles.variantPrimary;\n }\n case 'dashed': {\n return danger ? cx(styles.variantDashed, styles.dangerOutlined) : styles.variantDashed;\n }\n case 'fill': {\n return danger ? styles.dangerFill : styles.variantFill;\n }\n case 'text': {\n return danger ? cx(styles.variantText, styles.dangerInline) : styles.variantText;\n }\n case 'link': {\n return danger ? cx(styles.variantLink, styles.dangerInline) : styles.variantLink;\n }\n default: {\n return danger ? cx(styles.variantDefault, styles.dangerOutlined) : styles.variantDefault;\n }\n }\n};\n\nconst tapAnim = { scale: 0.98 };\nconst motionTransition = {\n damping: 26,\n mass: 0.6,\n stiffness: 600,\n type: 'spring' as const,\n};\n\nconst Button = ({\n block,\n children,\n className,\n classNames,\n danger = false,\n disabled,\n ghost = false,\n href,\n htmlType = 'button',\n icon,\n iconPosition = 'start',\n loading,\n onClick,\n ref,\n shape = 'default',\n size = 'middle',\n styles: userStyles,\n target,\n type = 'default',\n ...rest\n}: ButtonProps) => {\n const Motion = useMotionComponent();\n const isDisabled = disabled || loading;\n const sizeCls = resolveSizeCls(size);\n const variantCls = resolveVariantCls({ danger, ghost, type });\n const shapeCls =\n shape === 'circle' ? styles.shapeCircle : shape === 'round' ? styles.shapeRound : undefined;\n\n const hasChildren =\n children !== undefined && children !== null && children !== false && children !== '';\n const renderIcon = loading || icon;\n const iconOnly = !hasChildren && !!renderIcon;\n const iconOnlySizeCls = iconOnly ? resolveIconOnlySizeCls(size) : undefined;\n\n const composedClassName = cx(\n styles.base,\n sizeCls,\n variantCls,\n shapeCls,\n block && styles.block,\n iconPosition === 'end' && styles.iconEnd,\n iconOnlySizeCls,\n className,\n );\n\n const spinnerNode = (\n <span\n aria-hidden={!loading}\n style={userStyles?.icon}\n className={cx(\n styles.iconBox,\n styles.spinnerSlot,\n loading && styles.spinnerSlotShow,\n iconPosition === 'end' && styles.spinnerSlotEnd,\n classNames?.icon,\n )}\n >\n <span className={styles.spinner} />\n </span>\n );\n\n const iconNode =\n icon && !loading ? (\n <span className={cx(styles.iconBox, classNames?.icon)} style={userStyles?.icon}>\n {resolveIconNode(icon)}\n </span>\n ) : null;\n\n const inner = (\n <>\n {spinnerNode}\n {iconNode}\n {children}\n </>\n );\n\n const motionGestures = isDisabled ? {} : { transition: motionTransition, whileTap: tapAnim };\n\n if (href !== undefined) {\n const handleAnchorClick = (e: MouseEvent<HTMLAnchorElement>) => {\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n onClick?.(e as unknown as MouseEvent<HTMLButtonElement>);\n };\n\n return (\n <Motion.a\n aria-disabled={isDisabled || undefined}\n href={isDisabled ? undefined : href}\n target={target}\n {...(rest as any)}\n className={composedClassName}\n ref={ref as Ref<HTMLAnchorElement>}\n onClick={handleAnchorClick}\n {...motionGestures}\n >\n {inner}\n </Motion.a>\n );\n }\n\n return (\n <Motion.button\n type={htmlType}\n {...(rest as any)}\n className={composedClassName}\n disabled={isDisabled}\n ref={ref as Ref<HTMLButtonElement>}\n onClick={onClick}\n {...motionGestures}\n >\n {inner}\n </Motion.button>\n );\n};\n\nButton.displayName = 'BaseButton';\n\nexport default Button;\n"],"mappings":"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"}
|
|
@@ -105,9 +105,15 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
105
105
|
opacity: 1;
|
|
106
106
|
`,
|
|
107
107
|
variantDefault: css`
|
|
108
|
-
color: ${cssVar.colorText};
|
|
109
108
|
background: ${cssVar.colorBgContainer};
|
|
110
109
|
|
|
110
|
+
/* &:hover/&:active included so the anchor form outranks antd's global a:hover/a:active link color */
|
|
111
|
+
&,
|
|
112
|
+
&:hover,
|
|
113
|
+
&:active {
|
|
114
|
+
color: ${cssVar.colorText};
|
|
115
|
+
}
|
|
116
|
+
|
|
111
117
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
112
118
|
border-color: ${cssVar.colorPrimaryBorder};
|
|
113
119
|
color: ${cssVar.colorPrimaryText};
|
|
@@ -115,9 +121,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
115
121
|
`,
|
|
116
122
|
variantPrimary: css`
|
|
117
123
|
border-color: ${cssVar.colorPrimary};
|
|
118
|
-
color: ${cssVar.colorBgLayout};
|
|
119
124
|
background: ${cssVar.colorPrimary};
|
|
120
125
|
|
|
126
|
+
&,
|
|
127
|
+
&:hover,
|
|
128
|
+
&:active {
|
|
129
|
+
color: ${cssVar.colorBgLayout};
|
|
130
|
+
}
|
|
131
|
+
|
|
121
132
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
122
133
|
border-color: ${cssVar.colorPrimaryHover};
|
|
123
134
|
background: ${cssVar.colorPrimaryHover};
|
|
@@ -130,9 +141,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
130
141
|
`,
|
|
131
142
|
variantDashed: css`
|
|
132
143
|
border-style: dashed;
|
|
133
|
-
color: ${cssVar.colorText};
|
|
134
144
|
background: ${cssVar.colorBgContainer};
|
|
135
145
|
|
|
146
|
+
&,
|
|
147
|
+
&:hover,
|
|
148
|
+
&:active {
|
|
149
|
+
color: ${cssVar.colorText};
|
|
150
|
+
}
|
|
151
|
+
|
|
136
152
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
137
153
|
border-color: ${cssVar.colorPrimaryBorder};
|
|
138
154
|
color: ${cssVar.colorPrimaryText};
|
|
@@ -140,9 +156,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
140
156
|
`,
|
|
141
157
|
variantFill: css`
|
|
142
158
|
border-color: transparent;
|
|
143
|
-
color: ${cssVar.colorText};
|
|
144
159
|
background: ${cssVar.colorFillTertiary};
|
|
145
160
|
|
|
161
|
+
&,
|
|
162
|
+
&:hover,
|
|
163
|
+
&:active {
|
|
164
|
+
color: ${cssVar.colorText};
|
|
165
|
+
}
|
|
166
|
+
|
|
146
167
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
147
168
|
background: ${cssVar.colorFillSecondary};
|
|
148
169
|
}
|
|
@@ -153,9 +174,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
153
174
|
`,
|
|
154
175
|
variantText: css`
|
|
155
176
|
border-color: transparent;
|
|
156
|
-
color: ${cssVar.colorText};
|
|
157
177
|
background: transparent;
|
|
158
178
|
|
|
179
|
+
&,
|
|
180
|
+
&:hover,
|
|
181
|
+
&:active {
|
|
182
|
+
color: ${cssVar.colorText};
|
|
183
|
+
}
|
|
184
|
+
|
|
159
185
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
160
186
|
background: ${cssVar.colorFillSecondary};
|
|
161
187
|
}
|
|
@@ -163,9 +189,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
163
189
|
variantLink: css`
|
|
164
190
|
padding-inline: 0;
|
|
165
191
|
border-color: transparent;
|
|
166
|
-
color: ${cssVar.colorPrimary};
|
|
167
192
|
background: transparent;
|
|
168
193
|
|
|
194
|
+
&,
|
|
195
|
+
&:hover,
|
|
196
|
+
&:active {
|
|
197
|
+
color: ${cssVar.colorPrimary};
|
|
198
|
+
}
|
|
199
|
+
|
|
169
200
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
170
201
|
color: ${cssVar.colorPrimaryHover};
|
|
171
202
|
background: transparent;
|
|
@@ -173,9 +204,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
173
204
|
`,
|
|
174
205
|
dangerOutlined: css`
|
|
175
206
|
border-color: ${cssVar.colorError};
|
|
176
|
-
color: ${cssVar.colorError};
|
|
177
207
|
background: ${cssVar.colorBgContainer};
|
|
178
208
|
|
|
209
|
+
&,
|
|
210
|
+
&:hover,
|
|
211
|
+
&:active {
|
|
212
|
+
color: ${cssVar.colorError};
|
|
213
|
+
}
|
|
214
|
+
|
|
179
215
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
180
216
|
border-color: ${cssVar.colorErrorHover};
|
|
181
217
|
color: ${cssVar.colorErrorHover};
|
|
@@ -184,9 +220,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
184
220
|
`,
|
|
185
221
|
dangerSolid: css`
|
|
186
222
|
border-color: ${cssVar.colorError};
|
|
187
|
-
color: ${cssVar.colorBgLayout};
|
|
188
223
|
background: ${cssVar.colorError};
|
|
189
224
|
|
|
225
|
+
&,
|
|
226
|
+
&:hover,
|
|
227
|
+
&:active {
|
|
228
|
+
color: ${cssVar.colorBgLayout};
|
|
229
|
+
}
|
|
230
|
+
|
|
190
231
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
191
232
|
border-color: ${cssVar.colorErrorHover};
|
|
192
233
|
background: ${cssVar.colorErrorHover};
|
|
@@ -213,7 +254,11 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
213
254
|
}
|
|
214
255
|
`,
|
|
215
256
|
dangerInline: css`
|
|
216
|
-
|
|
257
|
+
&,
|
|
258
|
+
&:hover,
|
|
259
|
+
&:active {
|
|
260
|
+
color: ${cssVar.colorError};
|
|
261
|
+
}
|
|
217
262
|
|
|
218
263
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
219
264
|
color: ${cssVar.colorErrorHover};
|
|
@@ -221,9 +266,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
221
266
|
`,
|
|
222
267
|
ghostDefault: css`
|
|
223
268
|
border-color: rgb(255 255 255 / 65%);
|
|
224
|
-
color: #fff;
|
|
225
269
|
background: transparent;
|
|
226
270
|
|
|
271
|
+
&,
|
|
272
|
+
&:hover,
|
|
273
|
+
&:active {
|
|
274
|
+
color: #fff;
|
|
275
|
+
}
|
|
276
|
+
|
|
227
277
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
228
278
|
border-color: #fff;
|
|
229
279
|
background: color-mix(in srgb, currentcolor 8%, transparent);
|
|
@@ -238,9 +288,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
238
288
|
`,
|
|
239
289
|
ghostPrimary: css`
|
|
240
290
|
border-color: ${cssVar.colorPrimary};
|
|
241
|
-
color: ${cssVar.colorPrimary};
|
|
242
291
|
background: transparent;
|
|
243
292
|
|
|
293
|
+
&,
|
|
294
|
+
&:hover,
|
|
295
|
+
&:active {
|
|
296
|
+
color: ${cssVar.colorPrimary};
|
|
297
|
+
}
|
|
298
|
+
|
|
244
299
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
245
300
|
border-color: ${cssVar.colorPrimaryHover};
|
|
246
301
|
color: ${cssVar.colorPrimaryHover};
|
|
@@ -253,9 +308,14 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
253
308
|
`,
|
|
254
309
|
ghostDanger: css`
|
|
255
310
|
border-color: ${cssVar.colorError};
|
|
256
|
-
color: ${cssVar.colorError};
|
|
257
311
|
background: transparent;
|
|
258
312
|
|
|
313
|
+
&,
|
|
314
|
+
&:hover,
|
|
315
|
+
&:active {
|
|
316
|
+
color: ${cssVar.colorError};
|
|
317
|
+
}
|
|
318
|
+
|
|
259
319
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
260
320
|
border-color: ${cssVar.colorErrorHover};
|
|
261
321
|
color: ${cssVar.colorErrorHover};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n base: css`\n cursor: pointer;\n\n display: inline-flex;\n gap: 6px;\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n border: 1px solid ${cssVar.colorBorder};\n\n font-weight: 500;\n line-height: 1;\n text-decoration: none;\n white-space: nowrap;\n\n transition:\n color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n background 160ms cubic-bezier(0.32, 0.72, 0, 1),\n border-color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n box-shadow 160ms cubic-bezier(0.32, 0.72, 0, 1);\n\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n pointer-events: none;\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n\n sizeSmall: css`\n height: 24px;\n padding-inline: 8px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 12px;\n `,\n\n sizeMiddle: css`\n height: 32px;\n padding-inline: 14px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 13px;\n `,\n\n sizeLarge: css`\n height: 40px;\n padding-inline: 16px;\n border-radius: ${cssVar.borderRadius};\n font-size: 14px;\n `,\n\n shapeCircle: css`\n padding-inline: 0;\n border-radius: 50%;\n `,\n\n shapeRound: css`\n border-radius: 999px;\n `,\n\n block: css`\n width: 100%;\n `,\n\n iconEnd: css`\n flex-direction: row-reverse;\n `,\n\n iconOnlySmall: css`\n width: 24px;\n padding-inline: 0;\n `,\n\n iconOnlyMiddle: css`\n width: 32px;\n padding-inline: 0;\n `,\n\n iconOnlyLarge: css`\n width: 40px;\n padding-inline: 0;\n `,\n\n iconBox: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n `,\n\n spinnerSlot: css`\n overflow: hidden;\n\n width: 0;\n margin-inline-end: -6px;\n\n opacity: 0;\n\n transition:\n width 380ms cubic-bezier(0.22, 1, 0.36, 1),\n margin 380ms cubic-bezier(0.22, 1, 0.36, 1),\n opacity 260ms cubic-bezier(0.22, 1, 0.36, 1);\n `,\n\n spinnerSlotEnd: css`\n margin-inline: -6px 0;\n `,\n\n spinnerSlotShow: css`\n width: 12px;\n margin-inline: 0;\n opacity: 1;\n `,\n\n variantDefault: css`\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n variantPrimary: css`\n border-color: ${cssVar.colorPrimary};\n color: ${cssVar.colorBgLayout};\n background: ${cssVar.colorPrimary};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryHover};\n background: ${cssVar.colorPrimaryHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorPrimaryActive};\n }\n `,\n\n variantDashed: css`\n border-style: dashed;\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n variantFill: css`\n border-color: transparent;\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillTertiary};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFill};\n }\n `,\n\n variantText: css`\n border-color: transparent;\n color: ${cssVar.colorText};\n background: transparent;\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFillSecondary};\n }\n `,\n\n variantLink: css`\n padding-inline: 0;\n border-color: transparent;\n color: ${cssVar.colorPrimary};\n background: transparent;\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorPrimaryHover};\n background: transparent;\n }\n `,\n\n dangerOutlined: css`\n border-color: ${cssVar.colorError};\n color: ${cssVar.colorError};\n background: ${cssVar.colorBgContainer};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorBgContainer};\n }\n `,\n\n dangerSolid: css`\n border-color: ${cssVar.colorError};\n color: ${cssVar.colorBgLayout};\n background: ${cssVar.colorError};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorActive};\n }\n `,\n\n dangerFill: css`\n border-color: transparent;\n color: ${cssVar.colorError};\n background: ${cssVar.colorErrorBg};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorBgHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorBgHover};\n }\n `,\n\n dangerInline: css`\n color: ${cssVar.colorError};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n }\n `,\n\n ghostDefault: css`\n border-color: rgb(255 255 255 / 65%);\n color: #fff;\n background: transparent;\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: #fff;\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDashed: css`\n border-style: dashed;\n `,\n\n ghostPrimary: css`\n border-color: ${cssVar.colorPrimary};\n color: ${cssVar.colorPrimary};\n background: transparent;\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryHover};\n color: ${cssVar.colorPrimaryHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDanger: css`\n border-color: ${cssVar.colorError};\n color: ${cssVar.colorError};\n background: transparent;\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n color: ${cssVar.colorErrorHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n spinner: css`\n @keyframes base-button-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n display: inline-block;\n\n width: 12px;\n height: 12px;\n border: 1.5px solid currentcolor;\n border-block-start-color: transparent;\n border-radius: 50%;\n\n animation: base-button-spin 0.6s linear infinite;\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;wBASa,OAAO,YAAY;;;;;;;;;;;;;;;8BAeb,OAAO,mBAAmB;;;;;;;;;;CAWtD,WAAW,GAAG;;;qBAGK,OAAO,eAAe;;;CAIzC,YAAY,GAAG;;;qBAGI,OAAO,eAAe;;;CAIzC,WAAW,GAAG;;;qBAGK,OAAO,aAAa;;;CAIvC,aAAa,GAAG;;;;CAKhB,YAAY,GAAG;;;CAIf,OAAO,GAAG;;;CAIV,SAAS,GAAG;;;CAIZ,eAAe,GAAG;;;;CAKlB,gBAAgB,GAAG;;;;CAKnB,eAAe,GAAG;;;;CAKlB,SAAS,GAAG;;;;;CAMZ,aAAa,GAAG;;;;;;;;;;;;;CAchB,gBAAgB,GAAG;;;CAInB,iBAAiB,GAAG;;;;;CAMpB,gBAAgB,GAAG;aACR,OAAO,UAAU;kBACZ,OAAO,iBAAiB;;;sBAGpB,OAAO,mBAAmB;eACjC,OAAO,iBAAiB;;;CAIrC,gBAAgB,GAAG;oBACD,OAAO,aAAa;aAC3B,OAAO,cAAc;kBAChB,OAAO,aAAa;;;sBAGhB,OAAO,kBAAkB;oBAC3B,OAAO,kBAAkB;;;;sBAIvB,OAAO,mBAAmB;oBAC5B,OAAO,mBAAmB;;;CAI5C,eAAe,GAAG;;aAEP,OAAO,UAAU;kBACZ,OAAO,iBAAiB;;;sBAGpB,OAAO,mBAAmB;eACjC,OAAO,iBAAiB;;;CAIrC,aAAa,GAAG;;aAEL,OAAO,UAAU;kBACZ,OAAO,kBAAkB;;;oBAGvB,OAAO,mBAAmB;;;;oBAI1B,OAAO,UAAU;;;CAInC,aAAa,GAAG;;aAEL,OAAO,UAAU;;;;oBAIV,OAAO,mBAAmB;;;CAI5C,aAAa,GAAG;;;aAGL,OAAO,aAAa;;;;eAIlB,OAAO,kBAAkB;;;;CAKtC,gBAAgB,GAAG;oBACD,OAAO,WAAW;aACzB,OAAO,WAAW;kBACb,OAAO,iBAAiB;;;sBAGpB,OAAO,gBAAgB;eAC9B,OAAO,gBAAgB;oBAClB,OAAO,iBAAiB;;;CAI1C,aAAa,GAAG;oBACE,OAAO,WAAW;aACzB,OAAO,cAAc;kBAChB,OAAO,WAAW;;;sBAGd,OAAO,gBAAgB;oBACzB,OAAO,gBAAgB;;;;sBAIrB,OAAO,iBAAiB;oBAC1B,OAAO,iBAAiB;;;CAI1C,YAAY,GAAG;;aAEJ,OAAO,WAAW;kBACb,OAAO,aAAa;;;eAGvB,OAAO,gBAAgB;oBAClB,OAAO,kBAAkB;;;;eAI9B,OAAO,iBAAiB;oBACnB,OAAO,kBAAkB;;;CAI3C,cAAc,GAAG;aACN,OAAO,WAAW;;;eAGhB,OAAO,gBAAgB;;;CAIpC,cAAc,GAAG;;;;;;;;;;;;;;CAejB,aAAa,GAAG;;;CAIhB,cAAc,GAAG;oBACC,OAAO,aAAa;aAC3B,OAAO,aAAa;;;;sBAIX,OAAO,kBAAkB;eAChC,OAAO,kBAAkB;;;;;;;;CAStC,aAAa,GAAG;oBACE,OAAO,WAAW;aACzB,OAAO,WAAW;;;;sBAIT,OAAO,gBAAgB;eAC9B,OAAO,gBAAgB;;;;;;;;CASpC,SAAS,GAAG;;;;;;;;;;;;;;;;;CAiBb,EAAE"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n base: css`\n cursor: pointer;\n\n display: inline-flex;\n gap: 6px;\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n border: 1px solid ${cssVar.colorBorder};\n\n font-weight: 500;\n line-height: 1;\n text-decoration: none;\n white-space: nowrap;\n\n transition:\n color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n background 160ms cubic-bezier(0.32, 0.72, 0, 1),\n border-color 160ms cubic-bezier(0.32, 0.72, 0, 1),\n box-shadow 160ms cubic-bezier(0.32, 0.72, 0, 1);\n\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBorder};\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n pointer-events: none;\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n\n sizeSmall: css`\n height: 24px;\n padding-inline: 8px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 12px;\n `,\n\n sizeMiddle: css`\n height: 32px;\n padding-inline: 14px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 13px;\n `,\n\n sizeLarge: css`\n height: 40px;\n padding-inline: 16px;\n border-radius: ${cssVar.borderRadius};\n font-size: 14px;\n `,\n\n shapeCircle: css`\n padding-inline: 0;\n border-radius: 50%;\n `,\n\n shapeRound: css`\n border-radius: 999px;\n `,\n\n block: css`\n width: 100%;\n `,\n\n iconEnd: css`\n flex-direction: row-reverse;\n `,\n\n iconOnlySmall: css`\n width: 24px;\n padding-inline: 0;\n `,\n\n iconOnlyMiddle: css`\n width: 32px;\n padding-inline: 0;\n `,\n\n iconOnlyLarge: css`\n width: 40px;\n padding-inline: 0;\n `,\n\n iconBox: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n `,\n\n spinnerSlot: css`\n overflow: hidden;\n\n width: 0;\n margin-inline-end: -6px;\n\n opacity: 0;\n\n transition:\n width 380ms cubic-bezier(0.22, 1, 0.36, 1),\n margin 380ms cubic-bezier(0.22, 1, 0.36, 1),\n opacity 260ms cubic-bezier(0.22, 1, 0.36, 1);\n `,\n\n spinnerSlotEnd: css`\n margin-inline: -6px 0;\n `,\n\n spinnerSlotShow: css`\n width: 12px;\n margin-inline: 0;\n opacity: 1;\n `,\n\n variantDefault: css`\n background: ${cssVar.colorBgContainer};\n\n /* &:hover/&:active included so the anchor form outranks antd's global a:hover/a:active link color */\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorText};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n variantPrimary: css`\n border-color: ${cssVar.colorPrimary};\n background: ${cssVar.colorPrimary};\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorBgLayout};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryHover};\n background: ${cssVar.colorPrimaryHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorPrimaryActive};\n }\n `,\n\n variantDashed: css`\n border-style: dashed;\n background: ${cssVar.colorBgContainer};\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorText};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n variantFill: css`\n border-color: transparent;\n background: ${cssVar.colorFillTertiary};\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorText};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFill};\n }\n `,\n\n variantText: css`\n border-color: transparent;\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorText};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFillSecondary};\n }\n `,\n\n variantLink: css`\n padding-inline: 0;\n border-color: transparent;\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorPrimary};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorPrimaryHover};\n background: transparent;\n }\n `,\n\n dangerOutlined: css`\n border-color: ${cssVar.colorError};\n background: ${cssVar.colorBgContainer};\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorBgContainer};\n }\n `,\n\n dangerSolid: css`\n border-color: ${cssVar.colorError};\n background: ${cssVar.colorError};\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorBgLayout};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorActive};\n }\n `,\n\n dangerFill: css`\n border-color: transparent;\n color: ${cssVar.colorError};\n background: ${cssVar.colorErrorBg};\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorBgHover};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorBgHover};\n }\n `,\n\n dangerInline: css`\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n }\n `,\n\n ghostDefault: css`\n border-color: rgb(255 255 255 / 65%);\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: #fff;\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: #fff;\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDashed: css`\n border-style: dashed;\n `,\n\n ghostPrimary: css`\n border-color: ${cssVar.colorPrimary};\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorPrimary};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryHover};\n color: ${cssVar.colorPrimaryHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDanger: css`\n border-color: ${cssVar.colorError};\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n color: ${cssVar.colorErrorHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n spinner: css`\n @keyframes base-button-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n display: inline-block;\n\n width: 12px;\n height: 12px;\n border: 1.5px solid currentcolor;\n border-block-start-color: transparent;\n border-radius: 50%;\n\n animation: base-button-spin 0.6s linear infinite;\n `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;wBASa,OAAO,YAAY;;;;;;;;;;;;;;;8BAeb,OAAO,mBAAmB;;;;;;;;;;CAWtD,WAAW,GAAG;;;qBAGK,OAAO,eAAe;;;CAIzC,YAAY,GAAG;;;qBAGI,OAAO,eAAe;;;CAIzC,WAAW,GAAG;;;qBAGK,OAAO,aAAa;;;CAIvC,aAAa,GAAG;;;;CAKhB,YAAY,GAAG;;;CAIf,OAAO,GAAG;;;CAIV,SAAS,GAAG;;;CAIZ,eAAe,GAAG;;;;CAKlB,gBAAgB,GAAG;;;;CAKnB,eAAe,GAAG;;;;CAKlB,SAAS,GAAG;;;;;CAMZ,aAAa,GAAG;;;;;;;;;;;;;CAchB,gBAAgB,GAAG;;;CAInB,iBAAiB,GAAG;;;;;CAMpB,gBAAgB,GAAG;kBACH,OAAO,iBAAiB;;;;;;eAM3B,OAAO,UAAU;;;;sBAIV,OAAO,mBAAmB;eACjC,OAAO,iBAAiB;;;CAIrC,gBAAgB,GAAG;oBACD,OAAO,aAAa;kBACtB,OAAO,aAAa;;;;;eAKvB,OAAO,cAAc;;;;sBAId,OAAO,kBAAkB;oBAC3B,OAAO,kBAAkB;;;;sBAIvB,OAAO,mBAAmB;oBAC5B,OAAO,mBAAmB;;;CAI5C,eAAe,GAAG;;kBAEF,OAAO,iBAAiB;;;;;eAK3B,OAAO,UAAU;;;;sBAIV,OAAO,mBAAmB;eACjC,OAAO,iBAAiB;;;CAIrC,aAAa,GAAG;;kBAEA,OAAO,kBAAkB;;;;;eAK5B,OAAO,UAAU;;;;oBAIZ,OAAO,mBAAmB;;;;oBAI1B,OAAO,UAAU;;;CAInC,aAAa,GAAG;;;;;;;eAOH,OAAO,UAAU;;;;oBAIZ,OAAO,mBAAmB;;;CAI5C,aAAa,GAAG;;;;;;;;eAQH,OAAO,aAAa;;;;eAIpB,OAAO,kBAAkB;;;;CAKtC,gBAAgB,GAAG;oBACD,OAAO,WAAW;kBACpB,OAAO,iBAAiB;;;;;eAK3B,OAAO,WAAW;;;;sBAIX,OAAO,gBAAgB;eAC9B,OAAO,gBAAgB;oBAClB,OAAO,iBAAiB;;;CAI1C,aAAa,GAAG;oBACE,OAAO,WAAW;kBACpB,OAAO,WAAW;;;;;eAKrB,OAAO,cAAc;;;;sBAId,OAAO,gBAAgB;oBACzB,OAAO,gBAAgB;;;;sBAIrB,OAAO,iBAAiB;oBAC1B,OAAO,iBAAiB;;;CAI1C,YAAY,GAAG;;aAEJ,OAAO,WAAW;kBACb,OAAO,aAAa;;;eAGvB,OAAO,gBAAgB;oBAClB,OAAO,kBAAkB;;;;eAI9B,OAAO,iBAAiB;oBACnB,OAAO,kBAAkB;;;CAI3C,cAAc,GAAG;;;;eAIJ,OAAO,WAAW;;;;eAIlB,OAAO,gBAAgB;;;CAIpC,cAAc,GAAG;;;;;;;;;;;;;;;;;;;CAoBjB,aAAa,GAAG;;;CAIhB,cAAc,GAAG;oBACC,OAAO,aAAa;;;;;;eAMzB,OAAO,aAAa;;;;sBAIb,OAAO,kBAAkB;eAChC,OAAO,kBAAkB;;;;;;;;CAStC,aAAa,GAAG;oBACE,OAAO,WAAW;;;;;;eAMvB,OAAO,WAAW;;;;sBAIX,OAAO,gBAAgB;eAC9B,OAAO,gBAAgB;;;;;;;;CASpC,SAAS,GAAG;;;;;;;;;;;;;;;;;CAiBb,EAAE"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { IconProps } from "../../Icon/type.mjs";
|
|
1
2
|
import { AnchorHTMLAttributes, ButtonHTMLAttributes, CSSProperties, ReactNode, Ref } from "react";
|
|
2
3
|
|
|
3
4
|
//#region src/base-ui/Button/type.d.ts
|
|
@@ -16,7 +17,7 @@ interface BaseButtonOwnProps {
|
|
|
16
17
|
ghost?: boolean;
|
|
17
18
|
href?: string;
|
|
18
19
|
htmlType?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
|
|
19
|
-
icon?: ReactNode;
|
|
20
|
+
icon?: IconProps['icon'] | ReactNode;
|
|
20
21
|
iconPosition?: ButtonIconPosition;
|
|
21
22
|
loading?: boolean;
|
|
22
23
|
ref?: Ref<HTMLButtonElement | HTMLAnchorElement>;
|