@lobehub/ui 5.23.5 → 5.24.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/Accordion/Accordion.mjs.map +1 -1
- package/es/Accordion/AccordionItem.mjs.map +1 -1
- package/es/Accordion/ArrowIcon.mjs.map +1 -1
- package/es/ActionIcon/ActionIcon.mjs.map +1 -1
- package/es/ActionIconGroup/ActionIconGroup.mjs.map +1 -1
- package/es/Alert/Alert.mjs.map +1 -1
- package/es/Avatar/Avatar.mjs.map +1 -1
- package/es/Avatar/AvatarGroup/index.mjs.map +1 -1
- package/es/Burger/Burger.mjs.map +1 -1
- package/es/Checkbox/Checkbox.mjs.map +1 -1
- package/es/Checkbox/CheckboxGroup.mjs.map +1 -1
- package/es/CodeDiff/DiffPanel.mjs.map +1 -1
- package/es/CodeEditor/CodeEditor.mjs.map +1 -1
- package/es/Collapse/Collapse.mjs.map +1 -1
- package/es/ColorSwatches/ColorSwatches.mjs.map +1 -1
- package/es/ConfigProvider/index.mjs.map +1 -1
- package/es/ContextMenu/index.d.mts +2 -2
- package/es/ContextMenu/index.mjs +2 -2
- package/es/DraggablePanel/DraggablePanel.mjs.map +1 -1
- package/es/DraggablePanel/components/DraggablePanelHeader.mjs.map +1 -1
- package/es/DraggableSideNav/DraggableSideNav.mjs.map +1 -1
- package/es/Drawer/Drawer.mjs.map +1 -1
- package/es/Dropdown/Dropdown.mjs.map +1 -1
- package/es/EditableText/ControlInput.mjs.map +1 -1
- package/es/EditableText/EditableText.mjs.map +1 -1
- package/es/EditorSlashMenu/EditorSlashMenu.mjs.map +1 -1
- package/es/EditorSlashMenu/MenuItemRenderer.mjs.map +1 -1
- package/es/EmojiPicker/AvatarUploader.mjs.map +1 -1
- package/es/EmojiPicker/EmojiPicker.mjs.map +1 -1
- package/es/Empty/Empty.mjs.map +1 -1
- package/es/FileTypeIcon/FileTypeIcon.mjs.map +1 -1
- package/es/FileTypeIcon/components/FileIcon.mjs.map +1 -1
- package/es/FileTypeIcon/components/FolderIcon.mjs.map +1 -1
- package/es/FluentEmoji/FluentEmoji.mjs.map +1 -1
- package/es/Footer/Footer.mjs.map +1 -1
- package/es/Form/Form.mjs.map +1 -1
- package/es/Form/components/FormGroup.mjs.map +1 -1
- package/es/Form/components/FormSubmitFooter.mjs.map +1 -1
- package/es/Form/components/FormTitle.mjs.map +1 -1
- package/es/FormModal/FormModal.mjs.map +1 -1
- package/es/Freeze/Freeze.mjs.map +1 -1
- package/es/GroupAvatar/GroupAvatar.mjs.map +1 -1
- package/es/GuideCard/GuideCard.mjs.map +1 -1
- package/es/Header/Header.mjs.map +1 -1
- package/es/Highlighter/FullFeatured.mjs.map +1 -1
- package/es/Highlighter/Highlighter.mjs.map +1 -1
- package/es/Highlighter/LangSelect.mjs.map +1 -1
- package/es/Highlighter/SyntaxHighlighter/StreamRenderer.mjs.map +1 -1
- package/es/Highlighter/SyntaxHighlighter/style.mjs +2 -2
- package/es/Highlighter/SyntaxHighlighter/style.mjs.map +1 -1
- package/es/Hotkey/Hotkey.mjs.map +1 -1
- package/es/HotkeyInput/HotkeyInput.mjs.map +1 -1
- package/es/HtmlPreview/HtmlPreview.mjs.map +1 -1
- package/es/HtmlPreview/Iframe.mjs.map +1 -1
- package/es/Icon/Icon.mjs.map +1 -1
- package/es/Image/Image.mjs.map +1 -1
- package/es/Image/components/Toolbar.mjs.map +1 -1
- package/es/Image/components/usePreview.mjs.map +1 -1
- package/es/Image/components/usePreviewGroup.mjs.map +1 -1
- package/es/ImageSelect/ImageSelect.mjs.map +1 -1
- package/es/Layout/Layout.mjs.map +1 -1
- package/es/List/List.mjs.map +1 -1
- package/es/List/ListItem/index.mjs.map +1 -1
- package/es/Markdown/Markdown.mjs.map +1 -1
- package/es/Markdown/SyntaxMarkdown/MarkdownRender.mjs.map +1 -1
- package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs.map +1 -1
- package/es/Markdown/SyntaxMarkdown/style.mjs.map +1 -1
- package/es/Markdown/components/CodeBlock.mjs.map +1 -1
- package/es/Markdown/components/Footnotes.mjs.map +1 -1
- package/es/Markdown/components/MarkdownTable/index.mjs.map +1 -1
- package/es/Markdown/components/SearchResultCards/SearchResultCard.mjs.map +1 -1
- package/es/Markdown/components/SearchResultCards/index.mjs.map +1 -1
- package/es/MaterialFileTypeIcon/MaterialFileTypeIcon.mjs.map +1 -1
- package/es/Menu/Menu.mjs.map +1 -1
- package/es/Mermaid/FullFeatured.mjs.map +1 -1
- package/es/Mermaid/Mermaid.mjs.map +1 -1
- package/es/Mermaid/SyntaxMermaid/MermaidFallback.mjs +35 -0
- package/es/Mermaid/SyntaxMermaid/MermaidFallback.mjs.map +1 -0
- package/es/Mermaid/SyntaxMermaid/MermaidSvg.mjs +52 -0
- package/es/Mermaid/SyntaxMermaid/MermaidSvg.mjs.map +1 -0
- package/es/Mermaid/SyntaxMermaid/StaticMermaid.mjs +13 -42
- package/es/Mermaid/SyntaxMermaid/StaticMermaid.mjs.map +1 -1
- package/es/Mermaid/SyntaxMermaid/StreamMermaid.mjs +13 -43
- package/es/Mermaid/SyntaxMermaid/StreamMermaid.mjs.map +1 -1
- package/es/Mermaid/SyntaxMermaid/prepareInlineSvg.mjs +52 -0
- package/es/Mermaid/SyntaxMermaid/prepareInlineSvg.mjs.map +1 -0
- package/es/Mermaid/SyntaxMermaid/prepareMermaidSvg.mjs +20 -0
- package/es/Mermaid/SyntaxMermaid/prepareMermaidSvg.mjs.map +1 -0
- package/es/Mermaid/SyntaxMermaid/style.mjs +11 -0
- package/es/Mermaid/SyntaxMermaid/style.mjs.map +1 -1
- package/es/Mermaid/const.mjs +10 -31
- package/es/Mermaid/const.mjs.map +1 -1
- package/es/Mermaid/index.d.mts +2 -1
- package/es/Mermaid/index.mjs +2 -1
- package/es/Mermaid/type.d.mts +2 -2
- package/es/Modal/Modal.mjs.map +1 -1
- package/es/Modal/ModalStackItem.mjs.map +1 -1
- package/es/Modal/RawModalStackItem.mjs.map +1 -1
- package/es/Modal/imperative.mjs.map +1 -1
- package/es/Modal/style.mjs.map +1 -1
- package/es/NeuralNetworkLoading/NeuralNetworkLoading.mjs.map +1 -1
- package/es/ScrollShadow/ScrollShadow.mjs.map +1 -1
- package/es/SearchBar/SearchBar.mjs.map +1 -1
- package/es/SideNav/SideNav.mjs.map +1 -1
- package/es/Skeleton/Skeleton.mjs.map +1 -1
- package/es/Skeleton/SkeletonParagraph.mjs.map +1 -1
- package/es/Skeleton/SkeletonTags.mjs.map +1 -1
- package/es/SliderWithInput/SliderWithInput.mjs.map +1 -1
- package/es/Snippet/Snippet.mjs.map +1 -1
- package/es/SortableList/SortableList.mjs.map +1 -1
- package/es/SortableList/components/SortableItem.mjs.map +1 -1
- package/es/Text/Text.mjs.map +1 -1
- package/es/ThemeProvider/ThemeProvider.mjs +1 -1
- package/es/ThemeProvider/ThemeProvider.mjs.map +1 -1
- package/es/ThemeSwitch/ThemeSwitch.mjs.map +1 -1
- package/es/Toc/Toc.mjs.map +1 -1
- package/es/Toc/TocMobile.mjs.map +1 -1
- package/es/Video/index.mjs.map +1 -1
- package/es/awesome/AuroraBackground/AuroraBackground.mjs.map +1 -1
- package/es/awesome/Features/FeatureItem.mjs.map +1 -1
- package/es/awesome/Giscus/Giscus.mjs.map +1 -1
- package/es/awesome/GradientButton/GradientButton.mjs.map +1 -1
- package/es/awesome/GridBackground/GridBackground.mjs.map +1 -1
- package/es/awesome/GridBackground/GridShowcase.mjs.map +1 -1
- package/es/awesome/GridBackground/components/Grid.mjs.map +1 -1
- package/es/awesome/Hero/Hero.mjs.map +1 -1
- package/es/awesome/Spline/ParentSize.mjs.map +1 -1
- package/es/awesome/Spline/Spine.mjs.map +1 -1
- package/es/awesome/SpotlightCard/SpotlightCard.mjs.map +1 -1
- package/es/awesome/SpotlightCard/SpotlightCardItem.mjs.map +1 -1
- package/es/awesome/TypewriterEffect/TypewriterEffect.mjs.map +1 -1
- package/es/base-ui/AutoComplete/AutoComplete.mjs.map +1 -1
- package/es/base-ui/Button/Button.mjs.map +1 -1
- package/es/base-ui/Button/SplitButton.mjs.map +1 -1
- package/es/base-ui/Checkbox/Checkbox.mjs.map +1 -1
- package/es/base-ui/Checkbox/CheckboxGroup.mjs.map +1 -1
- package/es/base-ui/ContextMenu/ContextMenuHost.mjs.map +1 -1
- package/es/base-ui/ContextMenu/imperative.d.mts +2 -2
- package/es/base-ui/ContextMenu/index.d.mts +2 -2
- package/es/base-ui/ContextMenu/renderItems.mjs.map +1 -1
- package/es/base-ui/ContextMenu/store.d.mts +13 -1
- package/es/base-ui/ContextMenu/store.mjs +29 -4
- package/es/base-ui/ContextMenu/store.mjs.map +1 -1
- package/es/base-ui/DropdownMenu/DropdownMenu.mjs.map +1 -1
- package/es/base-ui/DropdownMenu/atoms.mjs.map +1 -1
- package/es/base-ui/DropdownMenu/renderItems.mjs.map +1 -1
- package/es/base-ui/DropdownMenu/sharedStyle.mjs +3 -0
- package/es/base-ui/DropdownMenu/sharedStyle.mjs.map +1 -1
- package/es/base-ui/FloatingPanel/FloatingPanel.mjs.map +1 -1
- package/es/base-ui/FloatingSheet/FloatingSheet.mjs.map +1 -1
- package/es/base-ui/FloatingSheet/FloatingSheetHeader.mjs.map +1 -1
- package/es/base-ui/Form/Form.mjs.map +1 -1
- package/es/base-ui/Form/components/FormField.mjs.map +1 -1
- package/es/base-ui/Form/components/FormGroup.mjs.map +1 -1
- package/es/base-ui/Form/components/FormSubmitFooter.mjs.map +1 -1
- package/es/base-ui/Form/components/FormTitle.mjs.map +1 -1
- package/es/base-ui/Input/Input.mjs.map +1 -1
- package/es/base-ui/Input/InputNumber.mjs.map +1 -1
- package/es/base-ui/Input/InputOTP.mjs.map +1 -1
- package/es/base-ui/Input/InputPassword.mjs.map +1 -1
- package/es/base-ui/Input/TextArea.mjs.map +1 -1
- package/es/base-ui/Input/style.d.mts +1 -1
- package/es/base-ui/Modal/Modal.mjs.map +1 -1
- package/es/base-ui/Modal/atoms.mjs.map +1 -1
- package/es/base-ui/Modal/imperative.mjs.map +1 -1
- package/es/base-ui/Popover/ArrowIcon.mjs.map +1 -1
- package/es/base-ui/Popover/PopoverGroup.mjs.map +1 -1
- package/es/base-ui/Popover/PopoverStandalone.mjs.map +1 -1
- package/es/base-ui/Popover/atoms.mjs.map +1 -1
- package/es/base-ui/Radio/Radio.mjs.map +1 -1
- package/es/base-ui/Radio/RadioGroup.mjs.map +1 -1
- package/es/base-ui/ScrollArea/ScrollArea.mjs.map +1 -1
- package/es/base-ui/Segmented/Segmented.mjs.map +1 -1
- package/es/base-ui/Select/Select.mjs.map +1 -1
- package/es/base-ui/Select/parts.mjs.map +1 -1
- package/es/base-ui/Select/renderOptions.mjs.map +1 -1
- package/es/base-ui/Slider/Slider.mjs.map +1 -1
- package/es/base-ui/Slider/SliderWithInput.mjs.map +1 -1
- package/es/base-ui/SubmenuArrowIcon.mjs.map +1 -1
- package/es/base-ui/Switch/Switch.mjs.map +1 -1
- package/es/base-ui/Switch/atoms.d.mts +3 -3
- package/es/base-ui/Switch/atoms.mjs +99 -50
- package/es/base-ui/Switch/atoms.mjs.map +1 -1
- package/es/base-ui/Switch/style.mjs +44 -1
- package/es/base-ui/Switch/style.mjs.map +1 -1
- package/es/base-ui/Switch/type.d.mts +3 -7
- package/es/base-ui/Tabs/Tabs.mjs.map +1 -1
- package/es/base-ui/Tabs/atoms.mjs.map +1 -1
- package/es/base-ui/Toast/Toast.mjs.map +1 -1
- package/es/base-ui/Toast/imperative.mjs.map +1 -1
- package/es/base-ui/Tooltip/ArrowIcon.mjs.map +1 -1
- package/es/base-ui/Tooltip/TooltipGroup.mjs.map +1 -1
- package/es/base-ui/Tooltip/TooltipStandalone.mjs.map +1 -1
- package/es/base-ui/index.d.mts +2 -2
- package/es/base-ui/index.mjs +2 -2
- package/es/brand/LobeChat/index.mjs.map +1 -1
- package/es/brand/LobeChatText/index.mjs.map +1 -1
- package/es/brand/LobeHub/index.mjs.map +1 -1
- package/es/brand/LobeHubText/index.mjs.map +1 -1
- package/es/brand/LogoThree/Loading.mjs.map +1 -1
- package/es/brand/LogoThree/LogoSpline.mjs.map +1 -1
- package/es/brand/LogoThree/index.mjs.map +1 -1
- package/es/brand/components/Divider.mjs.map +1 -1
- package/es/chat/BackBottom/BackBottom.mjs.map +1 -1
- package/es/chat/ChatHeader/ChatHeader.mjs.map +1 -1
- package/es/chat/ChatHeader/ChatHeaderTitle.mjs.map +1 -1
- package/es/chat/ChatInputArea/ChatInputArea.mjs.map +1 -1
- package/es/chat/ChatInputArea/components/ChatInputActionBar.mjs.map +1 -1
- package/es/chat/ChatInputArea/components/ChatSendButton.mjs.map +1 -1
- package/es/chat/ChatItem/ChatItem.mjs.map +1 -1
- package/es/chat/ChatItem/components/Actions.mjs.map +1 -1
- package/es/chat/ChatItem/components/Avatar.mjs.map +1 -1
- package/es/chat/ChatItem/components/ErrorContent.mjs.map +1 -1
- package/es/chat/ChatItem/components/Loading.mjs.map +1 -1
- package/es/chat/ChatItem/components/MessageContent.mjs.map +1 -1
- package/es/chat/ChatItem/components/Title.mjs.map +1 -1
- package/es/chat/ChatList/ChatList.mjs.map +1 -1
- package/es/chat/ChatList/components/HistoryDivider.mjs.map +1 -1
- package/es/chat/EditableMessage/EditableMessage.mjs.map +1 -1
- package/es/chat/EditableMessageList/EditableMessageList.mjs.map +1 -1
- package/es/chat/LoadingDots/LoadingDots.mjs.map +1 -1
- package/es/chat/MessageInput/MessageInput.mjs.map +1 -1
- package/es/chat/MessageModal/MessageModal.mjs.map +1 -1
- package/es/color/ColorScales/ScaleRow.mjs.map +1 -1
- package/es/color/ColorScales/index.mjs.map +1 -1
- package/es/color/CssVar/ScaleRow.mjs.map +1 -1
- package/es/color/CssVar/VarRow.mjs.map +1 -1
- package/es/color/CssVar/index.mjs.map +1 -1
- package/es/hooks/useMarkdown/latex.mjs.map +1 -1
- package/es/hooks/useMarkdown/useMarkdownContent.mjs.map +1 -1
- package/es/hooks/useMermaid.mjs +80 -116
- package/es/hooks/useMermaid.mjs.map +1 -1
- package/es/hooks/useMermaidCdn.d.mts +10 -0
- package/es/hooks/useMermaidCdn.mjs +97 -0
- package/es/hooks/useMermaidCdn.mjs.map +1 -0
- package/es/hooks/useStreamMermaid.mjs +19 -70
- package/es/hooks/useStreamMermaid.mjs.map +1 -1
- package/es/icons/Auth0/components/Mono.mjs.map +1 -1
- package/es/icons/Authelia/components/Color.mjs.map +1 -1
- package/es/icons/Authelia/components/Mono.mjs.map +1 -1
- package/es/icons/Authentik/components/Color.mjs.map +1 -1
- package/es/icons/Authentik/components/Mono.mjs.map +1 -1
- package/es/icons/Casdoor/components/Color.mjs.map +1 -1
- package/es/icons/Casdoor/components/Mono.mjs.map +1 -1
- package/es/icons/Clerk/components/Color.mjs.map +1 -1
- package/es/icons/Clerk/components/Mono.mjs.map +1 -1
- package/es/icons/DingTalk/components/Color.mjs.map +1 -1
- package/es/icons/DingTalk/components/Mono.mjs.map +1 -1
- package/es/icons/Discord/components/Color.mjs.map +1 -1
- package/es/icons/Discord/components/Mono.mjs.map +1 -1
- package/es/icons/GoogleChat/components/Color.mjs.map +1 -1
- package/es/icons/GoogleChat/components/Mono.mjs.map +1 -1
- package/es/icons/IMessage/components/Color.mjs.map +1 -1
- package/es/icons/IMessage/components/Inner.mjs.map +1 -1
- package/es/icons/IMessage/components/Mono.mjs.map +1 -1
- package/es/icons/Lark/components/Color.mjs.map +1 -1
- package/es/icons/Lark/components/Mono.mjs.map +1 -1
- package/es/icons/Line/components/Color.mjs.map +1 -1
- package/es/icons/Line/components/Mono.mjs.map +1 -1
- package/es/icons/Logto/components/Color.mjs.map +1 -1
- package/es/icons/Logto/components/Mono.mjs.map +1 -1
- package/es/icons/MicrosoftEntra/components/Color.mjs.map +1 -1
- package/es/icons/MicrosoftEntra/components/Mono.mjs.map +1 -1
- package/es/icons/MicrosoftTeams/components/Color.mjs.map +1 -1
- package/es/icons/MicrosoftTeams/components/Mono.mjs.map +1 -1
- package/es/icons/NextAuth/components/Color.mjs.map +1 -1
- package/es/icons/NextAuth/components/Mono.mjs.map +1 -1
- package/es/icons/QQ/components/Color.mjs.map +1 -1
- package/es/icons/QQ/components/Mono.mjs.map +1 -1
- package/es/icons/Slack/components/Color.mjs.map +1 -1
- package/es/icons/Slack/components/Mono.mjs.map +1 -1
- package/es/icons/Telegram/components/Color.mjs.map +1 -1
- package/es/icons/Telegram/components/Inner.mjs.map +1 -1
- package/es/icons/Telegram/components/Mono.mjs.map +1 -1
- package/es/icons/WeChat/components/Color.mjs.map +1 -1
- package/es/icons/WeChat/components/Mono.mjs.map +1 -1
- package/es/icons/WhatsApp/components/Color.mjs.map +1 -1
- package/es/icons/WhatsApp/components/Mono.mjs.map +1 -1
- package/es/icons/Zitadel/components/Color.mjs.map +1 -1
- package/es/icons/Zitadel/components/Mono.mjs.map +1 -1
- package/es/index.d.mts +2 -2
- package/es/index.mjs +2 -2
- package/es/mdx/Callout/index.mjs.map +1 -1
- package/es/mdx/Cards/Card.mjs.map +1 -1
- package/es/mdx/FileTree/File.mjs.map +1 -1
- package/es/mdx/FileTree/Folder.mjs.map +1 -1
- package/es/mdx/Mdx/index.mjs.map +1 -1
- package/es/mdx/Tabs/Tab.mjs.map +1 -1
- package/es/mdx/Tabs/index.mjs.map +1 -1
- package/es/mdx/mdxComponents/Citation/PopoverPanel.mjs.map +1 -1
- package/es/mdx/mdxComponents/Citation/index.mjs.map +1 -1
- package/es/mdx/mdxComponents/CodeBlock.mjs.map +1 -1
- package/es/mdx/mdxComponents/Link.mjs.map +1 -1
- package/es/mobile/ChatHeader/ChatHeader.mjs.map +1 -1
- package/es/mobile/ChatHeader/ChatHeaderTitle.mjs.map +1 -1
- package/es/mobile/ChatInputArea/ChatInputArea.mjs.map +1 -1
- package/es/mobile/TabBar/TabBar.mjs.map +1 -1
- package/es/storybook/StoryBook/index.mjs.map +1 -1
- package/package.json +3 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../src/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { Divider } from 'antd';\nimport { cx } from 'antd-style';\nimport { LayoutGroup } from 'motion/react';\nimport { type Key } from 'react';\nimport { Children, Fragment, isValidElement, memo, useCallback, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { AccordionConfigContext, AccordionItemStateProvider } from './context';\nimport { styles } from './style';\nimport { type AccordionProps } from './type';\n\nconst Accordion = memo<AccordionProps>(\n ({\n children,\n className: userClassName,\n style: userStyle,\n accordion = false,\n defaultExpandedKeys,\n expandedKeys: expandedKeysProp,\n onExpandedChange,\n variant = 'borderless',\n gap,\n showDivider = false,\n disableAnimation = false,\n hideIndicator = false,\n indicatorPlacement = 'start',\n keepContentMounted = true,\n classNames,\n styles: customStyles,\n motionProps,\n ref,\n ...rest\n }) => {\n // Convert children to array and filter valid elements\n const validChildren = Children.toArray(children).filter(isValidElement);\n\n // Collect all item keys\n const allItemKeys = validChildren.map((child, index) => (child.props as any).itemKey || index);\n\n // If defaultExpandedKeys or expandedKeys is undefined, expand all items by default\n const initialExpandedKeys = defaultExpandedKeys ?? allItemKeys;\n\n const [expandedKeys, setExpandedKeys] = useMergeState<Key[]>(initialExpandedKeys, {\n onChange: onExpandedChange,\n value: expandedKeysProp,\n });\n\n // Hold expandedKeys and setExpandedKeys via refs so toggleExpand can stay\n // reference-stable. use-merge-value's setter is recreated on every render,\n // so depending on it would force AccordionItemStateProvider's memoized\n // value to change identity each render — even when nothing toggled —\n // re-rendering every nested AccordionItem via \"context changed\".\n const expandedKeysRef = useRef(expandedKeys);\n expandedKeysRef.current = expandedKeys;\n const setExpandedKeysRef = useRef(setExpandedKeys);\n setExpandedKeysRef.current = setExpandedKeys;\n\n const isOpenKey = useCallback((key: Key) => expandedKeysRef.current.includes(key), []);\n\n const toggleExpand = useCallback(\n (key: Key) => {\n const prev = expandedKeysRef.current;\n let newKeys: Key[];\n\n if (accordion) {\n newKeys = prev.includes(key) ? [] : [key];\n } else {\n newKeys = prev.includes(key) ? prev.filter((k: Key) => k !== key) : [...prev, key];\n }\n\n setExpandedKeysRef.current(newKeys);\n },\n [accordion],\n );\n\n const toggleExpandKeys = useCallback(\n (keys: Key[], preferredKey: Key) => {\n const prev = expandedKeysRef.current;\n const isOpen = keys.some((key) => prev.includes(key));\n let newKeys: Key[];\n\n if (accordion) {\n newKeys = isOpen ? [] : [preferredKey];\n } else {\n newKeys = isOpen\n ? prev.filter((key: Key) => !keys.includes(key))\n : [...prev, preferredKey];\n }\n\n setExpandedKeysRef.current(newKeys);\n },\n [accordion],\n );\n\n const configValue = useMemo(\n () => ({\n disableAnimation,\n hideIndicator,\n indicatorPlacement,\n keepContentMounted,\n motionProps,\n showDivider,\n variant,\n }),\n [\n disableAnimation,\n hideIndicator,\n indicatorPlacement,\n keepContentMounted,\n motionProps,\n showDivider,\n variant,\n ],\n );\n\n const hasExplicitExpandedKeys =\n expandedKeysProp !== undefined || defaultExpandedKeys !== undefined;\n\n const content = (\n <>\n {validChildren.map((child, index) => {\n const hasChildItemKey = (child.props as any).itemKey !== undefined;\n const childKey = hasChildItemKey ? (child.props as any).itemKey : index;\n const itemIsOpen = expandedKeys.includes(childKey);\n return (\n <Fragment key={childKey}>\n <AccordionItemStateProvider\n expandedKeys={hasChildItemKey ? undefined : expandedKeys}\n isOpen={itemIsOpen}\n isOpenKey={isOpenKey}\n itemKey={childKey}\n preferProviderKeyForNestedItems={!hasExplicitExpandedKeys}\n onToggleKey={toggleExpand}\n onToggleKeys={toggleExpandKeys}\n >\n {child}\n </AccordionItemStateProvider>\n {showDivider && index < validChildren.length - 1 && (\n <Divider className={styles.divider} />\n )}\n </Fragment>\n );\n })}\n </>\n );\n\n return (\n <AccordionConfigContext value={configValue}>\n <div\n className={cx(styles.base, classNames?.base, userClassName)}\n ref={ref}\n style={{\n gap,\n ...customStyles?.base,\n ...userStyle,\n }}\n {...rest}\n >\n {disableAnimation ? content : <LayoutGroup>{content}</LayoutGroup>}\n </div>\n </AccordionConfigContext>\n );\n },\n);\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY,MACf,EACC,UACA,WAAW,eACX,OAAO,WACP,YAAY,OACZ,qBACA,cAAc,kBACd,kBACA,UAAU,cACV,KACA,cAAc,OACd,mBAAmB,OACnB,gBAAgB,OAChB,qBAAqB,SACrB,qBAAqB,MACrB,YACA,QAAQ,cACR,aACA,KACA,GAAG,WACC;CAEJ,MAAM,gBAAgB,SAAS,QAAQ,QAAQ,CAAC,CAAC,OAAO,cAAc;CAGtE,MAAM,cAAc,cAAc,KAAK,OAAO,UAAW,MAAM,MAAc,WAAW,KAAK;CAK7F,MAAM,CAAC,cAAc,mBAAmB,cAFZ,uBAAuB,aAE+B;EAChF,UAAU;EACV,OAAO;CACT,CAAC;CAOD,MAAM,kBAAkB,OAAO,YAAY;CAC3C,gBAAgB,UAAU;CAC1B,MAAM,qBAAqB,OAAO,eAAe;CACjD,mBAAmB,UAAU;CAE7B,MAAM,YAAY,aAAa,QAAa,gBAAgB,QAAQ,SAAS,GAAG,GAAG,CAAC,CAAC;CAErF,MAAM,eAAe,aAClB,QAAa;EACZ,MAAM,OAAO,gBAAgB;EAC7B,IAAI;EAEJ,IAAI,WACF,UAAU,KAAK,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG;OAExC,UAAU,KAAK,SAAS,GAAG,IAAI,KAAK,QAAQ,MAAW,MAAM,GAAG,IAAI,CAAC,GAAG,MAAM,GAAG;EAGnF,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,mBAAmB,aACtB,MAAa,iBAAsB;EAClC,MAAM,OAAO,gBAAgB;EAC7B,MAAM,SAAS,KAAK,MAAM,QAAQ,KAAK,SAAS,GAAG,CAAC;EACpD,IAAI;EAEJ,IAAI,WACF,UAAU,SAAS,CAAC,IAAI,CAAC,YAAY;OAErC,UAAU,SACN,KAAK,QAAQ,QAAa,CAAC,KAAK,SAAS,GAAG,CAAC,IAC7C,CAAC,GAAG,MAAM,YAAY;EAG5B,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,eACX;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,MAAM,0BACJ,qBAAqB,KAAA,KAAa,wBAAwB,KAAA;CAE5D,MAAM,UACJ,oBAAA,YAAA,EAAA,UACG,cAAc,KAAK,OAAO,UAAU;EACnC,MAAM,kBAAmB,MAAM,MAAc,YAAY,KAAA;EACzD,MAAM,WAAW,kBAAmB,MAAM,MAAc,UAAU;EAClE,MAAM,aAAa,aAAa,SAAS,QAAQ;EACjD,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,4BAAD;GACE,cAAc,kBAAkB,KAAA,IAAY;GAC5C,QAAQ;GACG;GACX,SAAS;GACT,iCAAiC,CAAC;GAClC,aAAa;GACb,cAAc;
|
|
1
|
+
{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../src/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { Divider } from 'antd';\nimport { cx } from 'antd-style';\nimport { LayoutGroup } from 'motion/react';\nimport { type Key } from 'react';\nimport { Children, Fragment, isValidElement, memo, useCallback, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { AccordionConfigContext, AccordionItemStateProvider } from './context';\nimport { styles } from './style';\nimport { type AccordionProps } from './type';\n\nconst Accordion = memo<AccordionProps>(\n ({\n children,\n className: userClassName,\n style: userStyle,\n accordion = false,\n defaultExpandedKeys,\n expandedKeys: expandedKeysProp,\n onExpandedChange,\n variant = 'borderless',\n gap,\n showDivider = false,\n disableAnimation = false,\n hideIndicator = false,\n indicatorPlacement = 'start',\n keepContentMounted = true,\n classNames,\n styles: customStyles,\n motionProps,\n ref,\n ...rest\n }) => {\n // Convert children to array and filter valid elements\n const validChildren = Children.toArray(children).filter(isValidElement);\n\n // Collect all item keys\n const allItemKeys = validChildren.map((child, index) => (child.props as any).itemKey || index);\n\n // If defaultExpandedKeys or expandedKeys is undefined, expand all items by default\n const initialExpandedKeys = defaultExpandedKeys ?? allItemKeys;\n\n const [expandedKeys, setExpandedKeys] = useMergeState<Key[]>(initialExpandedKeys, {\n onChange: onExpandedChange,\n value: expandedKeysProp,\n });\n\n // Hold expandedKeys and setExpandedKeys via refs so toggleExpand can stay\n // reference-stable. use-merge-value's setter is recreated on every render,\n // so depending on it would force AccordionItemStateProvider's memoized\n // value to change identity each render — even when nothing toggled —\n // re-rendering every nested AccordionItem via \"context changed\".\n const expandedKeysRef = useRef(expandedKeys);\n expandedKeysRef.current = expandedKeys;\n const setExpandedKeysRef = useRef(setExpandedKeys);\n setExpandedKeysRef.current = setExpandedKeys;\n\n const isOpenKey = useCallback((key: Key) => expandedKeysRef.current.includes(key), []);\n\n const toggleExpand = useCallback(\n (key: Key) => {\n const prev = expandedKeysRef.current;\n let newKeys: Key[];\n\n if (accordion) {\n newKeys = prev.includes(key) ? [] : [key];\n } else {\n newKeys = prev.includes(key) ? prev.filter((k: Key) => k !== key) : [...prev, key];\n }\n\n setExpandedKeysRef.current(newKeys);\n },\n [accordion],\n );\n\n const toggleExpandKeys = useCallback(\n (keys: Key[], preferredKey: Key) => {\n const prev = expandedKeysRef.current;\n const isOpen = keys.some((key) => prev.includes(key));\n let newKeys: Key[];\n\n if (accordion) {\n newKeys = isOpen ? [] : [preferredKey];\n } else {\n newKeys = isOpen\n ? prev.filter((key: Key) => !keys.includes(key))\n : [...prev, preferredKey];\n }\n\n setExpandedKeysRef.current(newKeys);\n },\n [accordion],\n );\n\n const configValue = useMemo(\n () => ({\n disableAnimation,\n hideIndicator,\n indicatorPlacement,\n keepContentMounted,\n motionProps,\n showDivider,\n variant,\n }),\n [\n disableAnimation,\n hideIndicator,\n indicatorPlacement,\n keepContentMounted,\n motionProps,\n showDivider,\n variant,\n ],\n );\n\n const hasExplicitExpandedKeys =\n expandedKeysProp !== undefined || defaultExpandedKeys !== undefined;\n\n const content = (\n <>\n {validChildren.map((child, index) => {\n const hasChildItemKey = (child.props as any).itemKey !== undefined;\n const childKey = hasChildItemKey ? (child.props as any).itemKey : index;\n const itemIsOpen = expandedKeys.includes(childKey);\n return (\n <Fragment key={childKey}>\n <AccordionItemStateProvider\n expandedKeys={hasChildItemKey ? undefined : expandedKeys}\n isOpen={itemIsOpen}\n isOpenKey={isOpenKey}\n itemKey={childKey}\n preferProviderKeyForNestedItems={!hasExplicitExpandedKeys}\n onToggleKey={toggleExpand}\n onToggleKeys={toggleExpandKeys}\n >\n {child}\n </AccordionItemStateProvider>\n {showDivider && index < validChildren.length - 1 && (\n <Divider className={styles.divider} />\n )}\n </Fragment>\n );\n })}\n </>\n );\n\n return (\n <AccordionConfigContext value={configValue}>\n <div\n className={cx(styles.base, classNames?.base, userClassName)}\n ref={ref}\n style={{\n gap,\n ...customStyles?.base,\n ...userStyle,\n }}\n {...rest}\n >\n {disableAnimation ? content : <LayoutGroup>{content}</LayoutGroup>}\n </div>\n </AccordionConfigContext>\n );\n },\n);\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY,MACf,EACC,UACA,WAAW,eACX,OAAO,WACP,YAAY,OACZ,qBACA,cAAc,kBACd,kBACA,UAAU,cACV,KACA,cAAc,OACd,mBAAmB,OACnB,gBAAgB,OAChB,qBAAqB,SACrB,qBAAqB,MACrB,YACA,QAAQ,cACR,aACA,KACA,GAAG,WACC;CAEJ,MAAM,gBAAgB,SAAS,QAAQ,QAAQ,CAAC,CAAC,OAAO,cAAc;CAGtE,MAAM,cAAc,cAAc,KAAK,OAAO,UAAW,MAAM,MAAc,WAAW,KAAK;CAK7F,MAAM,CAAC,cAAc,mBAAmB,cAFZ,uBAAuB,aAE+B;EAChF,UAAU;EACV,OAAO;CACT,CAAC;CAOD,MAAM,kBAAkB,OAAO,YAAY;CAC3C,gBAAgB,UAAU;CAC1B,MAAM,qBAAqB,OAAO,eAAe;CACjD,mBAAmB,UAAU;CAE7B,MAAM,YAAY,aAAa,QAAa,gBAAgB,QAAQ,SAAS,GAAG,GAAG,CAAC,CAAC;CAErF,MAAM,eAAe,aAClB,QAAa;EACZ,MAAM,OAAO,gBAAgB;EAC7B,IAAI;EAEJ,IAAI,WACF,UAAU,KAAK,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG;OAExC,UAAU,KAAK,SAAS,GAAG,IAAI,KAAK,QAAQ,MAAW,MAAM,GAAG,IAAI,CAAC,GAAG,MAAM,GAAG;EAGnF,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,mBAAmB,aACtB,MAAa,iBAAsB;EAClC,MAAM,OAAO,gBAAgB;EAC7B,MAAM,SAAS,KAAK,MAAM,QAAQ,KAAK,SAAS,GAAG,CAAC;EACpD,IAAI;EAEJ,IAAI,WACF,UAAU,SAAS,CAAC,IAAI,CAAC,YAAY;OAErC,UAAU,SACN,KAAK,QAAQ,QAAa,CAAC,KAAK,SAAS,GAAG,CAAC,IAC7C,CAAC,GAAG,MAAM,YAAY;EAG5B,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,eACX;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,MAAM,0BACJ,qBAAqB,KAAA,KAAa,wBAAwB,KAAA;CAE5D,MAAM,UACJ,oBAAA,YAAA,EAAA,UACG,cAAc,KAAK,OAAO,UAAU;EACnC,MAAM,kBAAmB,MAAM,MAAc,YAAY,KAAA;EACzD,MAAM,WAAW,kBAAmB,MAAM,MAAc,UAAU;EAClE,MAAM,aAAa,aAAa,SAAS,QAAQ;EACjD,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,4BAAD;GACE,cAAc,kBAAkB,KAAA,IAAY;GAC5C,QAAQ;GACG;GACX,SAAS;GACT,iCAAiC,CAAC;GAClC,aAAa;GACb,cAAc;GAEb,UAAA;EACyB,CAAA,GAC3B,eAAe,QAAQ,cAAc,SAAS,KAC7C,oBAAC,SAAD,EAAS,WAAW,OAAO,QAAU,CAAA,CAE/B,EAAA,GAfK,QAeL;CAEd,CAAC,EACD,CAAA;CAGJ,OACE,oBAAC,wBAAD;EAAwB,OAAO;EAC7B,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,MAAM,YAAY,MAAM,aAAa;GACrD;GACL,OAAO;IACL;IACA,GAAG,cAAc;IACjB,GAAG;GACL;GACA,GAAI;GAEH,UAAA,mBAAmB,UAAU,oBAAC,aAAD,EAAA,UAAc,QAAqB,CAAA;EAC9D,CAAA;CACiB,CAAA;AAE5B,CACF;AAEA,UAAU,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionItem.mjs","names":["Flexbox"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AnimatePresence } from 'motion/react';\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type KeyboardEvent,\n memo,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n} 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';\nimport { stopPropagation } from '@/utils/dom';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionConfig, useAccordionItemState } from './context';\nimport { styles } 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 alwaysShowAction = false,\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 // Per-item state context: only this item's provider re-emits when its\n // own isOpen flips, so siblings stay stable across toggles.\n const itemStateContext = useAccordionItemState();\n const configContext = useAccordionConfig();\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 const contextHideIndicator = configContext?.hideIndicator;\n const contextIndicatorPlacement = configContext?.indicatorPlacement;\n const contextKeepContentMounted = configContext?.keepContentMounted;\n const contextDisableAnimation = configContext?.disableAnimation;\n const contextMotionProps = configContext?.motionProps;\n const contextVariant = configContext?.variant ?? 'borderless';\n\n const isInitialRenderRef = useRef(true);\n\n useEffect(() => {\n isInitialRenderRef.current = false;\n }, []);\n\n const isDirectContextItem = itemStateContext?.itemKey === itemKey;\n\n // Determine expanded state\n let isOpen = false;\n if (isStandalone) {\n isOpen = isExpandedStandalone;\n } else if (itemStateContext) {\n isOpen = isDirectContextItem\n ? itemStateContext.isOpen\n : itemStateContext.isOpen || itemStateContext.isOpenKey(itemKey);\n }\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 contextOnToggle = useCallback(() => {\n if (!itemStateContext) return;\n if (itemStateContext.itemKey === itemKey) {\n itemStateContext.onToggle();\n return;\n }\n itemStateContext.onToggleNestedKey(itemKey);\n }, [itemStateContext, itemKey]);\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();\n }\n }\n }, [\n allowExpand,\n disabled,\n isStandalone,\n setIsExpandedStandalone,\n isExpandedStandalone,\n contextOnToggle,\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 const preventTitleTextSelection = useCallback((e: any) => {\n // Prevent browser from creating a selection range on double/multi click,\n // which can accidentally select the content region.\n if (e?.detail > 1) e.preventDefault();\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 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 [classNames?.content],\n );\n\n const titleNode = useMemo(\n () =>\n typeof title === 'string' ? (\n <Text ellipsis className={classNames?.title} 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 horizontal\n align={'center'}\n flex={'none'}\n gap={4}\n style={customStyles?.action}\n className={cx(\n 'accordion-action',\n styles.action,\n alwaysShowAction && styles.actionVisible,\n classNames?.action,\n )}\n onClick={stopPropagation}\n >\n {action}\n </Flexbox>\n ),\n [action, alwaysShowAction, classNames?.action, customStyles?.action],\n );\n\n const headerElement = useMemo(() => {\n const header = (\n <Block\n horizontal\n className={cx('accordion-header', styles.header, classNames?.header)}\n clickable={!disabled && allowExpand}\n gap={4}\n justify={'space-between'}\n padding={padding}\n paddingBlock={paddingBlock}\n paddingInline={paddingInline}\n ref={ref}\n variant={customVariant || variant}\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 onClick={handleToggle}\n onKeyDown={handleKeyDown}\n >\n {indicatorPlacementFinal === 'start' ? (\n <>\n <Flexbox\n horizontal\n align={'center'}\n className={styles.titleWrapper}\n flex={1}\n gap={2}\n style={{\n overflow: 'hidden',\n }}\n onDoubleClick={preventTitleTextSelection}\n onMouseDown={preventTitleTextSelection}\n >\n {titleNode}\n {indicator}\n </Flexbox>\n <Flexbox horizontal align={'center'} flex={'none'} gap={4}>\n {actionNode}\n </Flexbox>\n </>\n ) : (\n <>\n <Flexbox\n horizontal\n align={'center'}\n className={styles.titleWrapper}\n flex={1}\n gap={2}\n style={{\n overflow: 'hidden',\n }}\n onDoubleClick={preventTitleTextSelection}\n onMouseDown={preventTitleTextSelection}\n >\n {titleNode}\n </Flexbox>\n <Flexbox horizontal align={'center'} flex={'none'} gap={4}>\n {actionNode}\n {indicator}\n </Flexbox>\n </>\n )}\n </Block>\n );\n if (headerWrapper) {\n return headerWrapper(header);\n }\n return header;\n }, [\n classNames?.header,\n disabled,\n allowExpand,\n padding,\n paddingBlock,\n paddingInline,\n ref,\n customVariant,\n variant,\n customStyles?.header,\n handleToggle,\n handleKeyDown,\n indicatorPlacementFinal,\n preventTitleTextSelection,\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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"}
|
|
1
|
+
{"version":3,"file":"AccordionItem.mjs","names":["Flexbox"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AnimatePresence } from 'motion/react';\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type KeyboardEvent,\n memo,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n} 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';\nimport { stopPropagation } from '@/utils/dom';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionConfig, useAccordionItemState } from './context';\nimport { styles } 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 alwaysShowAction = false,\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 // Per-item state context: only this item's provider re-emits when its\n // own isOpen flips, so siblings stay stable across toggles.\n const itemStateContext = useAccordionItemState();\n const configContext = useAccordionConfig();\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 const contextHideIndicator = configContext?.hideIndicator;\n const contextIndicatorPlacement = configContext?.indicatorPlacement;\n const contextKeepContentMounted = configContext?.keepContentMounted;\n const contextDisableAnimation = configContext?.disableAnimation;\n const contextMotionProps = configContext?.motionProps;\n const contextVariant = configContext?.variant ?? 'borderless';\n\n const isInitialRenderRef = useRef(true);\n\n useEffect(() => {\n isInitialRenderRef.current = false;\n }, []);\n\n const isDirectContextItem = itemStateContext?.itemKey === itemKey;\n\n // Determine expanded state\n let isOpen = false;\n if (isStandalone) {\n isOpen = isExpandedStandalone;\n } else if (itemStateContext) {\n isOpen = isDirectContextItem\n ? itemStateContext.isOpen\n : itemStateContext.isOpen || itemStateContext.isOpenKey(itemKey);\n }\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 contextOnToggle = useCallback(() => {\n if (!itemStateContext) return;\n if (itemStateContext.itemKey === itemKey) {\n itemStateContext.onToggle();\n return;\n }\n itemStateContext.onToggleNestedKey(itemKey);\n }, [itemStateContext, itemKey]);\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();\n }\n }\n }, [\n allowExpand,\n disabled,\n isStandalone,\n setIsExpandedStandalone,\n isExpandedStandalone,\n contextOnToggle,\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 const preventTitleTextSelection = useCallback((e: any) => {\n // Prevent browser from creating a selection range on double/multi click,\n // which can accidentally select the content region.\n if (e?.detail > 1) e.preventDefault();\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 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 [classNames?.content],\n );\n\n const titleNode = useMemo(\n () =>\n typeof title === 'string' ? (\n <Text ellipsis className={classNames?.title} 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 horizontal\n align={'center'}\n flex={'none'}\n gap={4}\n style={customStyles?.action}\n className={cx(\n 'accordion-action',\n styles.action,\n alwaysShowAction && styles.actionVisible,\n classNames?.action,\n )}\n onClick={stopPropagation}\n >\n {action}\n </Flexbox>\n ),\n [action, alwaysShowAction, classNames?.action, customStyles?.action],\n );\n\n const headerElement = useMemo(() => {\n const header = (\n <Block\n horizontal\n className={cx('accordion-header', styles.header, classNames?.header)}\n clickable={!disabled && allowExpand}\n gap={4}\n justify={'space-between'}\n padding={padding}\n paddingBlock={paddingBlock}\n paddingInline={paddingInline}\n ref={ref}\n variant={customVariant || variant}\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 onClick={handleToggle}\n onKeyDown={handleKeyDown}\n >\n {indicatorPlacementFinal === 'start' ? (\n <>\n <Flexbox\n horizontal\n align={'center'}\n className={styles.titleWrapper}\n flex={1}\n gap={2}\n style={{\n overflow: 'hidden',\n }}\n onDoubleClick={preventTitleTextSelection}\n onMouseDown={preventTitleTextSelection}\n >\n {titleNode}\n {indicator}\n </Flexbox>\n <Flexbox horizontal align={'center'} flex={'none'} gap={4}>\n {actionNode}\n </Flexbox>\n </>\n ) : (\n <>\n <Flexbox\n horizontal\n align={'center'}\n className={styles.titleWrapper}\n flex={1}\n gap={2}\n style={{\n overflow: 'hidden',\n }}\n onDoubleClick={preventTitleTextSelection}\n onMouseDown={preventTitleTextSelection}\n >\n {titleNode}\n </Flexbox>\n <Flexbox horizontal align={'center'} flex={'none'} gap={4}>\n {actionNode}\n {indicator}\n </Flexbox>\n </>\n )}\n </Block>\n );\n if (headerWrapper) {\n return headerWrapper(header);\n }\n return header;\n }, [\n classNames?.header,\n disabled,\n allowExpand,\n padding,\n paddingBlock,\n paddingInline,\n ref,\n customVariant,\n variant,\n customStyles?.header,\n handleToggle,\n handleKeyDown,\n indicatorPlacementFinal,\n preventTitleTextSelection,\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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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ArrowIcon.mjs","names":[],"sources":["../../src/Accordion/ArrowIcon.tsx"],"sourcesContent":["'use client';\n\nimport type { IconType } from '@lobehub/icons';\nimport { memo } from 'react';\n\nconst ArrowIcon: IconType = memo(({ size = '1em', style, ...rest }) => {\n return (\n <svg\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n height={size}\n style={{ flex: 'none', lineHeight: 1, ...style }}\n viewBox=\"0 0 16 16\"\n width={size}\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n <path d=\"M7.002 10.624a.5.5 0 01-.752-.432V5.808a.5.5 0 01.752-.432l3.758 2.192a.5.5 0 010 .864l-3.758 2.192z\" />\n </svg>\n );\n});\n\nexport default ArrowIcon;\n"],"mappings":";;;;AAKA,MAAM,YAAsB,MAAM,EAAE,OAAO,OAAO,OAAO,GAAG,WAAW;CACrE,OACE,oBAAC,OAAD;EACE,MAAK;EACL,UAAS;EACT,QAAQ;EACR,OAAO;GAAE,MAAM;GAAQ,YAAY;GAAG,GAAG;EAAM;EAC/C,SAAQ;EACR,OAAO;EACP,OAAM;EACN,GAAI;
|
|
1
|
+
{"version":3,"file":"ArrowIcon.mjs","names":[],"sources":["../../src/Accordion/ArrowIcon.tsx"],"sourcesContent":["'use client';\n\nimport type { IconType } from '@lobehub/icons';\nimport { memo } from 'react';\n\nconst ArrowIcon: IconType = memo(({ size = '1em', style, ...rest }) => {\n return (\n <svg\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n height={size}\n style={{ flex: 'none', lineHeight: 1, ...style }}\n viewBox=\"0 0 16 16\"\n width={size}\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n <path d=\"M7.002 10.624a.5.5 0 01-.752-.432V5.808a.5.5 0 01.752-.432l3.758 2.192a.5.5 0 010 .864l-3.758 2.192z\" />\n </svg>\n );\n});\n\nexport default ArrowIcon;\n"],"mappings":";;;;AAKA,MAAM,YAAsB,MAAM,EAAE,OAAO,OAAO,OAAO,GAAG,WAAW;CACrE,OACE,oBAAC,OAAD;EACE,MAAK;EACL,UAAS;EACT,QAAQ;EACR,OAAO;GAAE,MAAM;GAAQ,YAAY;GAAG,GAAG;EAAM;EAC/C,SAAQ;EACR,OAAO;EACP,OAAM;EACN,GAAI;EAEJ,UAAA,oBAAC,QAAD,EAAM,GAAE,uGAAwG,CAAA;CAC7G,CAAA;AAET,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../src/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Loader2 } from 'lucide-react';\nimport { memo, type MouseEventHandler, useCallback, useMemo } from 'react';\n\nimport { Center } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\n\nimport { calcSize } from './components/utils';\nimport { variants } from './style';\nimport { type ActionIconProps } from './type';\n\nconst ActionIcon = memo<ActionIconProps>(\n ({\n color,\n fill,\n className,\n active,\n icon,\n size = 'middle',\n variant = 'borderless',\n style,\n glass,\n title,\n onClick,\n loading,\n fillOpacity,\n fillRule,\n focusable,\n shadow,\n disabled,\n spin: iconSpinning,\n tooltipProps,\n danger,\n ref,\n ...rest\n }) => {\n const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);\n const popupTriggerAria = rest as {\n 'aria-expanded'?: unknown;\n 'aria-haspopup'?: unknown;\n 'aria-label'?: string;\n };\n const isPopupTrigger =\n popupTriggerAria['aria-haspopup'] !== undefined ||\n popupTriggerAria['aria-expanded'] !== undefined;\n const popupTriggerLabel =\n popupTriggerAria['aria-label'] ??\n (isPopupTrigger && typeof title === 'string' ? title : undefined);\n\n const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n if (loading || disabled) return;\n onClick?.(event);\n },\n [loading, disabled, onClick],\n );\n\n const node = (\n <Center\n horizontal\n className={cx(variants({ active, danger, disabled, glass, shadow, variant }), className)}\n flex={'none'}\n ref={ref}\n role=\"button\"\n style={{ borderRadius, height: blockSize, width: blockSize, ...style }}\n tabIndex={disabled ? -1 : 0}\n onClick={handleClick}\n {...rest}\n aria-label={popupTriggerLabel}\n >\n {icon && (\n <Icon\n color={color}\n fill={fill}\n fillOpacity={fillOpacity}\n fillRule={fillRule}\n focusable={focusable}\n icon={loading ? Loader2 : icon}\n size={size}\n spin={loading ? true : iconSpinning}\n style={{\n pointerEvents: 'none',\n }}\n />\n )}\n </Center>\n );\n\n if (!title) return node;\n\n return (\n <Tooltip\n title={title}\n {...tooltipProps}\n styles={\n typeof tooltipProps?.styles === 'function'\n ? tooltipProps.styles\n : {\n ...tooltipProps?.styles,\n container: { pointerEvents: 'none', ...tooltipProps?.styles?.container },\n }\n }\n >\n {node}\n </Tooltip>\n );\n },\n);\n\nActionIcon.displayName = 'ActionIcon';\n\nexport default ActionIcon;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,aAAa,MAChB,EACC,OACA,MACA,WACA,QACA,MACA,OAAO,UACP,UAAU,cACV,OACA,OACA,OACA,SACA,SACA,aACA,UACA,WACA,QACA,UACA,MAAM,cACN,cACA,QACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,iBAAiB,cAAc,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;CACxE,MAAM,mBAAmB;CAKzB,MAAM,iBACJ,iBAAiB,qBAAqB,KAAA,KACtC,iBAAiB,qBAAqB,KAAA;CACxC,MAAM,oBACJ,iBAAiB,kBAChB,kBAAkB,OAAO,UAAU,WAAW,QAAQ,KAAA;CAEzD,MAAM,cAAc,aACjB,UAAU;EACT,IAAI,WAAW,UAAU;EACzB,UAAU,KAAK;CACjB,GACA;EAAC;EAAS;EAAU;CAAO,CAC7B;CAEA,MAAM,OACJ,oBAAC,QAAD;EACE,YAAA;EACA,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAQ;GAAU;GAAO;GAAQ;EAAQ,CAAC,GAAG,SAAS;EACvF,MAAM;EACD;EACL,MAAK;EACL,OAAO;GAAE;GAAc,QAAQ;GAAW,OAAO;GAAW,GAAG;EAAM;EACrE,UAAU,WAAW,KAAK;EAC1B,SAAS;EACT,GAAI;EACJ,cAAY;
|
|
1
|
+
{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../src/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Loader2 } from 'lucide-react';\nimport { memo, type MouseEventHandler, useCallback, useMemo } from 'react';\n\nimport { Center } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\n\nimport { calcSize } from './components/utils';\nimport { variants } from './style';\nimport { type ActionIconProps } from './type';\n\nconst ActionIcon = memo<ActionIconProps>(\n ({\n color,\n fill,\n className,\n active,\n icon,\n size = 'middle',\n variant = 'borderless',\n style,\n glass,\n title,\n onClick,\n loading,\n fillOpacity,\n fillRule,\n focusable,\n shadow,\n disabled,\n spin: iconSpinning,\n tooltipProps,\n danger,\n ref,\n ...rest\n }) => {\n const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);\n const popupTriggerAria = rest as {\n 'aria-expanded'?: unknown;\n 'aria-haspopup'?: unknown;\n 'aria-label'?: string;\n };\n const isPopupTrigger =\n popupTriggerAria['aria-haspopup'] !== undefined ||\n popupTriggerAria['aria-expanded'] !== undefined;\n const popupTriggerLabel =\n popupTriggerAria['aria-label'] ??\n (isPopupTrigger && typeof title === 'string' ? title : undefined);\n\n const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n if (loading || disabled) return;\n onClick?.(event);\n },\n [loading, disabled, onClick],\n );\n\n const node = (\n <Center\n horizontal\n className={cx(variants({ active, danger, disabled, glass, shadow, variant }), className)}\n flex={'none'}\n ref={ref}\n role=\"button\"\n style={{ borderRadius, height: blockSize, width: blockSize, ...style }}\n tabIndex={disabled ? -1 : 0}\n onClick={handleClick}\n {...rest}\n aria-label={popupTriggerLabel}\n >\n {icon && (\n <Icon\n color={color}\n fill={fill}\n fillOpacity={fillOpacity}\n fillRule={fillRule}\n focusable={focusable}\n icon={loading ? Loader2 : icon}\n size={size}\n spin={loading ? true : iconSpinning}\n style={{\n pointerEvents: 'none',\n }}\n />\n )}\n </Center>\n );\n\n if (!title) return node;\n\n return (\n <Tooltip\n title={title}\n {...tooltipProps}\n styles={\n typeof tooltipProps?.styles === 'function'\n ? tooltipProps.styles\n : {\n ...tooltipProps?.styles,\n container: { pointerEvents: 'none', ...tooltipProps?.styles?.container },\n }\n }\n >\n {node}\n </Tooltip>\n );\n },\n);\n\nActionIcon.displayName = 'ActionIcon';\n\nexport default ActionIcon;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,aAAa,MAChB,EACC,OACA,MACA,WACA,QACA,MACA,OAAO,UACP,UAAU,cACV,OACA,OACA,OACA,SACA,SACA,aACA,UACA,WACA,QACA,UACA,MAAM,cACN,cACA,QACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,iBAAiB,cAAc,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;CACxE,MAAM,mBAAmB;CAKzB,MAAM,iBACJ,iBAAiB,qBAAqB,KAAA,KACtC,iBAAiB,qBAAqB,KAAA;CACxC,MAAM,oBACJ,iBAAiB,kBAChB,kBAAkB,OAAO,UAAU,WAAW,QAAQ,KAAA;CAEzD,MAAM,cAAc,aACjB,UAAU;EACT,IAAI,WAAW,UAAU;EACzB,UAAU,KAAK;CACjB,GACA;EAAC;EAAS;EAAU;CAAO,CAC7B;CAEA,MAAM,OACJ,oBAAC,QAAD;EACE,YAAA;EACA,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAQ;GAAU;GAAO;GAAQ;EAAQ,CAAC,GAAG,SAAS;EACvF,MAAM;EACD;EACL,MAAK;EACL,OAAO;GAAE;GAAc,QAAQ;GAAW,OAAO;GAAW,GAAG;EAAM;EACrE,UAAU,WAAW,KAAK;EAC1B,SAAS;EACT,GAAI;EACJ,cAAY;EAEX,UAAA,QACC,oBAAC,MAAD;GACS;GACD;GACO;GACH;GACC;GACX,MAAM,UAAU,UAAU;GACpB;GACN,MAAM,UAAU,OAAO;GACvB,OAAO,EACL,eAAe,OACjB;EACD,CAAA;CAEG,CAAA;CAGV,IAAI,CAAC,OAAO,OAAO;CAEnB,OACE,oBAAC,SAAD;EACS;EACP,GAAI;EACJ,QACE,OAAO,cAAc,WAAW,aAC5B,aAAa,SACb;GACE,GAAG,cAAc;GACjB,WAAW;IAAE,eAAe;IAAQ,GAAG,cAAc,QAAQ;GAAU;EACzE;EAGL,UAAA;CACM,CAAA;AAEb,CACF;AAEA,WAAW,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIconGroup.mjs","names":[],"sources":["../../src/ActionIconGroup/ActionIconGroup.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { MoreHorizontal } from 'lucide-react';\nimport { type FC, useMemo } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport DropdownMenu from '@/DropdownMenu';\nimport { Center } from '@/Flex';\nimport { TooltipGroup } from '@/Tooltip';\n\nimport { variants } from './style';\nimport type { ActionIconGroupProps } from './type';\n\nconst ActionIconGroup: FC<ActionIconGroupProps> = ({\n variant = 'filled',\n disabled,\n shadow,\n glass,\n actionIconProps,\n items = [],\n horizontal = true,\n menu,\n onActionClick,\n className,\n size = 'small',\n ref,\n ...rest\n}) => {\n const tooltipPlacement = useMemo(\n () => (actionIconProps?.tooltipProps?.placement || horizontal ? 'top' : 'right'),\n [actionIconProps, horizontal],\n );\n\n const menuItems = useMemo(() => {\n const rawItems = typeof menu === 'function' ? menu() : menu;\n if (!rawItems) return [];\n return rawItems.map((item) => ({\n ...(item as any),\n onClick: (info: any) => {\n (item as any)?.onClick?.(info);\n onActionClick?.(info);\n },\n }));\n }, [menu, onActionClick]);\n\n return (\n <TooltipGroup>\n <Center\n className={cx(variants({ disabled, glass, shadow, variant }), className)}\n horizontal={horizontal}\n padding={2}\n ref={ref}\n {...rest}\n >\n {items?.length > 0 &&\n items.map((item) => {\n const { icon, key, label, onClick, danger, loading, ...itemRest } = item;\n return (\n <ActionIcon\n danger={danger}\n icon={icon}\n key={key}\n loading={loading}\n size={size}\n title={label}\n tooltipProps={{\n placement: tooltipPlacement,\n }}\n onClick={(e) => {\n onActionClick?.({\n domEvent: e,\n key: String(key),\n keyPath: [String(key)],\n });\n onClick?.(e as any);\n }}\n {...actionIconProps}\n disabled={disabled || loading || itemRest?.disabled}\n />\n );\n })}\n {menu && (\n <DropdownMenu items={menuItems} nativeButton={false}>\n <ActionIcon\n disabled={disabled}\n icon={MoreHorizontal}\n key=\"more\"\n size={size}\n {...actionIconProps}\n tooltipProps={{\n placement: tooltipPlacement,\n ...actionIconProps?.tooltipProps,\n }}\n />\n </DropdownMenu>\n )}\n </Center>\n </TooltipGroup>\n );\n};\n\nActionIconGroup.displayName = 'ActionIconGroup';\n\nexport default ActionIconGroup;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,mBAA6C,EACjD,UAAU,UACV,UACA,QACA,OACA,iBACA,QAAQ,CAAC,GACT,aAAa,MACb,MACA,eACA,WACA,OAAO,SACP,KACA,GAAG,WACC;CACJ,MAAM,mBAAmB,cAChB,iBAAiB,cAAc,aAAa,aAAa,QAAQ,SACxE,CAAC,iBAAiB,UAAU,CAC9B;CAEA,MAAM,YAAY,cAAc;EAC9B,MAAM,WAAW,OAAO,SAAS,aAAa,KAAK,IAAI;EACvD,IAAI,CAAC,UAAU,OAAO,CAAC;EACvB,OAAO,SAAS,KAAK,UAAU;GAC7B,GAAI;GACJ,UAAU,SAAc;IACtB,MAAe,UAAU,IAAI;IAC7B,gBAAgB,IAAI;GACtB;EACF,EAAE;CACJ,GAAG,CAAC,MAAM,aAAa,CAAC;CAExB,OACE,oBAAC,cAAD,EAAA,UACE,qBAAC,QAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAU;GAAO;GAAQ;EAAQ,CAAC,GAAG,SAAS;EAC3D;EACZ,SAAS;EACJ;EACL,GAAI;
|
|
1
|
+
{"version":3,"file":"ActionIconGroup.mjs","names":[],"sources":["../../src/ActionIconGroup/ActionIconGroup.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { MoreHorizontal } from 'lucide-react';\nimport { type FC, useMemo } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport DropdownMenu from '@/DropdownMenu';\nimport { Center } from '@/Flex';\nimport { TooltipGroup } from '@/Tooltip';\n\nimport { variants } from './style';\nimport type { ActionIconGroupProps } from './type';\n\nconst ActionIconGroup: FC<ActionIconGroupProps> = ({\n variant = 'filled',\n disabled,\n shadow,\n glass,\n actionIconProps,\n items = [],\n horizontal = true,\n menu,\n onActionClick,\n className,\n size = 'small',\n ref,\n ...rest\n}) => {\n const tooltipPlacement = useMemo(\n () => (actionIconProps?.tooltipProps?.placement || horizontal ? 'top' : 'right'),\n [actionIconProps, horizontal],\n );\n\n const menuItems = useMemo(() => {\n const rawItems = typeof menu === 'function' ? menu() : menu;\n if (!rawItems) return [];\n return rawItems.map((item) => ({\n ...(item as any),\n onClick: (info: any) => {\n (item as any)?.onClick?.(info);\n onActionClick?.(info);\n },\n }));\n }, [menu, onActionClick]);\n\n return (\n <TooltipGroup>\n <Center\n className={cx(variants({ disabled, glass, shadow, variant }), className)}\n horizontal={horizontal}\n padding={2}\n ref={ref}\n {...rest}\n >\n {items?.length > 0 &&\n items.map((item) => {\n const { icon, key, label, onClick, danger, loading, ...itemRest } = item;\n return (\n <ActionIcon\n danger={danger}\n icon={icon}\n key={key}\n loading={loading}\n size={size}\n title={label}\n tooltipProps={{\n placement: tooltipPlacement,\n }}\n onClick={(e) => {\n onActionClick?.({\n domEvent: e,\n key: String(key),\n keyPath: [String(key)],\n });\n onClick?.(e as any);\n }}\n {...actionIconProps}\n disabled={disabled || loading || itemRest?.disabled}\n />\n );\n })}\n {menu && (\n <DropdownMenu items={menuItems} nativeButton={false}>\n <ActionIcon\n disabled={disabled}\n icon={MoreHorizontal}\n key=\"more\"\n size={size}\n {...actionIconProps}\n tooltipProps={{\n placement: tooltipPlacement,\n ...actionIconProps?.tooltipProps,\n }}\n />\n </DropdownMenu>\n )}\n </Center>\n </TooltipGroup>\n );\n};\n\nActionIconGroup.displayName = 'ActionIconGroup';\n\nexport default ActionIconGroup;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,mBAA6C,EACjD,UAAU,UACV,UACA,QACA,OACA,iBACA,QAAQ,CAAC,GACT,aAAa,MACb,MACA,eACA,WACA,OAAO,SACP,KACA,GAAG,WACC;CACJ,MAAM,mBAAmB,cAChB,iBAAiB,cAAc,aAAa,aAAa,QAAQ,SACxE,CAAC,iBAAiB,UAAU,CAC9B;CAEA,MAAM,YAAY,cAAc;EAC9B,MAAM,WAAW,OAAO,SAAS,aAAa,KAAK,IAAI;EACvD,IAAI,CAAC,UAAU,OAAO,CAAC;EACvB,OAAO,SAAS,KAAK,UAAU;GAC7B,GAAI;GACJ,UAAU,SAAc;IACtB,MAAe,UAAU,IAAI;IAC7B,gBAAgB,IAAI;GACtB;EACF,EAAE;CACJ,GAAG,CAAC,MAAM,aAAa,CAAC;CAExB,OACE,oBAAC,cAAD,EAAA,UACE,qBAAC,QAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAU;GAAO;GAAQ;EAAQ,CAAC,GAAG,SAAS;EAC3D;EACZ,SAAS;EACJ;EACL,GAAI;EALN,UAAA,CAOG,OAAO,SAAS,KACf,MAAM,KAAK,SAAS;GAClB,MAAM,EAAE,MAAM,KAAK,OAAO,SAAS,QAAQ,SAAS,GAAG,aAAa;GACpE,OACE,oBAAC,YAAD;IACU;IACF;IAEG;IACH;IACN,OAAO;IACP,cAAc,EACZ,WAAW,iBACb;IACA,UAAU,MAAM;KACd,gBAAgB;MACd,UAAU;MACV,KAAK,OAAO,GAAG;MACf,SAAS,CAAC,OAAO,GAAG,CAAC;KACvB,CAAC;KACD,UAAU,CAAQ;IACpB;IACA,GAAI;IACJ,UAAU,YAAY,WAAW,UAAU;GAC5C,GAjBM,GAiBN;EAEL,CAAC,GACF,QACC,oBAAC,cAAD;GAAc,OAAO;GAAW,cAAc;GAC5C,UAAA,oBAAC,YAAD;IACY;IACV,MAAM;IAEA;IACN,GAAI;IACJ,cAAc;KACZ,WAAW;KACX,GAAG,iBAAiB;IACtB;GACD,GAPK,MAOL;EACW,CAAA,CAEV;CACI,CAAA,EAAA,CAAA;AAElB;AAEA,gBAAgB,cAAc"}
|
package/es/Alert/Alert.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.mjs","names":["Alert","AntdAlert","Flexbox"],"sources":["../../src/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport { Alert as AntdAlert } from 'antd';\nimport { cssVar, cx, useTheme } from 'antd-style';\nimport { camelCase } from 'es-toolkit/compat';\nimport { AlertTriangle, CheckCircle, Info, X, XCircle } from 'lucide-react';\nimport { memo } from 'react';\n\nimport { Accordion, AccordionItem } from '@/Accordion';\nimport ActionIcon from '@/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { extraHeaderVariants, extraVariants, rootVariants } from './style';\nimport type { AlertProps } from './type';\n\nconst typeIcons = {\n error: XCircle,\n info: Info,\n secondary: AlertTriangle,\n success: CheckCircle,\n warning: AlertTriangle,\n};\n\nconst colors = (theme: any, type: string = 'info', ...keys: string[]) => {\n if (type === 'secondary') return theme[camelCase(['color', ...keys].join('-'))] as string;\n return theme[camelCase(['color', type, ...keys].join('-'))] as string;\n};\n\nconst Alert = memo<AlertProps>(\n ({\n closable = false,\n description,\n showIcon = true,\n type = 'info',\n glass,\n icon,\n colorfulText = true,\n iconProps,\n style,\n extra,\n classNames,\n styles: customStyles,\n text,\n extraDefaultExpand = false,\n extraIsolate,\n banner,\n variant = 'filled',\n ref,\n ...rest\n }) => {\n const theme = useTheme();\n const hasTitle = !!description;\n const isClosable = !!closable;\n const isShowIcon = !!showIcon;\n\n const isInsideExtra = Boolean(!extraIsolate && !!extra);\n\n const alert = (\n <AntdAlert\n banner={banner}\n description={description}\n ref={ref}\n showIcon={showIcon}\n type={type === 'secondary' ? 'info' : type}\n className={cx(\n rootVariants({\n closable: isClosable,\n colorfulText,\n glass,\n hasExtra: isInsideExtra,\n hasTitle,\n showIcon: isShowIcon,\n variant,\n }),\n classNames?.alert,\n )}\n closable={\n typeof closable === 'boolean'\n ? closable\n : {\n closeIcon: <ActionIcon color={colors(theme, type)} icon={X} size={'small'} />,\n ...closable,\n }\n }\n icon={\n <Icon\n color={type === 'secondary' ? cssVar.colorTextSecondary : undefined}\n icon={icon || typeIcons[type]}\n size={description ? 24 : 18}\n {...iconProps}\n />\n }\n style={{\n background: colors(theme, type, 'fillTertiary'),\n borderColor: colors(theme, type, 'fillSecondary'),\n color: colorfulText ? colors(theme, type) : undefined,\n ...style,\n ...customStyles?.alert,\n }}\n {...rest}\n />\n );\n\n if (!extra) return alert;\n\n if (extraIsolate)\n return (\n <Flexbox className={classNames?.container} gap={8}>\n {alert}\n {extra}\n </Flexbox>\n );\n\n return (\n <Flexbox className={classNames?.container} style={customStyles?.container}>\n {alert}\n <Flexbox\n className={extraVariants({ banner, variant })}\n style={{\n background: colors(theme, type, 'fillTertiary'),\n borderColor: colors(theme, type, 'fillSecondary'),\n color: colors(theme, type),\n fontSize: description ? 14 : 12,\n }}\n >\n <Accordion defaultExpandedKeys={extraDefaultExpand ? ['extra'] : []}>\n <AccordionItem\n itemKey={'extra'}\n title={text?.detail || 'Show Details'}\n classNames={{\n content: classNames?.extraContent,\n header: extraHeaderVariants({ hasTitle, variant }),\n }}\n styles={{\n content: {\n fontSize: 12,\n ...customStyles?.extraContent,\n },\n header: {\n borderColor: colors(theme, type, 'fillSecondary'),\n },\n indicator: {\n color: colors(theme, type),\n },\n title: {\n color: colors(theme, type),\n fontSize: 12,\n },\n }}\n >\n {extra}\n </AccordionItem>\n </Accordion>\n </Flexbox>\n </Flexbox>\n );\n },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAM,YAAY;CAChB,OAAO;CACP,MAAM;CACN,WAAW;CACX,SAAS;CACT,SAAS;AACX;AAEA,MAAM,UAAU,OAAY,OAAe,QAAQ,GAAG,SAAmB;CACvE,IAAI,SAAS,aAAa,OAAO,MAAM,UAAU,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,KAAK,GAAG,CAAC;CAC7E,OAAO,MAAM,UAAU;EAAC;EAAS;EAAM,GAAG;CAAI,CAAC,CAAC,KAAK,GAAG,CAAC;AAC3D;AAEA,MAAMA,UAAQ,MACX,EACC,WAAW,OACX,aACA,WAAW,MACX,OAAO,QACP,OACA,MACA,eAAe,MACf,WACA,OACA,OACA,YACA,QAAQ,cACR,MACA,qBAAqB,OACrB,cACA,QACA,UAAU,UACV,KACA,GAAG,WACC;CACJ,MAAM,QAAQ,SAAS;CACvB,MAAM,WAAW,CAAC,CAAC;CAMnB,MAAM,QACJ,oBAACC,OAAD;EACU;EACK;EACR;EACK;EACV,MAAM,SAAS,cAAc,SAAS;EACtC,WAAW,GACT,aAAa;GACX,UAAU,CAdE,CAAC;GAeb;GACA;GACA,UAdc,QAAQ,CAAC,gBAAgB,CAAC,CAAC,KAcnB;GACtB;GACA,UAAU,CAlBE,CAAC;GAmBb;EACF,CAAC,GACD,YAAY,KACd;EACA,UACE,OAAO,aAAa,YAChB,WACA;GACE,WAAW,oBAAC,YAAD;IAAY,OAAO,OAAO,OAAO,IAAI;IAAG,MAAM;IAAG,MAAM;GAAU,CAAA;GAC5E,GAAG;EACL;EAEN,MACE,oBAAC,MAAD;GACE,OAAO,SAAS,cAAc,OAAO,qBAAqB,KAAA;GAC1D,MAAM,QAAQ,UAAU;GACxB,MAAM,cAAc,KAAK;GACzB,GAAI;EACL,CAAA;EAEH,OAAO;GACL,YAAY,OAAO,OAAO,MAAM,cAAc;GAC9C,aAAa,OAAO,OAAO,MAAM,eAAe;GAChD,OAAO,eAAe,OAAO,OAAO,IAAI,IAAI,KAAA;GAC5C,GAAG;GACH,GAAG,cAAc;EACnB;EACA,GAAI;CACL,CAAA;CAGH,IAAI,CAAC,OAAO,OAAO;CAEnB,IAAI,cACF,OACE,qBAACC,mBAAD;EAAS,WAAW,YAAY;EAAW,KAAK;
|
|
1
|
+
{"version":3,"file":"Alert.mjs","names":["Alert","AntdAlert","Flexbox"],"sources":["../../src/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport { Alert as AntdAlert } from 'antd';\nimport { cssVar, cx, useTheme } from 'antd-style';\nimport { camelCase } from 'es-toolkit/compat';\nimport { AlertTriangle, CheckCircle, Info, X, XCircle } from 'lucide-react';\nimport { memo } from 'react';\n\nimport { Accordion, AccordionItem } from '@/Accordion';\nimport ActionIcon from '@/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { extraHeaderVariants, extraVariants, rootVariants } from './style';\nimport type { AlertProps } from './type';\n\nconst typeIcons = {\n error: XCircle,\n info: Info,\n secondary: AlertTriangle,\n success: CheckCircle,\n warning: AlertTriangle,\n};\n\nconst colors = (theme: any, type: string = 'info', ...keys: string[]) => {\n if (type === 'secondary') return theme[camelCase(['color', ...keys].join('-'))] as string;\n return theme[camelCase(['color', type, ...keys].join('-'))] as string;\n};\n\nconst Alert = memo<AlertProps>(\n ({\n closable = false,\n description,\n showIcon = true,\n type = 'info',\n glass,\n icon,\n colorfulText = true,\n iconProps,\n style,\n extra,\n classNames,\n styles: customStyles,\n text,\n extraDefaultExpand = false,\n extraIsolate,\n banner,\n variant = 'filled',\n ref,\n ...rest\n }) => {\n const theme = useTheme();\n const hasTitle = !!description;\n const isClosable = !!closable;\n const isShowIcon = !!showIcon;\n\n const isInsideExtra = Boolean(!extraIsolate && !!extra);\n\n const alert = (\n <AntdAlert\n banner={banner}\n description={description}\n ref={ref}\n showIcon={showIcon}\n type={type === 'secondary' ? 'info' : type}\n className={cx(\n rootVariants({\n closable: isClosable,\n colorfulText,\n glass,\n hasExtra: isInsideExtra,\n hasTitle,\n showIcon: isShowIcon,\n variant,\n }),\n classNames?.alert,\n )}\n closable={\n typeof closable === 'boolean'\n ? closable\n : {\n closeIcon: <ActionIcon color={colors(theme, type)} icon={X} size={'small'} />,\n ...closable,\n }\n }\n icon={\n <Icon\n color={type === 'secondary' ? cssVar.colorTextSecondary : undefined}\n icon={icon || typeIcons[type]}\n size={description ? 24 : 18}\n {...iconProps}\n />\n }\n style={{\n background: colors(theme, type, 'fillTertiary'),\n borderColor: colors(theme, type, 'fillSecondary'),\n color: colorfulText ? colors(theme, type) : undefined,\n ...style,\n ...customStyles?.alert,\n }}\n {...rest}\n />\n );\n\n if (!extra) return alert;\n\n if (extraIsolate)\n return (\n <Flexbox className={classNames?.container} gap={8}>\n {alert}\n {extra}\n </Flexbox>\n );\n\n return (\n <Flexbox className={classNames?.container} style={customStyles?.container}>\n {alert}\n <Flexbox\n className={extraVariants({ banner, variant })}\n style={{\n background: colors(theme, type, 'fillTertiary'),\n borderColor: colors(theme, type, 'fillSecondary'),\n color: colors(theme, type),\n fontSize: description ? 14 : 12,\n }}\n >\n <Accordion defaultExpandedKeys={extraDefaultExpand ? ['extra'] : []}>\n <AccordionItem\n itemKey={'extra'}\n title={text?.detail || 'Show Details'}\n classNames={{\n content: classNames?.extraContent,\n header: extraHeaderVariants({ hasTitle, variant }),\n }}\n styles={{\n content: {\n fontSize: 12,\n ...customStyles?.extraContent,\n },\n header: {\n borderColor: colors(theme, type, 'fillSecondary'),\n },\n indicator: {\n color: colors(theme, type),\n },\n title: {\n color: colors(theme, type),\n fontSize: 12,\n },\n }}\n >\n {extra}\n </AccordionItem>\n </Accordion>\n </Flexbox>\n </Flexbox>\n );\n },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAM,YAAY;CAChB,OAAO;CACP,MAAM;CACN,WAAW;CACX,SAAS;CACT,SAAS;AACX;AAEA,MAAM,UAAU,OAAY,OAAe,QAAQ,GAAG,SAAmB;CACvE,IAAI,SAAS,aAAa,OAAO,MAAM,UAAU,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,KAAK,GAAG,CAAC;CAC7E,OAAO,MAAM,UAAU;EAAC;EAAS;EAAM,GAAG;CAAI,CAAC,CAAC,KAAK,GAAG,CAAC;AAC3D;AAEA,MAAMA,UAAQ,MACX,EACC,WAAW,OACX,aACA,WAAW,MACX,OAAO,QACP,OACA,MACA,eAAe,MACf,WACA,OACA,OACA,YACA,QAAQ,cACR,MACA,qBAAqB,OACrB,cACA,QACA,UAAU,UACV,KACA,GAAG,WACC;CACJ,MAAM,QAAQ,SAAS;CACvB,MAAM,WAAW,CAAC,CAAC;CAMnB,MAAM,QACJ,oBAACC,OAAD;EACU;EACK;EACR;EACK;EACV,MAAM,SAAS,cAAc,SAAS;EACtC,WAAW,GACT,aAAa;GACX,UAAU,CAdE,CAAC;GAeb;GACA;GACA,UAdc,QAAQ,CAAC,gBAAgB,CAAC,CAAC,KAcnB;GACtB;GACA,UAAU,CAlBE,CAAC;GAmBb;EACF,CAAC,GACD,YAAY,KACd;EACA,UACE,OAAO,aAAa,YAChB,WACA;GACE,WAAW,oBAAC,YAAD;IAAY,OAAO,OAAO,OAAO,IAAI;IAAG,MAAM;IAAG,MAAM;GAAU,CAAA;GAC5E,GAAG;EACL;EAEN,MACE,oBAAC,MAAD;GACE,OAAO,SAAS,cAAc,OAAO,qBAAqB,KAAA;GAC1D,MAAM,QAAQ,UAAU;GACxB,MAAM,cAAc,KAAK;GACzB,GAAI;EACL,CAAA;EAEH,OAAO;GACL,YAAY,OAAO,OAAO,MAAM,cAAc;GAC9C,aAAa,OAAO,OAAO,MAAM,eAAe;GAChD,OAAO,eAAe,OAAO,OAAO,IAAI,IAAI,KAAA;GAC5C,GAAG;GACH,GAAG,cAAc;EACnB;EACA,GAAI;CACL,CAAA;CAGH,IAAI,CAAC,OAAO,OAAO;CAEnB,IAAI,cACF,OACE,qBAACC,mBAAD;EAAS,WAAW,YAAY;EAAW,KAAK;EAAhD,UAAA,CACG,OACA,KACM;;CAGb,OACE,qBAACA,mBAAD;EAAS,WAAW,YAAY;EAAW,OAAO,cAAc;EAAhE,UAAA,CACG,OACD,oBAACA,mBAAD;GACE,WAAW,cAAc;IAAE;IAAQ;GAAQ,CAAC;GAC5C,OAAO;IACL,YAAY,OAAO,OAAO,MAAM,cAAc;IAC9C,aAAa,OAAO,OAAO,MAAM,eAAe;IAChD,OAAO,OAAO,OAAO,IAAI;IACzB,UAAU,cAAc,KAAK;GAC/B;GAEA,UAAA,oBAAC,WAAD;IAAW,qBAAqB,qBAAqB,CAAC,OAAO,IAAI,CAAC;IAChE,UAAA,oBAAC,eAAD;KACE,SAAS;KACT,OAAO,MAAM,UAAU;KACvB,YAAY;MACV,SAAS,YAAY;MACrB,QAAQ,oBAAoB;OAAE;OAAU;MAAQ,CAAC;KACnD;KACA,QAAQ;MACN,SAAS;OACP,UAAU;OACV,GAAG,cAAc;MACnB;MACA,QAAQ,EACN,aAAa,OAAO,OAAO,MAAM,eAAe,EAClD;MACA,WAAW,EACT,OAAO,OAAO,OAAO,IAAI,EAC3B;MACA,OAAO;OACL,OAAO,OAAO,OAAO,IAAI;OACzB,UAAU;MACZ;KACF;KAEC,UAAA;IACY,CAAA;GACN,CAAA;EACJ,CAAA,CACF;;AAEb,CACF;AAEA,QAAM,cAAc"}
|
package/es/Avatar/Avatar.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.mjs","names":["Avatar","isDefaultAntAvatar","checkIsDefaultAntAvatar","AntAvatar"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["'use client';\n\nimport { getEmoji } from '@lobehub/fluent-emoji';\nimport { Avatar as AntAvatar } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport { Loader2 } from 'lucide-react';\nimport { memo, useMemo, useState } from 'react';\n\nimport { Center } from '@/Flex';\nimport FluentEmoji from '@/FluentEmoji';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles, variants } from './style';\nimport { type AvatarProps } from './type';\nimport {\n calculateEmojiSize,\n formatAvatarText,\n getActualColorForReadable,\n hasValidBackground,\n isDefaultAntAvatar as checkIsDefaultAntAvatar,\n} from './utils';\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(() => checkIsDefaultAntAvatar(avatar), [avatar]);\n const [isImgError, setIsImgError] = useState(false);\n\n const emoji = useMemo(\n () => avatar && !isDefaultAntAvatar && isStringAvatar && getEmoji(avatar),\n [avatar, isStringAvatar, isDefaultAntAvatar],\n );\n\n const text = String(isDefaultAntAvatar ? title : avatar);\n\n const imgAlt = alt || title || 'avatar';\n\n const defaultAvatar = useMemo(\n () =>\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 onError={() => setIsImgError(true)}\n />\n ) : (\n avatar\n ),\n [avatar, imgAlt, size, unoptimized],\n );\n\n const hasBackground = hasValidBackground(background);\n\n const customAvatar = useMemo(\n () =>\n emoji ? (\n <FluentEmoji\n emoji={emoji}\n size={calculateEmojiSize(size, hasBackground, emojiScaleWithBackground)}\n type={animation ? 'anim' : '3d'}\n unoptimized={unoptimized}\n />\n ) : (\n formatAvatarText(text || title, sliceText)\n ),\n [\n animation,\n emoji,\n hasBackground,\n size,\n sliceText,\n text,\n title,\n unoptimized,\n emojiScaleWithBackground,\n ],\n );\n\n // Get actual color value for readableColor (CSS variables can't be parsed)\n const actualColorForReadable = useMemo(\n () => getActualColorForReadable(background, cssVar.colorBorder),\n [background],\n );\n\n const avatarStyle = useMemo(\n () => ({\n backgroundColor:\n (isDefaultAntAvatar && !isImgError) || emoji\n ? background\n : background || cssVar.colorBorder,\n borderRadius: shape === 'square' && size && size < 24 ? '33%' : undefined,\n boxShadow: bordered\n ? `${cssVar.colorBgLayout} 0 0 0 2px, ${borderedColor || cssVar.colorTextTertiary} 0 0 0 4px`\n : undefined,\n color: safeReadableColor(actualColorForReadable),\n cursor: rest?.onClick ? 'pointer' : undefined,\n fontSize: size * (emoji ? 0.7 : 0.5),\n ...style,\n }),\n [\n isDefaultAntAvatar,\n isImgError,\n background,\n shape,\n emoji,\n size,\n bordered,\n borderedColor,\n actualColorForReadable,\n rest?.onClick,\n style,\n ],\n );\n\n const showFallback = !isDefaultAntAvatar || isImgError;\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 && !isImgError ? defaultAvatar : undefined}\n style={avatarStyle}\n {...rest}\n >\n {loading && (\n <Center className={styles.loading} height={'100%'} width={'100%'}>\n <Icon spin icon={Loader2} />\n </Center>\n )}\n {showFallback && customAvatar}\n </AntAvatar>\n );\n },\n);\n\nAvatar.displayName = 'Avatar';\n\nexport default Avatar;\n"],"mappings":";;;;;;;;;;;;;;;AAwBA,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,MAAMC,uBAAqB,cAAcC,mBAAwB,MAAM,GAAG,CAAC,MAAM,CAAC;CAClF,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAElD,MAAM,QAAQ,cACN,UAAU,CAACD,wBAAsB,kBAAkB,SAAS,MAAM,GACxE;EAAC;EAAQ;EAAgBA;CAAkB,CAC7C;CAEA,MAAM,OAAO,OAAOA,uBAAqB,QAAQ,MAAM;CAEvD,MAAM,SAAS,OAAO,SAAS;CAE/B,MAAM,gBAAgB,cAElB,OAAO,WAAW,WAChB,oBAAC,KAAD;EACE,KAAK;EACL,QAAQ;EACR,SAAS;EACT,KAAK;EACQ;EACb,OAAO;EACP,eAAe,cAAc,IAAI;CAClC,CAAA,IAED,QAEJ;EAAC;EAAQ;EAAQ;EAAM;CAAW,CACpC;CAEA,MAAM,gBAAgB,mBAAmB,UAAU;CAEnD,MAAM,eAAe,cAEjB,QACE,oBAAC,aAAD;EACS;EACP,MAAM,mBAAmB,MAAM,eAAe,wBAAwB;EACtE,MAAM,YAAY,SAAS;EACd;CACd,CAAA,IAED,iBAAiB,QAAQ,OAAO,SAAS,GAE7C;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAGA,MAAM,yBAAyB,cACvB,0BAA0B,YAAY,OAAO,WAAW,GAC9D,CAAC,UAAU,CACb;CAEA,MAAM,cAAc,eACX;EACL,iBACGA,wBAAsB,CAAC,cAAe,QACnC,aACA,cAAc,OAAO;EAC3B,cAAc,UAAU,YAAY,QAAQ,OAAO,KAAK,QAAQ,KAAA;EAChE,WAAW,WACP,GAAG,OAAO,cAAc,cAAc,iBAAiB,OAAO,kBAAkB,cAChF,KAAA;EACJ,OAAO,kBAAkB,sBAAsB;EAC/C,QAAQ,MAAM,UAAU,YAAY,KAAA;EACpC,UAAU,QAAQ,QAAQ,KAAM;EAChC,GAAG;CACL,IACA;EACEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAM;EACN;CACF,CACF;CAEA,MAAM,eAAe,CAACA,wBAAsB;CAE5C,OACE,qBAACE,QAAD;EACE,KAAK;EACL,WAAW,GAAG,SAAS;GAAE;GAAQ;EAAQ,CAAC,GAAG,SAAS;EACtD,WAAW;EACN;EACE;EACD;EACN,KAAKF,wBAAsB,CAAC,aAAa,gBAAgB,KAAA;EACzD,OAAO;EACP,GAAI;
|
|
1
|
+
{"version":3,"file":"Avatar.mjs","names":["Avatar","isDefaultAntAvatar","checkIsDefaultAntAvatar","AntAvatar"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["'use client';\n\nimport { getEmoji } from '@lobehub/fluent-emoji';\nimport { Avatar as AntAvatar } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport { Loader2 } from 'lucide-react';\nimport { memo, useMemo, useState } from 'react';\n\nimport { Center } from '@/Flex';\nimport FluentEmoji from '@/FluentEmoji';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles, variants } from './style';\nimport { type AvatarProps } from './type';\nimport {\n calculateEmojiSize,\n formatAvatarText,\n getActualColorForReadable,\n hasValidBackground,\n isDefaultAntAvatar as checkIsDefaultAntAvatar,\n} from './utils';\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(() => checkIsDefaultAntAvatar(avatar), [avatar]);\n const [isImgError, setIsImgError] = useState(false);\n\n const emoji = useMemo(\n () => avatar && !isDefaultAntAvatar && isStringAvatar && getEmoji(avatar),\n [avatar, isStringAvatar, isDefaultAntAvatar],\n );\n\n const text = String(isDefaultAntAvatar ? title : avatar);\n\n const imgAlt = alt || title || 'avatar';\n\n const defaultAvatar = useMemo(\n () =>\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 onError={() => setIsImgError(true)}\n />\n ) : (\n avatar\n ),\n [avatar, imgAlt, size, unoptimized],\n );\n\n const hasBackground = hasValidBackground(background);\n\n const customAvatar = useMemo(\n () =>\n emoji ? (\n <FluentEmoji\n emoji={emoji}\n size={calculateEmojiSize(size, hasBackground, emojiScaleWithBackground)}\n type={animation ? 'anim' : '3d'}\n unoptimized={unoptimized}\n />\n ) : (\n formatAvatarText(text || title, sliceText)\n ),\n [\n animation,\n emoji,\n hasBackground,\n size,\n sliceText,\n text,\n title,\n unoptimized,\n emojiScaleWithBackground,\n ],\n );\n\n // Get actual color value for readableColor (CSS variables can't be parsed)\n const actualColorForReadable = useMemo(\n () => getActualColorForReadable(background, cssVar.colorBorder),\n [background],\n );\n\n const avatarStyle = useMemo(\n () => ({\n backgroundColor:\n (isDefaultAntAvatar && !isImgError) || emoji\n ? background\n : background || cssVar.colorBorder,\n borderRadius: shape === 'square' && size && size < 24 ? '33%' : undefined,\n boxShadow: bordered\n ? `${cssVar.colorBgLayout} 0 0 0 2px, ${borderedColor || cssVar.colorTextTertiary} 0 0 0 4px`\n : undefined,\n color: safeReadableColor(actualColorForReadable),\n cursor: rest?.onClick ? 'pointer' : undefined,\n fontSize: size * (emoji ? 0.7 : 0.5),\n ...style,\n }),\n [\n isDefaultAntAvatar,\n isImgError,\n background,\n shape,\n emoji,\n size,\n bordered,\n borderedColor,\n actualColorForReadable,\n rest?.onClick,\n style,\n ],\n );\n\n const showFallback = !isDefaultAntAvatar || isImgError;\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 && !isImgError ? defaultAvatar : undefined}\n style={avatarStyle}\n {...rest}\n >\n {loading && (\n <Center className={styles.loading} height={'100%'} width={'100%'}>\n <Icon spin icon={Loader2} />\n </Center>\n )}\n {showFallback && customAvatar}\n </AntAvatar>\n );\n },\n);\n\nAvatar.displayName = 'Avatar';\n\nexport default Avatar;\n"],"mappings":";;;;;;;;;;;;;;;AAwBA,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,MAAMC,uBAAqB,cAAcC,mBAAwB,MAAM,GAAG,CAAC,MAAM,CAAC;CAClF,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAElD,MAAM,QAAQ,cACN,UAAU,CAACD,wBAAsB,kBAAkB,SAAS,MAAM,GACxE;EAAC;EAAQ;EAAgBA;CAAkB,CAC7C;CAEA,MAAM,OAAO,OAAOA,uBAAqB,QAAQ,MAAM;CAEvD,MAAM,SAAS,OAAO,SAAS;CAE/B,MAAM,gBAAgB,cAElB,OAAO,WAAW,WAChB,oBAAC,KAAD;EACE,KAAK;EACL,QAAQ;EACR,SAAS;EACT,KAAK;EACQ;EACb,OAAO;EACP,eAAe,cAAc,IAAI;CAClC,CAAA,IAED,QAEJ;EAAC;EAAQ;EAAQ;EAAM;CAAW,CACpC;CAEA,MAAM,gBAAgB,mBAAmB,UAAU;CAEnD,MAAM,eAAe,cAEjB,QACE,oBAAC,aAAD;EACS;EACP,MAAM,mBAAmB,MAAM,eAAe,wBAAwB;EACtE,MAAM,YAAY,SAAS;EACd;CACd,CAAA,IAED,iBAAiB,QAAQ,OAAO,SAAS,GAE7C;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAGA,MAAM,yBAAyB,cACvB,0BAA0B,YAAY,OAAO,WAAW,GAC9D,CAAC,UAAU,CACb;CAEA,MAAM,cAAc,eACX;EACL,iBACGA,wBAAsB,CAAC,cAAe,QACnC,aACA,cAAc,OAAO;EAC3B,cAAc,UAAU,YAAY,QAAQ,OAAO,KAAK,QAAQ,KAAA;EAChE,WAAW,WACP,GAAG,OAAO,cAAc,cAAc,iBAAiB,OAAO,kBAAkB,cAChF,KAAA;EACJ,OAAO,kBAAkB,sBAAsB;EAC/C,QAAQ,MAAM,UAAU,YAAY,KAAA;EACpC,UAAU,QAAQ,QAAQ,KAAM;EAChC,GAAG;CACL,IACA;EACEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAM;EACN;CACF,CACF;CAEA,MAAM,eAAe,CAACA,wBAAsB;CAE5C,OACE,qBAACE,QAAD;EACE,KAAK;EACL,WAAW,GAAG,SAAS;GAAE;GAAQ;EAAQ,CAAC,GAAG,SAAS;EACtD,WAAW;EACN;EACE;EACD;EACN,KAAKF,wBAAsB,CAAC,aAAa,gBAAgB,KAAA;EACzD,OAAO;EACP,GAAI;EATN,UAAA,CAWG,WACC,oBAAC,QAAD;GAAQ,WAAW,OAAO;GAAS,QAAQ;GAAQ,OAAO;GACxD,UAAA,oBAAC,MAAD;IAAM,MAAA;IAAK,MAAM;GAAU,CAAA;EACrB,CAAA,GAET,gBAAgB,YACR;;AAEf,CACF;AAEA,SAAO,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":["Flexbox"],"sources":["../../../src/Avatar/AvatarGroup/index.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { Flexbox } from '@/Flex';\n\nimport Avatar from '../Avatar';\nimport type { AvatarGroupProps } from '../type';\nimport { styles } from './style';\n\nconst AvatarGroup = memo<AvatarGroupProps>(\n ({\n items,\n max,\n gap,\n variant = 'borderless',\n bordered,\n shadow,\n size = 48,\n background,\n animation,\n draggable,\n classNames,\n shape,\n styles: customStyles,\n onClick,\n ref,\n zIndexReverse,\n ...rest\n }) => {\n const avatars = max ? items.slice(0, max) : items;\n const restAvatars = items.slice(max, items.length);\n const gapValue = gap ?? Math.floor(-size / 4);\n\n const avatarProps = {\n animation,\n background,\n bordered,\n draggable,\n shadow,\n shape,\n size,\n variant,\n };\n\n return (\n <Flexbox\n horizontal\n gap={gap}\n ref={ref}\n style={{\n position: 'relative',\n }}\n {...rest}\n >\n {avatars.map((avatar, index) => {\n const {\n key,\n style: avatarStyle,\n className: avatarClassName,\n ...restAvatarProps\n } = avatar;\n return (\n <Avatar\n className={cx(classNames?.avatar, avatarClassName, styles.avatar)}\n key={key}\n style={{\n marginLeft: index === 0 ? 0 : gapValue,\n zIndex: zIndexReverse ? items.length - index : index,\n ...customStyles?.avatar,\n ...avatarStyle,\n }}\n onClick={() => onClick?.({ item: avatar, key })}\n {...avatarProps}\n {...restAvatarProps}\n />\n );\n })}\n {max && restAvatars.length > 0 && (\n <Avatar\n {...avatarProps}\n avatar={`+${restAvatars.length}`}\n background={cssVar.colorText}\n className={cx(styles.avatar, styles.count, classNames?.count)}\n sliceText={false}\n style={{\n marginLeft: gapValue,\n zIndex: zIndexReverse ? 0 : avatars.length,\n ...customStyles?.count,\n }}\n />\n )}\n </Flexbox>\n );\n },\n);\n\nAvatarGroup.displayName = 'AvatarGroup';\n\nexport default AvatarGroup;\n"],"mappings":";;;;;;;;AAWA,MAAM,cAAc,MACjB,EACC,OACA,KACA,KACA,UAAU,cACV,UACA,QACA,OAAO,IACP,YACA,WACA,WACA,YACA,OACA,QAAQ,cACR,SACA,KACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,MAAM,MAAM,MAAM,GAAG,GAAG,IAAI;CAC5C,MAAM,cAAc,MAAM,MAAM,KAAK,MAAM,MAAM;CACjD,MAAM,WAAW,OAAO,KAAK,MAAM,CAAC,OAAO,CAAC;CAE5C,MAAM,cAAc;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACK;EACA;EACL,OAAO,EACL,UAAU,WACZ;EACA,GAAI;
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["Flexbox"],"sources":["../../../src/Avatar/AvatarGroup/index.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { Flexbox } from '@/Flex';\n\nimport Avatar from '../Avatar';\nimport type { AvatarGroupProps } from '../type';\nimport { styles } from './style';\n\nconst AvatarGroup = memo<AvatarGroupProps>(\n ({\n items,\n max,\n gap,\n variant = 'borderless',\n bordered,\n shadow,\n size = 48,\n background,\n animation,\n draggable,\n classNames,\n shape,\n styles: customStyles,\n onClick,\n ref,\n zIndexReverse,\n ...rest\n }) => {\n const avatars = max ? items.slice(0, max) : items;\n const restAvatars = items.slice(max, items.length);\n const gapValue = gap ?? Math.floor(-size / 4);\n\n const avatarProps = {\n animation,\n background,\n bordered,\n draggable,\n shadow,\n shape,\n size,\n variant,\n };\n\n return (\n <Flexbox\n horizontal\n gap={gap}\n ref={ref}\n style={{\n position: 'relative',\n }}\n {...rest}\n >\n {avatars.map((avatar, index) => {\n const {\n key,\n style: avatarStyle,\n className: avatarClassName,\n ...restAvatarProps\n } = avatar;\n return (\n <Avatar\n className={cx(classNames?.avatar, avatarClassName, styles.avatar)}\n key={key}\n style={{\n marginLeft: index === 0 ? 0 : gapValue,\n zIndex: zIndexReverse ? items.length - index : index,\n ...customStyles?.avatar,\n ...avatarStyle,\n }}\n onClick={() => onClick?.({ item: avatar, key })}\n {...avatarProps}\n {...restAvatarProps}\n />\n );\n })}\n {max && restAvatars.length > 0 && (\n <Avatar\n {...avatarProps}\n avatar={`+${restAvatars.length}`}\n background={cssVar.colorText}\n className={cx(styles.avatar, styles.count, classNames?.count)}\n sliceText={false}\n style={{\n marginLeft: gapValue,\n zIndex: zIndexReverse ? 0 : avatars.length,\n ...customStyles?.count,\n }}\n />\n )}\n </Flexbox>\n );\n },\n);\n\nAvatarGroup.displayName = 'AvatarGroup';\n\nexport default AvatarGroup;\n"],"mappings":";;;;;;;;AAWA,MAAM,cAAc,MACjB,EACC,OACA,KACA,KACA,UAAU,cACV,UACA,QACA,OAAO,IACP,YACA,WACA,WACA,YACA,OACA,QAAQ,cACR,SACA,KACA,eACA,GAAG,WACC;CACJ,MAAM,UAAU,MAAM,MAAM,MAAM,GAAG,GAAG,IAAI;CAC5C,MAAM,cAAc,MAAM,MAAM,KAAK,MAAM,MAAM;CACjD,MAAM,WAAW,OAAO,KAAK,MAAM,CAAC,OAAO,CAAC;CAE5C,MAAM,cAAc;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACK;EACA;EACL,OAAO,EACL,UAAU,WACZ;EACA,GAAI;EAPN,UAAA,CASG,QAAQ,KAAK,QAAQ,UAAU;GAC9B,MAAM,EACJ,KACA,OAAO,aACP,WAAW,iBACX,GAAG,oBACD;GACJ,OACE,oBAAC,QAAD;IACE,WAAW,GAAG,YAAY,QAAQ,iBAAiB,OAAO,MAAM;IAEhE,OAAO;KACL,YAAY,UAAU,IAAI,IAAI;KAC9B,QAAQ,gBAAgB,MAAM,SAAS,QAAQ;KAC/C,GAAG,cAAc;KACjB,GAAG;IACL;IACA,eAAe,UAAU;KAAE,MAAM;KAAQ;IAAI,CAAC;IAC9C,GAAI;IACJ,GAAI;GACL,GAVM,GAUN;EAEL,CAAC,GACA,OAAO,YAAY,SAAS,KAC3B,oBAAC,QAAD;GACE,GAAI;GACJ,QAAQ,IAAI,YAAY;GACxB,YAAY,OAAO;GACnB,WAAW,GAAG,OAAO,QAAQ,OAAO,OAAO,YAAY,KAAK;GAC5D,WAAW;GACX,OAAO;IACL,YAAY;IACZ,QAAQ,gBAAgB,IAAI,QAAQ;IACpC,GAAG,cAAc;GACnB;EACD,CAAA,CAEI;;AAEb,CACF;AAEA,YAAY,cAAc"}
|
package/es/Burger/Burger.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Burger.mjs","names":[],"sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["'use client';\n\nimport { Drawer, Menu } from 'antd';\nimport { cx } from 'antd-style';\nimport { MenuIcon, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport { Center } from '@/Flex';\n\nimport { styles } from './style';\nimport type { BurgerProps } from './type';\n\nconst Burger = memo<BurgerProps>(\n ({\n items,\n openKeys,\n selectedKeys,\n opened,\n setOpened,\n className,\n headerHeight = 64,\n onClick,\n iconProps,\n size,\n variant,\n rootClassName,\n fullscreen,\n drawerProps,\n ...rest\n }) => {\n // Convert props to CSS variables\n const cssVariables = useMemo<Record<string, string>>(() => {\n const vars: Record<string, string> = {\n '--burger-header-height': `${headerHeight}px`,\n };\n if (fullscreen) {\n vars['--burger-drawer-top'] = '0';\n vars['--burger-menu-padding-top'] = '0px';\n } else {\n vars['--burger-drawer-top'] = `calc(var(--burger-header-height, ${headerHeight}px) + 1px)`;\n vars['--burger-menu-padding-top'] = `${headerHeight}px`;\n }\n return vars;\n }, [fullscreen, headerHeight]);\n\n return (\n <Center\n className={cx(styles.container, className)}\n onClick={() => {\n setOpened(!opened);\n }}\n {...rest}\n >\n <ActionIcon icon={opened ? X : MenuIcon} size={size} variant={variant} {...iconProps} />\n <Drawer\n closeIcon={undefined}\n open={opened}\n placement={'left'}\n width={'100vw'}\n {...drawerProps}\n className={styles.drawer}\n rootClassName={cx(\n fullscreen ? styles.drawerRootFullscreen : styles.drawerRoot,\n rootClassName,\n )}\n rootStyle={{\n ...cssVariables,\n ...drawerProps?.rootStyle,\n }}\n styles={{\n body: { padding: 0 },\n header: { display: 'none' },\n }}\n >\n <Menu\n className={styles.menu}\n items={items}\n mode={'inline'}\n openKeys={openKeys}\n selectedKeys={selectedKeys}\n style={cssVariables}\n onClick={onClick}\n />\n <div className={styles.fillRect} />\n </Drawer>\n </Center>\n );\n },\n);\n\nBurger.displayName = 'Burger';\n\nexport default Burger;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,SAAS,MACZ,EACC,OACA,UACA,cACA,QACA,WACA,WACA,eAAe,IACf,SACA,WACA,MACA,SACA,eACA,YACA,aACA,GAAG,WACC;CAEJ,MAAM,eAAe,cAAsC;EACzD,MAAM,OAA+B,EACnC,0BAA0B,GAAG,aAAa,IAC5C;EACA,IAAI,YAAY;GACd,KAAK,yBAAyB;GAC9B,KAAK,+BAA+B;EACtC,OAAO;GACL,KAAK,yBAAyB,oCAAoC,aAAa;GAC/E,KAAK,+BAA+B,GAAG,aAAa;EACtD;EACA,OAAO;CACT,GAAG,CAAC,YAAY,YAAY,CAAC;CAE7B,OACE,qBAAC,QAAD;EACE,WAAW,GAAG,OAAO,WAAW,SAAS;EACzC,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;EACA,GAAI;
|
|
1
|
+
{"version":3,"file":"Burger.mjs","names":[],"sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["'use client';\n\nimport { Drawer, Menu } from 'antd';\nimport { cx } from 'antd-style';\nimport { MenuIcon, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport { Center } from '@/Flex';\n\nimport { styles } from './style';\nimport type { BurgerProps } from './type';\n\nconst Burger = memo<BurgerProps>(\n ({\n items,\n openKeys,\n selectedKeys,\n opened,\n setOpened,\n className,\n headerHeight = 64,\n onClick,\n iconProps,\n size,\n variant,\n rootClassName,\n fullscreen,\n drawerProps,\n ...rest\n }) => {\n // Convert props to CSS variables\n const cssVariables = useMemo<Record<string, string>>(() => {\n const vars: Record<string, string> = {\n '--burger-header-height': `${headerHeight}px`,\n };\n if (fullscreen) {\n vars['--burger-drawer-top'] = '0';\n vars['--burger-menu-padding-top'] = '0px';\n } else {\n vars['--burger-drawer-top'] = `calc(var(--burger-header-height, ${headerHeight}px) + 1px)`;\n vars['--burger-menu-padding-top'] = `${headerHeight}px`;\n }\n return vars;\n }, [fullscreen, headerHeight]);\n\n return (\n <Center\n className={cx(styles.container, className)}\n onClick={() => {\n setOpened(!opened);\n }}\n {...rest}\n >\n <ActionIcon icon={opened ? X : MenuIcon} size={size} variant={variant} {...iconProps} />\n <Drawer\n closeIcon={undefined}\n open={opened}\n placement={'left'}\n width={'100vw'}\n {...drawerProps}\n className={styles.drawer}\n rootClassName={cx(\n fullscreen ? styles.drawerRootFullscreen : styles.drawerRoot,\n rootClassName,\n )}\n rootStyle={{\n ...cssVariables,\n ...drawerProps?.rootStyle,\n }}\n styles={{\n body: { padding: 0 },\n header: { display: 'none' },\n }}\n >\n <Menu\n className={styles.menu}\n items={items}\n mode={'inline'}\n openKeys={openKeys}\n selectedKeys={selectedKeys}\n style={cssVariables}\n onClick={onClick}\n />\n <div className={styles.fillRect} />\n </Drawer>\n </Center>\n );\n },\n);\n\nBurger.displayName = 'Burger';\n\nexport default Burger;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,SAAS,MACZ,EACC,OACA,UACA,cACA,QACA,WACA,WACA,eAAe,IACf,SACA,WACA,MACA,SACA,eACA,YACA,aACA,GAAG,WACC;CAEJ,MAAM,eAAe,cAAsC;EACzD,MAAM,OAA+B,EACnC,0BAA0B,GAAG,aAAa,IAC5C;EACA,IAAI,YAAY;GACd,KAAK,yBAAyB;GAC9B,KAAK,+BAA+B;EACtC,OAAO;GACL,KAAK,yBAAyB,oCAAoC,aAAa;GAC/E,KAAK,+BAA+B,GAAG,aAAa;EACtD;EACA,OAAO;CACT,GAAG,CAAC,YAAY,YAAY,CAAC;CAE7B,OACE,qBAAC,QAAD;EACE,WAAW,GAAG,OAAO,WAAW,SAAS;EACzC,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;EACA,GAAI;EALN,UAAA,CAOE,oBAAC,YAAD;GAAY,MAAM,SAAS,IAAI;GAAgB;GAAe;GAAS,GAAI;EAAY,CAAA,GACvF,qBAAC,QAAD;GACE,WAAW,KAAA;GACX,MAAM;GACN,WAAW;GACX,OAAO;GACP,GAAI;GACJ,WAAW,OAAO;GAClB,eAAe,GACb,aAAa,OAAO,uBAAuB,OAAO,YAClD,aACF;GACA,WAAW;IACT,GAAG;IACH,GAAG,aAAa;GAClB;GACA,QAAQ;IACN,MAAM,EAAE,SAAS,EAAE;IACnB,QAAQ,EAAE,SAAS,OAAO;GAC5B;GAlBF,UAAA,CAoBE,oBAAC,MAAD;IACE,WAAW,OAAO;IACX;IACP,MAAM;IACI;IACI;IACd,OAAO;IACE;GACV,CAAA,GACD,oBAAC,OAAD,EAAK,WAAW,OAAO,SAAW,CAAA,CAC5B;EACF,CAAA,CAAA;;AAEZ,CACF;AAEA,OAAO,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.mjs","names":["Flexbox"],"sources":["../../src/Checkbox/Checkbox.tsx"],"sourcesContent":["import { cx } from 'antd-style';\nimport { CheckIcon, Minus } from 'lucide-react';\nimport type { CSSProperties, FC, MouseEvent } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Text from '@/Text';\n\nimport { styles } from './style';\nimport type { CheckboxProps } from './type';\n\nconst Checkbox: FC<CheckboxProps> = ({\n checked,\n defaultChecked,\n onChange,\n size = 16,\n className,\n style,\n children,\n textProps,\n backgroundColor,\n classNames,\n styles: customStyles,\n shape = 'square',\n disabled,\n indeterminate,\n ...rest\n}) => {\n const [value, setValue] = useMergeState(defaultChecked || false, {\n defaultValue: defaultChecked,\n onChange,\n value: checked,\n });\n\n const checkboxStyles: CSSProperties = {\n borderRadius: shape === 'square' ? `max(4px, ${Math.round(size / 4)}px)` : '50%',\n ...style,\n ...customStyles?.checkbox,\n };\n\n const handleClick = (e?: MouseEvent) => {\n if (!disabled) {\n e?.preventDefault();\n setValue(!value);\n }\n };\n\n const isIndeterminate = indeterminate;\n const isChecked = !isIndeterminate && value;\n\n const checkIcon = (\n <Block\n align={'center'}\n flex={'none'}\n height={size}\n justify={'center'}\n variant={'outlined'}\n width={size}\n className={cx(\n styles.root,\n isChecked && styles.checked,\n isIndeterminate && styles.indeterminate,\n disabled && styles.disabled,\n className,\n classNames?.checkbox,\n )}\n style={\n backgroundColor && (isChecked || isIndeterminate)\n ? { backgroundColor, borderColor: backgroundColor, ...checkboxStyles }\n : { ...checkboxStyles }\n }\n onClick={handleClick}\n {...rest}\n >\n {isIndeterminate ? (\n <Minus\n size={size}\n strokeWidth={3}\n style={{\n transform: `scale(${shape === 'square' ? 0.75 : 0.66})`,\n }}\n />\n ) : isChecked ? (\n <CheckIcon\n size={size}\n strokeWidth={3}\n style={{\n transform: `scale(${shape === 'square' ? 0.75 : 0.66})`,\n }}\n />\n ) : null}\n </Block>\n );\n\n if (!children) return checkIcon;\n\n return (\n <Flexbox\n horizontal\n align={'center'}\n className={classNames?.wrapper}\n gap={Math.floor(size / 2)}\n style={{\n cursor: disabled ? 'not-allowed' : 'pointer',\n userSelect: 'none',\n ...customStyles?.wrapper,\n }}\n onClick={handleClick}\n >\n {checkIcon}\n <Text\n as={'span'}\n className={cx(classNames?.text)}\n style={customStyles?.text}\n {...textProps}\n type={disabled ? 'secondary' : textProps?.type}\n >\n {children}\n </Text>\n </Flexbox>\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;AAYA,MAAM,YAA+B,EACnC,SACA,gBACA,UACA,OAAO,IACP,WACA,OACA,UACA,WACA,iBACA,YACA,QAAQ,cACR,QAAQ,UACR,UACA,eACA,GAAG,WACC;CACJ,MAAM,CAAC,OAAO,YAAY,cAAc,kBAAkB,OAAO;EAC/D,cAAc;EACd;EACA,OAAO;CACT,CAAC;CAED,MAAM,iBAAgC;EACpC,cAAc,UAAU,WAAW,YAAY,KAAK,MAAM,OAAO,CAAC,EAAE,OAAO;EAC3E,GAAG;EACH,GAAG,cAAc;CACnB;CAEA,MAAM,eAAe,MAAmB;EACtC,IAAI,CAAC,UAAU;GACb,GAAG,eAAe;GAClB,SAAS,CAAC,KAAK;EACjB;CACF;CAEA,MAAM,kBAAkB;CACxB,MAAM,YAAY,CAAC,mBAAmB;CAEtC,MAAM,YACJ,oBAAC,OAAD;EACE,OAAO;EACP,MAAM;EACN,QAAQ;EACR,SAAS;EACT,SAAS;EACT,OAAO;EACP,WAAW,GACT,OAAO,MACP,aAAa,OAAO,SACpB,mBAAmB,OAAO,eAC1B,YAAY,OAAO,UACnB,WACA,YAAY,QACd;EACA,OACE,oBAAoB,aAAa,mBAC7B;GAAE;GAAiB,aAAa;GAAiB,GAAG;EAAe,IACnE,EAAE,GAAG,eAAe;EAE1B,SAAS;EACT,GAAI;
|
|
1
|
+
{"version":3,"file":"Checkbox.mjs","names":["Flexbox"],"sources":["../../src/Checkbox/Checkbox.tsx"],"sourcesContent":["import { cx } from 'antd-style';\nimport { CheckIcon, Minus } from 'lucide-react';\nimport type { CSSProperties, FC, MouseEvent } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Text from '@/Text';\n\nimport { styles } from './style';\nimport type { CheckboxProps } from './type';\n\nconst Checkbox: FC<CheckboxProps> = ({\n checked,\n defaultChecked,\n onChange,\n size = 16,\n className,\n style,\n children,\n textProps,\n backgroundColor,\n classNames,\n styles: customStyles,\n shape = 'square',\n disabled,\n indeterminate,\n ...rest\n}) => {\n const [value, setValue] = useMergeState(defaultChecked || false, {\n defaultValue: defaultChecked,\n onChange,\n value: checked,\n });\n\n const checkboxStyles: CSSProperties = {\n borderRadius: shape === 'square' ? `max(4px, ${Math.round(size / 4)}px)` : '50%',\n ...style,\n ...customStyles?.checkbox,\n };\n\n const handleClick = (e?: MouseEvent) => {\n if (!disabled) {\n e?.preventDefault();\n setValue(!value);\n }\n };\n\n const isIndeterminate = indeterminate;\n const isChecked = !isIndeterminate && value;\n\n const checkIcon = (\n <Block\n align={'center'}\n flex={'none'}\n height={size}\n justify={'center'}\n variant={'outlined'}\n width={size}\n className={cx(\n styles.root,\n isChecked && styles.checked,\n isIndeterminate && styles.indeterminate,\n disabled && styles.disabled,\n className,\n classNames?.checkbox,\n )}\n style={\n backgroundColor && (isChecked || isIndeterminate)\n ? { backgroundColor, borderColor: backgroundColor, ...checkboxStyles }\n : { ...checkboxStyles }\n }\n onClick={handleClick}\n {...rest}\n >\n {isIndeterminate ? (\n <Minus\n size={size}\n strokeWidth={3}\n style={{\n transform: `scale(${shape === 'square' ? 0.75 : 0.66})`,\n }}\n />\n ) : isChecked ? (\n <CheckIcon\n size={size}\n strokeWidth={3}\n style={{\n transform: `scale(${shape === 'square' ? 0.75 : 0.66})`,\n }}\n />\n ) : null}\n </Block>\n );\n\n if (!children) return checkIcon;\n\n return (\n <Flexbox\n horizontal\n align={'center'}\n className={classNames?.wrapper}\n gap={Math.floor(size / 2)}\n style={{\n cursor: disabled ? 'not-allowed' : 'pointer',\n userSelect: 'none',\n ...customStyles?.wrapper,\n }}\n onClick={handleClick}\n >\n {checkIcon}\n <Text\n as={'span'}\n className={cx(classNames?.text)}\n style={customStyles?.text}\n {...textProps}\n type={disabled ? 'secondary' : textProps?.type}\n >\n {children}\n </Text>\n </Flexbox>\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;AAYA,MAAM,YAA+B,EACnC,SACA,gBACA,UACA,OAAO,IACP,WACA,OACA,UACA,WACA,iBACA,YACA,QAAQ,cACR,QAAQ,UACR,UACA,eACA,GAAG,WACC;CACJ,MAAM,CAAC,OAAO,YAAY,cAAc,kBAAkB,OAAO;EAC/D,cAAc;EACd;EACA,OAAO;CACT,CAAC;CAED,MAAM,iBAAgC;EACpC,cAAc,UAAU,WAAW,YAAY,KAAK,MAAM,OAAO,CAAC,EAAE,OAAO;EAC3E,GAAG;EACH,GAAG,cAAc;CACnB;CAEA,MAAM,eAAe,MAAmB;EACtC,IAAI,CAAC,UAAU;GACb,GAAG,eAAe;GAClB,SAAS,CAAC,KAAK;EACjB;CACF;CAEA,MAAM,kBAAkB;CACxB,MAAM,YAAY,CAAC,mBAAmB;CAEtC,MAAM,YACJ,oBAAC,OAAD;EACE,OAAO;EACP,MAAM;EACN,QAAQ;EACR,SAAS;EACT,SAAS;EACT,OAAO;EACP,WAAW,GACT,OAAO,MACP,aAAa,OAAO,SACpB,mBAAmB,OAAO,eAC1B,YAAY,OAAO,UACnB,WACA,YAAY,QACd;EACA,OACE,oBAAoB,aAAa,mBAC7B;GAAE;GAAiB,aAAa;GAAiB,GAAG;EAAe,IACnE,EAAE,GAAG,eAAe;EAE1B,SAAS;EACT,GAAI;EAEH,UAAA,kBACC,oBAAC,OAAD;GACQ;GACN,aAAa;GACb,OAAO,EACL,WAAW,SAAS,UAAU,WAAW,MAAO,IAAK,GACvD;EACD,CAAA,IACC,YACF,oBAAC,WAAD;GACQ;GACN,aAAa;GACb,OAAO,EACL,WAAW,SAAS,UAAU,WAAW,MAAO,IAAK,GACvD;EACD,CAAA,IACC;CACC,CAAA;CAGT,IAAI,CAAC,UAAU,OAAO;CAEtB,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,OAAO;EACP,WAAW,YAAY;EACvB,KAAK,KAAK,MAAM,OAAO,CAAC;EACxB,OAAO;GACL,QAAQ,WAAW,gBAAgB;GACnC,YAAY;GACZ,GAAG,cAAc;EACnB;EACA,SAAS;EAVX,UAAA,CAYG,WACD,oBAAC,MAAD;GACE,IAAI;GACJ,WAAW,GAAG,YAAY,IAAI;GAC9B,OAAO,cAAc;GACrB,GAAI;GACJ,MAAM,WAAW,cAAc,WAAW;GAEzC;EACG,CAAA,CACC;;AAEb;AAEA,SAAS,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxGroup.mjs","names":["Flexbox"],"sources":["../../src/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\n\nimport Checkbox from './Checkbox';\nimport type { CheckboxGroupProps } from './type';\n\nconst CheckboxGroup: FC<CheckboxGroupProps> = ({\n defaultValue,\n disabled,\n onChange,\n options,\n textProps,\n value,\n shape,\n size,\n ...rest\n}) => {\n const [selectedValues, setSelectedValues] = useMergeState<string[]>(defaultValue || [], {\n defaultValue,\n onChange,\n value,\n });\n\n const handleChange = (optionValue: string, checked: boolean) => {\n const newValues = checked\n ? [...selectedValues, optionValue]\n : selectedValues.filter((v) => v !== optionValue);\n\n setSelectedValues(newValues);\n };\n\n const normalizedOptions = options.map((option) => {\n if (typeof option === 'string') {\n return {\n disabled: false,\n label: option,\n value: option,\n };\n }\n return option;\n });\n\n return (\n <Flexbox horizontal align={'center'} gap={16} wrap={'wrap'} {...rest}>\n {normalizedOptions.map((option) => {\n const isChecked = selectedValues.includes(option.value);\n const isDisabled = disabled || option.disabled;\n\n return (\n <Checkbox\n checked={isChecked}\n disabled={isDisabled}\n key={String(option.value)}\n shape={shape}\n size={size}\n textProps={textProps}\n onChange={(checked) => handleChange(option.value, checked)}\n >\n {option.label}\n </Checkbox>\n );\n })}\n </Flexbox>\n );\n};\n\nCheckboxGroup.displayName = 'CheckboxGroup';\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;AAQA,MAAM,iBAAyC,EAC7C,cACA,UACA,UACA,SACA,WACA,OACA,OACA,MACA,GAAG,WACC;CACJ,MAAM,CAAC,gBAAgB,qBAAqB,cAAwB,gBAAgB,CAAC,GAAG;EACtF;EACA;EACA;CACF,CAAC;CAED,MAAM,gBAAgB,aAAqB,YAAqB;EAC9D,MAAM,YAAY,UACd,CAAC,GAAG,gBAAgB,WAAW,IAC/B,eAAe,QAAQ,MAAM,MAAM,WAAW;EAElD,kBAAkB,SAAS;CAC7B;CAEA,MAAM,oBAAoB,QAAQ,KAAK,WAAW;EAChD,IAAI,OAAO,WAAW,UACpB,OAAO;GACL,UAAU;GACV,OAAO;GACP,OAAO;EACT;EAEF,OAAO;CACT,CAAC;CAED,OACE,oBAACA,mBAAD;EAAS,YAAA;EAAW,OAAO;EAAU,KAAK;EAAI,MAAM;EAAQ,GAAI;
|
|
1
|
+
{"version":3,"file":"CheckboxGroup.mjs","names":["Flexbox"],"sources":["../../src/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\n\nimport Checkbox from './Checkbox';\nimport type { CheckboxGroupProps } from './type';\n\nconst CheckboxGroup: FC<CheckboxGroupProps> = ({\n defaultValue,\n disabled,\n onChange,\n options,\n textProps,\n value,\n shape,\n size,\n ...rest\n}) => {\n const [selectedValues, setSelectedValues] = useMergeState<string[]>(defaultValue || [], {\n defaultValue,\n onChange,\n value,\n });\n\n const handleChange = (optionValue: string, checked: boolean) => {\n const newValues = checked\n ? [...selectedValues, optionValue]\n : selectedValues.filter((v) => v !== optionValue);\n\n setSelectedValues(newValues);\n };\n\n const normalizedOptions = options.map((option) => {\n if (typeof option === 'string') {\n return {\n disabled: false,\n label: option,\n value: option,\n };\n }\n return option;\n });\n\n return (\n <Flexbox horizontal align={'center'} gap={16} wrap={'wrap'} {...rest}>\n {normalizedOptions.map((option) => {\n const isChecked = selectedValues.includes(option.value);\n const isDisabled = disabled || option.disabled;\n\n return (\n <Checkbox\n checked={isChecked}\n disabled={isDisabled}\n key={String(option.value)}\n shape={shape}\n size={size}\n textProps={textProps}\n onChange={(checked) => handleChange(option.value, checked)}\n >\n {option.label}\n </Checkbox>\n );\n })}\n </Flexbox>\n );\n};\n\nCheckboxGroup.displayName = 'CheckboxGroup';\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;AAQA,MAAM,iBAAyC,EAC7C,cACA,UACA,UACA,SACA,WACA,OACA,OACA,MACA,GAAG,WACC;CACJ,MAAM,CAAC,gBAAgB,qBAAqB,cAAwB,gBAAgB,CAAC,GAAG;EACtF;EACA;EACA;CACF,CAAC;CAED,MAAM,gBAAgB,aAAqB,YAAqB;EAC9D,MAAM,YAAY,UACd,CAAC,GAAG,gBAAgB,WAAW,IAC/B,eAAe,QAAQ,MAAM,MAAM,WAAW;EAElD,kBAAkB,SAAS;CAC7B;CAEA,MAAM,oBAAoB,QAAQ,KAAK,WAAW;EAChD,IAAI,OAAO,WAAW,UACpB,OAAO;GACL,UAAU;GACV,OAAO;GACP,OAAO;EACT;EAEF,OAAO;CACT,CAAC;CAED,OACE,oBAACA,mBAAD;EAAS,YAAA;EAAW,OAAO;EAAU,KAAK;EAAI,MAAM;EAAQ,GAAI;EAC7D,UAAA,kBAAkB,KAAK,WAAW;GAIjC,OACE,oBAAC,UAAD;IACE,SALc,eAAe,SAAS,OAAO,KAK5B;IACjB,UALe,YAAY,OAAO;IAO3B;IACD;IACK;IACX,WAAW,YAAY,aAAa,OAAO,OAAO,OAAO;IAExD,UAAA,OAAO;GACA,GAPH,OAAO,OAAO,KAAK,CAOhB;EAEd,CAAC;CACM,CAAA;AAEb;AAEA,cAAc,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DiffPanel.mjs","names":["Flexbox"],"sources":["../../src/CodeDiff/DiffPanel.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\nimport { memo, useCallback, useState } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport type { FlexboxProps } from '@/Flex';\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\nimport Tag from '@/Tag';\nimport Text from '@/Text';\nimport { stopPropagation } from '@/utils/dom';\n\nimport { bodyVariants, headerVariants, prefix, styles, variants } from './style';\n\ninterface DiffPanelProps extends Omit<FlexboxProps, 'children'> {\n actions?: ReactNode;\n additions: number;\n body: ReactNode;\n classNames?: {\n body?: string;\n header?: string;\n };\n dataCodeType: string;\n defaultExpand?: boolean;\n deletions: number;\n displayName: string;\n fileName?: string;\n fullFeatured?: boolean;\n showHeader?: boolean;\n styles?: {\n body?: CSSProperties;\n header?: CSSProperties;\n };\n variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const DiffPanel = memo<DiffPanelProps>(\n ({\n actions,\n body,\n className,\n classNames,\n dataCodeType,\n defaultExpand = true,\n deletions,\n displayName,\n fileName,\n fullFeatured = true,\n showHeader = true,\n styles: customStyles,\n variant = 'filled',\n additions,\n ...rest\n }) => {\n const [expand, setExpand] = useState(defaultExpand);\n\n const handleToggleExpand = useCallback(() => {\n setExpand((prev) => !prev);\n }, []);\n\n if (!fullFeatured)\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n data-code-type={dataCodeType}\n {...rest}\n >\n <Flexbox horizontal align=\"center\" className={styles.actionsCompact} flex=\"none\" gap={4}>\n {actions}\n </Flexbox>\n {showHeader && <Tag className={styles.lang}>{displayName}</Tag>}\n <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n {body}\n </div>\n </Flexbox>\n );\n\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n data-code-type={dataCodeType}\n {...rest}\n >\n {showHeader && (\n <Flexbox\n horizontal\n align=\"center\"\n className={cx(headerVariants({ variant }), classNames?.header)}\n justify=\"space-between\"\n style={customStyles?.header}\n onClick={handleToggleExpand}\n >\n <Flexbox\n horizontal\n align=\"center\"\n className=\"language-title\"\n flex={1}\n gap={4}\n justify=\"flex-start\"\n paddingInline={8}\n >\n <MaterialFileTypeIcon\n fallbackUnknownType={false}\n filename={fileName || displayName}\n size={18}\n type=\"file\"\n variant=\"raw\"\n />\n <Text ellipsis fontSize={13}>\n {displayName}\n </Text>\n </Flexbox>\n <Flexbox horizontal align=\"center\" flex=\"none\" gap={8} onClick={stopPropagation}>\n {actions && (\n <Flexbox\n horizontal\n align=\"center\"\n className={cx('panel-actions', `${prefix}-actions`, styles.actions)}\n flex=\"none\"\n gap={4}\n >\n {actions}\n </Flexbox>\n )}\n {(deletions > 0 || additions > 0) && (\n <Flexbox horizontal className={styles.stats} gap={8}>\n {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n </Flexbox>\n )}\n <ActionIcon\n icon={expand ? ChevronDown : ChevronRight}\n size=\"small\"\n onClick={handleToggleExpand}\n />\n </Flexbox>\n </Flexbox>\n )}\n <div\n className={cx(bodyVariants({ expand }), `${prefix}-body`, styles.body, classNames?.body)}\n style={customStyles?.body}\n >\n {body}\n </div>\n </Flexbox>\n );\n },\n);\n\nDiffPanel.displayName = 'DiffPanel';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAa,YAAY,MACtB,EACC,SACA,MACA,WACA,YACA,cACA,gBAAgB,MAChB,WACA,aACA,UACA,eAAe,MACf,aAAa,MACb,QAAQ,cACR,UAAU,UACV,WACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,SAAS,aAAa;CAElD,MAAM,qBAAqB,kBAAkB;EAC3C,WAAW,SAAS,CAAC,IAAI;CAC3B,GAAG,CAAC,CAAC;CAEL,IAAI,CAAC,cACH,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;
|
|
1
|
+
{"version":3,"file":"DiffPanel.mjs","names":["Flexbox"],"sources":["../../src/CodeDiff/DiffPanel.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\nimport { memo, useCallback, useState } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport type { FlexboxProps } from '@/Flex';\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\nimport Tag from '@/Tag';\nimport Text from '@/Text';\nimport { stopPropagation } from '@/utils/dom';\n\nimport { bodyVariants, headerVariants, prefix, styles, variants } from './style';\n\ninterface DiffPanelProps extends Omit<FlexboxProps, 'children'> {\n actions?: ReactNode;\n additions: number;\n body: ReactNode;\n classNames?: {\n body?: string;\n header?: string;\n };\n dataCodeType: string;\n defaultExpand?: boolean;\n deletions: number;\n displayName: string;\n fileName?: string;\n fullFeatured?: boolean;\n showHeader?: boolean;\n styles?: {\n body?: CSSProperties;\n header?: CSSProperties;\n };\n variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const DiffPanel = memo<DiffPanelProps>(\n ({\n actions,\n body,\n className,\n classNames,\n dataCodeType,\n defaultExpand = true,\n deletions,\n displayName,\n fileName,\n fullFeatured = true,\n showHeader = true,\n styles: customStyles,\n variant = 'filled',\n additions,\n ...rest\n }) => {\n const [expand, setExpand] = useState(defaultExpand);\n\n const handleToggleExpand = useCallback(() => {\n setExpand((prev) => !prev);\n }, []);\n\n if (!fullFeatured)\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n data-code-type={dataCodeType}\n {...rest}\n >\n <Flexbox horizontal align=\"center\" className={styles.actionsCompact} flex=\"none\" gap={4}>\n {actions}\n </Flexbox>\n {showHeader && <Tag className={styles.lang}>{displayName}</Tag>}\n <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n {body}\n </div>\n </Flexbox>\n );\n\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n data-code-type={dataCodeType}\n {...rest}\n >\n {showHeader && (\n <Flexbox\n horizontal\n align=\"center\"\n className={cx(headerVariants({ variant }), classNames?.header)}\n justify=\"space-between\"\n style={customStyles?.header}\n onClick={handleToggleExpand}\n >\n <Flexbox\n horizontal\n align=\"center\"\n className=\"language-title\"\n flex={1}\n gap={4}\n justify=\"flex-start\"\n paddingInline={8}\n >\n <MaterialFileTypeIcon\n fallbackUnknownType={false}\n filename={fileName || displayName}\n size={18}\n type=\"file\"\n variant=\"raw\"\n />\n <Text ellipsis fontSize={13}>\n {displayName}\n </Text>\n </Flexbox>\n <Flexbox horizontal align=\"center\" flex=\"none\" gap={8} onClick={stopPropagation}>\n {actions && (\n <Flexbox\n horizontal\n align=\"center\"\n className={cx('panel-actions', `${prefix}-actions`, styles.actions)}\n flex=\"none\"\n gap={4}\n >\n {actions}\n </Flexbox>\n )}\n {(deletions > 0 || additions > 0) && (\n <Flexbox horizontal className={styles.stats} gap={8}>\n {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n </Flexbox>\n )}\n <ActionIcon\n icon={expand ? ChevronDown : ChevronRight}\n size=\"small\"\n onClick={handleToggleExpand}\n />\n </Flexbox>\n </Flexbox>\n )}\n <div\n className={cx(bodyVariants({ expand }), `${prefix}-body`, styles.body, classNames?.body)}\n style={customStyles?.body}\n >\n {body}\n </div>\n </Flexbox>\n );\n },\n);\n\nDiffPanel.displayName = 'DiffPanel';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAa,YAAY,MACtB,EACC,SACA,MACA,WACA,YACA,cACA,gBAAgB,MAChB,WACA,aACA,UACA,eAAe,MACf,aAAa,MACb,QAAQ,cACR,UAAU,UACV,WACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,SAAS,aAAa;CAElD,MAAM,qBAAqB,kBAAkB;EAC3C,WAAW,SAAS,CAAC,IAAI;CAC3B,GAAG,CAAC,CAAC;CAEL,IAAI,CAAC,cACH,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA;GAKE,oBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,WAAW,OAAO;IAAgB,MAAK;IAAO,KAAK;IACnF,UAAA;GACM,CAAA;GACR,cAAc,oBAAC,KAAD;IAAK,WAAW,OAAO;IAAO,UAAA;GAAiB,CAAA;GAC9D,oBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,MAAM,YAAY,IAAI;IAAG,OAAO,cAAc;IACrE,UAAA;GACE,CAAA;EACE;;CAGb,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA,CAKG,cACC,qBAACA,mBAAD;GACE,YAAA;GACA,OAAM;GACN,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,YAAY,MAAM;GAC7D,SAAQ;GACR,OAAO,cAAc;GACrB,SAAS;GANX,UAAA,CAQE,qBAACA,mBAAD;IACE,YAAA;IACA,OAAM;IACN,WAAU;IACV,MAAM;IACN,KAAK;IACL,SAAQ;IACR,eAAe;IAPjB,UAAA,CASE,oBAAC,sBAAD;KACE,qBAAqB;KACrB,UAAU,YAAY;KACtB,MAAM;KACN,MAAK;KACL,SAAQ;IACT,CAAA,GACD,oBAAC,MAAD;KAAM,UAAA;KAAS,UAAU;KACtB,UAAA;IACG,CAAA,CACC;GACT,CAAA,GAAA,qBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,MAAK;IAAO,KAAK;IAAG,SAAS;IAAhE,UAAA;KACG,WACC,oBAACA,mBAAD;MACE,YAAA;MACA,OAAM;MACN,WAAW,GAAG,iBAAiB,0BAAqB,OAAO,OAAO;MAClE,MAAK;MACL,KAAK;MAEJ,UAAA;KACM,CAAA;MAET,YAAY,KAAK,YAAY,MAC7B,qBAACA,mBAAD;MAAS,YAAA;MAAW,WAAW,OAAO;MAAO,KAAK;MAAlD,UAAA,CACG,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MACtE,CAAA,GAAA,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MAChE,CAAA,CAAA;;KAEX,oBAAC,YAAD;MACE,MAAM,SAAS,cAAc;MAC7B,MAAK;MACL,SAAS;KACV,CAAA;IACM;GACF,CAAA,CAAA;EAEX,CAAA,GAAA,oBAAC,OAAD;GACE,WAAW,GAAG,aAAa,EAAE,OAAO,CAAC,GAAG,GAAG,OAAO,QAAQ,OAAO,MAAM,YAAY,IAAI;GACvF,OAAO,cAAc;GAEpB,UAAA;EACE,CAAA,CACE;;AAEb,CACF;AAEA,UAAU,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.mjs","names":["Flexbox"],"sources":["../../src/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { styles, variants } from '@/CodeEditor/style';\nimport { Flexbox } from '@/Flex';\nimport SyntaxHighlighter from '@/Highlighter/SyntaxHighlighter';\n\nimport type { CodeEditorProps } from './type';\n\nconst CodeEditor = memo<CodeEditorProps>(\n ({\n autoFocus,\n classNames,\n styles: customStyles,\n defaultValue = '',\n onChange,\n placeholder = '',\n style,\n className,\n onValueChange,\n value,\n language = 'markdown',\n variant = 'borderless',\n width,\n height,\n flex,\n ref,\n ...rest\n }) => {\n const [code, setCode] = useMergeState(defaultValue, {\n defaultValue,\n onChange: onValueChange,\n value,\n });\n\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n flex={flex}\n height={height}\n style={style}\n width={width}\n >\n {value ? (\n <SyntaxHighlighter\n className={cx(styles.highlight, classNames?.highlight)}\n language={language}\n style={customStyles?.highlight}\n variant={variant}\n >\n {value}\n </SyntaxHighlighter>\n ) : (\n <pre\n className={cx(styles.highlight, classNames?.highlight)}\n style={{\n color: cssVar.colorTextDescription,\n }}\n >\n {placeholder || ' '}\n </pre>\n )}\n\n <textarea\n autoCapitalize=\"off\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoFocus={autoFocus}\n className={cx(styles.textarea, classNames?.textarea)}\n data-gramm={false}\n ref={ref}\n style={customStyles?.textarea}\n value={code}\n onChange={(e) => {\n onChange?.(e);\n setCode(e.target.value);\n }}\n {...rest}\n />\n </Flexbox>\n );\n },\n);\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;AAYA,MAAM,aAAa,MAChB,EACC,WACA,YACA,QAAQ,cACR,eAAe,IACf,UACA,cAAc,IACd,OACA,WACA,eACA,OACA,WAAW,YACX,UAAU,cACV,OACA,QACA,MACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,MAAM,WAAW,cAAc,cAAc;EAClD;EACA,UAAU;EACV;CACF,CAAC;CAED,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EACxC;EACE;EACD;EACA;
|
|
1
|
+
{"version":3,"file":"CodeEditor.mjs","names":["Flexbox"],"sources":["../../src/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { styles, variants } from '@/CodeEditor/style';\nimport { Flexbox } from '@/Flex';\nimport SyntaxHighlighter from '@/Highlighter/SyntaxHighlighter';\n\nimport type { CodeEditorProps } from './type';\n\nconst CodeEditor = memo<CodeEditorProps>(\n ({\n autoFocus,\n classNames,\n styles: customStyles,\n defaultValue = '',\n onChange,\n placeholder = '',\n style,\n className,\n onValueChange,\n value,\n language = 'markdown',\n variant = 'borderless',\n width,\n height,\n flex,\n ref,\n ...rest\n }) => {\n const [code, setCode] = useMergeState(defaultValue, {\n defaultValue,\n onChange: onValueChange,\n value,\n });\n\n return (\n <Flexbox\n className={cx(variants({ variant }), className)}\n flex={flex}\n height={height}\n style={style}\n width={width}\n >\n {value ? (\n <SyntaxHighlighter\n className={cx(styles.highlight, classNames?.highlight)}\n language={language}\n style={customStyles?.highlight}\n variant={variant}\n >\n {value}\n </SyntaxHighlighter>\n ) : (\n <pre\n className={cx(styles.highlight, classNames?.highlight)}\n style={{\n color: cssVar.colorTextDescription,\n }}\n >\n {placeholder || ' '}\n </pre>\n )}\n\n <textarea\n autoCapitalize=\"off\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoFocus={autoFocus}\n className={cx(styles.textarea, classNames?.textarea)}\n data-gramm={false}\n ref={ref}\n style={customStyles?.textarea}\n value={code}\n onChange={(e) => {\n onChange?.(e);\n setCode(e.target.value);\n }}\n {...rest}\n />\n </Flexbox>\n );\n },\n);\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;AAYA,MAAM,aAAa,MAChB,EACC,WACA,YACA,QAAQ,cACR,eAAe,IACf,UACA,cAAc,IACd,OACA,WACA,eACA,OACA,WAAW,YACX,UAAU,cACV,OACA,QACA,MACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,MAAM,WAAW,cAAc,cAAc;EAClD;EACA,UAAU;EACV;CACF,CAAC;CAED,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EACxC;EACE;EACD;EACA;EALT,UAAA,CAOG,QACC,oBAAC,mBAAD;GACE,WAAW,GAAG,OAAO,WAAW,YAAY,SAAS;GAC3C;GACV,OAAO,cAAc;GACZ;GAER,UAAA;EACgB,CAAA,IAEnB,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,WAAW,YAAY,SAAS;GACrD,OAAO,EACL,OAAO,OAAO,qBAChB;GAEC,UAAA,eAAe;EACb,CAAA,GAGP,oBAAC,YAAD;GACE,gBAAe;GACf,cAAa;GACb,aAAY;GACD;GACX,WAAW,GAAG,OAAO,UAAU,YAAY,QAAQ;GACnD,cAAY;GACP;GACL,OAAO,cAAc;GACrB,OAAO;GACP,WAAW,MAAM;IACf,WAAW,CAAC;IACZ,QAAQ,EAAE,OAAO,KAAK;GACxB;GACA,GAAI;EACL,CAAA,CACM;;AAEb,CACF;AAEA,WAAW,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Collapse.mjs","names":["Collapse","Flexbox","AntdCollapse"],"sources":["../../src/Collapse/Collapse.tsx"],"sourcesContent":["'use client';\n\nimport { Collapse as AntdCollapse, ConfigProvider } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { ChevronDown } from 'lucide-react';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { DEFAULT_PADDING, getPadding, styles, variants } from './style';\nimport type { CollapseProps } from './type';\n\nconst Collapse = memo<CollapseProps>(\n ({\n style,\n variant = 'filled',\n gap = 0,\n className,\n padding = DEFAULT_PADDING,\n size,\n collapsible = true,\n items,\n styles: customStyles,\n classNames,\n ref,\n ...rest\n }) => {\n const { isDarkMode } = useThemeMode();\n\n const antdItems = useMemo(\n () =>\n items.map(({ icon, desc, label, ...itemRest }) => {\n let content = (\n <div\n className={cx(styles.title, !icon && !desc && classNames?.header, classNames?.title)}\n style={{\n ...(!icon && !desc ? customStyles?.header : {}),\n ...customStyles?.title,\n }}\n >\n {label}\n </div>\n );\n\n if (icon) {\n content = (\n <Flexbox\n horizontal\n className={cx(styles.title, !desc && classNames?.header)}\n gap={8}\n style={desc ? undefined : customStyles?.header}\n >\n {isValidElement(icon) ? icon : <Icon icon={icon} size={{ size: '1.1em' }} />}\n {content}\n </Flexbox>\n );\n }\n\n if (desc) {\n content = (\n <Flexbox className={classNames?.header} style={customStyles?.header}>\n {content}\n <div className={cx(styles.desc, classNames?.desc)} style={customStyles?.desc}>\n {desc}\n </div>\n </Flexbox>\n );\n }\n\n return {\n label: content,\n ...itemRest,\n };\n }),\n [items, classNames, customStyles, styles],\n );\n\n return (\n <ConfigProvider\n theme={{\n components: {\n Collapse: {\n contentPadding: getPadding(typeof padding === 'object' ? padding?.body : padding),\n headerPadding: getPadding(typeof padding === 'object' ? padding?.header : padding),\n },\n },\n }}\n >\n <AntdCollapse\n ghost\n className={cx(variants({ collapsible, gap: !!gap, isDarkMode, variant }), className)}\n collapsible={collapsible ? 'header' : 'icon'}\n items={antdItems}\n ref={ref}\n size={size}\n expandIcon={({ isActive }) => (\n <Icon\n className={styles.icon}\n icon={ChevronDown}\n size={16}\n style={{ rotate: isActive ? undefined : '-90deg' }}\n />\n )}\n style={{\n gap,\n ...style,\n }}\n {...rest}\n />\n </ConfigProvider>\n );\n },\n);\n\nCollapse.displayName = 'Collapse';\n\nexport default Collapse;\n"],"mappings":";;;;;;;;;;AAaA,MAAMA,aAAW,MACd,EACC,OACA,UAAU,UACV,MAAM,GACN,WACA,UAAU,iBACV,MACA,cAAc,MACd,OACA,QAAQ,cACR,YACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,aAAa;CAEpC,MAAM,YAAY,cAEd,MAAM,KAAK,EAAE,MAAM,MAAM,OAAO,GAAG,eAAe;EAChD,IAAI,UACF,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,CAAC,QAAQ,YAAY,QAAQ,YAAY,KAAK;GACnF,OAAO;IACL,GAAI,CAAC,QAAQ,CAAC,OAAO,cAAc,SAAS,CAAC;IAC7C,GAAG,cAAc;GACnB;
|
|
1
|
+
{"version":3,"file":"Collapse.mjs","names":["Collapse","Flexbox","AntdCollapse"],"sources":["../../src/Collapse/Collapse.tsx"],"sourcesContent":["'use client';\n\nimport { Collapse as AntdCollapse, ConfigProvider } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { ChevronDown } from 'lucide-react';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { DEFAULT_PADDING, getPadding, styles, variants } from './style';\nimport type { CollapseProps } from './type';\n\nconst Collapse = memo<CollapseProps>(\n ({\n style,\n variant = 'filled',\n gap = 0,\n className,\n padding = DEFAULT_PADDING,\n size,\n collapsible = true,\n items,\n styles: customStyles,\n classNames,\n ref,\n ...rest\n }) => {\n const { isDarkMode } = useThemeMode();\n\n const antdItems = useMemo(\n () =>\n items.map(({ icon, desc, label, ...itemRest }) => {\n let content = (\n <div\n className={cx(styles.title, !icon && !desc && classNames?.header, classNames?.title)}\n style={{\n ...(!icon && !desc ? customStyles?.header : {}),\n ...customStyles?.title,\n }}\n >\n {label}\n </div>\n );\n\n if (icon) {\n content = (\n <Flexbox\n horizontal\n className={cx(styles.title, !desc && classNames?.header)}\n gap={8}\n style={desc ? undefined : customStyles?.header}\n >\n {isValidElement(icon) ? icon : <Icon icon={icon} size={{ size: '1.1em' }} />}\n {content}\n </Flexbox>\n );\n }\n\n if (desc) {\n content = (\n <Flexbox className={classNames?.header} style={customStyles?.header}>\n {content}\n <div className={cx(styles.desc, classNames?.desc)} style={customStyles?.desc}>\n {desc}\n </div>\n </Flexbox>\n );\n }\n\n return {\n label: content,\n ...itemRest,\n };\n }),\n [items, classNames, customStyles, styles],\n );\n\n return (\n <ConfigProvider\n theme={{\n components: {\n Collapse: {\n contentPadding: getPadding(typeof padding === 'object' ? padding?.body : padding),\n headerPadding: getPadding(typeof padding === 'object' ? padding?.header : padding),\n },\n },\n }}\n >\n <AntdCollapse\n ghost\n className={cx(variants({ collapsible, gap: !!gap, isDarkMode, variant }), className)}\n collapsible={collapsible ? 'header' : 'icon'}\n items={antdItems}\n ref={ref}\n size={size}\n expandIcon={({ isActive }) => (\n <Icon\n className={styles.icon}\n icon={ChevronDown}\n size={16}\n style={{ rotate: isActive ? undefined : '-90deg' }}\n />\n )}\n style={{\n gap,\n ...style,\n }}\n {...rest}\n />\n </ConfigProvider>\n );\n },\n);\n\nCollapse.displayName = 'Collapse';\n\nexport default Collapse;\n"],"mappings":";;;;;;;;;;AAaA,MAAMA,aAAW,MACd,EACC,OACA,UAAU,UACV,MAAM,GACN,WACA,UAAU,iBACV,MACA,cAAc,MACd,OACA,QAAQ,cACR,YACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,aAAa;CAEpC,MAAM,YAAY,cAEd,MAAM,KAAK,EAAE,MAAM,MAAM,OAAO,GAAG,eAAe;EAChD,IAAI,UACF,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,CAAC,QAAQ,YAAY,QAAQ,YAAY,KAAK;GACnF,OAAO;IACL,GAAI,CAAC,QAAQ,CAAC,OAAO,cAAc,SAAS,CAAC;IAC7C,GAAG,cAAc;GACnB;GAEC,UAAA;EACE,CAAA;EAGP,IAAI,MACF,UACE,qBAACC,mBAAD;GACE,YAAA;GACA,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,YAAY,MAAM;GACvD,KAAK;GACL,OAAO,OAAO,KAAA,IAAY,cAAc;GAJ1C,UAAA,CAMG,eAAe,IAAI,IAAI,OAAO,oBAAC,MAAD;IAAY;IAAM,MAAM,EAAE,MAAM,QAAQ;GAAI,CAAA,GAC1E,OACM;;EAIb,IAAI,MACF,UACE,qBAACA,mBAAD;GAAS,WAAW,YAAY;GAAQ,OAAO,cAAc;GAA7D,UAAA,CACG,SACD,oBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,MAAM,YAAY,IAAI;IAAG,OAAO,cAAc;IACrE,UAAA;GACE,CAAA,CACE;;EAIb,OAAO;GACL,OAAO;GACP,GAAG;EACL;CACF,CAAC,GACH;EAAC;EAAO;EAAY;EAAc;CAAM,CAC1C;CAEA,OACE,oBAAC,gBAAD;EACE,OAAO,EACL,YAAY,EACV,UAAU;GACR,gBAAgB,WAAW,OAAO,YAAY,WAAW,SAAS,OAAO,OAAO;GAChF,eAAe,WAAW,OAAO,YAAY,WAAW,SAAS,SAAS,OAAO;EACnF,EACF,EACF;EAEA,UAAA,oBAACC,UAAD;GACE,OAAA;GACA,WAAW,GAAG,SAAS;IAAE;IAAa,KAAK,CAAC,CAAC;IAAK;IAAY;GAAQ,CAAC,GAAG,SAAS;GACnF,aAAa,cAAc,WAAW;GACtC,OAAO;GACF;GACC;GACN,aAAa,EAAE,eACb,oBAAC,MAAD;IACE,WAAW,OAAO;IAClB,MAAM;IACN,MAAM;IACN,OAAO,EAAE,QAAQ,WAAW,KAAA,IAAY,SAAS;GAClD,CAAA;GAEH,OAAO;IACL;IACA,GAAG;GACL;GACA,GAAI;EACL,CAAA;CACa,CAAA;AAEpB,CACF;AAEA,WAAS,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorSwatches.mjs","names":["Flexbox"],"sources":["../../src/ColorSwatches/ColorSwatches.tsx"],"sourcesContent":["'use client';\n\nimport { ColorPicker } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { CheckIcon } from 'lucide-react';\nimport { rgba } from 'polished';\nimport { type FC, useMemo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles } from './style';\nimport type { ColorSwatchesProps } from './type';\n\nconst ColorSwatches: FC<ColorSwatchesProps> = ({\n enableColorPicker,\n enableColorSwatches = true,\n defaultValue,\n value,\n style,\n colors,\n onChange,\n size = 24,\n shape = 'circle',\n texts,\n ref,\n ...rest\n}) => {\n const [active, setActive] = useMergeState(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n // Convert size prop to CSS variable\n const cssVariables = useMemo<Record<string, string>>(\n () => ({\n '--color-swatches-size': `${size}px`,\n }),\n [size],\n );\n\n const isCustomActive = useMemo(\n () => active && active !== cssVar.colorPrimary && !colors.some((c) => c.color === active),\n [active, colors],\n );\n\n return (\n <Flexbox\n horizontal\n gap={6}\n ref={ref}\n style={{\n ...cssVariables,\n flexWrap: 'wrap',\n ...style,\n }}\n {...rest}\n >\n {enableColorSwatches &&\n colors.map((c, i) => {\n const color = c.color || cssVar.colorPrimary;\n const isActive = (!active && !c.color) || color === active;\n // Check if color is transparent or CSS variable (which chroma can't parse)\n const isTransparent =\n c.color === 'transparent' ||\n (c.color &&\n !c.color.startsWith('var(') &&\n (() => {\n try {\n return chroma(c.color).alpha() === 0;\n } catch {\n return false;\n }\n })());\n // Get actual color value for readableColor (CSS variables can't be parsed)\n const actualColorForReadable = c.color?.startsWith('var(') ? cssVar.colorPrimary : color;\n return (\n <Tooltip key={c?.key || i} title={c.title}>\n <Center\n className={cx(\n styles.container,\n isTransparent && styles.transparent,\n isActive && styles.active,\n )}\n style={{\n background: isTransparent ? undefined : color,\n borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n }}\n onClick={() => setActive(c.color || undefined)}\n >\n {isActive && (\n <Icon\n color={rgba(safeReadableColor(actualColorForReadable), 0.33)}\n icon={CheckIcon}\n size={{ size: 14, strokeWidth: 4 }}\n style={{\n pointerEvents: 'none',\n }}\n />\n )}\n </Center>\n </Tooltip>\n );\n })}\n {enableColorPicker && (\n <Tooltip title={texts?.custom || 'Custom'}>\n <ColorPicker\n disabledAlpha\n arrow={false}\n defaultValue={cssVar.colorPrimary}\n format={'hex'}\n value={enableColorSwatches ? undefined : active}\n className={cx(\n styles.picker,\n enableColorSwatches && styles.conic,\n isCustomActive && styles.active,\n )}\n presets={\n enableColorSwatches\n ? undefined\n : [\n {\n colors: colors.map((c) => c.color),\n label: texts?.presets || 'Presets',\n },\n ]\n }\n style={{\n borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n }}\n onChangeComplete={(c) => {\n if (c.toHexString() === cssVar.colorPrimary) {\n setActive('');\n } else {\n setActive(c.toHexString());\n }\n }}\n />\n </Tooltip>\n )}\n </Flexbox>\n );\n};\n\nColorSwatches.displayName = 'ColorSwatches';\n\nexport default ColorSwatches;\n"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAM,iBAAyC,EAC7C,mBACA,sBAAsB,MACtB,cACA,OACA,OACA,QACA,UACA,OAAO,IACP,QAAQ,UACR,OACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,cAAc,cAAc;EACtD;EACA;EACA;CACF,CAAC;CAGD,MAAM,eAAe,eACZ,EACL,yBAAyB,GAAG,KAAK,IACnC,IACA,CAAC,IAAI,CACP;CAEA,MAAM,iBAAiB,cACf,UAAU,WAAW,OAAO,gBAAgB,CAAC,OAAO,MAAM,MAAM,EAAE,UAAU,MAAM,GACxF,CAAC,QAAQ,MAAM,CACjB;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,KAAK;EACA;EACL,OAAO;GACL,GAAG;GACH,UAAU;GACV,GAAG;EACL;EACA,GAAI;
|
|
1
|
+
{"version":3,"file":"ColorSwatches.mjs","names":["Flexbox"],"sources":["../../src/ColorSwatches/ColorSwatches.tsx"],"sourcesContent":["'use client';\n\nimport { ColorPicker } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { CheckIcon } from 'lucide-react';\nimport { rgba } from 'polished';\nimport { type FC, useMemo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles } from './style';\nimport type { ColorSwatchesProps } from './type';\n\nconst ColorSwatches: FC<ColorSwatchesProps> = ({\n enableColorPicker,\n enableColorSwatches = true,\n defaultValue,\n value,\n style,\n colors,\n onChange,\n size = 24,\n shape = 'circle',\n texts,\n ref,\n ...rest\n}) => {\n const [active, setActive] = useMergeState(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n // Convert size prop to CSS variable\n const cssVariables = useMemo<Record<string, string>>(\n () => ({\n '--color-swatches-size': `${size}px`,\n }),\n [size],\n );\n\n const isCustomActive = useMemo(\n () => active && active !== cssVar.colorPrimary && !colors.some((c) => c.color === active),\n [active, colors],\n );\n\n return (\n <Flexbox\n horizontal\n gap={6}\n ref={ref}\n style={{\n ...cssVariables,\n flexWrap: 'wrap',\n ...style,\n }}\n {...rest}\n >\n {enableColorSwatches &&\n colors.map((c, i) => {\n const color = c.color || cssVar.colorPrimary;\n const isActive = (!active && !c.color) || color === active;\n // Check if color is transparent or CSS variable (which chroma can't parse)\n const isTransparent =\n c.color === 'transparent' ||\n (c.color &&\n !c.color.startsWith('var(') &&\n (() => {\n try {\n return chroma(c.color).alpha() === 0;\n } catch {\n return false;\n }\n })());\n // Get actual color value for readableColor (CSS variables can't be parsed)\n const actualColorForReadable = c.color?.startsWith('var(') ? cssVar.colorPrimary : color;\n return (\n <Tooltip key={c?.key || i} title={c.title}>\n <Center\n className={cx(\n styles.container,\n isTransparent && styles.transparent,\n isActive && styles.active,\n )}\n style={{\n background: isTransparent ? undefined : color,\n borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n }}\n onClick={() => setActive(c.color || undefined)}\n >\n {isActive && (\n <Icon\n color={rgba(safeReadableColor(actualColorForReadable), 0.33)}\n icon={CheckIcon}\n size={{ size: 14, strokeWidth: 4 }}\n style={{\n pointerEvents: 'none',\n }}\n />\n )}\n </Center>\n </Tooltip>\n );\n })}\n {enableColorPicker && (\n <Tooltip title={texts?.custom || 'Custom'}>\n <ColorPicker\n disabledAlpha\n arrow={false}\n defaultValue={cssVar.colorPrimary}\n format={'hex'}\n value={enableColorSwatches ? undefined : active}\n className={cx(\n styles.picker,\n enableColorSwatches && styles.conic,\n isCustomActive && styles.active,\n )}\n presets={\n enableColorSwatches\n ? undefined\n : [\n {\n colors: colors.map((c) => c.color),\n label: texts?.presets || 'Presets',\n },\n ]\n }\n style={{\n borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n }}\n onChangeComplete={(c) => {\n if (c.toHexString() === cssVar.colorPrimary) {\n setActive('');\n } else {\n setActive(c.toHexString());\n }\n }}\n />\n </Tooltip>\n )}\n </Flexbox>\n );\n};\n\nColorSwatches.displayName = 'ColorSwatches';\n\nexport default ColorSwatches;\n"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAM,iBAAyC,EAC7C,mBACA,sBAAsB,MACtB,cACA,OACA,OACA,QACA,UACA,OAAO,IACP,QAAQ,UACR,OACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,cAAc,cAAc;EACtD;EACA;EACA;CACF,CAAC;CAGD,MAAM,eAAe,eACZ,EACL,yBAAyB,GAAG,KAAK,IACnC,IACA,CAAC,IAAI,CACP;CAEA,MAAM,iBAAiB,cACf,UAAU,WAAW,OAAO,gBAAgB,CAAC,OAAO,MAAM,MAAM,EAAE,UAAU,MAAM,GACxF,CAAC,QAAQ,MAAM,CACjB;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,KAAK;EACA;EACL,OAAO;GACL,GAAG;GACH,UAAU;GACV,GAAG;EACL;EACA,GAAI;EATN,UAAA,CAWG,uBACC,OAAO,KAAK,GAAG,MAAM;GACnB,MAAM,QAAQ,EAAE,SAAS,OAAO;GAChC,MAAM,WAAY,CAAC,UAAU,CAAC,EAAE,SAAU,UAAU;GAEpD,MAAM,gBACJ,EAAE,UAAU,iBACX,EAAE,SACD,CAAC,EAAE,MAAM,WAAW,MAAM,YACnB;IACL,IAAI;KACF,OAAO,OAAO,EAAE,KAAK,CAAC,CAAC,MAAM,MAAM;IACrC,QAAQ;KACN,OAAO;IACT;GACF,EAAA,CAAG;GAEP,MAAM,yBAAyB,EAAE,OAAO,WAAW,MAAM,IAAI,OAAO,eAAe;GACnF,OACE,oBAAC,SAAD;IAA2B,OAAO,EAAE;IAClC,UAAA,oBAAC,QAAD;KACE,WAAW,GACT,OAAO,WACP,iBAAiB,OAAO,aACxB,YAAY,OAAO,MACrB;KACA,OAAO;MACL,YAAY,gBAAgB,KAAA,IAAY;MACxC,cAAc,UAAU,WAAW,QAAQ,OAAO;KACpD;KACA,eAAe,UAAU,EAAE,SAAS,KAAA,CAAS;KAE5C,UAAA,YACC,oBAAC,MAAD;MACE,OAAO,KAAK,kBAAkB,sBAAsB,GAAG,GAAI;MAC3D,MAAM;MACN,MAAM;OAAE,MAAM;OAAI,aAAa;MAAE;MACjC,OAAO,EACL,eAAe,OACjB;KACD,CAAA;IAEG,CAAA;GACD,GAxBK,GAAG,OAAO,CAwBf;EAEb,CAAC,GACF,qBACC,oBAAC,SAAD;GAAS,OAAO,OAAO,UAAU;GAC/B,UAAA,oBAAC,aAAD;IACE,eAAA;IACA,OAAO;IACP,cAAc,OAAO;IACrB,QAAQ;IACR,OAAO,sBAAsB,KAAA,IAAY;IACzC,WAAW,GACT,OAAO,QACP,uBAAuB,OAAO,OAC9B,kBAAkB,OAAO,MAC3B;IACA,SACE,sBACI,KAAA,IACA,CACE;KACE,QAAQ,OAAO,KAAK,MAAM,EAAE,KAAK;KACjC,OAAO,OAAO,WAAW;IAC3B,CACF;IAEN,OAAO,EACL,cAAc,UAAU,WAAW,QAAQ,OAAO,aACpD;IACA,mBAAmB,MAAM;KACvB,IAAI,EAAE,YAAY,MAAM,OAAO,cAC7B,UAAU,EAAE;UAEZ,UAAU,EAAE,YAAY,CAAC;IAE7B;GACD,CAAA;EACM,CAAA,CAEJ;;AAEb;AAEA,cAAc,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/ConfigProvider/index.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type ElementType,\n memo,\n type ReactNode,\n use,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type I18nContextValue,\n type TranslationKey,\n type TranslationResourcesInput,\n type TranslationResourcesMap,\n} from '@/i18n/types';\nimport { MotionComponent, type MotionComponentType } from '@/MotionProvider';\nimport { type CDN, type CdnApi, genCdnUrl } from '@/utils/genCdnUrl';\n\nexport interface Config {\n aAs?: ElementType;\n customCdnFn?: CdnFn;\n imgAs?: ElementType;\n imgUnoptimized?: boolean;\n proxy?: CDN | 'custom';\n}\n\nexport const ConfigContext = createContext<Config | null>(null);\n\n// Internal i18n context\nconst I18nContextInternal = createContext<I18nContextValue>({\n locale: 'en',\n t: (key: TranslationKey) => key,\n});\n\nexport interface ConfigProviderProps {\n children: ReactNode;\n config?: Config;\n // i18n props - flattened at top level\n locale?: string;\n motion: MotionComponentType;\n resources?: TranslationResourcesInput;\n}\n\nconst isThenable = (value: unknown): value is Promise<TranslationResourcesMap> =>\n typeof (value as { then?: unknown })?.then === 'function';\n\nconst ConfigProvider = memo<ConfigProviderProps>(\n ({ children, config, locale, resources, motion }) => {\n const fallbackLocale = locale ?? 'en';\n const [resolvedResources, setResolvedResources] = useState<TranslationResourcesMap | undefined>(\n () => (resources && !isThenable(resources) ? resources : undefined),\n );\n const [resolvedLocale, setResolvedLocale] = useState(fallbackLocale);\n const latestRequestId = useRef(0);\n\n useEffect(() => {\n const requestId = ++latestRequestId.current;\n\n if (!resources) {\n setResolvedResources(undefined);\n setResolvedLocale(fallbackLocale);\n return;\n }\n\n if (isThenable(resources)) {\n const targetLocale = fallbackLocale;\n resources\n .then((nextResources) => {\n if (latestRequestId.current !== requestId) return;\n setResolvedResources(nextResources);\n setResolvedLocale(targetLocale);\n })\n .catch(() => {\n if (latestRequestId.current !== requestId) return;\n });\n return;\n }\n\n setResolvedResources(resources);\n setResolvedLocale(fallbackLocale);\n }, [fallbackLocale, resources]);\n\n const currentResources = isThenable(resources) ? resolvedResources : resources;\n const currentLocale = isThenable(resources) ? resolvedLocale : fallbackLocale;\n\n const i18nValue = useMemo((): I18nContextValue => {\n const resourceList = Array.isArray(currentResources)\n ? currentResources\n : currentResources\n ? Object.values(currentResources)\n : [];\n const mergedResources = Object.assign({}, ...resourceList);\n const t = (key: TranslationKey): string => mergedResources[key] || key;\n return { locale: currentLocale, t };\n }, [currentLocale, currentResources]);\n\n return (\n <I18nContextInternal value={i18nValue}>\n <ConfigContext value={config ?? null}>\n <MotionComponent value={motion}>{children}</MotionComponent>\n </ConfigContext>\n </I18nContextInternal>\n );\n },\n);\n\n// useCdnFn\nexport type CdnFn = ({ pkg, version, path }: CdnApi) => string;\n\nconst cdnFallback: CdnFn = ({ pkg, version, path }) =>\n genCdnUrl({ path, pkg, proxy: 'aliyun', version });\n\nexport const useCdnFn = (): CdnFn => {\n const config = use(ConfigContext);\n if (!config) return cdnFallback;\n if (config?.proxy !== 'custom')\n return ({ pkg, version, path }) =>\n genCdnUrl({ path, pkg, proxy: config.proxy as any, version });\n return config?.customCdnFn || cdnFallback;\n};\n\n// useI18n hook\nexport const useI18n = () => use(I18nContextInternal);\n\n// Export I18nContext for external reference\nexport { I18nContextInternal as I18nContext };\n\nexport default ConfigProvider;\n"],"mappings":";;;;;;AA+BA,MAAa,gBAAgB,cAA6B,IAAI;AAG9D,MAAM,sBAAsB,cAAgC;CAC1D,QAAQ;CACR,IAAI,QAAwB;AAC9B,CAAC;AAWD,MAAM,cAAc,UAClB,OAAQ,OAA8B,SAAS;AAEjD,MAAM,iBAAiB,MACpB,EAAE,UAAU,QAAQ,QAAQ,WAAW,aAAa;CACnD,MAAM,iBAAiB,UAAU;CACjC,MAAM,CAAC,mBAAmB,wBAAwB,eACzC,aAAa,CAAC,WAAW,SAAS,IAAI,YAAY,KAAA,CAC3D;CACA,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,cAAc;CACnE,MAAM,kBAAkB,OAAO,CAAC;CAEhC,gBAAgB;EACd,MAAM,YAAY,EAAE,gBAAgB;EAEpC,IAAI,CAAC,WAAW;GACd,qBAAqB,KAAA,CAAS;GAC9B,kBAAkB,cAAc;GAChC;EACF;EAEA,IAAI,WAAW,SAAS,GAAG;GACzB,MAAM,eAAe;GACrB,UACG,MAAM,kBAAkB;IACvB,IAAI,gBAAgB,YAAY,WAAW;IAC3C,qBAAqB,aAAa;IAClC,kBAAkB,YAAY;GAChC,CAAC,CAAC,CACD,YAAY;IACX,IAAI,gBAAgB,YAAY,WAAW;GAC7C,CAAC;GACH;EACF;EAEA,qBAAqB,SAAS;EAC9B,kBAAkB,cAAc;CAClC,GAAG,CAAC,gBAAgB,SAAS,CAAC;CAE9B,MAAM,mBAAmB,WAAW,SAAS,IAAI,oBAAoB;CACrE,MAAM,gBAAgB,WAAW,SAAS,IAAI,iBAAiB;CAE/D,MAAM,YAAY,cAAgC;EAChD,MAAM,eAAe,MAAM,QAAQ,gBAAgB,IAC/C,mBACA,mBACE,OAAO,OAAO,gBAAgB,IAC9B,CAAC;EACP,MAAM,kBAAkB,OAAO,OAAO,CAAC,GAAG,GAAG,YAAY;EACzD,MAAM,KAAK,QAAgC,gBAAgB,QAAQ;EACnE,OAAO;GAAE,QAAQ;GAAe;EAAE;CACpC,GAAG,CAAC,eAAe,gBAAgB,CAAC;CAEpC,OACE,oBAAC,qBAAD;EAAqB,OAAO;
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/ConfigProvider/index.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type ElementType,\n memo,\n type ReactNode,\n use,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type I18nContextValue,\n type TranslationKey,\n type TranslationResourcesInput,\n type TranslationResourcesMap,\n} from '@/i18n/types';\nimport { MotionComponent, type MotionComponentType } from '@/MotionProvider';\nimport { type CDN, type CdnApi, genCdnUrl } from '@/utils/genCdnUrl';\n\nexport interface Config {\n aAs?: ElementType;\n customCdnFn?: CdnFn;\n imgAs?: ElementType;\n imgUnoptimized?: boolean;\n proxy?: CDN | 'custom';\n}\n\nexport const ConfigContext = createContext<Config | null>(null);\n\n// Internal i18n context\nconst I18nContextInternal = createContext<I18nContextValue>({\n locale: 'en',\n t: (key: TranslationKey) => key,\n});\n\nexport interface ConfigProviderProps {\n children: ReactNode;\n config?: Config;\n // i18n props - flattened at top level\n locale?: string;\n motion: MotionComponentType;\n resources?: TranslationResourcesInput;\n}\n\nconst isThenable = (value: unknown): value is Promise<TranslationResourcesMap> =>\n typeof (value as { then?: unknown })?.then === 'function';\n\nconst ConfigProvider = memo<ConfigProviderProps>(\n ({ children, config, locale, resources, motion }) => {\n const fallbackLocale = locale ?? 'en';\n const [resolvedResources, setResolvedResources] = useState<TranslationResourcesMap | undefined>(\n () => (resources && !isThenable(resources) ? resources : undefined),\n );\n const [resolvedLocale, setResolvedLocale] = useState(fallbackLocale);\n const latestRequestId = useRef(0);\n\n useEffect(() => {\n const requestId = ++latestRequestId.current;\n\n if (!resources) {\n setResolvedResources(undefined);\n setResolvedLocale(fallbackLocale);\n return;\n }\n\n if (isThenable(resources)) {\n const targetLocale = fallbackLocale;\n resources\n .then((nextResources) => {\n if (latestRequestId.current !== requestId) return;\n setResolvedResources(nextResources);\n setResolvedLocale(targetLocale);\n })\n .catch(() => {\n if (latestRequestId.current !== requestId) return;\n });\n return;\n }\n\n setResolvedResources(resources);\n setResolvedLocale(fallbackLocale);\n }, [fallbackLocale, resources]);\n\n const currentResources = isThenable(resources) ? resolvedResources : resources;\n const currentLocale = isThenable(resources) ? resolvedLocale : fallbackLocale;\n\n const i18nValue = useMemo((): I18nContextValue => {\n const resourceList = Array.isArray(currentResources)\n ? currentResources\n : currentResources\n ? Object.values(currentResources)\n : [];\n const mergedResources = Object.assign({}, ...resourceList);\n const t = (key: TranslationKey): string => mergedResources[key] || key;\n return { locale: currentLocale, t };\n }, [currentLocale, currentResources]);\n\n return (\n <I18nContextInternal value={i18nValue}>\n <ConfigContext value={config ?? null}>\n <MotionComponent value={motion}>{children}</MotionComponent>\n </ConfigContext>\n </I18nContextInternal>\n );\n },\n);\n\n// useCdnFn\nexport type CdnFn = ({ pkg, version, path }: CdnApi) => string;\n\nconst cdnFallback: CdnFn = ({ pkg, version, path }) =>\n genCdnUrl({ path, pkg, proxy: 'aliyun', version });\n\nexport const useCdnFn = (): CdnFn => {\n const config = use(ConfigContext);\n if (!config) return cdnFallback;\n if (config?.proxy !== 'custom')\n return ({ pkg, version, path }) =>\n genCdnUrl({ path, pkg, proxy: config.proxy as any, version });\n return config?.customCdnFn || cdnFallback;\n};\n\n// useI18n hook\nexport const useI18n = () => use(I18nContextInternal);\n\n// Export I18nContext for external reference\nexport { I18nContextInternal as I18nContext };\n\nexport default ConfigProvider;\n"],"mappings":";;;;;;AA+BA,MAAa,gBAAgB,cAA6B,IAAI;AAG9D,MAAM,sBAAsB,cAAgC;CAC1D,QAAQ;CACR,IAAI,QAAwB;AAC9B,CAAC;AAWD,MAAM,cAAc,UAClB,OAAQ,OAA8B,SAAS;AAEjD,MAAM,iBAAiB,MACpB,EAAE,UAAU,QAAQ,QAAQ,WAAW,aAAa;CACnD,MAAM,iBAAiB,UAAU;CACjC,MAAM,CAAC,mBAAmB,wBAAwB,eACzC,aAAa,CAAC,WAAW,SAAS,IAAI,YAAY,KAAA,CAC3D;CACA,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,cAAc;CACnE,MAAM,kBAAkB,OAAO,CAAC;CAEhC,gBAAgB;EACd,MAAM,YAAY,EAAE,gBAAgB;EAEpC,IAAI,CAAC,WAAW;GACd,qBAAqB,KAAA,CAAS;GAC9B,kBAAkB,cAAc;GAChC;EACF;EAEA,IAAI,WAAW,SAAS,GAAG;GACzB,MAAM,eAAe;GACrB,UACG,MAAM,kBAAkB;IACvB,IAAI,gBAAgB,YAAY,WAAW;IAC3C,qBAAqB,aAAa;IAClC,kBAAkB,YAAY;GAChC,CAAC,CAAC,CACD,YAAY;IACX,IAAI,gBAAgB,YAAY,WAAW;GAC7C,CAAC;GACH;EACF;EAEA,qBAAqB,SAAS;EAC9B,kBAAkB,cAAc;CAClC,GAAG,CAAC,gBAAgB,SAAS,CAAC;CAE9B,MAAM,mBAAmB,WAAW,SAAS,IAAI,oBAAoB;CACrE,MAAM,gBAAgB,WAAW,SAAS,IAAI,iBAAiB;CAE/D,MAAM,YAAY,cAAgC;EAChD,MAAM,eAAe,MAAM,QAAQ,gBAAgB,IAC/C,mBACA,mBACE,OAAO,OAAO,gBAAgB,IAC9B,CAAC;EACP,MAAM,kBAAkB,OAAO,OAAO,CAAC,GAAG,GAAG,YAAY;EACzD,MAAM,KAAK,QAAgC,gBAAgB,QAAQ;EACnE,OAAO;GAAE,QAAQ;GAAe;EAAE;CACpC,GAAG,CAAC,eAAe,gBAAgB,CAAC;CAEpC,OACE,oBAAC,qBAAD;EAAqB,OAAO;EAC1B,UAAA,oBAAC,eAAD;GAAe,OAAO,UAAU;GAC9B,UAAA,oBAAC,iBAAD;IAAiB,OAAO;IAAS;GAA0B,CAAA;EAC9C,CAAA;CACI,CAAA;AAEzB,CACF;AAKA,MAAM,eAAsB,EAAE,KAAK,SAAS,WAC1C,UAAU;CAAE;CAAM;CAAK,OAAO;CAAU;AAAQ,CAAC;AAEnD,MAAa,iBAAwB;CACnC,MAAM,SAAS,IAAI,aAAa;CAChC,IAAI,CAAC,QAAQ,OAAO;CACpB,IAAI,QAAQ,UAAU,UACpB,QAAQ,EAAE,KAAK,SAAS,WACtB,UAAU;EAAE;EAAM;EAAK,OAAO,OAAO;EAAc;CAAQ,CAAC;CAChE,OAAO,QAAQ,eAAe;AAChC;AAGA,MAAa,gBAAgB,IAAI,mBAAmB"}
|
|
@@ -2,6 +2,6 @@ import { IconSpaceMode } from "../Menu/renderUtils.mjs";
|
|
|
2
2
|
import { ContextMenuCheckboxItem, ContextMenuItem, ContextMenuSwitchItem } from "../base-ui/ContextMenu/type.mjs";
|
|
3
3
|
import { ContextMenuTrigger, ContextMenuTriggerProps } from "../base-ui/ContextMenu/ContextMenuTrigger.mjs";
|
|
4
4
|
import { ContextMenuHost } from "../base-ui/ContextMenu/ContextMenuHost.mjs";
|
|
5
|
-
import { ShowContextMenuOptions, closeContextMenu, showContextMenu, updateContextMenuItems } from "../base-ui/ContextMenu/store.mjs";
|
|
5
|
+
import { ContextMenuInterceptor, ShowContextMenuOptions, closeContextMenu, setContextMenuInterceptor, showContextMenu, updateContextMenuItems } from "../base-ui/ContextMenu/store.mjs";
|
|
6
6
|
import "../base-ui/ContextMenu/index.mjs";
|
|
7
|
-
export { type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuItem, type ContextMenuSwitchItem, ContextMenuTrigger, type ContextMenuTriggerProps, type IconSpaceMode, type ShowContextMenuOptions, closeContextMenu, showContextMenu, updateContextMenuItems };
|
|
7
|
+
export { type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuInterceptor, type ContextMenuItem, type ContextMenuSwitchItem, ContextMenuTrigger, type ContextMenuTriggerProps, type IconSpaceMode, type ShowContextMenuOptions, closeContextMenu, setContextMenuInterceptor, showContextMenu, updateContextMenuItems };
|
package/es/ContextMenu/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { closeContextMenu, showContextMenu, updateContextMenuItems } from "../base-ui/ContextMenu/store.mjs";
|
|
1
|
+
import { closeContextMenu, setContextMenuInterceptor, showContextMenu, updateContextMenuItems } from "../base-ui/ContextMenu/store.mjs";
|
|
2
2
|
import { ContextMenuHost } from "../base-ui/ContextMenu/ContextMenuHost.mjs";
|
|
3
3
|
import { ContextMenuTrigger } from "../base-ui/ContextMenu/ContextMenuTrigger.mjs";
|
|
4
|
-
export { ContextMenuHost, ContextMenuTrigger, closeContextMenu, showContextMenu, updateContextMenuItems };
|
|
4
|
+
export { ContextMenuHost, ContextMenuTrigger, closeContextMenu, setContextMenuInterceptor, showContextMenu, updateContextMenuItems };
|