@lobehub/ui 5.29.2 → 5.30.0
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/Alert/Alert.d.mts +6 -0
- package/es/base-ui/Alert/Alert.mjs +148 -0
- package/es/base-ui/Alert/Alert.mjs.map +1 -0
- package/es/base-ui/Alert/index.d.mts +4 -0
- package/es/base-ui/Alert/style.d.mts +37 -0
- package/es/base-ui/Alert/style.mjs +419 -0
- package/es/base-ui/Alert/style.mjs.map +1 -0
- package/es/base-ui/Alert/type.d.mts +110 -0
- package/es/base-ui/AutoComplete/AutoComplete.mjs +4 -0
- package/es/base-ui/AutoComplete/AutoComplete.mjs.map +1 -1
- package/es/base-ui/Button/Button.mjs +1 -2
- package/es/base-ui/Button/Button.mjs.map +1 -1
- package/es/base-ui/Button/style.d.mts +0 -1
- package/es/base-ui/Button/style.mjs +12 -16
- package/es/base-ui/Button/style.mjs.map +1 -1
- package/es/base-ui/Button/type.d.mts +5 -0
- package/es/base-ui/Input/style.d.mts +1 -1
- package/es/base-ui/Select/style.mjs +3 -1
- package/es/base-ui/Select/style.mjs.map +1 -1
- package/es/base-ui/index.d.mts +13 -9
- package/es/base-ui/index.mjs +11 -9
- package/es/eslint/index.d.mts +8 -0
- package/es/eslint/index.mjs +47 -17
- package/es/eslint/index.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { IconProps } from "../../Icon/type.mjs";
|
|
2
|
+
import "../../Icon/index.mjs";
|
|
3
|
+
import { ButtonHTMLAttributes, CSSProperties, HTMLAttributes, MouseEventHandler, ReactNode, Ref } from "react";
|
|
4
|
+
//#region src/base-ui/Alert/type.d.ts
|
|
5
|
+
type AlertType = 'success' | 'info' | 'warning' | 'error' | 'secondary';
|
|
6
|
+
type AlertVariant = 'soft' | 'outlined' | 'plain' |
|
|
7
|
+
/** @deprecated Use `soft` instead. */
|
|
8
|
+
'filled' |
|
|
9
|
+
/** @deprecated Use `plain` instead. */
|
|
10
|
+
'borderless';
|
|
11
|
+
type AlertRef = HTMLDivElement;
|
|
12
|
+
interface AlertCloseConfig extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onClick' | 'type'> {
|
|
13
|
+
/** Called after the alert has been removed from the document. */
|
|
14
|
+
afterClose?: () => void;
|
|
15
|
+
/** Custom close affordance. */
|
|
16
|
+
closeIcon?: ReactNode;
|
|
17
|
+
/** Called when the close affordance is activated. */
|
|
18
|
+
onClose?: MouseEventHandler<HTMLButtonElement>;
|
|
19
|
+
}
|
|
20
|
+
interface AlertClassNames {
|
|
21
|
+
action?: string;
|
|
22
|
+
/** @deprecated Use `root` instead. */
|
|
23
|
+
alert?: string;
|
|
24
|
+
close?: string;
|
|
25
|
+
container?: string;
|
|
26
|
+
content?: string;
|
|
27
|
+
description?: string;
|
|
28
|
+
extra?: string;
|
|
29
|
+
extraContent?: string;
|
|
30
|
+
extraHeader?: string;
|
|
31
|
+
extraIndicator?: string;
|
|
32
|
+
icon?: string;
|
|
33
|
+
root?: string;
|
|
34
|
+
/** Alias for `content`, matching the former antd semantic part. */
|
|
35
|
+
section?: string;
|
|
36
|
+
title?: string;
|
|
37
|
+
}
|
|
38
|
+
interface AlertStyles {
|
|
39
|
+
action?: CSSProperties;
|
|
40
|
+
/** @deprecated Use `root` instead. */
|
|
41
|
+
alert?: CSSProperties;
|
|
42
|
+
close?: CSSProperties;
|
|
43
|
+
container?: CSSProperties;
|
|
44
|
+
content?: CSSProperties;
|
|
45
|
+
description?: CSSProperties;
|
|
46
|
+
extra?: CSSProperties;
|
|
47
|
+
extraContent?: CSSProperties;
|
|
48
|
+
extraHeader?: CSSProperties;
|
|
49
|
+
extraIndicator?: CSSProperties;
|
|
50
|
+
icon?: CSSProperties;
|
|
51
|
+
root?: CSSProperties;
|
|
52
|
+
/** Alias for `content`, matching the former antd semantic part. */
|
|
53
|
+
section?: CSSProperties;
|
|
54
|
+
title?: CSSProperties;
|
|
55
|
+
}
|
|
56
|
+
interface AlertOwnProps {
|
|
57
|
+
/** Optional action rendered after the message content. */
|
|
58
|
+
action?: ReactNode;
|
|
59
|
+
/** @deprecated Use `closable.afterClose` instead. */
|
|
60
|
+
afterClose?: () => void;
|
|
61
|
+
/** Removes the side border and radius for full-width notices. */
|
|
62
|
+
banner?: boolean;
|
|
63
|
+
classNames?: AlertClassNames;
|
|
64
|
+
/** Whether the alert can be dismissed. */
|
|
65
|
+
closable?: AlertCloseConfig | boolean;
|
|
66
|
+
/** @deprecated Use `closable.closeIcon` instead. */
|
|
67
|
+
closeIcon?: ReactNode;
|
|
68
|
+
/** @deprecated Use `closable.closeIcon` instead. */
|
|
69
|
+
closeText?: ReactNode;
|
|
70
|
+
/** Whether the title adopts the semantic color. Neutral text is used by default. */
|
|
71
|
+
colorfulText?: boolean;
|
|
72
|
+
/** Supporting detail displayed beneath the title. */
|
|
73
|
+
description?: ReactNode;
|
|
74
|
+
/** Optional expandable or isolated detail content. */
|
|
75
|
+
extra?: ReactNode;
|
|
76
|
+
/** Whether expandable detail content starts open. */
|
|
77
|
+
extraDefaultExpand?: boolean;
|
|
78
|
+
/** Renders detail content as an independent sibling instead of a disclosure. */
|
|
79
|
+
extraIsolate?: boolean;
|
|
80
|
+
/** Enables backdrop blur for translucent host surfaces. */
|
|
81
|
+
glass?: boolean;
|
|
82
|
+
/** Custom semantic icon. */
|
|
83
|
+
icon?: IconProps['icon'];
|
|
84
|
+
/** Props forwarded to the Icon component. */
|
|
85
|
+
iconProps?: Omit<IconProps, 'icon'>;
|
|
86
|
+
/** @deprecated Use `title` instead. */
|
|
87
|
+
message?: ReactNode;
|
|
88
|
+
/** @deprecated Use `closable.onClose` instead. */
|
|
89
|
+
onClose?: MouseEventHandler<HTMLButtonElement>;
|
|
90
|
+
ref?: Ref<AlertRef>;
|
|
91
|
+
/** Alias for `className`, retained for migration compatibility. */
|
|
92
|
+
rootClassName?: string;
|
|
93
|
+
/** Whether the semantic icon is rendered. */
|
|
94
|
+
showIcon?: boolean;
|
|
95
|
+
styles?: AlertStyles;
|
|
96
|
+
text?: {
|
|
97
|
+
detail?: string;
|
|
98
|
+
};
|
|
99
|
+
/** Primary message content. */
|
|
100
|
+
title?: ReactNode;
|
|
101
|
+
/** Semantic tone. */
|
|
102
|
+
type?: AlertType;
|
|
103
|
+
/** Surface treatment. `filled` and `borderless` remain as migration aliases. */
|
|
104
|
+
variant?: AlertVariant;
|
|
105
|
+
}
|
|
106
|
+
type NativeAlertProps = Omit<HTMLAttributes<HTMLDivElement>, keyof AlertOwnProps | 'children' | 'title'>;
|
|
107
|
+
type AlertProps = AlertOwnProps & NativeAlertProps;
|
|
108
|
+
//#endregion
|
|
109
|
+
export { AlertClassNames, AlertCloseConfig, AlertProps, AlertRef, AlertStyles, AlertType, AlertVariant };
|
|
110
|
+
//# sourceMappingURL=type.d.mts.map
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
|
|
3
3
|
import Icon from "../../Icon/Icon.mjs";
|
|
4
|
+
import { useLayerZIndex } from "../zIndex/useLayerZIndex.mjs";
|
|
4
5
|
import { rootVariants, styles } from "../Input/style.mjs";
|
|
5
6
|
import { styles as styles$1 } from "./style.mjs";
|
|
6
7
|
import { memo, useMemo, useRef } from "react";
|
|
@@ -13,6 +14,7 @@ const AutoComplete = memo(({ className, classNames, styles: customStyles, style,
|
|
|
13
14
|
const { isDarkMode } = useThemeMode();
|
|
14
15
|
const appElement = useAppElement();
|
|
15
16
|
const anchorRef = useRef(null);
|
|
17
|
+
const { ref: positionerRef, zIndex } = useLayerZIndex("floating");
|
|
16
18
|
const mergedVariant = variant || (isDarkMode ? "filled" : "outlined");
|
|
17
19
|
const items = useMemo(() => options.map((option) => typeof option === "string" ? { value: option } : option), [options]);
|
|
18
20
|
return /* @__PURE__ */ jsxs(Autocomplete.Root, {
|
|
@@ -62,7 +64,9 @@ const AutoComplete = memo(({ className, classNames, styles: customStyles, style,
|
|
|
62
64
|
children: /* @__PURE__ */ jsx(Autocomplete.Positioner, {
|
|
63
65
|
anchor: anchorRef,
|
|
64
66
|
className: styles$1.positioner,
|
|
67
|
+
ref: positionerRef,
|
|
65
68
|
sideOffset: 4,
|
|
69
|
+
style: zIndex === void 0 ? void 0 : { zIndex },
|
|
66
70
|
children: /* @__PURE__ */ jsxs(Autocomplete.Popup, {
|
|
67
71
|
className: cx(styles$1.popup, classNames?.popup),
|
|
68
72
|
style: customStyles?.popup,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutoComplete.mjs","names":["inputVariants","inputStyles","styles"],"sources":["../../../src/base-ui/AutoComplete/AutoComplete.tsx"],"sourcesContent":["'use client';\n\nimport { Autocomplete } from '@base-ui/react/autocomplete';\nimport { cx, useThemeMode } from 'antd-style';\nimport { XIcon } from 'lucide-react';\nimport { memo, useMemo, useRef } from 'react';\n\nimport { inputStyles, inputVariants } from '@/base-ui/Input';\nimport Icon from '@/Icon';\nimport { useAppElement } from '@/ThemeProvider';\n\nimport { styles } from './style';\nimport type { AutoCompleteOption, AutoCompleteProps } from './type';\n\nconst AutoComplete = memo<AutoCompleteProps>(\n ({\n className,\n classNames,\n styles: customStyles,\n style,\n variant,\n shadow,\n size = 'middle',\n options = [],\n onChange,\n onSearch,\n allowClear,\n disabled,\n placeholder,\n prefix,\n suffix,\n emptyText,\n ...rest\n }) => {\n const { isDarkMode } = useThemeMode();\n const appElement = useAppElement();\n const anchorRef = useRef<HTMLDivElement>(null);\n const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n const items = useMemo<AutoCompleteOption[]>(\n () => options.map((option) => (typeof option === 'string' ? { value: option } : option)),\n [options],\n );\n\n return (\n <Autocomplete.Root\n openOnInputClick\n disabled={disabled}\n itemToStringValue={(item) => (item as AutoCompleteOption).value}\n items={items}\n onValueChange={(value) => {\n onChange?.(value);\n onSearch?.(value);\n }}\n {...rest}\n >\n <div\n className={cx(inputVariants({ shadow, size, variant: mergedVariant }), className)}\n data-disabled={disabled ? '' : undefined}\n ref={anchorRef}\n style={style}\n >\n {prefix && <span className={inputStyles.slot}>{prefix}</span>}\n <Autocomplete.Input\n className={cx(inputStyles.input, classNames?.input)}\n placeholder={placeholder}\n style={customStyles?.input}\n />\n {allowClear && (\n <Autocomplete.Clear aria-label={'Clear'} className={styles.clear}>\n <Icon icon={XIcon} size={14} />\n </Autocomplete.Clear>\n )}\n {suffix && <span className={inputStyles.slot}>{suffix}</span>}\n </div>\n <Autocomplete.Portal container={appElement ?? undefined}>\n <Autocomplete.Positioner
|
|
1
|
+
{"version":3,"file":"AutoComplete.mjs","names":["inputVariants","inputStyles","styles"],"sources":["../../../src/base-ui/AutoComplete/AutoComplete.tsx"],"sourcesContent":["'use client';\n\nimport { Autocomplete } from '@base-ui/react/autocomplete';\nimport { cx, useThemeMode } from 'antd-style';\nimport { XIcon } from 'lucide-react';\nimport { memo, useMemo, useRef } from 'react';\n\nimport { inputStyles, inputVariants } from '@/base-ui/Input';\nimport { useLayerZIndex } from '@/base-ui/zIndex';\nimport Icon from '@/Icon';\nimport { useAppElement } from '@/ThemeProvider';\n\nimport { styles } from './style';\nimport type { AutoCompleteOption, AutoCompleteProps } from './type';\n\nconst AutoComplete = memo<AutoCompleteProps>(\n ({\n className,\n classNames,\n styles: customStyles,\n style,\n variant,\n shadow,\n size = 'middle',\n options = [],\n onChange,\n onSearch,\n allowClear,\n disabled,\n placeholder,\n prefix,\n suffix,\n emptyText,\n ...rest\n }) => {\n const { isDarkMode } = useThemeMode();\n const appElement = useAppElement();\n const anchorRef = useRef<HTMLDivElement>(null);\n const { ref: positionerRef, zIndex } = useLayerZIndex<HTMLDivElement>('floating');\n const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n const items = useMemo<AutoCompleteOption[]>(\n () => options.map((option) => (typeof option === 'string' ? { value: option } : option)),\n [options],\n );\n\n return (\n <Autocomplete.Root\n openOnInputClick\n disabled={disabled}\n itemToStringValue={(item) => (item as AutoCompleteOption).value}\n items={items}\n onValueChange={(value) => {\n onChange?.(value);\n onSearch?.(value);\n }}\n {...rest}\n >\n <div\n className={cx(inputVariants({ shadow, size, variant: mergedVariant }), className)}\n data-disabled={disabled ? '' : undefined}\n ref={anchorRef}\n style={style}\n >\n {prefix && <span className={inputStyles.slot}>{prefix}</span>}\n <Autocomplete.Input\n className={cx(inputStyles.input, classNames?.input)}\n placeholder={placeholder}\n style={customStyles?.input}\n />\n {allowClear && (\n <Autocomplete.Clear aria-label={'Clear'} className={styles.clear}>\n <Icon icon={XIcon} size={14} />\n </Autocomplete.Clear>\n )}\n {suffix && <span className={inputStyles.slot}>{suffix}</span>}\n </div>\n <Autocomplete.Portal container={appElement ?? undefined}>\n <Autocomplete.Positioner\n anchor={anchorRef}\n className={styles.positioner}\n ref={positionerRef}\n sideOffset={4}\n style={zIndex === undefined ? undefined : { zIndex }}\n >\n <Autocomplete.Popup\n className={cx(styles.popup, classNames?.popup)}\n style={customStyles?.popup}\n >\n {emptyText && (\n <Autocomplete.Empty className={styles.empty}>{emptyText}</Autocomplete.Empty>\n )}\n <Autocomplete.List className={styles.list}>\n {(item: AutoCompleteOption) => (\n <Autocomplete.Item\n className={cx(styles.item, classNames?.item)}\n disabled={item.disabled}\n key={item.value}\n style={customStyles?.item}\n value={item}\n >\n {item.label ?? item.value}\n </Autocomplete.Item>\n )}\n </Autocomplete.List>\n </Autocomplete.Popup>\n </Autocomplete.Positioner>\n </Autocomplete.Portal>\n </Autocomplete.Root>\n );\n },\n);\n\nAutoComplete.displayName = 'AutoComplete';\n\nexport default AutoComplete;\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,eAAe,MAClB,EACC,WACA,YACA,QAAQ,cACR,OACA,SACA,QACA,OAAO,UACP,UAAU,CAAC,GACX,UACA,UACA,YACA,UACA,aACA,QACA,QACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,aAAa,cAAc;CACjC,MAAM,YAAY,OAAuB,IAAI;CAC7C,MAAM,EAAE,KAAK,eAAe,WAAW,eAA+B,UAAU;CAChF,MAAM,gBAAgB,YAAY,aAAa,WAAW;CAE1D,MAAM,QAAQ,cACN,QAAQ,KAAK,WAAY,OAAO,WAAW,WAAW,EAAE,OAAO,OAAO,IAAI,MAAO,GACvF,CAAC,OAAO,CACV;CAEA,OACE,qBAAC,aAAa,MAAd;EACE,kBAAA;EACU;EACV,oBAAoB,SAAU,KAA4B;EACnD;EACP,gBAAgB,UAAU;GACxB,WAAW,KAAK;GAChB,WAAW,KAAK;EAClB;EACA,GAAI;EATN,UAAA,CAWE,qBAAC,OAAD;GACE,WAAW,GAAGA,aAAc;IAAE;IAAQ;IAAM,SAAS;GAAc,CAAC,GAAG,SAAS;GAChF,iBAAe,WAAW,KAAK,KAAA;GAC/B,KAAK;GACE;GAJT,UAAA;IAMG,UAAU,oBAAC,QAAD;KAAM,WAAWC,OAAY;KAAO,UAAA;IAAa,CAAA;IAC5D,oBAAC,aAAa,OAAd;KACE,WAAW,GAAGA,OAAY,OAAO,YAAY,KAAK;KACrC;KACb,OAAO,cAAc;IACtB,CAAA;IACA,cACC,oBAAC,aAAa,OAAd;KAAoB,cAAY;KAAS,WAAWC,SAAO;KACzD,UAAA,oBAAC,MAAD;MAAM,MAAM;MAAO,MAAM;KAAK,CAAA;IACZ,CAAA;IAErB,UAAU,oBAAC,QAAD;KAAM,WAAWD,OAAY;KAAO,UAAA;IAAa,CAAA;GACzD;EACL,CAAA,GAAA,oBAAC,aAAa,QAAd;GAAqB,WAAW,cAAc,KAAA;GAC5C,UAAA,oBAAC,aAAa,YAAd;IACE,QAAQ;IACR,WAAWC,SAAO;IAClB,KAAK;IACL,YAAY;IACZ,OAAO,WAAW,KAAA,IAAY,KAAA,IAAY,EAAE,OAAO;IAEnD,UAAA,qBAAC,aAAa,OAAd;KACE,WAAW,GAAGA,SAAO,OAAO,YAAY,KAAK;KAC7C,OAAO,cAAc;KAFvB,UAAA,CAIG,aACC,oBAAC,aAAa,OAAd;MAAoB,WAAWA,SAAO;MAAQ,UAAA;KAA8B,CAAA,GAE9E,oBAAC,aAAa,MAAd;MAAmB,WAAWA,SAAO;MACjC,WAAA,SACA,oBAAC,aAAa,MAAd;OACE,WAAW,GAAGA,SAAO,MAAM,YAAY,IAAI;OAC3C,UAAU,KAAK;OAEf,OAAO,cAAc;OACrB,OAAO;OAEN,UAAA,KAAK,SAAS,KAAK;MACH,GALZ,KAAK,KAKO;KAEJ,CAAA,CACD;;GACG,CAAA;EACN,CAAA,CACJ;;AAEvB,CACF;AAEA,aAAa,cAAc"}
|
|
@@ -25,10 +25,9 @@ const resolveIconOnlySizeCls = (size) => {
|
|
|
25
25
|
return styles.iconOnlyMiddle;
|
|
26
26
|
};
|
|
27
27
|
const resolveVariantCls = ({ danger, ghost, type }) => {
|
|
28
|
-
if (ghost) {
|
|
28
|
+
if (ghost && type !== "text" && type !== "link") {
|
|
29
29
|
if (danger) return styles.ghostDanger;
|
|
30
30
|
if (type === "primary") return styles.ghostPrimary;
|
|
31
|
-
if (type === "dashed") return cx(styles.ghostDefault, styles.ghostDashed);
|
|
32
31
|
return styles.ghostDefault;
|
|
33
32
|
}
|
|
34
33
|
switch (type) {
|
|
@@ -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 { isValidElement, type MouseEvent, type ReactNode, type Ref } from 'react';\n\nimport Icon, { type IconProps } from '@/Icon';\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { styles } from './style';\nimport type { ButtonProps } from './type';\n\nconst resolveIconNode = (node: ReactNode | IconProps['icon'] | undefined | null) => {\n if (node === undefined || node === null) return null;\n if (isValidElement(node) || typeof node === 'string' || typeof node === 'number') {\n return node;\n }\n return <Icon icon={node as any} size={'small'} />;\n};\n\nconst resolveSizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.sizeSmall;\n if (size === 'large') return styles.sizeLarge;\n return styles.sizeMiddle;\n};\n\nconst resolveIconOnlySizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.iconOnlySmall;\n if (size === 'large') return styles.iconOnlyLarge;\n return styles.iconOnlyMiddle;\n};\n\nconst resolveVariantCls = ({\n danger,\n ghost,\n type,\n}: {\n danger: boolean;\n ghost: boolean;\n type: NonNullable<ButtonProps['type']>;\n}): string => {\n
|
|
1
|
+
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/base-ui/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { isValidElement, type MouseEvent, type ReactNode, type Ref } from 'react';\n\nimport Icon, { type IconProps } from '@/Icon';\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { styles } from './style';\nimport type { ButtonProps } from './type';\n\nconst resolveIconNode = (node: ReactNode | IconProps['icon'] | undefined | null) => {\n if (node === undefined || node === null) return null;\n if (isValidElement(node) || typeof node === 'string' || typeof node === 'number') {\n return node;\n }\n return <Icon icon={node as any} size={'small'} />;\n};\n\nconst resolveSizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.sizeSmall;\n if (size === 'large') return styles.sizeLarge;\n return styles.sizeMiddle;\n};\n\nconst resolveIconOnlySizeCls = (size: ButtonProps['size']) => {\n if (size === 'small') return styles.iconOnlySmall;\n if (size === 'large') return styles.iconOnlyLarge;\n return styles.iconOnlyMiddle;\n};\n\nconst resolveVariantCls = ({\n danger,\n ghost,\n type,\n}: {\n danger: boolean;\n ghost: boolean;\n type: NonNullable<ButtonProps['type']>;\n}): string => {\n // `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\nconst Button = ({\n block,\n children,\n className,\n classNames,\n danger = false,\n disabled,\n ghost = false,\n href,\n htmlType = 'button',\n icon,\n iconPosition = 'start',\n loading,\n onClick,\n ref,\n shape = 'default',\n size = 'middle',\n styles: userStyles,\n target,\n type = 'default',\n ...rest\n}: ButtonProps) => {\n const Motion = useMotionComponent();\n const 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 composedClassName = cx(\n styles.base,\n sizeCls,\n variantCls,\n shapeCls,\n block && styles.block,\n iconPosition === 'end' && styles.iconEnd,\n iconOnlySizeCls,\n className,\n );\n\n const spinnerNode = (\n <span\n aria-hidden={!loading}\n style={userStyles?.icon}\n className={cx(\n styles.iconBox,\n styles.spinnerSlot,\n loading && styles.spinnerSlotShow,\n iconPosition === 'end' && styles.spinnerSlotEnd,\n classNames?.icon,\n )}\n >\n <span className={styles.spinner} />\n </span>\n );\n\n const iconNode =\n icon && !loading ? (\n <span className={cx(styles.iconBox, classNames?.icon)} style={userStyles?.icon}>\n {resolveIconNode(icon)}\n </span>\n ) : null;\n\n const inner = (\n <>\n {spinnerNode}\n {iconNode}\n {children}\n </>\n );\n\n const motionGestures = 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\nButton.displayName = 'BaseButton';\n\nexport default Button;\n"],"mappings":";;;;;;;;AAWA,MAAM,mBAAmB,SAA2D;CAClF,IAAI,SAAS,KAAA,KAAa,SAAS,MAAM,OAAO;CAChD,IAAI,eAAe,IAAI,KAAK,OAAO,SAAS,YAAY,OAAO,SAAS,UACtE,OAAO;CAET,OAAO,oBAAC,MAAD;EAAM,MAAM;EAAa,MAAM;CAAU,CAAA;AAClD;AAEA,MAAM,kBAAkB,SAA8B;CACpD,IAAI,SAAS,SAAS,OAAO,OAAO;CACpC,IAAI,SAAS,SAAS,OAAO,OAAO;CACpC,OAAO,OAAO;AAChB;AAEA,MAAM,0BAA0B,SAA8B;CAC5D,IAAI,SAAS,SAAS,OAAO,OAAO;CACpC,IAAI,SAAS,SAAS,OAAO,OAAO;CACpC,OAAO,OAAO;AAChB;AAEA,MAAM,qBAAqB,EACzB,QACA,OACA,WAKY;CAGZ,IAAI,SAAS,SAAS,UAAU,SAAS,QAAQ;EAC/C,IAAI,QAAQ,OAAO,OAAO;EAC1B,IAAI,SAAS,WAAW,OAAO,OAAO;EACtC,OAAO,OAAO;CAChB;CAEA,QAAQ,MAAR;EACE,KAAK,WACH,OAAO,SAAS,OAAO,cAAc,OAAO;EAE9C,KAAK,UACH,OAAO,SAAS,GAAG,OAAO,eAAe,OAAO,cAAc,IAAI,OAAO;EAE3E,KAAK,QACH,OAAO,SAAS,OAAO,aAAa,OAAO;EAE7C,KAAK,QACH,OAAO,SAAS,GAAG,OAAO,aAAa,OAAO,YAAY,IAAI,OAAO;EAEvE,KAAK,QACH,OAAO,SAAS,GAAG,OAAO,aAAa,OAAO,YAAY,IAAI,OAAO;EAEvE,SACE,OAAO,SAAS,GAAG,OAAO,gBAAgB,OAAO,cAAc,IAAI,OAAO;CAE9E;AACF;AAEA,MAAM,UAAU,EAAE,OAAO,IAAK;AAC9B,MAAM,mBAAmB;CACvB,SAAS;CACT,MAAM;CACN,WAAW;CACX,MAAM;AACR;AAEA,MAAM,UAAU,EACd,OACA,UACA,WACA,YACA,SAAS,OACT,UACA,QAAQ,OACR,MACA,WAAW,UACX,MACA,eAAe,SACf,SACA,SACA,KACA,QAAQ,WACR,OAAO,UACP,QAAQ,YACR,QACA,OAAO,WACP,GAAG,WACc;CACjB,MAAM,SAAS,mBAAmB;CAClC,MAAM,wBAAwB,YAAY;CAC1C,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,aAAa,kBAAkB;EAAE;EAAQ;EAAO;CAAK,CAAC;CAC5D,MAAM,WACJ,UAAU,WAAW,OAAO,cAAc,UAAU,UAAU,OAAO,aAAa,KAAA;CAMpF,MAAM,kBADW,EAFf,aAAa,KAAA,KAAa,aAAa,QAAQ,aAAa,SAAS,aAAa,OAEnD,CAAC,EADf,WAAW,QAEK,uBAAuB,IAAI,IAAI,KAAA;CAElE,MAAM,oBAAoB,GACxB,OAAO,MACP,SACA,YACA,UACA,SAAS,OAAO,OAChB,iBAAiB,SAAS,OAAO,SACjC,iBACA,SACF;CAEA,MAAM,cACJ,oBAAC,QAAD;EACE,eAAa,CAAC;EACd,OAAO,YAAY;EACnB,WAAW,GACT,OAAO,SACP,OAAO,aACP,WAAW,OAAO,iBAClB,iBAAiB,SAAS,OAAO,gBACjC,YAAY,IACd;EAEA,UAAA,oBAAC,QAAD,EAAM,WAAW,OAAO,QAAU,CAAA;CAC9B,CAAA;CAGR,MAAM,WACJ,QAAQ,CAAC,UACP,oBAAC,QAAD;EAAM,WAAW,GAAG,OAAO,SAAS,YAAY,IAAI;EAAG,OAAO,YAAY;EACvE,UAAA,gBAAgB,IAAI;CACjB,CAAA,IACJ;CAEN,MAAM,QACJ,qBAAA,YAAA,EAAA,UAAA;EACG;EACA;EACA;CACD,EAAA,CAAA;CAGJ,MAAM,iBAAiB,wBACnB,CAAC,IACD;EAAE,YAAY;EAAkB,UAAU;CAAQ;CAEtD,IAAI,SAAS,KAAA,GAAW;EACtB,MAAM,qBAAqB,MAAqC;GAC9D,IAAI,uBAAuB;IACzB,EAAE,eAAe;IACjB;GACF;GACA,UAAU,CAA6C;EACzD;EAEA,OACE,oBAAC,OAAO,GAAR;GACE,aAAW,WAAW,KAAA;GACtB,iBAAe,yBAAyB,KAAA;GACxC,MAAM,WAAW,KAAA,IAAY;GACrB;GACR,GAAK;GACL,WAAW;GACN;GACL,SAAS;GACT,GAAI;GAEH,UAAA;EACO,CAAA;CAEd;CAEA,MAAM,qBAAqB,MAAqC;EAC9D,IAAI,uBAAuB;GACzB,EAAE,eAAe;GACjB;EACF;EACA,UAAU,CAAC;CACb;CAEA,OACE,oBAAC,OAAO,QAAR;EACE,MAAM;EACN,GAAK;EACL,aAAW,WAAW,KAAA;EACtB,iBAAe,yBAAyB,KAAA;EACxC,WAAW;EACD;EACL;EACL,SAAS;EACT,GAAI;EAEH,UAAA;CACY,CAAA;AAEnB;AAEA,OAAO,cAAc"}
|
|
@@ -268,29 +268,25 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
268
268
|
}
|
|
269
269
|
`,
|
|
270
270
|
ghostDefault: css`
|
|
271
|
-
border-color:
|
|
271
|
+
border-color: transparent;
|
|
272
272
|
background: transparent;
|
|
273
273
|
|
|
274
274
|
&,
|
|
275
275
|
&:hover,
|
|
276
276
|
&:active {
|
|
277
|
-
color:
|
|
277
|
+
color: ${cssVar.colorText};
|
|
278
278
|
}
|
|
279
279
|
|
|
280
280
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
281
|
-
|
|
282
|
-
background: color-mix(in srgb, currentcolor 8%, transparent);
|
|
281
|
+
background: ${cssVar.colorFillSecondary};
|
|
283
282
|
}
|
|
284
283
|
|
|
285
284
|
&:active:not(:disabled, [aria-disabled='true']) {
|
|
286
|
-
background:
|
|
285
|
+
background: ${cssVar.colorFill};
|
|
287
286
|
}
|
|
288
|
-
`,
|
|
289
|
-
ghostDashed: css`
|
|
290
|
-
border-style: dashed;
|
|
291
287
|
`,
|
|
292
288
|
ghostPrimary: css`
|
|
293
|
-
border-color:
|
|
289
|
+
border-color: transparent;
|
|
294
290
|
background: transparent;
|
|
295
291
|
|
|
296
292
|
&,
|
|
@@ -300,17 +296,17 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
300
296
|
}
|
|
301
297
|
|
|
302
298
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
303
|
-
border-color: ${cssVar.colorPrimaryHover};
|
|
304
299
|
color: ${cssVar.colorPrimaryHover};
|
|
305
|
-
background:
|
|
300
|
+
background: ${cssVar.colorFillSecondary};
|
|
306
301
|
}
|
|
307
302
|
|
|
308
303
|
&:active:not(:disabled, [aria-disabled='true']) {
|
|
309
|
-
|
|
304
|
+
color: ${cssVar.colorPrimaryActive};
|
|
305
|
+
background: ${cssVar.colorFill};
|
|
310
306
|
}
|
|
311
307
|
`,
|
|
312
308
|
ghostDanger: css`
|
|
313
|
-
border-color:
|
|
309
|
+
border-color: transparent;
|
|
314
310
|
background: transparent;
|
|
315
311
|
|
|
316
312
|
&,
|
|
@@ -320,13 +316,13 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
320
316
|
}
|
|
321
317
|
|
|
322
318
|
&:hover:not(:disabled, [aria-disabled='true']) {
|
|
323
|
-
border-color: ${cssVar.colorErrorHover};
|
|
324
319
|
color: ${cssVar.colorErrorHover};
|
|
325
|
-
background:
|
|
320
|
+
background: ${cssVar.colorFillSecondary};
|
|
326
321
|
}
|
|
327
322
|
|
|
328
323
|
&:active:not(:disabled, [aria-disabled='true']) {
|
|
329
|
-
|
|
324
|
+
color: ${cssVar.colorErrorActive};
|
|
325
|
+
background: ${cssVar.colorFill};
|
|
330
326
|
}
|
|
331
327
|
`,
|
|
332
328
|
spinner: css`
|
|
@@ -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: rgb(255 255 255 / 65%);\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: #fff;\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: #fff;\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDashed: css`\n border-style: dashed;\n `,\n\n ghostPrimary: css`\n border-color: ${cssVar.colorPrimary};\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorPrimary};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorPrimaryHover};\n color: ${cssVar.colorPrimaryHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n ghostDanger: css`\n border-color: ${cssVar.colorError};\n background: transparent;\n\n &,\n &:hover,\n &:active {\n color: ${cssVar.colorError};\n }\n\n &:hover:not(:disabled, [aria-disabled='true']) {\n border-color: ${cssVar.colorErrorHover};\n color: ${cssVar.colorErrorHover};\n background: color-mix(in srgb, currentcolor 8%, transparent);\n }\n\n &:active:not(:disabled, [aria-disabled='true']) {\n background: color-mix(in srgb, currentcolor 14%, transparent);\n }\n `,\n\n spinner: css`\n @keyframes base-button-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n display: inline-block;\n\n width: 12px;\n height: 12px;\n border: 1.5px solid currentcolor;\n border-block-start-color: transparent;\n border-radius: 50%;\n\n animation: base-button-spin 0.6s linear infinite;\n `,\n}));\n"],"mappings":";;;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;;;;;;;;;;;;;;;;;;;CAoBjB,aAAa,GAAG;;;CAIhB,cAAc,GAAG;oBACC,OAAO,aAAa;;;;;;eAMzB,OAAO,aAAa;;;;sBAIb,OAAO,kBAAkB;eAChC,OAAO,kBAAkB;;;;;;;;CAStC,aAAa,GAAG;oBACE,OAAO,WAAW;;;;;;eAMvB,OAAO,WAAW;;;;sBAIX,OAAO,gBAAgB;eAC9B,OAAO,gBAAgB;;;;;;;;CASpC,SAAS,GAAG;;;;;;;;;;;;;;;;;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 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"}
|
|
@@ -14,6 +14,11 @@ interface BaseButtonOwnProps {
|
|
|
14
14
|
};
|
|
15
15
|
danger?: boolean;
|
|
16
16
|
disabled?: boolean;
|
|
17
|
+
/**
|
|
18
|
+
* Strips the fill and the border, leaving only the type's semantic color and a hover
|
|
19
|
+
* wash. Unlike antd's `ghost`, this is not an on-dark-background variant. It is a no-op
|
|
20
|
+
* on `text` and `link`, which already carry no surface.
|
|
21
|
+
*/
|
|
17
22
|
ghost?: boolean;
|
|
18
23
|
href?: string;
|
|
19
24
|
htmlType?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
|
|
@@ -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?: "filled" | "
|
|
27
|
+
variant?: "filled" | "borderless" | "outlined" | null | undefined;
|
|
28
28
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
29
29
|
//#endregion
|
|
30
30
|
export { rootVariants, styles };
|
|
@@ -201,7 +201,9 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
|
201
201
|
align-items: center;
|
|
202
202
|
`,
|
|
203
203
|
tagsValue: css`
|
|
204
|
-
|
|
204
|
+
/* No growing, so an empty trigger leaves the inline input the full width — but it must
|
|
205
|
+
still shrink, or the tags stay at max-content and run off the trigger instead of wrapping. */
|
|
206
|
+
flex: 0 1 auto;
|
|
205
207
|
`,
|
|
206
208
|
tagsSearch: css`
|
|
207
209
|
display: flex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Select/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { controlHeight } from '@/base-ui/controlSize';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n arrow: css`\n display: flex;\n width: 12px;\n height: 6px;\n\n & > svg {\n width: 100%;\n height: 100%;\n }\n `,\n borderless: cx(\n lobeStaticStylish.variantBorderless,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillTertiary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 70%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 55%, transparent);\n `,\n ),\n clear: css`\n display: inline-flex;\n align-items: center;\n\n color: ${cssVar.colorTextTertiary};\n\n opacity: 0;\n\n transition: opacity 150ms ${cssVar.motionEaseOut};\n\n &:hover {\n color: ${cssVar.colorTextSecondary};\n }\n `,\n empty: css``,\n filled: cx(\n lobeStaticStylish.variantFilled,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillSecondary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 70%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 55%, transparent);\n `,\n ),\n group: css``,\n groupLabel: css``,\n icon: css`\n display: inline-flex;\n align-items: center;\n transition: transform 150ms ${cssVar.motionEaseOut};\n\n &[data-popup-open] {\n transform: rotate(180deg);\n }\n `,\n item: css``,\n itemBoldSelected: css`\n &[data-selected] {\n font-weight: 600;\n }\n `,\n itemIndicator: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n margin-inline-start: auto;\n padding-inline-start: 8px;\n\n color: ${cssVar.colorPrimary};\n `,\n itemText: css``,\n list: css`\n overflow-y: auto;\n flex: 1;\n\n min-height: 0;\n max-height: var(--lobe-select-available-height, var(--available-height));\n padding-block: 0;\n `,\n listWithSearch: css`\n padding-block-start: 4px;\n `,\n outlined: cx(\n lobeStaticStylish.variantOutlined,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillTertiary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorBgContainer} 75%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n `,\n ),\n popup: css`\n --lobe-select-available-height: min(\n var(--available-height),\n var(--lobe-select-popup-max-height, var(--available-height))\n );\n\n transform-origin: var(--transform-origin);\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n\n transition:\n opacity 150ms ${cssVar.motionEaseOut},\n transform 150ms ${cssVar.motionEaseOut};\n\n &[data-starting-style],\n &[data-ending-style] {\n transform: scaleY(0.92);\n opacity: 0;\n }\n `,\n positioner: css`\n z-index: 1100;\n outline: none;\n `,\n prefix: css`\n display: inline-flex;\n align-items: center;\n color: ${cssVar.colorTextSecondary};\n `,\n scrollArrow: css`\n cursor: default;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n height: 16px;\n\n color: ${cssVar.colorTextSecondary};\n\n background: ${cssVar.colorBgElevated};\n `,\n search: css`\n cursor: text;\n\n display: flex;\n align-items: center;\n\n min-height: 36px;\n margin-inline: -4px;\n padding-block: 8px;\n padding-inline: 12px;\n border-block-end: 1px solid ${cssVar.colorFillSecondary};\n `,\n searchInput: css`\n flex: 1;\n\n min-width: 0;\n padding-block: 0;\n padding-inline: 4px;\n border: 0;\n\n font-size: 14px;\n line-height: 20px;\n color: ${cssVar.colorText};\n\n background: transparent;\n outline: none;\n\n &::placeholder {\n color: ${cssVar.colorTextPlaceholder};\n }\n `,\n shadow: lobeStaticStylish.shadow,\n suffix: css`\n display: inline-flex;\n gap: 6px;\n align-items: center;\n color: ${cssVar.colorTextSecondary};\n `,\n tag: css`\n display: inline-flex;\n align-items: center;\n\n max-width: 100%;\n padding-block: 0;\n padding-inline: 6px;\n border-radius: ${cssVar.borderRadiusSM};\n\n font-size: 12px;\n line-height: 20px;\n color: ${cssVar.colorText};\n\n background: ${cssVar.colorFillTertiary};\n `,\n tagClose: css`\n cursor: pointer;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n margin-inline-start: 4px;\n\n color: ${cssVar.colorTextSecondary};\n\n transition: opacity 150ms ${cssVar.motionEaseOut};\n `,\n tags: css`\n display: flex;\n flex-wrap: wrap;\n gap: 4px;\n align-items: center;\n `,\n tagsValue: css`\n flex: none;\n `,\n tagsSearch: css`\n display: flex;\n flex: 1;\n min-width: 48px;\n `,\n trigger: css`\n cursor: pointer;\n user-select: none;\n\n display: inline-flex;\n gap: 8px;\n align-items: center;\n\n box-sizing: border-box;\n width: 100%;\n border: 1px solid transparent;\n border-radius: ${cssVar.borderRadius};\n\n font-family: inherit;\n color: ${cssVar.colorText};\n\n background: transparent;\n outline: none;\n\n transition: all 150ms ${cssVar.motionEaseOut};\n\n &:not([data-disabled], [data-readonly])[data-popup-open],\n &:not([data-disabled], [data-readonly])[data-open],\n &:not([data-disabled], [data-readonly])[data-state='open'],\n &:not([data-disabled], [data-readonly])[aria-expanded='true'] {\n background: var(--lobe-select-open-bg, ${cssVar.colorFillTertiary});\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n\n &:hover [data-role='lobe-select-clear'] {\n opacity: 1;\n }\n\n &[data-placeholder] [data-role='lobe-select-clear'] {\n pointer-events: none;\n opacity: 0;\n }\n\n &[data-disabled] {\n cursor: not-allowed;\n color: ${cssVar.colorTextDisabled};\n background: var(--lobe-select-disabled-bg, transparent);\n\n &:hover {\n background: var(--lobe-select-disabled-bg, transparent);\n }\n }\n\n &[data-readonly] {\n cursor: default;\n color: ${cssVar.colorTextSecondary};\n background: var(--lobe-select-readonly-bg, transparent);\n\n &:hover {\n background: var(--lobe-select-readonly-bg, transparent);\n }\n }\n\n &[data-disabled] [data-role='lobe-select-clear'] {\n pointer-events: none;\n opacity: 0;\n }\n `,\n triggerLarge: css`\n min-height: ${controlHeight.large}px;\n padding-block: 6px;\n padding-inline: 12px;\n\n font-size: 16px;\n line-height: 24px;\n `,\n triggerMiddle: css`\n min-height: ${controlHeight.middle}px;\n padding-block: 4px;\n padding-inline: 11px;\n\n font-size: 14px;\n line-height: 20px;\n `,\n triggerSmall: css`\n min-height: ${controlHeight.small}px;\n padding-block: 0;\n padding-inline: 8px;\n\n font-size: 12px;\n line-height: 18px;\n `,\n value: css`\n display: flex;\n flex: 1;\n flex-wrap: wrap;\n gap: 4px;\n align-items: center;\n\n min-width: 0;\n\n color: inherit;\n\n &[data-placeholder] {\n color: ${cssVar.colorTextPlaceholder};\n }\n `,\n valueText: css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n}));\n\nexport const triggerVariants = cva(styles.trigger, {\n defaultVariants: {\n shadow: false,\n size: 'middle',\n variant: 'outlined',\n },\n variants: {\n shadow: {\n false: null,\n true: styles.shadow,\n },\n size: {\n large: styles.triggerLarge,\n middle: styles.triggerMiddle,\n small: styles.triggerSmall,\n },\n variant: {\n borderless: styles.borderless,\n filled: styles.filled,\n outlined: styles.outlined,\n },\n },\n});\n"],"mappings":";;;;;AAMA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;CAUV,YAAY,GACVA,cAAkB,mBAClB,GAAG;+BACwB,OAAO,kBAAkB;sDACF,OAAO,kBAAkB;sDACzB,OAAO,kBAAkB;KAE7E;CACA,OAAO,GAAG;;;;aAIC,OAAO,kBAAkB;;;;gCAIN,OAAO,cAAc;;;eAGtC,OAAO,mBAAmB;;;CAGvC,OAAO,GAAG;CACV,QAAQ,GACNA,cAAkB,eAClB,GAAG;+BACwB,OAAO,mBAAmB;sDACH,OAAO,kBAAkB;sDACzB,OAAO,kBAAkB;KAE7E;CACA,OAAO,GAAG;CACV,YAAY,GAAG;CACf,MAAM,GAAG;;;kCAGuB,OAAO,cAAc;;;;;;CAMrD,MAAM,GAAG;CACT,kBAAkB,GAAG;;;;;CAKrB,eAAe,GAAG;;;;;;;;aAQP,OAAO,aAAa;;CAE/B,UAAU,GAAG;CACb,MAAM,GAAG;;;;;;;;CAQT,gBAAgB,GAAG;;;CAGnB,UAAU,GACRA,cAAkB,iBAClB,GAAG;+BACwB,OAAO,kBAAkB;sDACF,OAAO,iBAAiB;sDACxB,OAAO,iBAAiB;KAE5E;CACA,OAAO,GAAG;;;;;;;;;;;;;;sBAcU,OAAO,cAAc;wBACnB,OAAO,cAAc;;;;;;;;CAQ3C,YAAY,GAAG;;;;CAIf,QAAQ,GAAG;;;aAGA,OAAO,mBAAmB;;CAErC,aAAa,GAAG;;;;;;;;;aASL,OAAO,mBAAmB;;kBAErB,OAAO,gBAAgB;;CAEvC,QAAQ,GAAG;;;;;;;;;;kCAUqB,OAAO,mBAAmB;;CAE1D,aAAa,GAAG;;;;;;;;;;aAUL,OAAO,UAAU;;;;;;eAMf,OAAO,qBAAqB;;;CAGzC,QAAQA,cAAkB;CAC1B,QAAQ,GAAG;;;;aAIA,OAAO,mBAAmB;;CAErC,KAAK,GAAG;;;;;;;qBAOW,OAAO,eAAe;;;;aAI9B,OAAO,UAAU;;kBAEZ,OAAO,kBAAkB;;CAEzC,UAAU,GAAG;;;;;;;;;aASF,OAAO,mBAAmB;;gCAEP,OAAO,cAAc;;CAEnD,MAAM,GAAG;;;;;;CAMT,WAAW,GAAG;;;CAGd,YAAY,GAAG;;;;;CAKf,SAAS,GAAG;;;;;;;;;;;qBAWO,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;;;4BAKF,OAAO,cAAc;;;;;;+CAMF,OAAO,kBAAkB;;;;2BAI7C,OAAO,mBAAmB;;;;;;;;;;;;;;;eAetC,OAAO,kBAAkB;;;;;;;;;;eAUzB,OAAO,mBAAmB;;;;;;;;;;;;;CAavC,cAAc,GAAG;kBACD,cAAc,MAAM;;;;;;;CAOpC,eAAe,GAAG;kBACF,cAAc,OAAO;;;;;;;CAOrC,cAAc,GAAG;kBACD,cAAc,MAAM;;;;;;;CAOpC,OAAO,GAAG;;;;;;;;;;;;eAYG,OAAO,qBAAqB;;;CAGzC,WAAW,GAAG;;;;;AAKhB,EAAE;AAEF,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,iBAAiB;EACf,QAAQ;EACR,MAAM;EACN,SAAS;CACX;CACA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,OAAO,OAAO;EAChB;EACA,SAAS;GACP,YAAY,OAAO;GACnB,QAAQ,OAAO;GACf,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Select/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { controlHeight } from '@/base-ui/controlSize';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n arrow: css`\n display: flex;\n width: 12px;\n height: 6px;\n\n & > svg {\n width: 100%;\n height: 100%;\n }\n `,\n borderless: cx(\n lobeStaticStylish.variantBorderless,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillTertiary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 70%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 55%, transparent);\n `,\n ),\n clear: css`\n display: inline-flex;\n align-items: center;\n\n color: ${cssVar.colorTextTertiary};\n\n opacity: 0;\n\n transition: opacity 150ms ${cssVar.motionEaseOut};\n\n &:hover {\n color: ${cssVar.colorTextSecondary};\n }\n `,\n empty: css``,\n filled: cx(\n lobeStaticStylish.variantFilled,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillSecondary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 70%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorFillTertiary} 55%, transparent);\n `,\n ),\n group: css``,\n groupLabel: css``,\n icon: css`\n display: inline-flex;\n align-items: center;\n transition: transform 150ms ${cssVar.motionEaseOut};\n\n &[data-popup-open] {\n transform: rotate(180deg);\n }\n `,\n item: css``,\n itemBoldSelected: css`\n &[data-selected] {\n font-weight: 600;\n }\n `,\n itemIndicator: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n margin-inline-start: auto;\n padding-inline-start: 8px;\n\n color: ${cssVar.colorPrimary};\n `,\n itemText: css``,\n list: css`\n overflow-y: auto;\n flex: 1;\n\n min-height: 0;\n max-height: var(--lobe-select-available-height, var(--available-height));\n padding-block: 0;\n `,\n listWithSearch: css`\n padding-block-start: 4px;\n `,\n outlined: cx(\n lobeStaticStylish.variantOutlined,\n css`\n --lobe-select-open-bg: ${cssVar.colorFillTertiary};\n --lobe-select-readonly-bg: color-mix(in srgb, ${cssVar.colorBgContainer} 75%, transparent);\n --lobe-select-disabled-bg: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n `,\n ),\n popup: css`\n --lobe-select-available-height: min(\n var(--available-height),\n var(--lobe-select-popup-max-height, var(--available-height))\n );\n\n transform-origin: var(--transform-origin);\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n\n transition:\n opacity 150ms ${cssVar.motionEaseOut},\n transform 150ms ${cssVar.motionEaseOut};\n\n &[data-starting-style],\n &[data-ending-style] {\n transform: scaleY(0.92);\n opacity: 0;\n }\n `,\n positioner: css`\n z-index: 1100;\n outline: none;\n `,\n prefix: css`\n display: inline-flex;\n align-items: center;\n color: ${cssVar.colorTextSecondary};\n `,\n scrollArrow: css`\n cursor: default;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n height: 16px;\n\n color: ${cssVar.colorTextSecondary};\n\n background: ${cssVar.colorBgElevated};\n `,\n search: css`\n cursor: text;\n\n display: flex;\n align-items: center;\n\n min-height: 36px;\n margin-inline: -4px;\n padding-block: 8px;\n padding-inline: 12px;\n border-block-end: 1px solid ${cssVar.colorFillSecondary};\n `,\n searchInput: css`\n flex: 1;\n\n min-width: 0;\n padding-block: 0;\n padding-inline: 4px;\n border: 0;\n\n font-size: 14px;\n line-height: 20px;\n color: ${cssVar.colorText};\n\n background: transparent;\n outline: none;\n\n &::placeholder {\n color: ${cssVar.colorTextPlaceholder};\n }\n `,\n shadow: lobeStaticStylish.shadow,\n suffix: css`\n display: inline-flex;\n gap: 6px;\n align-items: center;\n color: ${cssVar.colorTextSecondary};\n `,\n tag: css`\n display: inline-flex;\n align-items: center;\n\n max-width: 100%;\n padding-block: 0;\n padding-inline: 6px;\n border-radius: ${cssVar.borderRadiusSM};\n\n font-size: 12px;\n line-height: 20px;\n color: ${cssVar.colorText};\n\n background: ${cssVar.colorFillTertiary};\n `,\n tagClose: css`\n cursor: pointer;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n margin-inline-start: 4px;\n\n color: ${cssVar.colorTextSecondary};\n\n transition: opacity 150ms ${cssVar.motionEaseOut};\n `,\n tags: css`\n display: flex;\n flex-wrap: wrap;\n gap: 4px;\n align-items: center;\n `,\n tagsValue: css`\n /* No growing, so an empty trigger leaves the inline input the full width — but it must\n still shrink, or the tags stay at max-content and run off the trigger instead of wrapping. */\n flex: 0 1 auto;\n `,\n tagsSearch: css`\n display: flex;\n flex: 1;\n min-width: 48px;\n `,\n trigger: css`\n cursor: pointer;\n user-select: none;\n\n display: inline-flex;\n gap: 8px;\n align-items: center;\n\n box-sizing: border-box;\n width: 100%;\n border: 1px solid transparent;\n border-radius: ${cssVar.borderRadius};\n\n font-family: inherit;\n color: ${cssVar.colorText};\n\n background: transparent;\n outline: none;\n\n transition: all 150ms ${cssVar.motionEaseOut};\n\n &:not([data-disabled], [data-readonly])[data-popup-open],\n &:not([data-disabled], [data-readonly])[data-open],\n &:not([data-disabled], [data-readonly])[data-state='open'],\n &:not([data-disabled], [data-readonly])[aria-expanded='true'] {\n background: var(--lobe-select-open-bg, ${cssVar.colorFillTertiary});\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n\n &:hover [data-role='lobe-select-clear'] {\n opacity: 1;\n }\n\n &[data-placeholder] [data-role='lobe-select-clear'] {\n pointer-events: none;\n opacity: 0;\n }\n\n &[data-disabled] {\n cursor: not-allowed;\n color: ${cssVar.colorTextDisabled};\n background: var(--lobe-select-disabled-bg, transparent);\n\n &:hover {\n background: var(--lobe-select-disabled-bg, transparent);\n }\n }\n\n &[data-readonly] {\n cursor: default;\n color: ${cssVar.colorTextSecondary};\n background: var(--lobe-select-readonly-bg, transparent);\n\n &:hover {\n background: var(--lobe-select-readonly-bg, transparent);\n }\n }\n\n &[data-disabled] [data-role='lobe-select-clear'] {\n pointer-events: none;\n opacity: 0;\n }\n `,\n triggerLarge: css`\n min-height: ${controlHeight.large}px;\n padding-block: 6px;\n padding-inline: 12px;\n\n font-size: 16px;\n line-height: 24px;\n `,\n triggerMiddle: css`\n min-height: ${controlHeight.middle}px;\n padding-block: 4px;\n padding-inline: 11px;\n\n font-size: 14px;\n line-height: 20px;\n `,\n triggerSmall: css`\n min-height: ${controlHeight.small}px;\n padding-block: 0;\n padding-inline: 8px;\n\n font-size: 12px;\n line-height: 18px;\n `,\n value: css`\n display: flex;\n flex: 1;\n flex-wrap: wrap;\n gap: 4px;\n align-items: center;\n\n min-width: 0;\n\n color: inherit;\n\n &[data-placeholder] {\n color: ${cssVar.colorTextPlaceholder};\n }\n `,\n valueText: css`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n}));\n\nexport const triggerVariants = cva(styles.trigger, {\n defaultVariants: {\n shadow: false,\n size: 'middle',\n variant: 'outlined',\n },\n variants: {\n shadow: {\n false: null,\n true: styles.shadow,\n },\n size: {\n large: styles.triggerLarge,\n middle: styles.triggerMiddle,\n small: styles.triggerSmall,\n },\n variant: {\n borderless: styles.borderless,\n filled: styles.filled,\n outlined: styles.outlined,\n },\n },\n});\n"],"mappings":";;;;;AAMA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;CAUV,YAAY,GACVA,cAAkB,mBAClB,GAAG;+BACwB,OAAO,kBAAkB;sDACF,OAAO,kBAAkB;sDACzB,OAAO,kBAAkB;KAE7E;CACA,OAAO,GAAG;;;;aAIC,OAAO,kBAAkB;;;;gCAIN,OAAO,cAAc;;;eAGtC,OAAO,mBAAmB;;;CAGvC,OAAO,GAAG;CACV,QAAQ,GACNA,cAAkB,eAClB,GAAG;+BACwB,OAAO,mBAAmB;sDACH,OAAO,kBAAkB;sDACzB,OAAO,kBAAkB;KAE7E;CACA,OAAO,GAAG;CACV,YAAY,GAAG;CACf,MAAM,GAAG;;;kCAGuB,OAAO,cAAc;;;;;;CAMrD,MAAM,GAAG;CACT,kBAAkB,GAAG;;;;;CAKrB,eAAe,GAAG;;;;;;;;aAQP,OAAO,aAAa;;CAE/B,UAAU,GAAG;CACb,MAAM,GAAG;;;;;;;;CAQT,gBAAgB,GAAG;;;CAGnB,UAAU,GACRA,cAAkB,iBAClB,GAAG;+BACwB,OAAO,kBAAkB;sDACF,OAAO,iBAAiB;sDACxB,OAAO,iBAAiB;KAE5E;CACA,OAAO,GAAG;;;;;;;;;;;;;;sBAcU,OAAO,cAAc;wBACnB,OAAO,cAAc;;;;;;;;CAQ3C,YAAY,GAAG;;;;CAIf,QAAQ,GAAG;;;aAGA,OAAO,mBAAmB;;CAErC,aAAa,GAAG;;;;;;;;;aASL,OAAO,mBAAmB;;kBAErB,OAAO,gBAAgB;;CAEvC,QAAQ,GAAG;;;;;;;;;;kCAUqB,OAAO,mBAAmB;;CAE1D,aAAa,GAAG;;;;;;;;;;aAUL,OAAO,UAAU;;;;;;eAMf,OAAO,qBAAqB;;;CAGzC,QAAQA,cAAkB;CAC1B,QAAQ,GAAG;;;;aAIA,OAAO,mBAAmB;;CAErC,KAAK,GAAG;;;;;;;qBAOW,OAAO,eAAe;;;;aAI9B,OAAO,UAAU;;kBAEZ,OAAO,kBAAkB;;CAEzC,UAAU,GAAG;;;;;;;;;aASF,OAAO,mBAAmB;;gCAEP,OAAO,cAAc;;CAEnD,MAAM,GAAG;;;;;;CAMT,WAAW,GAAG;;;;;CAKd,YAAY,GAAG;;;;;CAKf,SAAS,GAAG;;;;;;;;;;;qBAWO,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;;;4BAKF,OAAO,cAAc;;;;;;+CAMF,OAAO,kBAAkB;;;;2BAI7C,OAAO,mBAAmB;;;;;;;;;;;;;;;eAetC,OAAO,kBAAkB;;;;;;;;;;eAUzB,OAAO,mBAAmB;;;;;;;;;;;;;CAavC,cAAc,GAAG;kBACD,cAAc,MAAM;;;;;;;CAOpC,eAAe,GAAG;kBACF,cAAc,OAAO;;;;;;;CAOrC,cAAc,GAAG;kBACD,cAAc,MAAM;;;;;;;CAOpC,OAAO,GAAG;;;;;;;;;;;;eAYG,OAAO,qBAAqB;;;CAGzC,WAAW,GAAG;;;;;AAKhB,EAAE;AAEF,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,iBAAiB;EACf,QAAQ;EACR,MAAM;EACN,SAAS;CACX;CACA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,OAAO,OAAO;EAChB;EACA,SAAS;GACP,YAAY,OAAO;GACnB,QAAQ,OAAO;GACf,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}
|
package/es/base-ui/index.d.mts
CHANGED
|
@@ -29,27 +29,31 @@ import "./ScrollArea/index.mjs";
|
|
|
29
29
|
import { ToastAPI, ToastInstance, ToastOptions, ToastPosition, ToastPromiseOptions, ToastProps, ToastType } from "./Toast/type.mjs";
|
|
30
30
|
import { ToastHost, ToastHostProps, toast, useToast } from "./Toast/imperative.mjs";
|
|
31
31
|
import "./Toast/index.mjs";
|
|
32
|
+
import { AlertClassNames, AlertCloseConfig, AlertProps, AlertRef, AlertStyles, AlertType, AlertVariant } from "./Alert/type.mjs";
|
|
33
|
+
import Alert from "./Alert/Alert.mjs";
|
|
34
|
+
import { styles } from "./Alert/style.mjs";
|
|
35
|
+
import "./Alert/index.mjs";
|
|
32
36
|
import { InputClassNames, InputNumberProps, InputOTPProps, InputPasswordProps, InputProps, InputSize, InputStyles, InputVariant, TextAreaAutoSize, TextAreaProps } from "./Input/type.mjs";
|
|
33
37
|
import Input from "./Input/Input.mjs";
|
|
34
38
|
import InputNumber from "./Input/InputNumber.mjs";
|
|
35
39
|
import InputOTP from "./Input/InputOTP.mjs";
|
|
36
40
|
import InputPassword from "./Input/InputPassword.mjs";
|
|
37
|
-
import { rootVariants, styles as styles$
|
|
41
|
+
import { rootVariants, styles as styles$4 } from "./Input/style.mjs";
|
|
38
42
|
import TextArea from "./Input/TextArea.mjs";
|
|
39
43
|
import "./Input/index.mjs";
|
|
40
44
|
import { AutoCompleteOption, AutoCompleteProps } from "./AutoComplete/type.mjs";
|
|
41
45
|
import AutoComplete from "./AutoComplete/AutoComplete.mjs";
|
|
42
|
-
import { styles } from "./AutoComplete/style.mjs";
|
|
46
|
+
import { styles as styles$1 } from "./AutoComplete/style.mjs";
|
|
43
47
|
import "./AutoComplete/index.mjs";
|
|
44
48
|
import { ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType } from "./Button/type.mjs";
|
|
45
49
|
import Button from "./Button/Button.mjs";
|
|
46
50
|
import _default, { SplitButtonMenuProps, SplitButtonProps } from "./Button/SplitButton.mjs";
|
|
47
|
-
import { styles as styles$
|
|
51
|
+
import { styles as styles$2 } from "./Button/style.mjs";
|
|
48
52
|
import "./Button/index.mjs";
|
|
49
53
|
import { CheckboxGroupOption, CheckboxGroupProps, CheckboxProps, CheckboxShape } from "./Checkbox/type.mjs";
|
|
50
54
|
import Checkbox from "./Checkbox/Checkbox.mjs";
|
|
51
55
|
import CheckboxGroup from "./Checkbox/CheckboxGroup.mjs";
|
|
52
|
-
import { styles as styles$
|
|
56
|
+
import { styles as styles$3 } from "./Checkbox/style.mjs";
|
|
53
57
|
import "./Checkbox/index.mjs";
|
|
54
58
|
import { ControlSize, controlHeight } from "./controlSize.mjs";
|
|
55
59
|
import { DrawerPlacement, DrawerProps, DrawerPush, DrawerSemanticNames, DrawerSemanticStyles } from "./Drawer/type.mjs";
|
|
@@ -83,7 +87,7 @@ import { Form } from "./Form/index.mjs";
|
|
|
83
87
|
import { RadioGroupOption, RadioGroupProps, RadioProps } from "./Radio/type.mjs";
|
|
84
88
|
import Radio from "./Radio/Radio.mjs";
|
|
85
89
|
import RadioGroup from "./Radio/RadioGroup.mjs";
|
|
86
|
-
import { styles as styles$
|
|
90
|
+
import { styles as styles$5 } from "./Radio/style.mjs";
|
|
87
91
|
import "./Radio/index.mjs";
|
|
88
92
|
import { SegmentedClassNames, SegmentedOption, SegmentedOptions, SegmentedOrientation, SegmentedProps, SegmentedSize, SegmentedStyles, SegmentedVariant } from "./Segmented/type.mjs";
|
|
89
93
|
import { SegmentedIndicator, SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedItemProps, SegmentedRoot, SegmentedRootProps } from "./Segmented/atoms.mjs";
|
|
@@ -96,16 +100,16 @@ import "./Select/index.mjs";
|
|
|
96
100
|
import { SliderProps, SliderWithInputProps } from "./Slider/type.mjs";
|
|
97
101
|
import Slider from "./Slider/Slider.mjs";
|
|
98
102
|
import SliderWithInput from "./Slider/SliderWithInput.mjs";
|
|
99
|
-
import { styles as styles$
|
|
103
|
+
import { styles as styles$6 } from "./Slider/style.mjs";
|
|
100
104
|
import "./Slider/index.mjs";
|
|
101
105
|
import { SwitchChangeEventHandler, SwitchClassNames, SwitchClickEventHandler, SwitchContextType, SwitchIconPosition, SwitchIconProps, SwitchProps, SwitchRootProps, SwitchSize, SwitchStyles, SwitchThumbProps } from "./Switch/type.mjs";
|
|
102
|
-
import { styles as styles$
|
|
106
|
+
import { styles as styles$7 } from "./Switch/style.mjs";
|
|
103
107
|
import { SwitchIcon, SwitchRoot, SwitchThumb, useSwitchContext } from "./Switch/atoms.mjs";
|
|
104
108
|
import Switch from "./Switch/Switch.mjs";
|
|
105
109
|
import "./Switch/index.mjs";
|
|
106
110
|
import { TabsClassNames, TabsIndicatorProps, TabsItem, TabsListProps, TabsOrientation, TabsPanelProps, TabsProps, TabsRootProps, TabsSize, TabsStyles, TabsTabProps, TabsVariant } from "./Tabs/type.mjs";
|
|
107
|
-
import { styles as styles$
|
|
111
|
+
import { styles as styles$8 } from "./Tabs/style.mjs";
|
|
108
112
|
import { TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, useTabsContext } from "./Tabs/atoms.mjs";
|
|
109
113
|
import Tabs from "./Tabs/Tabs.mjs";
|
|
110
114
|
import "./Tabs/index.mjs";
|
|
111
|
-
export { AutoComplete, type AutoCompleteOption, type AutoCompleteProps, 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 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, 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, TextArea, type TextAreaAutoSize, type TextAreaProps, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, styles as autoCompleteStyles, backdropTransition, styles$
|
|
115
|
+
export { Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, AutoComplete, type AutoCompleteOption, type AutoCompleteProps, 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 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, 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, TextArea, type TextAreaAutoSize, type TextAreaProps, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, Tooltip, TooltipGroup, type TooltipGroupProps, type TooltipPlacement, type TooltipPopupComponentProps, type TooltipPortalProps, type TooltipPositionerProps, type TooltipProps, type TooltipTriggerComponentProps, styles as alertStyles, styles$1 as autoCompleteStyles, backdropTransition, styles$2 as buttonStyles, styles$3 as checkboxStyles, closeContextMenu, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$4 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, styles$5 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$6 as sliderStyles, styles$7 as switchStyles, styles$8 as tabsStyles, toast, updateContextMenuItems, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|
package/es/base-ui/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Tooltip } from "./Tooltip/Tooltip.mjs";
|
|
2
2
|
import TooltipGroup from "./Tooltip/TooltipGroup.mjs";
|
|
3
|
-
import { styles as styles$
|
|
3
|
+
import { styles as styles$7 } from "./Switch/style.mjs";
|
|
4
4
|
import { SwitchIcon, SwitchRoot, SwitchThumb, useSwitchContext } from "./Switch/atoms.mjs";
|
|
5
5
|
import Switch from "./Switch/Switch.mjs";
|
|
6
6
|
import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger } from "./DropdownMenu/atoms.mjs";
|
|
@@ -19,19 +19,21 @@ import PopoverGroup from "./Popover/PopoverGroup.mjs";
|
|
|
19
19
|
import { ToastHost, toast, useToast } from "./Toast/imperative.mjs";
|
|
20
20
|
import { ScrollAreaContent, ScrollAreaCorner, ScrollAreaRoot, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaViewport } from "./ScrollArea/atoms.mjs";
|
|
21
21
|
import { ScrollArea } from "./ScrollArea/ScrollArea.mjs";
|
|
22
|
+
import { styles } from "./Alert/style.mjs";
|
|
23
|
+
import Alert from "./Alert/Alert.mjs";
|
|
22
24
|
import { controlHeight } from "./controlSize.mjs";
|
|
23
|
-
import { rootVariants, styles as styles$
|
|
25
|
+
import { rootVariants, styles as styles$4 } from "./Input/style.mjs";
|
|
24
26
|
import Input from "./Input/Input.mjs";
|
|
25
27
|
import InputNumber from "./Input/InputNumber.mjs";
|
|
26
28
|
import InputOTP from "./Input/InputOTP.mjs";
|
|
27
29
|
import InputPassword from "./Input/InputPassword.mjs";
|
|
28
30
|
import TextArea from "./Input/TextArea.mjs";
|
|
29
|
-
import { styles } from "./AutoComplete/style.mjs";
|
|
31
|
+
import { styles as styles$1 } from "./AutoComplete/style.mjs";
|
|
30
32
|
import AutoComplete from "./AutoComplete/AutoComplete.mjs";
|
|
31
|
-
import { styles as styles$
|
|
33
|
+
import { styles as styles$2 } from "./Button/style.mjs";
|
|
32
34
|
import Button from "./Button/Button.mjs";
|
|
33
35
|
import SplitButton from "./Button/SplitButton.mjs";
|
|
34
|
-
import { styles as styles$
|
|
36
|
+
import { styles as styles$3 } from "./Checkbox/style.mjs";
|
|
35
37
|
import Checkbox from "./Checkbox/Checkbox.mjs";
|
|
36
38
|
import CheckboxGroup from "./Checkbox/CheckboxGroup.mjs";
|
|
37
39
|
import { drawerBackdropTransition, getDrawerMotionConfig } from "./Drawer/constants.mjs";
|
|
@@ -53,17 +55,17 @@ import FormFooter from "./Form/components/FormFooter.mjs";
|
|
|
53
55
|
import FormGroup from "./Form/components/FormGroup.mjs";
|
|
54
56
|
import FormSubmitFooter from "./Form/components/FormSubmitFooter.mjs";
|
|
55
57
|
import { Form } from "./Form/index.mjs";
|
|
56
|
-
import { styles as styles$
|
|
58
|
+
import { styles as styles$5 } from "./Radio/style.mjs";
|
|
57
59
|
import Radio from "./Radio/Radio.mjs";
|
|
58
60
|
import RadioGroup from "./Radio/RadioGroup.mjs";
|
|
59
61
|
import { SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot } from "./Segmented/atoms.mjs";
|
|
60
62
|
import Segmented from "./Segmented/Segmented.mjs";
|
|
61
63
|
import { SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue } from "./Select/atoms.mjs";
|
|
62
64
|
import Select from "./Select/Select.mjs";
|
|
63
|
-
import { styles as styles$
|
|
65
|
+
import { styles as styles$6 } from "./Slider/style.mjs";
|
|
64
66
|
import Slider from "./Slider/Slider.mjs";
|
|
65
67
|
import SliderWithInput from "./Slider/SliderWithInput.mjs";
|
|
66
|
-
import { styles as styles$
|
|
68
|
+
import { styles as styles$8 } from "./Tabs/style.mjs";
|
|
67
69
|
import { TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, useTabsContext } from "./Tabs/atoms.mjs";
|
|
68
70
|
import Tabs from "./Tabs/Tabs.mjs";
|
|
69
|
-
export { AutoComplete, 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, Slider, SliderWithInput, SplitButton, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, TextArea, ToastHost, Tooltip, TooltipGroup, styles as autoCompleteStyles, backdropTransition, styles$
|
|
71
|
+
export { Alert, AutoComplete, 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, Slider, SliderWithInput, SplitButton, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, TextArea, ToastHost, Tooltip, TooltipGroup, styles as alertStyles, styles$1 as autoCompleteStyles, backdropTransition, styles$2 as buttonStyles, styles$3 as checkboxStyles, closeContextMenu, confirmModal, controlHeight, createModal, createModalSystem, drawerBackdropTransition, getDrawerMotionConfig, styles$4 as inputStyles, rootVariants as inputVariants, modalMotionConfig, parseTrigger, styles$5 as radioStyles, renderDropdownMenuItems, setContextMenuInterceptor, showContextMenu, styles$6 as sliderStyles, styles$7 as switchStyles, styles$8 as tabsStyles, toast, updateContextMenuItems, useDrawerActions, useDrawerOpen, useFormContext, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
|