@lobehub/ui 5.14.1 → 5.15.0

package/es/Toc/TocMobile.mjs

@@ -5,11 +5,11 @@ import { mapItems } from "./utils.mjs";
 import { memo, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Anchor, Collapse, ConfigProvider } from "antd";
-import useMergeState from "use-merge-value";
+import useControlledState from "use-merge-value";
 import { PanelTopClose, PanelTopOpen } from "lucide-react";
 //#region src/Toc/TocMobile.tsx
 const TocMobile = memo(({ items, activeKey, onChange, getContainer, headerHeight = 64, tocWidth = 176 }) => {
-	const [activeLink, setActiveLink] = useMergeState("", {
+	const [activeLink, setActiveLink] = useControlledState("", {
 		onChange,
 		value: activeKey
 	});

package/es/Toc/TocMobile.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TocMobile.mjs","names":["useControlledState"],"sources":["../../src/Toc/TocMobile.tsx"],"sourcesContent":["'use client';\n\nimport { Anchor, Collapse, ConfigProvider } from 'antd';\nimport { PanelTopClose, PanelTopOpen } from 'lucide-react';\nimport { memo, useMemo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\n\nimport { styles } from './style';\nimport type { TocMobileProps } from './type';\nimport { mapItems } from './utils';\n\nconst TocMobile = memo<TocMobileProps>(\n  ({ items, activeKey, onChange, getContainer, headerHeight = 64, tocWidth = 176 }) => {\n    // tocWidth is part of the interface but not used in this component\n    void tocWidth;\n    const [activeLink, setActiveLink] = useControlledState<string>('', {\n      onChange,\n      value: activeKey,\n    });\n\n    const activeAnchor = items.find((item) => item.id === activeLink);\n\n    const tocItems = useMemo(() => mapItems(items), [items]);\n\n    return (\n      <ConfigProvider theme={{ token: { fontSize: 12, sizeStep: 3 } }}>\n        <section className={styles.mobileCtn}>\n          <Collapse\n            ghost\n            className={styles.expand}\n            expandIconPlacement={'end'}\n            expandIcon={({ isActive }) => (\n              <ActionIcon icon={isActive ? PanelTopClose : PanelTopOpen} size={'small'} />\n            )}\n          >\n            <Collapse.Panel\n              forceRender\n              header={activeAnchor ? activeAnchor.title : 'TOC'}\n              key={'toc'}\n            >\n              <ConfigProvider theme={{ token: { fontSize: 14, sizeStep: 4 } }}>\n                <Anchor\n                  getContainer={getContainer}\n                  items={tocItems}\n                  targetOffset={headerHeight + 48}\n                  onChange={(currentLink) => {\n                    setActiveLink(currentLink.replace('#', ''));\n                  }}\n                />\n              </ConfigProvider>\n            </Collapse.Panel>\n          </Collapse>\n        </section>\n      </ConfigProvider>\n    );\n  },\n);\n\nTocMobile.displayName = 'TocMobile';\n\nexport default TocMobile;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY,MACf,EAAE,OAAO,WAAW,UAAU,cAAc,eAAe,IAAI,WAAW,UAAU;CAGnF,MAAM,CAAC,YAAY,iBAAiBA,cAA2B,IAAI;EACjE;EACA,OAAO;EACR,CAAC;CAEF,MAAM,eAAe,MAAM,MAAM,SAAS,KAAK,OAAO,WAAW;CAEjE,MAAM,WAAW,cAAc,SAAS,MAAM,EAAE,CAAC,MAAM,CAAC;AAExD,QACE,oBAAC,gBAAD;EAAgB,OAAO,EAAE,OAAO;GAAE,UAAU;GAAI,UAAU;GAAG,EAAE;YAC7D,oBAAC,WAAD;GAAS,WAAW,OAAO;aACzB,oBAAC,UAAD;IACE,OAAA;IACA,WAAW,OAAO;IAClB,qBAAqB;IACrB,aAAa,EAAE,eACb,oBAAC,YAAD;KAAY,MAAM,WAAW,gBAAgB;KAAc,MAAM;KAAW,CAAA;cAG9E,oBAAC,SAAS,OAAV;KACE,aAAA;KACA,QAAQ,eAAe,aAAa,QAAQ;eAG5C,oBAAC,gBAAD;MAAgB,OAAO,EAAE,OAAO;OAAE,UAAU;OAAI,UAAU;OAAG,EAAE;gBAC7D,oBAAC,QAAD;OACgB;OACd,OAAO;OACP,cAAc,eAAe;OAC7B,WAAW,gBAAgB;AACzB,sBAAc,YAAY,QAAQ,KAAK,GAAG,CAAC;;OAE7C,CAAA;MACa,CAAA;KACF,EAZV,MAYU;IACR,CAAA;GACH,CAAA;EACK,CAAA;EAGtB;AAED,UAAU,cAAc"}
+{"version":3,"file":"TocMobile.mjs","names":[],"sources":["../../src/Toc/TocMobile.tsx"],"sourcesContent":["'use client';\n\nimport { Anchor, Collapse, ConfigProvider } from 'antd';\nimport { PanelTopClose, PanelTopOpen } from 'lucide-react';\nimport { memo, useMemo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\n\nimport { styles } from './style';\nimport type { TocMobileProps } from './type';\nimport { mapItems } from './utils';\n\nconst TocMobile = memo<TocMobileProps>(\n  ({ items, activeKey, onChange, getContainer, headerHeight = 64, tocWidth = 176 }) => {\n    // tocWidth is part of the interface but not used in this component\n    void tocWidth;\n    const [activeLink, setActiveLink] = useControlledState<string>('', {\n      onChange,\n      value: activeKey,\n    });\n\n    const activeAnchor = items.find((item) => item.id === activeLink);\n\n    const tocItems = useMemo(() => mapItems(items), [items]);\n\n    return (\n      <ConfigProvider theme={{ token: { fontSize: 12, sizeStep: 3 } }}>\n        <section className={styles.mobileCtn}>\n          <Collapse\n            ghost\n            className={styles.expand}\n            expandIconPlacement={'end'}\n            expandIcon={({ isActive }) => (\n              <ActionIcon icon={isActive ? PanelTopClose : PanelTopOpen} size={'small'} />\n            )}\n          >\n            <Collapse.Panel\n              forceRender\n              header={activeAnchor ? activeAnchor.title : 'TOC'}\n              key={'toc'}\n            >\n              <ConfigProvider theme={{ token: { fontSize: 14, sizeStep: 4 } }}>\n                <Anchor\n                  getContainer={getContainer}\n                  items={tocItems}\n                  targetOffset={headerHeight + 48}\n                  onChange={(currentLink) => {\n                    setActiveLink(currentLink.replace('#', ''));\n                  }}\n                />\n              </ConfigProvider>\n            </Collapse.Panel>\n          </Collapse>\n        </section>\n      </ConfigProvider>\n    );\n  },\n);\n\nTocMobile.displayName = 'TocMobile';\n\nexport default TocMobile;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY,MACf,EAAE,OAAO,WAAW,UAAU,cAAc,eAAe,IAAI,WAAW,UAAU;CAGnF,MAAM,CAAC,YAAY,iBAAiB,mBAA2B,IAAI;EACjE;EACA,OAAO;EACR,CAAC;CAEF,MAAM,eAAe,MAAM,MAAM,SAAS,KAAK,OAAO,WAAW;CAEjE,MAAM,WAAW,cAAc,SAAS,MAAM,EAAE,CAAC,MAAM,CAAC;AAExD,QACE,oBAAC,gBAAD;EAAgB,OAAO,EAAE,OAAO;GAAE,UAAU;GAAI,UAAU;GAAG,EAAE;YAC7D,oBAAC,WAAD;GAAS,WAAW,OAAO;aACzB,oBAAC,UAAD;IACE,OAAA;IACA,WAAW,OAAO;IAClB,qBAAqB;IACrB,aAAa,EAAE,eACb,oBAAC,YAAD;KAAY,MAAM,WAAW,gBAAgB;KAAc,MAAM;KAAW,CAAA;cAG9E,oBAAC,SAAS,OAAV;KACE,aAAA;KACA,QAAQ,eAAe,aAAa,QAAQ;eAG5C,oBAAC,gBAAD;MAAgB,OAAO,EAAE,OAAO;OAAE,UAAU;OAAI,UAAU;OAAG,EAAE;gBAC7D,oBAAC,QAAD;OACgB;OACd,OAAO;OACP,cAAc,eAAe;OAC7B,WAAW,gBAAgB;AACzB,sBAAc,YAAY,QAAQ,KAAK,GAAG,CAAC;;OAE7C,CAAA;MACa,CAAA;KACF,EAZV,MAYU;IACR,CAAA;GACH,CAAA;EACK,CAAA;EAGtB;AAED,UAAU,cAAc"}

package/es/base-ui/Modal/imperative.mjs

@@ -41,7 +41,7 @@ const ConfirmBody = ({ config }) => {
 		close();
 	}, [close, onOk]);
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [content && /* @__PURE__ */ jsx("div", {
-		style: { padding: "16px 24px" },
+		style: { padding: "12px 16px" },
 		children: content
 	}), /* @__PURE__ */ jsxs(ModalFooter, { children: [/* @__PURE__ */ jsx("button", {
 		className: cx(styles.buttonBase, styles.cancelButton),

package/es/base-ui/Modal/imperative.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"imperative.mjs","names":[],"sources":["../../../src/base-ui/Modal/imperative.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useTheme } from 'antd-style';\nimport type { ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useState, useSyncExternalStore } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useAppElement } from '@/ThemeProvider';\nimport { registerDevSingleton } from '@/utils/devSingleton';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport {\n  ModalBackdrop,\n  ModalClose,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalPopup,\n  ModalPortal,\n  ModalRoot,\n  ModalTitle,\n} from './atoms';\nimport { ModalContext, useModalContext } from './context';\nimport { styles } from './style';\nimport type { ImperativeModalProps, ModalConfirmConfig, ModalInstance } from './type';\n\n// --- Shared types ---\n\ntype ModalStackEntry = {\n  id: string;\n  props: ImperativeModalProps;\n};\n\n// --- Shared components (stack-independent) ---\n\nconst ModalPortalWrapper = ({\n  children,\n  root,\n}: {\n  children: ReactNode;\n  root?: HTMLElement | ShadowRoot | null;\n}) => {\n  const appElement = useAppElement();\n  const container = root ?? appElement ?? document.body;\n  return createPortal(children, container);\n};\n\nconst ConfirmBody = ({ config }: { config: ModalConfirmConfig }) => {\n  const { close } = useModalContext();\n  const theme = useTheme();\n  const [loading, setLoading] = useState(false);\n\n  const { cancelText = 'Cancel', content, okButtonProps, okText = 'OK', onCancel, onOk } = config;\n\n  const { danger, className: okUserCls, style: okUserStyle, ...restOkProps } = okButtonProps ?? {};\n  const okBgColor = danger ? theme.colorError : theme.colorPrimary;\n  const okTextColor = safeReadableColor(okBgColor);\n\n  const handleCancel = useCallback(() => {\n    close();\n    onCancel?.();\n  }, [close, onCancel]);\n\n  const handleOk = useCallback(async () => {\n    if (onOk) {\n      try {\n        const result = onOk();\n        if (result && typeof (result as any).then === 'function') {\n          setLoading(true);\n          await result;\n          setLoading(false);\n        }\n      } catch {\n        setLoading(false);\n        return;\n      }\n    }\n    close();\n  }, [close, onOk]);\n\n  return (\n    <>\n      {content && <div style={{ padding: '16px 24px' }}>{content}</div>}\n      <ModalFooter>\n        <button\n          className={cx(styles.buttonBase, styles.cancelButton)}\n          type=\"button\"\n          onClick={handleCancel}\n        >\n          {cancelText}\n        </button>\n        <button\n          {...restOkProps}\n          disabled={loading}\n          style={{ color: okTextColor, ...okUserStyle }}\n          type=\"button\"\n          className={cx(\n            styles.buttonBase,\n            danger ? styles.dangerOkButton : styles.okButton,\n            okUserCls,\n          )}\n          onClick={handleOk}\n        >\n          {loading && <span className={styles.loadingSpinner} />}\n          {okText}\n        </button>\n      </ModalFooter>\n    </>\n  );\n};\nConfirmBody.displayName = 'ConfirmBody';\n\n// --- Factory ---\n\nexport interface ModalHostProps {\n  root?: HTMLElement | ShadowRoot | null;\n}\n\nexport interface ModalSystem {\n  confirmModal: (config: ModalConfirmConfig) => { close: () => void; destroy: () => void };\n  createModal: (props: ImperativeModalProps) => ModalInstance;\n  ModalHost: React.FC<ModalHostProps>;\n}\n\nlet systemSeed = 0;\n\nexport function createModalSystem(): ModalSystem {\n  const systemId = systemSeed++;\n  const singletonName = systemId === 0 ? 'BaseModalHost' : `BaseModalHost-${systemId}`;\n\n  // --- Stack state (isolated per system) ---\n  let modalStack: ModalStackEntry[] = [];\n  let modalSeed = 0;\n  const listeners = new Set<() => void>();\n\n  const notify = () => listeners.forEach((l) => l());\n  const subscribe = (l: () => void) => {\n    listeners.add(l);\n    return () => listeners.delete(l);\n  };\n  const EMPTY: ModalStackEntry[] = [];\n  const getSnapshot = () => modalStack;\n  const getServerSnapshot = () => EMPTY;\n\n  // --- Stack operations ---\n\n  const updateModal = (id: string, next: Partial<ImperativeModalProps>) => {\n    let changed = false;\n    modalStack = modalStack.map((item) => {\n      if (item.id !== id) return item;\n      changed = true;\n      return { ...item, props: { ...item.props, ...next } };\n    });\n    if (changed) notify();\n  };\n\n  const closeModal = (id: string) => {\n    updateModal(id, { open: false });\n  };\n\n  const destroyModal = (id: string) => {\n    const next = modalStack.filter((item) => item.id !== id);\n    if (next.length === modalStack.length) return;\n    modalStack = next;\n    notify();\n  };\n\n  // --- Stack Item (captures operations via closure) ---\n\n  const StackItem = memo(({ entry }: { entry: ModalStackEntry }) => {\n    const { id, props } = entry;\n    const {\n      children,\n      classNames,\n      content,\n      footer,\n      maskClosable,\n      onOpenChange,\n      onOpenChangeComplete,\n      open,\n      styles: semanticStyles,\n      title,\n      width,\n    } = props;\n\n    const isOpen = open ?? true;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, eventDetails?: { reason: string }) => {\n        if (!nextOpen && maskClosable === false && eventDetails?.reason === 'outside-press') return;\n        if (!nextOpen) closeModal(id);\n        onOpenChange?.(nextOpen);\n      },\n      [id, maskClosable, onOpenChange],\n    );\n\n    const handleExitComplete = useCallback(() => {\n      onOpenChangeComplete?.(false);\n      destroyModal(id);\n    }, [id, onOpenChangeComplete]);\n\n    const close = useCallback(() => closeModal(id), [id]);\n    const setCanDismissByClickOutside = useCallback(\n      (value: boolean) => updateModal(id, { maskClosable: value }),\n      [id],\n    );\n\n    const showTitle = title !== undefined && title !== false && title !== null;\n\n    return (\n      <ModalContext value={{ close, setCanDismissByClickOutside }}>\n        <ModalRoot\n          open={isOpen}\n          onExitComplete={handleExitComplete}\n          onOpenChange={handleOpenChange}\n        >\n          <ModalPortal>\n            <ModalBackdrop className={classNames?.backdrop} style={semanticStyles?.backdrop} />\n            <ModalPopup\n              className={classNames?.popup}\n              popupStyle={semanticStyles?.popup}\n              width={width}\n            >\n              {showTitle && (\n                <ModalHeader className={classNames?.header} style={semanticStyles?.header}>\n                  <ModalTitle className={classNames?.title} style={semanticStyles?.title}>\n                    {title}\n                  </ModalTitle>\n                  <ModalClose className={classNames?.close} style={semanticStyles?.close} />\n                </ModalHeader>\n              )}\n              <ModalContent className={classNames?.content} style={semanticStyles?.content}>\n                {content ?? children}\n              </ModalContent>\n              {footer}\n            </ModalPopup>\n          </ModalPortal>\n        </ModalRoot>\n      </ModalContext>\n    );\n  });\n  StackItem.displayName = 'ModalStackItem';\n\n  const StackRenderer = memo(({ stack }: { stack: ModalStackEntry[] }) => {\n    const isClient = useIsClient();\n    if (!isClient) return null;\n    return stack.map((entry) => <StackItem entry={entry} key={entry.id} />);\n  });\n  StackRenderer.displayName = 'ModalStackRenderer';\n\n  // --- ModalHost ---\n\n  const Host = ({ root }: ModalHostProps) => {\n    const stack = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const isClient = useIsClient();\n\n    useEffect(() => {\n      if (!isClient) return;\n      const scope = root ?? document.body;\n      return registerDevSingleton(singletonName, scope);\n    }, [isClient, root]);\n\n    if (!isClient) return null;\n    if (stack.length === 0) return null;\n\n    return (\n      <ModalPortalWrapper root={root}>\n        <StackRenderer stack={stack} />\n      </ModalPortalWrapper>\n    );\n  };\n\n  // --- createModal ---\n\n  const create = (props: ImperativeModalProps): ModalInstance => {\n    const id = `base-modal-${Date.now()}-${modalSeed++}`;\n    modalStack = [...modalStack, { id, props: { ...props, open: props.open ?? true } }];\n    notify();\n\n    return {\n      close: () => closeModal(id),\n      destroy: () => destroyModal(id),\n      setCanDismissByClickOutside: (value) => updateModal(id, { maskClosable: value }),\n      update: (nextProps) => updateModal(id, nextProps),\n    };\n  };\n\n  // --- confirmModal ---\n\n  const confirm = (config: ModalConfirmConfig) => {\n    const instance = create({\n      content: <ConfirmBody config={config} />,\n      styles: { content: { padding: 0 } },\n      title: config.title,\n      width: 420,\n    });\n\n    return {\n      close: instance.close,\n      destroy: instance.destroy,\n    };\n  };\n\n  return { ModalHost: Host, confirmModal: confirm, createModal: create };\n}\n\n// --- Default global instance (backward compatible) ---\n\nconst defaultSystem = createModalSystem();\nexport const ModalHost = defaultSystem.ModalHost;\nexport const createModal = defaultSystem.createModal;\nexport const confirmModal = defaultSystem.confirmModal;\n"],"mappings":";;;;;;;;;;;;;AAoCA,MAAM,sBAAsB,EAC1B,UACA,WAII;CACJ,MAAM,aAAa,eAAe;AAElC,QAAO,aAAa,UADF,QAAQ,cAAc,SAAS,KACT;;AAG1C,MAAM,eAAe,EAAE,aAA6C;CAClE,MAAM,EAAE,UAAU,iBAAiB;CACnC,MAAM,QAAQ,UAAU;CACxB,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,EAAE,aAAa,UAAU,SAAS,eAAe,SAAS,MAAM,UAAU,SAAS;CAEzF,MAAM,EAAE,QAAQ,WAAW,WAAW,OAAO,aAAa,GAAG,gBAAgB,iBAAiB,EAAE;CAEhG,MAAM,cAAc,kBADF,SAAS,MAAM,aAAa,MAAM,aACJ;CAEhD,MAAM,eAAe,kBAAkB;AACrC,SAAO;AACP,cAAY;IACX,CAAC,OAAO,SAAS,CAAC;CAErB,MAAM,WAAW,YAAY,YAAY;AACvC,MAAI,KACF,KAAI;GACF,MAAM,SAAS,MAAM;AACrB,OAAI,UAAU,OAAQ,OAAe,SAAS,YAAY;AACxD,eAAW,KAAK;AAChB,UAAM;AACN,eAAW,MAAM;;UAEb;AACN,cAAW,MAAM;AACjB;;AAGJ,SAAO;IACN,CAAC,OAAO,KAAK,CAAC;AAEjB,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,WAAW,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,aAAa;YAAG;EAAc,CAAA,EACjE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,UAAD;EACE,WAAW,GAAG,OAAO,YAAY,OAAO,aAAa;EACrD,MAAK;EACL,SAAS;YAER;EACM,CAAA,EACT,qBAAC,UAAD;EACE,GAAI;EACJ,UAAU;EACV,OAAO;GAAE,OAAO;GAAa,GAAG;GAAa;EAC7C,MAAK;EACL,WAAW,GACT,OAAO,YACP,SAAS,OAAO,iBAAiB,OAAO,UACxC,UACD;EACD,SAAS;YAVX,CAYG,WAAW,oBAAC,QAAD,EAAM,WAAW,OAAO,gBAAkB,CAAA,EACrD,OACM;IACG,EAAA,CAAA,CACb,EAAA,CAAA;;AAGP,YAAY,cAAc;AAc1B,IAAI,aAAa;AAEjB,SAAgB,oBAAiC;CAC/C,MAAM,WAAW;CACjB,MAAM,gBAAgB,aAAa,IAAI,kBAAkB,iBAAiB;CAG1E,IAAI,aAAgC,EAAE;CACtC,IAAI,YAAY;CAChB,MAAM,4BAAY,IAAI,KAAiB;CAEvC,MAAM,eAAe,UAAU,SAAS,MAAM,GAAG,CAAC;CAClD,MAAM,aAAa,MAAkB;AACnC,YAAU,IAAI,EAAE;AAChB,eAAa,UAAU,OAAO,EAAE;;CAElC,MAAM,QAA2B,EAAE;CACnC,MAAM,oBAAoB;CAC1B,MAAM,0BAA0B;CAIhC,MAAM,eAAe,IAAY,SAAwC;EACvE,IAAI,UAAU;AACd,eAAa,WAAW,KAAK,SAAS;AACpC,OAAI,KAAK,OAAO,GAAI,QAAO;AAC3B,aAAU;AACV,UAAO;IAAE,GAAG;IAAM,OAAO;KAAE,GAAG,KAAK;KAAO,GAAG;KAAM;IAAE;IACrD;AACF,MAAI,QAAS,SAAQ;;CAGvB,MAAM,cAAc,OAAe;AACjC,cAAY,IAAI,EAAE,MAAM,OAAO,CAAC;;CAGlC,MAAM,gBAAgB,OAAe;EACnC,MAAM,OAAO,WAAW,QAAQ,SAAS,KAAK,OAAO,GAAG;AACxD,MAAI,KAAK,WAAW,WAAW,OAAQ;AACvC,eAAa;AACb,UAAQ;;CAKV,MAAM,YAAY,MAAM,EAAE,YAAwC;EAChE,MAAM,EAAE,IAAI,UAAU;EACtB,MAAM,EACJ,UACA,YACA,SACA,QACA,cACA,cACA,sBACA,MACA,QAAQ,gBACR,OACA,UACE;EAEJ,MAAM,SAAS,QAAQ;EAEvB,MAAM,mBAAmB,aACtB,UAAmB,iBAAsC;AACxD,OAAI,CAAC,YAAY,iBAAiB,SAAS,cAAc,WAAW,gBAAiB;AACrF,OAAI,CAAC,SAAU,YAAW,GAAG;AAC7B,kBAAe,SAAS;KAE1B;GAAC;GAAI;GAAc;GAAa,CACjC;EAED,MAAM,qBAAqB,kBAAkB;AAC3C,0BAAuB,MAAM;AAC7B,gBAAa,GAAG;KACf,CAAC,IAAI,qBAAqB,CAAC;EAE9B,MAAM,QAAQ,kBAAkB,WAAW,GAAG,EAAE,CAAC,GAAG,CAAC;EACrD,MAAM,8BAA8B,aACjC,UAAmB,YAAY,IAAI,EAAE,cAAc,OAAO,CAAC,EAC5D,CAAC,GAAG,CACL;EAED,MAAM,YAAY,UAAU,KAAA,KAAa,UAAU,SAAS,UAAU;AAEtE,SACE,oBAAC,cAAD;GAAc,OAAO;IAAE;IAAO;IAA6B;aACzD,oBAAC,WAAD;IACE,MAAM;IACN,gBAAgB;IAChB,cAAc;cAEd,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,eAAD;KAAe,WAAW,YAAY;KAAU,OAAO,gBAAgB;KAAY,CAAA,EACnF,qBAAC,YAAD;KACE,WAAW,YAAY;KACvB,YAAY,gBAAgB;KACrB;eAHT;MAKG,aACC,qBAAC,aAAD;OAAa,WAAW,YAAY;OAAQ,OAAO,gBAAgB;iBAAnE,CACE,oBAAC,YAAD;QAAY,WAAW,YAAY;QAAO,OAAO,gBAAgB;kBAC9D;QACU,CAAA,EACb,oBAAC,YAAD;QAAY,WAAW,YAAY;QAAO,OAAO,gBAAgB;QAAS,CAAA,CAC9D;;MAEhB,oBAAC,cAAD;OAAc,WAAW,YAAY;OAAS,OAAO,gBAAgB;iBAClE,WAAW;OACC,CAAA;MACd;MACU;OACD,EAAA,CAAA;IACJ,CAAA;GACC,CAAA;GAEjB;AACF,WAAU,cAAc;CAExB,MAAM,gBAAgB,MAAM,EAAE,YAA0C;AAEtE,MAAI,CADa,aACJ,CAAE,QAAO;AACtB,SAAO,MAAM,KAAK,UAAU,oBAAC,WAAD,EAAkB,OAAwB,EAAZ,MAAM,GAAM,CAAC;GACvE;AACF,eAAc,cAAc;CAI5B,MAAM,QAAQ,EAAE,WAA2B;EACzC,MAAM,QAAQ,qBAAqB,WAAW,aAAa,kBAAkB;EAC7E,MAAM,WAAW,aAAa;AAE9B,kBAAgB;AACd,OAAI,CAAC,SAAU;AAEf,UAAO,qBAAqB,eADd,QAAQ,SAAS,KACkB;KAChD,CAAC,UAAU,KAAK,CAAC;AAEpB,MAAI,CAAC,SAAU,QAAO;AACtB,MAAI,MAAM,WAAW,EAAG,QAAO;AAE/B,SACE,oBAAC,oBAAD;GAA0B;aACxB,oBAAC,eAAD,EAAsB,OAAS,CAAA;GACZ,CAAA;;CAMzB,MAAM,UAAU,UAA+C;EAC7D,MAAM,KAAK,cAAc,KAAK,KAAK,CAAC,GAAG;AACvC,eAAa,CAAC,GAAG,YAAY;GAAE;GAAI,OAAO;IAAE,GAAG;IAAO,MAAM,MAAM,QAAQ;IAAM;GAAE,CAAC;AACnF,UAAQ;AAER,SAAO;GACL,aAAa,WAAW,GAAG;GAC3B,eAAe,aAAa,GAAG;GAC/B,8BAA8B,UAAU,YAAY,IAAI,EAAE,cAAc,OAAO,CAAC;GAChF,SAAS,cAAc,YAAY,IAAI,UAAU;GAClD;;CAKH,MAAM,WAAW,WAA+B;EAC9C,MAAM,WAAW,OAAO;GACtB,SAAS,oBAAC,aAAD,EAAqB,QAAU,CAAA;GACxC,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE;GACnC,OAAO,OAAO;GACd,OAAO;GACR,CAAC;AAEF,SAAO;GACL,OAAO,SAAS;GAChB,SAAS,SAAS;GACnB;;AAGH,QAAO;EAAE,WAAW;EAAM,cAAc;EAAS,aAAa;EAAQ;;AAKxE,MAAM,gBAAgB,mBAAmB;AACzC,MAAa,YAAY,cAAc;AACvC,MAAa,cAAc,cAAc;AACzC,MAAa,eAAe,cAAc"}
+{"version":3,"file":"imperative.mjs","names":[],"sources":["../../../src/base-ui/Modal/imperative.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useTheme } from 'antd-style';\nimport type { ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useState, useSyncExternalStore } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useAppElement } from '@/ThemeProvider';\nimport { registerDevSingleton } from '@/utils/devSingleton';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport {\n  ModalBackdrop,\n  ModalClose,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalPopup,\n  ModalPortal,\n  ModalRoot,\n  ModalTitle,\n} from './atoms';\nimport { ModalContext, useModalContext } from './context';\nimport { styles } from './style';\nimport type { ImperativeModalProps, ModalConfirmConfig, ModalInstance } from './type';\n\n// --- Shared types ---\n\ntype ModalStackEntry = {\n  id: string;\n  props: ImperativeModalProps;\n};\n\n// --- Shared components (stack-independent) ---\n\nconst ModalPortalWrapper = ({\n  children,\n  root,\n}: {\n  children: ReactNode;\n  root?: HTMLElement | ShadowRoot | null;\n}) => {\n  const appElement = useAppElement();\n  const container = root ?? appElement ?? document.body;\n  return createPortal(children, container);\n};\n\nconst ConfirmBody = ({ config }: { config: ModalConfirmConfig }) => {\n  const { close } = useModalContext();\n  const theme = useTheme();\n  const [loading, setLoading] = useState(false);\n\n  const { cancelText = 'Cancel', content, okButtonProps, okText = 'OK', onCancel, onOk } = config;\n\n  const { danger, className: okUserCls, style: okUserStyle, ...restOkProps } = okButtonProps ?? {};\n  const okBgColor = danger ? theme.colorError : theme.colorPrimary;\n  const okTextColor = safeReadableColor(okBgColor);\n\n  const handleCancel = useCallback(() => {\n    close();\n    onCancel?.();\n  }, [close, onCancel]);\n\n  const handleOk = useCallback(async () => {\n    if (onOk) {\n      try {\n        const result = onOk();\n        if (result && typeof (result as any).then === 'function') {\n          setLoading(true);\n          await result;\n          setLoading(false);\n        }\n      } catch {\n        setLoading(false);\n        return;\n      }\n    }\n    close();\n  }, [close, onOk]);\n\n  return (\n    <>\n      {content && <div style={{ padding: '12px 16px' }}>{content}</div>}\n      <ModalFooter>\n        <button\n          className={cx(styles.buttonBase, styles.cancelButton)}\n          type=\"button\"\n          onClick={handleCancel}\n        >\n          {cancelText}\n        </button>\n        <button\n          {...restOkProps}\n          disabled={loading}\n          style={{ color: okTextColor, ...okUserStyle }}\n          type=\"button\"\n          className={cx(\n            styles.buttonBase,\n            danger ? styles.dangerOkButton : styles.okButton,\n            okUserCls,\n          )}\n          onClick={handleOk}\n        >\n          {loading && <span className={styles.loadingSpinner} />}\n          {okText}\n        </button>\n      </ModalFooter>\n    </>\n  );\n};\nConfirmBody.displayName = 'ConfirmBody';\n\n// --- Factory ---\n\nexport interface ModalHostProps {\n  root?: HTMLElement | ShadowRoot | null;\n}\n\nexport interface ModalSystem {\n  confirmModal: (config: ModalConfirmConfig) => { close: () => void; destroy: () => void };\n  createModal: (props: ImperativeModalProps) => ModalInstance;\n  ModalHost: React.FC<ModalHostProps>;\n}\n\nlet systemSeed = 0;\n\nexport function createModalSystem(): ModalSystem {\n  const systemId = systemSeed++;\n  const singletonName = systemId === 0 ? 'BaseModalHost' : `BaseModalHost-${systemId}`;\n\n  // --- Stack state (isolated per system) ---\n  let modalStack: ModalStackEntry[] = [];\n  let modalSeed = 0;\n  const listeners = new Set<() => void>();\n\n  const notify = () => listeners.forEach((l) => l());\n  const subscribe = (l: () => void) => {\n    listeners.add(l);\n    return () => listeners.delete(l);\n  };\n  const EMPTY: ModalStackEntry[] = [];\n  const getSnapshot = () => modalStack;\n  const getServerSnapshot = () => EMPTY;\n\n  // --- Stack operations ---\n\n  const updateModal = (id: string, next: Partial<ImperativeModalProps>) => {\n    let changed = false;\n    modalStack = modalStack.map((item) => {\n      if (item.id !== id) return item;\n      changed = true;\n      return { ...item, props: { ...item.props, ...next } };\n    });\n    if (changed) notify();\n  };\n\n  const closeModal = (id: string) => {\n    updateModal(id, { open: false });\n  };\n\n  const destroyModal = (id: string) => {\n    const next = modalStack.filter((item) => item.id !== id);\n    if (next.length === modalStack.length) return;\n    modalStack = next;\n    notify();\n  };\n\n  // --- Stack Item (captures operations via closure) ---\n\n  const StackItem = memo(({ entry }: { entry: ModalStackEntry }) => {\n    const { id, props } = entry;\n    const {\n      children,\n      classNames,\n      content,\n      footer,\n      maskClosable,\n      onOpenChange,\n      onOpenChangeComplete,\n      open,\n      styles: semanticStyles,\n      title,\n      width,\n    } = props;\n\n    const isOpen = open ?? true;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, eventDetails?: { reason: string }) => {\n        if (!nextOpen && maskClosable === false && eventDetails?.reason === 'outside-press') return;\n        if (!nextOpen) closeModal(id);\n        onOpenChange?.(nextOpen);\n      },\n      [id, maskClosable, onOpenChange],\n    );\n\n    const handleExitComplete = useCallback(() => {\n      onOpenChangeComplete?.(false);\n      destroyModal(id);\n    }, [id, onOpenChangeComplete]);\n\n    const close = useCallback(() => closeModal(id), [id]);\n    const setCanDismissByClickOutside = useCallback(\n      (value: boolean) => updateModal(id, { maskClosable: value }),\n      [id],\n    );\n\n    const showTitle = title !== undefined && title !== false && title !== null;\n\n    return (\n      <ModalContext value={{ close, setCanDismissByClickOutside }}>\n        <ModalRoot\n          open={isOpen}\n          onExitComplete={handleExitComplete}\n          onOpenChange={handleOpenChange}\n        >\n          <ModalPortal>\n            <ModalBackdrop className={classNames?.backdrop} style={semanticStyles?.backdrop} />\n            <ModalPopup\n              className={classNames?.popup}\n              popupStyle={semanticStyles?.popup}\n              width={width}\n            >\n              {showTitle && (\n                <ModalHeader className={classNames?.header} style={semanticStyles?.header}>\n                  <ModalTitle className={classNames?.title} style={semanticStyles?.title}>\n                    {title}\n                  </ModalTitle>\n                  <ModalClose className={classNames?.close} style={semanticStyles?.close} />\n                </ModalHeader>\n              )}\n              <ModalContent className={classNames?.content} style={semanticStyles?.content}>\n                {content ?? children}\n              </ModalContent>\n              {footer}\n            </ModalPopup>\n          </ModalPortal>\n        </ModalRoot>\n      </ModalContext>\n    );\n  });\n  StackItem.displayName = 'ModalStackItem';\n\n  const StackRenderer = memo(({ stack }: { stack: ModalStackEntry[] }) => {\n    const isClient = useIsClient();\n    if (!isClient) return null;\n    return stack.map((entry) => <StackItem entry={entry} key={entry.id} />);\n  });\n  StackRenderer.displayName = 'ModalStackRenderer';\n\n  // --- ModalHost ---\n\n  const Host = ({ root }: ModalHostProps) => {\n    const stack = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const isClient = useIsClient();\n\n    useEffect(() => {\n      if (!isClient) return;\n      const scope = root ?? document.body;\n      return registerDevSingleton(singletonName, scope);\n    }, [isClient, root]);\n\n    if (!isClient) return null;\n    if (stack.length === 0) return null;\n\n    return (\n      <ModalPortalWrapper root={root}>\n        <StackRenderer stack={stack} />\n      </ModalPortalWrapper>\n    );\n  };\n\n  // --- createModal ---\n\n  const create = (props: ImperativeModalProps): ModalInstance => {\n    const id = `base-modal-${Date.now()}-${modalSeed++}`;\n    modalStack = [...modalStack, { id, props: { ...props, open: props.open ?? true } }];\n    notify();\n\n    return {\n      close: () => closeModal(id),\n      destroy: () => destroyModal(id),\n      setCanDismissByClickOutside: (value) => updateModal(id, { maskClosable: value }),\n      update: (nextProps) => updateModal(id, nextProps),\n    };\n  };\n\n  // --- confirmModal ---\n\n  const confirm = (config: ModalConfirmConfig) => {\n    const instance = create({\n      content: <ConfirmBody config={config} />,\n      styles: { content: { padding: 0 } },\n      title: config.title,\n      width: 420,\n    });\n\n    return {\n      close: instance.close,\n      destroy: instance.destroy,\n    };\n  };\n\n  return { ModalHost: Host, confirmModal: confirm, createModal: create };\n}\n\n// --- Default global instance (backward compatible) ---\n\nconst defaultSystem = createModalSystem();\nexport const ModalHost = defaultSystem.ModalHost;\nexport const createModal = defaultSystem.createModal;\nexport const confirmModal = defaultSystem.confirmModal;\n"],"mappings":";;;;;;;;;;;;;AAoCA,MAAM,sBAAsB,EAC1B,UACA,WAII;CACJ,MAAM,aAAa,eAAe;AAElC,QAAO,aAAa,UADF,QAAQ,cAAc,SAAS,KACT;;AAG1C,MAAM,eAAe,EAAE,aAA6C;CAClE,MAAM,EAAE,UAAU,iBAAiB;CACnC,MAAM,QAAQ,UAAU;CACxB,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,EAAE,aAAa,UAAU,SAAS,eAAe,SAAS,MAAM,UAAU,SAAS;CAEzF,MAAM,EAAE,QAAQ,WAAW,WAAW,OAAO,aAAa,GAAG,gBAAgB,iBAAiB,EAAE;CAEhG,MAAM,cAAc,kBADF,SAAS,MAAM,aAAa,MAAM,aACJ;CAEhD,MAAM,eAAe,kBAAkB;AACrC,SAAO;AACP,cAAY;IACX,CAAC,OAAO,SAAS,CAAC;CAErB,MAAM,WAAW,YAAY,YAAY;AACvC,MAAI,KACF,KAAI;GACF,MAAM,SAAS,MAAM;AACrB,OAAI,UAAU,OAAQ,OAAe,SAAS,YAAY;AACxD,eAAW,KAAK;AAChB,UAAM;AACN,eAAW,MAAM;;UAEb;AACN,cAAW,MAAM;AACjB;;AAGJ,SAAO;IACN,CAAC,OAAO,KAAK,CAAC;AAEjB,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,WAAW,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,aAAa;YAAG;EAAc,CAAA,EACjE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,UAAD;EACE,WAAW,GAAG,OAAO,YAAY,OAAO,aAAa;EACrD,MAAK;EACL,SAAS;YAER;EACM,CAAA,EACT,qBAAC,UAAD;EACE,GAAI;EACJ,UAAU;EACV,OAAO;GAAE,OAAO;GAAa,GAAG;GAAa;EAC7C,MAAK;EACL,WAAW,GACT,OAAO,YACP,SAAS,OAAO,iBAAiB,OAAO,UACxC,UACD;EACD,SAAS;YAVX,CAYG,WAAW,oBAAC,QAAD,EAAM,WAAW,OAAO,gBAAkB,CAAA,EACrD,OACM;IACG,EAAA,CAAA,CACb,EAAA,CAAA;;AAGP,YAAY,cAAc;AAc1B,IAAI,aAAa;AAEjB,SAAgB,oBAAiC;CAC/C,MAAM,WAAW;CACjB,MAAM,gBAAgB,aAAa,IAAI,kBAAkB,iBAAiB;CAG1E,IAAI,aAAgC,EAAE;CACtC,IAAI,YAAY;CAChB,MAAM,4BAAY,IAAI,KAAiB;CAEvC,MAAM,eAAe,UAAU,SAAS,MAAM,GAAG,CAAC;CAClD,MAAM,aAAa,MAAkB;AACnC,YAAU,IAAI,EAAE;AAChB,eAAa,UAAU,OAAO,EAAE;;CAElC,MAAM,QAA2B,EAAE;CACnC,MAAM,oBAAoB;CAC1B,MAAM,0BAA0B;CAIhC,MAAM,eAAe,IAAY,SAAwC;EACvE,IAAI,UAAU;AACd,eAAa,WAAW,KAAK,SAAS;AACpC,OAAI,KAAK,OAAO,GAAI,QAAO;AAC3B,aAAU;AACV,UAAO;IAAE,GAAG;IAAM,OAAO;KAAE,GAAG,KAAK;KAAO,GAAG;KAAM;IAAE;IACrD;AACF,MAAI,QAAS,SAAQ;;CAGvB,MAAM,cAAc,OAAe;AACjC,cAAY,IAAI,EAAE,MAAM,OAAO,CAAC;;CAGlC,MAAM,gBAAgB,OAAe;EACnC,MAAM,OAAO,WAAW,QAAQ,SAAS,KAAK,OAAO,GAAG;AACxD,MAAI,KAAK,WAAW,WAAW,OAAQ;AACvC,eAAa;AACb,UAAQ;;CAKV,MAAM,YAAY,MAAM,EAAE,YAAwC;EAChE,MAAM,EAAE,IAAI,UAAU;EACtB,MAAM,EACJ,UACA,YACA,SACA,QACA,cACA,cACA,sBACA,MACA,QAAQ,gBACR,OACA,UACE;EAEJ,MAAM,SAAS,QAAQ;EAEvB,MAAM,mBAAmB,aACtB,UAAmB,iBAAsC;AACxD,OAAI,CAAC,YAAY,iBAAiB,SAAS,cAAc,WAAW,gBAAiB;AACrF,OAAI,CAAC,SAAU,YAAW,GAAG;AAC7B,kBAAe,SAAS;KAE1B;GAAC;GAAI;GAAc;GAAa,CACjC;EAED,MAAM,qBAAqB,kBAAkB;AAC3C,0BAAuB,MAAM;AAC7B,gBAAa,GAAG;KACf,CAAC,IAAI,qBAAqB,CAAC;EAE9B,MAAM,QAAQ,kBAAkB,WAAW,GAAG,EAAE,CAAC,GAAG,CAAC;EACrD,MAAM,8BAA8B,aACjC,UAAmB,YAAY,IAAI,EAAE,cAAc,OAAO,CAAC,EAC5D,CAAC,GAAG,CACL;EAED,MAAM,YAAY,UAAU,KAAA,KAAa,UAAU,SAAS,UAAU;AAEtE,SACE,oBAAC,cAAD;GAAc,OAAO;IAAE;IAAO;IAA6B;aACzD,oBAAC,WAAD;IACE,MAAM;IACN,gBAAgB;IAChB,cAAc;cAEd,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,eAAD;KAAe,WAAW,YAAY;KAAU,OAAO,gBAAgB;KAAY,CAAA,EACnF,qBAAC,YAAD;KACE,WAAW,YAAY;KACvB,YAAY,gBAAgB;KACrB;eAHT;MAKG,aACC,qBAAC,aAAD;OAAa,WAAW,YAAY;OAAQ,OAAO,gBAAgB;iBAAnE,CACE,oBAAC,YAAD;QAAY,WAAW,YAAY;QAAO,OAAO,gBAAgB;kBAC9D;QACU,CAAA,EACb,oBAAC,YAAD;QAAY,WAAW,YAAY;QAAO,OAAO,gBAAgB;QAAS,CAAA,CAC9D;;MAEhB,oBAAC,cAAD;OAAc,WAAW,YAAY;OAAS,OAAO,gBAAgB;iBAClE,WAAW;OACC,CAAA;MACd;MACU;OACD,EAAA,CAAA;IACJ,CAAA;GACC,CAAA;GAEjB;AACF,WAAU,cAAc;CAExB,MAAM,gBAAgB,MAAM,EAAE,YAA0C;AAEtE,MAAI,CADa,aACJ,CAAE,QAAO;AACtB,SAAO,MAAM,KAAK,UAAU,oBAAC,WAAD,EAAkB,OAAwB,EAAZ,MAAM,GAAM,CAAC;GACvE;AACF,eAAc,cAAc;CAI5B,MAAM,QAAQ,EAAE,WAA2B;EACzC,MAAM,QAAQ,qBAAqB,WAAW,aAAa,kBAAkB;EAC7E,MAAM,WAAW,aAAa;AAE9B,kBAAgB;AACd,OAAI,CAAC,SAAU;AAEf,UAAO,qBAAqB,eADd,QAAQ,SAAS,KACkB;KAChD,CAAC,UAAU,KAAK,CAAC;AAEpB,MAAI,CAAC,SAAU,QAAO;AACtB,MAAI,MAAM,WAAW,EAAG,QAAO;AAE/B,SACE,oBAAC,oBAAD;GAA0B;aACxB,oBAAC,eAAD,EAAsB,OAAS,CAAA;GACZ,CAAA;;CAMzB,MAAM,UAAU,UAA+C;EAC7D,MAAM,KAAK,cAAc,KAAK,KAAK,CAAC,GAAG;AACvC,eAAa,CAAC,GAAG,YAAY;GAAE;GAAI,OAAO;IAAE,GAAG;IAAO,MAAM,MAAM,QAAQ;IAAM;GAAE,CAAC;AACnF,UAAQ;AAER,SAAO;GACL,aAAa,WAAW,GAAG;GAC3B,eAAe,aAAa,GAAG;GAC/B,8BAA8B,UAAU,YAAY,IAAI,EAAE,cAAc,OAAO,CAAC;GAChF,SAAS,cAAc,YAAY,IAAI,UAAU;GAClD;;CAKH,MAAM,WAAW,WAA+B;EAC9C,MAAM,WAAW,OAAO;GACtB,SAAS,oBAAC,aAAD,EAAqB,QAAU,CAAA;GACxC,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE;GACnC,OAAO,OAAO;GACd,OAAO;GACR,CAAC;AAEF,SAAO;GACL,OAAO,SAAS;GAChB,SAAS,SAAS;GACnB;;AAGH,QAAO;EAAE,WAAW;EAAM,cAAc;EAAS,aAAa;EAAQ;;AAKxE,MAAM,gBAAgB,mBAAmB;AACzC,MAAa,YAAY,cAAc;AACvC,MAAa,cAAc,cAAc;AACzC,MAAa,eAAe,cAAc"}

package/es/base-ui/Switch/atoms.mjs

@@ -4,7 +4,7 @@ import { rootVariants, styles, thumbVariants } from "./style.mjs";
 import { createContext, use, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { cx } from "antd-style";
-import useMergeState from "use-merge-value";
+import useControlledState from "use-merge-value";
 import { Switch } from "@base-ui/react/switch";
 //#region src/base-ui/Switch/atoms.tsx
 const SwitchContext = createContext(null);
@@ -17,7 +17,7 @@ const SwitchRoot = ({ checked, className, defaultChecked, onCheckedChange, onCli
 	const Motion = useMotionComponent();
 	const [isPressed, setIsPressed] = useState(false);
 	const lastEventRef = useRef(null);
-	const [isChecked, setIsChecked] = useMergeState(defaultChecked ?? false, {
+	const [isChecked, setIsChecked] = useControlledState(defaultChecked ?? false, {
 		defaultValue: defaultChecked,
 		onChange: (value) => {
 			if (lastEventRef.current) onCheckedChange?.(value, lastEventRef.current);

package/es/base-ui/Switch/atoms.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"atoms.mjs","names":["useControlledState"],"sources":["../../../src/base-ui/Switch/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Switch } from '@base-ui/react/switch';\nimport { cx } from 'antd-style';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport { createContext, use, useMemo, useRef, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { rootVariants, styles, thumbVariants } from './style';\nimport type {\n  SwitchChangeEventHandler,\n  SwitchContextType,\n  SwitchIconPosition,\n  SwitchIconProps,\n  SwitchRootProps,\n  SwitchThumbProps,\n} from './type';\n\nconst SwitchContext = createContext<SwitchContextType | null>(null);\n\nexport const useSwitchContext = () => {\n  const context = use(SwitchContext);\n  if (!context) {\n    throw new Error('useSwitchContext must be used within a SwitchRoot');\n  }\n  return context;\n};\n\ntype SwitchRootInternalProps = Omit<SwitchRootProps, 'onCheckedChange' | 'onClick'> & {\n  onCheckedChange?: SwitchChangeEventHandler;\n  onClick?: SwitchChangeEventHandler;\n};\n\nexport const SwitchRoot = ({\n  checked,\n  className,\n  defaultChecked,\n  onCheckedChange,\n  onClick,\n  size = 'default',\n  children,\n  disabled,\n  readOnly,\n  required,\n  inputRef,\n  id,\n  name,\n  ...rest\n}: SwitchRootInternalProps) => {\n  const Motion = useMotionComponent();\n  const [isPressed, setIsPressed] = useState(false);\n  const lastEventRef = useRef<MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>>(\n    null,\n  );\n\n  const [isChecked, setIsChecked] = useControlledState(defaultChecked ?? false, {\n    defaultValue: defaultChecked,\n    onChange: (value: boolean) => {\n      if (lastEventRef.current) {\n        onCheckedChange?.(value, lastEventRef.current);\n      }\n    },\n    value: checked,\n  });\n\n  const baseClassName = rootVariants({ size });\n\n  const contextValue = useMemo(\n    () => ({\n      isChecked: Boolean(isChecked),\n      isPressed,\n      setIsChecked: (value: boolean) => setIsChecked(value),\n      setIsPressed,\n    }),\n    [isChecked, isPressed, setIsChecked],\n  );\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    lastEventRef.current = event;\n    onClick?.(!isChecked, event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      lastEventRef.current = event;\n    }\n    (rest as any).onKeyDown?.(event);\n  };\n\n  return (\n    <SwitchContext value={contextValue}>\n      <Switch.Root\n        checked={isChecked}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        id={id}\n        inputRef={inputRef}\n        name={name}\n        readOnly={readOnly}\n        required={required}\n        render={\n          <Motion.button\n            {...rest}\n            className={cx(baseClassName, className)}\n            initial={false}\n            whileTap=\"tap\"\n            onClick={handleClick}\n            onKeyDown={handleKeyDown}\n            onTap={() => setIsPressed(false)}\n            onTapCancel={() => setIsPressed(false)}\n            onTapStart={() => setIsPressed(true)}\n          />\n        }\n        onCheckedChange={setIsChecked}\n      >\n        {children}\n      </Switch.Root>\n    </SwitchContext>\n  );\n};\n\nSwitchRoot.displayName = 'SwitchRoot';\n\nexport const SwitchThumb = ({\n  className,\n  pressedAnimation,\n  size = 'default',\n  transition = { damping: 25, stiffness: 300, type: 'spring' },\n  children,\n  ...rest\n}: SwitchThumbProps) => {\n  const Motion = useMotionComponent();\n  const { isPressed } = useSwitchContext();\n  const baseClassName = thumbVariants({ size });\n\n  const defaultPressedAnimation = {\n    width: size === 'small' ? 16 : 22,\n  };\n\n  return (\n    <Switch.Thumb\n      render={\n        <Motion.span\n          layout\n          animate={isPressed ? pressedAnimation || defaultPressedAnimation : undefined}\n          className={cx(baseClassName, className)}\n          transition={transition}\n          {...rest}\n        >\n          {children}\n        </Motion.span>\n      }\n    />\n  );\n};\n\nSwitchThumb.displayName = 'SwitchThumb';\n\nconst getIconPositionClass = (position: SwitchIconPosition, size: 'default' | 'small') => {\n  if (position === 'thumb') return styles.iconThumb;\n  if (position === 'left') return size === 'small' ? styles.iconLeftSmall : styles.iconLeft;\n  return size === 'small' ? styles.iconRightSmall : styles.iconRight;\n};\n\nexport const SwitchIcon = ({\n  children,\n  className,\n  position,\n  transition = { bounce: 0, type: 'spring' },\n  ...rest\n}: SwitchIconProps & { children?: React.ReactNode; size?: 'default' | 'small' }) => {\n  const Motion = useMotionComponent();\n  const { isChecked } = useSwitchContext();\n  const size = (rest as any).size || 'default';\n\n  const isAnimated = useMemo(() => {\n    if (position === 'right') return !isChecked;\n    if (position === 'left') return isChecked;\n    if (position === 'thumb') return true;\n    return false;\n  }, [position, isChecked]);\n\n  const positionClass = getIconPositionClass(position, size);\n\n  return (\n    <Motion.span\n      animate={isAnimated ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0 }}\n      className={cx(styles.icon, positionClass, className)}\n      transition={transition}\n      {...rest}\n    >\n      {children}\n    </Motion.span>\n  );\n};\n\nSwitchIcon.displayName = 'SwitchIcon';\n\nexport { styles as switchStyles } from './style';\n"],"mappings":"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"}
+{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/Switch/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Switch } from '@base-ui/react/switch';\nimport { cx } from 'antd-style';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport { createContext, use, useMemo, useRef, useState } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport { useMotionComponent } from '@/MotionProvider';\n\nimport { rootVariants, styles, thumbVariants } from './style';\nimport type {\n  SwitchChangeEventHandler,\n  SwitchContextType,\n  SwitchIconPosition,\n  SwitchIconProps,\n  SwitchRootProps,\n  SwitchThumbProps,\n} from './type';\n\nconst SwitchContext = createContext<SwitchContextType | null>(null);\n\nexport const useSwitchContext = () => {\n  const context = use(SwitchContext);\n  if (!context) {\n    throw new Error('useSwitchContext must be used within a SwitchRoot');\n  }\n  return context;\n};\n\ntype SwitchRootInternalProps = Omit<SwitchRootProps, 'onCheckedChange' | 'onClick'> & {\n  onCheckedChange?: SwitchChangeEventHandler;\n  onClick?: SwitchChangeEventHandler;\n};\n\nexport const SwitchRoot = ({\n  checked,\n  className,\n  defaultChecked,\n  onCheckedChange,\n  onClick,\n  size = 'default',\n  children,\n  disabled,\n  readOnly,\n  required,\n  inputRef,\n  id,\n  name,\n  ...rest\n}: SwitchRootInternalProps) => {\n  const Motion = useMotionComponent();\n  const [isPressed, setIsPressed] = useState(false);\n  const lastEventRef = useRef<MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>>(\n    null,\n  );\n\n  const [isChecked, setIsChecked] = useControlledState(defaultChecked ?? false, {\n    defaultValue: defaultChecked,\n    onChange: (value: boolean) => {\n      if (lastEventRef.current) {\n        onCheckedChange?.(value, lastEventRef.current);\n      }\n    },\n    value: checked,\n  });\n\n  const baseClassName = rootVariants({ size });\n\n  const contextValue = useMemo(\n    () => ({\n      isChecked: Boolean(isChecked),\n      isPressed,\n      setIsChecked: (value: boolean) => setIsChecked(value),\n      setIsPressed,\n    }),\n    [isChecked, isPressed, setIsChecked],\n  );\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    lastEventRef.current = event;\n    onClick?.(!isChecked, event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      lastEventRef.current = event;\n    }\n    (rest as any).onKeyDown?.(event);\n  };\n\n  return (\n    <SwitchContext value={contextValue}>\n      <Switch.Root\n        checked={isChecked}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        id={id}\n        inputRef={inputRef}\n        name={name}\n        readOnly={readOnly}\n        required={required}\n        render={\n          <Motion.button\n            {...rest}\n            className={cx(baseClassName, className)}\n            initial={false}\n            whileTap=\"tap\"\n            onClick={handleClick}\n            onKeyDown={handleKeyDown}\n            onTap={() => setIsPressed(false)}\n            onTapCancel={() => setIsPressed(false)}\n            onTapStart={() => setIsPressed(true)}\n          />\n        }\n        onCheckedChange={setIsChecked}\n      >\n        {children}\n      </Switch.Root>\n    </SwitchContext>\n  );\n};\n\nSwitchRoot.displayName = 'SwitchRoot';\n\nexport const SwitchThumb = ({\n  className,\n  pressedAnimation,\n  size = 'default',\n  transition = { damping: 25, stiffness: 300, type: 'spring' },\n  children,\n  ...rest\n}: SwitchThumbProps) => {\n  const Motion = useMotionComponent();\n  const { isPressed } = useSwitchContext();\n  const baseClassName = thumbVariants({ size });\n\n  const defaultPressedAnimation = {\n    width: size === 'small' ? 16 : 22,\n  };\n\n  return (\n    <Switch.Thumb\n      render={\n        <Motion.span\n          layout\n          animate={isPressed ? pressedAnimation || defaultPressedAnimation : undefined}\n          className={cx(baseClassName, className)}\n          transition={transition}\n          {...rest}\n        >\n          {children}\n        </Motion.span>\n      }\n    />\n  );\n};\n\nSwitchThumb.displayName = 'SwitchThumb';\n\nconst getIconPositionClass = (position: SwitchIconPosition, size: 'default' | 'small') => {\n  if (position === 'thumb') return styles.iconThumb;\n  if (position === 'left') return size === 'small' ? styles.iconLeftSmall : styles.iconLeft;\n  return size === 'small' ? styles.iconRightSmall : styles.iconRight;\n};\n\nexport const SwitchIcon = ({\n  children,\n  className,\n  position,\n  transition = { bounce: 0, type: 'spring' },\n  ...rest\n}: SwitchIconProps & { children?: React.ReactNode; size?: 'default' | 'small' }) => {\n  const Motion = useMotionComponent();\n  const { isChecked } = useSwitchContext();\n  const size = (rest as any).size || 'default';\n\n  const isAnimated = useMemo(() => {\n    if (position === 'right') return !isChecked;\n    if (position === 'left') return isChecked;\n    if (position === 'thumb') return true;\n    return false;\n  }, [position, isChecked]);\n\n  const positionClass = getIconPositionClass(position, size);\n\n  return (\n    <Motion.span\n      animate={isAnimated ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0 }}\n      className={cx(styles.icon, positionClass, className)}\n      transition={transition}\n      {...rest}\n    >\n      {children}\n    </Motion.span>\n  );\n};\n\nSwitchIcon.displayName = 'SwitchIcon';\n\nexport { styles as switchStyles } from './style';\n"],"mappings":"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"}

package/es/chat/EditableMessage/EditableMessage.mjs

@@ -5,14 +5,14 @@ import MessageModal from "../MessageModal/MessageModal.mjs";
 import { memo } from "react";
 import { Fragment as Fragment$1, 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/chat/EditableMessage/EditableMessage.tsx
 const EditableMessage = memo(({ value, onChange, classNames = {}, onEditingChange, editing, openModal, onOpenChange, placeholder, showEditWhenEmpty = false, styles: customStyles, className, style, height, variant, editButtonSize, text, fullFeaturedCodeBlock, model, fontSize, language = "markdown", markdownProps }) => {
-	const [isEdit, setTyping] = useMergeState(false, {
+	const [isEdit, setTyping] = useControlledState(false, {
 		onChange: onEditingChange,
 		value: editing
 	});
-	const [expand, setExpand] = useMergeState(false, {
+	const [expand, setExpand] = useControlledState(false, {
 		onChange: onOpenChange,
 		value: openModal
 	});

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/hooks/useMarkdown/useMarkdownComponents.mjs

@@ -2,6 +2,7 @@
 import Hotkey from "../../Hotkey/Hotkey.mjs";
 import { useMarkdownContext } from "../../Markdown/components/MarkdownProvider.mjs";
 import { CodeBlock } from "../../Markdown/components/CodeBlock.mjs";
+import MarkdownTable from "../../Markdown/components/MarkdownTable/index.mjs";
 import Image from "../../mdx/mdxComponents/Image.mjs";
 import Link from "../../mdx/mdxComponents/Link.mjs";
 import Section from "../../mdx/mdxComponents/Section.mjs";
@@ -78,6 +79,10 @@ const useMarkdownComponents = () => {
 		componentProps?.pre
 	]);
 	const memoColorPreview = useCallback(({ node, ...props }) => /* @__PURE__ */ jsx("code", { ...props }), []);
+	const memoTable = useCallback(({ node, ...props }) => /* @__PURE__ */ jsx(MarkdownTable, {
+		node,
+		...props
+	}), []);
 	const memoComponents = useMemo(() => ({
 		a: memoA,
 		br: memoBr,
@@ -87,6 +92,7 @@ const useMarkdownComponents = () => {
 		p: memeP,
 		pre: memoPre,
 		section: memoSection,
+		table: memoTable,
 		video: memoVideo
 	}), [
 		memoA,
@@ -97,7 +103,8 @@ const useMarkdownComponents = () => {
 		memoSection,
 		memeP,
 		memoColorPreview,
-		memoKbd
+		memoKbd,
+		memoTable
 	]);
 	return useMemo(() => ({
 		...memoComponents,

package/es/hooks/useMarkdown/useMarkdownComponents.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMarkdownComponents.mjs","names":[],"sources":["../../../src/hooks/useMarkdown/useMarkdownComponents.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useMemo } from 'react';\nimport type { Components } from 'react-markdown';\n\nimport Hotkey from '@/Hotkey';\nimport { CodeBlock } from '@/Markdown/components/CodeBlock';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport Image from '@/mdx/mdxComponents/Image';\nimport Link from '@/mdx/mdxComponents/Link';\nimport Section from '@/mdx/mdxComponents/Section';\nimport Video from '@/mdx/mdxComponents/Video';\n\nexport const useMarkdownComponents = (): Components => {\n  const {\n    components,\n    animated,\n    citations,\n    componentProps,\n    enableHtmlPreview,\n    enableMermaid,\n    fullFeaturedCodeBlock,\n    showFootnotes,\n  } = useMarkdownContext();\n\n  const memoA = useCallback(\n    ({ node, ...props }: any) => <Link citations={citations} {...props} {...componentProps?.a} />,\n    [citations, componentProps?.a],\n  );\n\n  const memoImg = useCallback(\n    ({ node, ...props }: any) => <Image {...props} {...componentProps?.img} />,\n    [componentProps?.img],\n  );\n\n  const memoVideo = useCallback(\n    ({ node, ...props }: any) => <Video {...props} {...componentProps?.video} />,\n    [componentProps?.video],\n  );\n\n  const memoSection = useCallback(\n    ({ node, ...props }: any) => <Section showFootnotes={showFootnotes} {...props} />,\n    [showFootnotes],\n  );\n\n  const memoKbd = useCallback(\n    ({ children }: any) => <Hotkey keys={children} style={{ display: 'inline-flex' }} />,\n    [],\n  );\n\n  const memoBr = useCallback(() => <br />, []);\n\n  const memeP = useCallback(({ style, children, className }: any) => {\n    const skipWrapperTags = ['img', 'video'];\n    if (typeof children === 'object' && skipWrapperTags.includes(children?.props?.node?.tagName)) {\n      return children;\n    }\n    return (\n      <p className={className} style={style}>\n        {children}\n      </p>\n    );\n  }, []);\n\n  // Stable references for theme objects to prevent unnecessary re-renders\n  const highlightTheme = useMemo(\n    () => componentProps?.highlight?.theme,\n    [JSON.stringify(componentProps?.highlight?.theme)],\n  );\n\n  const mermaidTheme = useMemo(\n    () => componentProps?.mermaid?.theme,\n    [JSON.stringify(componentProps?.mermaid?.theme)],\n  );\n\n  // Create stable component props reference\n  const stableComponentProps = useMemo(() => {\n    if (!componentProps) return;\n\n    return {\n      highlight: componentProps.highlight\n        ? { ...componentProps.highlight, theme: highlightTheme }\n        : undefined,\n      html: componentProps.html,\n      mermaid: componentProps.mermaid\n        ? { ...componentProps.mermaid, theme: mermaidTheme }\n        : undefined,\n    };\n  }, [highlightTheme, mermaidTheme, componentProps?.html]);\n\n  const memoPre = useCallback(\n    ({ node, ...props }: any) => (\n      <CodeBlock\n        animated={animated}\n        enableHtmlPreview={enableHtmlPreview}\n        enableMermaid={enableMermaid}\n        fullFeatured={fullFeaturedCodeBlock}\n        {...stableComponentProps}\n        {...componentProps?.pre}\n        {...props}\n      />\n    ),\n    [\n      animated,\n      enableHtmlPreview,\n      enableMermaid,\n      fullFeaturedCodeBlock,\n      stableComponentProps,\n      componentProps?.pre,\n    ],\n  );\n\n  const memoColorPreview = useCallback(({ node, ...props }: any) => <code {...props} />, []);\n\n  const memoComponents = useMemo(\n    () => ({\n      a: memoA,\n      br: memoBr,\n      colorPreview: memoColorPreview,\n      img: memoImg,\n      kbd: memoKbd,\n      p: memeP,\n      pre: memoPre,\n      section: memoSection,\n      video: memoVideo,\n    }),\n    [memoA, memoBr, memoImg, memoVideo, memoPre, memoSection, memeP, memoColorPreview, memoKbd],\n  );\n\n  return useMemo(\n    () => ({\n      ...memoComponents,\n      ...components,\n    }),\n    [memoComponents, components],\n  );\n};\n"],"mappings":";;;;;;;;;;;AAaA,MAAa,8BAA0C;CACrD,MAAM,EACJ,YACA,UACA,WACA,gBACA,mBACA,eACA,uBACA,kBACE,oBAAoB;CAExB,MAAM,QAAQ,aACX,EAAE,MAAM,GAAG,YAAiB,oBAAC,MAAD;EAAiB;EAAW,GAAI;EAAO,GAAI,gBAAgB;EAAK,CAAA,EAC7F,CAAC,WAAW,gBAAgB,EAAE,CAC/B;CAED,MAAM,UAAU,aACb,EAAE,MAAM,GAAG,YAAiB,oBAAC,OAAD;EAAO,GAAI;EAAO,GAAI,gBAAgB;EAAO,CAAA,EAC1E,CAAC,gBAAgB,IAAI,CACtB;CAED,MAAM,YAAY,aACf,EAAE,MAAM,GAAG,YAAiB,oBAAC,OAAD;EAAO,GAAI;EAAO,GAAI,gBAAgB;EAAS,CAAA,EAC5E,CAAC,gBAAgB,MAAM,CACxB;CAED,MAAM,cAAc,aACjB,EAAE,MAAM,GAAG,YAAiB,oBAAC,SAAD;EAAwB;EAAe,GAAI;EAAS,CAAA,EACjF,CAAC,cAAc,CAChB;CAED,MAAM,UAAU,aACb,EAAE,eAAoB,oBAAC,QAAD;EAAQ,MAAM;EAAU,OAAO,EAAE,SAAS,eAAe;EAAI,CAAA,EACpF,EAAE,CACH;CAED,MAAM,SAAS,kBAAkB,oBAAC,MAAD,EAAM,CAAA,EAAE,EAAE,CAAC;CAE5C,MAAM,QAAQ,aAAa,EAAE,OAAO,UAAU,gBAAqB;AAEjE,MAAI,OAAO,aAAa,YAAY,CADX,OAAO,QACmB,CAAC,SAAS,UAAU,OAAO,MAAM,QAAQ,CAC1F,QAAO;AAET,SACE,oBAAC,KAAD;GAAc;GAAkB;GAC7B;GACC,CAAA;IAEL,EAAE,CAAC;CAGN,MAAM,iBAAiB,cACf,gBAAgB,WAAW,OACjC,CAAC,KAAK,UAAU,gBAAgB,WAAW,MAAM,CAAC,CACnD;CAED,MAAM,eAAe,cACb,gBAAgB,SAAS,OAC/B,CAAC,KAAK,UAAU,gBAAgB,SAAS,MAAM,CAAC,CACjD;CAGD,MAAM,uBAAuB,cAAc;AACzC,MAAI,CAAC,eAAgB;AAErB,SAAO;GACL,WAAW,eAAe,YACtB;IAAE,GAAG,eAAe;IAAW,OAAO;IAAgB,GACtD,KAAA;GACJ,MAAM,eAAe;GACrB,SAAS,eAAe,UACpB;IAAE,GAAG,eAAe;IAAS,OAAO;IAAc,GAClD,KAAA;GACL;IACA;EAAC;EAAgB;EAAc,gBAAgB;EAAK,CAAC;CAExD,MAAM,UAAU,aACb,EAAE,MAAM,GAAG,YACV,oBAAC,WAAD;EACY;EACS;EACJ;EACf,cAAc;EACd,GAAI;EACJ,GAAI,gBAAgB;EACpB,GAAI;EACJ,CAAA,EAEJ;EACE;EACA;EACA;EACA;EACA;EACA,gBAAgB;EACjB,CACF;CAED,MAAM,mBAAmB,aAAa,EAAE,MAAM,GAAG,YAAiB,oBAAC,QAAD,EAAM,GAAI,OAAS,CAAA,EAAE,EAAE,CAAC;CAE1F,MAAM,iBAAiB,eACd;EACL,GAAG;EACH,IAAI;EACJ,cAAc;EACd,KAAK;EACL,KAAK;EACL,GAAG;EACH,KAAK;EACL,SAAS;EACT,OAAO;EACR,GACD;EAAC;EAAO;EAAQ;EAAS;EAAW;EAAS;EAAa;EAAO;EAAkB;EAAQ,CAC5F;AAED,QAAO,eACE;EACL,GAAG;EACH,GAAG;EACJ,GACD,CAAC,gBAAgB,WAAW,CAC7B"}
+{"version":3,"file":"useMarkdownComponents.mjs","names":[],"sources":["../../../src/hooks/useMarkdown/useMarkdownComponents.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useMemo } from 'react';\nimport type { Components } from 'react-markdown';\n\nimport Hotkey from '@/Hotkey';\nimport { CodeBlock } from '@/Markdown/components/CodeBlock';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport MarkdownTable from '@/Markdown/components/MarkdownTable';\nimport Image from '@/mdx/mdxComponents/Image';\nimport Link from '@/mdx/mdxComponents/Link';\nimport Section from '@/mdx/mdxComponents/Section';\nimport Video from '@/mdx/mdxComponents/Video';\n\nexport const useMarkdownComponents = (): Components => {\n  const {\n    components,\n    animated,\n    citations,\n    componentProps,\n    enableHtmlPreview,\n    enableMermaid,\n    fullFeaturedCodeBlock,\n    showFootnotes,\n  } = useMarkdownContext();\n\n  const memoA = useCallback(\n    ({ node, ...props }: any) => <Link citations={citations} {...props} {...componentProps?.a} />,\n    [citations, componentProps?.a],\n  );\n\n  const memoImg = useCallback(\n    ({ node, ...props }: any) => <Image {...props} {...componentProps?.img} />,\n    [componentProps?.img],\n  );\n\n  const memoVideo = useCallback(\n    ({ node, ...props }: any) => <Video {...props} {...componentProps?.video} />,\n    [componentProps?.video],\n  );\n\n  const memoSection = useCallback(\n    ({ node, ...props }: any) => <Section showFootnotes={showFootnotes} {...props} />,\n    [showFootnotes],\n  );\n\n  const memoKbd = useCallback(\n    ({ children }: any) => <Hotkey keys={children} style={{ display: 'inline-flex' }} />,\n    [],\n  );\n\n  const memoBr = useCallback(() => <br />, []);\n\n  const memeP = useCallback(({ style, children, className }: any) => {\n    const skipWrapperTags = ['img', 'video'];\n    if (typeof children === 'object' && skipWrapperTags.includes(children?.props?.node?.tagName)) {\n      return children;\n    }\n    return (\n      <p className={className} style={style}>\n        {children}\n      </p>\n    );\n  }, []);\n\n  // Stable references for theme objects to prevent unnecessary re-renders\n  const highlightTheme = useMemo(\n    () => componentProps?.highlight?.theme,\n    [JSON.stringify(componentProps?.highlight?.theme)],\n  );\n\n  const mermaidTheme = useMemo(\n    () => componentProps?.mermaid?.theme,\n    [JSON.stringify(componentProps?.mermaid?.theme)],\n  );\n\n  // Create stable component props reference\n  const stableComponentProps = useMemo(() => {\n    if (!componentProps) return;\n\n    return {\n      highlight: componentProps.highlight\n        ? { ...componentProps.highlight, theme: highlightTheme }\n        : undefined,\n      html: componentProps.html,\n      mermaid: componentProps.mermaid\n        ? { ...componentProps.mermaid, theme: mermaidTheme }\n        : undefined,\n    };\n  }, [highlightTheme, mermaidTheme, componentProps?.html]);\n\n  const memoPre = useCallback(\n    ({ node, ...props }: any) => (\n      <CodeBlock\n        animated={animated}\n        enableHtmlPreview={enableHtmlPreview}\n        enableMermaid={enableMermaid}\n        fullFeatured={fullFeaturedCodeBlock}\n        {...stableComponentProps}\n        {...componentProps?.pre}\n        {...props}\n      />\n    ),\n    [\n      animated,\n      enableHtmlPreview,\n      enableMermaid,\n      fullFeaturedCodeBlock,\n      stableComponentProps,\n      componentProps?.pre,\n    ],\n  );\n\n  const memoColorPreview = useCallback(({ node, ...props }: any) => <code {...props} />, []);\n\n  const memoTable = useCallback(\n    ({ node, ...props }: any) => <MarkdownTable node={node} {...props} />,\n    [],\n  );\n\n  const memoComponents = useMemo(\n    () => ({\n      a: memoA,\n      br: memoBr,\n      colorPreview: memoColorPreview,\n      img: memoImg,\n      kbd: memoKbd,\n      p: memeP,\n      pre: memoPre,\n      section: memoSection,\n      table: memoTable,\n      video: memoVideo,\n    }),\n    [\n      memoA,\n      memoBr,\n      memoImg,\n      memoVideo,\n      memoPre,\n      memoSection,\n      memeP,\n      memoColorPreview,\n      memoKbd,\n      memoTable,\n    ],\n  );\n\n  return useMemo(\n    () => ({\n      ...memoComponents,\n      ...components,\n    }),\n    [memoComponents, components],\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAcA,MAAa,8BAA0C;CACrD,MAAM,EACJ,YACA,UACA,WACA,gBACA,mBACA,eACA,uBACA,kBACE,oBAAoB;CAExB,MAAM,QAAQ,aACX,EAAE,MAAM,GAAG,YAAiB,oBAAC,MAAD;EAAiB;EAAW,GAAI;EAAO,GAAI,gBAAgB;EAAK,CAAA,EAC7F,CAAC,WAAW,gBAAgB,EAAE,CAC/B;CAED,MAAM,UAAU,aACb,EAAE,MAAM,GAAG,YAAiB,oBAAC,OAAD;EAAO,GAAI;EAAO,GAAI,gBAAgB;EAAO,CAAA,EAC1E,CAAC,gBAAgB,IAAI,CACtB;CAED,MAAM,YAAY,aACf,EAAE,MAAM,GAAG,YAAiB,oBAAC,OAAD;EAAO,GAAI;EAAO,GAAI,gBAAgB;EAAS,CAAA,EAC5E,CAAC,gBAAgB,MAAM,CACxB;CAED,MAAM,cAAc,aACjB,EAAE,MAAM,GAAG,YAAiB,oBAAC,SAAD;EAAwB;EAAe,GAAI;EAAS,CAAA,EACjF,CAAC,cAAc,CAChB;CAED,MAAM,UAAU,aACb,EAAE,eAAoB,oBAAC,QAAD;EAAQ,MAAM;EAAU,OAAO,EAAE,SAAS,eAAe;EAAI,CAAA,EACpF,EAAE,CACH;CAED,MAAM,SAAS,kBAAkB,oBAAC,MAAD,EAAM,CAAA,EAAE,EAAE,CAAC;CAE5C,MAAM,QAAQ,aAAa,EAAE,OAAO,UAAU,gBAAqB;AAEjE,MAAI,OAAO,aAAa,YAAY,CADX,OAAO,QACmB,CAAC,SAAS,UAAU,OAAO,MAAM,QAAQ,CAC1F,QAAO;AAET,SACE,oBAAC,KAAD;GAAc;GAAkB;GAC7B;GACC,CAAA;IAEL,EAAE,CAAC;CAGN,MAAM,iBAAiB,cACf,gBAAgB,WAAW,OACjC,CAAC,KAAK,UAAU,gBAAgB,WAAW,MAAM,CAAC,CACnD;CAED,MAAM,eAAe,cACb,gBAAgB,SAAS,OAC/B,CAAC,KAAK,UAAU,gBAAgB,SAAS,MAAM,CAAC,CACjD;CAGD,MAAM,uBAAuB,cAAc;AACzC,MAAI,CAAC,eAAgB;AAErB,SAAO;GACL,WAAW,eAAe,YACtB;IAAE,GAAG,eAAe;IAAW,OAAO;IAAgB,GACtD,KAAA;GACJ,MAAM,eAAe;GACrB,SAAS,eAAe,UACpB;IAAE,GAAG,eAAe;IAAS,OAAO;IAAc,GAClD,KAAA;GACL;IACA;EAAC;EAAgB;EAAc,gBAAgB;EAAK,CAAC;CAExD,MAAM,UAAU,aACb,EAAE,MAAM,GAAG,YACV,oBAAC,WAAD;EACY;EACS;EACJ;EACf,cAAc;EACd,GAAI;EACJ,GAAI,gBAAgB;EACpB,GAAI;EACJ,CAAA,EAEJ;EACE;EACA;EACA;EACA;EACA;EACA,gBAAgB;EACjB,CACF;CAED,MAAM,mBAAmB,aAAa,EAAE,MAAM,GAAG,YAAiB,oBAAC,QAAD,EAAM,GAAI,OAAS,CAAA,EAAE,EAAE,CAAC;CAE1F,MAAM,YAAY,aACf,EAAE,MAAM,GAAG,YAAiB,oBAAC,eAAD;EAAqB;EAAM,GAAI;EAAS,CAAA,EACrE,EAAE,CACH;CAED,MAAM,iBAAiB,eACd;EACL,GAAG;EACH,IAAI;EACJ,cAAc;EACd,KAAK;EACL,KAAK;EACL,GAAG;EACH,KAAK;EACL,SAAS;EACT,OAAO;EACP,OAAO;EACR,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,QAAO,eACE;EACL,GAAG;EACH,GAAG;EACJ,GACD,CAAC,gBAAgB,WAAW,CAC7B"}

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.14.1",
+  "version": "5.15.0",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",