@lobehub/ui 5.36.5 → 5.37.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/base-ui/ActionIcon/ActionIcon.d.mts +3 -2
- package/es/base-ui/ActionIcon/ActionIcon.mjs +9 -5
- package/es/base-ui/ActionIcon/ActionIcon.mjs.map +1 -1
- package/es/base-ui/ActionIcon/index.d.mts +2 -2
- package/es/base-ui/ActionIcon/type.d.mts +17 -3
- package/es/base-ui/ActionIcon/utils.mjs +23 -1
- package/es/base-ui/ActionIcon/utils.mjs.map +1 -1
- package/es/base-ui/Button/Button.d.mts +3 -5
- package/es/base-ui/Button/Button.mjs +5 -3
- package/es/base-ui/Button/Button.mjs.map +1 -1
- package/es/base-ui/Button/index.d.mts +3 -3
- package/es/base-ui/Button/style.d.mts +8 -1
- package/es/base-ui/Button/style.mjs +27 -4
- package/es/base-ui/Button/style.mjs.map +1 -1
- package/es/base-ui/Button/type.d.mts +17 -5
- package/es/base-ui/Input/style.d.mts +1 -1
- package/es/base-ui/Text/style.mjs +27 -28
- package/es/base-ui/Text/style.mjs.map +1 -1
- package/es/base-ui/index.d.mts +4 -4
- package/es/base-ui/index.mjs +2 -2
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { ActionIconProps } from "./type.mjs";
|
|
1
|
+
import { ActionIconProps, ActionIconVariant } from "./type.mjs";
|
|
2
|
+
import { ReactElement } from "react";
|
|
2
3
|
//#region src/base-ui/ActionIcon/ActionIcon.d.ts
|
|
3
|
-
declare const ActionIcon:
|
|
4
|
+
declare const ActionIcon: <V extends ActionIconVariant = "borderless">(props: ActionIconProps<V>) => ReactElement;
|
|
4
5
|
//#endregion
|
|
5
6
|
export { ActionIcon as default };
|
|
6
7
|
//# sourceMappingURL=ActionIcon.d.mts.map
|
|
@@ -3,7 +3,7 @@ import Icon from "../../Icon/Icon.mjs";
|
|
|
3
3
|
import { Tooltip } from "../Tooltip/Tooltip.mjs";
|
|
4
4
|
import Button from "../Button/Button.mjs";
|
|
5
5
|
import { variants } from "./style.mjs";
|
|
6
|
-
import { calcSize } from "./utils.mjs";
|
|
6
|
+
import { calcOutdent, calcSize } from "./utils.mjs";
|
|
7
7
|
import { memo, useMemo } from "react";
|
|
8
8
|
import { jsx } from "react/jsx-runtime";
|
|
9
9
|
import { cx } from "antd-style";
|
|
@@ -18,7 +18,7 @@ const resolveButtonSize = (size) => {
|
|
|
18
18
|
if (size === "large") return "large";
|
|
19
19
|
return "middle";
|
|
20
20
|
};
|
|
21
|
-
const
|
|
21
|
+
const ActionIconImpl = memo(({ active, className, classNames, color, danger, disabled, fill, fillOpacity, fillRule, focusable, glass, icon, loading, onClick, outdent, ref, shadow, size = "middle", spin: iconSpinning, style, styles: slotStyles, title, tooltipProps, variant = "borderless", ...rest }) => {
|
|
22
22
|
const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);
|
|
23
23
|
const popupTriggerAria = rest;
|
|
24
24
|
const isPopupTrigger = popupTriggerAria["aria-haspopup"] !== void 0 || popupTriggerAria["aria-expanded"] !== void 0;
|
|
@@ -38,9 +38,11 @@ const ActionIcon = memo(({ active, className, classNames, color, danger, disable
|
|
|
38
38
|
spin: iconSpinning,
|
|
39
39
|
style: {
|
|
40
40
|
pointerEvents: "none",
|
|
41
|
-
...
|
|
41
|
+
...slotStyles?.icon
|
|
42
42
|
}
|
|
43
43
|
}) : void 0;
|
|
44
|
+
const outdentAmount = variant === "borderless" && outdent ? calcOutdent(size) : void 0;
|
|
45
|
+
const outdentMargin = outdentAmount ? outdent === "end" ? { marginInlineEnd: `-${outdentAmount}` } : { marginInlineStart: `-${outdentAmount}` } : void 0;
|
|
44
46
|
const node = /* @__PURE__ */ jsx(Button, {
|
|
45
47
|
...rest,
|
|
46
48
|
"aria-label": popupTriggerLabel,
|
|
@@ -60,10 +62,11 @@ const ActionIcon = memo(({ active, className, classNames, color, danger, disable
|
|
|
60
62
|
tabIndex: disabled ? -1 : 0,
|
|
61
63
|
type: resolveButtonType(variant),
|
|
62
64
|
style: {
|
|
65
|
+
...outdentMargin,
|
|
63
66
|
borderRadius,
|
|
64
67
|
height: blockSize,
|
|
65
68
|
width: blockSize,
|
|
66
|
-
...
|
|
69
|
+
...slotStyles?.root,
|
|
67
70
|
...style
|
|
68
71
|
},
|
|
69
72
|
onClick: handleClick
|
|
@@ -82,7 +85,8 @@ const ActionIcon = memo(({ active, className, classNames, color, danger, disable
|
|
|
82
85
|
children: node
|
|
83
86
|
});
|
|
84
87
|
});
|
|
85
|
-
|
|
88
|
+
ActionIconImpl.displayName = "BaseActionIcon";
|
|
89
|
+
const ActionIcon = ActionIconImpl;
|
|
86
90
|
//#endregion
|
|
87
91
|
export { ActionIcon as default };
|
|
88
92
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { MouseEvent, Ref } from 'react';\nimport { memo, useMemo } from 'react';\n\nimport type { ButtonProps } from '@/base-ui/Button';\nimport Button from '@/base-ui/Button';\nimport Tooltip from '@/base-ui/Tooltip';\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport {
|
|
1
|
+
{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { MouseEvent, ReactElement, Ref } from 'react';\nimport { memo, useMemo } from 'react';\n\nimport type { ButtonProps } from '@/base-ui/Button';\nimport Button from '@/base-ui/Button';\nimport Tooltip from '@/base-ui/Tooltip';\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport type { ActionIconOutdent, ActionIconProps, ActionIconVariant } from './type';\nimport { calcOutdent, calcSize } from './utils';\n\nconst resolveButtonType = (variant: ActionIconProps['variant']) => {\n if (variant === 'filled') return 'fill' as const;\n if (variant === 'outlined') return 'default' as const;\n return 'text' as const;\n};\n\nconst resolveButtonSize = (size: ActionIconProps['size']) => {\n if (size === 'small') return 'small' as const;\n if (size === 'large') return 'large' as const;\n return 'middle' as const;\n};\n\ntype ActionIconImplProps = Omit<ActionIconProps, 'outdent' | 'variant'> & {\n outdent?: ActionIconOutdent;\n variant?: ActionIconVariant;\n};\n\nconst ActionIconImpl = memo<ActionIconImplProps>(\n ({\n active,\n className,\n classNames,\n color,\n danger,\n disabled,\n fill,\n fillOpacity,\n fillRule,\n focusable,\n glass,\n icon,\n loading,\n onClick,\n outdent,\n ref,\n shadow,\n size = 'middle',\n spin: iconSpinning,\n style,\n styles: slotStyles,\n title,\n tooltipProps,\n variant = 'borderless',\n ...rest\n }) => {\n const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);\n const popupTriggerAria = rest as {\n 'aria-expanded'?: unknown;\n 'aria-haspopup'?: unknown;\n 'aria-label'?: string;\n };\n const isPopupTrigger =\n popupTriggerAria['aria-haspopup'] !== undefined ||\n popupTriggerAria['aria-expanded'] !== undefined;\n const popupTriggerLabel =\n popupTriggerAria['aria-label'] ??\n (isPopupTrigger && typeof title === 'string' ? title : undefined);\n\n const handleClick: ButtonProps['onClick'] = (event) => {\n onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n };\n\n const iconNode = icon ? (\n <Icon\n className={classNames?.icon}\n color={color}\n fill={fill}\n fillOpacity={fillOpacity}\n fillRule={fillRule}\n focusable={focusable}\n icon={icon}\n size={size}\n spin={iconSpinning}\n style={{ pointerEvents: 'none', ...slotStyles?.icon }}\n />\n ) : undefined;\n\n const outdentAmount = variant === 'borderless' && outdent ? calcOutdent(size) : undefined;\n const outdentMargin = outdentAmount\n ? outdent === 'end'\n ? { marginInlineEnd: `-${outdentAmount}` }\n : { marginInlineStart: `-${outdentAmount}` }\n : undefined;\n\n const node = (\n <Button\n {...(rest as unknown as ButtonProps)}\n aria-label={popupTriggerLabel}\n className={cx(variants({ active, danger, glass, shadow }), classNames?.root, className)}\n danger={danger}\n disabled={disabled}\n htmlType=\"button\"\n icon={iconNode}\n loading={loading}\n ref={ref as unknown as Ref<HTMLButtonElement>}\n size={resolveButtonSize(size)}\n tabIndex={disabled ? -1 : 0}\n type={resolveButtonType(variant)}\n style={{\n ...outdentMargin,\n borderRadius,\n height: blockSize,\n width: blockSize,\n ...slotStyles?.root,\n ...style,\n }}\n onClick={handleClick}\n />\n );\n\n if (!title) return node;\n\n return (\n <Tooltip\n title={title}\n {...tooltipProps}\n styles={{\n ...tooltipProps?.styles,\n container: { pointerEvents: 'none', ...tooltipProps?.styles?.container },\n }}\n >\n {node}\n </Tooltip>\n );\n },\n);\n\nActionIconImpl.displayName = 'BaseActionIcon';\n\nconst ActionIcon = ActionIconImpl as unknown as <V extends ActionIconVariant = 'borderless'>(\n props: ActionIconProps<V>,\n) => ReactElement;\n\nexport default ActionIcon;\n"],"mappings":";;;;;;;;;;AAeA,MAAM,qBAAqB,YAAwC;CACjE,IAAI,YAAY,UAAU,OAAO;CACjC,IAAI,YAAY,YAAY,OAAO;CACnC,OAAO;AACT;AAEA,MAAM,qBAAqB,SAAkC;CAC3D,IAAI,SAAS,SAAS,OAAO;CAC7B,IAAI,SAAS,SAAS,OAAO;CAC7B,OAAO;AACT;AAOA,MAAM,iBAAiB,MACpB,EACC,QACA,WACA,YACA,OACA,QACA,UACA,MACA,aACA,UACA,WACA,OACA,MACA,SACA,SACA,SACA,KACA,QACA,OAAO,UACP,MAAM,cACN,OACA,QAAQ,YACR,OACA,cACA,UAAU,cACV,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,iBAAiB,cAAc,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;CACxE,MAAM,mBAAmB;CAKzB,MAAM,iBACJ,iBAAiB,qBAAqB,KAAA,KACtC,iBAAiB,qBAAqB,KAAA;CACxC,MAAM,oBACJ,iBAAiB,kBAChB,kBAAkB,OAAO,UAAU,WAAW,QAAQ,KAAA;CAEzD,MAAM,eAAuC,UAAU;EACrD,UAAU,KAA8C;CAC1D;CAEA,MAAM,WAAW,OACf,oBAAC,MAAD;EACE,WAAW,YAAY;EAChB;EACD;EACO;EACH;EACC;EACL;EACA;EACN,MAAM;EACN,OAAO;GAAE,eAAe;GAAQ,GAAG,YAAY;EAAK;CACrD,CAAA,IACC,KAAA;CAEJ,MAAM,gBAAgB,YAAY,gBAAgB,UAAU,YAAY,IAAI,IAAI,KAAA;CAChF,MAAM,gBAAgB,gBAClB,YAAY,QACV,EAAE,iBAAiB,IAAI,gBAAgB,IACvC,EAAE,mBAAmB,IAAI,gBAAgB,IAC3C,KAAA;CAEJ,MAAM,OACJ,oBAAC,QAAD;EACE,GAAK;EACL,cAAY;EACZ,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAQ;GAAO;EAAO,CAAC,GAAG,YAAY,MAAM,SAAS;EAC9E;EACE;EACV,UAAS;EACT,MAAM;EACG;EACJ;EACL,MAAM,kBAAkB,IAAI;EAC5B,UAAU,WAAW,KAAK;EAC1B,MAAM,kBAAkB,OAAO;EAC/B,OAAO;GACL,GAAG;GACH;GACA,QAAQ;GACR,OAAO;GACP,GAAG,YAAY;GACf,GAAG;EACL;EACA,SAAS;CACV,CAAA;CAGH,IAAI,CAAC,OAAO,OAAO;CAEnB,OACE,oBAAC,SAAD;EACS;EACP,GAAI;EACJ,QAAQ;GACN,GAAG,cAAc;GACjB,WAAW;IAAE,eAAe;IAAQ,GAAG,cAAc,QAAQ;GAAU;EACzE;EAEC,UAAA;CACM,CAAA;AAEb,CACF;AAEA,eAAe,cAAc;AAE7B,MAAM,aAAa"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ActionIconClassNames, ActionIconProps, ActionIconSize, ActionIconStyles } from "./type.mjs";
|
|
1
|
+
import { ActionIconClassNames, ActionIconOutdent, ActionIconProps, ActionIconSize, ActionIconStyles, ActionIconVariant } from "./type.mjs";
|
|
2
2
|
import ActionIcon from "./ActionIcon.mjs";
|
|
3
3
|
import { styles } from "./style.mjs";
|
|
4
|
-
export { type ActionIconClassNames, type ActionIconProps, type ActionIconSize, type ActionIconStyles, styles as actionIconStyles, ActionIcon as default };
|
|
4
|
+
export { type ActionIconClassNames, type ActionIconOutdent, type ActionIconProps, type ActionIconSize, type ActionIconStyles, type ActionIconVariant, styles as actionIconStyles, ActionIcon as default };
|
|
@@ -11,6 +11,8 @@ interface ActionIconSizeConfig extends IconSizeConfig {
|
|
|
11
11
|
borderRadius?: number | string;
|
|
12
12
|
}
|
|
13
13
|
type ActionIconSize = number | IconSizeType | ActionIconSizeConfig;
|
|
14
|
+
type ActionIconVariant = 'borderless' | 'filled' | 'outlined';
|
|
15
|
+
type ActionIconOutdent = boolean | 'start' | 'end';
|
|
14
16
|
interface ActionIconClassNames {
|
|
15
17
|
icon?: string;
|
|
16
18
|
root?: string;
|
|
@@ -19,7 +21,7 @@ interface ActionIconStyles {
|
|
|
19
21
|
icon?: CSSProperties;
|
|
20
22
|
root?: CSSProperties;
|
|
21
23
|
}
|
|
22
|
-
interface
|
|
24
|
+
interface BaseActionIconOwnProps extends Partial<LucideIconProps>, Omit<CenterProps, 'title' | 'children'> {
|
|
23
25
|
active?: boolean;
|
|
24
26
|
classNames?: ActionIconClassNames;
|
|
25
27
|
danger?: boolean;
|
|
@@ -34,8 +36,20 @@ interface ActionIconProps extends Partial<LucideIconProps>, Omit<CenterProps, 't
|
|
|
34
36
|
styles?: ActionIconStyles;
|
|
35
37
|
title?: TooltipProps['title'];
|
|
36
38
|
tooltipProps?: Omit<TooltipProps, 'children' | 'title'>;
|
|
37
|
-
variant?: 'borderless' | 'filled' | 'outlined';
|
|
38
39
|
}
|
|
40
|
+
type BorderlessOutdentProps<V extends ActionIconVariant> = [V] extends ['borderless'] ? {
|
|
41
|
+
/**
|
|
42
|
+
* Cancels this size's icon inset (half of block − glyph) with a negative
|
|
43
|
+
* margin so a borderless ActionIcon lines up with adjacent copy. `true` /
|
|
44
|
+
* `'start'` outdent the start edge; `'end'` outdents the end edge.
|
|
45
|
+
*/
|
|
46
|
+
outdent?: ActionIconOutdent;
|
|
47
|
+
variant?: V;
|
|
48
|
+
} : {
|
|
49
|
+
outdent?: never;
|
|
50
|
+
variant?: V;
|
|
51
|
+
};
|
|
52
|
+
type ActionIconProps<V extends ActionIconVariant = ActionIconVariant> = BaseActionIconOwnProps & BorderlessOutdentProps<V>;
|
|
39
53
|
//#endregion
|
|
40
|
-
export { ActionIconClassNames, ActionIconProps, ActionIconSize, ActionIconStyles };
|
|
54
|
+
export { ActionIconClassNames, ActionIconOutdent, ActionIconProps, ActionIconSize, ActionIconStyles, ActionIconVariant };
|
|
41
55
|
//# sourceMappingURL=type.d.mts.map
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import { isNumber } from "es-toolkit/compat";
|
|
2
2
|
//#region src/base-ui/ActionIcon/utils.ts
|
|
3
|
+
const actionIconOutdent = {
|
|
4
|
+
large: 10,
|
|
5
|
+
middle: 8,
|
|
6
|
+
small: 5
|
|
7
|
+
};
|
|
8
|
+
const toCss = (value) => isNumber(value) ? `${value}px` : value;
|
|
3
9
|
const calcSize = (iconSize) => {
|
|
4
10
|
let blockSize;
|
|
5
11
|
let borderRadius;
|
|
@@ -36,7 +42,23 @@ const calcSize = (iconSize) => {
|
|
|
36
42
|
borderRadius
|
|
37
43
|
};
|
|
38
44
|
};
|
|
45
|
+
const calcOutdent = (iconSize) => {
|
|
46
|
+
if (isNumber(iconSize)) return `${iconSize * .4}px`;
|
|
47
|
+
switch (iconSize) {
|
|
48
|
+
case "large": return `${actionIconOutdent.large}px`;
|
|
49
|
+
case "middle": return `${actionIconOutdent.middle}px`;
|
|
50
|
+
case "small": return `${actionIconOutdent.small}px`;
|
|
51
|
+
default:
|
|
52
|
+
if (iconSize) {
|
|
53
|
+
const { blockSize } = calcSize(iconSize);
|
|
54
|
+
const glyph = iconSize.size ?? 24;
|
|
55
|
+
if (isNumber(blockSize) && isNumber(glyph)) return `${Math.max(0, (blockSize - glyph) / 2)}px`;
|
|
56
|
+
return `calc((${toCss(blockSize)} - ${toCss(glyph)}) / 2)`;
|
|
57
|
+
}
|
|
58
|
+
return "0.4em";
|
|
59
|
+
}
|
|
60
|
+
};
|
|
39
61
|
//#endregion
|
|
40
|
-
export { calcSize };
|
|
62
|
+
export { actionIconOutdent, calcOutdent, calcSize };
|
|
41
63
|
|
|
42
64
|
//# sourceMappingURL=utils.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/utils.ts"],"sourcesContent":["import { isNumber } from 'es-toolkit/compat';\n\nimport type { ActionIconSize } from './type';\n\nexport const calcSize = (iconSize?: ActionIconSize) => {\n let blockSize: number | string;\n let borderRadius: number | string;\n\n if (isNumber(iconSize)) {\n const blockSize = iconSize * 1.8;\n return {\n blockSize,\n borderRadius: Math.floor(blockSize / 6),\n };\n }\n\n switch (iconSize) {\n case 'large': {\n blockSize = 44;\n borderRadius = 8;\n break;\n }\n case 'middle': {\n blockSize = 36;\n borderRadius = 6;\n break;\n }\n case 'small': {\n blockSize = 24;\n borderRadius = 4;\n break;\n }\n default: {\n if (iconSize) {\n blockSize = iconSize?.blockSize || 36;\n borderRadius = iconSize?.borderRadius || 6;\n } else {\n blockSize = '1.8em';\n borderRadius = '0.3em';\n }\n\n break;\n }\n }\n\n return {\n blockSize,\n borderRadius,\n };\n};\n"],"mappings":";;AAIA,MAAa,YAAY,aAA8B;CACrD,IAAI;CACJ,IAAI;CAEJ,IAAI,SAAS,QAAQ,GAAG;EACtB,MAAM,YAAY,WAAW;EAC7B,OAAO;GACL;GACA,cAAc,KAAK,MAAM,YAAY,CAAC;EACxC;CACF;CAEA,QAAQ,UAAR;EACE,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,SACE,IAAI,UAAU;GACZ,YAAY,UAAU,aAAa;GACnC,eAAe,UAAU,gBAAgB;EAC3C,OAAO;GACL,YAAY;GACZ,eAAe;EACjB;CAIJ;CAEA,OAAO;EACL;EACA;CACF;AACF"}
|
|
1
|
+
{"version":3,"file":"utils.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/utils.ts"],"sourcesContent":["import { isNumber } from 'es-toolkit/compat';\n\nimport type { ActionIconSize } from './type';\n\nexport const actionIconOutdent = {\n large: 10,\n middle: 8,\n small: 5,\n} as const;\n\nconst toCss = (value: number | string) => (isNumber(value) ? `${value}px` : value);\n\nexport const calcSize = (iconSize?: ActionIconSize) => {\n let blockSize: number | string;\n let borderRadius: number | string;\n\n if (isNumber(iconSize)) {\n const blockSize = iconSize * 1.8;\n return {\n blockSize,\n borderRadius: Math.floor(blockSize / 6),\n };\n }\n\n switch (iconSize) {\n case 'large': {\n blockSize = 44;\n borderRadius = 8;\n break;\n }\n case 'middle': {\n blockSize = 36;\n borderRadius = 6;\n break;\n }\n case 'small': {\n blockSize = 24;\n borderRadius = 4;\n break;\n }\n default: {\n if (iconSize) {\n blockSize = iconSize?.blockSize || 36;\n borderRadius = iconSize?.borderRadius || 6;\n } else {\n blockSize = '1.8em';\n borderRadius = '0.3em';\n }\n\n break;\n }\n }\n\n return {\n blockSize,\n borderRadius,\n };\n};\n\nexport const calcOutdent = (iconSize?: ActionIconSize) => {\n if (isNumber(iconSize)) {\n return `${iconSize * 0.4}px`;\n }\n\n switch (iconSize) {\n case 'large': {\n return `${actionIconOutdent.large}px`;\n }\n case 'middle': {\n return `${actionIconOutdent.middle}px`;\n }\n case 'small': {\n return `${actionIconOutdent.small}px`;\n }\n default: {\n if (iconSize) {\n const { blockSize } = calcSize(iconSize);\n const glyph = iconSize.size ?? 24;\n if (isNumber(blockSize) && isNumber(glyph)) {\n return `${Math.max(0, (blockSize - glyph) / 2)}px`;\n }\n return `calc((${toCss(blockSize)} - ${toCss(glyph)}) / 2)`;\n }\n return '0.4em';\n }\n }\n};\n"],"mappings":";;AAIA,MAAa,oBAAoB;CAC/B,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,SAAS,UAA4B,SAAS,KAAK,IAAI,GAAG,MAAM,MAAM;AAE5E,MAAa,YAAY,aAA8B;CACrD,IAAI;CACJ,IAAI;CAEJ,IAAI,SAAS,QAAQ,GAAG;EACtB,MAAM,YAAY,WAAW;EAC7B,OAAO;GACL;GACA,cAAc,KAAK,MAAM,YAAY,CAAC;EACxC;CACF;CAEA,QAAQ,UAAR;EACE,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,KAAK;GACH,YAAY;GACZ,eAAe;GACf;EAEF,SACE,IAAI,UAAU;GACZ,YAAY,UAAU,aAAa;GACnC,eAAe,UAAU,gBAAgB;EAC3C,OAAO;GACL,YAAY;GACZ,eAAe;EACjB;CAIJ;CAEA,OAAO;EACL;EACA;CACF;AACF;AAEA,MAAa,eAAe,aAA8B;CACxD,IAAI,SAAS,QAAQ,GACnB,OAAO,GAAG,WAAW,GAAI;CAG3B,QAAQ,UAAR;EACE,KAAK,SACH,OAAO,GAAG,kBAAkB,MAAM;EAEpC,KAAK,UACH,OAAO,GAAG,kBAAkB,OAAO;EAErC,KAAK,SACH,OAAO,GAAG,kBAAkB,MAAM;EAEpC;GACE,IAAI,UAAU;IACZ,MAAM,EAAE,cAAc,SAAS,QAAQ;IACvC,MAAM,QAAQ,SAAS,QAAQ;IAC/B,IAAI,SAAS,SAAS,KAAK,SAAS,KAAK,GACvC,OAAO,GAAG,KAAK,IAAI,IAAI,YAAY,SAAS,CAAC,EAAE;IAEjD,OAAO,SAAS,MAAM,SAAS,EAAE,KAAK,MAAM,KAAK,EAAE;GACrD;GACA,OAAO;CAEX;AACF"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import { ButtonProps } from "./type.mjs";
|
|
1
|
+
import { ButtonProps, ButtonType } from "./type.mjs";
|
|
2
|
+
import { ReactElement } from "react";
|
|
2
3
|
//#region src/base-ui/Button/Button.d.ts
|
|
3
|
-
declare const Button:
|
|
4
|
-
({ block, children, className, classNames, danger, disabled, ghost, href, htmlType, icon, iconPosition, loading, onClick, ref, shape, size, styles: userStyles, target, type, ...rest }: ButtonProps): import("react").JSX.Element;
|
|
5
|
-
displayName: string;
|
|
6
|
-
};
|
|
4
|
+
declare const Button: <T extends ButtonType = "default">(props: ButtonProps<T>) => ReactElement;
|
|
7
5
|
//#endregion
|
|
8
6
|
export { Button as default };
|
|
9
7
|
//# sourceMappingURL=Button.d.mts.map
|
|
@@ -46,7 +46,7 @@ const motionTransition = {
|
|
|
46
46
|
stiffness: 600,
|
|
47
47
|
type: "spring"
|
|
48
48
|
};
|
|
49
|
-
const
|
|
49
|
+
const ButtonImpl = ({ block, children, className, classNames, danger = false, disabled, outdent, ghost = false, href, htmlType = "button", icon, iconPosition = "start", loading, onClick, ref, shape = "default", size = "middle", styles: userStyles, target, type = "default", ...rest }) => {
|
|
50
50
|
const Motion = useMotionComponent();
|
|
51
51
|
const isInteractionDisabled = disabled || loading;
|
|
52
52
|
const sizeCls = resolveSizeCls(size);
|
|
@@ -57,7 +57,8 @@ const Button = ({ block, children, className, classNames, danger = false, disabl
|
|
|
57
57
|
});
|
|
58
58
|
const shapeCls = shape === "circle" ? styles.shapeCircle : shape === "round" ? styles.shapeRound : void 0;
|
|
59
59
|
const iconOnlySizeCls = !(children !== void 0 && children !== null && children !== false && children !== "") && !!(loading || icon) ? resolveIconOnlySizeCls(size) : void 0;
|
|
60
|
-
const
|
|
60
|
+
const outdentCls = type === "text" && outdent ? outdent === "end" ? styles.outdentEnd : styles.outdentStart : void 0;
|
|
61
|
+
const composedClassName = cx(styles.base, sizeCls, variantCls, shapeCls, block && styles.block, iconPosition === "end" && styles.iconEnd, iconOnlySizeCls, outdentCls, className);
|
|
61
62
|
const spinnerNode = /* @__PURE__ */ jsx("span", {
|
|
62
63
|
"aria-hidden": !loading,
|
|
63
64
|
style: userStyles?.icon,
|
|
@@ -119,7 +120,8 @@ const Button = ({ block, children, className, classNames, danger = false, disabl
|
|
|
119
120
|
children: inner
|
|
120
121
|
});
|
|
121
122
|
};
|
|
122
|
-
|
|
123
|
+
ButtonImpl.displayName = "BaseButton";
|
|
124
|
+
const Button = ButtonImpl;
|
|
123
125
|
//#endregion
|
|
124
126
|
export { Button as default };
|
|
125
127
|
|
|
@@ -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 {
|
|
1
|
+
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/base-ui/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport {\n isValidElement,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from 'react';\n\nimport Icon, { type IconProps } from '@/Icon';\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { styles } from './style';\nimport type { ButtonOutdent, ButtonProps, ButtonType } 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 // `text` and `link` already drop the surface, so `ghost` there would only cost them\n // their own traits (link's zero inline padding).\n if (ghost && type !== 'text' && type !== 'link') {\n if (danger) return styles.ghostDanger;\n if (type === 'primary') return styles.ghostPrimary;\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\ntype ButtonImplProps = Omit<ButtonProps, 'outdent' | 'type'> & {\n outdent?: ButtonOutdent;\n type?: ButtonType;\n};\n\nconst ButtonImpl = ({\n block,\n children,\n className,\n classNames,\n danger = false,\n disabled,\n outdent,\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}: ButtonImplProps) => {\n const Motion = useMotionComponent();\n const isInteractionDisabled = 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 outdentCls =\n type === 'text' && outdent\n ? outdent === 'end'\n ? styles.outdentEnd\n : styles.outdentStart\n : 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 outdentCls,\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 = isInteractionDisabled\n ? {}\n : { transition: motionTransition, whileTap: tapAnim };\n\n if (href !== undefined) {\n const handleAnchorClick = (e: MouseEvent<HTMLAnchorElement>) => {\n if (isInteractionDisabled) {\n e.preventDefault();\n return;\n }\n onClick?.(e as unknown as MouseEvent<HTMLButtonElement>);\n };\n\n return (\n <Motion.a\n aria-busy={loading || undefined}\n aria-disabled={isInteractionDisabled || undefined}\n href={disabled ? 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 const handleButtonClick = (e: MouseEvent<HTMLButtonElement>) => {\n if (isInteractionDisabled) {\n e.preventDefault();\n return;\n }\n onClick?.(e);\n };\n\n return (\n <Motion.button\n type={htmlType}\n {...(rest as any)}\n aria-busy={loading || undefined}\n aria-disabled={isInteractionDisabled || undefined}\n className={composedClassName}\n disabled={disabled}\n ref={ref as Ref<HTMLButtonElement>}\n onClick={handleButtonClick}\n {...motionGestures}\n >\n {inner}\n </Motion.button>\n );\n};\n\nButtonImpl.displayName = 'BaseButton';\n\nconst Button = ButtonImpl as <T extends ButtonType = 'default'>(\n props: ButtonProps<T>,\n) => ReactElement;\n\nexport default Button;\n"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType } from "./type.mjs";
|
|
1
|
+
import { ButtonIconPosition, ButtonOutdent, ButtonProps, ButtonShape, ButtonSize, ButtonType } from "./type.mjs";
|
|
2
2
|
import Button from "./Button.mjs";
|
|
3
3
|
import _default, { SplitButtonMenuProps, SplitButtonProps } from "./SplitButton.mjs";
|
|
4
|
-
import { styles } from "./style.mjs";
|
|
5
|
-
export { type ButtonIconPosition, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, _default as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, styles as buttonStyles, Button as default };
|
|
4
|
+
import { buttonPaddingInline, styles } from "./style.mjs";
|
|
5
|
+
export { type ButtonIconPosition, type ButtonOutdent, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, _default as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, buttonPaddingInline, styles as buttonStyles, Button as default };
|
|
@@ -1,9 +1,16 @@
|
|
|
1
1
|
//#region src/base-ui/Button/style.d.ts
|
|
2
|
+
declare const buttonPaddingInline: {
|
|
3
|
+
readonly large: 16;
|
|
4
|
+
readonly middle: 14;
|
|
5
|
+
readonly small: 8;
|
|
6
|
+
};
|
|
2
7
|
declare const styles: {
|
|
3
8
|
base: string;
|
|
4
9
|
sizeSmall: string;
|
|
5
10
|
sizeMiddle: string;
|
|
6
11
|
sizeLarge: string;
|
|
12
|
+
outdentStart: string;
|
|
13
|
+
outdentEnd: string;
|
|
7
14
|
shapeCircle: string;
|
|
8
15
|
shapeRound: string;
|
|
9
16
|
block: string;
|
|
@@ -31,5 +38,5 @@ declare const styles: {
|
|
|
31
38
|
spinner: string;
|
|
32
39
|
};
|
|
33
40
|
//#endregion
|
|
34
|
-
export { styles };
|
|
41
|
+
export { buttonPaddingInline, styles };
|
|
35
42
|
//# sourceMappingURL=style.d.mts.map
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import { controlHeight } from "../controlSize.mjs";
|
|
2
2
|
import { createStaticStyles } from "antd-style";
|
|
3
3
|
//#region src/base-ui/Button/style.ts
|
|
4
|
+
const buttonPaddingInline = {
|
|
5
|
+
large: 16,
|
|
6
|
+
middle: 14,
|
|
7
|
+
small: 8
|
|
8
|
+
};
|
|
4
9
|
const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
5
10
|
base: css`
|
|
6
11
|
cursor: pointer;
|
|
@@ -39,22 +44,34 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
39
44
|
}
|
|
40
45
|
`,
|
|
41
46
|
sizeSmall: css`
|
|
47
|
+
--button-padding-inline: ${buttonPaddingInline.small}px;
|
|
48
|
+
|
|
42
49
|
height: ${controlHeight.small}px;
|
|
43
|
-
padding-inline:
|
|
50
|
+
padding-inline: var(--button-padding-inline);
|
|
44
51
|
border-radius: ${cssVar.borderRadiusSM};
|
|
45
52
|
font-size: 12px;
|
|
46
53
|
`,
|
|
47
54
|
sizeMiddle: css`
|
|
55
|
+
--button-padding-inline: ${buttonPaddingInline.middle}px;
|
|
56
|
+
|
|
48
57
|
height: ${controlHeight.middle}px;
|
|
49
|
-
padding-inline:
|
|
58
|
+
padding-inline: var(--button-padding-inline);
|
|
50
59
|
border-radius: ${cssVar.borderRadiusSM};
|
|
51
60
|
font-size: 13px;
|
|
52
61
|
`,
|
|
53
62
|
sizeLarge: css`
|
|
63
|
+
--button-padding-inline: ${buttonPaddingInline.large}px;
|
|
64
|
+
|
|
54
65
|
height: ${controlHeight.large}px;
|
|
55
|
-
padding-inline:
|
|
66
|
+
padding-inline: var(--button-padding-inline);
|
|
56
67
|
border-radius: ${cssVar.borderRadius};
|
|
57
68
|
font-size: 14px;
|
|
69
|
+
`,
|
|
70
|
+
outdentStart: css`
|
|
71
|
+
margin-inline-start: calc(var(--button-padding-inline) * -1);
|
|
72
|
+
`,
|
|
73
|
+
outdentEnd: css`
|
|
74
|
+
margin-inline-end: calc(var(--button-padding-inline) * -1);
|
|
58
75
|
`,
|
|
59
76
|
shapeCircle: css`
|
|
60
77
|
padding-inline: 0;
|
|
@@ -70,14 +87,20 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
70
87
|
flex-direction: row-reverse;
|
|
71
88
|
`,
|
|
72
89
|
iconOnlySmall: css`
|
|
90
|
+
--button-padding-inline: 0px;
|
|
91
|
+
|
|
73
92
|
width: 24px;
|
|
74
93
|
padding-inline: 0;
|
|
75
94
|
`,
|
|
76
95
|
iconOnlyMiddle: css`
|
|
96
|
+
--button-padding-inline: 0px;
|
|
97
|
+
|
|
77
98
|
width: 32px;
|
|
78
99
|
padding-inline: 0;
|
|
79
100
|
`,
|
|
80
101
|
iconOnlyLarge: css`
|
|
102
|
+
--button-padding-inline: 0px;
|
|
103
|
+
|
|
81
104
|
width: 40px;
|
|
82
105
|
padding-inline: 0;
|
|
83
106
|
`,
|
|
@@ -344,6 +367,6 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
344
367
|
`
|
|
345
368
|
}));
|
|
346
369
|
//#endregion
|
|
347
|
-
export { styles };
|
|
370
|
+
export { buttonPaddingInline, styles };
|
|
348
371
|
|
|
349
372
|
//# sourceMappingURL=style.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { controlHeight } from '@/base-ui/controlSize';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n base: css`\n cursor: pointer;\n\n position: relative;\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: ${controlHeight.small}px;\n padding-inline: 8px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 12px;\n `,\n\n sizeMiddle: css`\n height: ${controlHeight.middle}px;\n padding-inline: 14px;\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 13px;\n `,\n\n sizeLarge: css`\n height: ${controlHeight.large}px;\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: 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 &:active:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFill};\n }\n `,\n\n ghostPrimary: css`\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: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorFill};\n }\n `,\n\n ghostDanger: css`\n border-color: transparent;\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorFill};\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":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;wBAWa,OAAO,YAAY;;;;;;;;;;;;;;;8BAeb,OAAO,mBAAmB;;;;;;;;;;CAWtD,WAAW,GAAG;cACF,cAAc,MAAM;;qBAEb,OAAO,eAAe;;;CAIzC,YAAY,GAAG;cACH,cAAc,OAAO;;qBAEd,OAAO,eAAe;;;CAIzC,WAAW,GAAG;cACF,cAAc,MAAM;;qBAEb,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;;;;;;;eAOJ,OAAO,UAAU;;;;oBAIZ,OAAO,mBAAmB;;;;oBAI1B,OAAO,UAAU;;;CAInC,cAAc,GAAG;;;;;;;eAOJ,OAAO,aAAa;;;;eAIpB,OAAO,kBAAkB;oBACpB,OAAO,mBAAmB;;;;eAI/B,OAAO,mBAAmB;oBACrB,OAAO,UAAU;;;CAInC,aAAa,GAAG;;;;;;;eAOH,OAAO,WAAW;;;;eAIlB,OAAO,gBAAgB;oBAClB,OAAO,mBAAmB;;;;eAI/B,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;CAInC,SAAS,GAAG;;;;;;;;;;;;;;;;;AAiBd,EAAE"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Button/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { controlHeight } from '@/base-ui/controlSize';\n\nexport const buttonPaddingInline = {\n large: 16,\n middle: 14,\n small: 8,\n} as const;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n base: css`\n cursor: pointer;\n\n position: relative;\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 --button-padding-inline: ${buttonPaddingInline.small}px;\n\n height: ${controlHeight.small}px;\n padding-inline: var(--button-padding-inline);\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 12px;\n `,\n\n sizeMiddle: css`\n --button-padding-inline: ${buttonPaddingInline.middle}px;\n\n height: ${controlHeight.middle}px;\n padding-inline: var(--button-padding-inline);\n border-radius: ${cssVar.borderRadiusSM};\n font-size: 13px;\n `,\n\n sizeLarge: css`\n --button-padding-inline: ${buttonPaddingInline.large}px;\n\n height: ${controlHeight.large}px;\n padding-inline: var(--button-padding-inline);\n border-radius: ${cssVar.borderRadius};\n font-size: 14px;\n `,\n\n outdentStart: css`\n margin-inline-start: calc(var(--button-padding-inline) * -1);\n `,\n\n outdentEnd: css`\n margin-inline-end: calc(var(--button-padding-inline) * -1);\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 --button-padding-inline: 0px;\n\n width: 24px;\n padding-inline: 0;\n `,\n\n iconOnlyMiddle: css`\n --button-padding-inline: 0px;\n\n width: 32px;\n padding-inline: 0;\n `,\n\n iconOnlyLarge: css`\n --button-padding-inline: 0px;\n\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: 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 &:active:not(:disabled, [aria-disabled='true']) {\n background: ${cssVar.colorFill};\n }\n `,\n\n ghostPrimary: css`\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: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorFill};\n }\n `,\n\n ghostDanger: css`\n border-color: transparent;\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorFill};\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":";;;AAIA,MAAa,sBAAsB;CACjC,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;;;;;;;;;;;wBAWa,OAAO,YAAY;;;;;;;;;;;;;;;8BAeb,OAAO,mBAAmB;;;;;;;;;;CAWtD,WAAW,GAAG;+BACe,oBAAoB,MAAM;;cAE3C,cAAc,MAAM;;qBAEb,OAAO,eAAe;;;CAIzC,YAAY,GAAG;+BACc,oBAAoB,OAAO;;cAE5C,cAAc,OAAO;;qBAEd,OAAO,eAAe;;;CAIzC,WAAW,GAAG;+BACe,oBAAoB,MAAM;;cAE3C,cAAc,MAAM;;qBAEb,OAAO,aAAa;;;CAIvC,cAAc,GAAG;;;CAIjB,YAAY,GAAG;;;CAIf,aAAa,GAAG;;;;CAKhB,YAAY,GAAG;;;CAIf,OAAO,GAAG;;;CAIV,SAAS,GAAG;;;CAIZ,eAAe,GAAG;;;;;;CAOlB,gBAAgB,GAAG;;;;;;CAOnB,eAAe,GAAG;;;;;;CAOlB,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;;;;;;;eAOJ,OAAO,UAAU;;;;oBAIZ,OAAO,mBAAmB;;;;oBAI1B,OAAO,UAAU;;;CAInC,cAAc,GAAG;;;;;;;eAOJ,OAAO,aAAa;;;;eAIpB,OAAO,kBAAkB;oBACpB,OAAO,mBAAmB;;;;eAI/B,OAAO,mBAAmB;oBACrB,OAAO,UAAU;;;CAInC,aAAa,GAAG;;;;;;;eAOH,OAAO,WAAW;;;;eAIlB,OAAO,gBAAgB;oBAClB,OAAO,mBAAmB;;;;eAI/B,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;CAInC,SAAS,GAAG;;;;;;;;;;;;;;;;;AAiBd,EAAE"}
|
|
@@ -6,6 +6,7 @@ type ButtonType = 'default' | 'primary' | 'dashed' | 'fill' | 'link' | 'text';
|
|
|
6
6
|
type ButtonShape = 'default' | 'circle' | 'round';
|
|
7
7
|
type ButtonSize = 'small' | 'middle' | 'large';
|
|
8
8
|
type ButtonIconPosition = 'start' | 'end';
|
|
9
|
+
type ButtonOutdent = boolean | 'start' | 'end';
|
|
9
10
|
interface BaseButtonOwnProps {
|
|
10
11
|
block?: boolean;
|
|
11
12
|
children?: ReactNode;
|
|
@@ -32,11 +33,22 @@ interface BaseButtonOwnProps {
|
|
|
32
33
|
icon?: CSSProperties;
|
|
33
34
|
};
|
|
34
35
|
target?: string;
|
|
35
|
-
type?: ButtonType;
|
|
36
36
|
}
|
|
37
|
-
type
|
|
38
|
-
|
|
39
|
-
|
|
37
|
+
type TextOutdentProps<T extends ButtonType> = [T] extends ['text'] ? {
|
|
38
|
+
/**
|
|
39
|
+
* Cancels this size's `padding-inline` with a negative margin so a `text`
|
|
40
|
+
* button lines up with adjacent copy. `true` / `'start'` outdent the start
|
|
41
|
+
* edge; `'end'` outdents the end edge.
|
|
42
|
+
*/
|
|
43
|
+
outdent?: ButtonOutdent;
|
|
44
|
+
type?: T;
|
|
45
|
+
} : {
|
|
46
|
+
outdent?: never;
|
|
47
|
+
type?: T;
|
|
48
|
+
};
|
|
49
|
+
type NativeButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof BaseButtonOwnProps | 'type' | 'outdent'>;
|
|
50
|
+
type NativeAnchorProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof BaseButtonOwnProps | 'type' | 'outdent'>;
|
|
51
|
+
type ButtonProps<T extends ButtonType = ButtonType> = BaseButtonOwnProps & NativeButtonProps & Partial<NativeAnchorProps> & TextOutdentProps<T>;
|
|
40
52
|
//#endregion
|
|
41
|
-
export { ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType };
|
|
53
|
+
export { ButtonIconPosition, ButtonOutdent, ButtonProps, ButtonShape, ButtonSize, ButtonType };
|
|
42
54
|
//# sourceMappingURL=type.d.mts.map
|
|
@@ -24,7 +24,7 @@ declare const styles: {
|
|
|
24
24
|
declare const rootVariants: (props?: ({
|
|
25
25
|
shadow?: boolean | null | undefined;
|
|
26
26
|
size?: "large" | "middle" | "small" | null | undefined;
|
|
27
|
-
variant?: "
|
|
27
|
+
variant?: "borderless" | "filled" | "outlined" | null | undefined;
|
|
28
28
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
29
29
|
//#endregion
|
|
30
30
|
export { rootVariants, styles };
|
|
@@ -90,14 +90,9 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
90
90
|
|
|
91
91
|
user-select: none;
|
|
92
92
|
|
|
93
|
-
color: color-mix(in srgb, ${cssVar.colorText}
|
|
94
|
-
|
|
95
|
-
background: linear-gradient(
|
|
96
|
-
120deg,
|
|
97
|
-
transparent 25%,
|
|
98
|
-
${cssVar.colorTextSecondary} 50%,
|
|
99
|
-
transparent 75%
|
|
100
|
-
);
|
|
93
|
+
color: color-mix(in srgb, ${cssVar.colorText} 28%, transparent);
|
|
94
|
+
|
|
95
|
+
background: linear-gradient(120deg, transparent 25%, ${cssVar.colorText} 50%, transparent 75%);
|
|
101
96
|
background-clip: text;
|
|
102
97
|
background-size: 200% 100%;
|
|
103
98
|
|
|
@@ -105,34 +100,38 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
105
100
|
|
|
106
101
|
/* Animating background-position repaints every glyph each frame. Where
|
|
107
102
|
* mask-clip: text is supported, clip a transform-animated overlay to the
|
|
108
|
-
* glyphs instead so the sweep stays on the compositor.
|
|
103
|
+
* glyphs instead so the sweep stays on the compositor. The mask clips every
|
|
104
|
+
* descendant too, so rows that also render icons or chips keep the
|
|
105
|
+
* background-clip path — masking would erase that non-text paint. */
|
|
109
106
|
@supports (-webkit-mask-clip: text) {
|
|
110
|
-
|
|
107
|
+
&:not(:has(*)) {
|
|
108
|
+
position: relative;
|
|
111
109
|
|
|
112
|
-
|
|
110
|
+
background: none;
|
|
113
111
|
|
|
114
|
-
|
|
112
|
+
animation: none;
|
|
115
113
|
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
114
|
+
/* stylelint-disable-next-line declaration-property-value-no-unknown */
|
|
115
|
+
mask-clip: text;
|
|
116
|
+
mask-image: linear-gradient(#fff, #fff);
|
|
119
117
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
118
|
+
&::after {
|
|
119
|
+
pointer-events: none;
|
|
120
|
+
will-change: transform;
|
|
121
|
+
content: '';
|
|
124
122
|
|
|
125
|
-
|
|
126
|
-
|
|
123
|
+
position: absolute;
|
|
124
|
+
inset: 0;
|
|
127
125
|
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
126
|
+
background: linear-gradient(
|
|
127
|
+
90deg,
|
|
128
|
+
transparent 25%,
|
|
129
|
+
${cssVar.colorText} 50%,
|
|
130
|
+
transparent 75%
|
|
131
|
+
);
|
|
134
132
|
|
|
135
|
-
|
|
133
|
+
animation: ${sweep} var(--shiny-duration) linear infinite;
|
|
134
|
+
}
|
|
136
135
|
}
|
|
137
136
|
}
|
|
138
137
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Text/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nconst shine = keyframes`\n 0% {\n background-position: 100%;\n }\n\n 100% {\n background-position: -100%;\n }\n`;\n\nconst sweep = keyframes`\n 0% {\n translate: -100% 0;\n }\n\n 100% {\n translate: 100% 0;\n }\n`;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n code: css`\n font-family: ${cssVar.fontFamilyCode};\n `,\n danger: css`\n color: ${cssVar.colorError};\n `,\n delete: css`\n text-decoration: line-through;\n `,\n disabled: css`\n cursor: not-allowed;\n color: ${cssVar.colorTextDisabled};\n `,\n ellipsis: css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n ellipsisMulti: css`\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n `,\n h1: css`\n font-size: calc(${cssVar.fontSize} * 2.5);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h2: css`\n font-size: calc(${cssVar.fontSize} * 2);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h3: css`\n font-size: calc(${cssVar.fontSize} * 1.5);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h4: css`\n font-size: calc(${cssVar.fontSize} * 1.25);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h5: css`\n font-size: ${cssVar.fontSize};\n font-weight: bold;\n line-height: 1.25;\n `,\n info: css`\n color: ${cssVar.colorInfo};\n `,\n\n italic: css`\n font-style: italic;\n `,\n\n mark: css`\n color: #000;\n background-color: ${cssVar.yellow};\n `,\n\n p: css`\n margin-block: 0;\n `,\n\n secondary: css`\n color: ${cssVar.colorTextDescription};\n `,\n\n shiny: css`\n --shiny-duration: 1.5s;\n\n user-select: none;\n\n color: color-mix(in srgb, ${cssVar.colorText}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Text/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nconst shine = keyframes`\n 0% {\n background-position: 100%;\n }\n\n 100% {\n background-position: -100%;\n }\n`;\n\nconst sweep = keyframes`\n 0% {\n translate: -100% 0;\n }\n\n 100% {\n translate: 100% 0;\n }\n`;\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n code: css`\n font-family: ${cssVar.fontFamilyCode};\n `,\n danger: css`\n color: ${cssVar.colorError};\n `,\n delete: css`\n text-decoration: line-through;\n `,\n disabled: css`\n cursor: not-allowed;\n color: ${cssVar.colorTextDisabled};\n `,\n ellipsis: css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n ellipsisMulti: css`\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n `,\n h1: css`\n font-size: calc(${cssVar.fontSize} * 2.5);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h2: css`\n font-size: calc(${cssVar.fontSize} * 2);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h3: css`\n font-size: calc(${cssVar.fontSize} * 1.5);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h4: css`\n font-size: calc(${cssVar.fontSize} * 1.25);\n font-weight: bold;\n line-height: 1.25;\n `,\n\n h5: css`\n font-size: ${cssVar.fontSize};\n font-weight: bold;\n line-height: 1.25;\n `,\n info: css`\n color: ${cssVar.colorInfo};\n `,\n\n italic: css`\n font-style: italic;\n `,\n\n mark: css`\n color: #000;\n background-color: ${cssVar.yellow};\n `,\n\n p: css`\n margin-block: 0;\n `,\n\n secondary: css`\n color: ${cssVar.colorTextDescription};\n `,\n\n shiny: css`\n --shiny-duration: 1.5s;\n\n user-select: none;\n\n color: color-mix(in srgb, ${cssVar.colorText} 28%, transparent);\n\n background: linear-gradient(120deg, transparent 25%, ${cssVar.colorText} 50%, transparent 75%);\n background-clip: text;\n background-size: 200% 100%;\n\n animation: ${shine} var(--shiny-duration) linear infinite;\n\n /* Animating background-position repaints every glyph each frame. Where\n * mask-clip: text is supported, clip a transform-animated overlay to the\n * glyphs instead so the sweep stays on the compositor. The mask clips every\n * descendant too, so rows that also render icons or chips keep the\n * background-clip path — masking would erase that non-text paint. */\n @supports (-webkit-mask-clip: text) {\n &:not(:has(*)) {\n position: relative;\n\n background: none;\n\n animation: none;\n\n /* stylelint-disable-next-line declaration-property-value-no-unknown */\n mask-clip: text;\n mask-image: linear-gradient(#fff, #fff);\n\n &::after {\n pointer-events: none;\n will-change: transform;\n content: '';\n\n position: absolute;\n inset: 0;\n\n background: linear-gradient(\n 90deg,\n transparent 25%,\n ${cssVar.colorText} 50%,\n transparent 75%\n );\n\n animation: ${sweep} var(--shiny-duration) linear infinite;\n }\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n animation: none;\n\n &::after {\n display: none;\n }\n }\n `,\n\n strong: css`\n font-weight: bold;\n `,\n success: css`\n color: ${cssVar.colorSuccess};\n `,\n text: css`\n color: ${cssVar.colorText};\n `,\n underline: css`\n text-decoration: underline;\n `,\n warning: css`\n color: ${cssVar.colorWarning};\n `,\n}));\n\nexport const variants = cva(styles.text, {\n defaultVariants: {},\n variants: {\n as: {\n h1: styles.h1,\n h2: styles.h2,\n h3: styles.h3,\n h4: styles.h4,\n h5: styles.h5,\n p: styles.p,\n },\n code: {\n true: styles.code,\n },\n delete: {\n true: styles.delete,\n },\n disabled: {\n true: styles.disabled,\n },\n ellipsis: {\n multi: styles.ellipsisMulti,\n true: styles.ellipsis,\n },\n italic: {\n true: styles.italic,\n },\n mark: {\n true: styles.mark,\n },\n shiny: {\n true: styles.shiny,\n },\n strong: {\n true: styles.strong,\n },\n type: {\n danger: styles.danger,\n info: styles.info,\n secondary: styles.secondary,\n success: styles.success,\n warning: styles.warning,\n },\n underline: {\n true: styles.underline,\n },\n },\n});\n"],"mappings":";;;AAGA,MAAM,QAAQ,SAAS;;;;;;;;;AAUvB,MAAM,QAAQ,SAAS;;;;;;;;;AAUvB,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;mBACQ,OAAO,eAAe;;CAEvC,QAAQ,GAAG;aACA,OAAO,WAAW;;CAE7B,QAAQ,GAAG;;;CAGX,UAAU,GAAG;;aAEF,OAAO,kBAAkB;;CAEpC,UAAU,GAAG;;;;;CAKb,eAAe,GAAG;;;;;;CAMlB,IAAI,GAAG;sBACa,OAAO,SAAS;;;;CAKpC,IAAI,GAAG;sBACa,OAAO,SAAS;;;;CAKpC,IAAI,GAAG;sBACa,OAAO,SAAS;;;;CAKpC,IAAI,GAAG;sBACa,OAAO,SAAS;;;;CAKpC,IAAI,GAAG;iBACQ,OAAO,SAAS;;;;CAI/B,MAAM,GAAG;aACE,OAAO,UAAU;;CAG5B,QAAQ,GAAG;;;CAIX,MAAM,GAAG;;wBAEa,OAAO,OAAO;;CAGpC,GAAG,GAAG;;;CAIN,WAAW,GAAG;aACH,OAAO,qBAAqB;;CAGvC,OAAO,GAAG;;;;;gCAKoB,OAAO,UAAU;;2DAEU,OAAO,UAAU;;;;iBAI3D,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA8BT,OAAO,UAAU;;;;uBAIR,MAAM;;;;;;;;;;;;;CAc3B,QAAQ,GAAG;;;CAGX,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,MAAM,GAAG;aACE,OAAO,UAAU;;CAE5B,WAAW,GAAG;;;CAGd,SAAS,GAAG;aACD,OAAO,aAAa;;AAEjC,EAAE;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,CAAC;CAClB,UAAU;EACR,IAAI;GACF,IAAI,OAAO;GACX,IAAI,OAAO;GACX,IAAI,OAAO;GACX,IAAI,OAAO;GACX,IAAI,OAAO;GACX,GAAG,OAAO;EACZ;EACA,MAAM,EACJ,MAAM,OAAO,KACf;EACA,QAAQ,EACN,MAAM,OAAO,OACf;EACA,UAAU,EACR,MAAM,OAAO,SACf;EACA,UAAU;GACR,OAAO,OAAO;GACd,MAAM,OAAO;EACf;EACA,QAAQ,EACN,MAAM,OAAO,OACf;EACA,MAAM,EACJ,MAAM,OAAO,KACf;EACA,OAAO,EACL,MAAM,OAAO,MACf;EACA,QAAQ,EACN,MAAM,OAAO,OACf;EACA,MAAM;GACJ,QAAQ,OAAO;GACf,MAAM,OAAO;GACb,WAAW,OAAO;GAClB,SAAS,OAAO;GAChB,SAAS,OAAO;EAClB;EACA,WAAW,EACT,MAAM,OAAO,UACf;CACF;AACF,CAAC"}
|
package/es/base-ui/index.d.mts
CHANGED
|
@@ -2,7 +2,7 @@ import { TooltipGroupProps, TooltipPlacement, TooltipPopupComponentProps, Toolti
|
|
|
2
2
|
import { Tooltip } from "./Tooltip/Tooltip.mjs";
|
|
3
3
|
import TooltipGroup from "./Tooltip/TooltipGroup.mjs";
|
|
4
4
|
import "./Tooltip/index.mjs";
|
|
5
|
-
import { ActionIconClassNames, ActionIconProps, ActionIconSize, ActionIconStyles } from "./ActionIcon/type.mjs";
|
|
5
|
+
import { ActionIconClassNames, ActionIconOutdent, ActionIconProps, ActionIconSize, ActionIconStyles, ActionIconVariant } from "./ActionIcon/type.mjs";
|
|
6
6
|
import ActionIcon from "./ActionIcon/ActionIcon.mjs";
|
|
7
7
|
import { styles as styles$1 } from "./ActionIcon/style.mjs";
|
|
8
8
|
import "./ActionIcon/index.mjs";
|
|
@@ -58,10 +58,10 @@ import "./AutoComplete/index.mjs";
|
|
|
58
58
|
import { AvatarClassNames, AvatarGroupItemType, AvatarGroupProps, AvatarProps, AvatarStyles } from "./Avatar/type.mjs";
|
|
59
59
|
import AvatarGroup from "./Avatar/AvatarGroup/index.mjs";
|
|
60
60
|
import Avatar from "./Avatar/index.mjs";
|
|
61
|
-
import { ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType } from "./Button/type.mjs";
|
|
61
|
+
import { ButtonIconPosition, ButtonOutdent, ButtonProps, ButtonShape, ButtonSize, ButtonType } from "./Button/type.mjs";
|
|
62
62
|
import Button from "./Button/Button.mjs";
|
|
63
63
|
import _default, { SplitButtonMenuProps, SplitButtonProps } from "./Button/SplitButton.mjs";
|
|
64
|
-
import { styles as styles$4 } from "./Button/style.mjs";
|
|
64
|
+
import { buttonPaddingInline, styles as styles$4 } from "./Button/style.mjs";
|
|
65
65
|
import "./Button/index.mjs";
|
|
66
66
|
import { CheckboxGroupOption, CheckboxGroupProps, CheckboxProps, CheckboxShape } from "./Checkbox/type.mjs";
|
|
67
67
|
import Checkbox from "./Checkbox/Checkbox.mjs";
|
|
@@ -142,4 +142,4 @@ import { styles as styles$12 } from "./ToggleGroup/style.mjs";
|
|
|
142
142
|
import { ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, ToggleGroupItemProps, ToggleGroupRoot, ToggleGroupRootProps } from "./ToggleGroup/atoms.mjs";
|
|
143
143
|
import ToggleGroup from "./ToggleGroup/ToggleGroup.mjs";
|
|
144
144
|
import "./ToggleGroup/index.mjs";
|
|
145
|
-
export { Accordion, type AccordionClassNames, AccordionHeader, type AccordionHeaderProps, type AccordionIndicatorPlacement, AccordionItem, type AccordionItemProps, type AccordionItemType, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionRoot, type AccordionRootProps, type AccordionStyles, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, ActionIcon, type ActionIconClassNames, type ActionIconProps, type ActionIconSize, type ActionIconStyles, Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, AutoComplete, type AutoCompleteOption, type AutoCompleteProps, Avatar, type AvatarClassNames, AvatarGroup, type AvatarGroupItemType, type AvatarGroupProps, type AvatarProps, type AvatarStyles, type BaseModalProps, Button, type ButtonIconPosition, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxShape, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuInterceptor, type ContextMenuItem, ContextMenuTrigger, type ControlSize, Drawer, DrawerBackdrop, type DrawerBackdropProps, DrawerClose, type DrawerCloseProps, DrawerContent, type DrawerContentProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, type DrawerPlacement, DrawerPopup, type DrawerPopupProps, DrawerPortal, type DrawerPortalProps, type DrawerProps, type DrawerPush, DrawerRoot, type DrawerRootProps, type DrawerSemanticNames, type DrawerSemanticStyles, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, type DropdownItem, DropdownMenu, type DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, type DropdownMenuCheckboxItemProps, DropdownMenuFooter, type DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, type DropdownMenuGroupLabelProps, DropdownMenuHeader, type DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, type DropdownMenuItemContentProps, DropdownMenuItemDesc, type DropdownMenuItemDescProps, DropdownMenuItemExtra, type DropdownMenuItemExtraProps, DropdownMenuItemIcon, type DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, type DropdownMenuItemLabelGroupProps, type DropdownMenuItemLabelProps, type DropdownMenuItemProps, type DropdownMenuPlacement, DropdownMenuPopup, type DropdownMenuPopupProps, DropdownMenuPortal, type DropdownMenuPortalProps, DropdownMenuPositioner, type DropdownMenuPositionerProps, type DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, type DropdownMenuScrollViewportProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, type DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, type DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, type DropdownMenuSwitchItemProps, type DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, type DropdownMenuTriggerProps, FloatingPanel, type FloatingPanelOffset, type FloatingPanelPlacement, type FloatingPanelProps, FloatingSheet, type FloatingSheetProps, Form, type FormContextValue, FormDivider, type FormDividerProps, FormField, type FormFieldProps, FormFlatGroup, type FormFlatGroupProps, FormFooter, type FormFooterProps, FormGroup, type FormGroupItemType, type FormGroupProps, type FormLayout, type FormProps, FormSubmitFooter, type FormSubmitFooterProps, FormTitle, type FormTitleProps, type FormValues, type FormVariant, type IconSpaceMode, type ImperativeModalProps, Input, type InputClassNames, InputNumber, type InputNumberProps, InputOTP, type InputOTPProps, InputPassword, type InputPasswordProps, type InputProps, type InputSize, type InputStyles, type InputVariant, type ItemsType, Modal, ModalBackdrop, type ModalBackdropProps, ModalClose, type ModalCloseProps, type ModalComponentProps, type ModalConfirmConfig, ModalContent, type ModalContentProps, ModalContext, type ModalContextValue, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHost, type ModalHostProps, type ModalInstance, ModalPopup, type ModalPopupProps, ModalPortal, type ModalPortalProps, ModalRoot, type ModalRootProps, type ModalSystem, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, ModalViewport, type ModalViewportProps, Popover, PopoverArrow, type PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverGroupHandle, type PopoverGroupItem, type PopoverPlacement, PopoverPopup, type PopoverPopupAtomProps, type PopoverPopupProps, PopoverPortal, type PopoverPortalAtomProps, type PopoverPortalProps, PopoverPositioner, type PopoverPositionerAtomProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, PopoverRoot, type PopoverTrigger, type PopoverTriggerComponentProps, PopoverTriggerElement, type PopoverTriggerElementProps, PopoverViewport, type PopoverViewportAtomProps, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, ScrollArea, ScrollAreaContent, type ScrollAreaContentProps, ScrollAreaCorner, type ScrollAreaCornerProps, type ScrollAreaProps, ScrollAreaRoot, type ScrollAreaRootProps, ScrollAreaScrollbar, type ScrollAreaScrollbarProps, ScrollAreaThumb, type ScrollAreaThumbProps, ScrollAreaViewport, type ScrollAreaViewportProps, Segmented, type SegmentedClassNames, SegmentedIndicator, type SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, type SegmentedItemProps, type SegmentedOption, type SegmentedOptions, type SegmentedOrientation, type SegmentedProps, SegmentedRoot, type SegmentedRootProps, type SegmentedSize, type SegmentedStyles, type SegmentedVariant, Select, SelectArrow, type SelectArrowProps, SelectBackdrop, type SelectBehaviorVariant, type SelectClassNames, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectIcon, type SelectIconProps, type SelectIndicatorVariant, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectList, type SelectListProps, type SelectOption, type SelectOptionGroup, type SelectOptions, SelectPopup, type SelectPopupProps, SelectPortal, type SelectPortalProps, SelectPositioner, type SelectPositionerProps, type SelectProps, SelectRoot, type SelectRootChangeEventDetails, SelectScrollDownArrow, type SelectScrollDownArrowProps, SelectScrollUpArrow, type SelectScrollUpArrowProps, SelectSeparator, type SelectSize, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, type SelectVariant, Skeleton, type SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, SliderWithInput, type SliderWithInputProps, _default as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, Switch, type SwitchChangeEventHandler, type SwitchClassNames, type SwitchClickEventHandler, type SwitchContextType, SwitchIcon, type SwitchIconPosition, type SwitchIconProps, type SwitchProps, SwitchRoot, type SwitchRootProps, type SwitchSize, type SwitchStyles, SwitchThumb, type SwitchThumbProps, Tabs, type TabsClassNames, TabsIndicator, type TabsIndicatorProps, type TabsItem, TabsList, type TabsListProps, type TabsOrientation, TabsPanel, type TabsPanelProps, type TabsProps, TabsRoot, type TabsRootProps, type TabsSize, type TabsStyles, TabsTab, type TabsTabProps, type TabsVariant, Tag, type TagClassNames, type TagProps, type TagShape, type TagSize, type TagStyles, type TagVariant, Text, TextArea, type TextAreaAutoSize, type TextAreaProps, type TextClassNames, type TextProps, type TextStyles, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, ToggleGroup, type ToggleGroupClassNames, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, type ToggleGroupItemProps, type ToggleGroupOption, type ToggleGroupProps, ToggleGroupRoot, type ToggleGroupRootProps, type ToggleGroupSize, type ToggleGroupStyles, type ToggleGroupVariant, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$6 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, presetColors, presetSystemColors, styles$7 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$8 as sliderStyles, styles$9 as switchStyles, styles$10 as tabsStyles, styles$11 as textStyles, variants as textVariants, toast, styles$12 as toggleGroupStyles, updateContextMenuItems, useAccordionContext, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|
|
145
|
+
export { Accordion, type AccordionClassNames, AccordionHeader, type AccordionHeaderProps, type AccordionIndicatorPlacement, AccordionItem, type AccordionItemProps, type AccordionItemType, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionRoot, type AccordionRootProps, type AccordionStyles, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, ActionIcon, type ActionIconClassNames, type ActionIconOutdent, type ActionIconProps, type ActionIconSize, type ActionIconStyles, type ActionIconVariant, Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, AutoComplete, type AutoCompleteOption, type AutoCompleteProps, Avatar, type AvatarClassNames, AvatarGroup, type AvatarGroupItemType, type AvatarGroupProps, type AvatarProps, type AvatarStyles, type BaseModalProps, Button, type ButtonIconPosition, type ButtonOutdent, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonType, Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxShape, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuInterceptor, type ContextMenuItem, ContextMenuTrigger, type ControlSize, Drawer, DrawerBackdrop, type DrawerBackdropProps, DrawerClose, type DrawerCloseProps, DrawerContent, type DrawerContentProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, type DrawerPlacement, DrawerPopup, type DrawerPopupProps, DrawerPortal, type DrawerPortalProps, type DrawerProps, type DrawerPush, DrawerRoot, type DrawerRootProps, type DrawerSemanticNames, type DrawerSemanticStyles, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, type DropdownItem, DropdownMenu, type DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, type DropdownMenuCheckboxItemProps, DropdownMenuFooter, type DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, type DropdownMenuGroupLabelProps, DropdownMenuHeader, type DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, type DropdownMenuItemContentProps, DropdownMenuItemDesc, type DropdownMenuItemDescProps, DropdownMenuItemExtra, type DropdownMenuItemExtraProps, DropdownMenuItemIcon, type DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, type DropdownMenuItemLabelGroupProps, type DropdownMenuItemLabelProps, type DropdownMenuItemProps, type DropdownMenuPlacement, DropdownMenuPopup, type DropdownMenuPopupProps, DropdownMenuPortal, type DropdownMenuPortalProps, DropdownMenuPositioner, type DropdownMenuPositionerProps, type DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, type DropdownMenuScrollViewportProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, type DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, type DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, type DropdownMenuSwitchItemProps, type DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, type DropdownMenuTriggerProps, FloatingPanel, type FloatingPanelOffset, type FloatingPanelPlacement, type FloatingPanelProps, FloatingSheet, type FloatingSheetProps, Form, type FormContextValue, FormDivider, type FormDividerProps, FormField, type FormFieldProps, FormFlatGroup, type FormFlatGroupProps, FormFooter, type FormFooterProps, FormGroup, type FormGroupItemType, type FormGroupProps, type FormLayout, type FormProps, FormSubmitFooter, type FormSubmitFooterProps, FormTitle, type FormTitleProps, type FormValues, type FormVariant, type IconSpaceMode, type ImperativeModalProps, Input, type InputClassNames, InputNumber, type InputNumberProps, InputOTP, type InputOTPProps, InputPassword, type InputPasswordProps, type InputProps, type InputSize, type InputStyles, type InputVariant, type ItemsType, Modal, ModalBackdrop, type ModalBackdropProps, ModalClose, type ModalCloseProps, type ModalComponentProps, type ModalConfirmConfig, ModalContent, type ModalContentProps, ModalContext, type ModalContextValue, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHost, type ModalHostProps, type ModalInstance, ModalPopup, type ModalPopupProps, ModalPortal, type ModalPortalProps, ModalRoot, type ModalRootProps, type ModalSystem, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, ModalViewport, type ModalViewportProps, Popover, PopoverArrow, type PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverGroupHandle, type PopoverGroupItem, type PopoverPlacement, PopoverPopup, type PopoverPopupAtomProps, type PopoverPopupProps, PopoverPortal, type PopoverPortalAtomProps, type PopoverPortalProps, PopoverPositioner, type PopoverPositionerAtomProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, PopoverRoot, type PopoverTrigger, type PopoverTriggerComponentProps, PopoverTriggerElement, type PopoverTriggerElementProps, PopoverViewport, type PopoverViewportAtomProps, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, ScrollArea, ScrollAreaContent, type ScrollAreaContentProps, ScrollAreaCorner, type ScrollAreaCornerProps, type ScrollAreaProps, ScrollAreaRoot, type ScrollAreaRootProps, ScrollAreaScrollbar, type ScrollAreaScrollbarProps, ScrollAreaThumb, type ScrollAreaThumbProps, ScrollAreaViewport, type ScrollAreaViewportProps, Segmented, type SegmentedClassNames, SegmentedIndicator, type SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, type SegmentedItemProps, type SegmentedOption, type SegmentedOptions, type SegmentedOrientation, type SegmentedProps, SegmentedRoot, type SegmentedRootProps, type SegmentedSize, type SegmentedStyles, type SegmentedVariant, Select, SelectArrow, type SelectArrowProps, SelectBackdrop, type SelectBehaviorVariant, type SelectClassNames, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectIcon, type SelectIconProps, type SelectIndicatorVariant, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectList, type SelectListProps, type SelectOption, type SelectOptionGroup, type SelectOptions, SelectPopup, type SelectPopupProps, SelectPortal, type SelectPortalProps, SelectPositioner, type SelectPositionerProps, type SelectProps, SelectRoot, type SelectRootChangeEventDetails, SelectScrollDownArrow, type SelectScrollDownArrowProps, SelectScrollUpArrow, type SelectScrollUpArrowProps, SelectSeparator, type SelectSize, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, type SelectVariant, Skeleton, type SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, SliderWithInput, type SliderWithInputProps, _default as SplitButton, type SplitButtonMenuProps, type SplitButtonProps, Switch, type SwitchChangeEventHandler, type SwitchClassNames, type SwitchClickEventHandler, type SwitchContextType, SwitchIcon, type SwitchIconPosition, type SwitchIconProps, type SwitchProps, SwitchRoot, type SwitchRootProps, type SwitchSize, type SwitchStyles, SwitchThumb, type SwitchThumbProps, Tabs, type TabsClassNames, TabsIndicator, type TabsIndicatorProps, type TabsItem, TabsList, type TabsListProps, type TabsOrientation, TabsPanel, type TabsPanelProps, type TabsProps, TabsRoot, type TabsRootProps, type TabsSize, type TabsStyles, TabsTab, type TabsTabProps, type TabsVariant, Tag, type TagClassNames, type TagProps, type TagShape, type TagSize, type TagStyles, type TagVariant, Text, TextArea, type TextAreaAutoSize, type TextAreaProps, type TextClassNames, type TextProps, type TextStyles, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, ToggleGroup, type ToggleGroupClassNames, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, type ToggleGroupItemProps, type ToggleGroupOption, type ToggleGroupProps, ToggleGroupRoot, type ToggleGroupRootProps, type ToggleGroupSize, type ToggleGroupStyles, type ToggleGroupVariant, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, buttonPaddingInline, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$6 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, presetColors, presetSystemColors, styles$7 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$8 as sliderStyles, styles$9 as switchStyles, styles$10 as tabsStyles, styles$11 as textStyles, variants as textVariants, toast, styles$12 as toggleGroupStyles, updateContextMenuItems, useAccordionContext, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|
package/es/base-ui/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Tooltip } from "./Tooltip/Tooltip.mjs";
|
|
2
2
|
import TooltipGroup from "./Tooltip/TooltipGroup.mjs";
|
|
3
3
|
import { controlHeight } from "./controlSize.mjs";
|
|
4
|
-
import { styles as styles$4 } from "./Button/style.mjs";
|
|
4
|
+
import { buttonPaddingInline, styles as styles$4 } from "./Button/style.mjs";
|
|
5
5
|
import Button from "./Button/Button.mjs";
|
|
6
6
|
import { styles as styles$9 } from "./Switch/style.mjs";
|
|
7
7
|
import { SwitchIcon, SwitchRoot, SwitchThumb, useSwitchContext } from "./Switch/atoms.mjs";
|
|
@@ -86,4 +86,4 @@ import Text from "./Text/Text.mjs";
|
|
|
86
86
|
import { styles as styles$12 } from "./ToggleGroup/style.mjs";
|
|
87
87
|
import { ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, ToggleGroupRoot } from "./ToggleGroup/atoms.mjs";
|
|
88
88
|
import ToggleGroup from "./ToggleGroup/ToggleGroup.mjs";
|
|
89
|
-
export { Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, ActionIcon, Alert, AutoComplete, Avatar, AvatarGroup, Button, Checkbox, CheckboxGroup, ContextMenuHost, ContextMenuTrigger, Drawer, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerPopup, DrawerPortal, DrawerRoot, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger, FloatingPanel, FloatingSheet, Form, FormDivider, FormField, FormFlatGroup, FormFooter, FormGroup, FormSubmitFooter, FormTitle, Input, InputNumber, InputOTP, InputPassword, Modal, ModalBackdrop, ModalClose, ModalContent, ModalContext, ModalDescription, ModalFooter, ModalHeader, ModalHost, ModalPopup, ModalPortal, ModalRoot, ModalTitle, ModalTrigger, ModalViewport, Popover, PopoverArrow, PopoverArrowIcon, PopoverBackdrop, PopoverGroup, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverProvider, PopoverRoot, PopoverTriggerElement, PopoverViewport, Radio, RadioGroup, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaRoot, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaViewport, Segmented, SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot, Select, SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue, Skeleton, SkeletonAvatar, SkeletonText, Slider, SliderWithInput, SplitButton, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, Tag, Text, TextArea, ToastHost, ToggleGroup, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, ToggleGroupRoot, Tooltip, TooltipGroup, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$6 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, presetColors, presetSystemColors, styles$7 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$8 as sliderStyles, styles$9 as switchStyles, styles$10 as tabsStyles, styles$11 as textStyles, variants as textVariants, toast, styles$12 as toggleGroupStyles, updateContextMenuItems, useAccordionContext, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|
|
89
|
+
export { Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, ActionIcon, Alert, AutoComplete, Avatar, AvatarGroup, Button, Checkbox, CheckboxGroup, ContextMenuHost, ContextMenuTrigger, Drawer, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerPopup, DrawerPortal, DrawerRoot, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger, FloatingPanel, FloatingSheet, Form, FormDivider, FormField, FormFlatGroup, FormFooter, FormGroup, FormSubmitFooter, FormTitle, Input, InputNumber, InputOTP, InputPassword, Modal, ModalBackdrop, ModalClose, ModalContent, ModalContext, ModalDescription, ModalFooter, ModalHeader, ModalHost, ModalPopup, ModalPortal, ModalRoot, ModalTitle, ModalTrigger, ModalViewport, Popover, PopoverArrow, PopoverArrowIcon, PopoverBackdrop, PopoverGroup, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverProvider, PopoverRoot, PopoverTriggerElement, PopoverViewport, Radio, RadioGroup, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaRoot, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaViewport, Segmented, SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot, Select, SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue, Skeleton, SkeletonAvatar, SkeletonText, Slider, SliderWithInput, SplitButton, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, Tag, Text, TextArea, ToastHost, ToggleGroup, ToggleGroupItem, ToggleGroupItemIcon, ToggleGroupItemLabel, ToggleGroupRoot, Tooltip, TooltipGroup, styles as accordionStyles, styles$1 as actionIconStyles, styles$2 as alertStyles, styles$3 as autoCompleteStyles, backdropTransition, buttonPaddingInline, styles$4 as buttonStyles, styles$5 as checkboxStyles, closeContextMenu, colorsPreset, colorsPresetSystem, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$6 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, presetColors, presetSystemColors, styles$7 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$8 as sliderStyles, styles$9 as switchStyles, styles$10 as tabsStyles, styles$11 as textStyles, variants as textVariants, toast, styles$12 as toggleGroupStyles, updateContextMenuItems, useAccordionContext, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverGroupHandle, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|