@lobehub/ui 5.9.2 → 5.9.3

package/es/chat/EditableMessage/EditableMessage.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EditableMessage.mjs","names":["useControlledState"],"sources":["../../../src/chat/EditableMessage/EditableMessage.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport MessageInput from '@/chat/MessageInput';\nimport MessageModal from '@/chat/MessageModal';\nimport Markdown from '@/Markdown';\n\nimport { type EditableMessageProps } from './type';\n\nconst EditableMessage = memo<EditableMessageProps>(\n  ({\n    value,\n    onChange,\n    classNames = {},\n    onEditingChange,\n    editing,\n    openModal,\n    onOpenChange,\n    placeholder,\n    showEditWhenEmpty = false,\n    styles: customStyles,\n    className,\n    style,\n    height,\n    variant,\n    editButtonSize,\n    text,\n    fullFeaturedCodeBlock,\n    model,\n    fontSize,\n    language = 'markdown',\n    markdownProps,\n  }) => {\n    const [isEdit, setTyping] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    const [expand, setExpand] = useControlledState<boolean>(false, {\n      onChange: onOpenChange,\n      value: openModal,\n    });\n\n    const isAutoSize = height === 'auto';\n\n    const input = (\n      <MessageInput\n        shortcut\n        className={cx(className, classNames?.input)}\n        classNames={classNames}\n        defaultValue={value}\n        editButtonSize={editButtonSize}\n        height={height}\n        language={language}\n        placeholder={placeholder}\n        styles={customStyles}\n        text={text}\n        variant={variant}\n        style={{\n          ...style,\n          ...customStyles?.input,\n        }}\n        onCancel={() => setTyping(false)}\n        onConfirm={(text) => {\n          onChange?.(text);\n          setTyping(false);\n        }}\n      />\n    );\n\n    if (!value && showEditWhenEmpty) return input;\n\n    return (\n      <>\n        {!expand && isEdit ? (\n          input\n        ) : (\n          <Markdown\n            className={cx(className, classNames?.markdown)}\n            fontSize={fontSize}\n            fullFeaturedCodeBlock={fullFeaturedCodeBlock}\n            variant={'chat'}\n            style={{\n              height: isAutoSize ? 'unset' : height,\n              ...style,\n              ...customStyles?.markdown,\n            }}\n            {...markdownProps}\n          >\n            {value || placeholder || ''}\n          </Markdown>\n        )}\n        {expand && (\n          <MessageModal\n            editing={isEdit}\n            extra={model?.extra}\n            footer={model?.footer}\n            height={height}\n            language={language}\n            open={expand}\n            placeholder={placeholder}\n            text={text}\n            value={value}\n            onChange={onChange}\n            onEditingChange={setTyping}\n            onOpenChange={(e) => {\n              setExpand(e);\n              setTyping(false);\n            }}\n          />\n        )}\n      </>\n    );\n  },\n);\n\nEditableMessage.displayName = 'EditableMessage';\n\nexport default EditableMessage;\n"],"mappings":";;;;;;;;;AAYA,MAAM,kBAAkB,MACrB,EACC,OACA,UACA,aAAa,EAAE,EACf,iBACA,SACA,WACA,cACA,aACA,oBAAoB,OACpB,QAAQ,cACR,WACA,OACA,QACA,SACA,gBACA,MACA,uBACA,OACA,UACA,WAAW,YACX,oBACI;CACJ,MAAM,CAAC,QAAQ,aAAaA,cAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,QAAQ,aAAaA,cAA4B,OAAO;EAC7D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,aAAa,WAAW;CAE9B,MAAM,QACJ,oBAAC,cAAD;EACE,UAAA;EACA,WAAW,GAAG,WAAW,YAAY,MAAM;EAC/B;EACZ,cAAc;EACE;EACR;EACE;EACG;EACb,QAAQ;EACF;EACG;EACT,OAAO;GACL,GAAG;GACH,GAAG,cAAc;GAClB;EACD,gBAAgB,UAAU,MAAM;EAChC,YAAY,SAAS;AACnB,cAAW,KAAK;AAChB,aAAU,MAAM;;EAElB,CAAA;AAGJ,KAAI,CAAC,SAAS,kBAAmB,QAAO;AAExC,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,CAAC,UAAU,SACV,QAEA,oBAAC,UAAD;EACE,WAAW,GAAG,WAAW,YAAY,SAAS;EACpC;EACa;EACvB,SAAS;EACT,OAAO;GACL,QAAQ,aAAa,UAAU;GAC/B,GAAG;GACH,GAAG,cAAc;GAClB;EACD,GAAI;YAEH,SAAS,eAAe;EAChB,CAAA,EAEZ,UACC,oBAAC,cAAD;EACE,SAAS;EACT,OAAO,OAAO;EACd,QAAQ,OAAO;EACP;EACE;EACV,MAAM;EACO;EACP;EACC;EACG;EACV,iBAAiB;EACjB,eAAe,MAAM;AACnB,aAAU,EAAE;AACZ,aAAU,MAAM;;EAElB,CAAA,CAEH,EAAA,CAAA;EAGR;AAED,gBAAgB,cAAc"}
+{"version":3,"file":"EditableMessage.mjs","names":[],"sources":["../../../src/chat/EditableMessage/EditableMessage.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport MessageInput from '@/chat/MessageInput';\nimport MessageModal from '@/chat/MessageModal';\nimport Markdown from '@/Markdown';\n\nimport { type EditableMessageProps } from './type';\n\nconst EditableMessage = memo<EditableMessageProps>(\n  ({\n    value,\n    onChange,\n    classNames = {},\n    onEditingChange,\n    editing,\n    openModal,\n    onOpenChange,\n    placeholder,\n    showEditWhenEmpty = false,\n    styles: customStyles,\n    className,\n    style,\n    height,\n    variant,\n    editButtonSize,\n    text,\n    fullFeaturedCodeBlock,\n    model,\n    fontSize,\n    language = 'markdown',\n    markdownProps,\n  }) => {\n    const [isEdit, setTyping] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    const [expand, setExpand] = useControlledState<boolean>(false, {\n      onChange: onOpenChange,\n      value: openModal,\n    });\n\n    const isAutoSize = height === 'auto';\n\n    const input = (\n      <MessageInput\n        shortcut\n        className={cx(className, classNames?.input)}\n        classNames={classNames}\n        defaultValue={value}\n        editButtonSize={editButtonSize}\n        height={height}\n        language={language}\n        placeholder={placeholder}\n        styles={customStyles}\n        text={text}\n        variant={variant}\n        style={{\n          ...style,\n          ...customStyles?.input,\n        }}\n        onCancel={() => setTyping(false)}\n        onConfirm={(text) => {\n          onChange?.(text);\n          setTyping(false);\n        }}\n      />\n    );\n\n    if (!value && showEditWhenEmpty) return input;\n\n    return (\n      <>\n        {!expand && isEdit ? (\n          input\n        ) : (\n          <Markdown\n            className={cx(className, classNames?.markdown)}\n            fontSize={fontSize}\n            fullFeaturedCodeBlock={fullFeaturedCodeBlock}\n            variant={'chat'}\n            style={{\n              height: isAutoSize ? 'unset' : height,\n              ...style,\n              ...customStyles?.markdown,\n            }}\n            {...markdownProps}\n          >\n            {value || placeholder || ''}\n          </Markdown>\n        )}\n        {expand && (\n          <MessageModal\n            editing={isEdit}\n            extra={model?.extra}\n            footer={model?.footer}\n            height={height}\n            language={language}\n            open={expand}\n            placeholder={placeholder}\n            text={text}\n            value={value}\n            onChange={onChange}\n            onEditingChange={setTyping}\n            onOpenChange={(e) => {\n              setExpand(e);\n              setTyping(false);\n            }}\n          />\n        )}\n      </>\n    );\n  },\n);\n\nEditableMessage.displayName = 'EditableMessage';\n\nexport default EditableMessage;\n"],"mappings":";;;;;;;;;AAYA,MAAM,kBAAkB,MACrB,EACC,OACA,UACA,aAAa,EAAE,EACf,iBACA,SACA,WACA,cACA,aACA,oBAAoB,OACpB,QAAQ,cACR,WACA,OACA,QACA,SACA,gBACA,MACA,uBACA,OACA,UACA,WAAW,YACX,oBACI;CACJ,MAAM,CAAC,QAAQ,aAAa,mBAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,QAAQ,aAAa,mBAA4B,OAAO;EAC7D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,aAAa,WAAW;CAE9B,MAAM,QACJ,oBAAC,cAAD;EACE,UAAA;EACA,WAAW,GAAG,WAAW,YAAY,MAAM;EAC/B;EACZ,cAAc;EACE;EACR;EACE;EACG;EACb,QAAQ;EACF;EACG;EACT,OAAO;GACL,GAAG;GACH,GAAG,cAAc;GAClB;EACD,gBAAgB,UAAU,MAAM;EAChC,YAAY,SAAS;AACnB,cAAW,KAAK;AAChB,aAAU,MAAM;;EAElB,CAAA;AAGJ,KAAI,CAAC,SAAS,kBAAmB,QAAO;AAExC,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,CAAC,UAAU,SACV,QAEA,oBAAC,UAAD;EACE,WAAW,GAAG,WAAW,YAAY,SAAS;EACpC;EACa;EACvB,SAAS;EACT,OAAO;GACL,QAAQ,aAAa,UAAU;GAC/B,GAAG;GACH,GAAG,cAAc;GAClB;EACD,GAAI;YAEH,SAAS,eAAe;EAChB,CAAA,EAEZ,UACC,oBAAC,cAAD;EACE,SAAS;EACT,OAAO,OAAO;EACd,QAAQ,OAAO;EACP;EACE;EACV,MAAM;EACO;EACP;EACC;EACG;EACV,iBAAiB;EACjB,eAAe,MAAM;AACnB,aAAU,EAAE;AACZ,aAAU,MAAM;;EAElB,CAAA,CAEH,EAAA,CAAA;EAGR;AAED,gBAAgB,cAAc"}

package/es/chat/MessageModal/MessageModal.mjs

@@ -11,16 +11,16 @@ import messageModal_default from "../../i18n/resources/en/messageModal.mjs";
 import { memo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useResponsive } from "antd-style";
-import useMergeState from "use-merge-value";
+import useControlledState from "use-merge-value";
 //#region src/chat/MessageModal/MessageModal.tsx
 const MessageModal = memo(({ panelRef, editing, open, height = "75vh", onOpenChange, onEditingChange, placeholder, value, language = "markdown", onChange, text, footer, extra }) => {
 	const { mobile } = useResponsive();
 	const { t } = useTranslation(messageModal_default);
-	const [isEdit, setTyping] = useMergeState(false, {
+	const [isEdit, setTyping] = useControlledState(false, {
 		onChange: onEditingChange,
 		value: editing
 	});
-	const [showModal, setShowModal] = useMergeState(false, {
+	const [showModal, setShowModal] = useControlledState(false, {
 		onChange: onOpenChange,
 		value: open
 	});

package/es/chat/MessageModal/MessageModal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MessageModal.mjs","names":["messageModalMessages","useControlledState","Flexbox","textStyles"],"sources":["../../../src/chat/MessageModal/MessageModal.tsx"],"sourcesContent":["'use client';\n\nimport { useResponsive } from 'antd-style';\nimport { memo, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport Button from '@/Button';\nimport { styles as textStyles } from '@/chat/MessageInput/style';\nimport CodeEditor from '@/CodeEditor';\nimport { Flexbox } from '@/Flex';\nimport messageModalMessages from '@/i18n/resources/en/messageModal';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport TextArea from '@/Input/TextArea';\nimport Markdown from '@/Markdown';\nimport Modal from '@/Modal';\n\nimport { type MessageModalProps } from './type';\n\nconst MessageModal = memo<MessageModalProps>(\n  ({\n    panelRef,\n    editing,\n    open,\n    height = '75vh',\n    onOpenChange,\n    onEditingChange,\n    placeholder,\n    value,\n    language = 'markdown',\n    onChange,\n    text,\n    footer,\n    extra,\n  }) => {\n    const { mobile } = useResponsive();\n    const { t } = useTranslation(messageModalMessages);\n    const [isEdit, setTyping] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    const [showModal, setShowModal] = useControlledState(false, {\n      onChange: onOpenChange,\n      value: open,\n    });\n\n    const [temporaryValue, setMessage] = useState(value);\n\n    const confirmText = text?.confirm ?? t('messageModal.confirm');\n    const cancelText = text?.cancel ?? t('messageModal.cancel');\n    const editText = text?.edit ?? t('messageModal.edit');\n\n    const modalFooter = isEdit ? (\n      <Flexbox direction={'horizontal-reverse'} gap={8}>\n        <Button\n          type=\"primary\"\n          onClick={() => {\n            setTyping(false);\n            onChange?.(temporaryValue);\n            setMessage(value);\n          }}\n        >\n          {confirmText}\n        </Button>\n        <Button\n          onClick={() => {\n            setTyping(false);\n            setMessage(value);\n          }}\n        >\n          {cancelText}\n        </Button>\n      </Flexbox>\n    ) : (\n      footer\n    );\n\n    return (\n      <Modal\n        allowFullscreen\n        destroyOnHidden\n        cancelText={cancelText}\n        footer={modalFooter}\n        height={height}\n        okText={editText}\n        open={showModal}\n        panelRef={panelRef}\n        title={text?.title}\n        onOk={() => setTyping(true)}\n        onCancel={() => {\n          setShowModal(false);\n          setTyping(false);\n          setMessage(value);\n        }}\n      >\n        {isEdit ? (\n          mobile ? (\n            <TextArea\n              autoSize\n              className={textStyles}\n              defaultValue={temporaryValue}\n              placeholder={placeholder}\n              value={temporaryValue}\n              variant={'borderless'}\n              onBlur={(e) => setMessage(e.target.value)}\n              onChange={(value) => setMessage(value.target.value)}\n            />\n          ) : (\n            <CodeEditor\n              className={textStyles}\n              defaultValue={temporaryValue}\n              language={language}\n              placeholder={placeholder}\n              value={temporaryValue}\n              variant={'borderless'}\n              onBlur={(e) => setMessage(e.target.value)}\n              onValueChange={(value) => setMessage(value)}\n            />\n          )\n        ) : (\n          <>\n            {extra}\n            <Markdown variant={'chat'}>{String(value || placeholder)}</Markdown>\n          </>\n        )}\n      </Modal>\n    );\n  },\n);\n\nMessageModal.displayName = 'MessageModal';\n\nexport default MessageModal;\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAM,eAAe,MAClB,EACC,UACA,SACA,MACA,SAAS,QACT,cACA,iBACA,aACA,OACA,WAAW,YACX,UACA,MACA,QACA,YACI;CACJ,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,eAAeA,qBAAqB;CAClD,MAAM,CAAC,QAAQ,aAAaC,cAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,WAAW,gBAAgBA,cAAmB,OAAO;EAC1D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,gBAAgB,cAAc,SAAS,MAAM;CAEpD,MAAM,cAAc,MAAM,WAAW,EAAE,uBAAuB;CAC9D,MAAM,aAAa,MAAM,UAAU,EAAE,sBAAsB;CAC3D,MAAM,WAAW,MAAM,QAAQ,EAAE,oBAAoB;AA2BrD,QACE,oBAAC,OAAD;EACE,iBAAA;EACA,iBAAA;EACY;EACZ,QA9BgB,SAClB,qBAACC,mBAAD;GAAS,WAAW;GAAsB,KAAK;aAA/C,CACE,oBAAC,QAAD;IACE,MAAK;IACL,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,eAAe;AAC1B,gBAAW,MAAM;;cAGlB;IACM,CAAA,EACT,oBAAC,QAAD;IACE,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,MAAM;;cAGlB;IACM,CAAA,CACD;OAEV;EASU;EACR,QAAQ;EACR,MAAM;EACI;EACV,OAAO,MAAM;EACb,YAAY,UAAU,KAAK;EAC3B,gBAAgB;AACd,gBAAa,MAAM;AACnB,aAAU,MAAM;AAChB,cAAW,MAAM;;YAGlB,SACC,SACE,oBAAC,UAAD;GACE,UAAA;GACA,WAAWC;GACX,cAAc;GACD;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,WAAW,UAAU,WAAW,MAAM,OAAO,MAAM;GACnD,CAAA,GAEF,oBAAC,YAAD;GACE,WAAWA;GACX,cAAc;GACJ;GACG;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,gBAAgB,UAAU,WAAW,MAAM;GAC3C,CAAA,GAGJ,qBAAA,YAAA,EAAA,UAAA,CACG,OACD,oBAAC,UAAD;GAAU,SAAS;aAAS,OAAO,SAAS,YAAY;GAAY,CAAA,CACnE,EAAA,CAAA;EAEC,CAAA;EAGb;AAED,aAAa,cAAc"}
+{"version":3,"file":"MessageModal.mjs","names":["messageModalMessages","Flexbox","textStyles"],"sources":["../../../src/chat/MessageModal/MessageModal.tsx"],"sourcesContent":["'use client';\n\nimport { useResponsive } from 'antd-style';\nimport { memo, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport Button from '@/Button';\nimport { styles as textStyles } from '@/chat/MessageInput/style';\nimport CodeEditor from '@/CodeEditor';\nimport { Flexbox } from '@/Flex';\nimport messageModalMessages from '@/i18n/resources/en/messageModal';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport TextArea from '@/Input/TextArea';\nimport Markdown from '@/Markdown';\nimport Modal from '@/Modal';\n\nimport { type MessageModalProps } from './type';\n\nconst MessageModal = memo<MessageModalProps>(\n  ({\n    panelRef,\n    editing,\n    open,\n    height = '75vh',\n    onOpenChange,\n    onEditingChange,\n    placeholder,\n    value,\n    language = 'markdown',\n    onChange,\n    text,\n    footer,\n    extra,\n  }) => {\n    const { mobile } = useResponsive();\n    const { t } = useTranslation(messageModalMessages);\n    const [isEdit, setTyping] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    const [showModal, setShowModal] = useControlledState(false, {\n      onChange: onOpenChange,\n      value: open,\n    });\n\n    const [temporaryValue, setMessage] = useState(value);\n\n    const confirmText = text?.confirm ?? t('messageModal.confirm');\n    const cancelText = text?.cancel ?? t('messageModal.cancel');\n    const editText = text?.edit ?? t('messageModal.edit');\n\n    const modalFooter = isEdit ? (\n      <Flexbox direction={'horizontal-reverse'} gap={8}>\n        <Button\n          type=\"primary\"\n          onClick={() => {\n            setTyping(false);\n            onChange?.(temporaryValue);\n            setMessage(value);\n          }}\n        >\n          {confirmText}\n        </Button>\n        <Button\n          onClick={() => {\n            setTyping(false);\n            setMessage(value);\n          }}\n        >\n          {cancelText}\n        </Button>\n      </Flexbox>\n    ) : (\n      footer\n    );\n\n    return (\n      <Modal\n        allowFullscreen\n        destroyOnHidden\n        cancelText={cancelText}\n        footer={modalFooter}\n        height={height}\n        okText={editText}\n        open={showModal}\n        panelRef={panelRef}\n        title={text?.title}\n        onOk={() => setTyping(true)}\n        onCancel={() => {\n          setShowModal(false);\n          setTyping(false);\n          setMessage(value);\n        }}\n      >\n        {isEdit ? (\n          mobile ? (\n            <TextArea\n              autoSize\n              className={textStyles}\n              defaultValue={temporaryValue}\n              placeholder={placeholder}\n              value={temporaryValue}\n              variant={'borderless'}\n              onBlur={(e) => setMessage(e.target.value)}\n              onChange={(value) => setMessage(value.target.value)}\n            />\n          ) : (\n            <CodeEditor\n              className={textStyles}\n              defaultValue={temporaryValue}\n              language={language}\n              placeholder={placeholder}\n              value={temporaryValue}\n              variant={'borderless'}\n              onBlur={(e) => setMessage(e.target.value)}\n              onValueChange={(value) => setMessage(value)}\n            />\n          )\n        ) : (\n          <>\n            {extra}\n            <Markdown variant={'chat'}>{String(value || placeholder)}</Markdown>\n          </>\n        )}\n      </Modal>\n    );\n  },\n);\n\nMessageModal.displayName = 'MessageModal';\n\nexport default MessageModal;\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAM,eAAe,MAClB,EACC,UACA,SACA,MACA,SAAS,QACT,cACA,iBACA,aACA,OACA,WAAW,YACX,UACA,MACA,QACA,YACI;CACJ,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,eAAeA,qBAAqB;CAClD,MAAM,CAAC,QAAQ,aAAa,mBAAmB,OAAO;EACpD,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,WAAW,gBAAgB,mBAAmB,OAAO;EAC1D,UAAU;EACV,OAAO;EACR,CAAC;CAEF,MAAM,CAAC,gBAAgB,cAAc,SAAS,MAAM;CAEpD,MAAM,cAAc,MAAM,WAAW,EAAE,uBAAuB;CAC9D,MAAM,aAAa,MAAM,UAAU,EAAE,sBAAsB;CAC3D,MAAM,WAAW,MAAM,QAAQ,EAAE,oBAAoB;AA2BrD,QACE,oBAAC,OAAD;EACE,iBAAA;EACA,iBAAA;EACY;EACZ,QA9BgB,SAClB,qBAACC,mBAAD;GAAS,WAAW;GAAsB,KAAK;aAA/C,CACE,oBAAC,QAAD;IACE,MAAK;IACL,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,eAAe;AAC1B,gBAAW,MAAM;;cAGlB;IACM,CAAA,EACT,oBAAC,QAAD;IACE,eAAe;AACb,eAAU,MAAM;AAChB,gBAAW,MAAM;;cAGlB;IACM,CAAA,CACD;OAEV;EASU;EACR,QAAQ;EACR,MAAM;EACI;EACV,OAAO,MAAM;EACb,YAAY,UAAU,KAAK;EAC3B,gBAAgB;AACd,gBAAa,MAAM;AACnB,aAAU,MAAM;AAChB,cAAW,MAAM;;YAGlB,SACC,SACE,oBAAC,UAAD;GACE,UAAA;GACA,WAAWC;GACX,cAAc;GACD;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,WAAW,UAAU,WAAW,MAAM,OAAO,MAAM;GACnD,CAAA,GAEF,oBAAC,YAAD;GACE,WAAWA;GACX,cAAc;GACJ;GACG;GACb,OAAO;GACP,SAAS;GACT,SAAS,MAAM,WAAW,EAAE,OAAO,MAAM;GACzC,gBAAgB,UAAU,WAAW,MAAM;GAC3C,CAAA,GAGJ,qBAAA,YAAA,EAAA,UAAA,CACG,OACD,oBAAC,UAAD;GAAU,SAAS;aAAS,OAAO,SAAS,YAAY;GAAY,CAAA,CACnE,EAAA,CAAA;EAEC,CAAA;EAGb;AAED,aAAa,cAAc"}

package/es/mobile/TabBar/TabBar.mjs

@@ -5,10 +5,10 @@ import { styles } from "./style.mjs";
 import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cx } from "antd-style";
-import useMergeState from "use-merge-value";
+import useControlledState from "use-merge-value";
 //#region src/mobile/TabBar/TabBar.tsx
 const TabBar = memo(({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {
-	const [currentActive, setCurrentActive] = useMergeState(defaultActiveKey || items[0].key, {
+	const [currentActive, setCurrentActive] = useControlledState(defaultActiveKey || items[0].key, {
 		defaultValue: defaultActiveKey,
 		onChange,
 		value: activeKey

package/es/mobile/TabBar/TabBar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabBar.mjs","names":["Flexbox"],"sources":["../../../src/mobile/TabBar/TabBar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport SafeArea from '@/mobile/SafeArea';\n\nimport { styles } from './style';\nimport type { TabBarProps } from './type';\n\nconst TabBar = memo<TabBarProps>(\n  ({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {\n    const [currentActive, setCurrentActive] = useMergeState<string>(\n      defaultActiveKey || items[0].key,\n      {\n        defaultValue: defaultActiveKey,\n        onChange,\n        value: activeKey,\n      },\n    );\n\n    return (\n      <Flexbox as={'footer'} className={cx(styles.container, className)} ref={ref} {...rest}>\n        <Flexbox\n          horizontal\n          align={'center'}\n          className={cx(styles.inner, className)}\n          justify={'space-around'}\n        >\n          {items.map((item) => {\n            const active = item.key === currentActive;\n            return (\n              <Flexbox\n                align={'center'}\n                className={cx(styles.tab, active && styles.active)}\n                gap={4}\n                justify={'center'}\n                key={item.key}\n                onClick={() => {\n                  setCurrentActive(item.key);\n                  item?.onClick?.();\n                }}\n              >\n                <Flexbox align={'center'} className={styles.icon} justify={'center'}>\n                  {typeof item.icon === 'function' ? item.icon(active) : item.icon}\n                </Flexbox>\n                <div className={styles.title}>\n                  {typeof item.title === 'function' ? item.title(active) : item.title}\n                </div>\n              </Flexbox>\n            );\n          })}\n        </Flexbox>\n        {safeArea && <SafeArea position={'bottom'} />}\n      </Flexbox>\n    );\n  },\n);\n\nTabBar.displayName = 'MobileTabBar';\n\nexport default TabBar;\n"],"mappings":";;;;;;;;;AAYA,MAAM,SAAS,MACZ,EAAE,KAAK,WAAW,UAAU,OAAO,WAAW,kBAAkB,UAAU,GAAG,WAAW;CACvF,MAAM,CAAC,eAAe,oBAAoB,cACxC,oBAAoB,MAAM,GAAG,KAC7B;EACE,cAAc;EACd;EACA,OAAO;EACR,CACF;AAED,QACE,qBAACA,mBAAD;EAAS,IAAI;EAAU,WAAW,GAAG,OAAO,WAAW,UAAU;EAAO;EAAK,GAAI;YAAjF,CACE,oBAACA,mBAAD;GACE,YAAA;GACA,OAAO;GACP,WAAW,GAAG,OAAO,OAAO,UAAU;GACtC,SAAS;aAER,MAAM,KAAK,SAAS;IACnB,MAAM,SAAS,KAAK,QAAQ;AAC5B,WACE,qBAACA,mBAAD;KACE,OAAO;KACP,WAAW,GAAG,OAAO,KAAK,UAAU,OAAO,OAAO;KAClD,KAAK;KACL,SAAS;KAET,eAAe;AACb,uBAAiB,KAAK,IAAI;AAC1B,YAAM,WAAW;;eARrB,CAWE,oBAACA,mBAAD;MAAS,OAAO;MAAU,WAAW,OAAO;MAAM,SAAS;gBACxD,OAAO,KAAK,SAAS,aAAa,KAAK,KAAK,OAAO,GAAG,KAAK;MACpD,CAAA,EACV,oBAAC,OAAD;MAAK,WAAW,OAAO;gBACpB,OAAO,KAAK,UAAU,aAAa,KAAK,MAAM,OAAO,GAAG,KAAK;MAC1D,CAAA,CACE;OAZH,KAAK,IAYF;KAEZ;GACM,CAAA,EACT,YAAY,oBAAC,UAAD,EAAU,UAAU,UAAY,CAAA,CACrC;;EAGf;AAED,OAAO,cAAc"}
+{"version":3,"file":"TabBar.mjs","names":["useMergeState","Flexbox"],"sources":["../../../src/mobile/TabBar/TabBar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport SafeArea from '@/mobile/SafeArea';\n\nimport { styles } from './style';\nimport type { TabBarProps } from './type';\n\nconst TabBar = memo<TabBarProps>(\n  ({ ref, className, safeArea, items, activeKey, defaultActiveKey, onChange, ...rest }) => {\n    const [currentActive, setCurrentActive] = useMergeState<string>(\n      defaultActiveKey || items[0].key,\n      {\n        defaultValue: defaultActiveKey,\n        onChange,\n        value: activeKey,\n      },\n    );\n\n    return (\n      <Flexbox as={'footer'} className={cx(styles.container, className)} ref={ref} {...rest}>\n        <Flexbox\n          horizontal\n          align={'center'}\n          className={cx(styles.inner, className)}\n          justify={'space-around'}\n        >\n          {items.map((item) => {\n            const active = item.key === currentActive;\n            return (\n              <Flexbox\n                align={'center'}\n                className={cx(styles.tab, active && styles.active)}\n                gap={4}\n                justify={'center'}\n                key={item.key}\n                onClick={() => {\n                  setCurrentActive(item.key);\n                  item?.onClick?.();\n                }}\n              >\n                <Flexbox align={'center'} className={styles.icon} justify={'center'}>\n                  {typeof item.icon === 'function' ? item.icon(active) : item.icon}\n                </Flexbox>\n                <div className={styles.title}>\n                  {typeof item.title === 'function' ? item.title(active) : item.title}\n                </div>\n              </Flexbox>\n            );\n          })}\n        </Flexbox>\n        {safeArea && <SafeArea position={'bottom'} />}\n      </Flexbox>\n    );\n  },\n);\n\nTabBar.displayName = 'MobileTabBar';\n\nexport default TabBar;\n"],"mappings":";;;;;;;;;AAYA,MAAM,SAAS,MACZ,EAAE,KAAK,WAAW,UAAU,OAAO,WAAW,kBAAkB,UAAU,GAAG,WAAW;CACvF,MAAM,CAAC,eAAe,oBAAoBA,mBACxC,oBAAoB,MAAM,GAAG,KAC7B;EACE,cAAc;EACd;EACA,OAAO;EACR,CACF;AAED,QACE,qBAACC,mBAAD;EAAS,IAAI;EAAU,WAAW,GAAG,OAAO,WAAW,UAAU;EAAO;EAAK,GAAI;YAAjF,CACE,oBAACA,mBAAD;GACE,YAAA;GACA,OAAO;GACP,WAAW,GAAG,OAAO,OAAO,UAAU;GACtC,SAAS;aAER,MAAM,KAAK,SAAS;IACnB,MAAM,SAAS,KAAK,QAAQ;AAC5B,WACE,qBAACA,mBAAD;KACE,OAAO;KACP,WAAW,GAAG,OAAO,KAAK,UAAU,OAAO,OAAO;KAClD,KAAK;KACL,SAAS;KAET,eAAe;AACb,uBAAiB,KAAK,IAAI;AAC1B,YAAM,WAAW;;eARrB,CAWE,oBAACA,mBAAD;MAAS,OAAO;MAAU,WAAW,OAAO;MAAM,SAAS;gBACxD,OAAO,KAAK,SAAS,aAAa,KAAK,KAAK,OAAO,GAAG,KAAK;MACpD,CAAA,EACV,oBAAC,OAAD;MAAK,WAAW,OAAO;gBACpB,OAAO,KAAK,UAAU,aAAa,KAAK,MAAM,OAAO,GAAG,KAAK;MAC1D,CAAA,CACE;OAZH,KAAK,IAYF;KAEZ;GACM,CAAA,EACT,YAAY,oBAAC,UAAD,EAAU,UAAU,UAAY,CAAA,CACrC;;EAGf;AAED,OAAO,cAAc"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "5.9.2",
+  "version": "5.9.3",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",