@dpocean/chatui 1.0.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/LICENSE +21 -0
- package/README.md +119 -0
- package/README.zh-CN.md +123 -0
- package/dist/index.css +1 -0
- package/dist/index.js +1 -0
- package/es/components/Avatar/index.js +21 -0
- package/es/components/Avatar/style.less +26 -0
- package/es/components/BackBottom/index.js +28 -0
- package/es/components/BackBottom/style.less +15 -0
- package/es/components/Backdrop/index.js +17 -0
- package/es/components/Backdrop/style.less +17 -0
- package/es/components/Bubble/index.js +17 -0
- package/es/components/Bubble/style.less +59 -0
- package/es/components/Button/index.js +45 -0
- package/es/components/Button/style.less +114 -0
- package/es/components/Card/Card.js +20 -0
- package/es/components/Card/CardActions.js +14 -0
- package/es/components/Card/CardContent.js +13 -0
- package/es/components/Card/CardHeader.js +52 -0
- package/es/components/Card/CardMedia.js +30 -0
- package/es/components/Card/CardText.js +13 -0
- package/es/components/Card/CardTitle.js +24 -0
- package/es/components/Card/index.js +7 -0
- package/es/components/Card/style.less +239 -0
- package/es/components/Carousel/Item.js +11 -0
- package/es/components/Carousel/index.js +369 -0
- package/es/components/Carousel/style.less +55 -0
- package/es/components/Chat/index.js +157 -0
- package/es/components/Chat/style.less +68 -0
- package/es/components/Checkbox/Checkbox.js +27 -0
- package/es/components/Checkbox/CheckboxGroup.js +43 -0
- package/es/components/Checkbox/index.js +2 -0
- package/es/components/ClickOutside/index.js +31 -0
- package/es/components/ComponentsProvider/ComponentsContext.js +10 -0
- package/es/components/ComponentsProvider/index.js +90 -0
- package/es/components/ComponentsProvider/interface.js +1 -0
- package/es/components/ComponentsProvider/useComponents.js +5 -0
- package/es/components/Composer/AccessoryWrap.js +9 -0
- package/es/components/Composer/Action.js +11 -0
- package/es/components/Composer/ComposerInput.js +58 -0
- package/es/components/Composer/SendButton.js +29 -0
- package/es/components/Composer/ToolbarItem.js +14 -0
- package/es/components/Composer/index.js +344 -0
- package/es/components/Composer/riseInput.js +49 -0
- package/es/components/Composer/style.less +103 -0
- package/es/components/Composer/viewportTop.js +22 -0
- package/es/components/ConfigProvider/index.js +44 -0
- package/es/components/ConfigProvider/locales/en_US.js +37 -0
- package/es/components/ConfigProvider/locales/es.js +37 -0
- package/es/components/ConfigProvider/locales/hi.js +37 -0
- package/es/components/ConfigProvider/locales/id.js +37 -0
- package/es/components/ConfigProvider/locales/index.js +20 -0
- package/es/components/ConfigProvider/locales/pt.js +37 -0
- package/es/components/ConfigProvider/locales/ur.js +37 -0
- package/es/components/ConfigProvider/locales/vi.js +37 -0
- package/es/components/ConfigProvider/locales/zh_CN.js +40 -0
- package/es/components/Countdown/index.js +22 -0
- package/es/components/Countdown/style.less +14 -0
- package/es/components/Coupon/index.js +84 -0
- package/es/components/Coupon/style.less +145 -0
- package/es/components/Divider/index.js +16 -0
- package/es/components/Divider/style.less +44 -0
- package/es/components/Empty/index.js +45 -0
- package/es/components/Empty/style.less +26 -0
- package/es/components/ErrorBoundary/index.js +58 -0
- package/es/components/FileCard/index.js +38 -0
- package/es/components/FileCard/style.less +63 -0
- package/es/components/Filter/index.js +200 -0
- package/es/components/Filter/style.less +96 -0
- package/es/components/Flex/Flex.js +52 -0
- package/es/components/Flex/FlexItem.js +25 -0
- package/es/components/Flex/index.js +2 -0
- package/es/components/Flex/style.less +78 -0
- package/es/components/Form/Form.js +20 -0
- package/es/components/Form/FormActions.js +12 -0
- package/es/components/Form/FormItem.js +19 -0
- package/es/components/Form/index.js +3 -0
- package/es/components/Form/style.less +64 -0
- package/es/components/Goods/index.js +126 -0
- package/es/components/Goods/style.less +119 -0
- package/es/components/HelpText/index.js +11 -0
- package/es/components/HelpText/style.less +4 -0
- package/es/components/Icon/index.js +24 -0
- package/es/components/Icon/style.less +21 -0
- package/es/components/IconButton/index.js +22 -0
- package/es/components/IconButton/style.less +25 -0
- package/es/components/Image/index.js +54 -0
- package/es/components/Image/style.less +11 -0
- package/es/components/ImageList/index.js +29 -0
- package/es/components/ImageList/style.less +20 -0
- package/es/components/InfiniteScroll/index.js +35 -0
- package/es/components/InfiniteScroll/style.less +4 -0
- package/es/components/Input/index.js +118 -0
- package/es/components/Input/style.less +74 -0
- package/es/components/KvList/KvItem.js +44 -0
- package/es/components/KvList/KvList.js +13 -0
- package/es/components/KvList/index.js +2 -0
- package/es/components/KvList/style.less +73 -0
- package/es/components/Label/index.js +12 -0
- package/es/components/Label/style.less +5 -0
- package/es/components/LazyComponent/SuspenseWrap.js +15 -0
- package/es/components/LazyComponent/index.js +50 -0
- package/es/components/LazyComponent/interface.js +1 -0
- package/es/components/List/List.js +17 -0
- package/es/components/List/ListItem.js +30 -0
- package/es/components/List/index.js +2 -0
- package/es/components/List/style.less +75 -0
- package/es/components/Loading/index.js +16 -0
- package/es/components/Loading/style.less +13 -0
- package/es/components/MediaObject/index.js +24 -0
- package/es/components/MediaObject/style.less +28 -0
- package/es/components/Message/Message.js +62 -0
- package/es/components/Message/SystemMessage.js +33 -0
- package/es/components/Message/index.js +2 -0
- package/es/components/Message/style.less +132 -0
- package/es/components/MessageContainer/index.js +187 -0
- package/es/components/MessageContainer/style.less +19 -0
- package/es/components/MessageStatus/index.js +84 -0
- package/es/components/MessageStatus/style.less +32 -0
- package/es/components/Modal/Base.js +131 -0
- package/es/components/Modal/Confirm.js +42 -0
- package/es/components/Modal/Modal.js +9 -0
- package/es/components/Modal/Popup.js +9 -0
- package/es/components/Modal/index.js +3 -0
- package/es/components/Modal/style.less +267 -0
- package/es/components/MultiRedPacket/index.js +29 -0
- package/es/components/MultiRedPacket/style.less +53 -0
- package/es/components/Navbar/index.js +49 -0
- package/es/components/Navbar/style.less +84 -0
- package/es/components/Notice/index.js +33 -0
- package/es/components/Notice/style.less +29 -0
- package/es/components/OrderObject/index.js +38 -0
- package/es/components/OrderObject/style.less +18 -0
- package/es/components/Popover/index.js +56 -0
- package/es/components/Popover/style.less +22 -0
- package/es/components/Portal/index.js +29 -0
- package/es/components/Price/index.js +92 -0
- package/es/components/Price/style.less +45 -0
- package/es/components/Progress/index.js +25 -0
- package/es/components/Progress/style.less +23 -0
- package/es/components/PullToRefresh/index.js +224 -0
- package/es/components/PullToRefresh/style.less +37 -0
- package/es/components/QuickReplies/QuickReplies.js +50 -0
- package/es/components/QuickReplies/QuickReply.js +29 -0
- package/es/components/QuickReplies/index.js +2 -0
- package/es/components/QuickReplies/style.less +94 -0
- package/es/components/Quote/index.js +16 -0
- package/es/components/Quote/style.less +46 -0
- package/es/components/Radio/Radio.js +27 -0
- package/es/components/Radio/RadioGroup.js +37 -0
- package/es/components/Radio/index.js +2 -0
- package/es/components/Radio/style.less +87 -0
- package/es/components/RateActions/index.js +54 -0
- package/es/components/RateActions/style.less +34 -0
- package/es/components/Recorder/index.js +128 -0
- package/es/components/Recorder/style.less +89 -0
- package/es/components/RedPacket/index.js +93 -0
- package/es/components/RedPacket/style.less +135 -0
- package/es/components/Ribbon/index.js +37 -0
- package/es/components/Ribbon/style.less +71 -0
- package/es/components/RichText/configDOMPurify.js +26 -0
- package/es/components/RichText/index.js +25 -0
- package/es/components/RichText/style.less +4 -0
- package/es/components/ScrollGrid/index.js +74 -0
- package/es/components/ScrollGrid/style.less +54 -0
- package/es/components/ScrollView/Item.js +39 -0
- package/es/components/ScrollView/ScrollView.js +89 -0
- package/es/components/ScrollView/index.js +1 -0
- package/es/components/ScrollView/style.less +60 -0
- package/es/components/Search/index.js +78 -0
- package/es/components/Search/style.less +47 -0
- package/es/components/Select/index.js +20 -0
- package/es/components/Select/style.less +11 -0
- package/es/components/SendConfirm/SendConfirm.js +45 -0
- package/es/components/SendConfirm/index.js +1 -0
- package/es/components/SendConfirm/style.less +16 -0
- package/es/components/Skeleton/index.js +21 -0
- package/es/components/Skeleton/style.less +26 -0
- package/es/components/StatusBadge/index.js +22 -0
- package/es/components/StatusBadge/style.less +27 -0
- package/es/components/Stepper/Step.js +56 -0
- package/es/components/Stepper/Stepper.js +40 -0
- package/es/components/Stepper/index.js +2 -0
- package/es/components/Stepper/style.less +105 -0
- package/es/components/Tabs/Tab.js +5 -0
- package/es/components/Tabs/Tabs.js +142 -0
- package/es/components/Tabs/index.js +2 -0
- package/es/components/Tabs/style.less +98 -0
- package/es/components/Tag/index.js +17 -0
- package/es/components/Tag/style.less +45 -0
- package/es/components/Text/index.js +28 -0
- package/es/components/Text/style.less +19 -0
- package/es/components/Think/index.js +37 -0
- package/es/components/Think/style.less +68 -0
- package/es/components/Time/Time.js +13 -0
- package/es/components/Time/index.js +1 -0
- package/es/components/Time/parser.js +50 -0
- package/es/components/Time/style.less +4 -0
- package/es/components/Tips/index.js +21 -0
- package/es/components/Tips/style.less +23 -0
- package/es/components/Toast/Toast.js +61 -0
- package/es/components/Toast/index.js +23 -0
- package/es/components/Toast/style.less +48 -0
- package/es/components/Toolbar/Toolbar.js +15 -0
- package/es/components/Toolbar/ToolbarButton.js +30 -0
- package/es/components/Toolbar/index.js +1 -0
- package/es/components/Toolbar/style.less +97 -0
- package/es/components/Tooltip/style.less +40 -0
- package/es/components/Tree/Tree.js +10 -0
- package/es/components/Tree/TreeNode.js +66 -0
- package/es/components/Tree/index.js +2 -0
- package/es/components/Tree/style.less +41 -0
- package/es/components/Typing/Typing.js +22 -0
- package/es/components/Typing/index.js +1 -0
- package/es/components/Typing/style.less +41 -0
- package/es/components/TypingBubble/index.js +48 -0
- package/es/components/Video/index.js +82 -0
- package/es/components/Video/style.less +47 -0
- package/es/components/VisuallyHidden/index.js +18 -0
- package/es/components/VisuallyHidden/style.less +0 -0
- package/es/global.d.js +7 -0
- package/es/hooks/useClickOutside.js +21 -0
- package/es/hooks/useCountdown.js +54 -0
- package/es/hooks/useForwardRef.js +14 -0
- package/es/hooks/useLatest.js +6 -0
- package/es/hooks/useMessages.js +72 -0
- package/es/hooks/useMount.js +47 -0
- package/es/hooks/useNextId.js +11 -0
- package/es/hooks/useQuickReplies.js +44 -0
- package/es/hooks/useTitleTyping.js +53 -0
- package/es/hooks/useTypewriter.js +35 -0
- package/es/hooks/useWindowResize.js +24 -0
- package/es/index.js +85 -0
- package/es/styles/animation.less +48 -0
- package/es/styles/dark.less +40 -0
- package/es/styles/font-face.less +22 -0
- package/es/styles/index.less +81 -0
- package/es/styles/root.less +122 -0
- package/es/styles/scale.less +19 -0
- package/es/styles/utils.less +9 -0
- package/es/styles/var.less +369 -0
- package/es/utils/canUse.js +32 -0
- package/es/utils/countLines.js +6 -0
- package/es/utils/date.js +28 -0
- package/es/utils/formatTime.js +16 -0
- package/es/utils/getExtName.js +4 -0
- package/es/utils/getFps.js +25 -0
- package/es/utils/getRandomInt.js +3 -0
- package/es/utils/getToBottom.js +3 -0
- package/es/utils/importScript.js +124 -0
- package/es/utils/index.js +23 -0
- package/es/utils/lazyComponent.js +26 -0
- package/es/utils/mountComponent.js +19 -0
- package/es/utils/parseDataTransfer.js +18 -0
- package/es/utils/prettyBytes.js +10 -0
- package/es/utils/smoothScroll.js +34 -0
- package/es/utils/style.js +13 -0
- package/es/utils/throttle.js +14 -0
- package/es/utils/toggleClass.js +5 -0
- package/es/utils/ua.js +11 -0
- package/lib/components/Avatar/index.d.ts +13 -0
- package/lib/components/Avatar/index.js +28 -0
- package/lib/components/BackBottom/index.d.ts +8 -0
- package/lib/components/BackBottom/index.js +36 -0
- package/lib/components/Backdrop/index.d.ts +7 -0
- package/lib/components/Backdrop/index.js +24 -0
- package/lib/components/Bubble/index.d.ts +6 -0
- package/lib/components/Bubble/index.js +24 -0
- package/lib/components/Button/index.d.ts +14 -0
- package/lib/components/Button/index.js +52 -0
- package/lib/components/Card/Card.d.ts +9 -0
- package/lib/components/Card/Card.js +27 -0
- package/lib/components/Card/CardActions.d.ts +7 -0
- package/lib/components/Card/CardActions.js +21 -0
- package/lib/components/Card/CardContent.d.ts +6 -0
- package/lib/components/Card/CardContent.js +20 -0
- package/lib/components/Card/CardHeader.d.ts +13 -0
- package/lib/components/Card/CardHeader.js +59 -0
- package/lib/components/Card/CardMedia.d.ts +9 -0
- package/lib/components/Card/CardMedia.js +37 -0
- package/lib/components/Card/CardText.d.ts +6 -0
- package/lib/components/Card/CardText.js +20 -0
- package/lib/components/Card/CardTitle.d.ts +9 -0
- package/lib/components/Card/CardTitle.js +31 -0
- package/lib/components/Card/index.d.ts +14 -0
- package/lib/components/Card/index.js +54 -0
- package/lib/components/Carousel/Item.d.ts +7 -0
- package/lib/components/Carousel/Item.js +18 -0
- package/lib/components/Carousel/index.d.ts +26 -0
- package/lib/components/Carousel/index.js +378 -0
- package/lib/components/Chat/index.d.ts +216 -0
- package/lib/components/Chat/index.js +166 -0
- package/lib/components/Checkbox/Checkbox.d.ts +7 -0
- package/lib/components/Checkbox/Checkbox.js +34 -0
- package/lib/components/Checkbox/CheckboxGroup.d.ts +15 -0
- package/lib/components/Checkbox/CheckboxGroup.js +50 -0
- package/lib/components/Checkbox/index.d.ts +4 -0
- package/lib/components/Checkbox/index.js +19 -0
- package/lib/components/ClickOutside/index.d.ts +7 -0
- package/lib/components/ClickOutside/index.js +40 -0
- package/lib/components/ComponentsProvider/ComponentsContext.d.ts +3 -0
- package/lib/components/ComponentsProvider/ComponentsContext.js +17 -0
- package/lib/components/ComponentsProvider/index.d.ts +5 -0
- package/lib/components/ComponentsProvider/index.js +105 -0
- package/lib/components/ComponentsProvider/interface.d.ts +40 -0
- package/lib/components/ComponentsProvider/interface.js +5 -0
- package/lib/components/ComponentsProvider/useComponents.d.ts +1 -0
- package/lib/components/ComponentsProvider/useComponents.js +12 -0
- package/lib/components/Composer/AccessoryWrap.d.ts +7 -0
- package/lib/components/Composer/AccessoryWrap.js +16 -0
- package/lib/components/Composer/Action.d.ts +3 -0
- package/lib/components/Composer/Action.js +18 -0
- package/lib/components/Composer/ComposerInput.d.ts +9 -0
- package/lib/components/Composer/ComposerInput.js +67 -0
- package/lib/components/Composer/SendButton.d.ts +7 -0
- package/lib/components/Composer/SendButton.js +37 -0
- package/lib/components/Composer/ToolbarItem.d.ts +8 -0
- package/lib/components/Composer/ToolbarItem.js +21 -0
- package/lib/components/Composer/index.d.ts +32 -0
- package/lib/components/Composer/index.js +353 -0
- package/lib/components/Composer/riseInput.d.ts +1 -0
- package/lib/components/Composer/riseInput.js +55 -0
- package/lib/components/Composer/viewportTop.d.ts +2 -0
- package/lib/components/Composer/viewportTop.js +29 -0
- package/lib/components/ConfigProvider/index.d.ts +33 -0
- package/lib/components/ConfigProvider/index.js +53 -0
- package/lib/components/ConfigProvider/locales/en_US.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/en_US.js +43 -0
- package/lib/components/ConfigProvider/locales/es.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/es.js +43 -0
- package/lib/components/ConfigProvider/locales/hi.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/hi.js +43 -0
- package/lib/components/ConfigProvider/locales/id.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/id.js +43 -0
- package/lib/components/ConfigProvider/locales/index.d.ts +2 -0
- package/lib/components/ConfigProvider/locales/index.js +27 -0
- package/lib/components/ConfigProvider/locales/pt.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/pt.js +43 -0
- package/lib/components/ConfigProvider/locales/ur.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/ur.js +43 -0
- package/lib/components/ConfigProvider/locales/vi.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/vi.js +43 -0
- package/lib/components/ConfigProvider/locales/zh_CN.d.ts +38 -0
- package/lib/components/ConfigProvider/locales/zh_CN.js +46 -0
- package/lib/components/Countdown/index.d.ts +6 -0
- package/lib/components/Countdown/index.js +29 -0
- package/lib/components/Coupon/index.d.ts +18 -0
- package/lib/components/Coupon/index.js +91 -0
- package/lib/components/Divider/index.d.ts +7 -0
- package/lib/components/Divider/index.js +23 -0
- package/lib/components/Empty/index.d.ts +10 -0
- package/lib/components/Empty/index.js +52 -0
- package/lib/components/ErrorBoundary/index.d.ts +20 -0
- package/lib/components/ErrorBoundary/index.js +65 -0
- package/lib/components/FileCard/index.d.ts +8 -0
- package/lib/components/FileCard/index.js +45 -0
- package/lib/components/Filter/index.d.ts +17 -0
- package/lib/components/Filter/index.js +208 -0
- package/lib/components/Flex/Flex.d.ts +16 -0
- package/lib/components/Flex/Flex.js +59 -0
- package/lib/components/Flex/FlexItem.d.ts +8 -0
- package/lib/components/Flex/FlexItem.js +32 -0
- package/lib/components/Flex/index.d.ts +4 -0
- package/lib/components/Flex/index.js +19 -0
- package/lib/components/Form/Form.d.ts +9 -0
- package/lib/components/Form/Form.js +27 -0
- package/lib/components/Form/FormActions.d.ts +2 -0
- package/lib/components/Form/FormActions.js +19 -0
- package/lib/components/Form/FormItem.d.ts +10 -0
- package/lib/components/Form/FormItem.js +26 -0
- package/lib/components/Form/index.d.ts +5 -0
- package/lib/components/Form/index.js +32 -0
- package/lib/components/Goods/index.d.ts +32 -0
- package/lib/components/Goods/index.js +133 -0
- package/lib/components/HelpText/index.d.ts +2 -0
- package/lib/components/HelpText/index.js +18 -0
- package/lib/components/Icon/index.d.ts +8 -0
- package/lib/components/Icon/index.js +31 -0
- package/lib/components/IconButton/index.d.ts +6 -0
- package/lib/components/IconButton/index.js +29 -0
- package/lib/components/Image/index.d.ts +8 -0
- package/lib/components/Image/index.js +63 -0
- package/lib/components/ImageList/index.d.ts +13 -0
- package/lib/components/ImageList/index.js +36 -0
- package/lib/components/InfiniteScroll/index.d.ts +8 -0
- package/lib/components/InfiniteScroll/index.js +42 -0
- package/lib/components/Input/index.d.ts +15 -0
- package/lib/components/Input/index.js +127 -0
- package/lib/components/KvList/KvItem.d.ts +14 -0
- package/lib/components/KvList/KvItem.js +51 -0
- package/lib/components/KvList/KvList.d.ts +7 -0
- package/lib/components/KvList/KvList.js +20 -0
- package/lib/components/KvList/index.d.ts +4 -0
- package/lib/components/KvList/index.js +19 -0
- package/lib/components/Label/index.d.ts +2 -0
- package/lib/components/Label/index.js +19 -0
- package/lib/components/LazyComponent/SuspenseWrap.d.ts +3 -0
- package/lib/components/LazyComponent/SuspenseWrap.js +24 -0
- package/lib/components/LazyComponent/index.d.ts +6 -0
- package/lib/components/LazyComponent/index.js +57 -0
- package/lib/components/LazyComponent/interface.d.ts +18 -0
- package/lib/components/LazyComponent/interface.js +5 -0
- package/lib/components/List/List.d.ts +8 -0
- package/lib/components/List/List.js +24 -0
- package/lib/components/List/ListItem.d.ts +17 -0
- package/lib/components/List/ListItem.js +37 -0
- package/lib/components/List/index.d.ts +4 -0
- package/lib/components/List/index.js +19 -0
- package/lib/components/Loading/index.d.ts +6 -0
- package/lib/components/Loading/index.js +23 -0
- package/lib/components/MediaObject/index.d.ts +10 -0
- package/lib/components/MediaObject/index.js +31 -0
- package/lib/components/Message/Message.d.ts +54 -0
- package/lib/components/Message/Message.js +69 -0
- package/lib/components/Message/SystemMessage.d.ts +12 -0
- package/lib/components/Message/SystemMessage.js +42 -0
- package/lib/components/Message/index.d.ts +4 -0
- package/lib/components/Message/index.js +20 -0
- package/lib/components/MessageContainer/index.d.ts +19 -0
- package/lib/components/MessageContainer/index.js +197 -0
- package/lib/components/MessageStatus/index.d.ts +13 -0
- package/lib/components/MessageStatus/index.js +93 -0
- package/lib/components/Modal/Base.d.ts +24 -0
- package/lib/components/Modal/Base.js +140 -0
- package/lib/components/Modal/Confirm.d.ts +3 -0
- package/lib/components/Modal/Confirm.js +49 -0
- package/lib/components/Modal/Modal.d.ts +3 -0
- package/lib/components/Modal/Modal.js +16 -0
- package/lib/components/Modal/Popup.d.ts +3 -0
- package/lib/components/Modal/Popup.js +16 -0
- package/lib/components/Modal/index.d.ts +4 -0
- package/lib/components/Modal/index.js +26 -0
- package/lib/components/MultiRedPacket/index.d.ts +11 -0
- package/lib/components/MultiRedPacket/index.js +36 -0
- package/lib/components/Navbar/index.d.ts +13 -0
- package/lib/components/Navbar/index.js +56 -0
- package/lib/components/Notice/index.d.ts +9 -0
- package/lib/components/Notice/index.js +40 -0
- package/lib/components/OrderObject/index.d.ts +10 -0
- package/lib/components/OrderObject/index.js +45 -0
- package/lib/components/Popover/index.d.ts +9 -0
- package/lib/components/Popover/index.js +65 -0
- package/lib/components/Portal/index.d.ts +8 -0
- package/lib/components/Portal/index.js +36 -0
- package/lib/components/Price/index.d.ts +10 -0
- package/lib/components/Price/index.js +99 -0
- package/lib/components/Progress/index.d.ts +7 -0
- package/lib/components/Progress/index.js +32 -0
- package/lib/components/PullToRefresh/index.d.ts +27 -0
- package/lib/components/PullToRefresh/index.js +233 -0
- package/lib/components/QuickReplies/QuickReplies.d.ts +10 -0
- package/lib/components/QuickReplies/QuickReplies.js +59 -0
- package/lib/components/QuickReplies/QuickReply.d.ts +15 -0
- package/lib/components/QuickReplies/QuickReply.js +36 -0
- package/lib/components/QuickReplies/index.d.ts +4 -0
- package/lib/components/QuickReplies/index.js +20 -0
- package/lib/components/Quote/index.d.ts +8 -0
- package/lib/components/Quote/index.js +23 -0
- package/lib/components/Radio/Radio.d.ts +7 -0
- package/lib/components/Radio/Radio.js +34 -0
- package/lib/components/Radio/RadioGroup.d.ts +15 -0
- package/lib/components/Radio/RadioGroup.js +44 -0
- package/lib/components/Radio/index.d.ts +4 -0
- package/lib/components/Radio/index.js +19 -0
- package/lib/components/RateActions/index.d.ts +7 -0
- package/lib/components/RateActions/index.js +63 -0
- package/lib/components/Recorder/index.d.ts +15 -0
- package/lib/components/Recorder/index.js +137 -0
- package/lib/components/RedPacket/index.d.ts +20 -0
- package/lib/components/RedPacket/index.js +100 -0
- package/lib/components/Ribbon/index.d.ts +9 -0
- package/lib/components/Ribbon/index.js +44 -0
- package/lib/components/RichText/configDOMPurify.d.ts +1 -0
- package/lib/components/RichText/configDOMPurify.js +29 -0
- package/lib/components/RichText/index.d.ts +9 -0
- package/lib/components/RichText/index.js +32 -0
- package/lib/components/ScrollGrid/index.d.ts +7 -0
- package/lib/components/ScrollGrid/index.js +83 -0
- package/lib/components/ScrollView/Item.d.ts +9 -0
- package/lib/components/ScrollView/Item.js +48 -0
- package/lib/components/ScrollView/ScrollView.d.ts +28 -0
- package/lib/components/ScrollView/ScrollView.js +98 -0
- package/lib/components/ScrollView/index.d.ts +2 -0
- package/lib/components/ScrollView/index.js +12 -0
- package/lib/components/Search/index.d.ts +14 -0
- package/lib/components/Search/index.js +87 -0
- package/lib/components/Select/index.d.ts +7 -0
- package/lib/components/Select/index.js +27 -0
- package/lib/components/SendConfirm/SendConfirm.d.ts +7 -0
- package/lib/components/SendConfirm/SendConfirm.js +54 -0
- package/lib/components/SendConfirm/index.d.ts +1 -0
- package/lib/components/SendConfirm/index.js +12 -0
- package/lib/components/Skeleton/index.d.ts +10 -0
- package/lib/components/Skeleton/index.js +28 -0
- package/lib/components/StatusBadge/index.d.ts +6 -0
- package/lib/components/StatusBadge/index.js +29 -0
- package/lib/components/Stepper/Step.d.ts +15 -0
- package/lib/components/Stepper/Step.js +63 -0
- package/lib/components/Stepper/Stepper.d.ts +10 -0
- package/lib/components/Stepper/Stepper.js +47 -0
- package/lib/components/Stepper/index.d.ts +4 -0
- package/lib/components/Stepper/index.js +19 -0
- package/lib/components/Tabs/Tab.d.ts +6 -0
- package/lib/components/Tabs/Tab.js +12 -0
- package/lib/components/Tabs/Tabs.d.ts +12 -0
- package/lib/components/Tabs/Tabs.js +151 -0
- package/lib/components/Tabs/index.d.ts +4 -0
- package/lib/components/Tabs/index.js +19 -0
- package/lib/components/Tag/index.d.ts +10 -0
- package/lib/components/Tag/index.js +24 -0
- package/lib/components/Text/index.d.ts +10 -0
- package/lib/components/Text/index.js +35 -0
- package/lib/components/Think/index.d.ts +8 -0
- package/lib/components/Think/index.js +46 -0
- package/lib/components/Time/Time.d.ts +7 -0
- package/lib/components/Time/Time.js +20 -0
- package/lib/components/Time/index.d.ts +2 -0
- package/lib/components/Time/index.js +12 -0
- package/lib/components/Time/parser.d.ts +10 -0
- package/lib/components/Time/parser.js +56 -0
- package/lib/components/Tips/index.d.ts +9 -0
- package/lib/components/Tips/index.js +28 -0
- package/lib/components/Toast/Toast.d.ts +8 -0
- package/lib/components/Toast/Toast.js +70 -0
- package/lib/components/Toast/index.d.ts +10 -0
- package/lib/components/Toast/index.js +35 -0
- package/lib/components/Toolbar/Toolbar.d.ts +7 -0
- package/lib/components/Toolbar/Toolbar.js +22 -0
- package/lib/components/Toolbar/ToolbarButton.d.ts +13 -0
- package/lib/components/Toolbar/ToolbarButton.js +37 -0
- package/lib/components/Toolbar/index.d.ts +3 -0
- package/lib/components/Toolbar/index.js +12 -0
- package/lib/components/Tree/Tree.d.ts +6 -0
- package/lib/components/Tree/Tree.js +17 -0
- package/lib/components/Tree/TreeNode.d.ts +10 -0
- package/lib/components/Tree/TreeNode.js +75 -0
- package/lib/components/Tree/index.d.ts +4 -0
- package/lib/components/Tree/index.js +19 -0
- package/lib/components/Typing/Typing.d.ts +6 -0
- package/lib/components/Typing/Typing.js +29 -0
- package/lib/components/Typing/index.d.ts +1 -0
- package/lib/components/Typing/index.js +12 -0
- package/lib/components/TypingBubble/index.d.ts +12 -0
- package/lib/components/TypingBubble/index.js +57 -0
- package/lib/components/Video/index.d.ts +12 -0
- package/lib/components/Video/index.js +91 -0
- package/lib/components/VisuallyHidden/index.d.ts +2 -0
- package/lib/components/VisuallyHidden/index.js +25 -0
- package/lib/global.d.js +5 -0
- package/lib/hooks/useClickOutside.d.ts +1 -0
- package/lib/hooks/useClickOutside.js +27 -0
- package/lib/hooks/useCountdown.d.ts +11 -0
- package/lib/hooks/useCountdown.js +61 -0
- package/lib/hooks/useForwardRef.d.ts +2 -0
- package/lib/hooks/useForwardRef.js +20 -0
- package/lib/hooks/useLatest.d.ts +1 -0
- package/lib/hooks/useLatest.js +12 -0
- package/lib/hooks/useMessages.d.ts +14 -0
- package/lib/hooks/useMessages.js +79 -0
- package/lib/hooks/useMount.d.ts +11 -0
- package/lib/hooks/useMount.js +54 -0
- package/lib/hooks/useNextId.d.ts +1 -0
- package/lib/hooks/useNextId.js +17 -0
- package/lib/hooks/useQuickReplies.d.ts +12 -0
- package/lib/hooks/useQuickReplies.js +51 -0
- package/lib/hooks/useTitleTyping.d.ts +10 -0
- package/lib/hooks/useTitleTyping.js +60 -0
- package/lib/hooks/useTypewriter.d.ts +9 -0
- package/lib/hooks/useTypewriter.js +42 -0
- package/lib/hooks/useWindowResize.d.ts +1 -0
- package/lib/hooks/useWindowResize.js +30 -0
- package/lib/index.d.ts +153 -0
- package/lib/index.js +751 -0
- package/lib/utils/canUse.d.ts +2 -0
- package/lib/utils/canUse.js +39 -0
- package/lib/utils/countLines.d.ts +1 -0
- package/lib/utils/countLines.js +12 -0
- package/lib/utils/date.d.ts +17 -0
- package/lib/utils/date.js +37 -0
- package/lib/utils/formatTime.d.ts +1 -0
- package/lib/utils/formatTime.js +22 -0
- package/lib/utils/getExtName.d.ts +2 -0
- package/lib/utils/getExtName.js +10 -0
- package/lib/utils/getFps.d.ts +2 -0
- package/lib/utils/getFps.js +31 -0
- package/lib/utils/getRandomInt.d.ts +1 -0
- package/lib/utils/getRandomInt.js +9 -0
- package/lib/utils/getToBottom.d.ts +1 -0
- package/lib/utils/getToBottom.js +9 -0
- package/lib/utils/importScript.d.ts +19 -0
- package/lib/utils/importScript.js +130 -0
- package/lib/utils/index.d.ts +14 -0
- package/lib/utils/index.js +30 -0
- package/lib/utils/lazyComponent.d.ts +5 -0
- package/lib/utils/lazyComponent.js +33 -0
- package/lib/utils/mountComponent.d.ts +2 -0
- package/lib/utils/mountComponent.js +26 -0
- package/lib/utils/parseDataTransfer.d.ts +1 -0
- package/lib/utils/parseDataTransfer.js +24 -0
- package/lib/utils/prettyBytes.d.ts +2 -0
- package/lib/utils/prettyBytes.js +16 -0
- package/lib/utils/smoothScroll.d.ts +8 -0
- package/lib/utils/smoothScroll.js +41 -0
- package/lib/utils/style.d.ts +2 -0
- package/lib/utils/style.js +19 -0
- package/lib/utils/throttle.d.ts +1 -0
- package/lib/utils/throttle.js +20 -0
- package/lib/utils/toggleClass.d.ts +2 -0
- package/lib/utils/toggleClass.js +11 -0
- package/lib/utils/ua.d.ts +7 -0
- package/lib/utils/ua.js +18 -0
- package/package.json +114 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2020 Alibaba
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
<h1 align="center">
|
|
2
|
+
<a href="https://chatui.io/">
|
|
3
|
+
<img width="109" height="28" src="https://gw.alicdn.com/tfs/TB1uYH4QoY1gK0jSZFMXXaWcVXa-218-56.svg" alt="ChatUI">
|
|
4
|
+
</a>
|
|
5
|
+
</h1>
|
|
6
|
+
|
|
7
|
+
<p align="center">The UI design language and React library for Conversational UI</p>
|
|
8
|
+
|
|
9
|
+
<p align="center">Website:<a href="https://chatui.io/" target="_blank">https://chatui.io</a></p>
|
|
10
|
+
|
|
11
|
+
<div align="center">
|
|
12
|
+
|
|
13
|
+
[](https://github.com/alibaba/ChatUI/blob/master/LICENSE)
|
|
14
|
+
[](https://www.npmjs.com/package/@chatui/core)
|
|
15
|
+
[](https://www.npmjs.com/package/@chatui/core)
|
|
16
|
+
[](https://unpkg.com/@chatui/core@0.1.0/dist/index.js)
|
|
17
|
+
[](https://cdn.jsdelivr.net/npm/@chatui/core)
|
|
18
|
+
|
|
19
|
+
</div>
|
|
20
|
+
|
|
21
|
+
<p align="center">
|
|
22
|
+
<img width="750" src="https://gw.alicdn.com/tfs/TB1WTl.lQ9l0K4jSZFKXXXFjpXa-1500-833.jpg">
|
|
23
|
+
</p>
|
|
24
|
+
|
|
25
|
+
English | [简体中文](./README.zh-CN.md)
|
|
26
|
+
|
|
27
|
+
## Features
|
|
28
|
+
|
|
29
|
+
- 😎 **Best Practices**: The best practice for chat interaction based on our experience of Alime Chatbot
|
|
30
|
+
- 🛡 **TypeScript**: Written in TypeScript with predictable static types
|
|
31
|
+
- 📱 **Responsive**: Responsive design to adapt automatically to whatever device
|
|
32
|
+
- ♿ **Accessibility**: Accessibility support and get the certification from Accessibility Research Association
|
|
33
|
+
- 🎨 **Theming**: Powerful theme customization in every detail
|
|
34
|
+
- 🌍 **International**: Internationalization support for dozens of languages
|
|
35
|
+
|
|
36
|
+
## Environment Support
|
|
37
|
+
|
|
38
|
+
- Modern browsers (support [CSS Variables](https://caniuse.com/css-variables))
|
|
39
|
+
- Internet Explorer 11 (with [polyfills](https://stackoverflow.com/questions/57020976/polyfills-in-2019-for-ie11) and [CSS Variables Polyfill](https://github.com/nuxodin/ie11CustomProperties) / [css-vars-ponyfill](https://github.com/jhildenbiddle/css-vars-ponyfill))
|
|
40
|
+
|
|
41
|
+
| <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" /><br>Edge | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" /><br>Firefox | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" /><br>Chrome | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" /><br>Safari | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari-ios/safari-ios_48x48.png" alt="iOS Safari" width="24px" height="24px" /><br>iOS Safari | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/android-webview/android-webview_48x48.png" alt="Android WebView" width="24px" height="24px" /><br>Android WebView |
|
|
42
|
+
| --- | --- | --- | --- | --- | --- |
|
|
43
|
+
| 16+ | 31+ | 49+ | 9.1+ | 9.3+ | 6+ |
|
|
44
|
+
|
|
45
|
+
## Install
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
npm install @chatui/core --save
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
```bash
|
|
52
|
+
yarn add @chatui/core
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
## Usage
|
|
56
|
+
|
|
57
|
+
```jsx
|
|
58
|
+
import Chat, { Bubble, useMessages } from '@chatui/core';
|
|
59
|
+
import '@chatui/core/dist/index.css';
|
|
60
|
+
|
|
61
|
+
const App = () => {
|
|
62
|
+
const { messages, appendMsg, setTyping } = useMessages([]);
|
|
63
|
+
|
|
64
|
+
function handleSend(type, val) {
|
|
65
|
+
if (type === 'text' && val.trim()) {
|
|
66
|
+
appendMsg({
|
|
67
|
+
type: 'text',
|
|
68
|
+
content: { text: val },
|
|
69
|
+
position: 'right',
|
|
70
|
+
});
|
|
71
|
+
|
|
72
|
+
setTyping(true);
|
|
73
|
+
|
|
74
|
+
setTimeout(() => {
|
|
75
|
+
appendMsg({
|
|
76
|
+
type: 'text',
|
|
77
|
+
content: { text: 'Bala bala' },
|
|
78
|
+
});
|
|
79
|
+
}, 1000);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function renderMessageContent(msg) {
|
|
84
|
+
const { content } = msg;
|
|
85
|
+
return <Bubble content={content.text} />;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return (
|
|
89
|
+
<Chat
|
|
90
|
+
navbar={{ title: 'Assistant' }}
|
|
91
|
+
messages={messages}
|
|
92
|
+
renderMessageContent={renderMessageContent}
|
|
93
|
+
onSend={handleSend}
|
|
94
|
+
/>
|
|
95
|
+
);
|
|
96
|
+
};
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
[](https://codesandbox.io/s/chatui-demo-o6n3z?fontsize=14&hidenavigation=1&theme=dark)
|
|
100
|
+
|
|
101
|
+
### Development
|
|
102
|
+
|
|
103
|
+
```bash
|
|
104
|
+
cd demo
|
|
105
|
+
npm i
|
|
106
|
+
npm run dev
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
## Theme
|
|
110
|
+
|
|
111
|
+
Visit [Customize Theme](https://chatui.io/docs/customize-theme) for detail
|
|
112
|
+
|
|
113
|
+
## Internationalization
|
|
114
|
+
|
|
115
|
+
Visit [i18n](https://chatui.io/docs/i18n) for detail
|
|
116
|
+
|
|
117
|
+
## License
|
|
118
|
+
|
|
119
|
+
MIT
|
package/README.zh-CN.md
ADDED
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
<h1 align="center">
|
|
2
|
+
<a href="https://chatui.io/">
|
|
3
|
+
<img width="109" height="28" src="https://gw.alicdn.com/tfs/TB1uYH4QoY1gK0jSZFMXXaWcVXa-218-56.svg" alt="ChatUI">
|
|
4
|
+
</a>
|
|
5
|
+
</h1>
|
|
6
|
+
|
|
7
|
+
<p align="center">服务于对话领域的设计和开发体系</p>
|
|
8
|
+
|
|
9
|
+
<p align="center">官网:<a href="https://chatui.io/" target="_blank">https://chatui.io</a></p>
|
|
10
|
+
|
|
11
|
+
<div align="center">
|
|
12
|
+
|
|
13
|
+
[](https://github.com/alibaba/ChatUI/blob/master/LICENSE)
|
|
14
|
+
[](https://www.npmjs.com/package/@chatui/core)
|
|
15
|
+
[](https://www.npmjs.com/package/@chatui/core)
|
|
16
|
+
[](https://unpkg.com/@chatui/core@0.1.0/dist/index.js)
|
|
17
|
+
[](https://cdn.jsdelivr.net/npm/@chatui/core)
|
|
18
|
+
|
|
19
|
+
</div>
|
|
20
|
+
|
|
21
|
+
<p align="center">
|
|
22
|
+
<img width="750" src="https://gw.alicdn.com/tfs/TB1WTl.lQ9l0K4jSZFKXXXFjpXa-1500-833.jpg">
|
|
23
|
+
</p>
|
|
24
|
+
|
|
25
|
+
[English](./README.md) | 简体中文
|
|
26
|
+
|
|
27
|
+
## 特性
|
|
28
|
+
|
|
29
|
+
- 😎 **最佳实践**:基于阿里小蜜业务积累和打磨的对话式交互最佳实践
|
|
30
|
+
- 🛡 **TypeScript**:使用 TypeScript 开发,提供完整的类型定义文件
|
|
31
|
+
- 📱 **响应式**:响应式布局,在无线和 PC 端都可以友好展现
|
|
32
|
+
- ♿ **障碍**:支持无障碍,已通过深圳市无障碍研究会的认证
|
|
33
|
+
- 🎨 **主题**:支持灵活的样式定制,以满足业务和品牌上多样化的视觉需求
|
|
34
|
+
- 🌍 **国际化**:支持多语言和本土化特性
|
|
35
|
+
|
|
36
|
+
## 兼容环境
|
|
37
|
+
|
|
38
|
+
- 现代浏览器 (支持 [CSS Variables](https://caniuse.com/css-variables))
|
|
39
|
+
- IE 11 (需要 [polyfills](https://stackoverflow.com/questions/57020976/polyfills-in-2019-for-ie11) 和 [CSS Variables Polyfill](https://github.com/nuxodin/ie11CustomProperties) / [css-vars-ponyfill](https://github.com/jhildenbiddle/css-vars-ponyfill))
|
|
40
|
+
|
|
41
|
+
| <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" /><br>Edge | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" /><br>Firefox | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" /><br>Chrome | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" /><br>Safari | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari-ios/safari-ios_48x48.png" alt="iOS Safari" width="24px" height="24px" /><br>iOS Safari | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/android-webview/android-webview_48x48.png" alt="Android WebView" width="24px" height="24px" /><br>Android WebView |
|
|
42
|
+
| --- | --- | --- | --- | --- | --- |
|
|
43
|
+
| 16+ | 31+ | 49+ | 9.1+ | 9.3+ | 6+ |
|
|
44
|
+
|
|
45
|
+
## 安装
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
npm install @chatui/core --save
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
```bash
|
|
52
|
+
yarn add @chatui/core
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
## 示例
|
|
56
|
+
|
|
57
|
+
```jsx
|
|
58
|
+
import Chat, { Bubble, useMessages } from '@chatui/core';
|
|
59
|
+
import '@chatui/core/dist/index.css';
|
|
60
|
+
|
|
61
|
+
const App = () => {
|
|
62
|
+
const { messages, appendMsg, setTyping } = useMessages([]);
|
|
63
|
+
|
|
64
|
+
function handleSend(type, val) {
|
|
65
|
+
if (type === 'text' && val.trim()) {
|
|
66
|
+
appendMsg({
|
|
67
|
+
type: 'text',
|
|
68
|
+
content: { text: val },
|
|
69
|
+
position: 'right',
|
|
70
|
+
});
|
|
71
|
+
|
|
72
|
+
setTyping(true);
|
|
73
|
+
|
|
74
|
+
setTimeout(() => {
|
|
75
|
+
appendMsg({
|
|
76
|
+
type: 'text',
|
|
77
|
+
content: { text: 'Bala bala' },
|
|
78
|
+
});
|
|
79
|
+
}, 1000);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function renderMessageContent(msg) {
|
|
84
|
+
const { content } = msg;
|
|
85
|
+
return <Bubble content={content.text} />;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return (
|
|
89
|
+
<Chat
|
|
90
|
+
navbar={{ title: '智能助理' }}
|
|
91
|
+
messages={messages}
|
|
92
|
+
renderMessageContent={renderMessageContent}
|
|
93
|
+
onSend={handleSend}
|
|
94
|
+
/>
|
|
95
|
+
);
|
|
96
|
+
};
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
[](https://codesandbox.io/s/chatui-demo-o6n3z?fontsize=14&hidenavigation=1&theme=dark)
|
|
100
|
+
|
|
101
|
+
### 本地开发
|
|
102
|
+
|
|
103
|
+
```bash
|
|
104
|
+
cd storybook
|
|
105
|
+
npm i
|
|
106
|
+
npm run storybook
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
### 定制主题
|
|
110
|
+
|
|
111
|
+
参考 [定制主题](https://chatui.io/docs/customize-theme) 文档。
|
|
112
|
+
|
|
113
|
+
## 国际化
|
|
114
|
+
|
|
115
|
+
参考 [国际化](https://chatui.io/docs/i18n) 文档。
|
|
116
|
+
|
|
117
|
+
## 交流讨论
|
|
118
|
+
|
|
119
|
+
<img width="400" height="515" src="https://img.alicdn.com/imgextra/i2/O1CN01yO0rNg1ZDKHKIulc8_!!6000000003160-0-tps-828-1068.jpg">
|
|
120
|
+
|
|
121
|
+
## License
|
|
122
|
+
|
|
123
|
+
MIT
|
package/dist/index.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@font-face{font-display:swap;font-family:AlibabaSans;src:url(https://gw.alipayobjects.com/as/g/antui/antui-static/1.0.5/fonts/AlibabaSans102Ver2-Rg.woff) format("woff")}@font-face{font-display:swap;font-family:AlibabaSans;font-weight:500;src:url(https://gw.alipayobjects.com/as/g/antui/antui-static/1.0.5/fonts/AlibabaSans102Ver2-Md.woff) format("woff")}@font-face{font-display:swap;font-family:AlibabaSans;font-weight:700;src:url(https://gw.alipayobjects.com/as/g/antui/antui-static/1.0.5/fonts/AlibabaSans102Ver2-Bd.woff) format("woff")}:root{--black:#000;--white:#fff;--gray-1:#11192d;--gray-2:#50607a;--gray-3:#7c889c;--gray-4:#cacfd7;--gray-5:rgba(80,96,122,.15);--gray-6:#e5e5e5;--gray-7:#f5f5f5;--gray-8:#f3f6f8;--light-1:#e5e5e5;--light-2:#f5f5f5;--link-color:var(--blue);--blue:#0080ff;--gray-dark:#11192d;--green:#1dbf1d;--orange:#ff6200;--red:#ff0300;--yellow:#ffb300;--yellow-light:#fff9db;--brand-1:#ff6200;--brand-2:#ffb300;--brand-3:#ffe0cc;--brand-4:#ffefe5;--color-text-1:var(--gray-1);--color-text-2:var(--gray-2);--color-text-3:var(--gray-3);--color-fill-1:var(--white);--color-fill-2:var(--gray-8);--color-mask:rgba(14,17,25,.5);--color-toast:rgba(17,25,45,.9);--color-line-1:var(--gray-5);--color-line-2:var(--gray-4);--highlight-1:var(--brand-1);--highlight-2:var(--brand-2);--color-warning:var(--red);--color-success:var(--green);--color-link:var(--link-color);--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-body:15px;--font-size-md:1rem;--font-size-lg:1.125rem;--radius-sm:4Px;--radius-md:6Px;--shadow-1:0 3px 4px 0 rgba(0,0,0,.04);--shadow-2:0 4px 8px 0 rgba(0,0,0,.08);--shadow-3:0 6px 10px 0 rgba(0,0,0,.08);--safe-top:0px;--safe-bottom:0px;--viewport-top:0px}@supports (top:constant(safe-area-inset-top)){:root{--safe-top:constant(safe-area-inset-top);--safe-bottom:constant(safe-area-inset-bottom)}}@supports (top:env(safe-area-inset-top)){:root{--safe-top:env(safe-area-inset-top);--safe-bottom:env(safe-area-inset-bottom)}}:root{--app-bg:var(--color-fill-2);--navbar-bg:var(--color-fill-2);--footer-bg:var(--color-fill-2);--gutter:12px;--rate-width:32Px;--msg-avatar-gap:6Px;--msg-gutter:calc(var(--msg-avatar-gap) + var(--rate-width));--btn-padding:8px 12px;--btn-border-color:var(--color-line-2);--btn-border-radius:var(--radius-md);--btn-bg:var(--color-fill-1);--btn-color:var(--color-text-2);--btn-font-weight:500;--btn-font-size:0.875rem;--btn-line-height:1.125rem;--btn-padding-sm:4px 12px;--btn-font-size-sm:0.875rem;--btn-padding-lg:10px 12px;--btn-font-size-lg:15px;--btn-active-bg:rgba(0,0,0,.08);--btn-hover-bg:rgba(0,0,0,.04);--btn-primary-border-color:transparent;--btn-primary-bg:var(--brand-1);--btn-primary-color:var(--white);--goods-img-size:65px;--skeleton-bg-1:#f6f6f6;--skeleton-bg-2:#f0f0f0}:root[data-color-scheme=dark]{--black:var(--gray-1);--white:#1c222e;--gray-1:#f3f6f8;--gray-2:#cacfd7;--gray-4:#444c5a;--gray-5:rgba(204,223,255,.15);--gray-8:rgba(124,136,156,.15);--blue:#409fff;--red:#f66;--brand-3:#343b4d;--brand-4:#332b26;--color-mask:rgba(14,17,25,.7);--color-toast:rgba(243,246,248,.9);--app-bg:#0e1119;--navbar-bg:#0e1119;--footer-bg:#0e1119;--btn-primary-color:#fff;--skeleton-bg-1:var(--color-fill-2);--skeleton-bg-2:var(--color-line-1)}:root[data-color-scheme=dark] .Toolbar-btnIcon{background:#1c222e}:root[data-color-scheme=dark] .Modal-dialog[data-has-avatar=true]{background:var(--color-fill-1)}:root[data-color-scheme=dark] .Popup-dialog[data-bg-color=gray]{background:var(--brand-3)}.S--invisible{position:absolute;clip:rect(0,0,0,0)}.pb-safe{padding-bottom:var(--safe-bottom)}@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(6.25rem);transform:translateX(6.25rem)}to{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(6.25rem);transform:translateX(6.25rem)}to{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}.slide-in-right-item{-webkit-animation:slideInRight .5s ease-in-out both;animation:slideInRight .5s ease-in-out both}.slide-in-right-item:nth-child(2){-webkit-animation-delay:.1s;animation-delay:.1s}.slide-in-right-item:nth-child(3){-webkit-animation-delay:.2s;animation-delay:.2s}.slide-in-right-item:nth-child(4){-webkit-animation-delay:.3s;animation-delay:.3s}.slide-in-right-item:nth-child(5){-webkit-animation-delay:.4s;animation-delay:.4s}.slide-in-right-item:nth-child(6){-webkit-animation-delay:.5s;animation-delay:.5s}.slide-in-right-item:nth-child(7){-webkit-animation-delay:.6s;animation-delay:.6s}.slide-in-right-item:nth-child(8){-webkit-animation-delay:.7s;animation-delay:.7s}.slide-in-right-item:nth-child(9){-webkit-animation-delay:.8s;animation-delay:.8s}.slide-in-right-item:nth-child(10){-webkit-animation-delay:.9s;animation-delay:.9s}.slide-in-right-item:nth-child(11){-webkit-animation-delay:1s;animation-delay:1s}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@-webkit-keyframes up{0%{-webkit-transform:translate3d(0,1.25rem,0);transform:translate3d(0,1.25rem,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes up{0%{-webkit-transform:translate3d(0,1.25rem,0);transform:translate3d(0,1.25rem,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.A-fadeIn,[data-animation=fadeIn]{-webkit-animation:fadeIn .6s;animation:fadeIn .6s}[data-animation=fadeInUp]{-webkit-animation:fadeIn .6s cubic-bezier(.17,.17,.67,1),up .6s cubic-bezier(.02,.25,.04,.98);animation:fadeIn .6s cubic-bezier(.17,.17,.67,1),up .6s cubic-bezier(.02,.25,.04,.98)}.Avatar{--avatar-size:2rem;border-radius:50%;display:inline-block;overflow:hidden}.Avatar img{display:block;height:var(--avatar-size);object-fit:cover;width:var(--avatar-size)}.Avatar--sm{--avatar-size:1.125rem}.Avatar--lg{--avatar-size:2.5rem}.Avatar--square{border-radius:var(--radius-md)}.Backdrop{background:var(--color-mask);bottom:0;height:100vh;left:0;opacity:0;outline:0;position:fixed;right:0;transition:.3s;width:100vw;z-index:100}.Backdrop.active{opacity:1}.Bubble{background:var(--color-fill-1);border-radius:var(--radius-md);max-width:32rem;min-width:1Px}.Bubble.richtext,.Bubble.text,.Bubble.typing{box-sizing:border-box;padding:.75rem;word-wrap:break-word;overflow-wrap:break-word}.Bubble.text{min-width:2.5rem;white-space:pre-wrap}.Bubble.image img{border-radius:inherit;display:block;height:auto;max-height:11.25rem;max-width:11.25rem;min-height:5rem;min-width:5rem;object-fit:cover}.Bubble p{margin:0}[data-effect=typing]{overflow:hidden;position:relative}[data-effect=typing] h1:last-child:after,[data-effect=typing] h2:last-child:after,[data-effect=typing] h3:last-child:after,[data-effect=typing] h4:last-child:after,[data-effect=typing] h5:last-child:after,[data-effect=typing] h6:last-child:after,[data-effect=typing] ol:last-child li:last-child:after,[data-effect=typing] p:last-child:after,[data-effect=typing] ul:last-child li:last-child:after{background:linear-gradient(90deg,transparent,var(--color-fill-1));content:"";height:1.5em;margin-left:-5rem;position:absolute;width:5rem}.Btn{align-items:center;-webkit-appearance:none;appearance:none;background:var(--btn-bg);background-origin:border-box;border:1px solid var(--btn-border-color);border-radius:var(--btn-border-radius);color:var(--btn-color);display:inline-flex;font-family:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);justify-content:center;line-height:var(--btn-line-height);margin:0;min-width:80Px;overflow:visible;padding:var(--btn-padding);text-align:center;text-transform:none;transition:.15s ease-in-out;-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;-webkit-tap-highlight-color:transparent}.Btn:not(:disabled){cursor:pointer}.Btn[data-loading=true]{cursor:default}.Btn:focus:not(:focus-visible){outline:0}.Btn:active{--btn-bg:var(--btn-active-bg)}.Btn:disabled{opacity:.5;pointer-events:none}.Btn--primary:not(.Btn--outline){--btn-border-color:var(--btn-primary-border-color);--btn-bg:var(--btn-primary-bg);--btn-color:var(--btn-primary-color)}.Btn--primary:not(.Btn--outline):active{opacity:.8}.Btn--outline.Btn--primary{--btn-border-color:var(--brand-1);--btn-color:var(--brand-1)}.Btn--sm{--btn-padding:var(--btn-padding-sm);--btn-font-size:var(--btn-font-size-sm)}.Btn--lg{--btn-padding:var(--btn-padding-lg);--btn-font-size:var(--btn-font-size-lg)}.Btn--lg .Btn-icon{vertical-align:-.125rem}.Btn--block{display:block;width:100%}.Btn-icon{align-self:center;display:inline-flex;flex-shrink:0;-webkit-margin-end:.5rem;margin-inline-end:.5rem}.no-btn-flex .Btn:not(.Btn--block){display:inline-block}@media (hover:hover){.Btn:hover{--btn-bg:var(--btn-hover-bg)}.Btn--primary:not(.Btn--outline):hover{--btn-bg:var(--btn-primary-bg);opacity:.9}}.Btn--text{--btn-line-height:1.5;border:0;color:var(--link-color);font-size:inherit;font-weight:inherit;min-width:0;padding:0}.Btn--text,.Btn--text:active,.Btn--text:hover{background:transparent}.BackBottom{bottom:4.25rem;overflow:hidden;position:absolute;right:0;z-index:10}.BackBottom .Btn{background:hsla(0,0%,100%,.85);border-radius:50px 0 0 50px;border-right:0;color:var(--brand-1);font-size:var(--font-size-sm)}.Countdown,.Countdown-unit{display:inline-block}.Countdown-unit{background:hsla(0,0%,100%,.25);border-radius:4px;font-family:AlibabaSans,-apple-system,Helvetica Neue,Arial,sans-serif;font-size:.75rem;font-weight:500;line-height:.9375rem;padding:0 .25rem}.Divider{align-items:center;color:var(--color-text-3);display:flex;font-size:.75rem;margin:.75rem 0}.Divider:after,.Divider:before{border-top:1px solid var(--color-line-1);content:"";display:block;flex:1}@media (hover:none){.Divider:after,.Divider:before{-webkit-transform:scaleY(.5);transform:scaleY(.5)}}.Divider--text-center:before,.Divider--text-left:before,.Divider--text-right:before{margin-right:var(--gutter)}.Divider--text-center:after,.Divider--text-left:after,.Divider--text-right:after{margin-left:var(--gutter)}.Divider--text-left:before,.Divider--text-right:after{max-width:10%}.Empty{padding:1.875rem;text-align:center}.Empty .Btn{margin-top:2rem}.Empty-img{height:6.25rem}.Empty-tip{color:var(--color-text-3);font-size:1.125rem;font-weight:600;margin:.375rem 0 0}.Empty-desc{color:var(--color-text-2);font-size:.9375rem;margin:.5rem 0;opacity:.6}.Flex{display:flex}.Flex--inline{display:inline-flex}.Flex--center{align-items:center;justify-content:center}.Flex--d-r{flex-direction:row}.Flex--d-rr{flex-direction:row-reverse}.Flex--d-c{flex-direction:column}.Flex--d-cr{flex-direction:column-reverse}.Flex--w-n{flex-wrap:nowrap}.Flex--w-w{flex-wrap:wrap}.Flex--w-wr{flex-wrap:wrap-reverse}.Flex--jc-fs{justify-content:flex-start}.Flex--jc-fe{justify-content:flex-end}.Flex--jc-c{justify-content:center}.Flex--jc-sb{justify-content:space-between}.Flex--jc-sa{justify-content:space-around}.Flex--ai-fs{align-items:flex-start}.Flex--ai-fe{align-items:flex-end}.Flex--ai-c{align-items:center}.FlexItem{flex:1;min-height:0;min-width:0}.HelpText{color:var(--color-text-2);font-size:.75rem}.Icon{display:inline-block;fill:currentColor;height:1em;stroke-width:0;transition:all .3s cubic-bezier(.18,.89,.32,1.28);width:1em}.is-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.IconBtn{background:transparent;border:0;border-radius:3px;color:var(--color-text-2);font-size:1.125rem;min-width:0;padding:0}.IconBtn.Btn--primary{color:var(--brand-2)}.IconBtn.Btn--lg{border-radius:6px;font-size:1.5rem}.IconBtn>.Icon,.IconBtn>img{display:block}.IconBtn>img{height:1em;width:1em}.Image{border-style:none;display:inline-block;overflow:hidden;position:relative}.Image--fluid{height:auto;max-width:100%}.ImageList{--image-list-size:2.75rem;--image-list-fit:cover;display:flex;flex-wrap:wrap;list-style:none;margin:-.25rem 0 0 -.25rem;overflow:hidden;padding:0}.ImageList .Image{border-radius:var(--radius-md);display:block;height:var(--image-list-size);margin:.25rem 0 0 .25rem;object-fit:var(--image-list-fit);width:var(--image-list-size)}.InfiniteScroll{overflow-y:scroll;-webkit-overflow-scrolling:touch}.InputWrapper{position:relative}.InputWrapper.has-counter{padding-bottom:1.25rem}.InputWrapper.has-counter+.HelpText{margin-top:-1.25rem}.Input{background:var(--color-fill-1);border:1px solid var(--color-line-1);border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text-1);display:block;font-family:inherit;font-size:.875rem;line-height:1.5;margin:0;min-height:1.5rem;padding:.3125rem .75rem;resize:none;width:100%;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;transition:.2s ease-in-out}.Input:focus{border-color:var(--brand-1);outline:none}.Input:focus:not([disabled]):not([readonly])~.Input-line:after,.Input:focus:not([disabled]):not([readonly])~.Input-line:before{width:50%}.Input:disabled{opacity:.5}.Input::-webkit-input-placeholder{color:var(--color-text-3)}.Input::placeholder{color:var(--color-text-3)}.Input--filled{background-color:var(--color-fill-2);border-color:transparent}.Input--flushed{background:none;border-radius:0;border-width:0 0 1px;padding:.125rem var(--gutter)}.Input--flushed:focus{box-shadow:var(--brand-1) 0 1px 0 0}.Input-counter{color:var(--color-text-3);float:right;font-size:.75rem;margin-right:var(--gutter);position:relative;z-index:1}.KvList{--kv-aside-width:5.625rem;--kv-title-color:var(--color-text-2);--kv-gap:0.625rem}.KvList[data-align=left] .KvItem-title{width:var(--kv-aside-width)}.KvList[data-align=left] .KvItem-desc{margin-left:calc(var(--kv-aside-width) + var(--kv-gap))}.KvList[data-align=right]{--kv-title-color:var(--color-text-1)}.KvList[data-align=right] .KvItem[data-level="2"]{--kv-title-color:var(--color-text-2)}.KvList[data-align=right] .KvItem-title{flex:1}.KvList[data-align=right] .KvItem-main{flex:initial;font-weight:500;text-align:right;width:var(--kv-aside-width)}.KvItem{color:var(--color-text-1);font-size:.9375rem}.KvItem+.KvItem{margin-top:.5rem}.KvItem[data-level="2"]{font-size:.875rem}.KvItem[data-highlight=true] .KvItem-main{color:var(--brand-1)}.KvItem .Icon{color:var(--color-text-2)}.KvItem .Price{font-size:inherit}.KvItem p{margin:0}.KvItem p+.ImageList{margin-top:.25rem}.KvItem-title{color:var(--kv-title-color)}.KvItem-main{margin-left:var(--kv-gap)}.KvItem-desc{color:var(--color-text-3);font-size:.75rem}.Label{color:var(--color-text-2);display:block;font-size:.75rem}.List{background:var(--color-fill-1)}.List--bordered{border:1px solid var(--color-line-1);border-radius:2px}.List[data-variant=buttons] .ListItem{border:1px solid var(--color-line-2);border-radius:var(--radius-md);color:var(--color-text-2);font-size:.875rem;line-height:1.5;margin-top:.5625rem;padding:.3125rem .75rem}.List[data-variant=buttons] .ListItem:first-child{margin-top:0}.ListItem{align-items:center;border:0;box-sizing:border-box;color:var(--color-text-1);display:flex;font-size:.9375rem;line-height:1.6;padding:.625rem var(--gutter);text-decoration:none;transition:.3s}.ListItem:focus:not(:focus-visible){outline:0}.ListItem+.ListItem{border-top:1px solid var(--color-line-1)}.ListItem .Icon{color:var(--color-text-3)}button.ListItem{-webkit-appearance:none;appearance:none;background:transparent;text-align:left;width:100%}a.ListItem:active,button.ListItem:active{background:var(--color-fill-2)}@media (hover:hover){a.ListItem:hover,button.ListItem:hover{background:rgba(0,0,0,.04);background-clip:padding-box;cursor:pointer}}.ListItem-content{flex:1}.Loading{color:var(--color-text-2);padding:.75rem}.Loading .Icon{font-size:1.875rem}.Loading-tip{font-size:.875rem;margin:0 0 0 .375rem}.MediaObject{display:flex}.MediaObject-pic{margin-right:.625rem;width:4.375rem}.MediaObject-pic>img{display:block;height:100%;width:100%}.MediaObject-info{flex:1}.MediaObject-title{font-size:.875rem;font-weight:400;margin:0 0 .375rem}.MediaObject-meta{color:var(--color-text-2);font-size:.75rem}.Message{position:relative}.Message+.Message{margin-top:var(--gutter)}.Message.left .Message-main>.Avatar{margin-right:var(--msg-avatar-gap)}.Message.left .Bubble{margin-right:var(--msg-gutter)}.Message.right .Message-content,.Message.right .Message-main{flex-direction:row-reverse}.Message.right .Message-main>.Avatar{margin-left:var(--msg-avatar-gap)}.Message.right .Message-author{text-align:right}.Message.right .Bubble{background:var(--brand-3);margin-left:var(--msg-gutter)}.Message.pop{display:none}.Message-meta{display:flex;justify-content:center;margin-bottom:.75rem;text-align:center}.Message-main>.Avatar{--avatar-size:var(--rate-width)}.Message-content,.Message-main{align-items:flex-start;display:flex}.Message-inner{flex:1;min-width:0}.Message-author{color:var(--color-text-2);font-size:var(--font-size-xs);line-height:1.1;margin-bottom:.375rem}.SystemMessage{color:var(--color-text-2);padding:0 15Px;text-align:center}.SystemMessage .Btn{margin-left:.375rem}.SystemMessage .Btn:disabled{color:var(--color-text-3);opacity:1}.SystemMessage-inner{border-radius:var(--radius-md);display:inline-block;font-size:12Px;padding:6Px 9Px;position:relative;text-align:left}.SystemMessage-inner:before{background:var(--color-fill-1);border-radius:inherit;content:"";height:100%;left:0;opacity:.7;position:absolute;top:0;width:100%;z-index:0}.SystemMessage-inner .Btn,.SystemMessage-inner span{position:relative;vertical-align:top;z-index:1}html[data-color-scheme=dark] .SystemMessage-inner{background:var(--color-fill-2)}html[data-color-scheme=dark] .SystemMessage-inner:before{content:none}html[data-color-scheme=dark] .SystemMessage-inner span{position:static}.ChatApp[data-elder-mode=true] .SystemMessage-inner{font-size:14Px;padding:7Px 14Px}.MessageStatus{align-self:center;font-size:15Px;margin-right:.75rem}.MessageStatus[data-status=loading] .Icon{color:var(--color-text-2)}.MessageStatus[data-status=fail] .IconBtn{color:#ff5959}.MessageStatus .Icon,.MessageStatus .IconBtn{display:block}.Message[data-type=text] .MessageStatus{margin-right:calc(4Px - var(--rate-width))}.Message[data-type=order] .MessageStatus{margin-left:calc(var(--rate-width) - 11Px);margin-right:calc(-4Px - var(--rate-width))}.Modal,.Popup{align-items:center;bottom:0;display:flex;height:100%;justify-content:center;left:0;outline:0;position:fixed;right:0;top:0;z-index:100}.Modal.active .Modal-dialog{opacity:1;-webkit-transform:none;transform:none}.Modal-dialog{background:var(--color-fill-1);border-radius:var(--radius-md);font-size:.9375rem;max-width:90vw;opacity:0;overflow:hidden;position:relative;-webkit-transform:translateY(-3.125rem);transform:translateY(-3.125rem);transition:opacity .15s linear,-webkit-transform .3s ease-out;transition:transform .3s ease-out,opacity .15s linear;transition:transform .3s ease-out,opacity .15s linear,-webkit-transform .3s ease-out;width:20rem;z-index:100}.Modal-dialog[data-has-avatar=true]{background-image:linear-gradient(to bottom,hsla(0,0%,100%,.75) 0,hsla(0,0%,100%,.75) 7.5rem),linear-gradient(to bottom,var(--brand-1) 0,var(--color-fill-1) 7.5rem);overflow:visible;padding-top:2.3125rem}.Modal-avatar{background-image:var(--avatar),linear-gradient(-51deg,hsla(0,0%,100%,.5) 0,hsla(0,0%,100%,.8) 100%),linear-gradient(-51deg,var(--brand-1) 0,var(--brand-1) 100%);background-repeat:no-repeat;background-size:cover;border:2px solid var(--color-fill-1);border-radius:50%;box-shadow:0 0 2px 0 var(--color-fill-1),0 0 2px 0 var(--brand-1);box-sizing:border-box;height:3.625rem;left:50%;position:absolute;top:0;-webkit-transform:translate(-50%,-25%);transform:translate(-50%,-25%);width:3.625rem}.Modal-header{padding:1.125rem 1.25rem .625rem;position:relative}.Modal-body{padding:1.125rem .9375rem}.Modal-header+.Modal-body{padding-top:0}.Modal-footer{display:flex}.Modal-footer .Btn--outline{border-color:var(--color-line-1);border-radius:0;border-width:1px 0 0;padding-bottom:.625rem;padding-top:.625rem}.Modal-footer .Btn--outline:not(.Btn--primary){color:var(--color-text-2)}.Modal-footer--h[data-variant=round]{padding:0 .9375rem 1.125rem}.Modal-footer--h[data-variant=round] .Btn+.Btn{margin-left:.75rem}.Modal-footer--h[data-variant=outline] .Btn+.Btn{border-left-width:1px}.Modal-footer--h .Btn{flex:1}.Modal-footer--v{flex-direction:column}.Confirm .Modal-body{text-align:center}.Popup{align-items:flex-end}.Popup.active .Popup-dialog{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.Popup-content{display:flex;flex-direction:column;height:100%}.Popup-dialog{background:var(--color-fill-1);border-radius:var(--radius-md) var(--radius-md) 0 0;opacity:0;overflow:hidden;position:relative;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);transition:.3s;width:100%;z-index:100}.Popup-dialog[data-bg-color=gray]{background:var(--color-fill-2)}.Popup-dialog[data-height="80"]{height:80vh}.Popup-dialog[data-height="60"]{height:60vh}.Popup-dialog[data-height="40"]{height:40vh}.Popup-header{padding:1.125rem 2.5rem .75rem;position:relative}.Modal-title,.Popup-title{color:var(--color-text-1);font-size:1.125rem;font-weight:500;margin:0;text-align:center}.Popup-subtitle{color:var(--color-text-3);font-size:.75rem;font-weight:400;margin:.1875rem 0 0;text-align:center}.Popup[data-elder-mode=true] .Modal-title,.Popup[data-elder-mode=true] .Popup-title{font-size:23Px}.Popup[data-elder-mode=true] .Popup-close{font-size:32Px}.Modal-close,.Popup-close{color:var(--color-text-1);position:absolute;right:.75rem}.Modal-close{top:.75rem}.Popup-title{min-height:25Px}.Popup-close{top:1.125rem}.Popup-body{flex:1;min-height:0}.Popup-body.overflow{max-height:70vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.Popup-footer{background:var(--color-fill-1);display:flex;flex-direction:column;padding:.5625rem .75rem;padding-bottom:calc(.5625rem + var(--safe-bottom));position:relative}.Popup-footer .Btn+.Btn{margin-top:.5625rem}.Popup-footer--h{flex-direction:row}.Popup-footer--h .Btn+.Btn{margin-left:.75rem;margin-top:0}.S--modalOpen,.S--modalOpen .MessageContainer>.PullToRefresh{overflow:hidden}.S--wide .Popup{align-items:center}.S--wide .Popup-dialog{border-radius:12px;width:30rem}.S--wide .Popup-footer--v{padding-bottom:.75rem}.Navbar{background:var(--navbar-bg);padding:0 var(--gutter);padding-top:var(--safe-top);position:relative;z-index:10}.Navbar,.Navbar-main{align-items:center;display:flex}.Navbar-main{box-sizing:border-box;flex:1;justify-content:center;min-height:44Px;padding:3Px 0}.Navbar-left,.Navbar-right{display:flex;width:58Px}.Navbar-right{justify-content:flex-end}.Navbar-title{color:var(--color-text-1);font-size:17Px;font-weight:500;margin:0}.Navbar-logo{display:block;height:38Px;width:auto}.Navbar .IconBtn{color:var(--color-text-1);font-size:24Px}.Navbar .IconBtn+.IconBtn,.Navbar .Navbar-rightSlot+.IconBtn{margin-left:12Px}.Navbar--left .Navbar-left{width:24Px}.Navbar--left .Navbar-right{width:auto}.Navbar--left .Navbar-main{justify-content:flex-start;margin-left:9Px;min-height:62Px}.Navbar-brand+.Navbar-inner{margin-left:9Px}.Navbar-desc{color:var(--color-text-2);font-size:12Px}.ChatApp[data-elder-mode=true] .Navbar .IconBtn{font-size:26Px}.ChatApp[data-elder-mode=true] .Navbar-logo{height:43Px}.ChatApp[data-elder-mode=true] .Navbar-title{font-size:18Px}.ChatApp[data-elder-mode=true] .Navbar-desc{font-size:13Px}.Notice{align-items:center;background:var(--color-fill-1);border-radius:var(--radius-md);display:flex;padding:.75rem}.Notice-icon{margin-right:.375rem}.Notice .Icon{color:var(--brand-1);font-size:1rem}.Notice-close{margin-left:.375rem}.Notice-close .Icon{color:var(--color-text-3)}.Notice-content{color:var(--color-text-1);flex:1;font-size:.8125rem;min-width:0}.Popover{font-size:.875rem;left:0;position:absolute;top:0;-webkit-transform:translateY(-.625rem);transform:translateY(-.625rem);z-index:1030}.Popover-body{background:var(--color-fill-1);border-radius:6px;box-shadow:var(--shadow-3)}.Popover-arrow{display:block;fill:var(--color-fill-1);height:.3125rem;margin-left:.625rem;width:.5625rem}.Price{display:inline;font-family:AlibabaSans,-apple-system,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:500}.Price--original{color:var(--color-text-3);text-decoration:line-through}.Price[data-size]{font-weight:700}.Price[data-size] .Price-currency,.Price[data-size] .Price-decimal,.Price[data-size] .Price-fraction{font-size:.6em}.Price[data-size] .Price-currency{font-size:max(.6em,.6875rem);margin-right:.125rem;vertical-align:.0625rem}.Price[data-size] .Price-decimal,.Price[data-size] .Price-fraction{font-size:max(.6em,.875rem)}.Price[data-size=xl]{font-size:1.875rem}.Price[data-size=lg]{font-size:1.5rem}.Price[data-size=md]{font-size:1.125rem}.Price[data-size=sm]{font-size:.875rem}.Price-currency{font-size:.8em}.Progress{background-color:var(--color-line-1);border-radius:100px;display:flex;height:.125rem;overflow:hidden}.Progress-bar{background-color:var(--blue);overflow:hidden;transition:width .6s ease}.Progress--success .Progress-bar{background-color:var(--green)}.Progress--error .Progress-bar{background-color:var(--red)}.PullToRefresh{height:100%;overflow-y:scroll}.no-scrolling .PullToRefresh{-webkit-overflow-scrolling:touch}.PullToRefresh-fallback{padding-top:var(--gutter);text-align:center}.PullToRefresh-loadMore{font-size:14Px}.PullToRefresh-inner{min-height:100%;overflow:hidden}.PullToRefresh-indicator{color:grey;height:1.875rem;line-height:1.875rem;margin-top:-1.875rem;text-align:center}.PullToRefresh-spinner{color:var(--color-text-3);font-size:1.6875rem}.PullToRefresh-transition{transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.QuickReplies{padding:9Px var(--gutter);transition:opacity .3s}.QuickReplies[data-visible=false]{opacity:0;visibility:hidden}.QuickReplies:not(.ScrollView--hasControls){padding-left:0;padding-right:0}.QuickReplies:not(.ScrollView--hasControls) .ScrollView-inner{padding:0 var(--gutter)}.QuickReplies:not(.ScrollView--hasControls) .ScrollView-item:last-child{padding-right:var(--gutter)}.QuickReply{background:var(--color-fill-1);border:1px solid transparent;border-radius:var(--radius-md);color:var(--color-text-1);cursor:pointer;display:block;font-size:14Px;line-height:20Px;margin:0;padding:4Px 12Px;position:relative;transition:.15s ease-in-out}.QuickReply.new:after{background:var(--red);border:1px solid var(--color-fill-1);border-radius:50%;content:"";height:.5rem;overflow:hidden;position:absolute;right:0;top:0;width:.5rem}.QuickReply.highlight{background:var(--color-fill-1);font-weight:500}.QuickReply.highlight:before{border:1px solid var(--brand-1);border-radius:inherit;bottom:-.0625rem;content:"";left:-.0625rem;opacity:.5;position:absolute;right:-.0625rem;top:-.0625rem}.QuickReply-inner{align-items:center;display:flex}.QuickReply-img{max-height:13Px}.QuickReply-img,.QuickReply-inner>.Icon{margin-right:3Px}.QuickReply .Icon{color:var(--brand-1);font-size:15Px}.ChatApp[data-elder-mode=true] .QuickReply{font-size:17Px;line-height:26Px}.ChatApp[data-elder-mode=true] .QuickReply .Icon{font-size:17Px}.ChatApp[data-elder-mode=true] .QuickReply-img{max-height:17Px}.Quote{border-left:3px solid var(--color-line-1);color:var(--color-text-2);font-size:.75rem;padding-left:.5625rem}.Quote+.Divider{margin-top:.5625rem}.Quote .Image,.Quote .Video-cover,.Quote .Video-video:not([hidden]){border-radius:var(--radius-md);max-height:4.5rem;max-width:4.5rem}.Quote .Image,.Quote .Video{display:inline-block;vertical-align:top}.Quote .Video-video{width:auto}.Quote .Video-playBtn{pointer-events:none}.Quote .Video-playIcon{font-size:1.5rem}.Bubble .Quote:hover{cursor:pointer}.Bubble .Quote-content a{pointer-events:none}.Quote-author{color:var(--color-text-3)}.Checkbox,.Radio{background:var(--color-fill-2);border-radius:var(--radius-md);color:var(--color-text-1);cursor:pointer;display:inline-block;font-size:.875rem;line-height:1.25rem;margin:var(--radio-gap) var(--radio-gap) 0 0;padding:.5rem;position:relative;text-align:center;transition:background .15s ease-in-out;-webkit-tap-highlight-color:transparent}.CheckboxGroup,.RadioGroup{--radio-gap:0.5rem;margin-top:calc(var(--radio-gap) * -1)}.CheckboxGroup[data-align=left],.RadioGroup[data-align=left]{text-align:left}.CheckboxGroup[data-align=right],.RadioGroup[data-align=right]{text-align:right}.CheckboxGroup[data-layout],.RadioGroup[data-layout]{display:flex;flex-wrap:wrap;margin-right:calc(var(--radio-gap) * -1)}.CheckboxGroup--block,.RadioGroup--block{margin-top:0}.CheckboxGroup--block .Checkbox,.RadioGroup--block .Radio{display:block;margin-right:0}.CheckboxGroup[data-layout] .Checkbox,.RadioGroup[data-layout] .Radio{flex:0 0 calc(100% / var(--max-per-row) - var(--radio-gap));min-width:0}.CheckboxGroup[data-layout=flex] .Checkbox,.RadioGroup[data-layout=flex] .Radio{flex:1}.Checkbox--disabled,.Radio--disabled{cursor:auto;opacity:.5}.Checkbox--checked,.Radio--checked{background:var(--brand-4);color:var(--brand-1);font-weight:600}.Checkbox-input,.Radio-input{cursor:inherit;height:100%;left:0;margin:0;opacity:0;padding:0;position:absolute;top:0;width:100%}.ChatApp[data-elder-mode=true]{--rate-width:38Px}.RateActions{align-self:flex-end;margin-left:var(--msg-avatar-gap);position:relative;width:var(--rate-width);z-index:10}.RateBtn{background:var(--color-fill-1);border-radius:var(--radius-md);font-size:calc(var(--rate-width) - 12Px);padding:6Px}.RateBtn+.RateBtn{margin-top:9Px}.RateBtn[data-type=up].active,.RateBtn[data-type=up]:hover{color:var(--brand-1)}.RateBtn[data-type=down].active,.RateBtn[data-type=down]:hover{color:var(--blue)}.RichText{word-wrap:break-word;overflow-wrap:break-word}.ScrollGrid{overflow:hidden}.ScrollGrid[data-wrap=true] .ScrollGrid-inner{flex-wrap:wrap}.ScrollGrid[data-wrap=false] .ScrollGrid-scroller{display:flex;margin-bottom:-1.125rem;overflow-x:scroll;overflow-y:hidden;padding-bottom:1.125rem}.ScrollGrid[data-wrap=false] .ScrollGrid-inner>div{flex:0 0 auto}.no-scrolling .ScrollGrid-scroller{-webkit-overflow-scrolling:touch}.ScrollGrid-scroller::-webkit-scrollbar{display:none}.ScrollGrid-inner{display:flex;min-width:100%}.ScrollGrid-indicator,.ScrollGrid-indicatorBar{border-radius:100px;height:.1875rem}.ScrollGrid-indicator{background:var(--color-line-1);margin:.1875rem auto 0;width:1.25rem}.ScrollGrid-indicatorBar{background:var(--brand-1);width:.625rem}.ScrollView{overflow:hidden}.ScrollView-scroller{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}.ScrollView-scroller::-webkit-scrollbar{display:none}.ScrollView--fullWidth{margin:0 calc(var(--gutter) * -1)}.ScrollView--fullWidth:not(.ScrollView--hasControls) .ScrollView-inner{padding:0 var(--gutter)}.ScrollView--x .ScrollView-scroller{display:flex;margin-bottom:-18Px;overflow-x:scroll;overflow-y:hidden;padding-bottom:18Px}.ScrollView--x .ScrollView-inner{display:flex}.ScrollView--x .ScrollView-item{flex:0 0 auto;margin-left:.375rem}.ScrollView--x .ScrollView-item:first-child{margin-left:0}.ScrollView--hasControls{align-items:center;display:flex}.ScrollView--hasControls .ScrollView-scroller{flex:1}.ScrollView-control{color:var(--color-text-3);font-size:1rem;padding:.375rem}.ScrollView-control:not(:disabled):hover{color:var(--brand-1)}.Search{align-items:center;background:var(--color-fill-1);border-radius:var(--radius-md);display:flex;padding:.1875rem .3125rem .1875rem .9375rem}.Search-clear,.Search-icon{font-size:var(--font-size-lg)}.Search-icon{color:var(--color-text-3)}.Search-input{border:0;flex:1;padding:0 .5625rem}.Search-input::-webkit-search-cancel-button{display:none}.Search-input:focus+.Search-clear,.Search-input:focus~.Btn--primary{opacity:1}.Search-clear{color:var(--color-text-3);opacity:0}.Search-clear:hover{background:initial;color:var(--color-text-3)}.Search[data-disabled=true]{opacity:.5}.Search .Btn--primary{font-size:var(--font-size-xs);margin-left:.375rem;min-width:3.5rem;opacity:0;padding:.125rem .75rem}.Select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;background-size:1rem .75rem}.Select:disabled{opacity:.5}@-webkit-keyframes shimmer{0%{background-position:-29.25rem 0}to{background-position:29.25rem 0}}@keyframes shimmer{0%{background-position:-29.25rem 0}to{background-position:29.25rem 0}}.Skeleton{-webkit-animation:shimmer 1.25s linear infinite forwards;animation:shimmer 1.25s linear infinite forwards;background:linear-gradient(90deg,var(--skeleton-bg-1) 8%,var(--skeleton-bg-2) 18%,var(--skeleton-bg-1) 33%);background-size:50rem 6.5rem}.Skeleton--r-sm{border-radius:2px}.Skeleton--r-md{border-radius:6px}.Skeleton--r-xl{border-radius:32px}.StatusBadge,.StatusBadge-bg,.StatusBadge-text{position:absolute;right:0;top:0}.StatusBadge{--status-badge-color:#662600;--status-badge-bg:#ffefd9}[data-status=expired]>.StatusBadge,[data-status=used]>.StatusBadge{--status-badge-color:#50607a;--status-badge-bg:rgba(80,96,122,.2)}.StatusBadge-text{color:var(--status-badge-color);font-size:.625rem;font-weight:500;line-height:.875rem;text-align:center;width:2.625rem}.Ribbon{--ribbon-bg:var(--brand-3);--ribbon-color:var(--brand-1);background-color:var(--ribbon-bg);color:var(--ribbon-color);font-size:.75rem;font-weight:500;padding:.125rem .375rem;position:absolute;top:0;white-space:nowrap}.Ribbon[data-color=gray]{--ribbon-bg:rgba(80,96,122,.2);--ribbon-color:var(--color-text-2)}.Ribbon[data-position=left]{border-radius:var(--radius-md) 0 var(--radius-md) 0;left:0}.Ribbon[data-position=left] .Arc-1{left:0;top:100%}.Ribbon[data-position=left] .Arc-2{left:100%;top:0}.Ribbon[data-position=center]{border-radius:0 0 var(--radius-md) var(--radius-md);left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.Ribbon[data-position=center] .Arc-1{right:100%;top:0;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.Ribbon[data-position=center] .Arc-2{left:100%;top:0}.Ribbon[data-position=right]{border-radius:0 var(--radius-md) 0 var(--radius-md);right:0}.Ribbon[data-position=right] .Arc-1{right:100%;top:0;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.Ribbon[data-position=right] .Arc-2{right:0;top:100%;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.Ribbon[data-size=sm]{font-size:.625rem;line-height:1}.Arc{color:var(--ribbon-bg);position:absolute}.Stepper{list-style-type:none;margin:0;padding:0}.Step{padding-bottom:.5625rem;padding-left:1.1875rem;position:relative}.Step:last-child{padding-bottom:0}.Step:last-child .Step-line{bottom:0}.Step--active .Step-dot{background:var(--brand-1);border-color:var(--brand-1)}.Step--active .Step-title span{color:var(--brand-1);font-weight:600}.Step--active .Step-desc{color:var(--color-text-1)}.Step--active[data-status] .Step-line{top:1.375rem}.Step--active[data-status] .Step-icon{color:var(--red)}.Step--active[data-status=success] .Step-icon{color:var(--green)}.Step-icon{align-items:center;display:flex;font-size:1rem;height:1.5rem;justify-content:center;left:0;position:absolute;top:0;width:1rem}.Step-dot{background:var(--color-fill-1);border:1px solid var(--color-line-2);border-radius:50%;box-sizing:border-box;height:.625rem;width:.625rem}.Step-line{background:var(--color-line-2);bottom:-.25rem;left:.5rem;position:absolute;top:1.25rem;-webkit-transform:translateX(-50%) scaleX(.5);transform:translateX(-50%) scaleX(.5);width:.0625rem}.Step-title{align-items:center;color:var(--color-text-3);display:flex;font-size:var(--font-size-md)}.Card .Step-title{font-size:.9375rem}.Step-title small{color:var(--color-text-3);font-size:var(--font-size-xs);margin-left:.75rem}.Step-desc{color:var(--color-text-3);font-size:var(--font-size-sm);margin-top:.375rem}.Tabs{--tab-font-size:0.9375rem;--tab-active-color:var(--color-text-1);--tab-line-bottom:0.3125rem}.Tabs[data-color=primary]{--tab-active-color:var(--brand-1)}.Tabs[data-size=lg]{--tab-font-size:1.125rem;--tab-line-bottom:0.1875rem}.Tabs-nav{display:flex;margin:.25rem 0;position:relative}.Tabs-nav::-webkit-scrollbar{display:none}.Tabs--scrollable .Tabs-nav{overflow:hidden;overflow-x:auto;position:relative;-webkit-overflow-scrolling:touch;margin-bottom:-.875rem;padding-bottom:1.125rem}.Tabs--scrollable .Tabs-navItem{flex:none}.Tabs--scrollable .Tabs-navItem:first-child{padding-left:.375rem}.Tabs--scrollable .Tabs-navItem:last-child{padding-right:.375rem}.Tabs-navItem{flex:1;text-align:center}.Tabs-navLink{background:transparent;border:0;border-radius:var(--radius-md);color:var(--color-text-2);font-size:var(--tab-font-size);line-height:1.125rem;padding:.5625rem;transition:color .3s}.Tabs-navLink:focus:not(:focus-visible){outline:0}.Tabs-navLink:hover{color:var(--color-text-1);cursor:pointer}.Tabs-navLink.active{color:var(--tab-active-color);font-weight:700;position:relative;z-index:1}.Tabs-navLink.active:after{background:currentColor;border-radius:var(--radius-sm);bottom:var(--tab-line-bottom);content:"";height:.125rem;left:50%;position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:.75rem}.Tabs-pane{display:none}.Tabs-pane.active{display:block}.Tag{border:1px solid var(--brand-1);border-radius:var(--radius-sm);color:var(--brand-1);display:inline-block;font-size:.75rem;line-height:1.25;margin:0 .25rem 0 0;padding:0 .375rem;position:relative;white-space:nowrap}.Tag--primary{border-color:transparent;color:var(--orange)}.Tag--primary:before{background:currentColor;border-radius:inherit;bottom:0;content:"";left:0;margin:-.0625rem;opacity:.14;position:absolute;right:0;top:0}.Tag--success{background:var(--green);border-color:var(--green);color:#fff}.Tag--danger{background:var(--red);border-color:var(--red);color:#fff}.Tag--warning{background:var(--orange);border-color:var(--orange);color:#fff}.Text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Text--break{overflow-wrap:break-word!important;word-break:break-word!important}.Text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;text-overflow:ellipsis}.Think[data-collapsed=true] .Think-toggle .Icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.Think-toggle{align-items:center;background:var(--color-fill-2);border-radius:var(--radius-md);cursor:pointer;display:flex;font-size:var(--font-size-xs);justify-content:center;margin-bottom:.75rem;padding:.4375rem .875rem;-webkit-user-select:none;user-select:none;width:-webkit-fit-content;width:fit-content;-webkit-tap-highlight-color:transparent}.Think-toggle .Icon{font-size:var(--font-size-sm);transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out}.Think-content{border-left:2px solid var(--color-line-1);color:var(--color-text-3);font-size:var(--font-size-sm);margin:.75rem 0;padding:.25rem 0 .25rem .5rem}.Think-content p{margin:0}.ReactMarkdown{min-height:1.5rem;-webkit-user-select:text;user-select:text}.ReactMarkdown,.ReactMarkdown p{font-size:1rem;font-weight:400}.ReactMarkdown ol,.ReactMarkdown ul{list-style:revert;margin:revert;padding:revert}.ReactMarkdown blockquote{border-left:2px solid #e5e5e5;color:#8b8b8b;font-size:.875rem;margin:1rem 0;padding:.25rem 0 .25rem .5rem}.ReactMarkdown blockquote p{font-size:.875rem}.Time{color:var(--color-text-3)}.Time,.Tips{font-size:.75rem}.Tips{background:var(--color-fill-2);border-radius:var(--radius-md);color:var(--color-text-1);padding:.5rem}.Tips .Icon{margin:.125rem .25rem 0 0}.Tips .Icon,.Tips[data-size=lg]{font-size:.875rem}.Tips[data-size=lg] .Icon{font-size:.9375rem}.Tips[data-primary=true]{background:var(--brand-4);color:var(--brand-1)}.Toast{display:flex;justify-content:center;left:0;opacity:0;position:fixed;right:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transition:all .3s ease 0s;visibility:hidden;z-index:200}.Toast[data-type=success] .Icon{color:var(--green)}.Toast[data-type=error] .Icon{color:var(--red)}.Toast[data-type=loading] .Icon{color:var(--brand-1)}.Toast.show{opacity:1;visibility:visible}.Toast .Icon{font-size:1.5rem;margin-right:.375rem}.Toast-content{background:var(--color-toast);border-radius:var(--radius-md);box-sizing:border-box;display:flex;max-width:90vw;padding:1.125rem 1.5rem}.Toast-message{color:var(--color-fill-1);flex:1;font-size:1rem;margin:0;word-break:break-word}.Toolbar{padding:var(--gutter);padding-top:0}.Toolbar-item{display:inline-block;margin-top:var(--gutter);text-align:center;width:25%}.Toolbar-btn{border:0;border-radius:0;color:var(--color-text-3);display:inline-block;font-weight:400;max-width:100%;min-width:0;overflow:hidden;padding:6Px;position:relative;vertical-align:top}.Toolbar-btn,.Toolbar-btn:hover{background:transparent}.Toolbar-btn:active .Toolbar-btnIcon{background:rgba(0,0,0,.04)}@media (hover:hover){.Toolbar-btn:hover .Toolbar-btnIcon{background:rgba(0,0,0,.04)}}.Toolbar-btnIcon{background:hsla(0,0%,100%,.8);border-radius:var(--radius-md);color:var(--color-text-1);display:inline-block;padding:12Px;transition:.3s}.Toolbar-btnIcon .Icon{font-size:30Px;vertical-align:top}.Toolbar-img{height:30Px;vertical-align:top;width:30Px}.Toolbar-btnText{display:block;font-size:14Px;line-height:1.1;margin-top:8Px;white-space:normal;word-wrap:break-word}.ChatApp[data-elder-mode=true] .Toolbar-btnIcon{padding:16Px}@media (min-width:350px){.ChatApp[data-elder-mode=true] .Toolbar-btnIcon{padding:19Px}.ChatApp[data-elder-mode=true] .Toolbar-btnIcon .Icon{font-size:36Px}}[data-tooltip]{cursor:pointer;position:relative}[data-tooltip]:after,[data-tooltip]:before{bottom:100%;left:50%;opacity:0;pointer-events:none;position:absolute;-webkit-transform:translate(-50%,.25rem);transform:translate(-50%,.25rem);-webkit-transform-origin:top;transform-origin:top;transition:all .18s ease-out .18s;z-index:200}[data-tooltip]:after{background:var(--color-text-1);border-radius:var(--radius-md);color:var(--color-fill-1);content:attr(aria-label);font-size:.75rem;margin-bottom:.625rem;padding:.5em 1em;white-space:nowrap}[data-tooltip]:before{border:.3125rem solid transparent;border-top:.3125rem solid var(--color-text-1);content:"";height:0;-webkit-transform-origin:top;transform-origin:top;width:0}[data-tooltip]:hover:after,[data-tooltip]:hover:before{opacity:1;-webkit-transform:translate(-50%);transform:translate(-50%)}.Tree{background:var(--color-fill-1)}.TreeNode-title{align-items:center;border-bottom:1px solid var(--color-line-1);display:flex;justify-content:space-between;padding:.625rem .9375rem}.TreeNode-title:hover{background:var(--color-fill-2);cursor:pointer}.TreeNode:last-child .TreeNode-title{border:0}.TreeNode-children-title{border-bottom:1px solid var(--color-line-1)}.TreeNode-title-text{display:-webkit-box;-webkit-line-clamp:1;overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical;flex:1}.TreeNode-children{display:none}.TreeNode-children-active{display:block}.Typing{align-items:center;display:flex;height:1.40625rem}.Typing-text{font-size:.9375rem;margin-right:.5625rem}.Typing-dot{-webkit-animation:typing-dot 1.6s ease-in-out infinite;animation:typing-dot 1.6s ease-in-out infinite;background:var(--gray-4);border-radius:4px;display:inline-block;height:.25rem;width:.25rem}.Typing-dot+.Typing-dot{margin-left:.25rem}.Typing-dot[data-i="1"]{-webkit-animation-delay:.2s;animation-delay:.2s}.Typing-dot[data-i="2"]{-webkit-animation-delay:.3s;animation-delay:.3s}@-webkit-keyframes typing-dot{0%,40%,to{background:var(--gray-4)}20%{background:var(--gray-3);-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes typing-dot{0%,40%,to{background:var(--gray-4)}20%{background:var(--gray-3);-webkit-transform:scale(1.2);transform:scale(1.2)}}.Video{border-radius:inherit;position:relative}.Video-cover,.Video-video:not([hidden]){border-radius:inherit;display:block;max-height:100%;width:100%}.Video-duration{bottom:.375rem;color:var(--color-fill-1);line-height:1;position:absolute;right:.375rem;z-index:1}.Video-playBtn{background:transparent;border:0;height:100%;left:0;margin:0;padding:0;position:absolute;top:0;width:100%}.Video-playBtn:hover{cursor:pointer}.Video-playIcon{font-size:2.625rem}.Video--playing .Video-playBtn{display:none}.Card{--card-radius:var(--radius-md);background:var(--color-fill-1);border-radius:var(--card-radius);overflow:hidden}.Card--xl{width:300Px}.Card--lg{width:10rem}.Card--md{width:7.5rem}.Card--sm{width:6.5rem}.Card--xs{width:5rem}.Card--fluid{max-width:432Px;min-width:256Px;width:calc(100% - var(--msg-gutter))}.Card[data-fluid=order]{max-width:22.5rem}.CardMedia{background-position:50%;background-repeat:no-repeat;background-size:cover;position:relative}.CardMedia:after{content:"";display:block;height:0}.CardMedia--wide:after{padding-top:56.25%}.CardMedia--square:after{padding-top:100%}.CardMedia-content{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.CardHeader{padding:.75rem .75rem .5625rem;position:relative}.CardHeader[data-has-bg=true]{border-top-left-radius:inherit;border-top-right-radius:inherit;margin-top:1Px;padding-bottom:calc(.5625rem + var(--card-radius))}.CardHeader[data-has-bg=true]+[class^=Card]{background-color:inherit;border-top-left-radius:inherit;border-top-right-radius:inherit;margin-top:calc(-1 * var(--card-radius));position:relative}.CardHeader-logo{display:block;height:1.5rem}.CardHeader-icon{font-size:1.25rem;height:1.25rem;margin:.125rem .375rem .125rem 0}.CardHeader-title{color:var(--color-text-1);font-size:1rem;font-weight:500;margin:0}.CardHeader-desc{color:var(--color-text-2);font-size:.875rem;font-weight:500;margin:.125rem 0 0}.CardHeader-badge{background:100%/contain no-repeat;margin:-.75rem;width:5.625rem}.CardHeader-badge,.CardHeader-slot{margin-left:.5625rem}.CardHeader-slot{display:flex}.CardHeader-slot .Btn{font-size:.75rem;min-width:auto;padding:.125rem .5625rem}.CardHeader-slot>a{align-items:center;color:var(--color-text-2);display:flex;font-size:.875rem;text-decoration:none}.CardHeader-slot>a .Icon{font-size:1rem}.CardTitle{padding:.75rem .75rem .375rem}.CardTitle--center{padding:.25rem .125rem;text-align:center}.CardTitle-title{font-size:1rem;font-weight:500;margin:0}.CardTitle-subtitle{color:var(--color-text-3);font-size:.625rem;margin:0}.CardContent,.CardText{padding:.75rem}.CardText{color:var(--color-text-1)}.CardText p{margin:0}.CardActions{display:flex;padding:.75rem .75rem 1.125rem}.CardActions .Btn{flex:1;line-height:1.5}.CardActions .Btn+.Btn{margin-left:.75rem}.CardActions--column{flex-direction:column;padding:0}.CardActions--column .Btn{background:var(--color-fill-1);border:0;border-radius:0;border-top:1px solid var(--color-line-1);color:var(--color-text-2);padding:.625rem}.CardActions--column .Btn:last-child{border-radius:0 0 var(--card-radius) var(--card-radius)}.CardActions--column .Btn:active{background:var(--color-fill-2)}.CardActions--column .Btn+.Btn{margin:0}.CardActions--column .Btn--primary{color:var(--brand-1)}@media (hover:hover){.CardActions--column .Btn:hover{background:var(--color-fill-2)}}.CardContent+[class^=Card],.CardHeader[data-has-bg=false]+[class^=Card],.CardText+[class^=Card],.CardTitle+[class^=Card]{padding-top:0}.Carousel{overflow:hidden;position:relative}.Carousel--draggable .Carousel-inner{cursor:grab;touch-action:pan-y}.Carousel--draggable .Carousel-inner:active{cursor:grabbing}.Carousel--rtl{direction:rtl}.Carousel--dragging .Carousel-item{pointer-events:none}.Carousel-inner{display:flex;will-change:transform}.Carousel-dots{bottom:.5rem;display:flex;justify-content:center;left:50%;list-style-type:none;margin:0;padding:0;position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:1}.Carousel-dot{background:var(--color-fill-2);border:0;border-radius:50%;cursor:pointer;display:block;height:.5rem;margin:0 .25rem;padding:0;transition:.3s;width:.5rem}.Carousel-dot.active{background:var(--brand-1)}.FileCard{padding:.5rem}.FileCard-icon{color:var(--color-text-2);height:3.75rem;margin-right:.5rem;position:relative}.FileCard-icon[data-type=pdf]{color:var(--red)}.FileCard-icon[data-type*=doc]{color:var(--blue)}.FileCard-icon[data-type*=ppt],.FileCard-icon[data-type=key]{color:var(--orange)}.FileCard-icon[data-type*=xls]{color:var(--green)}.FileCard-icon[data-type=rar],.FileCard-icon[data-type=zip]{color:var(--brand-1)}.FileCard-icon .Icon{font-size:3.75rem}.FileCard-name{height:2.375rem;line-height:1.4;margin-bottom:.25rem}.FileCard-ext{bottom:.9375rem;font-size:1rem;font-weight:700;left:1.25rem;max-width:3.125rem;position:absolute;text-transform:uppercase;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:left bottom;transform-origin:left bottom}.FileCard-meta{color:var(--color-text-3);font-size:.75rem}.FileCard-meta>a,.FileCard-meta>span{margin-right:.625rem}.FileCard-meta a{color:var(--link-color);text-decoration:none}.Filter{--filter-bg:#fff;--filter-options-padding:0.5rem 1rem;--filter-option-padding:0.125rem 0.75rem;--filter-child-count:3;position:relative}.Filter[data-size=lg]{--filter-options-padding:0.25rem 1rem;--filter-option-padding:0.375rem 0.75rem}.Filter-mask{background:linear-gradient(to right,hsla(0,0%,100%,0) 0,var(--filter-bg) 62%);bottom:0;pointer-events:none;position:absolute;right:0;top:0;width:2.75rem;z-index:2}.FilterOptions{display:flex;gap:.25rem;padding:var(--filter-options-padding);scrollbar-width:none}.FilterOptions::-webkit-scrollbar{display:none}.FilterOptions[data-scrollable=true]{overflow-x:auto}.FilterOptions[data-scrollable=false] .FilterOption{flex:1;justify-content:center}.FilterOption{align-items:center;background:var(--color-fill-2);border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text-1);display:flex;font-size:var(--font-size-sm);line-height:1.5rem;padding:var(--filter-option-padding);white-space:nowrap}.FilterOption:hover{cursor:pointer}.FilterOption[data-active=true]{background:var(--brand-4);color:var(--brand-1)}.FilterOption[data-expanded=true] .Icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.FilterOption .Icon{font-size:var(--font-size-body);margin-left:.125rem}.FilterChildOptions{background:#fff;border-radius:0 0 var(--radius-md) var(--radius-md);box-sizing:border-box;display:flex;flex-wrap:wrap;gap:.25rem;left:0;padding:var(--filter-options-padding);position:absolute;right:0;top:100%;z-index:1}.FilterChildOptions .FilterOption{justify-content:center;width:calc((100% - .25rem * (var(--filter-child-count) - 1)) / var(--filter-child-count))}.Form{background:var(--color-fill-1)}.Form.is-light .FormItem{padding:0}.Form.is-light .HelpText,.Form.is-light .Label,.FormItem{padding:0 var(--gutter)}.FormItem{position:relative}.FormItem+.FormItem{margin-top:1.25rem}.FormItem.required .Label:after{color:var(--red);content:"*";display:inline-block;font-family:SimSun,sans-serif;font-size:.875rem;line-height:1;vertical-align:middle}.FormItem.is-invalid .HelpText,.FormItem.is-invalid .Label{color:var(--red)}.FormItem.is-invalid .Input{border-color:var(--red)}.FormItem .CheckboxGroup,.FormItem .RadioGroup{margin-top:.625rem}.FormItem .Label+.Input{margin-top:.3125rem}.FormActions{background:var(--color-fill-1);display:flex;padding:.625rem var(--gutter)}.FormActions .Btn{flex:1}.FormActions .Btn+.Btn{margin-left:.375rem}.Coupon{--coupon-object-width:5rem;--coupon-height:5rem;--coupon-value-color:var(--red);--coupon-condition-color:rgba(255,3,0,.5);--coupon-main-text-color:var(--color-text-1);--coupon-name-font-size:0.9375rem;--coupon-desc-color:rgba(255,3,0,.9);--coupon-desc-font-size:0.75rem;--coupon-bg:#fff2f2;--coupon-border-color:rgba(232,16,0,.15);--btn-padding:0.1875rem 0.75rem;--btn-bg:var(--red);--btn-active-bg:var(--btn-bg);--btn-hover-bg:var(--btn-bg);--btn-border-color:var(--btn-bg);--btn-color:var(--white);--btn-font-size:0.8125rem;background:var(--coupon-bg);border:1px solid var(--coupon-border-color);border-radius:var(--radius-md);box-sizing:border-box;color:var(--coupon-main-text-color);height:var(--coupon-height);-webkit-mask:radial-gradient(circle at var(--coupon-object-width) top,transparent .25rem,#000 0) top left /100% 50% no-repeat,radial-gradient(circle at var(--coupon-object-width) bottom,transparent .25rem,#000 0) bottom right /100% 50% no-repeat;mask:radial-gradient(circle at var(--coupon-object-width) top,transparent .25rem,#000 0) top left /100% 50% no-repeat,radial-gradient(circle at var(--coupon-object-width) bottom,transparent .25rem,#000 0) bottom right /100% 50% no-repeat;position:relative}.Coupon .Btn{margin:.75rem;min-width:0}.Coupon[data-status=deleted],.Coupon[data-status=expired],.Coupon[data-status=used]{--coupon-border-color:var(--color-line-2);--coupon-value-color:var(--color-text-1);--coupon-condition-color:var(--color-text-3);--coupon-main-text-color:var(--color-text-1);--coupon-desc-color:var(--color-text-2);--coupon-bg:var(--color-fill-2);--btn-bg:transparent;--btn-border-color:var(--red);--btn-color:var(--red)}.Coupon[data-status=deleted] .Coupon-arc,.Coupon[data-status=expired] .Coupon-arc,.Coupon[data-status=used] .Coupon-arc{display:none}.Coupon[data-in-list=false]{--coupon-width:4.375rem;--coupon-height:3.8125rem;--coupon-name-font-size:0.75rem;--coupon-desc-font-size:0.625rem;--btn-padding:0.125rem 0.375rem;--btn-font-size:0.75rem}.Coupon[data-in-list=false][data-status=deleted],.Coupon[data-in-list=false][data-status=expired],.Coupon[data-in-list=false][data-status=used]{--btn-border-color:var(--color-line-2);--btn-color:var(--color-text-2)}.Coupon .Countdown-unit{background:rgba(255,3,0,.1);color:var(--coupon-value-color)}.Coupon-object{color:var(--coupon-value-color);line-height:1.15;overflow:hidden;position:relative;width:var(--coupon-object-width)}.Coupon-discount-suffix{font-size:.6em;font-weight:500;margin-left:.125rem}.Coupon-condition{color:var(--coupon-condition-color);font-size:.625rem}.Coupon-divider{border-left:1px dashed var(--coupon-border-color);height:calc(100% - 1rem);margin:.5rem .75rem .5rem -.0625rem;position:relative}.Coupon-main{display:flex;flex-direction:column;justify-content:center}.Coupon-name{font-size:var(--coupon-name-font-size);font-weight:500}.Coupon-desc{color:var(--coupon-desc-color);font-size:var(--coupon-desc-font-size)}@media (max-width:374px){.Coupon .Btn{margin:0 .5rem 0 .375rem}}@supports ((-webkit-mask-image:url("")) or (mask-image:url(""))){.Coupon-divider:after,.Coupon-divider:before{border:1px solid var(--coupon-border-color);border-radius:50%;box-sizing:border-box;content:"";height:.625rem;left:-.375rem;position:absolute;width:.625rem}.Coupon-divider:before{top:-.875rem}.Coupon-divider:after{bottom:-.875rem}}.Goods{font-size:.875rem;padding:.75rem}.Goods[data-elder-mode=true]{--goods-img-size:3.5rem}.Goods[data-elder-mode=true] .Price{color:var(--brand-1)}.Goods[data-variant=inList]{--goods-img-size:5.5rem}.Goods[data-variant=inList] .Goods-status{color:var(--highlight-2);display:flex;justify-content:flex-end}.Goods[data-variant=compact]{--goods-img-size:2.75rem;background:var(--color-fill-2);color:var(--color-text-2);padding:.5rem}.Goods[data-variant=compact] .Price{font-weight:400}.Goods+.Goods{border-top:1px solid var(--color-line-1)}.Goods-img{border-radius:var(--radius-md);height:var(--goods-img-size);object-fit:cover;width:var(--goods-img-size)}.Goods-name{font-size:.875rem;font-weight:400;margin:0}.Goods-main .Price{margin-right:9Px}.Goods-desc{margin-top:2Px;word-break:break-all}.Goods-desc,.Goods-meta{color:var(--color-text-3)}.Goods-meta{font-size:.625rem}.Goods-countUnit{color:var(--color-text-3);font-size:.875rem;margin-left:.375rem}.Goods-unit{font-size:.75rem;margin-left:.1875rem}.Goods-buyBtn{color:#fff;float:right;padding:.125rem}.Goods-buyBtn,.Goods-buyBtn:hover{background:var(--brand-1)}.Goods-aside{align-items:flex-end;display:flex;flex-direction:column;margin-left:6Px}.Goods-status{align-items:center;color:var(--highlight-1);display:inline-flex}.Goods .Btn{min-width:0}.Goods-countUnit,.Goods-slot,.Goods-status,.Goods-tags{margin-top:2Px}.Goods-figure{align-self:flex-start;display:flex;margin-right:9Px;position:relative}.Goods-caption{background:rgba(14,17,25,.5);border-radius:0 0 var(--radius-md) var(--radius-md);bottom:0;color:var(--white);font-size:.75rem;left:0;line-height:1.25rem;position:absolute;right:0;text-align:center}.OrderObject{background:var(--color-fill-2);border-radius:var(--radius-md);color:var(--color-text-2);font-size:.875rem;padding:.5rem}.OrderObject .Goods{padding:0}.OrderObject .Icon{font-size:1rem}.OrderObject-title{margin-bottom:.25rem}.RedPacket{--red-packet-object-width:5.25rem;--red-packet-height:5rem;--red-packet-color:var(--red);--red-packet-value-color:var(--red-packet-color);--red-packet-condition-color:rgba(255,3,0,.5);--red-packet-main-text-color:var(--white);--red-packet-name-font-size:0.9375rem;--red-packet-desc-color:hsla(0,0%,100%,.9);--red-packet-desc-font-size:0.75rem;--red-packet-object-bg:var(--white);--red-packet-bg:linear-gradient(270deg,#f33,#f43 43%);--red-packet-arc-color:#f43;--btn-padding:0.1875rem 0.75rem;--btn-bg:#fff0e9;--btn-active-bg:var(--btn-bg);--btn-hover-bg:var(--btn-bg);--btn-border-color:var(--btn-bg);--btn-color:var(--red-packet-color);--btn-font-size:0.8125rem;background:var(--red-packet-bg);border-radius:var(--radius-md);border-top-right-radius:calc(var(--radius-md) + 2px);box-sizing:border-box;color:var(--red-packet-main-text-color);height:var(--red-packet-height);position:relative}.RedPacket .Btn{margin:.75rem;min-width:0}.RedPacket[data-variant=cash]{--red-packet-color:#5b360d;--red-packet-main-text-color:var(--red-packet-color);--red-packet-desc-color:rgba(91,54,13,.9);--red-packet-bg:linear-gradient(270deg,#ffd7a8,#ffe0ba 50%);--red-packet-arc-color:#ffe0ba}.RedPacket[data-variant=cash] .Countdown-unit{background:rgba(91,54,13,.1)}.RedPacket[data-variant=image]{--red-packet-bg:#fff2f2;--red-packet-arc-color:#fff2f2;--red-packet-main-text-color:var(--red);--red-packet-desc-color:rgba(255,3,0,.9);--btn-bg:var(--red);--btn-color:var(--white)}.RedPacket[data-status=expired],.RedPacket[data-status=used]{border:1px solid var(--color-line-2);--red-packet-value-color:var(--color-text-1);--red-packet-condition-color:var(--color-text-3);--red-packet-main-text-color:var(--color-text-1);--red-packet-desc-color:var(--color-text-2);--red-packet-object-bg:transparent;--red-packet-bg:var(--color-fill-2);--btn-bg:transparent;--btn-border-color:var(--red-packet-color);--btn-color:var(--red-packet-color)}.RedPacket[data-status=expired] .RedPacket-arc,.RedPacket[data-status=used] .RedPacket-arc{display:none}.RedPacket[data-in-list=false]{--red-packet-object-width:4.375rem;--red-packet-height:3.8125rem;--red-packet-name-font-size:0.75rem;--red-packet-desc-font-size:0.625rem;--btn-padding:0.125rem 0.375rem;--btn-font-size:0.75rem}.RedPacket[data-in-list=false][data-status=expired],.RedPacket[data-in-list=false][data-status=used]{--btn-border-color:var(--color-line-2);--btn-color:var(--color-text-2)}.RedPacket-object{background:var(--red-packet-object-bg);background-clip:content-box;border:2px solid transparent;border-radius:var(--radius-md) 0 0 var(--radius-md);color:var(--red-packet-value-color);line-height:1.15;margin-right:.75rem;position:relative;width:var(--red-packet-object-width)}.RedPacket-condition{color:var(--red-packet-condition-color);font-size:.625rem}.RedPacket-arc{height:var(--red-packet-height);position:absolute;right:-.375rem;top:-.125rem;width:.75rem}.RedPacket-main{display:flex;flex-direction:column;justify-content:center}.RedPacket-name{font-size:var(--red-packet-name-font-size);font-weight:500}.RedPacket-desc{color:var(--red-packet-desc-color);font-size:var(--red-packet-desc-font-size)}@media (max-width:374px){.RedPacket .Btn{margin:0 .5rem 0 .375rem}}.MultiRedPacket{align-items:center;display:flex}.MultiRedPacket .RedPacket{--red-packet-object-width:3.75rem;--red-packet-name-font-size:0.9375rem;--red-packet-desc-font-size:0.75rem;flex:1}.MultiRedPacket .RedPacket-img{height:2.25rem;width:2.25rem}.MultiRedPacket .RedPacket-desc span+span{border-left:1px solid hsla(0,0%,100%,.45);margin-left:.375rem;padding-left:.375rem}.MultiRedPacket .RedPacket-desc strong{font-size:.875rem}.MultiRedPacket-stack{align-items:center;display:flex;position:relative}.MultiRedPacket-stack:after,.MultiRedPacket-stack:before{background:#fff;border:2px solid #f99;border-radius:var(--radius-md) 0 0 var(--radius-md);border-right:0;box-sizing:border-box;content:"";display:block;margin-right:-.125rem;width:.375rem}.MultiRedPacket-stack:before{border-color:#f99;height:3.3125rem}.MultiRedPacket-stack:after{border-color:#f66;height:3.5625rem}.MessageContainer{display:flex;flex:1;flex-direction:column;min-height:0;position:relative}.MessageContainer>.PullToRefresh{flex:1}.MessageContainer:focus{outline:0}.MessageList{font-size:.9375rem;padding:var(--gutter)}.RecorderToast{background:var(--color-toast);border-radius:12px;color:var(--color-fill-1);height:10rem;left:50%;padding:.625rem;position:fixed;text-align:center;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:10rem;z-index:100}.Recorder--cancel .RecorderToast{color:var(--red)}.Recorder--cancel .Recorder-btn{background:rgba(0,0,0,.04);color:var(--color-text-3)}.RecorderToast-icon{font-size:2.3125rem;position:relative}.RecorderToast-waves{height:100%;position:absolute;transition:.3s;width:100%;z-index:-1}.RecorderToast-wave-1,.RecorderToast-wave-2,.RecorderToast-wave-3{-webkit-animation:wave 10s linear infinite;animation:wave 10s linear infinite;color:var(--brand-2);position:absolute;z-index:-1}.RecorderToast-wave-1{font-size:11rem;left:.875rem;opacity:.2;top:-1.5625rem}.RecorderToast-wave-2{font-size:11.625rem;left:-1.3125rem;opacity:.4;top:-.75rem}.RecorderToast-wave-3{font-size:4.4375rem;left:3.4375rem;opacity:.8;top:2.5rem}.Recorder-btn{background:var(--color-fill-1);border-radius:var(--radius-md);color:var(--brand-1);height:2.25rem;line-height:2.25rem;text-align:center;transition:.3s}@-webkit-keyframes wave{0%{-webkit-transform:translateY(5%) rotate(0);transform:translateY(5%) rotate(0)}50%{-webkit-transform:translateY(-5%) rotate(180deg);transform:translateY(-5%) rotate(180deg)}to{-webkit-transform:translateY(5%) rotate(1turn);transform:translateY(5%) rotate(1turn)}}@keyframes wave{0%{-webkit-transform:translateY(5%) rotate(0);transform:translateY(5%) rotate(0)}50%{-webkit-transform:translateY(-5%) rotate(180deg);transform:translateY(-5%) rotate(180deg)}to{-webkit-transform:translateY(5%) rotate(1turn);transform:translateY(5%) rotate(1turn)}}.Composer{align-items:flex-end;display:flex;padding:.5625rem var(--gutter);--action-size:36Px;--action-font-size:20Px}.Composer>div+div{margin-left:9Px}.Composer[data-has-value=false] .Composer-actions[data-action=send],.Composer[data-has-value=true] .Composer-actions[data-action-icon]{margin:0;opacity:0;width:0}.Composer[data-has-value=true] .Composer-inputWrap{margin-left:0}.Composer[data-has-value=true] .Composer-sendBtn{-webkit-animation:sendIn .3s;animation:sendIn .3s}.Composer-actions{align-items:center;display:flex;height:var(--action-size);overflow:hidden;transition:width .1s;width:var(--action-size)}.Composer-actions[data-action=send]{width:var(--send-width,63Px)}.Composer-actions .IconBtn{background:var(--color-fill-1);color:var(--color-text-1);font-size:var(--action-font-size);padding:8Px}.Composer-toggleBtn .Icon{transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.Composer-toggleBtn.active .Icon{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.Composer-inputWrap{flex:1;position:relative}.Composer-input{border:0;border-radius:var(--radius-md);caret-color:var(--brand-2);font-size:15Px;line-height:20Px;max-height:8.25rem;overflow-x:hidden;padding:.5rem .75rem;transition:border-color .15s ease-in-out}.Composer-sendBtn{flex:0 0 auto;min-width:0;padding-left:16Px;padding-right:16Px}@-webkit-keyframes sendIn{0%{-webkit-transform:scale(.2);transform:scale(.2)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sendIn{0%{-webkit-transform:scale(.2);transform:scale(.2)}to{-webkit-transform:scale(1);transform:scale(1)}}.ChatApp[data-elder-mode=true] .Composer{--action-size:50Px;--action-font-size:34Px}.ChatApp[data-elder-mode=true] .Composer-input{font-size:21Px;line-height:32Px;padding:9Px 12Px}.ChatApp[data-elder-mode=true] .Composer-sendBtn{font-size:17Px;padding:4Px 13Px}.SendConfirm .Modal-dialog{margin:1.25rem;width:30rem}.SendConfirm-inner{height:20rem;text-align:center}.SendConfirm-inner img{max-height:100%;max-width:100%}html{height:100vh}html[data-safari]{height:calc(100vh - calc(100vh - 100%))}#root,body{height:100%}body{margin:0;overflow:hidden}@media (hover:none){body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}}.ChatApp{background:var(--app-bg);color:var(--color-text-1);display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;height:100%;line-height:1.5;-webkit-tap-highlight-color:transparent}.S--focusing{--safe-bottom:0}@supports (-webkit-touch-callout:none){.S--focusing .MessageList{margin-top:75vh}}.ChatFooter{background:var(--footer-bg);padding-bottom:var(--safe-bottom);position:relative;z-index:10}@media (max-width:374px){:root{--msg-avatar-gap:3Px;--rate-width:24Px}.MessageList{padding-left:.375rem;padding-right:.375rem}}
|