@lobehub/ui 5.15.13 → 5.15.14
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/Accordion/Accordion.mjs +2 -2
- package/es/Accordion/Accordion.mjs.map +1 -1
- package/es/Accordion/AccordionItem.mjs +2 -2
- package/es/Accordion/AccordionItem.mjs.map +1 -1
- package/es/Alert/type.d.mts +1 -1
- package/es/Checkbox/Checkbox.mjs +2 -2
- package/es/Checkbox/Checkbox.mjs.map +1 -1
- package/es/Checkbox/CheckboxGroup.mjs +2 -2
- package/es/Checkbox/CheckboxGroup.mjs.map +1 -1
- package/es/CodeEditor/CodeEditor.mjs +2 -2
- package/es/CodeEditor/CodeEditor.mjs.map +1 -1
- package/es/ColorSwatches/ColorSwatches.mjs +2 -2
- package/es/ColorSwatches/ColorSwatches.mjs.map +1 -1
- package/es/DraggablePanel/DraggablePanel.mjs +2 -2
- package/es/DraggablePanel/DraggablePanel.mjs.map +1 -1
- package/es/DraggablePanel/components/DraggablePanelHeader.mjs +2 -2
- package/es/DraggablePanel/components/DraggablePanelHeader.mjs.map +1 -1
- package/es/DraggableSideNav/DraggableSideNav.mjs +2 -2
- package/es/DraggableSideNav/DraggableSideNav.mjs.map +1 -1
- package/es/EditableText/EditableText.mjs +2 -2
- package/es/EditableText/EditableText.mjs.map +1 -1
- package/es/EditorSlashMenu/atoms.d.mts +12 -13
- package/es/EmojiPicker/EmojiPicker.mjs +3 -3
- package/es/EmojiPicker/EmojiPicker.mjs.map +1 -1
- package/es/Form/type.d.mts +1 -1
- package/es/Freeze/Freeze.d.mts +2 -2
- package/es/HotkeyInput/HotkeyInput.mjs +2 -2
- package/es/HotkeyInput/HotkeyInput.mjs.map +1 -1
- package/es/ImageSelect/ImageSelect.mjs +2 -2
- package/es/ImageSelect/ImageSelect.mjs.map +1 -1
- package/es/Modal/Modal.mjs.map +1 -1
- package/es/Modal/imperative.d.mts +2 -2
- package/es/SearchBar/SearchBar.mjs +2 -2
- package/es/SearchBar/SearchBar.mjs.map +1 -1
- package/es/Tabs/Tabs.mjs +18 -8
- package/es/Tabs/Tabs.mjs.map +1 -1
- package/es/ThemeProvider/GlobalStyle/global.mjs +20 -3
- package/es/ThemeProvider/GlobalStyle/global.mjs.map +1 -1
- package/es/ThemeProvider/ThemeProvider.mjs +8 -4
- package/es/ThemeProvider/ThemeProvider.mjs.map +1 -1
- package/es/Toc/TocMobile.mjs +2 -2
- package/es/Toc/TocMobile.mjs.map +1 -1
- package/es/base-ui/Button/Button.d.mts +2 -2
- package/es/base-ui/ContextMenu/ContextMenuHost.d.mts +1 -2
- package/es/base-ui/DropdownMenu/atoms.d.mts +20 -21
- package/es/base-ui/FloatingSheet/FloatingSheet.d.mts +2 -2
- package/es/base-ui/Modal/atoms.d.mts +11 -12
- package/es/base-ui/Popover/ArrowIcon.d.mts +2 -2
- package/es/base-ui/Popover/atoms.d.mts +6 -7
- package/es/base-ui/ScrollArea/atoms.d.mts +6 -7
- package/es/base-ui/Select/atoms.d.mts +15 -16
- package/es/base-ui/Switch/atoms.d.mts +4 -4
- package/es/base-ui/Switch/atoms.mjs +2 -2
- package/es/base-ui/Switch/atoms.mjs.map +1 -1
- package/es/base-ui/Toast/imperative.d.mts +1 -2
- package/es/chat/EditableMessage/EditableMessage.mjs +3 -3
- package/es/chat/EditableMessage/EditableMessage.mjs.map +1 -1
- package/es/chat/MessageModal/MessageModal.mjs +3 -3
- package/es/chat/MessageModal/MessageModal.mjs.map +1 -1
- package/es/mobile/TabBar/TabBar.mjs +2 -2
- package/es/mobile/TabBar/TabBar.mjs.map +1 -1
- package/es/styles/theme/token/base.mjs +49 -8
- package/es/styles/theme/token/base.mjs.map +1 -1
- package/package.json +32 -32
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { ScrollArea } from "@base-ui/react/scroll-area";
|
|
4
3
|
|
|
5
4
|
//#region src/base-ui/ScrollArea/atoms.d.ts
|
|
@@ -26,7 +25,7 @@ declare const ScrollAreaRoot: {
|
|
|
26
25
|
({
|
|
27
26
|
className,
|
|
28
27
|
...rest
|
|
29
|
-
}: ScrollAreaRootProps):
|
|
28
|
+
}: ScrollAreaRootProps): React.JSX.Element;
|
|
30
29
|
displayName: string;
|
|
31
30
|
};
|
|
32
31
|
declare const ScrollAreaViewport: {
|
|
@@ -34,35 +33,35 @@ declare const ScrollAreaViewport: {
|
|
|
34
33
|
className,
|
|
35
34
|
scrollFade,
|
|
36
35
|
...rest
|
|
37
|
-
}: ScrollAreaViewportProps):
|
|
36
|
+
}: ScrollAreaViewportProps): React.JSX.Element;
|
|
38
37
|
displayName: string;
|
|
39
38
|
};
|
|
40
39
|
declare const ScrollAreaContent: {
|
|
41
40
|
({
|
|
42
41
|
className,
|
|
43
42
|
...rest
|
|
44
|
-
}: ScrollAreaContentProps):
|
|
43
|
+
}: ScrollAreaContentProps): React.JSX.Element;
|
|
45
44
|
displayName: string;
|
|
46
45
|
};
|
|
47
46
|
declare const ScrollAreaScrollbar: {
|
|
48
47
|
({
|
|
49
48
|
className,
|
|
50
49
|
...rest
|
|
51
|
-
}: ScrollAreaScrollbarProps):
|
|
50
|
+
}: ScrollAreaScrollbarProps): React.JSX.Element;
|
|
52
51
|
displayName: string;
|
|
53
52
|
};
|
|
54
53
|
declare const ScrollAreaThumb: {
|
|
55
54
|
({
|
|
56
55
|
className,
|
|
57
56
|
...rest
|
|
58
|
-
}: ScrollAreaThumbProps):
|
|
57
|
+
}: ScrollAreaThumbProps): React.JSX.Element;
|
|
59
58
|
displayName: string;
|
|
60
59
|
};
|
|
61
60
|
declare const ScrollAreaCorner: {
|
|
62
61
|
({
|
|
63
62
|
className,
|
|
64
63
|
...rest
|
|
65
|
-
}: ScrollAreaCornerProps):
|
|
64
|
+
}: ScrollAreaCornerProps): React.JSX.Element;
|
|
66
65
|
displayName: string;
|
|
67
66
|
};
|
|
68
67
|
//#endregion
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { SelectSize, SelectVariant } from "./type.mjs";
|
|
2
2
|
import * as _$react from "react";
|
|
3
3
|
import { ComponentProps, ComponentPropsWithRef } from "react";
|
|
4
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
4
|
import { Select } from "@base-ui/react/select";
|
|
6
5
|
import * as _$_base_ui_react0 from "@base-ui/react";
|
|
7
6
|
|
|
@@ -25,7 +24,7 @@ declare const SelectTrigger: {
|
|
|
25
24
|
variant,
|
|
26
25
|
ref: refProp,
|
|
27
26
|
...rest
|
|
28
|
-
}: SelectTriggerProps): _$
|
|
27
|
+
}: SelectTriggerProps): _$react.JSX.Element;
|
|
29
28
|
displayName: string;
|
|
30
29
|
};
|
|
31
30
|
type SelectIconProps = ComponentProps<typeof Select.Icon>;
|
|
@@ -33,7 +32,7 @@ declare const SelectIcon: {
|
|
|
33
32
|
({
|
|
34
33
|
className,
|
|
35
34
|
...rest
|
|
36
|
-
}: SelectIconProps): _$
|
|
35
|
+
}: SelectIconProps): _$react.JSX.Element;
|
|
37
36
|
displayName: string;
|
|
38
37
|
};
|
|
39
38
|
type SelectValueProps = ComponentProps<typeof Select.Value>;
|
|
@@ -41,7 +40,7 @@ declare const SelectValue: {
|
|
|
41
40
|
({
|
|
42
41
|
className,
|
|
43
42
|
...rest
|
|
44
|
-
}: SelectValueProps): _$
|
|
43
|
+
}: SelectValueProps): _$react.JSX.Element;
|
|
45
44
|
displayName: string;
|
|
46
45
|
};
|
|
47
46
|
type SelectPortalProps = ComponentProps<typeof Select.Portal> & {
|
|
@@ -54,7 +53,7 @@ declare const SelectPortal: {
|
|
|
54
53
|
({
|
|
55
54
|
container,
|
|
56
55
|
...rest
|
|
57
|
-
}: SelectPortalProps): _$
|
|
56
|
+
}: SelectPortalProps): _$react.JSX.Element;
|
|
58
57
|
displayName: string;
|
|
59
58
|
};
|
|
60
59
|
type SelectPositionerProps = ComponentProps<typeof Select.Positioner>;
|
|
@@ -68,7 +67,7 @@ declare const SelectPositioner: {
|
|
|
68
67
|
style,
|
|
69
68
|
ref: forwardedRef,
|
|
70
69
|
...rest
|
|
71
|
-
}: SelectPositionerProps): _$
|
|
70
|
+
}: SelectPositionerProps): _$react.JSX.Element;
|
|
72
71
|
displayName: string;
|
|
73
72
|
};
|
|
74
73
|
type SelectPopupProps = ComponentProps<typeof Select.Popup>;
|
|
@@ -76,7 +75,7 @@ declare const SelectPopup: {
|
|
|
76
75
|
({
|
|
77
76
|
className,
|
|
78
77
|
...rest
|
|
79
|
-
}: SelectPopupProps): _$
|
|
78
|
+
}: SelectPopupProps): _$react.JSX.Element;
|
|
80
79
|
displayName: string;
|
|
81
80
|
};
|
|
82
81
|
type SelectListProps = ComponentProps<typeof Select.List>;
|
|
@@ -84,7 +83,7 @@ declare const SelectList: {
|
|
|
84
83
|
({
|
|
85
84
|
className,
|
|
86
85
|
...rest
|
|
87
|
-
}: SelectListProps): _$
|
|
86
|
+
}: SelectListProps): _$react.JSX.Element;
|
|
88
87
|
displayName: string;
|
|
89
88
|
};
|
|
90
89
|
type SelectItemProps = ComponentProps<typeof Select.Item>;
|
|
@@ -92,7 +91,7 @@ declare const SelectItem: {
|
|
|
92
91
|
({
|
|
93
92
|
className,
|
|
94
93
|
...rest
|
|
95
|
-
}: SelectItemProps): _$
|
|
94
|
+
}: SelectItemProps): _$react.JSX.Element;
|
|
96
95
|
displayName: string;
|
|
97
96
|
};
|
|
98
97
|
type SelectItemTextProps = ComponentProps<typeof Select.ItemText>;
|
|
@@ -100,7 +99,7 @@ declare const SelectItemText: {
|
|
|
100
99
|
({
|
|
101
100
|
className,
|
|
102
101
|
...rest
|
|
103
|
-
}: SelectItemTextProps): _$
|
|
102
|
+
}: SelectItemTextProps): _$react.JSX.Element;
|
|
104
103
|
displayName: string;
|
|
105
104
|
};
|
|
106
105
|
type SelectItemIndicatorProps = ComponentProps<typeof Select.ItemIndicator>;
|
|
@@ -108,7 +107,7 @@ declare const SelectItemIndicator: {
|
|
|
108
107
|
({
|
|
109
108
|
className,
|
|
110
109
|
...rest
|
|
111
|
-
}: SelectItemIndicatorProps): _$
|
|
110
|
+
}: SelectItemIndicatorProps): _$react.JSX.Element;
|
|
112
111
|
displayName: string;
|
|
113
112
|
};
|
|
114
113
|
type SelectGroupProps = ComponentProps<typeof Select.Group>;
|
|
@@ -116,7 +115,7 @@ declare const SelectGroup: {
|
|
|
116
115
|
({
|
|
117
116
|
className,
|
|
118
117
|
...rest
|
|
119
|
-
}: SelectGroupProps): _$
|
|
118
|
+
}: SelectGroupProps): _$react.JSX.Element;
|
|
120
119
|
displayName: string;
|
|
121
120
|
};
|
|
122
121
|
type SelectGroupLabelProps = ComponentProps<typeof Select.GroupLabel>;
|
|
@@ -124,7 +123,7 @@ declare const SelectGroupLabel: {
|
|
|
124
123
|
({
|
|
125
124
|
className,
|
|
126
125
|
...rest
|
|
127
|
-
}: SelectGroupLabelProps): _$
|
|
126
|
+
}: SelectGroupLabelProps): _$react.JSX.Element;
|
|
128
127
|
displayName: string;
|
|
129
128
|
};
|
|
130
129
|
type SelectScrollUpArrowProps = ComponentProps<typeof Select.ScrollUpArrow>;
|
|
@@ -132,7 +131,7 @@ declare const SelectScrollUpArrow: {
|
|
|
132
131
|
({
|
|
133
132
|
className,
|
|
134
133
|
...rest
|
|
135
|
-
}: SelectScrollUpArrowProps): _$
|
|
134
|
+
}: SelectScrollUpArrowProps): _$react.JSX.Element;
|
|
136
135
|
displayName: string;
|
|
137
136
|
};
|
|
138
137
|
type SelectScrollDownArrowProps = ComponentProps<typeof Select.ScrollDownArrow>;
|
|
@@ -140,7 +139,7 @@ declare const SelectScrollDownArrow: {
|
|
|
140
139
|
({
|
|
141
140
|
className,
|
|
142
141
|
...rest
|
|
143
|
-
}: SelectScrollDownArrowProps): _$
|
|
142
|
+
}: SelectScrollDownArrowProps): _$react.JSX.Element;
|
|
144
143
|
displayName: string;
|
|
145
144
|
};
|
|
146
145
|
type SelectArrowProps = ComponentProps<typeof Select.Arrow>;
|
|
@@ -148,7 +147,7 @@ declare const SelectArrow: {
|
|
|
148
147
|
({
|
|
149
148
|
className,
|
|
150
149
|
...rest
|
|
151
|
-
}: SelectArrowProps): _$
|
|
150
|
+
}: SelectArrowProps): _$react.JSX.Element;
|
|
152
151
|
displayName: string;
|
|
153
152
|
};
|
|
154
153
|
//#endregion
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { SwitchChangeEventHandler, SwitchContextType, SwitchIconProps, SwitchRootProps, SwitchThumbProps } from "./type.mjs";
|
|
2
2
|
import { styles } from "./style.mjs";
|
|
3
|
-
import * as _$
|
|
3
|
+
import * as _$react from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/base-ui/Switch/atoms.d.ts
|
|
6
6
|
declare const useSwitchContext: () => SwitchContextType;
|
|
@@ -24,7 +24,7 @@ declare const SwitchRoot: {
|
|
|
24
24
|
id,
|
|
25
25
|
name,
|
|
26
26
|
...rest
|
|
27
|
-
}: SwitchRootInternalProps): _$
|
|
27
|
+
}: SwitchRootInternalProps): _$react.JSX.Element;
|
|
28
28
|
displayName: string;
|
|
29
29
|
};
|
|
30
30
|
declare const SwitchThumb: {
|
|
@@ -35,7 +35,7 @@ declare const SwitchThumb: {
|
|
|
35
35
|
transition,
|
|
36
36
|
children,
|
|
37
37
|
...rest
|
|
38
|
-
}: SwitchThumbProps): _$
|
|
38
|
+
}: SwitchThumbProps): _$react.JSX.Element;
|
|
39
39
|
displayName: string;
|
|
40
40
|
};
|
|
41
41
|
declare const SwitchIcon: {
|
|
@@ -46,7 +46,7 @@ declare const SwitchIcon: {
|
|
|
46
46
|
size,
|
|
47
47
|
transition,
|
|
48
48
|
...rest
|
|
49
|
-
}: SwitchIconProps): _$
|
|
49
|
+
}: SwitchIconProps): _$react.JSX.Element;
|
|
50
50
|
displayName: string;
|
|
51
51
|
};
|
|
52
52
|
//#endregion
|
|
@@ -5,7 +5,7 @@ import { createContext, use, useMemo, useRef, useState } from "react";
|
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
import { cx } from "antd-style";
|
|
7
7
|
import { useReducedMotion } from "motion/react";
|
|
8
|
-
import
|
|
8
|
+
import useControlledState from "use-merge-value";
|
|
9
9
|
import { Switch } from "@base-ui/react/switch";
|
|
10
10
|
//#region src/base-ui/Switch/atoms.tsx
|
|
11
11
|
const SwitchContext = createContext(null);
|
|
@@ -18,7 +18,7 @@ const SwitchRoot = ({ checked, className, defaultChecked, onCheckedChange, onCli
|
|
|
18
18
|
const Motion = useMotionComponent();
|
|
19
19
|
const [isPressed, setIsPressed] = useState(false);
|
|
20
20
|
const lastEventRef = useRef(null);
|
|
21
|
-
const [isChecked, setIsChecked] =
|
|
21
|
+
const [isChecked, setIsChecked] = useControlledState(defaultChecked ?? false, {
|
|
22
22
|
defaultValue: defaultChecked,
|
|
23
23
|
onChange: (value) => {
|
|
24
24
|
if (lastEventRef.current) onCheckedChange?.(value, lastEventRef.current);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"atoms.mjs","names":[
|
|
1
|
+
{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/Switch/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Switch } from '@base-ui/react/switch';\nimport { cx } from 'antd-style';\nimport { useReducedMotion } from 'motion/react';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport { createContext, use, useMemo, useRef, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { rootVariants, styles, thumbVariants } from './style';\nimport type {\n SwitchChangeEventHandler,\n SwitchContextType,\n SwitchIconPosition,\n SwitchIconProps,\n SwitchRootProps,\n SwitchThumbProps,\n} from './type';\n\nconst SwitchContext = createContext<SwitchContextType | null>(null);\n\nexport const useSwitchContext = () => {\n const context = use(SwitchContext);\n if (!context) {\n throw new Error('useSwitchContext must be used within a SwitchRoot');\n }\n return context;\n};\n\ntype SwitchRootInternalProps = Omit<SwitchRootProps, 'onCheckedChange' | 'onClick'> & {\n onCheckedChange?: SwitchChangeEventHandler;\n onClick?: SwitchChangeEventHandler;\n};\n\nexport const SwitchRoot = ({\n checked,\n className,\n defaultChecked,\n onCheckedChange,\n onClick,\n size = 'default',\n children,\n disabled,\n readOnly,\n required,\n inputRef,\n id,\n name,\n ...rest\n}: SwitchRootInternalProps) => {\n const Motion = useMotionComponent();\n const [isPressed, setIsPressed] = useState(false);\n const lastEventRef = useRef<MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>>(\n null,\n );\n\n const [isChecked, setIsChecked] = useControlledState(defaultChecked ?? false, {\n defaultValue: defaultChecked,\n onChange: (value: boolean) => {\n if (lastEventRef.current) {\n onCheckedChange?.(value, lastEventRef.current);\n }\n },\n value: checked,\n });\n\n const baseClassName = rootVariants({ size });\n\n const contextValue = useMemo(\n () => ({\n isChecked: Boolean(isChecked),\n isPressed,\n setIsChecked: (value: boolean) => setIsChecked(value),\n setIsPressed,\n }),\n [isChecked, isPressed, setIsChecked],\n );\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n lastEventRef.current = event;\n onClick?.(!isChecked, event);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n lastEventRef.current = event;\n }\n (rest as any).onKeyDown?.(event);\n };\n\n return (\n <SwitchContext value={contextValue}>\n <Switch.Root\n checked={isChecked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n id={id}\n inputRef={inputRef}\n name={name}\n readOnly={readOnly}\n required={required}\n render={\n <Motion.button\n {...rest}\n className={cx(baseClassName, className)}\n initial={false}\n whileTap=\"tap\"\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onTap={() => setIsPressed(false)}\n onTapCancel={() => setIsPressed(false)}\n onTapStart={() => setIsPressed(true)}\n />\n }\n onCheckedChange={setIsChecked}\n >\n {children}\n </Switch.Root>\n </SwitchContext>\n );\n};\n\nSwitchRoot.displayName = 'SwitchRoot';\n\nexport const SwitchThumb = ({\n className,\n pressedAnimation,\n size = 'default',\n transition = { damping: 24, stiffness: 360, type: 'spring' },\n children,\n ...rest\n}: SwitchThumbProps) => {\n const Motion = useMotionComponent();\n const { isPressed } = useSwitchContext();\n const shouldReduceMotion = useReducedMotion();\n const baseClassName = thumbVariants({ size });\n\n const defaultPressedAnimation = {\n width: size === 'small' ? 16 : 22,\n };\n\n const effectiveAnimate =\n !shouldReduceMotion && isPressed ? pressedAnimation || defaultPressedAnimation : undefined;\n const effectiveTransition = shouldReduceMotion ? { duration: 0 } : transition;\n\n return (\n <Switch.Thumb\n render={\n <Motion.span\n layout\n animate={effectiveAnimate}\n className={cx(baseClassName, className)}\n transition={effectiveTransition}\n {...rest}\n >\n {children}\n </Motion.span>\n }\n />\n );\n};\n\nSwitchThumb.displayName = 'SwitchThumb';\n\nconst getIconPositionClass = (position: SwitchIconPosition, size: 'default' | 'small') => {\n if (position === 'thumb') return styles.iconThumb;\n if (position === 'left') return size === 'small' ? styles.iconLeftSmall : styles.iconLeft;\n return size === 'small' ? styles.iconRightSmall : styles.iconRight;\n};\n\nexport const SwitchIcon = ({\n children,\n className,\n position,\n size = 'default',\n transition = { bounce: 0, type: 'spring' },\n ...rest\n}: SwitchIconProps) => {\n const Motion = useMotionComponent();\n const { isChecked } = useSwitchContext();\n const shouldReduceMotion = useReducedMotion();\n\n const isAnimated = useMemo(() => {\n if (position === 'right') return !isChecked;\n if (position === 'left') return isChecked;\n if (position === 'thumb') return true;\n return false;\n }, [position, isChecked]);\n\n const positionClass = getIconPositionClass(position, size);\n const effectiveTransition = shouldReduceMotion ? { duration: 0 } : transition;\n\n return (\n <Motion.span\n animate={isAnimated ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0 }}\n className={cx(styles.icon, positionClass, className)}\n transition={effectiveTransition}\n {...rest}\n >\n {children}\n </Motion.span>\n );\n};\n\nSwitchIcon.displayName = 'SwitchIcon';\n\nexport { styles as switchStyles } from './style';\n"],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { ToastAPI, ToastPosition } from "./type.mjs";
|
|
2
2
|
import * as _$react from "react";
|
|
3
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
3
|
|
|
5
4
|
//#region src/base-ui/Toast/imperative.d.ts
|
|
6
5
|
declare const toast: ToastAPI;
|
|
@@ -38,7 +37,7 @@ declare const ToastHost: _$react.MemoExoticComponent<({
|
|
|
38
37
|
limit,
|
|
39
38
|
position,
|
|
40
39
|
swipeDirection
|
|
41
|
-
}: ToastHostProps) => _$
|
|
40
|
+
}: ToastHostProps) => _$react.JSX.Element[] | null>;
|
|
42
41
|
declare const useToast: () => ToastAPI;
|
|
43
42
|
//#endregion
|
|
44
43
|
export { ToastHost, ToastHostProps, toast, useToast };
|
|
@@ -5,14 +5,14 @@ import MessageModal from "../MessageModal/MessageModal.mjs";
|
|
|
5
5
|
import { memo } from "react";
|
|
6
6
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { cx } from "antd-style";
|
|
8
|
-
import
|
|
8
|
+
import useControlledState from "use-merge-value";
|
|
9
9
|
//#region src/chat/EditableMessage/EditableMessage.tsx
|
|
10
10
|
const EditableMessage = memo(({ value, onChange, classNames = {}, onEditingChange, editing, openModal, onOpenChange, placeholder, showEditWhenEmpty = false, styles: customStyles, className, style, height, variant, editButtonSize, text, fullFeaturedCodeBlock, model, fontSize, language = "markdown", markdownProps }) => {
|
|
11
|
-
const [isEdit, setTyping] =
|
|
11
|
+
const [isEdit, setTyping] = useControlledState(false, {
|
|
12
12
|
onChange: onEditingChange,
|
|
13
13
|
value: editing
|
|
14
14
|
});
|
|
15
|
-
const [expand, setExpand] =
|
|
15
|
+
const [expand, setExpand] = useControlledState(false, {
|
|
16
16
|
onChange: onOpenChange,
|
|
17
17
|
value: openModal
|
|
18
18
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableMessage.mjs","names":[
|
|
1
|
+
{"version":3,"file":"EditableMessage.mjs","names":[],"sources":["../../../src/chat/EditableMessage/EditableMessage.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport MessageInput from '@/chat/MessageInput';\nimport MessageModal from '@/chat/MessageModal';\nimport Markdown from '@/Markdown';\n\nimport { type EditableMessageProps } from './type';\n\nconst EditableMessage = memo<EditableMessageProps>(\n ({\n value,\n onChange,\n classNames = {},\n onEditingChange,\n editing,\n openModal,\n onOpenChange,\n placeholder,\n showEditWhenEmpty = false,\n styles: customStyles,\n className,\n style,\n height,\n variant,\n editButtonSize,\n text,\n fullFeaturedCodeBlock,\n model,\n fontSize,\n language = 'markdown',\n markdownProps,\n }) => {\n const [isEdit, setTyping] = useControlledState(false, {\n onChange: onEditingChange,\n value: editing,\n });\n\n const [expand, setExpand] = useControlledState<boolean>(false, {\n onChange: onOpenChange,\n value: openModal,\n });\n\n const isAutoSize = height === 'auto';\n\n const input = (\n <MessageInput\n shortcut\n className={cx(className, classNames?.input)}\n classNames={classNames}\n defaultValue={value}\n editButtonSize={editButtonSize}\n height={height}\n language={language}\n placeholder={placeholder}\n styles={customStyles}\n text={text}\n variant={variant}\n style={{\n ...style,\n ...customStyles?.input,\n }}\n onCancel={() => setTyping(false)}\n onConfirm={(text) => {\n onChange?.(text);\n setTyping(false);\n }}\n />\n );\n\n if (!value && showEditWhenEmpty) return input;\n\n return (\n <>\n {!expand && isEdit ? (\n input\n ) : (\n <Markdown\n className={cx(className, classNames?.markdown)}\n fontSize={fontSize}\n fullFeaturedCodeBlock={fullFeaturedCodeBlock}\n variant={'chat'}\n style={{\n height: isAutoSize ? 'unset' : height,\n ...style,\n ...customStyles?.markdown,\n }}\n {...markdownProps}\n >\n {value || placeholder || ''}\n </Markdown>\n )}\n {expand && (\n <MessageModal\n editing={isEdit}\n extra={model?.extra}\n footer={model?.footer}\n height={height}\n language={language}\n open={expand}\n placeholder={placeholder}\n text={text}\n value={value}\n onChange={onChange}\n onEditingChange={setTyping}\n onOpenChange={(e) => {\n setExpand(e);\n setTyping(false);\n }}\n />\n )}\n </>\n );\n },\n);\n\nEditableMessage.displayName = 'EditableMessage';\n\nexport default EditableMessage;\n"],"mappings":";;;;;;;;;AAYA,MAAM,kBAAkB,MACrB,EACC,OACA,UACA,aAAa,EAAE,EACf,iBACA,SACA,WACA,cACA,aACA,oBAAoB,OACpB,QAAQ,cACR,WACA,OACA,QACA,SACA,gBACA,MACA,uBACA,OACA,UACA,WAAW,YACX,oBACI;CACJ,MAAM,CAAC,QAAQ,aAAa,mBAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,QAAQ,aAAa,mBAA4B,OAAO;EAC7D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,aAAa,WAAW;CAE9B,MAAM,QACJ,oBAAC,cAAD;EACE,UAAA;EACA,WAAW,GAAG,WAAW,YAAY,MAAM;EAC/B;EACZ,cAAc;EACE;EACR;EACE;EACG;EACb,QAAQ;EACF;EACG;EACT,OAAO;GACL,GAAG;GACH,GAAG,cAAc;GAClB;EACD,gBAAgB,UAAU,MAAM;EAChC,YAAY,SAAS;AACnB,cAAW,KAAK;AAChB,aAAU,MAAM;;EAElB,CAAA;AAGJ,KAAI,CAAC,SAAS,kBAAmB,QAAO;AAExC,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,CAAC,UAAU,SACV,QAEA,oBAAC,UAAD;EACE,WAAW,GAAG,WAAW,YAAY,SAAS;EACpC;EACa;EACvB,SAAS;EACT,OAAO;GACL,QAAQ,aAAa,UAAU;GAC/B,GAAG;GACH,GAAG,cAAc;GAClB;EACD,GAAI;YAEH,SAAS,eAAe;EAChB,CAAA,EAEZ,UACC,oBAAC,cAAD;EACE,SAAS;EACT,OAAO,OAAO;EACd,QAAQ,OAAO;EACP;EACE;EACV,MAAM;EACO;EACP;EACC;EACG;EACV,iBAAiB;EACjB,eAAe,MAAM;AACnB,aAAU,EAAE;AACZ,aAAU,MAAM;;EAElB,CAAA,CAEH,EAAA,CAAA;EAGR;AAED,gBAAgB,cAAc"}
|
|
@@ -11,16 +11,16 @@ import messageModal_default from "../../i18n/resources/en/messageModal.mjs";
|
|
|
11
11
|
import { memo, useState } from "react";
|
|
12
12
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
13
13
|
import { useResponsive } from "antd-style";
|
|
14
|
-
import
|
|
14
|
+
import useControlledState from "use-merge-value";
|
|
15
15
|
//#region src/chat/MessageModal/MessageModal.tsx
|
|
16
16
|
const MessageModal = memo(({ panelRef, editing, open, height = "75vh", onOpenChange, onEditingChange, placeholder, value, language = "markdown", onChange, text, footer, extra }) => {
|
|
17
17
|
const { mobile } = useResponsive();
|
|
18
18
|
const { t } = useTranslation(messageModal_default);
|
|
19
|
-
const [isEdit, setTyping] =
|
|
19
|
+
const [isEdit, setTyping] = useControlledState(false, {
|
|
20
20
|
onChange: onEditingChange,
|
|
21
21
|
value: editing
|
|
22
22
|
});
|
|
23
|
-
const [showModal, setShowModal] =
|
|
23
|
+
const [showModal, setShowModal] = useControlledState(false, {
|
|
24
24
|
onChange: onOpenChange,
|
|
25
25
|
value: open
|
|
26
26
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageModal.mjs","names":["messageModalMessages","
|
|
1
|
+
{"version":3,"file":"MessageModal.mjs","names":["messageModalMessages","Flexbox","textStyles"],"sources":["../../../src/chat/MessageModal/MessageModal.tsx"],"sourcesContent":["'use client';\n\nimport { useResponsive } from 'antd-style';\nimport { memo, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport Button from '@/Button';\nimport { styles as textStyles } from '@/chat/MessageInput/style';\nimport CodeEditor from '@/CodeEditor';\nimport { Flexbox } from '@/Flex';\nimport messageModalMessages from '@/i18n/resources/en/messageModal';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport TextArea from '@/Input/TextArea';\nimport Markdown from '@/Markdown';\nimport Modal from '@/Modal';\n\nimport { type MessageModalProps } from './type';\n\nconst MessageModal = memo<MessageModalProps>(\n ({\n panelRef,\n editing,\n open,\n height = '75vh',\n onOpenChange,\n onEditingChange,\n placeholder,\n value,\n language = 'markdown',\n onChange,\n text,\n footer,\n extra,\n }) => {\n const { mobile } = useResponsive();\n const { t } = useTranslation(messageModalMessages);\n const [isEdit, setTyping] = useControlledState(false, {\n onChange: onEditingChange,\n value: editing,\n });\n\n const [showModal, setShowModal] = useControlledState(false, {\n onChange: onOpenChange,\n value: open,\n });\n\n const [temporaryValue, setMessage] = useState(value);\n\n const confirmText = text?.confirm ?? t('messageModal.confirm');\n const cancelText = text?.cancel ?? t('messageModal.cancel');\n const editText = text?.edit ?? t('messageModal.edit');\n\n const modalFooter = isEdit ? (\n <Flexbox direction={'horizontal-reverse'} gap={8}>\n <Button\n type=\"primary\"\n onClick={() => {\n setTyping(false);\n onChange?.(temporaryValue);\n setMessage(value);\n }}\n >\n {confirmText}\n </Button>\n <Button\n onClick={() => {\n setTyping(false);\n setMessage(value);\n }}\n >\n {cancelText}\n </Button>\n </Flexbox>\n ) : (\n footer\n );\n\n return (\n <Modal\n allowFullscreen\n destroyOnHidden\n cancelText={cancelText}\n footer={modalFooter}\n height={height}\n okText={editText}\n open={showModal}\n panelRef={panelRef}\n title={text?.title}\n onOk={() => setTyping(true)}\n onCancel={() => {\n setShowModal(false);\n setTyping(false);\n setMessage(value);\n }}\n >\n {isEdit ? (\n mobile ? (\n <TextArea\n autoSize\n className={textStyles}\n defaultValue={temporaryValue}\n placeholder={placeholder}\n value={temporaryValue}\n variant={'borderless'}\n onBlur={(e) => setMessage(e.target.value)}\n onChange={(value) => setMessage(value.target.value)}\n />\n ) : (\n <CodeEditor\n className={textStyles}\n defaultValue={temporaryValue}\n language={language}\n placeholder={placeholder}\n value={temporaryValue}\n variant={'borderless'}\n onBlur={(e) => setMessage(e.target.value)}\n onValueChange={(value) => setMessage(value)}\n />\n )\n ) : (\n <>\n {extra}\n <Markdown variant={'chat'}>{String(value || placeholder)}</Markdown>\n </>\n )}\n </Modal>\n );\n },\n);\n\nMessageModal.displayName = 'MessageModal';\n\nexport default MessageModal;\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAM,eAAe,MAClB,EACC,UACA,SACA,MACA,SAAS,QACT,cACA,iBACA,aACA,OACA,WAAW,YACX,UACA,MACA,QACA,YACI;CACJ,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,eAAeA,qBAAqB;CAClD,MAAM,CAAC,QAAQ,aAAa,mBAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,WAAW,gBAAgB,mBAAmB,OAAO;EAC1D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,gBAAgB,cAAc,SAAS,MAAM;CAEpD,MAAM,cAAc,MAAM,WAAW,EAAE,uBAAuB;CAC9D,MAAM,aAAa,MAAM,UAAU,EAAE,sBAAsB;CAC3D,MAAM,WAAW,MAAM,QAAQ,EAAE,oBAAoB;AA2BrD,QACE,oBAAC,OAAD;EACE,iBAAA;EACA,iBAAA;EACY;EACZ,QA9BgB,SAClB,qBAACC,mBAAD;GAAS,WAAW;GAAsB,KAAK;aAA/C,CACE,oBAAC,QAAD;IACE,MAAK;IACL,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,eAAe;AAC1B,gBAAW,MAAM;;cAGlB;IACM,CAAA,EACT,oBAAC,QAAD;IACE,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,MAAM;;cAGlB;IACM,CAAA,CACD;OAEV;EASU;EACR,QAAQ;EACR,MAAM;EACI;EACV,OAAO,MAAM;EACb,YAAY,UAAU,KAAK;EAC3B,gBAAgB;AACd,gBAAa,MAAM;AACnB,aAAU,MAAM;AAChB,cAAW,MAAM;;YAGlB,SACC,SACE,oBAAC,UAAD;GACE,UAAA;GACA,WAAWC;GACX,cAAc;GACD;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,WAAW,UAAU,WAAW,MAAM,OAAO,MAAM;GACnD,CAAA,GAEF,oBAAC,YAAD;GACE,WAAWA;GACX,cAAc;GACJ;GACG;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,gBAAgB,UAAU,WAAW,MAAM;GAC3C,CAAA,GAGJ,qBAAA,YAAA,EAAA,UAAA,CACG,OACD,oBAAC,UAAD;GAAU,SAAS;aAAS,OAAO,SAAS,YAAY;GAAY,CAAA,CACnE,EAAA,CAAA;EAEC,CAAA;EAGb;AAED,aAAa,cAAc"}
|
|
@@ -5,10 +5,10 @@ import { styles } from "./style.mjs";
|
|
|
5
5
|
import { memo } from "react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { cx } from "antd-style";
|
|
8
|
-
import
|
|
8
|
+
import useControlledState from "use-merge-value";
|
|
9
9
|
//#region src/mobile/TabBar/TabBar.tsx
|
|
10
10
|
const TabBar = memo(({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {
|
|
11
|
-
const [currentActive, setCurrentActive] =
|
|
11
|
+
const [currentActive, setCurrentActive] = useControlledState(defaultActiveKey || items[0].key, {
|
|
12
12
|
defaultValue: defaultActiveKey,
|
|
13
13
|
onChange,
|
|
14
14
|
value: activeKey
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar.mjs","names":["Flexbox"],"sources":["../../../src/mobile/TabBar/TabBar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport SafeArea from '@/mobile/SafeArea';\n\nimport { styles } from './style';\nimport type { TabBarProps } from './type';\n\nconst TabBar = memo<TabBarProps>(\n ({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {\n const [currentActive, setCurrentActive] = useMergeState<string>(\n defaultActiveKey || items[0].key,\n {\n defaultValue: defaultActiveKey,\n onChange,\n value: activeKey,\n },\n );\n\n return (\n <Flexbox as={'footer'} className={cx(styles.container, className)} ref={ref} {...rest}>\n <Flexbox\n horizontal\n align={'center'}\n className={cx(styles.inner, className)}\n justify={'space-around'}\n >\n {items.map((item) => {\n const active = item.key === currentActive;\n return (\n <Flexbox\n align={'center'}\n className={cx(styles.tab, active && styles.active)}\n gap={4}\n justify={'center'}\n key={item.key}\n onClick={() => {\n setCurrentActive(item.key);\n item?.onClick?.();\n }}\n >\n <Flexbox align={'center'} className={styles.icon} justify={'center'}>\n {typeof item.icon === 'function' ? item.icon(active) : item.icon}\n </Flexbox>\n <div className={styles.title}>\n {typeof item.title === 'function' ? item.title(active) : item.title}\n </div>\n </Flexbox>\n );\n })}\n </Flexbox>\n {safeArea && <SafeArea position={'bottom'} />}\n </Flexbox>\n );\n },\n);\n\nTabBar.displayName = 'MobileTabBar';\n\nexport default TabBar;\n"],"mappings":";;;;;;;;;AAYA,MAAM,SAAS,MACZ,EAAE,KAAK,WAAW,UAAU,OAAO,WAAW,kBAAkB,UAAU,GAAG,WAAW;CACvF,MAAM,CAAC,eAAe,
|
|
1
|
+
{"version":3,"file":"TabBar.mjs","names":["useMergeState","Flexbox"],"sources":["../../../src/mobile/TabBar/TabBar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport SafeArea from '@/mobile/SafeArea';\n\nimport { styles } from './style';\nimport type { TabBarProps } from './type';\n\nconst TabBar = memo<TabBarProps>(\n ({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {\n const [currentActive, setCurrentActive] = useMergeState<string>(\n defaultActiveKey || items[0].key,\n {\n defaultValue: defaultActiveKey,\n onChange,\n value: activeKey,\n },\n );\n\n return (\n <Flexbox as={'footer'} className={cx(styles.container, className)} ref={ref} {...rest}>\n <Flexbox\n horizontal\n align={'center'}\n className={cx(styles.inner, className)}\n justify={'space-around'}\n >\n {items.map((item) => {\n const active = item.key === currentActive;\n return (\n <Flexbox\n align={'center'}\n className={cx(styles.tab, active && styles.active)}\n gap={4}\n justify={'center'}\n key={item.key}\n onClick={() => {\n setCurrentActive(item.key);\n item?.onClick?.();\n }}\n >\n <Flexbox align={'center'} className={styles.icon} justify={'center'}>\n {typeof item.icon === 'function' ? item.icon(active) : item.icon}\n </Flexbox>\n <div className={styles.title}>\n {typeof item.title === 'function' ? item.title(active) : item.title}\n </div>\n </Flexbox>\n );\n })}\n </Flexbox>\n {safeArea && <SafeArea position={'bottom'} />}\n </Flexbox>\n );\n },\n);\n\nTabBar.displayName = 'MobileTabBar';\n\nexport default TabBar;\n"],"mappings":";;;;;;;;;AAYA,MAAM,SAAS,MACZ,EAAE,KAAK,WAAW,UAAU,OAAO,WAAW,kBAAkB,UAAU,GAAG,WAAW;CACvF,MAAM,CAAC,eAAe,oBAAoBA,mBACxC,oBAAoB,MAAM,GAAG,KAC7B;EACE,cAAc;EACd;EACA,OAAO;EACR,CACF;AAED,QACE,qBAACC,mBAAD;EAAS,IAAI;EAAU,WAAW,GAAG,OAAO,WAAW,UAAU;EAAO;EAAK,GAAI;YAAjF,CACE,oBAACA,mBAAD;GACE,YAAA;GACA,OAAO;GACP,WAAW,GAAG,OAAO,OAAO,UAAU;GACtC,SAAS;aAER,MAAM,KAAK,SAAS;IACnB,MAAM,SAAS,KAAK,QAAQ;AAC5B,WACE,qBAACA,mBAAD;KACE,OAAO;KACP,WAAW,GAAG,OAAO,KAAK,UAAU,OAAO,OAAO;KAClD,KAAK;KACL,SAAS;KAET,eAAe;AACb,uBAAiB,KAAK,IAAI;AAC1B,YAAM,WAAW;;eARrB,CAWE,oBAACA,mBAAD;MAAS,OAAO;MAAU,WAAW,OAAO;MAAM,SAAS;gBACxD,OAAO,KAAK,SAAS,aAAa,KAAK,KAAK,OAAO,GAAG,KAAK;MACpD,CAAA,EACV,oBAAC,OAAD;MAAK,WAAW,OAAO;gBACpB,OAAO,KAAK,UAAU,aAAa,KAAK,MAAM,OAAO,GAAG,KAAK;MAC1D,CAAA,CACE;OAZH,KAAK,IAYF;KAEZ;GACM,CAAA,EACT,YAAY,oBAAC,UAAD,EAAU,UAAU,UAAY,CAAA,CACrC;;EAGf;AAED,OAAO,cAAc"}
|
|
@@ -1,23 +1,64 @@
|
|
|
1
1
|
//#region src/styles/theme/token/base.ts
|
|
2
|
-
const
|
|
3
|
-
const
|
|
4
|
-
|
|
2
|
+
const joinFontFamily = (fonts) => fonts.map((font) => font.includes(" ") ? `"${font}"` : font).join(",");
|
|
3
|
+
const FONT_EMOJI = [
|
|
4
|
+
"/* EMOJI */",
|
|
5
|
+
"Apple Color Emoji",
|
|
6
|
+
"Segoe UI Emoji",
|
|
7
|
+
"Segoe UI Symbol",
|
|
8
|
+
"Noto Color Emoji"
|
|
9
|
+
];
|
|
10
|
+
const FONT_EN = [
|
|
11
|
+
"Geist",
|
|
12
|
+
"-apple-system",
|
|
13
|
+
"BlinkMacSystemFont",
|
|
14
|
+
"Segoe UI Variable Display",
|
|
15
|
+
"Segoe UI",
|
|
16
|
+
"Roboto",
|
|
17
|
+
"Helvetica Neue",
|
|
18
|
+
"Arial"
|
|
19
|
+
];
|
|
20
|
+
const FONT_CN = [
|
|
21
|
+
"/* SC */",
|
|
22
|
+
"HarmonyOS Sans SC",
|
|
23
|
+
"PingFang SC",
|
|
24
|
+
"Hiragino Sans GB",
|
|
25
|
+
"Microsoft YaHei UI",
|
|
26
|
+
"Microsoft YaHei",
|
|
27
|
+
"Source Han Sans SC",
|
|
28
|
+
"Noto Sans CJK SC"
|
|
29
|
+
];
|
|
5
30
|
const baseToken = {
|
|
6
31
|
borderRadius: 8,
|
|
7
32
|
borderRadiusLG: 12,
|
|
8
33
|
borderRadiusSM: 6,
|
|
9
34
|
borderRadiusXS: 4,
|
|
10
35
|
controlHeight: 36,
|
|
11
|
-
fontFamily: [
|
|
36
|
+
fontFamily: joinFontFamily([
|
|
12
37
|
FONT_EN,
|
|
13
38
|
FONT_CN,
|
|
39
|
+
[
|
|
40
|
+
"/* FALLBACK */",
|
|
41
|
+
"ui-sans-serif",
|
|
42
|
+
"system-ui",
|
|
43
|
+
"sans-serif"
|
|
44
|
+
],
|
|
14
45
|
FONT_EMOJI
|
|
15
|
-
].
|
|
16
|
-
fontFamilyCode: [
|
|
17
|
-
|
|
46
|
+
].flat()),
|
|
47
|
+
fontFamilyCode: joinFontFamily([
|
|
48
|
+
[
|
|
49
|
+
"Geist Mono",
|
|
50
|
+
"ui-monospace",
|
|
51
|
+
"SFMono-Regular",
|
|
52
|
+
"SF Mono",
|
|
53
|
+
"Menlo",
|
|
54
|
+
"Cascadia Code",
|
|
55
|
+
"Consolas",
|
|
56
|
+
"Liberation Mono"
|
|
57
|
+
],
|
|
18
58
|
FONT_CN,
|
|
59
|
+
["/* FALLBACK */", "monospace"],
|
|
19
60
|
FONT_EMOJI
|
|
20
|
-
].
|
|
61
|
+
].flat())
|
|
21
62
|
};
|
|
22
63
|
//#endregion
|
|
23
64
|
export { baseToken };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base.mjs","names":[],"sources":["../../../../src/styles/theme/token/base.ts"],"sourcesContent":["import type { AliasToken } from 'antd/es/theme/interface';\n\nconst
|
|
1
|
+
{"version":3,"file":"base.mjs","names":[],"sources":["../../../../src/styles/theme/token/base.ts"],"sourcesContent":["import type { AliasToken } from 'antd/es/theme/interface';\n\nconst joinFontFamily = (fonts: string[]) =>\n fonts.map((font) => (font.includes(' ') ? `\"${font}\"` : font)).join(',');\n\nconst FONT_EMOJI = [\n '/* EMOJI */',\n 'Apple Color Emoji',\n 'Segoe UI Emoji',\n 'Segoe UI Symbol',\n 'Noto Color Emoji',\n];\n\nconst FONT_EN = [\n 'Geist',\n '-apple-system',\n 'BlinkMacSystemFont',\n 'Segoe UI Variable Display',\n 'Segoe UI',\n 'Roboto',\n 'Helvetica Neue',\n 'Arial',\n];\n\nconst FONT_CN = [\n '/* SC */',\n 'HarmonyOS Sans SC',\n 'PingFang SC',\n 'Hiragino Sans GB',\n 'Microsoft YaHei UI',\n 'Microsoft YaHei',\n 'Source Han Sans SC',\n 'Noto Sans CJK SC',\n];\n\nconst FONT_CODE = [\n 'Geist Mono',\n 'ui-monospace',\n 'SFMono-Regular',\n 'SF Mono',\n 'Menlo',\n 'Cascadia Code',\n 'Consolas',\n 'Liberation Mono',\n];\n\nconst FALLBACK = ['/* FALLBACK */', 'ui-sans-serif', 'system-ui', 'sans-serif'];\n\nconst FALLBACK_CODE = ['/* FALLBACK */', 'monospace'];\n\nexport const baseToken: Partial<AliasToken> = {\n borderRadius: 8,\n borderRadiusLG: 12,\n borderRadiusSM: 6,\n borderRadiusXS: 4,\n controlHeight: 36,\n fontFamily: joinFontFamily([FONT_EN, FONT_CN, FALLBACK, FONT_EMOJI].flat()),\n fontFamilyCode: joinFontFamily([FONT_CODE, FONT_CN, FALLBACK_CODE, FONT_EMOJI].flat()),\n};\n"],"mappings":";AAEA,MAAM,kBAAkB,UACtB,MAAM,KAAK,SAAU,KAAK,SAAS,IAAI,GAAG,IAAI,KAAK,KAAK,KAAM,CAAC,KAAK,IAAI;AAE1E,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACD;AAED,MAAM,UAAU;CACd;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,MAAM,UAAU;CACd;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAiBD,MAAa,YAAiC;CAC5C,cAAc;CACd,gBAAgB;CAChB,gBAAgB;CAChB,gBAAgB;CAChB,eAAe;CACf,YAAY,eAAe;EAAC;EAAS;EAAS;GAV9B;GAAkB;GAAiB;GAAa;GAUlB;EAAU;EAAW,CAAC,MAAM,CAAC;CAC3E,gBAAgB,eAAe;EAAC;GArBhC;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GAcgC;EAAW;EAAS,CAT/B,kBAAkB,YASa;EAAe;EAAW,CAAC,MAAM,CAAC;CACvF"}
|