@lobehub/ui 4.2.0 → 4.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (125) hide show
  1. package/es/Accordion/Accordion.d.mts +2 -2
  2. package/es/Accordion/AccordionItem.d.mts +2 -2
  3. package/es/Accordion/AccordionItem.mjs +161 -93
  4. package/es/Accordion/AccordionItem.mjs.map +1 -1
  5. package/es/Accordion/context.mjs +1 -3
  6. package/es/Accordion/context.mjs.map +1 -1
  7. package/es/Accordion/type.d.mts +17 -0
  8. package/es/ActionIcon/ActionIcon.d.mts +2 -2
  9. package/es/Alert/Alert.d.mts +2 -2
  10. package/es/AutoComplete/Select.d.mts +2 -2
  11. package/es/Avatar/Avatar.mjs +1 -0
  12. package/es/Avatar/Avatar.mjs.map +1 -1
  13. package/es/Avatar/AvatarGroup/index.d.mts +2 -2
  14. package/es/Burger/Burger.d.mts +2 -2
  15. package/es/CodeEditor/CodeEditor.d.mts +2 -2
  16. package/es/Collapse/Collapse.d.mts +2 -2
  17. package/es/ConfigProvider/index.d.mts +2 -2
  18. package/es/CopyButton/CopyButton.d.mts +2 -2
  19. package/es/DatePicker/DatePicker.d.mts +2 -2
  20. package/es/DraggablePanel/components/DraggablePanelBody.d.mts +2 -2
  21. package/es/DraggablePanel/components/DraggablePanelContainer.d.mts +2 -2
  22. package/es/DraggablePanel/components/DraggablePanelFooter.d.mts +2 -2
  23. package/es/DraggablePanel/components/DraggablePanelHeader.d.mts +2 -2
  24. package/es/DraggableSideNav/DraggableSideNav.d.mts +2 -2
  25. package/es/Drawer/Drawer.d.mts +2 -2
  26. package/es/Dropdown/Dropdown.d.mts +2 -2
  27. package/es/EditableText/EditableText.d.mts +2 -2
  28. package/es/EmojiPicker/EmojiPicker.d.mts +2 -2
  29. package/es/Flex/FlexBasic.d.mts +2 -2
  30. package/es/FontLoader/index.d.mts +2 -2
  31. package/es/Footer/Footer.d.mts +2 -2
  32. package/es/Form/components/FormGroup.d.mts +2 -2
  33. package/es/Form/components/FormItem.d.mts +2 -2
  34. package/es/Form/components/FormSubmitFooter.d.mts +2 -2
  35. package/es/FormModal/FormModal.d.mts +2 -2
  36. package/es/GroupAvatar/GroupAvatar.mjs +15 -13
  37. package/es/GroupAvatar/GroupAvatar.mjs.map +1 -1
  38. package/es/GuideCard/GuideCard.d.mts +2 -2
  39. package/es/Header/Header.d.mts +2 -2
  40. package/es/Highlighter/Highlighter.d.mts +2 -2
  41. package/es/Highlighter/SyntaxHighlighter/index.d.mts +2 -2
  42. package/es/Highlighter/SyntaxHighlighter/index.mjs +7 -0
  43. package/es/Highlighter/SyntaxHighlighter/index.mjs.map +1 -1
  44. package/es/Highlighter/SyntaxHighlighter/style.mjs +17 -1
  45. package/es/Highlighter/SyntaxHighlighter/style.mjs.map +1 -1
  46. package/es/Hotkey/Hotkey.d.mts +2 -2
  47. package/es/HotkeyInput/HotkeyInput.d.mts +2 -2
  48. package/es/Icon/Icon.d.mts +2 -2
  49. package/es/Icon/components/IconProvider.d.mts +3 -3
  50. package/es/Image/PreviewGroup.d.mts +2 -2
  51. package/es/Input/Input.d.mts +2 -2
  52. package/es/Input/InputNumber.d.mts +2 -2
  53. package/es/Input/InputOPT.d.mts +2 -2
  54. package/es/Input/InputPassword.d.mts +2 -2
  55. package/es/Input/TextArea.d.mts +2 -2
  56. package/es/Layout/components/LayoutFooter.d.mts +2 -2
  57. package/es/Layout/components/LayoutHeader.d.mts +2 -2
  58. package/es/Layout/components/LayoutMain.d.mts +2 -2
  59. package/es/Layout/components/LayoutSidebar.d.mts +2 -2
  60. package/es/Layout/components/LayoutSidebarInner.d.mts +2 -2
  61. package/es/Layout/components/LayoutToc.d.mts +2 -2
  62. package/es/List/ListItem/index.d.mts +2 -2
  63. package/es/Markdown/Markdown.d.mts +2 -2
  64. package/es/Markdown/SyntaxMarkdown/style.mjs +9 -8
  65. package/es/Markdown/SyntaxMarkdown/style.mjs.map +1 -1
  66. package/es/Markdown/Typography.d.mts +2 -2
  67. package/es/Markdown/components/SearchResultCards/index.d.mts +2 -2
  68. package/es/MaskShadow/MaskShadow.d.mts +2 -2
  69. package/es/Menu/Menu.d.mts +2 -2
  70. package/es/Mermaid/Mermaid.d.mts +2 -2
  71. package/es/Mermaid/SyntaxMermaid/index.d.mts +2 -2
  72. package/es/Modal/Modal.d.mts +2 -2
  73. package/es/MotionProvider/index.d.mts +2 -2
  74. package/es/SearchBar/SearchBar.d.mts +2 -2
  75. package/es/Segmented/Segmented.d.mts +2 -2
  76. package/es/Select/Select.d.mts +2 -2
  77. package/es/SideNav/SideNav.d.mts +2 -2
  78. package/es/SliderWithInput/SliderWithInput.d.mts +2 -2
  79. package/es/ThemeProvider/ThemeProvider.d.mts +2 -2
  80. package/es/Toc/Toc.d.mts +2 -2
  81. package/es/Video/index.d.mts +2 -2
  82. package/es/awesome/AuroraBackground/AuroraBackground.d.mts +2 -2
  83. package/es/awesome/BottomGradientButton/BottomGradientButton.d.mts +2 -2
  84. package/es/awesome/Features/Features.d.mts +2 -2
  85. package/es/awesome/Giscus/Giscus.d.mts +2 -2
  86. package/es/awesome/GradientButton/GradientButton.d.mts +2 -2
  87. package/es/awesome/GridBackground/GridBackground.d.mts +2 -2
  88. package/es/awesome/GridBackground/GridShowcase.d.mts +2 -2
  89. package/es/awesome/Hero/Hero.d.mts +2 -2
  90. package/es/awesome/Spline/Spine.d.mts +2 -2
  91. package/es/awesome/Spotlight/Spotlight.d.mts +2 -2
  92. package/es/awesome/SpotlightCard/SpotlightCard.d.mts +2 -2
  93. package/es/awesome/TypewriterEffect/TypewriterEffect.d.mts +2 -2
  94. package/es/brand/LobeChat/index.d.mts +2 -2
  95. package/es/brand/LobeHub/index.d.mts +2 -2
  96. package/es/brand/LogoThree/LogoSpline.d.mts +2 -2
  97. package/es/brand/LogoThree/index.d.mts +2 -2
  98. package/es/chat/BackBottom/BackBottom.d.mts +2 -2
  99. package/es/chat/ChatInputArea/components/ChatInputAreaInner.d.mts +2 -2
  100. package/es/chat/ChatItem/ChatItem.d.mts +2 -2
  101. package/es/chat/ChatList/ChatList.d.mts +2 -2
  102. package/es/chat/EditableMessage/EditableMessage.d.mts +2 -2
  103. package/es/chat/EditableMessageList/EditableMessageList.d.mts +2 -2
  104. package/es/chat/MessageInput/MessageInput.d.mts +2 -2
  105. package/es/chat/MessageModal/MessageModal.d.mts +2 -2
  106. package/es/color/ColorScales/index.d.mts +2 -2
  107. package/es/i18n/context.d.mts +2 -2
  108. package/es/icons/lucideExtra/BotPromptIcon.d.mts +2 -2
  109. package/es/icons/lucideExtra/DiscordIcon.d.mts +3 -3
  110. package/es/icons/lucideExtra/GroupBotIcon.d.mts +3 -3
  111. package/es/icons/lucideExtra/GroupBotSquareIcon.d.mts +3 -3
  112. package/es/icons/lucideExtra/LeftClickIcon.d.mts +3 -3
  113. package/es/icons/lucideExtra/LeftDoubleClickIcon.d.mts +3 -3
  114. package/es/icons/lucideExtra/McpIcon.d.mts +3 -3
  115. package/es/icons/lucideExtra/ProviderIcon.d.mts +3 -3
  116. package/es/icons/lucideExtra/RightClickIcon.d.mts +3 -3
  117. package/es/icons/lucideExtra/RightDoubleClickIcon.d.mts +3 -3
  118. package/es/icons/lucideExtra/TreeDownRightIcon.d.mts +3 -3
  119. package/es/icons/lucideExtra/TreeUpDownRightIcon.d.mts +3 -3
  120. package/es/mdx/Mdx/index.d.mts +2 -2
  121. package/es/mobile/ChatHeader/ChatHeaderTitle.d.mts +2 -2
  122. package/es/mobile/ChatInputArea/components/ChatSendButton.d.mts +2 -2
  123. package/es/mobile/TabBar/TabBar.d.mts +2 -2
  124. package/es/storybook/StoryBook/index.d.mts +2 -2
  125. package/package.json +1 -1
@@ -1,8 +1,8 @@
1
1
  import { AccordionProps } from "./type.mjs";
2
- import * as react13 from "react";
2
+ import * as react28 from "react";
3
3
 
4
4
  //#region src/Accordion/Accordion.d.ts
5
- declare const Accordion: react13.NamedExoticComponent<AccordionProps>;
5
+ declare const Accordion: react28.NamedExoticComponent<AccordionProps>;
6
6
  //#endregion
7
7
  export { Accordion };
8
8
  //# sourceMappingURL=Accordion.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { AccordionItemProps } from "./type.mjs";
2
- import * as react14 from "react";
2
+ import * as react27 from "react";
3
3
 
4
4
  //#region src/Accordion/AccordionItem.d.ts
5
- declare const AccordionItem: react14.NamedExoticComponent<AccordionItemProps>;
5
+ declare const AccordionItem: react27.NamedExoticComponent<AccordionItemProps>;
6
6
  //#endregion
7
7
  export { AccordionItem };
8
8
  //# sourceMappingURL=AccordionItem.d.mts.map
@@ -7,25 +7,155 @@ import FlexBasic_default from "../Flex/FlexBasic.mjs";
7
7
  import Block_default from "../Block/Block.mjs";
8
8
  import Text_default from "../Text/Text.mjs";
9
9
  import ArrowIcon_default from "./ArrowIcon.mjs";
10
- import { memo, useCallback, useMemo } from "react";
10
+ import { memo, useCallback, useEffect, useMemo, useRef } from "react";
11
11
  import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
12
+ import { AnimatePresence } from "motion/react";
13
+ import useMergeState from "use-merge-value";
12
14
 
13
15
  //#region src/Accordion/AccordionItem.tsx
14
- const AccordionItem = memo(({ itemKey, title, children, action, disabled = false, hideIndicator: itemHideIndicator, indicatorPlacement: itemIndicatorPlacement, indicator: customIndicator, classNames, paddingInline = 16, paddingBlock = 8, padding, ref, variant: customVariant, styles: customStyles, headerWrapper }) => {
16
+ const motionContainerStyle = { overflow: "hidden" };
17
+ const AccordionStaticContent = memo(({ className, style, children, contentInnerClassName, isOpen, keepContentMounted }) => {
18
+ if (keepContentMounted) return /* @__PURE__ */ jsx("div", {
19
+ className,
20
+ role: "region",
21
+ style: {
22
+ display: isOpen ? "block" : "none",
23
+ ...style
24
+ },
25
+ children: /* @__PURE__ */ jsx("div", {
26
+ className: contentInnerClassName,
27
+ children
28
+ })
29
+ });
30
+ if (!isOpen) return null;
31
+ return /* @__PURE__ */ jsx("div", {
32
+ className,
33
+ role: "region",
34
+ style,
35
+ children: /* @__PURE__ */ jsx("div", {
36
+ className: contentInnerClassName,
37
+ children
38
+ })
39
+ });
40
+ });
41
+ AccordionStaticContent.displayName = "AccordionStaticContent";
42
+ const AccordionMotionContent = memo(({ contextMotionProps, className, style, children, contentInnerClassName, isOpen, skipInitialAnimation }) => {
43
+ const Motion = useMotionComponent();
44
+ const motionProps = useMemo(() => ({
45
+ animate: "enter",
46
+ exit: "exit",
47
+ initial: skipInitialAnimation ? false : "exit",
48
+ variants: {
49
+ enter: {
50
+ height: "auto",
51
+ opacity: 1,
52
+ transition: {
53
+ duration: .2,
54
+ ease: [
55
+ .4,
56
+ 0,
57
+ .2,
58
+ 1
59
+ ]
60
+ }
61
+ },
62
+ exit: {
63
+ height: 0,
64
+ opacity: 0,
65
+ transition: {
66
+ duration: .2,
67
+ ease: [
68
+ .4,
69
+ 0,
70
+ .2,
71
+ 1
72
+ ]
73
+ }
74
+ }
75
+ },
76
+ ...contextMotionProps
77
+ }), [contextMotionProps, skipInitialAnimation]);
78
+ return /* @__PURE__ */ jsx(AnimatePresence, {
79
+ initial: false,
80
+ children: isOpen ? /* @__PURE__ */ jsx(Motion.div, {
81
+ ...motionProps,
82
+ style: motionContainerStyle,
83
+ children: /* @__PURE__ */ jsx("div", {
84
+ className,
85
+ role: "region",
86
+ style,
87
+ children: /* @__PURE__ */ jsx("div", {
88
+ className: contentInnerClassName,
89
+ children
90
+ })
91
+ })
92
+ }) : null
93
+ });
94
+ });
95
+ AccordionMotionContent.displayName = "AccordionMotionContent";
96
+ const AccordionItemContent = memo(({ disableAnimation, isOpen, keepContentMounted, className, style, children, contentInnerClassName, contextMotionProps, skipInitialAnimation }) => {
97
+ if (disableAnimation || !keepContentMounted) return /* @__PURE__ */ jsx(AccordionStaticContent, {
98
+ className,
99
+ contentInnerClassName,
100
+ isOpen,
101
+ keepContentMounted,
102
+ style,
103
+ children
104
+ });
105
+ return /* @__PURE__ */ jsx(AccordionMotionContent, {
106
+ className,
107
+ contentInnerClassName,
108
+ contextMotionProps,
109
+ isOpen,
110
+ skipInitialAnimation,
111
+ style,
112
+ children
113
+ });
114
+ });
115
+ AccordionItemContent.displayName = "AccordionItemContent";
116
+ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false, allowExpand = true, hideIndicator: itemHideIndicator, indicatorPlacement: itemIndicatorPlacement, indicator: customIndicator, classNames, paddingInline = 16, paddingBlock = 8, padding, ref, variant: customVariant, styles: customStyles, headerWrapper, defaultExpand, expand, onExpandChange }) => {
15
117
  const { cx, styles } = useStyles();
16
- const { isExpanded, onToggle, hideIndicator: contextHideIndicator, indicatorPlacement: contextIndicatorPlacement, keepContentMounted, disableAnimation, motionProps: contextMotionProps, variant = "filled" } = useAccordionContext();
17
- const isOpen = isExpanded(itemKey);
118
+ const context = useAccordionContext();
119
+ const isStandalone = expand !== void 0 || defaultExpand !== void 0;
120
+ const [isExpandedStandalone, setIsExpandedStandalone] = useMergeState(defaultExpand ?? false, {
121
+ onChange: onExpandChange,
122
+ value: expand
123
+ });
124
+ const contextIsExpanded = context?.isExpanded;
125
+ const contextOnToggle = context?.onToggle;
126
+ const contextHideIndicator = context?.hideIndicator;
127
+ const contextIndicatorPlacement = context?.indicatorPlacement;
128
+ const contextKeepContentMounted = context?.keepContentMounted;
129
+ const contextDisableAnimation = context?.disableAnimation;
130
+ const contextMotionProps = context?.motionProps;
131
+ const contextVariant = context?.variant ?? "filled";
132
+ const isInitialRenderRef = useRef(true);
133
+ useEffect(() => {
134
+ isInitialRenderRef.current = false;
135
+ }, []);
136
+ const isOpen = isStandalone ? isExpandedStandalone : contextIsExpanded ? contextIsExpanded(itemKey) : false;
18
137
  const hideIndicatorFinal = itemHideIndicator ?? contextHideIndicator ?? false;
19
138
  const indicatorPlacementFinal = itemIndicatorPlacement ?? contextIndicatorPlacement ?? "start";
139
+ const keepContentMounted = contextKeepContentMounted ?? true;
140
+ const disableAnimation = contextDisableAnimation ?? false;
141
+ const variant = customVariant || contextVariant;
20
142
  const handleToggle = useCallback(() => {
21
- if (!disabled) onToggle(itemKey);
143
+ if (!allowExpand) return;
144
+ if (!disabled) {
145
+ if (isStandalone) setIsExpandedStandalone(!isExpandedStandalone);
146
+ else if (contextOnToggle) contextOnToggle(itemKey);
147
+ }
22
148
  }, [
149
+ allowExpand,
23
150
  disabled,
24
- itemKey,
25
- onToggle
151
+ isStandalone,
152
+ setIsExpandedStandalone,
153
+ isExpandedStandalone,
154
+ contextOnToggle,
155
+ itemKey
26
156
  ]);
27
157
  const handleKeyDown = useCallback((e) => {
28
- if (disabled) return;
158
+ if (!allowExpand || disabled) return;
29
159
  switch (e.key) {
30
160
  case "Enter":
31
161
  case " ":
@@ -33,9 +163,13 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
33
163
  handleToggle();
34
164
  break;
35
165
  }
36
- }, [disabled, handleToggle]);
166
+ }, [
167
+ allowExpand,
168
+ disabled,
169
+ handleToggle
170
+ ]);
37
171
  const indicator = useMemo(() => {
38
- if (hideIndicatorFinal) return null;
172
+ if (!allowExpand || hideIndicatorFinal) return null;
39
173
  if (customIndicator) {
40
174
  if (typeof customIndicator === "function") return /* @__PURE__ */ jsx("span", {
41
175
  "aria-hidden": "true",
@@ -60,6 +194,7 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
60
194
  children: /* @__PURE__ */ jsx(ArrowIcon_default, { className: cx(styles.icon, isOpen && styles.iconRotate) })
61
195
  });
62
196
  }, [
197
+ allowExpand,
63
198
  hideIndicatorFinal,
64
199
  customIndicator,
65
200
  disabled,
@@ -69,88 +204,11 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
69
204
  classNames,
70
205
  customStyles
71
206
  ]);
72
- const motionProps = useMemo(() => ({
73
- animate: isOpen ? "enter" : "exit",
74
- exit: "exit",
75
- initial: false,
76
- variants: {
77
- enter: {
78
- height: "auto",
79
- opacity: 1,
80
- transition: {
81
- duration: .2,
82
- ease: [
83
- .4,
84
- 0,
85
- .2,
86
- 1
87
- ]
88
- }
89
- },
90
- exit: {
91
- height: 0,
92
- opacity: 0,
93
- transition: {
94
- duration: .2,
95
- ease: [
96
- .4,
97
- 0,
98
- .2,
99
- 1
100
- ]
101
- }
102
- }
103
- },
104
- ...contextMotionProps
105
- }), [isOpen, contextMotionProps]);
106
- const Motion = useMotionComponent();
107
- const contentElement = useMemo(() => {
108
- if (disableAnimation || !keepContentMounted) {
109
- if (keepContentMounted) return /* @__PURE__ */ jsx("div", {
110
- className: cx("accordion-content", styles.content, classNames?.content),
111
- role: "region",
112
- style: {
113
- display: isOpen ? "block" : "none",
114
- ...customStyles?.content
115
- },
116
- children: /* @__PURE__ */ jsx("div", {
117
- className: styles.contentInner,
118
- children
119
- })
120
- });
121
- return isOpen && /* @__PURE__ */ jsx("div", {
122
- className: cx("accordion-content", styles.content, classNames?.content),
123
- role: "region",
124
- style: customStyles?.content,
125
- children: /* @__PURE__ */ jsx("div", {
126
- className: styles.contentInner,
127
- children
128
- })
129
- });
130
- }
131
- return /* @__PURE__ */ jsx(Motion.div, {
132
- ...motionProps,
133
- style: { overflow: "hidden" },
134
- children: /* @__PURE__ */ jsx("div", {
135
- className: cx("accordion-content", styles.content, classNames?.content),
136
- role: "region",
137
- style: customStyles?.content,
138
- children: /* @__PURE__ */ jsx("div", {
139
- className: styles.contentInner,
140
- children
141
- })
142
- })
143
- });
144
- }, [
145
- disableAnimation,
146
- keepContentMounted,
147
- isOpen,
207
+ const skipInitialAnimation = isInitialRenderRef.current && isOpen;
208
+ const contentClassName = useMemo(() => cx("accordion-content", styles.content, classNames?.content), [
148
209
  cx,
149
210
  styles,
150
- classNames,
151
- customStyles,
152
- children,
153
- motionProps
211
+ classNames?.content
154
212
  ]);
155
213
  const titleNode = useMemo(() => typeof title === "string" ? /* @__PURE__ */ jsx(Text_default, {
156
214
  className: classNames?.title,
@@ -181,7 +239,7 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
181
239
  const headerElement = useMemo(() => {
182
240
  const header = /* @__PURE__ */ jsx(Block_default, {
183
241
  className: cx("accordion-header", styles.header, classNames?.header),
184
- clickable: !disabled,
242
+ clickable: !disabled && allowExpand,
185
243
  gap: 4,
186
244
  horizontal: true,
187
245
  justify: "space-between",
@@ -193,7 +251,7 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
193
251
  ref,
194
252
  style: {
195
253
  alignItems: "center",
196
- cursor: disabled ? "not-allowed" : "pointer",
254
+ cursor: disabled ? "not-allowed" : allowExpand ? "pointer" : "default",
197
255
  opacity: disabled ? .5 : void 0,
198
256
  overflow: "hidden",
199
257
  width: "100%",
@@ -252,7 +310,17 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
252
310
  return /* @__PURE__ */ jsxs("div", {
253
311
  className: cx("accordion-item", styles.item, classNames?.base),
254
312
  style: customStyles?.base,
255
- children: [headerElement, contentElement]
313
+ children: [headerElement, /* @__PURE__ */ jsx(AccordionItemContent, {
314
+ className: contentClassName,
315
+ contentInnerClassName: styles.contentInner,
316
+ contextMotionProps,
317
+ disableAnimation: !!disableAnimation,
318
+ isOpen,
319
+ keepContentMounted: !!keepContentMounted,
320
+ skipInitialAnimation,
321
+ style: customStyles?.content,
322
+ children
323
+ })]
256
324
  });
257
325
  });
258
326
  AccordionItem.displayName = "AccordionItem";
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.mjs","names":["ArrowIcon","Text","Flexbox","Block"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { KeyboardEvent, memo, useCallback, useMemo } from 'react';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport { useMotionComponent } from '@/MotionProvider';\nimport Text from '@/Text';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionContext } from './context';\nimport { useStyles } from './style';\nimport type { AccordionItemProps } from './type';\n\nconst AccordionItem = memo<AccordionItemProps>(\n ({\n itemKey,\n title,\n children,\n action,\n disabled = false,\n hideIndicator: itemHideIndicator,\n indicatorPlacement: itemIndicatorPlacement,\n indicator: customIndicator,\n classNames,\n paddingInline = 16,\n paddingBlock = 8,\n padding,\n ref,\n variant: customVariant,\n styles: customStyles,\n headerWrapper,\n }) => {\n const { cx, styles } = useStyles();\n const context = useAccordionContext();\n\n const {\n isExpanded,\n onToggle,\n hideIndicator: contextHideIndicator,\n indicatorPlacement: contextIndicatorPlacement,\n keepContentMounted,\n disableAnimation,\n motionProps: contextMotionProps,\n variant = 'filled',\n } = context;\n\n const isOpen = isExpanded(itemKey);\n const hideIndicatorFinal = itemHideIndicator ?? contextHideIndicator ?? false;\n const indicatorPlacementFinal = itemIndicatorPlacement ?? contextIndicatorPlacement ?? 'start';\n\n const handleToggle = useCallback(() => {\n if (!disabled) {\n onToggle(itemKey);\n }\n }, [disabled, itemKey, onToggle]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (disabled) return;\n\n switch (e.key) {\n case 'Enter':\n case ' ': {\n e.preventDefault();\n handleToggle();\n break;\n }\n }\n },\n [disabled, handleToggle],\n );\n\n // Build indicator\n const indicator = useMemo(() => {\n if (hideIndicatorFinal) return null;\n\n if (customIndicator) {\n if (typeof customIndicator === 'function') {\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n {customIndicator({ isDisabled: disabled, isOpen })}\n </span>\n );\n }\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n {customIndicator}\n </span>\n );\n }\n\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n <ArrowIcon className={cx(styles.icon, isOpen && styles.iconRotate)} />\n </span>\n );\n }, [\n hideIndicatorFinal,\n customIndicator,\n disabled,\n isOpen,\n cx,\n styles,\n classNames,\n customStyles,\n ]);\n\n // Animation variants\n const motionProps = useMemo(\n () => ({\n animate: isOpen ? 'enter' : 'exit',\n exit: 'exit',\n initial: false,\n variants: {\n enter: {\n height: 'auto',\n opacity: 1,\n transition: {\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n },\n },\n exit: {\n height: 0,\n opacity: 0,\n transition: {\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n },\n },\n },\n ...contextMotionProps,\n }),\n [isOpen, contextMotionProps],\n );\n\n const Motion = useMotionComponent();\n\n // Render content\n const contentElement = useMemo(() => {\n if (disableAnimation || !keepContentMounted) {\n if (keepContentMounted) {\n return (\n <div\n className={cx('accordion-content', styles.content, classNames?.content)}\n role=\"region\"\n style={{\n display: isOpen ? 'block' : 'none',\n ...customStyles?.content,\n }}\n >\n <div className={styles.contentInner}>{children}</div>\n </div>\n );\n }\n\n return (\n isOpen && (\n <div\n className={cx('accordion-content', styles.content, classNames?.content)}\n role=\"region\"\n style={customStyles?.content}\n >\n <div className={styles.contentInner}>{children}</div>\n </div>\n )\n );\n }\n\n return (\n <Motion.div {...motionProps} style={{ overflow: 'hidden' }}>\n <div\n className={cx('accordion-content', styles.content, classNames?.content)}\n role=\"region\"\n style={customStyles?.content}\n >\n <div className={styles.contentInner}>{children}</div>\n </div>\n </Motion.div>\n );\n }, [\n disableAnimation,\n keepContentMounted,\n isOpen,\n cx,\n styles,\n classNames,\n customStyles,\n children,\n motionProps,\n ]);\n\n const titleNode = useMemo(\n () =>\n typeof title === 'string' ? (\n <Text className={classNames?.title} ellipsis style={customStyles?.title}>\n {title}\n </Text>\n ) : (\n title\n ),\n [title, classNames?.title, customStyles?.title],\n );\n\n const actionNode = useMemo(\n () =>\n action && (\n <Flexbox\n align={'center'}\n className={cx('accordion-action', styles.action, classNames?.action)}\n flex={'none'}\n gap={4}\n horizontal\n onClick={(e) => e.stopPropagation()}\n style={customStyles?.action}\n >\n {action}\n </Flexbox>\n ),\n [action, cx, styles, classNames?.action, customStyles?.action],\n );\n\n const headerElement = useMemo(() => {\n const header = (\n <Block\n className={cx('accordion-header', styles.header, classNames?.header)}\n clickable={!disabled}\n gap={4}\n horizontal\n justify={'space-between'}\n onClick={handleToggle}\n onKeyDown={handleKeyDown}\n padding={padding}\n paddingBlock={paddingBlock}\n paddingInline={paddingInline}\n ref={ref}\n style={{\n alignItems: 'center',\n cursor: disabled ? 'not-allowed' : 'pointer',\n opacity: disabled ? 0.5 : undefined,\n overflow: 'hidden',\n width: '100%',\n ...customStyles?.header,\n }}\n variant={customVariant || variant}\n >\n {indicatorPlacementFinal === 'start' ? (\n <>\n <Flexbox\n align={'center'}\n flex={1}\n gap={2}\n horizontal\n style={{\n overflow: 'hidden',\n }}\n >\n {titleNode}\n {indicator}\n </Flexbox>\n <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n {actionNode}\n </Flexbox>\n </>\n ) : (\n <>\n <Flexbox\n align={'center'}\n flex={1}\n gap={2}\n horizontal\n style={{\n overflow: 'hidden',\n }}\n >\n {titleNode}\n </Flexbox>\n <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n {actionNode}\n {indicator}\n </Flexbox>\n </>\n )}\n </Block>\n );\n if (headerWrapper) {\n return headerWrapper(header);\n }\n return header;\n }, [\n cx,\n styles,\n classNames,\n disabled,\n handleToggle,\n handleKeyDown,\n padding,\n paddingBlock,\n paddingInline,\n ref,\n customVariant,\n variant,\n indicatorPlacementFinal,\n titleNode,\n indicator,\n actionNode,\n headerWrapper,\n ]);\n\n return (\n <div\n className={cx('accordion-item', styles.item, classNames?.base)}\n style={customStyles?.base}\n >\n {headerElement}\n {contentElement}\n </div>\n );\n },\n);\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport default AccordionItem;\n"],"mappings":"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"}
1
+ {"version":3,"file":"AccordionItem.mjs","names":["motionContainerStyle: CSSProperties","ArrowIcon","Text","Flexbox","Block"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { AnimatePresence } from 'motion/react';\nimport type { CSSProperties, ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { KeyboardEvent, memo, useCallback, useEffect, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport { type MotionComponentType, useMotionComponent } from '@/MotionProvider';\nimport Text from '@/Text';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionContext } from './context';\nimport { useStyles } from './style';\nimport type { AccordionItemProps } from './type';\n\ntype AccordionContentBaseProps = {\n children?: ReactNode;\n className?: string;\n contentInnerClassName: string;\n style?: CSSProperties;\n};\n\ntype AccordionStaticContentProps = AccordionContentBaseProps & {\n isOpen: boolean;\n keepContentMounted: boolean;\n};\n\ntype MotionDivProps = ComponentPropsWithoutRef<MotionComponentType['div']>;\n\ntype AccordionMotionContentProps = AccordionContentBaseProps & {\n contextMotionProps?: MotionDivProps;\n isOpen: boolean;\n skipInitialAnimation: boolean;\n};\n\ntype AccordionItemContentProps = AccordionContentBaseProps & {\n contextMotionProps?: MotionDivProps;\n disableAnimation: boolean;\n isOpen: boolean;\n keepContentMounted: boolean;\n skipInitialAnimation: boolean;\n};\n\nconst motionContainerStyle: CSSProperties = { overflow: 'hidden' };\n\nconst AccordionStaticContent = memo<AccordionStaticContentProps>(\n ({ className, style, children, contentInnerClassName, isOpen, keepContentMounted }) => {\n if (keepContentMounted) {\n return (\n <div\n className={className}\n role=\"region\"\n style={{\n display: isOpen ? 'block' : 'none',\n ...style,\n }}\n >\n <div className={contentInnerClassName}>{children}</div>\n </div>\n );\n }\n\n if (!isOpen) return null;\n\n return (\n <div className={className} role=\"region\" style={style}>\n <div className={contentInnerClassName}>{children}</div>\n </div>\n );\n },\n);\n\nAccordionStaticContent.displayName = 'AccordionStaticContent';\n\nconst AccordionMotionContent = memo<AccordionMotionContentProps>(\n ({\n contextMotionProps,\n className,\n style,\n children,\n contentInnerClassName,\n isOpen,\n skipInitialAnimation,\n }) => {\n const Motion = useMotionComponent();\n\n const motionProps = useMemo(\n () => ({\n animate: 'enter',\n exit: 'exit',\n initial: skipInitialAnimation ? false : 'exit',\n variants: {\n enter: {\n height: 'auto',\n opacity: 1,\n transition: {\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n },\n },\n exit: {\n height: 0,\n opacity: 0,\n transition: {\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n },\n },\n },\n ...contextMotionProps,\n }),\n [contextMotionProps, skipInitialAnimation],\n );\n\n return (\n <AnimatePresence initial={false}>\n {isOpen ? (\n <Motion.div {...(motionProps as any)} style={motionContainerStyle}>\n <div className={className} role=\"region\" style={style}>\n <div className={contentInnerClassName}>{children}</div>\n </div>\n </Motion.div>\n ) : null}\n </AnimatePresence>\n );\n },\n);\n\nAccordionMotionContent.displayName = 'AccordionMotionContent';\n\nconst AccordionItemContent = memo<AccordionItemContentProps>(\n ({\n disableAnimation,\n isOpen,\n keepContentMounted,\n className,\n style,\n children,\n contentInnerClassName,\n contextMotionProps,\n skipInitialAnimation,\n }) => {\n if (disableAnimation || !keepContentMounted) {\n return (\n <AccordionStaticContent\n className={className}\n contentInnerClassName={contentInnerClassName}\n isOpen={isOpen}\n keepContentMounted={keepContentMounted}\n style={style}\n >\n {children}\n </AccordionStaticContent>\n );\n }\n\n return (\n <AccordionMotionContent\n className={className}\n contentInnerClassName={contentInnerClassName}\n contextMotionProps={contextMotionProps}\n isOpen={isOpen}\n skipInitialAnimation={skipInitialAnimation}\n style={style}\n >\n {children}\n </AccordionMotionContent>\n );\n },\n);\n\nAccordionItemContent.displayName = 'AccordionItemContent';\n\nconst AccordionItem = memo<AccordionItemProps>(\n ({\n itemKey,\n title,\n children,\n action,\n disabled = false,\n allowExpand = true,\n hideIndicator: itemHideIndicator,\n indicatorPlacement: itemIndicatorPlacement,\n indicator: customIndicator,\n classNames,\n paddingInline = 16,\n paddingBlock = 8,\n padding,\n ref,\n variant: customVariant,\n styles: customStyles,\n headerWrapper,\n defaultExpand,\n expand,\n onExpandChange,\n }) => {\n const { cx, styles } = useStyles();\n const context = useAccordionContext();\n\n // Determine if using standalone mode (has expand or defaultExpand props)\n const isStandalone = expand !== undefined || defaultExpand !== undefined;\n\n // Standalone state management\n const [isExpandedStandalone, setIsExpandedStandalone] = useMergeState<boolean>(\n defaultExpand ?? false,\n {\n onChange: onExpandChange,\n value: expand,\n },\n );\n\n // Context values (may be null if used standalone)\n const contextIsExpanded = context?.isExpanded;\n const contextOnToggle = context?.onToggle;\n const contextHideIndicator = context?.hideIndicator;\n const contextIndicatorPlacement = context?.indicatorPlacement;\n const contextKeepContentMounted = context?.keepContentMounted;\n const contextDisableAnimation = context?.disableAnimation;\n const contextMotionProps = context?.motionProps;\n const contextVariant = context?.variant ?? 'filled';\n\n const isInitialRenderRef = useRef(true);\n\n useEffect(() => {\n isInitialRenderRef.current = false;\n }, []);\n\n // Determine expanded state\n const isOpen = isStandalone\n ? isExpandedStandalone\n : contextIsExpanded\n ? contextIsExpanded(itemKey)\n : false;\n\n // Determine other props with fallbacks\n const hideIndicatorFinal = itemHideIndicator ?? contextHideIndicator ?? false;\n const indicatorPlacementFinal = itemIndicatorPlacement ?? contextIndicatorPlacement ?? 'start';\n const keepContentMounted = contextKeepContentMounted ?? true;\n const disableAnimation = contextDisableAnimation ?? false;\n const variant = customVariant || contextVariant;\n\n const handleToggle = useCallback(() => {\n // If allowExpand is false, only allow controlled expansion via expand prop\n if (!allowExpand) return;\n\n if (!disabled) {\n if (isStandalone) {\n setIsExpandedStandalone(!isExpandedStandalone);\n } else if (contextOnToggle) {\n contextOnToggle(itemKey);\n }\n }\n }, [\n allowExpand,\n disabled,\n isStandalone,\n setIsExpandedStandalone,\n isExpandedStandalone,\n contextOnToggle,\n itemKey,\n ]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n // If allowExpand is false, disable keyboard toggle\n if (!allowExpand || disabled) return;\n\n switch (e.key) {\n case 'Enter':\n case ' ': {\n e.preventDefault();\n handleToggle();\n break;\n }\n }\n },\n [allowExpand, disabled, handleToggle],\n );\n\n // Build indicator\n const indicator = useMemo(() => {\n if (!allowExpand || hideIndicatorFinal) return null;\n\n if (customIndicator) {\n if (typeof customIndicator === 'function') {\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n {customIndicator({ isDisabled: disabled, isOpen })}\n </span>\n );\n }\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n {customIndicator}\n </span>\n );\n }\n\n return (\n <span\n aria-hidden=\"true\"\n className={cx(styles.indicator, classNames?.indicator)}\n style={customStyles?.indicator}\n >\n <ArrowIcon className={cx(styles.icon, isOpen && styles.iconRotate)} />\n </span>\n );\n }, [\n allowExpand,\n hideIndicatorFinal,\n customIndicator,\n disabled,\n isOpen,\n cx,\n styles,\n classNames,\n customStyles,\n ]);\n\n const skipInitialAnimation = isInitialRenderRef.current && isOpen;\n\n const contentClassName = useMemo(\n () => cx('accordion-content', styles.content, classNames?.content),\n [cx, styles, classNames?.content],\n );\n\n const titleNode = useMemo(\n () =>\n typeof title === 'string' ? (\n <Text className={classNames?.title} ellipsis style={customStyles?.title}>\n {title}\n </Text>\n ) : (\n title\n ),\n [title, classNames?.title, customStyles?.title],\n );\n\n const actionNode = useMemo(\n () =>\n action && (\n <Flexbox\n align={'center'}\n className={cx('accordion-action', styles.action, classNames?.action)}\n flex={'none'}\n gap={4}\n horizontal\n onClick={(e) => e.stopPropagation()}\n style={customStyles?.action}\n >\n {action}\n </Flexbox>\n ),\n [action, cx, styles, classNames?.action, customStyles?.action],\n );\n\n const headerElement = useMemo(() => {\n const header = (\n <Block\n className={cx('accordion-header', styles.header, classNames?.header)}\n clickable={!disabled && allowExpand}\n gap={4}\n horizontal\n justify={'space-between'}\n onClick={handleToggle}\n onKeyDown={handleKeyDown}\n padding={padding}\n paddingBlock={paddingBlock}\n paddingInline={paddingInline}\n ref={ref}\n style={{\n alignItems: 'center',\n cursor: disabled ? 'not-allowed' : allowExpand ? 'pointer' : 'default',\n opacity: disabled ? 0.5 : undefined,\n overflow: 'hidden',\n width: '100%',\n ...customStyles?.header,\n }}\n variant={customVariant || variant}\n >\n {indicatorPlacementFinal === 'start' ? (\n <>\n <Flexbox\n align={'center'}\n flex={1}\n gap={2}\n horizontal\n style={{\n overflow: 'hidden',\n }}\n >\n {titleNode}\n {indicator}\n </Flexbox>\n <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n {actionNode}\n </Flexbox>\n </>\n ) : (\n <>\n <Flexbox\n align={'center'}\n flex={1}\n gap={2}\n horizontal\n style={{\n overflow: 'hidden',\n }}\n >\n {titleNode}\n </Flexbox>\n <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n {actionNode}\n {indicator}\n </Flexbox>\n </>\n )}\n </Block>\n );\n if (headerWrapper) {\n return headerWrapper(header);\n }\n return header;\n }, [\n cx,\n styles,\n classNames,\n disabled,\n handleToggle,\n handleKeyDown,\n padding,\n paddingBlock,\n paddingInline,\n ref,\n customVariant,\n variant,\n indicatorPlacementFinal,\n titleNode,\n indicator,\n actionNode,\n headerWrapper,\n ]);\n\n return (\n <div\n className={cx('accordion-item', styles.item, classNames?.base)}\n style={customStyles?.base}\n >\n {headerElement}\n <AccordionItemContent\n className={contentClassName}\n contentInnerClassName={styles.contentInner}\n contextMotionProps={contextMotionProps}\n disableAnimation={!!disableAnimation}\n isOpen={isOpen}\n keepContentMounted={!!keepContentMounted}\n skipInitialAnimation={skipInitialAnimation}\n style={customStyles?.content}\n >\n {children}\n </AccordionItemContent>\n </div>\n );\n },\n);\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport default AccordionItem;\n"],"mappings":"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"}
@@ -3,9 +3,7 @@ import { createContext, useContext } from "react";
3
3
  //#region src/Accordion/context.tsx
4
4
  const AccordionContext = createContext(null);
5
5
  const useAccordionContext = () => {
6
- const context = useContext(AccordionContext);
7
- if (!context) throw new Error("AccordionItem must be used within Accordion");
8
- return context;
6
+ return useContext(AccordionContext);
9
7
  };
10
8
 
11
9
  //#endregion
@@ -1 +1 @@
1
- {"version":3,"file":"context.mjs","names":[],"sources":["../../src/Accordion/context.tsx"],"sourcesContent":["import type { Key } from 'react';\nimport { createContext, useContext } from 'react';\n\ninterface AccordionContextValue {\n disableAnimation?: boolean;\n expandedKeys: Key[];\n hideIndicator?: boolean;\n indicatorPlacement?: 'end' | 'start';\n isExpanded: (key: Key) => boolean;\n keepContentMounted?: boolean;\n motionProps?: any;\n onToggle: (key: Key) => void;\n showDivider?: boolean;\n variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const AccordionContext = createContext<AccordionContextValue | null>(null);\n\nexport const useAccordionContext = () => {\n const context = useContext(AccordionContext);\n if (!context) {\n throw new Error('AccordionItem must be used within Accordion');\n }\n return context;\n};\n"],"mappings":";;;AAgBA,MAAa,mBAAmB,cAA4C,KAAK;AAEjF,MAAa,4BAA4B;CACvC,MAAM,UAAU,WAAW,iBAAiB;AAC5C,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,8CAA8C;AAEhE,QAAO"}
1
+ {"version":3,"file":"context.mjs","names":[],"sources":["../../src/Accordion/context.tsx"],"sourcesContent":["import type { Key } from 'react';\nimport { createContext, useContext } from 'react';\n\ninterface AccordionContextValue {\n disableAnimation?: boolean;\n expandedKeys: Key[];\n hideIndicator?: boolean;\n indicatorPlacement?: 'end' | 'start';\n isExpanded: (key: Key) => boolean;\n keepContentMounted?: boolean;\n motionProps?: any;\n onToggle: (key: Key) => void;\n showDivider?: boolean;\n variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const AccordionContext = createContext<AccordionContextValue | null>(null);\n\nexport const useAccordionContext = () => {\n return useContext(AccordionContext);\n};\n"],"mappings":";;;AAgBA,MAAa,mBAAmB,cAA4C,KAAK;AAEjF,MAAa,4BAA4B;AACvC,QAAO,WAAW,iBAAiB"}
@@ -8,6 +8,11 @@ interface AccordionItemProps extends Pick<BlockProps, 'padding' | 'paddingBlock'
8
8
  * Action component that appears on hover
9
9
  */
10
10
  action?: ReactNode;
11
+ /**
12
+ * Whether to allow expanding (hide indicator when false)
13
+ * @default true
14
+ */
15
+ allowExpand?: boolean;
11
16
  /**
12
17
  * Content of the accordion item
13
18
  */
@@ -23,10 +28,18 @@ interface AccordionItemProps extends Pick<BlockProps, 'padding' | 'paddingBlock'
23
28
  indicator?: string;
24
29
  title?: string;
25
30
  };
31
+ /**
32
+ * Default expanded state (uncontrolled)
33
+ */
34
+ defaultExpand?: boolean;
26
35
  /**
27
36
  * Whether the item is disabled
28
37
  */
29
38
  disabled?: boolean;
39
+ /**
40
+ * Controlled expanded state
41
+ */
42
+ expand?: boolean;
30
43
  headerWrapper?: (header: ReactNode) => ReactNode;
31
44
  /**
32
45
  * Whether to hide the chevron indicator
@@ -49,6 +62,10 @@ interface AccordionItemProps extends Pick<BlockProps, 'padding' | 'paddingBlock'
49
62
  * Unique identifier for the item (use as React key)
50
63
  */
51
64
  itemKey: Key;
65
+ /**
66
+ * Callback when expanded state changes
67
+ */
68
+ onExpandChange?: (expanded: boolean) => void;
52
69
  /**
53
70
  * Custom styles for child elements
54
71
  */
@@ -1,8 +1,8 @@
1
1
  import { ActionIconProps } from "./type.mjs";
2
- import * as react12 from "react";
2
+ import * as react30 from "react";
3
3
 
4
4
  //#region src/ActionIcon/ActionIcon.d.ts
5
- declare const ActionIcon: react12.NamedExoticComponent<ActionIconProps>;
5
+ declare const ActionIcon: react30.NamedExoticComponent<ActionIconProps>;
6
6
  //#endregion
7
7
  export { ActionIcon };
8
8
  //# sourceMappingURL=ActionIcon.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { AlertProps } from "./type.mjs";
2
- import * as react11 from "react";
2
+ import * as react25 from "react";
3
3
 
4
4
  //#region src/Alert/Alert.d.ts
5
- declare const Alert: react11.NamedExoticComponent<AlertProps>;
5
+ declare const Alert: react25.NamedExoticComponent<AlertProps>;
6
6
  //#endregion
7
7
  export { Alert };
8
8
  //# sourceMappingURL=Alert.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { AutoCompleteProps } from "./type.mjs";
2
- import * as react0 from "react";
2
+ import * as react24 from "react";
3
3
 
4
4
  //#region src/AutoComplete/Select.d.ts
5
- declare const AutoComplete: react0.NamedExoticComponent<AutoCompleteProps>;
5
+ declare const AutoComplete: react24.NamedExoticComponent<AutoCompleteProps>;
6
6
  //#endregion
7
7
  export { AutoComplete };
8
8
  //# sourceMappingURL=Select.d.mts.map
@@ -84,6 +84,7 @@ const Avatar$1 = memo(({ bordered, className, avatar, title, animation, bordered
84
84
  src: isDefaultAntAvatar ? defualtAvatar : void 0,
85
85
  style: {
86
86
  background: isDefaultAntAvatar || !!emoji ? background : background || theme.colorBorder,
87
+ borderRadius: shape === "square" && size && size < 24 ? "33%" : void 0,
87
88
  boxShadow: bordered ? `${theme.colorBgLayout} 0 0 0 2px, ${borderedColor || theme.colorTextTertiary} 0 0 0 4px` : void 0,
88
89
  color: readableColor(background || theme.colorBorder),
89
90
  cursor: rest?.onClick ? "pointer" : void 0,
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.mjs","names":["Avatar","Img","FluentEmoji","AntAvatar","Center","Icon"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["'use client';\n\nimport { getEmoji } from '@lobehub/fluent-emoji';\nimport { Avatar as AntAvatar } from 'antd';\nimport { cva } from 'class-variance-authority';\nimport { Loader2 } from 'lucide-react';\nimport { readableColor } from 'polished';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Center } from '@/Flex';\nimport FluentEmoji from '@/FluentEmoji';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\n\nimport { useStyles } from './style';\nimport type { AvatarProps } from './type';\n\nconst Avatar = memo<AvatarProps>(\n ({\n bordered,\n className,\n avatar,\n title,\n animation,\n borderedColor,\n size = 48,\n shape = 'square',\n background,\n style,\n unoptimized,\n alt,\n variant = 'borderless',\n shadow,\n loading,\n sliceText = true,\n emojiScaleWithBackground = true,\n ref,\n ...rest\n }) => {\n const isStringAvatar = typeof avatar === 'string';\n\n const isDefaultAntAvatar = useMemo(\n () =>\n Boolean(\n avatar &&\n (['/', 'http', 'data:'].some((index) => isStringAvatar && avatar.startsWith(index)) ||\n isValidElement(avatar)),\n ),\n [avatar, isStringAvatar],\n );\n\n const emoji = useMemo(\n () => avatar && !isDefaultAntAvatar && isStringAvatar && getEmoji(avatar),\n [avatar, isStringAvatar, isDefaultAntAvatar],\n );\n\n const { styles, cx, theme } = useStyles();\n\n const variants = useMemo(\n () =>\n cva(styles.root, {\n defaultVariants: {\n shadow: false,\n variant: 'borderless',\n },\n /* eslint-disable sort-keys-fix/sort-keys-fix */\n variants: {\n variant: {\n filled: styles.filled,\n outlined: styles.outlined,\n borderless: styles.borderless,\n },\n shadow: {\n false: null,\n true: styles.shadow,\n },\n },\n /* eslint-enable sort-keys-fix/sort-keys-fix */\n }),\n [styles],\n );\n\n const text = String(isDefaultAntAvatar ? title : avatar);\n\n const imgAlt = alt || title || 'avatar';\n\n const defualtAvatar =\n typeof avatar === 'string' ? (\n <Img\n alt={imgAlt}\n height={size}\n loading={'lazy'}\n src={avatar}\n unoptimized={unoptimized}\n width={size}\n />\n ) : (\n avatar\n );\n\n const hasBackground =\n background &&\n background !== 'transparent' &&\n background !== 'rgba(0,0,0,0)' &&\n background !== null;\n\n const customAvatar = useMemo(\n () =>\n emoji ? (\n <FluentEmoji\n emoji={emoji}\n size={emojiScaleWithBackground ? (hasBackground ? size * 0.85 : size) : size * 0.85}\n type={animation ? 'anim' : '3d'}\n unoptimized={unoptimized}\n />\n ) : sliceText ? (\n (text || title)?.toUpperCase().slice(0, 2)\n ) : (\n (text || title)?.toUpperCase()\n ),\n [\n animation,\n emoji,\n hasBackground,\n size,\n sliceText,\n text,\n title,\n unoptimized,\n emojiScaleWithBackground,\n ],\n );\n\n return (\n <AntAvatar\n alt={imgAlt}\n className={cx(variants({ shadow, variant }), className)}\n draggable={false}\n ref={ref}\n shape={shape}\n size={size}\n src={isDefaultAntAvatar ? defualtAvatar : undefined}\n style={{\n background: isDefaultAntAvatar || !!emoji ? background : background || theme.colorBorder,\n boxShadow: bordered\n ? `${theme.colorBgLayout} 0 0 0 2px, ${borderedColor || theme.colorTextTertiary} 0 0 0 4px`\n : undefined,\n color: readableColor(background || theme.colorBorder),\n cursor: rest?.onClick ? 'pointer' : undefined,\n fontSize: size * (emoji ? 0.7 : 0.5),\n ...style,\n }}\n {...rest}\n >\n {loading && (\n <Center className={styles.loading} height={'100%'} width={'100%'}>\n <Icon icon={Loader2} spin />\n </Center>\n )}\n {!isDefaultAntAvatar && customAvatar}\n </AntAvatar>\n );\n },\n);\n\nAvatar.displayName = 'Avatar';\n\nexport default Avatar;\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAMA,WAAS,MACZ,EACC,UACA,WACA,QACA,OACA,WACA,eACA,OAAO,IACP,QAAQ,UACR,YACA,OACA,aACA,KACA,UAAU,cACV,QACA,SACA,YAAY,MACZ,2BAA2B,MAC3B,KACA,GAAG,WACC;CACJ,MAAM,iBAAiB,OAAO,WAAW;CAEzC,MAAM,qBAAqB,cAEvB,QACE,WACC;EAAC;EAAK;EAAQ;EAAQ,CAAC,MAAM,UAAU,kBAAkB,OAAO,WAAW,MAAM,CAAC,IACjF,eAAe,OAAO,EACzB,EACH,CAAC,QAAQ,eAAe,CACzB;CAED,MAAM,QAAQ,cACN,UAAU,CAAC,sBAAsB,kBAAkB,SAAS,OAAO,EACzE;EAAC;EAAQ;EAAgB;EAAmB,CAC7C;CAED,MAAM,EAAE,QAAQ,IAAI,UAAU,WAAW;CAEzC,MAAM,WAAW,cAEb,IAAI,OAAO,MAAM;EACf,iBAAiB;GACf,QAAQ;GACR,SAAS;GACV;EAED,UAAU;GACR,SAAS;IACP,QAAQ,OAAO;IACf,UAAU,OAAO;IACjB,YAAY,OAAO;IACpB;GACD,QAAQ;IACN,OAAO;IACP,MAAM,OAAO;IACd;GACF;EAEF,CAAC,EACJ,CAAC,OAAO,CACT;CAED,MAAM,OAAO,OAAO,qBAAqB,QAAQ,OAAO;CAExD,MAAM,SAAS,OAAO,SAAS;CAE/B,MAAM,gBACJ,OAAO,WAAW,WAChB,oBAACC;EACC,KAAK;EACL,QAAQ;EACR,SAAS;EACT,KAAK;EACQ;EACb,OAAO;GACP,GAEF;CAGJ,MAAM,gBACJ,cACA,eAAe,iBACf,eAAe,mBACf,eAAe;CAEjB,MAAM,eAAe,cAEjB,QACE,oBAACC;EACQ;EACP,MAAM,2BAA4B,gBAAgB,OAAO,MAAO,OAAQ,OAAO;EAC/E,MAAM,YAAY,SAAS;EACd;GACb,GACA,aACD,QAAQ,QAAQ,aAAa,CAAC,MAAM,GAAG,EAAE,IAEzC,QAAQ,QAAQ,aAAa,EAElC;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,QACE,qBAACC;EACC,KAAK;EACL,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAS,CAAC,EAAE,UAAU;EACvD,WAAW;EACN;EACE;EACD;EACN,KAAK,qBAAqB,gBAAgB;EAC1C,OAAO;GACL,YAAY,sBAAsB,CAAC,CAAC,QAAQ,aAAa,cAAc,MAAM;GAC7E,WAAW,WACP,GAAG,MAAM,cAAc,cAAc,iBAAiB,MAAM,kBAAkB,cAC9E;GACJ,OAAO,cAAc,cAAc,MAAM,YAAY;GACrD,QAAQ,MAAM,UAAU,YAAY;GACpC,UAAU,QAAQ,QAAQ,KAAM;GAChC,GAAG;GACJ;EACD,GAAI;aAEH,WACC,oBAACC;GAAO,WAAW,OAAO;GAAS,QAAQ;GAAQ,OAAO;aACxD,oBAACC;IAAK,MAAM;IAAS;KAAO;IACrB,EAEV,CAAC,sBAAsB;GACd;EAGjB;AAED,SAAO,cAAc;AAErB,qBAAeL"}
1
+ {"version":3,"file":"Avatar.mjs","names":["Avatar","Img","FluentEmoji","AntAvatar","Center","Icon"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["'use client';\n\nimport { getEmoji } from '@lobehub/fluent-emoji';\nimport { Avatar as AntAvatar } from 'antd';\nimport { cva } from 'class-variance-authority';\nimport { Loader2 } from 'lucide-react';\nimport { readableColor } from 'polished';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Center } from '@/Flex';\nimport FluentEmoji from '@/FluentEmoji';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\n\nimport { useStyles } from './style';\nimport type { AvatarProps } from './type';\n\nconst Avatar = memo<AvatarProps>(\n ({\n bordered,\n className,\n avatar,\n title,\n animation,\n borderedColor,\n size = 48,\n shape = 'square',\n background,\n style,\n unoptimized,\n alt,\n variant = 'borderless',\n shadow,\n loading,\n sliceText = true,\n emojiScaleWithBackground = true,\n ref,\n ...rest\n }) => {\n const isStringAvatar = typeof avatar === 'string';\n\n const isDefaultAntAvatar = useMemo(\n () =>\n Boolean(\n avatar &&\n (['/', 'http', 'data:'].some((index) => isStringAvatar && avatar.startsWith(index)) ||\n isValidElement(avatar)),\n ),\n [avatar, isStringAvatar],\n );\n\n const emoji = useMemo(\n () => avatar && !isDefaultAntAvatar && isStringAvatar && getEmoji(avatar),\n [avatar, isStringAvatar, isDefaultAntAvatar],\n );\n\n const { styles, cx, theme } = useStyles();\n\n const variants = useMemo(\n () =>\n cva(styles.root, {\n defaultVariants: {\n shadow: false,\n variant: 'borderless',\n },\n /* eslint-disable sort-keys-fix/sort-keys-fix */\n variants: {\n variant: {\n filled: styles.filled,\n outlined: styles.outlined,\n borderless: styles.borderless,\n },\n shadow: {\n false: null,\n true: styles.shadow,\n },\n },\n /* eslint-enable sort-keys-fix/sort-keys-fix */\n }),\n [styles],\n );\n\n const text = String(isDefaultAntAvatar ? title : avatar);\n\n const imgAlt = alt || title || 'avatar';\n\n const defualtAvatar =\n typeof avatar === 'string' ? (\n <Img\n alt={imgAlt}\n height={size}\n loading={'lazy'}\n src={avatar}\n unoptimized={unoptimized}\n width={size}\n />\n ) : (\n avatar\n );\n\n const hasBackground =\n background &&\n background !== 'transparent' &&\n background !== 'rgba(0,0,0,0)' &&\n background !== null;\n\n const customAvatar = useMemo(\n () =>\n emoji ? (\n <FluentEmoji\n emoji={emoji}\n size={emojiScaleWithBackground ? (hasBackground ? size * 0.85 : size) : size * 0.85}\n type={animation ? 'anim' : '3d'}\n unoptimized={unoptimized}\n />\n ) : sliceText ? (\n (text || title)?.toUpperCase().slice(0, 2)\n ) : (\n (text || title)?.toUpperCase()\n ),\n [\n animation,\n emoji,\n hasBackground,\n size,\n sliceText,\n text,\n title,\n unoptimized,\n emojiScaleWithBackground,\n ],\n );\n\n return (\n <AntAvatar\n alt={imgAlt}\n className={cx(variants({ shadow, variant }), className)}\n draggable={false}\n ref={ref}\n shape={shape}\n size={size}\n src={isDefaultAntAvatar ? defualtAvatar : undefined}\n style={{\n background: isDefaultAntAvatar || !!emoji ? background : background || theme.colorBorder,\n borderRadius: shape === 'square' && size && size < 24 ? '33%' : undefined,\n boxShadow: bordered\n ? `${theme.colorBgLayout} 0 0 0 2px, ${borderedColor || theme.colorTextTertiary} 0 0 0 4px`\n : undefined,\n color: readableColor(background || theme.colorBorder),\n cursor: rest?.onClick ? 'pointer' : undefined,\n fontSize: size * (emoji ? 0.7 : 0.5),\n ...style,\n }}\n {...rest}\n >\n {loading && (\n <Center className={styles.loading} height={'100%'} width={'100%'}>\n <Icon icon={Loader2} spin />\n </Center>\n )}\n {!isDefaultAntAvatar && customAvatar}\n </AntAvatar>\n );\n },\n);\n\nAvatar.displayName = 'Avatar';\n\nexport default Avatar;\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAMA,WAAS,MACZ,EACC,UACA,WACA,QACA,OACA,WACA,eACA,OAAO,IACP,QAAQ,UACR,YACA,OACA,aACA,KACA,UAAU,cACV,QACA,SACA,YAAY,MACZ,2BAA2B,MAC3B,KACA,GAAG,WACC;CACJ,MAAM,iBAAiB,OAAO,WAAW;CAEzC,MAAM,qBAAqB,cAEvB,QACE,WACC;EAAC;EAAK;EAAQ;EAAQ,CAAC,MAAM,UAAU,kBAAkB,OAAO,WAAW,MAAM,CAAC,IACjF,eAAe,OAAO,EACzB,EACH,CAAC,QAAQ,eAAe,CACzB;CAED,MAAM,QAAQ,cACN,UAAU,CAAC,sBAAsB,kBAAkB,SAAS,OAAO,EACzE;EAAC;EAAQ;EAAgB;EAAmB,CAC7C;CAED,MAAM,EAAE,QAAQ,IAAI,UAAU,WAAW;CAEzC,MAAM,WAAW,cAEb,IAAI,OAAO,MAAM;EACf,iBAAiB;GACf,QAAQ;GACR,SAAS;GACV;EAED,UAAU;GACR,SAAS;IACP,QAAQ,OAAO;IACf,UAAU,OAAO;IACjB,YAAY,OAAO;IACpB;GACD,QAAQ;IACN,OAAO;IACP,MAAM,OAAO;IACd;GACF;EAEF,CAAC,EACJ,CAAC,OAAO,CACT;CAED,MAAM,OAAO,OAAO,qBAAqB,QAAQ,OAAO;CAExD,MAAM,SAAS,OAAO,SAAS;CAE/B,MAAM,gBACJ,OAAO,WAAW,WAChB,oBAACC;EACC,KAAK;EACL,QAAQ;EACR,SAAS;EACT,KAAK;EACQ;EACb,OAAO;GACP,GAEF;CAGJ,MAAM,gBACJ,cACA,eAAe,iBACf,eAAe,mBACf,eAAe;CAEjB,MAAM,eAAe,cAEjB,QACE,oBAACC;EACQ;EACP,MAAM,2BAA4B,gBAAgB,OAAO,MAAO,OAAQ,OAAO;EAC/E,MAAM,YAAY,SAAS;EACd;GACb,GACA,aACD,QAAQ,QAAQ,aAAa,CAAC,MAAM,GAAG,EAAE,IAEzC,QAAQ,QAAQ,aAAa,EAElC;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,QACE,qBAACC;EACC,KAAK;EACL,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAS,CAAC,EAAE,UAAU;EACvD,WAAW;EACN;EACE;EACD;EACN,KAAK,qBAAqB,gBAAgB;EAC1C,OAAO;GACL,YAAY,sBAAsB,CAAC,CAAC,QAAQ,aAAa,cAAc,MAAM;GAC7E,cAAc,UAAU,YAAY,QAAQ,OAAO,KAAK,QAAQ;GAChE,WAAW,WACP,GAAG,MAAM,cAAc,cAAc,iBAAiB,MAAM,kBAAkB,cAC9E;GACJ,OAAO,cAAc,cAAc,MAAM,YAAY;GACrD,QAAQ,MAAM,UAAU,YAAY;GACpC,UAAU,QAAQ,QAAQ,KAAM;GAChC,GAAG;GACJ;EACD,GAAI;aAEH,WACC,oBAACC;GAAO,WAAW,OAAO;GAAS,QAAQ;GAAQ,OAAO;aACxD,oBAACC;IAAK,MAAM;IAAS;KAAO;IACrB,EAEV,CAAC,sBAAsB;GACd;EAGjB;AAED,SAAO,cAAc;AAErB,qBAAeL"}
@@ -1,8 +1,8 @@
1
1
  import { AvatarGroupProps } from "../type.mjs";
2
- import * as react8 from "react";
2
+ import * as react23 from "react";
3
3
 
4
4
  //#region src/Avatar/AvatarGroup/index.d.ts
5
- declare const AvatarGroup: react8.NamedExoticComponent<AvatarGroupProps>;
5
+ declare const AvatarGroup: react23.NamedExoticComponent<AvatarGroupProps>;
6
6
  //#endregion
7
7
  export { AvatarGroup };
8
8
  //# sourceMappingURL=index.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { BurgerProps } from "./type.mjs";
2
- import * as react7 from "react";
2
+ import * as react22 from "react";
3
3
 
4
4
  //#region src/Burger/Burger.d.ts
5
- declare const Burger: react7.NamedExoticComponent<BurgerProps>;
5
+ declare const Burger: react22.NamedExoticComponent<BurgerProps>;
6
6
  //#endregion
7
7
  export { Burger };
8
8
  //# sourceMappingURL=Burger.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { CodeEditorProps } from "./type.mjs";
2
- import * as react6 from "react";
2
+ import * as react59 from "react";
3
3
 
4
4
  //#region src/CodeEditor/CodeEditor.d.ts
5
- declare const CodeEditor: react6.NamedExoticComponent<CodeEditorProps>;
5
+ declare const CodeEditor: react59.NamedExoticComponent<CodeEditorProps>;
6
6
  //#endregion
7
7
  export { CodeEditor };
8
8
  //# sourceMappingURL=CodeEditor.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { CollapseProps } from "./type.mjs";
2
- import * as react5 from "react";
2
+ import * as react20 from "react";
3
3
 
4
4
  //#region src/Collapse/Collapse.d.ts
5
- declare const Collapse: react5.NamedExoticComponent<CollapseProps>;
5
+ declare const Collapse: react20.NamedExoticComponent<CollapseProps>;
6
6
  //#endregion
7
7
  export { Collapse };
8
8
  //# sourceMappingURL=Collapse.d.mts.map
@@ -1,7 +1,7 @@
1
1
  import { MotionComponentType } from "../MotionProvider/index.mjs";
2
2
  import { TranslationResourcesInput } from "../i18n/types.mjs";
3
3
  import { CDN, CdnApi } from "../utils/genCdnUrl.mjs";
4
- import * as react28 from "react";
4
+ import * as react60 from "react";
5
5
  import { ElementType, ReactNode } from "react";
6
6
 
7
7
  //#region src/ConfigProvider/index.d.ts
@@ -19,7 +19,7 @@ interface ConfigProviderProps {
19
19
  motion: MotionComponentType;
20
20
  resources?: TranslationResourcesInput;
21
21
  }
22
- declare const ConfigProvider: react28.NamedExoticComponent<ConfigProviderProps>;
22
+ declare const ConfigProvider: react60.NamedExoticComponent<ConfigProviderProps>;
23
23
  type CdnFn = ({
24
24
  pkg,
25
25
  version,
@@ -1,8 +1,8 @@
1
1
  import { CopyButtonProps } from "./type.mjs";
2
- import * as react4 from "react";
2
+ import * as react21 from "react";
3
3
 
4
4
  //#region src/CopyButton/CopyButton.d.ts
5
- declare const CopyButton: react4.NamedExoticComponent<CopyButtonProps>;
5
+ declare const CopyButton: react21.NamedExoticComponent<CopyButtonProps>;
6
6
  //#endregion
7
7
  export { CopyButton };
8
8
  //# sourceMappingURL=CopyButton.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { DatePickerProps } from "./type.mjs";
2
- import * as react67 from "react";
2
+ import * as react58 from "react";
3
3
 
4
4
  //#region src/DatePicker/DatePicker.d.ts
5
- declare const DatePicker: react67.NamedExoticComponent<DatePickerProps>;
5
+ declare const DatePicker: react58.NamedExoticComponent<DatePickerProps>;
6
6
  //#endregion
7
7
  export { DatePicker };
8
8
  //# sourceMappingURL=DatePicker.d.mts.map