@lobehub/ui 5.51.2 → 5.53.0

package/es/Accordion/Accordion.mjs

@@ -1,9 +1,9 @@
 "use client";
+import Divider from "../base-ui/Divider/Divider.mjs";
 import { AccordionConfigContext, AccordionItemStateProvider } from "./context.mjs";
 import { styles } from "./style.mjs";
 import { Children, Fragment, isValidElement, memo, useCallback, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { Divider } from "antd";
 import { cx } from "antd-style";
 import { LayoutGroup } from "motion/react";
 import useMergeState from "use-merge-value";

package/es/Accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../src/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { Divider } from 'antd';\nimport { cx } from 'antd-style';\nimport { LayoutGroup } from 'motion/react';\nimport { type Key } from 'react';\nimport { Children, Fragment, isValidElement, memo, useCallback, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { AccordionConfigContext, AccordionItemStateProvider } from './context';\nimport { styles } from './style';\nimport { type AccordionProps } from './type';\n\nconst Accordion = memo<AccordionProps>(\n  ({\n    children,\n    className: userClassName,\n    style: userStyle,\n    accordion = false,\n    defaultExpandedKeys,\n    expandedKeys: expandedKeysProp,\n    onExpandedChange,\n    variant = 'borderless',\n    gap,\n    showDivider = false,\n    disableAnimation = false,\n    hideIndicator = false,\n    indicatorPlacement = 'start',\n    keepContentMounted = true,\n    classNames,\n    styles: customStyles,\n    motionProps,\n    ref,\n    ...rest\n  }) => {\n    // Convert children to array and filter valid elements\n    const validChildren = Children.toArray(children).filter(isValidElement);\n\n    // Collect all item keys\n    const allItemKeys = validChildren.map((child, index) => (child.props as any).itemKey || index);\n\n    // If defaultExpandedKeys or expandedKeys is undefined, expand all items by default\n    const initialExpandedKeys = defaultExpandedKeys ?? allItemKeys;\n\n    const [expandedKeys, setExpandedKeys] = useMergeState<Key[]>(initialExpandedKeys, {\n      onChange: onExpandedChange,\n      value: expandedKeysProp,\n    });\n\n    // Hold expandedKeys and setExpandedKeys via refs so toggleExpand can stay\n    // reference-stable. use-merge-value's setter is recreated on every render,\n    // so depending on it would force AccordionItemStateProvider's memoized\n    // value to change identity each render — even when nothing toggled —\n    // re-rendering every nested AccordionItem via \"context changed\".\n    const expandedKeysRef = useRef(expandedKeys);\n    expandedKeysRef.current = expandedKeys;\n    const setExpandedKeysRef = useRef(setExpandedKeys);\n    setExpandedKeysRef.current = setExpandedKeys;\n\n    const isOpenKey = useCallback((key: Key) => expandedKeysRef.current.includes(key), []);\n\n    const toggleExpand = useCallback(\n      (key: Key) => {\n        const prev = expandedKeysRef.current;\n        let newKeys: Key[];\n\n        if (accordion) {\n          newKeys = prev.includes(key) ? [] : [key];\n        } else {\n          newKeys = prev.includes(key) ? prev.filter((k: Key) => k !== key) : [...prev, key];\n        }\n\n        setExpandedKeysRef.current(newKeys);\n      },\n      [accordion],\n    );\n\n    const toggleExpandKeys = useCallback(\n      (keys: Key[], preferredKey: Key) => {\n        const prev = expandedKeysRef.current;\n        const isOpen = keys.some((key) => prev.includes(key));\n        let newKeys: Key[];\n\n        if (accordion) {\n          newKeys = isOpen ? [] : [preferredKey];\n        } else {\n          newKeys = isOpen\n            ? prev.filter((key: Key) => !keys.includes(key))\n            : [...prev, preferredKey];\n        }\n\n        setExpandedKeysRef.current(newKeys);\n      },\n      [accordion],\n    );\n\n    const configValue = useMemo(\n      () => ({\n        disableAnimation,\n        hideIndicator,\n        indicatorPlacement,\n        keepContentMounted,\n        motionProps,\n        showDivider,\n        variant,\n      }),\n      [\n        disableAnimation,\n        hideIndicator,\n        indicatorPlacement,\n        keepContentMounted,\n        motionProps,\n        showDivider,\n        variant,\n      ],\n    );\n\n    const hasExplicitExpandedKeys =\n      expandedKeysProp !== undefined || defaultExpandedKeys !== undefined;\n\n    const content = (\n      <>\n        {validChildren.map((child, index) => {\n          const hasChildItemKey = (child.props as any).itemKey !== undefined;\n          const childKey = hasChildItemKey ? (child.props as any).itemKey : index;\n          const itemIsOpen = expandedKeys.includes(childKey);\n          return (\n            <Fragment key={childKey}>\n              <AccordionItemStateProvider\n                expandedKeys={hasChildItemKey ? undefined : expandedKeys}\n                isOpen={itemIsOpen}\n                isOpenKey={isOpenKey}\n                itemKey={childKey}\n                preferProviderKeyForNestedItems={!hasExplicitExpandedKeys}\n                onToggleKey={toggleExpand}\n                onToggleKeys={toggleExpandKeys}\n              >\n                {child}\n              </AccordionItemStateProvider>\n              {showDivider && index < validChildren.length - 1 && (\n                <Divider className={styles.divider} />\n              )}\n            </Fragment>\n          );\n        })}\n      </>\n    );\n\n    return (\n      <AccordionConfigContext value={configValue}>\n        <div\n          className={cx(styles.base, classNames?.base, userClassName)}\n          ref={ref}\n          style={{\n            gap,\n            ...customStyles?.base,\n            ...userStyle,\n          }}\n          {...rest}\n        >\n          {disableAnimation ? content : <LayoutGroup>{content}</LayoutGroup>}\n        </div>\n      </AccordionConfigContext>\n    );\n  },\n);\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY,MACf,EACC,UACA,WAAW,eACX,OAAO,WACP,YAAY,OACZ,qBACA,cAAc,kBACd,kBACA,UAAU,cACV,KACA,cAAc,OACd,mBAAmB,OACnB,gBAAgB,OAChB,qBAAqB,SACrB,qBAAqB,MACrB,YACA,QAAQ,cACR,aACA,KACA,GAAG,WACC;CAEJ,MAAM,gBAAgB,SAAS,QAAQ,QAAQ,CAAC,CAAC,OAAO,cAAc;CAGtE,MAAM,cAAc,cAAc,KAAK,OAAO,UAAW,MAAM,MAAc,WAAW,KAAK;CAK7F,MAAM,CAAC,cAAc,mBAAmB,cAFZ,uBAAuB,aAE+B;EAChF,UAAU;EACV,OAAO;CACT,CAAC;CAOD,MAAM,kBAAkB,OAAO,YAAY;CAC3C,gBAAgB,UAAU;CAC1B,MAAM,qBAAqB,OAAO,eAAe;CACjD,mBAAmB,UAAU;CAE7B,MAAM,YAAY,aAAa,QAAa,gBAAgB,QAAQ,SAAS,GAAG,GAAG,CAAC,CAAC;CAErF,MAAM,eAAe,aAClB,QAAa;EACZ,MAAM,OAAO,gBAAgB;EAC7B,IAAI;EAEJ,IAAI,WACF,UAAU,KAAK,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG;OAExC,UAAU,KAAK,SAAS,GAAG,IAAI,KAAK,QAAQ,MAAW,MAAM,GAAG,IAAI,CAAC,GAAG,MAAM,GAAG;EAGnF,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,mBAAmB,aACtB,MAAa,iBAAsB;EAClC,MAAM,OAAO,gBAAgB;EAC7B,MAAM,SAAS,KAAK,MAAM,QAAQ,KAAK,SAAS,GAAG,CAAC;EACpD,IAAI;EAEJ,IAAI,WACF,UAAU,SAAS,CAAC,IAAI,CAAC,YAAY;OAErC,UAAU,SACN,KAAK,QAAQ,QAAa,CAAC,KAAK,SAAS,GAAG,CAAC,IAC7C,CAAC,GAAG,MAAM,YAAY;EAG5B,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,eACX;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,MAAM,0BACJ,qBAAqB,KAAA,KAAa,wBAAwB,KAAA;CAE5D,MAAM,UACJ,oBAAA,YAAA,EAAA,UACG,cAAc,KAAK,OAAO,UAAU;EACnC,MAAM,kBAAmB,MAAM,MAAc,YAAY,KAAA;EACzD,MAAM,WAAW,kBAAmB,MAAM,MAAc,UAAU;EAClE,MAAM,aAAa,aAAa,SAAS,QAAQ;EACjD,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,4BAAD;GACE,cAAc,kBAAkB,KAAA,IAAY;GAC5C,QAAQ;GACG;GACX,SAAS;GACT,iCAAiC,CAAC;GAClC,aAAa;GACb,cAAc;GAEb,UAAA;EACyB,CAAA,GAC3B,eAAe,QAAQ,cAAc,SAAS,KAC7C,oBAAC,SAAD,EAAS,WAAW,OAAO,QAAU,CAAA,CAE/B,EAAA,GAfK,QAeL;CAEd,CAAC,EACD,CAAA;CAGJ,OACE,oBAAC,wBAAD;EAAwB,OAAO;EAC7B,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,MAAM,YAAY,MAAM,aAAa;GACrD;GACL,OAAO;IACL;IACA,GAAG,cAAc;IACjB,GAAG;GACL;GACA,GAAI;GAEH,UAAA,mBAAmB,UAAU,oBAAC,aAAD,EAAA,UAAc,QAAqB,CAAA;EAC9D,CAAA;CACiB,CAAA;AAE5B,CACF;AAEA,UAAU,cAAc"}
+{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../src/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { LayoutGroup } from 'motion/react';\nimport { type Key } from 'react';\nimport { Children, Fragment, isValidElement, memo, useCallback, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Divider from '@/base-ui/Divider';\n\nimport { AccordionConfigContext, AccordionItemStateProvider } from './context';\nimport { styles } from './style';\nimport { type AccordionProps } from './type';\n\nconst Accordion = memo<AccordionProps>(\n  ({\n    children,\n    className: userClassName,\n    style: userStyle,\n    accordion = false,\n    defaultExpandedKeys,\n    expandedKeys: expandedKeysProp,\n    onExpandedChange,\n    variant = 'borderless',\n    gap,\n    showDivider = false,\n    disableAnimation = false,\n    hideIndicator = false,\n    indicatorPlacement = 'start',\n    keepContentMounted = true,\n    classNames,\n    styles: customStyles,\n    motionProps,\n    ref,\n    ...rest\n  }) => {\n    // Convert children to array and filter valid elements\n    const validChildren = Children.toArray(children).filter(isValidElement);\n\n    // Collect all item keys\n    const allItemKeys = validChildren.map((child, index) => (child.props as any).itemKey || index);\n\n    // If defaultExpandedKeys or expandedKeys is undefined, expand all items by default\n    const initialExpandedKeys = defaultExpandedKeys ?? allItemKeys;\n\n    const [expandedKeys, setExpandedKeys] = useMergeState<Key[]>(initialExpandedKeys, {\n      onChange: onExpandedChange,\n      value: expandedKeysProp,\n    });\n\n    // Hold expandedKeys and setExpandedKeys via refs so toggleExpand can stay\n    // reference-stable. use-merge-value's setter is recreated on every render,\n    // so depending on it would force AccordionItemStateProvider's memoized\n    // value to change identity each render — even when nothing toggled —\n    // re-rendering every nested AccordionItem via \"context changed\".\n    const expandedKeysRef = useRef(expandedKeys);\n    expandedKeysRef.current = expandedKeys;\n    const setExpandedKeysRef = useRef(setExpandedKeys);\n    setExpandedKeysRef.current = setExpandedKeys;\n\n    const isOpenKey = useCallback((key: Key) => expandedKeysRef.current.includes(key), []);\n\n    const toggleExpand = useCallback(\n      (key: Key) => {\n        const prev = expandedKeysRef.current;\n        let newKeys: Key[];\n\n        if (accordion) {\n          newKeys = prev.includes(key) ? [] : [key];\n        } else {\n          newKeys = prev.includes(key) ? prev.filter((k: Key) => k !== key) : [...prev, key];\n        }\n\n        setExpandedKeysRef.current(newKeys);\n      },\n      [accordion],\n    );\n\n    const toggleExpandKeys = useCallback(\n      (keys: Key[], preferredKey: Key) => {\n        const prev = expandedKeysRef.current;\n        const isOpen = keys.some((key) => prev.includes(key));\n        let newKeys: Key[];\n\n        if (accordion) {\n          newKeys = isOpen ? [] : [preferredKey];\n        } else {\n          newKeys = isOpen\n            ? prev.filter((key: Key) => !keys.includes(key))\n            : [...prev, preferredKey];\n        }\n\n        setExpandedKeysRef.current(newKeys);\n      },\n      [accordion],\n    );\n\n    const configValue = useMemo(\n      () => ({\n        disableAnimation,\n        hideIndicator,\n        indicatorPlacement,\n        keepContentMounted,\n        motionProps,\n        showDivider,\n        variant,\n      }),\n      [\n        disableAnimation,\n        hideIndicator,\n        indicatorPlacement,\n        keepContentMounted,\n        motionProps,\n        showDivider,\n        variant,\n      ],\n    );\n\n    const hasExplicitExpandedKeys =\n      expandedKeysProp !== undefined || defaultExpandedKeys !== undefined;\n\n    const content = (\n      <>\n        {validChildren.map((child, index) => {\n          const hasChildItemKey = (child.props as any).itemKey !== undefined;\n          const childKey = hasChildItemKey ? (child.props as any).itemKey : index;\n          const itemIsOpen = expandedKeys.includes(childKey);\n          return (\n            <Fragment key={childKey}>\n              <AccordionItemStateProvider\n                expandedKeys={hasChildItemKey ? undefined : expandedKeys}\n                isOpen={itemIsOpen}\n                isOpenKey={isOpenKey}\n                itemKey={childKey}\n                preferProviderKeyForNestedItems={!hasExplicitExpandedKeys}\n                onToggleKey={toggleExpand}\n                onToggleKeys={toggleExpandKeys}\n              >\n                {child}\n              </AccordionItemStateProvider>\n              {showDivider && index < validChildren.length - 1 && (\n                <Divider className={styles.divider} />\n              )}\n            </Fragment>\n          );\n        })}\n      </>\n    );\n\n    return (\n      <AccordionConfigContext value={configValue}>\n        <div\n          className={cx(styles.base, classNames?.base, userClassName)}\n          ref={ref}\n          style={{\n            gap,\n            ...customStyles?.base,\n            ...userStyle,\n          }}\n          {...rest}\n        >\n          {disableAnimation ? content : <LayoutGroup>{content}</LayoutGroup>}\n        </div>\n      </AccordionConfigContext>\n    );\n  },\n);\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":";;;;;;;;;;AAcA,MAAM,YAAY,MACf,EACC,UACA,WAAW,eACX,OAAO,WACP,YAAY,OACZ,qBACA,cAAc,kBACd,kBACA,UAAU,cACV,KACA,cAAc,OACd,mBAAmB,OACnB,gBAAgB,OAChB,qBAAqB,SACrB,qBAAqB,MACrB,YACA,QAAQ,cACR,aACA,KACA,GAAG,WACC;CAEJ,MAAM,gBAAgB,SAAS,QAAQ,QAAQ,CAAC,CAAC,OAAO,cAAc;CAGtE,MAAM,cAAc,cAAc,KAAK,OAAO,UAAW,MAAM,MAAc,WAAW,KAAK;CAK7F,MAAM,CAAC,cAAc,mBAAmB,cAFZ,uBAAuB,aAE+B;EAChF,UAAU;EACV,OAAO;CACT,CAAC;CAOD,MAAM,kBAAkB,OAAO,YAAY;CAC3C,gBAAgB,UAAU;CAC1B,MAAM,qBAAqB,OAAO,eAAe;CACjD,mBAAmB,UAAU;CAE7B,MAAM,YAAY,aAAa,QAAa,gBAAgB,QAAQ,SAAS,GAAG,GAAG,CAAC,CAAC;CAErF,MAAM,eAAe,aAClB,QAAa;EACZ,MAAM,OAAO,gBAAgB;EAC7B,IAAI;EAEJ,IAAI,WACF,UAAU,KAAK,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG;OAExC,UAAU,KAAK,SAAS,GAAG,IAAI,KAAK,QAAQ,MAAW,MAAM,GAAG,IAAI,CAAC,GAAG,MAAM,GAAG;EAGnF,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,mBAAmB,aACtB,MAAa,iBAAsB;EAClC,MAAM,OAAO,gBAAgB;EAC7B,MAAM,SAAS,KAAK,MAAM,QAAQ,KAAK,SAAS,GAAG,CAAC;EACpD,IAAI;EAEJ,IAAI,WACF,UAAU,SAAS,CAAC,IAAI,CAAC,YAAY;OAErC,UAAU,SACN,KAAK,QAAQ,QAAa,CAAC,KAAK,SAAS,GAAG,CAAC,IAC7C,CAAC,GAAG,MAAM,YAAY;EAG5B,mBAAmB,QAAQ,OAAO;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,eACX;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,MAAM,0BACJ,qBAAqB,KAAA,KAAa,wBAAwB,KAAA;CAE5D,MAAM,UACJ,oBAAA,YAAA,EAAA,UACG,cAAc,KAAK,OAAO,UAAU;EACnC,MAAM,kBAAmB,MAAM,MAAc,YAAY,KAAA;EACzD,MAAM,WAAW,kBAAmB,MAAM,MAAc,UAAU;EAClE,MAAM,aAAa,aAAa,SAAS,QAAQ;EACjD,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,4BAAD;GACE,cAAc,kBAAkB,KAAA,IAAY;GAC5C,QAAQ;GACG;GACX,SAAS;GACT,iCAAiC,CAAC;GAClC,aAAa;GACb,cAAc;GAEb,UAAA;EACyB,CAAA,GAC3B,eAAe,QAAQ,cAAc,SAAS,KAC7C,oBAAC,SAAD,EAAS,WAAW,OAAO,QAAU,CAAA,CAE/B,EAAA,GAfK,QAeL;CAEd,CAAC,EACD,CAAA;CAGJ,OACE,oBAAC,wBAAD;EAAwB,OAAO;EAC7B,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,MAAM,YAAY,MAAM,aAAa;GACrD;GACL,OAAO;IACL;IACA,GAAG,cAAc;IACjB,GAAG;GACL;GACA,GAAI;GAEH,UAAA,mBAAmB,UAAU,oBAAC,aAAD,EAAA,UAAc,QAAqB,CAAA;EAC9D,CAAA;CACiB,CAAA;AAE5B,CACF;AAEA,UAAU,cAAc"}

package/es/ActionIconGroup/type.d.mts

@@ -2,7 +2,8 @@ import { CenterProps } from "../Flex/type.mjs";
 import "../Flex/index.mjs";
 import { ActionIconProps } from "../base-ui/ActionIcon/type.mjs";
 import "../base-ui/ActionIcon/index.mjs";
-import { MenuInfo, MenuItemType } from "../Menu/type.mjs";
+import { MenuInfo } from "../Menu/itemInterface.mjs";
+import { MenuItemType } from "../Menu/type.mjs";
 import "../Menu/index.mjs";
 import { DropdownMenuProps } from "../base-ui/DropdownMenu/type.mjs";
 import "../DropdownMenu/index.mjs";

package/es/Alert/Alert.mjs

@@ -7,10 +7,10 @@ import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
 import { extraHeaderVariants, extraVariants, rootVariants } from "./style.mjs";
 import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Alert } from "antd";
 import { cssVar, cx, useTheme } from "antd-style";
 import { camelCase } from "es-toolkit/compat";
 import { AlertTriangle, CheckCircle, Info, X, XCircle } from "lucide-react";
+import { Alert } from "antd";
 //#region src/Alert/Alert.tsx
 const typeIcons = {
 	error: XCircle,

package/es/AutoComplete/Select.mjs

@@ -2,8 +2,8 @@
 import { variants } from "./style.mjs";
 import { memo } from "react";
 import { jsx } from "react/jsx-runtime";
-import { AutoComplete } from "antd";
 import { cx, useThemeMode } from "antd-style";
+import { AutoComplete } from "antd";
 //#region src/AutoComplete/Select.tsx
 const AutoComplete$1 = memo(({ variant, shadow, className, ...rest }) => {
 	const { isDarkMode } = useThemeMode();

package/es/Avatar/Avatar.mjs

@@ -1,16 +1,16 @@
 "use client";
 import Center from "../Flex/Center.mjs";
-import { safeReadableColor } from "../utils/safeReadableColor.mjs";
 import Icon from "../Icon/Icon.mjs";
 import Img from "../Img/index.mjs";
 import FluentEmoji from "../FluentEmoji/FluentEmoji.mjs";
+import { safeReadableColor } from "../utils/safeReadableColor.mjs";
 import { styles, variants } from "./style.mjs";
 import { calculateEmojiSize, formatAvatarText, hasValidBackground, isDefaultAntAvatar } from "./utils.mjs";
 import { memo, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Avatar } from "antd";
 import { cssVar, cx } from "antd-style";
 import { Loader2 } from "lucide-react";
+import { Avatar } from "antd";
 import { getEmoji } from "@lobehub/fluent-emoji";
 //#region src/Avatar/Avatar.tsx
 /**

package/es/Burger/Burger.mjs

@@ -4,9 +4,9 @@ import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
 import { styles } from "./style.mjs";
 import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Drawer, Menu } from "antd";
 import { cx } from "antd-style";
 import { MenuIcon, X } from "lucide-react";
+import { Drawer, Menu as Menu$1 } from "antd";
 //#region src/Burger/Burger.tsx
 const Burger = memo(({ items, openKeys, selectedKeys, opened, setOpened, className, headerHeight = 64, onClick, iconProps, size, variant, rootClassName, fullscreen, drawerProps, ...rest }) => {
 	const cssVariables = useMemo(() => {
@@ -47,7 +47,7 @@ const Burger = memo(({ items, openKeys, selectedKeys, opened, setOpened, classNa
 				body: { padding: 0 },
 				header: { display: "none" }
 			},
-			children: [/* @__PURE__ */ jsx(Menu, {
+			children: [/* @__PURE__ */ jsx(Menu$1, {
 				className: styles.menu,
 				items,
 				mode: "inline",

package/es/Burger/Burger.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Burger.mjs","names":[],"sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["'use client';\n\nimport { Drawer, Menu } from 'antd';\nimport { cx } from 'antd-style';\nimport { MenuIcon, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport { Center } from '@/Flex';\n\nimport { styles } from './style';\nimport type { BurgerProps } from './type';\n\nconst Burger = memo<BurgerProps>(\n  ({\n    items,\n    openKeys,\n    selectedKeys,\n    opened,\n    setOpened,\n    className,\n    headerHeight = 64,\n    onClick,\n    iconProps,\n    size,\n    variant,\n    rootClassName,\n    fullscreen,\n    drawerProps,\n    ...rest\n  }) => {\n    // Convert props to CSS variables\n    const cssVariables = useMemo<Record<string, string>>(() => {\n      const vars: Record<string, string> = {\n        '--burger-header-height': `${headerHeight}px`,\n      };\n      if (fullscreen) {\n        vars['--burger-drawer-top'] = '0';\n        vars['--burger-menu-padding-top'] = '0px';\n      } else {\n        vars['--burger-drawer-top'] = `calc(var(--burger-header-height, ${headerHeight}px) + 1px)`;\n        vars['--burger-menu-padding-top'] = `${headerHeight}px`;\n      }\n      return vars;\n    }, [fullscreen, headerHeight]);\n\n    return (\n      <Center\n        className={cx(styles.container, className)}\n        onClick={() => {\n          setOpened(!opened);\n        }}\n        {...rest}\n      >\n        <ActionIcon icon={opened ? X : MenuIcon} size={size} variant={variant} {...iconProps} />\n        <Drawer\n          closeIcon={undefined}\n          open={opened}\n          placement={'left'}\n          width={'100vw'}\n          {...drawerProps}\n          className={styles.drawer}\n          rootClassName={cx(\n            fullscreen ? styles.drawerRootFullscreen : styles.drawerRoot,\n            rootClassName,\n          )}\n          rootStyle={{\n            ...cssVariables,\n            ...drawerProps?.rootStyle,\n          }}\n          styles={{\n            body: { padding: 0 },\n            header: { display: 'none' },\n          }}\n        >\n          <Menu\n            className={styles.menu}\n            items={items}\n            mode={'inline'}\n            openKeys={openKeys}\n            selectedKeys={selectedKeys}\n            style={cssVariables}\n            onClick={onClick}\n          />\n          <div className={styles.fillRect} />\n        </Drawer>\n      </Center>\n    );\n  },\n);\n\nBurger.displayName = 'Burger';\n\nexport default Burger;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,SAAS,MACZ,EACC,OACA,UACA,cACA,QACA,WACA,WACA,eAAe,IACf,SACA,WACA,MACA,SACA,eACA,YACA,aACA,GAAG,WACC;CAEJ,MAAM,eAAe,cAAsC;EACzD,MAAM,OAA+B,EACnC,0BAA0B,GAAG,aAAa,IAC5C;EACA,IAAI,YAAY;GACd,KAAK,yBAAyB;GAC9B,KAAK,+BAA+B;EACtC,OAAO;GACL,KAAK,yBAAyB,oCAAoC,aAAa;GAC/E,KAAK,+BAA+B,GAAG,aAAa;EACtD;EACA,OAAO;CACT,GAAG,CAAC,YAAY,YAAY,CAAC;CAE7B,OACE,qBAAC,QAAD;EACE,WAAW,GAAG,OAAO,WAAW,SAAS;EACzC,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;EACA,GAAI;EALN,UAAA,CAOE,oBAAC,YAAD;GAAY,MAAM,SAAS,IAAI;GAAgB;GAAe;GAAS,GAAI;EAAY,CAAA,GACvF,qBAAC,QAAD;GACE,WAAW,KAAA;GACX,MAAM;GACN,WAAW;GACX,OAAO;GACP,GAAI;GACJ,WAAW,OAAO;GAClB,eAAe,GACb,aAAa,OAAO,uBAAuB,OAAO,YAClD,aACF;GACA,WAAW;IACT,GAAG;IACH,GAAG,aAAa;GAClB;GACA,QAAQ;IACN,MAAM,EAAE,SAAS,EAAE;IACnB,QAAQ,EAAE,SAAS,OAAO;GAC5B;GAlBF,UAAA,CAoBE,oBAAC,MAAD;IACE,WAAW,OAAO;IACX;IACP,MAAM;IACI;IACI;IACd,OAAO;IACE;GACV,CAAA,GACD,oBAAC,OAAD,EAAK,WAAW,OAAO,SAAW,CAAA,CAC5B;EACF,CAAA,CAAA;;AAEZ,CACF;AAEA,OAAO,cAAc"}
+{"version":3,"file":"Burger.mjs","names":["Menu"],"sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["'use client';\n\nimport { Drawer, Menu } from 'antd';\nimport { cx } from 'antd-style';\nimport { MenuIcon, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport { Center } from '@/Flex';\n\nimport { styles } from './style';\nimport type { BurgerProps } from './type';\n\nconst Burger = memo<BurgerProps>(\n  ({\n    items,\n    openKeys,\n    selectedKeys,\n    opened,\n    setOpened,\n    className,\n    headerHeight = 64,\n    onClick,\n    iconProps,\n    size,\n    variant,\n    rootClassName,\n    fullscreen,\n    drawerProps,\n    ...rest\n  }) => {\n    // Convert props to CSS variables\n    const cssVariables = useMemo<Record<string, string>>(() => {\n      const vars: Record<string, string> = {\n        '--burger-header-height': `${headerHeight}px`,\n      };\n      if (fullscreen) {\n        vars['--burger-drawer-top'] = '0';\n        vars['--burger-menu-padding-top'] = '0px';\n      } else {\n        vars['--burger-drawer-top'] = `calc(var(--burger-header-height, ${headerHeight}px) + 1px)`;\n        vars['--burger-menu-padding-top'] = `${headerHeight}px`;\n      }\n      return vars;\n    }, [fullscreen, headerHeight]);\n\n    return (\n      <Center\n        className={cx(styles.container, className)}\n        onClick={() => {\n          setOpened(!opened);\n        }}\n        {...rest}\n      >\n        <ActionIcon icon={opened ? X : MenuIcon} size={size} variant={variant} {...iconProps} />\n        <Drawer\n          closeIcon={undefined}\n          open={opened}\n          placement={'left'}\n          width={'100vw'}\n          {...drawerProps}\n          className={styles.drawer}\n          rootClassName={cx(\n            fullscreen ? styles.drawerRootFullscreen : styles.drawerRoot,\n            rootClassName,\n          )}\n          rootStyle={{\n            ...cssVariables,\n            ...drawerProps?.rootStyle,\n          }}\n          styles={{\n            body: { padding: 0 },\n            header: { display: 'none' },\n          }}\n        >\n          <Menu\n            className={styles.menu}\n            items={items}\n            mode={'inline'}\n            openKeys={openKeys}\n            selectedKeys={selectedKeys}\n            style={cssVariables}\n            onClick={onClick}\n          />\n          <div className={styles.fillRect} />\n        </Drawer>\n      </Center>\n    );\n  },\n);\n\nBurger.displayName = 'Burger';\n\nexport default Burger;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,SAAS,MACZ,EACC,OACA,UACA,cACA,QACA,WACA,WACA,eAAe,IACf,SACA,WACA,MACA,SACA,eACA,YACA,aACA,GAAG,WACC;CAEJ,MAAM,eAAe,cAAsC;EACzD,MAAM,OAA+B,EACnC,0BAA0B,GAAG,aAAa,IAC5C;EACA,IAAI,YAAY;GACd,KAAK,yBAAyB;GAC9B,KAAK,+BAA+B;EACtC,OAAO;GACL,KAAK,yBAAyB,oCAAoC,aAAa;GAC/E,KAAK,+BAA+B,GAAG,aAAa;EACtD;EACA,OAAO;CACT,GAAG,CAAC,YAAY,YAAY,CAAC;CAE7B,OACE,qBAAC,QAAD;EACE,WAAW,GAAG,OAAO,WAAW,SAAS;EACzC,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;EACA,GAAI;EALN,UAAA,CAOE,oBAAC,YAAD;GAAY,MAAM,SAAS,IAAI;GAAgB;GAAe;GAAS,GAAI;EAAY,CAAA,GACvF,qBAAC,QAAD;GACE,WAAW,KAAA;GACX,MAAM;GACN,WAAW;GACX,OAAO;GACP,GAAI;GACJ,WAAW,OAAO;GAClB,eAAe,GACb,aAAa,OAAO,uBAAuB,OAAO,YAClD,aACF;GACA,WAAW;IACT,GAAG;IACH,GAAG,aAAa;GAClB;GACA,QAAQ;IACN,MAAM,EAAE,SAAS,EAAE;IACnB,QAAQ,EAAE,SAAS,OAAO;GAC5B;GAlBF,UAAA,CAoBE,oBAACA,QAAD;IACE,WAAW,OAAO;IACX;IACP,MAAM;IACI;IACI;IACd,OAAO;IACE;GACV,CAAA,GACD,oBAAC,OAAD,EAAK,WAAW,OAAO,SAAW,CAAA,CAC5B;EACF,CAAA,CAAA;;AAEZ,CACF;AAEA,OAAO,cAAc"}

package/es/Button/Button.mjs

@@ -3,9 +3,9 @@ import Icon from "../Icon/Icon.mjs";
 import { variants } from "./style.mjs";
 import { isValidElement } from "react";
 import { jsx } from "react/jsx-runtime";
-import { Button } from "antd";
 import { cx, useThemeMode } from "antd-style";
 import { Loader2Icon } from "lucide-react";
+import { Button } from "antd";
 //#region src/Button/Button.tsx
 /**
 * @deprecated Use `Button` from `@lobehub/ui/base-ui` instead.

package/es/CodeDiff/DiffPanel.mjs

@@ -3,8 +3,8 @@ import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import Text from "../Text/Text.mjs";
 import { stopPropagation } from "../utils/dom.mjs";
 import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
+import Tag from "../base-ui/Tag/Tag.mjs";
 import MaterialFileTypeIcon from "../MaterialFileTypeIcon/MaterialFileTypeIcon.mjs";
-import Tag from "../Tag/Tag.mjs";
 import { bodyVariants, headerVariants, prefix, styles, variants } from "./style.mjs";
 import { memo, useCallback, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/es/CodeDiff/DiffPanel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DiffPanel.mjs","names":["Flexbox"],"sources":["../../src/CodeDiff/DiffPanel.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\nimport { memo, useCallback, useState } from 'react';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport type { FlexboxProps } from '@/Flex';\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\nimport Tag from '@/Tag';\nimport Text from '@/Text';\nimport { stopPropagation } from '@/utils/dom';\n\nimport { bodyVariants, headerVariants, prefix, styles, variants } from './style';\n\ninterface DiffPanelProps extends Omit<FlexboxProps, 'children'> {\n  actions?: ReactNode;\n  additions: number;\n  body: ReactNode;\n  classNames?: {\n    body?: string;\n    header?: string;\n  };\n  dataCodeType: string;\n  defaultExpand?: boolean;\n  deletions: number;\n  displayName: string;\n  fileName?: string;\n  fullFeatured?: boolean;\n  showHeader?: boolean;\n  styles?: {\n    body?: CSSProperties;\n    header?: CSSProperties;\n  };\n  variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const DiffPanel = memo<DiffPanelProps>(\n  ({\n    actions,\n    body,\n    className,\n    classNames,\n    dataCodeType,\n    defaultExpand = true,\n    deletions,\n    displayName,\n    fileName,\n    fullFeatured = true,\n    showHeader = true,\n    styles: customStyles,\n    variant = 'filled',\n    additions,\n    ...rest\n  }) => {\n    const [expand, setExpand] = useState(defaultExpand);\n\n    const handleToggleExpand = useCallback(() => {\n      setExpand((prev) => !prev);\n    }, []);\n\n    if (!fullFeatured)\n      return (\n        <Flexbox\n          className={cx(variants({ variant }), className)}\n          data-code-type={dataCodeType}\n          {...rest}\n        >\n          <Flexbox horizontal align=\"center\" className={styles.actionsCompact} flex=\"none\" gap={4}>\n            {actions}\n          </Flexbox>\n          {showHeader && <Tag className={styles.lang}>{displayName}</Tag>}\n          <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n            {body}\n          </div>\n        </Flexbox>\n      );\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        data-code-type={dataCodeType}\n        {...rest}\n      >\n        {showHeader && (\n          <Flexbox\n            horizontal\n            align=\"center\"\n            className={cx(headerVariants({ variant }), classNames?.header)}\n            justify=\"space-between\"\n            style={customStyles?.header}\n            onClick={handleToggleExpand}\n          >\n            <Flexbox\n              horizontal\n              align=\"center\"\n              className=\"language-title\"\n              flex={1}\n              gap={4}\n              justify=\"flex-start\"\n              paddingInline={8}\n            >\n              <MaterialFileTypeIcon\n                fallbackUnknownType={false}\n                filename={fileName || displayName}\n                size={18}\n                type=\"file\"\n                variant=\"raw\"\n              />\n              <Text ellipsis fontSize={13}>\n                {displayName}\n              </Text>\n            </Flexbox>\n            <Flexbox horizontal align=\"center\" flex=\"none\" gap={8} onClick={stopPropagation}>\n              {actions && (\n                <Flexbox\n                  horizontal\n                  align=\"center\"\n                  className={cx('panel-actions', `${prefix}-actions`, styles.actions)}\n                  flex=\"none\"\n                  gap={4}\n                >\n                  {actions}\n                </Flexbox>\n              )}\n              {(deletions > 0 || additions > 0) && (\n                <Flexbox horizontal className={styles.stats} gap={8}>\n                  {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n                  {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n                </Flexbox>\n              )}\n              <ActionIcon\n                icon={expand ? ChevronDown : ChevronRight}\n                size=\"small\"\n                onClick={handleToggleExpand}\n              />\n            </Flexbox>\n          </Flexbox>\n        )}\n        <div\n          className={cx(bodyVariants({ expand }), `${prefix}-body`, styles.body, classNames?.body)}\n          style={customStyles?.body}\n        >\n          {body}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nDiffPanel.displayName = 'DiffPanel';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAa,YAAY,MACtB,EACC,SACA,MACA,WACA,YACA,cACA,gBAAgB,MAChB,WACA,aACA,UACA,eAAe,MACf,aAAa,MACb,QAAQ,cACR,UAAU,UACV,WACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,SAAS,aAAa;CAElD,MAAM,qBAAqB,kBAAkB;EAC3C,WAAW,SAAS,CAAC,IAAI;CAC3B,GAAG,CAAC,CAAC;CAEL,IAAI,CAAC,cACH,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA;GAKE,oBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,WAAW,OAAO;IAAgB,MAAK;IAAO,KAAK;IACnF,UAAA;GACM,CAAA;GACR,cAAc,oBAAC,KAAD;IAAK,WAAW,OAAO;IAAO,UAAA;GAAiB,CAAA;GAC9D,oBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,MAAM,YAAY,IAAI;IAAG,OAAO,cAAc;IACrE,UAAA;GACE,CAAA;EACE;;CAGb,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA,CAKG,cACC,qBAACA,mBAAD;GACE,YAAA;GACA,OAAM;GACN,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,YAAY,MAAM;GAC7D,SAAQ;GACR,OAAO,cAAc;GACrB,SAAS;GANX,UAAA,CAQE,qBAACA,mBAAD;IACE,YAAA;IACA,OAAM;IACN,WAAU;IACV,MAAM;IACN,KAAK;IACL,SAAQ;IACR,eAAe;IAPjB,UAAA,CASE,oBAAC,sBAAD;KACE,qBAAqB;KACrB,UAAU,YAAY;KACtB,MAAM;KACN,MAAK;KACL,SAAQ;IACT,CAAA,GACD,oBAAC,MAAD;KAAM,UAAA;KAAS,UAAU;KACtB,UAAA;IACG,CAAA,CACC;GACT,CAAA,GAAA,qBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,MAAK;IAAO,KAAK;IAAG,SAAS;IAAhE,UAAA;KACG,WACC,oBAACA,mBAAD;MACE,YAAA;MACA,OAAM;MACN,WAAW,GAAG,iBAAiB,0BAAqB,OAAO,OAAO;MAClE,MAAK;MACL,KAAK;MAEJ,UAAA;KACM,CAAA;MAET,YAAY,KAAK,YAAY,MAC7B,qBAACA,mBAAD;MAAS,YAAA;MAAW,WAAW,OAAO;MAAO,KAAK;MAAlD,UAAA,CACG,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MACtE,CAAA,GAAA,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MAChE,CAAA,CAAA;;KAEX,oBAAC,YAAD;MACE,MAAM,SAAS,cAAc;MAC7B,MAAK;MACL,SAAS;KACV,CAAA;IACM;GACF,CAAA,CAAA;EAEX,CAAA,GAAA,oBAAC,OAAD;GACE,WAAW,GAAG,aAAa,EAAE,OAAO,CAAC,GAAG,GAAG,OAAO,QAAQ,OAAO,MAAM,YAAY,IAAI;GACvF,OAAO,cAAc;GAEpB,UAAA;EACE,CAAA,CACE;;AAEb,CACF;AAEA,UAAU,cAAc"}
+{"version":3,"file":"DiffPanel.mjs","names":["Flexbox"],"sources":["../../src/CodeDiff/DiffPanel.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\nimport { memo, useCallback, useState } from 'react';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport Tag from '@/base-ui/Tag';\nimport type { FlexboxProps } from '@/Flex';\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\nimport Text from '@/Text';\nimport { stopPropagation } from '@/utils/dom';\n\nimport { bodyVariants, headerVariants, prefix, styles, variants } from './style';\n\ninterface DiffPanelProps extends Omit<FlexboxProps, 'children'> {\n  actions?: ReactNode;\n  additions: number;\n  body: ReactNode;\n  classNames?: {\n    body?: string;\n    header?: string;\n  };\n  dataCodeType: string;\n  defaultExpand?: boolean;\n  deletions: number;\n  displayName: string;\n  fileName?: string;\n  fullFeatured?: boolean;\n  showHeader?: boolean;\n  styles?: {\n    body?: CSSProperties;\n    header?: CSSProperties;\n  };\n  variant?: 'filled' | 'outlined' | 'borderless';\n}\n\nexport const DiffPanel = memo<DiffPanelProps>(\n  ({\n    actions,\n    body,\n    className,\n    classNames,\n    dataCodeType,\n    defaultExpand = true,\n    deletions,\n    displayName,\n    fileName,\n    fullFeatured = true,\n    showHeader = true,\n    styles: customStyles,\n    variant = 'filled',\n    additions,\n    ...rest\n  }) => {\n    const [expand, setExpand] = useState(defaultExpand);\n\n    const handleToggleExpand = useCallback(() => {\n      setExpand((prev) => !prev);\n    }, []);\n\n    if (!fullFeatured)\n      return (\n        <Flexbox\n          className={cx(variants({ variant }), className)}\n          data-code-type={dataCodeType}\n          {...rest}\n        >\n          <Flexbox horizontal align=\"center\" className={styles.actionsCompact} flex=\"none\" gap={4}>\n            {actions}\n          </Flexbox>\n          {showHeader && <Tag className={styles.lang}>{displayName}</Tag>}\n          <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n            {body}\n          </div>\n        </Flexbox>\n      );\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        data-code-type={dataCodeType}\n        {...rest}\n      >\n        {showHeader && (\n          <Flexbox\n            horizontal\n            align=\"center\"\n            className={cx(headerVariants({ variant }), classNames?.header)}\n            justify=\"space-between\"\n            style={customStyles?.header}\n            onClick={handleToggleExpand}\n          >\n            <Flexbox\n              horizontal\n              align=\"center\"\n              className=\"language-title\"\n              flex={1}\n              gap={4}\n              justify=\"flex-start\"\n              paddingInline={8}\n            >\n              <MaterialFileTypeIcon\n                fallbackUnknownType={false}\n                filename={fileName || displayName}\n                size={18}\n                type=\"file\"\n                variant=\"raw\"\n              />\n              <Text ellipsis fontSize={13}>\n                {displayName}\n              </Text>\n            </Flexbox>\n            <Flexbox horizontal align=\"center\" flex=\"none\" gap={8} onClick={stopPropagation}>\n              {actions && (\n                <Flexbox\n                  horizontal\n                  align=\"center\"\n                  className={cx('panel-actions', `${prefix}-actions`, styles.actions)}\n                  flex=\"none\"\n                  gap={4}\n                >\n                  {actions}\n                </Flexbox>\n              )}\n              {(deletions > 0 || additions > 0) && (\n                <Flexbox horizontal className={styles.stats} gap={8}>\n                  {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n                  {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n                </Flexbox>\n              )}\n              <ActionIcon\n                icon={expand ? ChevronDown : ChevronRight}\n                size=\"small\"\n                onClick={handleToggleExpand}\n              />\n            </Flexbox>\n          </Flexbox>\n        )}\n        <div\n          className={cx(bodyVariants({ expand }), `${prefix}-body`, styles.body, classNames?.body)}\n          style={customStyles?.body}\n        >\n          {body}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nDiffPanel.displayName = 'DiffPanel';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAa,YAAY,MACtB,EACC,SACA,MACA,WACA,YACA,cACA,gBAAgB,MAChB,WACA,aACA,UACA,eAAe,MACf,aAAa,MACb,QAAQ,cACR,UAAU,UACV,WACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,SAAS,aAAa;CAElD,MAAM,qBAAqB,kBAAkB;EAC3C,WAAW,SAAS,CAAC,IAAI;CAC3B,GAAG,CAAC,CAAC;CAEL,IAAI,CAAC,cACH,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA;GAKE,oBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,WAAW,OAAO;IAAgB,MAAK;IAAO,KAAK;IACnF,UAAA;GACM,CAAA;GACR,cAAc,oBAAC,KAAD;IAAK,WAAW,OAAO;IAAO,UAAA;GAAiB,CAAA;GAC9D,oBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,MAAM,YAAY,IAAI;IAAG,OAAO,cAAc;IACrE,UAAA;GACE,CAAA;EACE;;CAGb,OACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,QAAQ,CAAC,GAAG,SAAS;EAC9C,kBAAgB;EAChB,GAAI;EAHN,UAAA,CAKG,cACC,qBAACA,mBAAD;GACE,YAAA;GACA,OAAM;GACN,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,YAAY,MAAM;GAC7D,SAAQ;GACR,OAAO,cAAc;GACrB,SAAS;GANX,UAAA,CAQE,qBAACA,mBAAD;IACE,YAAA;IACA,OAAM;IACN,WAAU;IACV,MAAM;IACN,KAAK;IACL,SAAQ;IACR,eAAe;IAPjB,UAAA,CASE,oBAAC,sBAAD;KACE,qBAAqB;KACrB,UAAU,YAAY;KACtB,MAAM;KACN,MAAK;KACL,SAAQ;IACT,CAAA,GACD,oBAAC,MAAD;KAAM,UAAA;KAAS,UAAU;KACtB,UAAA;IACG,CAAA,CACC;GACT,CAAA,GAAA,qBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,MAAK;IAAO,KAAK;IAAG,SAAS;IAAhE,UAAA;KACG,WACC,oBAACA,mBAAD;MACE,YAAA;MACA,OAAM;MACN,WAAW,GAAG,iBAAiB,0BAAqB,OAAO,OAAO;MAClE,MAAK;MACL,KAAK;MAEJ,UAAA;KACM,CAAA;MAET,YAAY,KAAK,YAAY,MAC7B,qBAACA,mBAAD;MAAS,YAAA;MAAW,WAAW,OAAO;MAAO,KAAK;MAAlD,UAAA,CACG,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MACtE,CAAA,GAAA,YAAY,KAAK,qBAAC,QAAD;OAAM,WAAW,OAAO;OAAxB,UAAA,CAAmC,KAAE,SAAgB;MAChE,CAAA,CAAA;;KAEX,oBAAC,YAAD;MACE,MAAM,SAAS,cAAc;MAC7B,MAAK;MACL,SAAS;KACV,CAAA;IACM;GACF,CAAA,CAAA;EAEX,CAAA,GAAA,oBAAC,OAAD;GACE,WAAW,GAAG,aAAa,EAAE,OAAO,CAAC,GAAG,GAAG,OAAO,QAAQ,OAAO,MAAM,YAAY,IAAI;GACvF,OAAO,cAAc;GAEpB,UAAA;EACE,CAAA,CACE;;AAEb,CACF;AAEA,UAAU,cAAc"}

package/es/Collapse/Collapse.mjs

@@ -4,9 +4,9 @@ import Icon from "../Icon/Icon.mjs";
 import { DEFAULT_PADDING, getPadding, styles, variants } from "./style.mjs";
 import { isValidElement, memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Collapse, ConfigProvider } from "antd";
 import { cx, useThemeMode } from "antd-style";
 import { ChevronDown } from "lucide-react";
+import { Collapse, ConfigProvider } from "antd";
 //#region src/Collapse/Collapse.tsx
 const Collapse$1 = memo(({ style, variant = "filled", gap = 0, className, padding = DEFAULT_PADDING, size, collapsible = true, items, styles: customStyles, classNames, ref, ...rest }) => {
 	const { isDarkMode } = useThemeMode();

package/es/ColorSwatches/ColorSwatches.mjs

@@ -1,13 +1,13 @@
 "use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import Center from "../Flex/Center.mjs";
-import { safeReadableColor } from "../utils/safeReadableColor.mjs";
 import Icon from "../Icon/Icon.mjs";
-import { Tooltip as Tooltip$1 } from "../base-ui/Tooltip/Tooltip.mjs";
+import { Tooltip } from "../base-ui/Tooltip/Tooltip.mjs";
+import { safeReadableColor } from "../utils/safeReadableColor.mjs";
+import ColorPicker from "../base-ui/ColorPicker/ColorPicker.mjs";
 import { styles } from "./style.mjs";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ColorPicker } from "antd";
 import { cssVar, cx } from "antd-style";
 import useMergeState from "use-merge-value";
 import { CheckIcon } from "lucide-react";
@@ -41,7 +41,7 @@ const ColorSwatches = ({ enableColorPicker, enableColorSwatches = true, defaultV
 					return false;
 				}
 			})();
-			return /* @__PURE__ */ jsx(Tooltip$1, {
+			return /* @__PURE__ */ jsx(Tooltip, {
 				title: c.title,
 				children: /* @__PURE__ */ jsx(Center, {
 					className: cx(styles.container, isTransparent && styles.transparent, isActive && styles.active),
@@ -61,24 +61,24 @@ const ColorSwatches = ({ enableColorPicker, enableColorSwatches = true, defaultV
 					})
 				})
 			}, c?.key || i);
-		}), enableColorPicker && /* @__PURE__ */ jsx(Tooltip$1, {
+		}), enableColorPicker && /* @__PURE__ */ jsx(Tooltip, {
 			title: texts?.custom || "Custom",
-			children: /* @__PURE__ */ jsx(ColorPicker, {
-				disabledAlpha: true,
-				arrow: false,
-				defaultValue: cssVar.colorPrimary,
-				format: "hex",
-				value: enableColorSwatches ? void 0 : active,
-				className: cx(styles.picker, enableColorSwatches && styles.conic, isCustomActive && styles.active),
-				presets: enableColorSwatches ? void 0 : [{
-					colors: colors.map((c) => c.color),
-					label: texts?.presets || "Presets"
-				}],
-				style: { borderRadius: shape === "circle" ? "50%" : cssVar.borderRadius },
-				onChangeComplete: (c) => {
-					if (c.toHexString() === cssVar.colorPrimary) setActive("");
-					else setActive(c.toHexString());
-				}
+			children: /* @__PURE__ */ jsx("span", {
+				style: { display: "inline-flex" },
+				children: /* @__PURE__ */ jsx(ColorPicker, {
+					presets: enableColorSwatches ? void 0 : colors.map((c) => c.color),
+					value: isCustomActive ? active : void 0,
+					onChangeComplete: setActive,
+					children: /* @__PURE__ */ jsx("button", {
+						"aria-label": texts?.custom || "Custom",
+						type: "button",
+						className: cx(styles.picker, enableColorSwatches && styles.conic, isCustomActive && styles.active),
+						style: {
+							background: enableColorSwatches ? void 0 : active,
+							borderRadius: shape === "circle" ? "50%" : cssVar.borderRadius
+						}
+					})
+				})
 			})
 		})]
 	});

package/es/ColorSwatches/ColorSwatches.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSwatches.mjs","names":["Flexbox","Tooltip"],"sources":["../../src/ColorSwatches/ColorSwatches.tsx"],"sourcesContent":["'use client';\n\nimport { ColorPicker } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { CheckIcon } from 'lucide-react';\nimport { type FC, useMemo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles } from './style';\nimport type { ColorSwatchesProps } from './type';\n\nconst ColorSwatches: FC<ColorSwatchesProps> = ({\n  enableColorPicker,\n  enableColorSwatches = true,\n  defaultValue,\n  value,\n  style,\n  colors,\n  onChange,\n  size = 24,\n  shape = 'circle',\n  texts,\n  ref,\n  ...rest\n}) => {\n  const [active, setActive] = useMergeState(defaultValue, {\n    defaultValue,\n    onChange,\n    value,\n  });\n\n  // Convert size prop to CSS variable\n  const cssVariables = useMemo<Record<string, string>>(\n    () => ({\n      '--color-swatches-size': `${size}px`,\n    }),\n    [size],\n  );\n\n  const isCustomActive = useMemo(\n    () => active && active !== cssVar.colorPrimary && !colors.some((c) => c.color === active),\n    [active, colors],\n  );\n\n  return (\n    <Flexbox\n      horizontal\n      gap={6}\n      ref={ref}\n      style={{\n        ...cssVariables,\n        flexWrap: 'wrap',\n        ...style,\n      }}\n      {...rest}\n    >\n      {enableColorSwatches &&\n        colors.map((c, i) => {\n          const color = c.color || cssVar.colorPrimary;\n          const isActive = (!active && !c.color) || color === active;\n          // Check if color is transparent or CSS variable (which chroma can't parse)\n          const isTransparent =\n            c.color === 'transparent' ||\n            (c.color &&\n              !c.color.startsWith('var(') &&\n              (() => {\n                try {\n                  return chroma(c.color).alpha() === 0;\n                } catch {\n                  return false;\n                }\n              })());\n          return (\n            <Tooltip key={c?.key || i} title={c.title}>\n              <Center\n                className={cx(\n                  styles.container,\n                  isTransparent && styles.transparent,\n                  isActive && styles.active,\n                )}\n                style={{\n                  background: isTransparent ? undefined : color,\n                  borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n                }}\n                onClick={() => setActive(c.color || undefined)}\n              >\n                {isActive && (\n                  <Icon\n                    color={`color-mix(in srgb, ${safeReadableColor(color)} 33%, transparent)`}\n                    icon={CheckIcon}\n                    size={{ size: 14, strokeWidth: 4 }}\n                    style={{\n                      pointerEvents: 'none',\n                    }}\n                  />\n                )}\n              </Center>\n            </Tooltip>\n          );\n        })}\n      {enableColorPicker && (\n        <Tooltip title={texts?.custom || 'Custom'}>\n          <ColorPicker\n            disabledAlpha\n            arrow={false}\n            defaultValue={cssVar.colorPrimary}\n            format={'hex'}\n            value={enableColorSwatches ? undefined : active}\n            className={cx(\n              styles.picker,\n              enableColorSwatches && styles.conic,\n              isCustomActive && styles.active,\n            )}\n            presets={\n              enableColorSwatches\n                ? undefined\n                : [\n                    {\n                      colors: colors.map((c) => c.color),\n                      label: texts?.presets || 'Presets',\n                    },\n                  ]\n            }\n            style={{\n              borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n            }}\n            onChangeComplete={(c) => {\n              if (c.toHexString() === cssVar.colorPrimary) {\n                setActive('');\n              } else {\n                setActive(c.toHexString());\n              }\n            }}\n          />\n        </Tooltip>\n      )}\n    </Flexbox>\n  );\n};\n\nColorSwatches.displayName = 'ColorSwatches';\n\nexport default ColorSwatches;\n"],"mappings":";;;;;;;;;;;;;;;AAiBA,MAAM,iBAAyC,EAC7C,mBACA,sBAAsB,MACtB,cACA,OACA,OACA,QACA,UACA,OAAO,IACP,QAAQ,UACR,OACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,cAAc,cAAc;EACtD;EACA;EACA;CACF,CAAC;CAGD,MAAM,eAAe,eACZ,EACL,yBAAyB,GAAG,KAAK,IACnC,IACA,CAAC,IAAI,CACP;CAEA,MAAM,iBAAiB,cACf,UAAU,WAAW,OAAO,gBAAgB,CAAC,OAAO,MAAM,MAAM,EAAE,UAAU,MAAM,GACxF,CAAC,QAAQ,MAAM,CACjB;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,KAAK;EACA;EACL,OAAO;GACL,GAAG;GACH,UAAU;GACV,GAAG;EACL;EACA,GAAI;EATN,UAAA,CAWG,uBACC,OAAO,KAAK,GAAG,MAAM;GACnB,MAAM,QAAQ,EAAE,SAAS,OAAO;GAChC,MAAM,WAAY,CAAC,UAAU,CAAC,EAAE,SAAU,UAAU;GAEpD,MAAM,gBACJ,EAAE,UAAU,iBACX,EAAE,SACD,CAAC,EAAE,MAAM,WAAW,MAAM,YACnB;IACL,IAAI;KACF,OAAO,OAAO,EAAE,KAAK,CAAC,CAAC,MAAM,MAAM;IACrC,QAAQ;KACN,OAAO;IACT;GACF,EAAA,CAAG;GACP,OACE,oBAACC,WAAD;IAA2B,OAAO,EAAE;IAClC,UAAA,oBAAC,QAAD;KACE,WAAW,GACT,OAAO,WACP,iBAAiB,OAAO,aACxB,YAAY,OAAO,MACrB;KACA,OAAO;MACL,YAAY,gBAAgB,KAAA,IAAY;MACxC,cAAc,UAAU,WAAW,QAAQ,OAAO;KACpD;KACA,eAAe,UAAU,EAAE,SAAS,KAAA,CAAS;KAE5C,UAAA,YACC,oBAAC,MAAD;MACE,OAAO,sBAAsB,kBAAkB,KAAK,EAAE;MACtD,MAAM;MACN,MAAM;OAAE,MAAM;OAAI,aAAa;MAAE;MACjC,OAAO,EACL,eAAe,OACjB;KACD,CAAA;IAEG,CAAA;GACD,GAxBK,GAAG,OAAO,CAwBf;EAEb,CAAC,GACF,qBACC,oBAACA,WAAD;GAAS,OAAO,OAAO,UAAU;GAC/B,UAAA,oBAAC,aAAD;IACE,eAAA;IACA,OAAO;IACP,cAAc,OAAO;IACrB,QAAQ;IACR,OAAO,sBAAsB,KAAA,IAAY;IACzC,WAAW,GACT,OAAO,QACP,uBAAuB,OAAO,OAC9B,kBAAkB,OAAO,MAC3B;IACA,SACE,sBACI,KAAA,IACA,CACE;KACE,QAAQ,OAAO,KAAK,MAAM,EAAE,KAAK;KACjC,OAAO,OAAO,WAAW;IAC3B,CACF;IAEN,OAAO,EACL,cAAc,UAAU,WAAW,QAAQ,OAAO,aACpD;IACA,mBAAmB,MAAM;KACvB,IAAI,EAAE,YAAY,MAAM,OAAO,cAC7B,UAAU,EAAE;UAEZ,UAAU,EAAE,YAAY,CAAC;IAE7B;GACD,CAAA;EACM,CAAA,CAEJ;;AAEb;AAEA,cAAc,cAAc"}
+{"version":3,"file":"ColorSwatches.mjs","names":["Flexbox"],"sources":["../../src/ColorSwatches/ColorSwatches.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { CheckIcon } from 'lucide-react';\nimport { type FC, useMemo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { ColorPicker } from '@/base-ui/ColorPicker';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Tooltip from '@/Tooltip';\nimport { safeReadableColor } from '@/utils/safeReadableColor';\n\nimport { styles } from './style';\nimport type { ColorSwatchesProps } from './type';\n\nconst ColorSwatches: FC<ColorSwatchesProps> = ({\n  enableColorPicker,\n  enableColorSwatches = true,\n  defaultValue,\n  value,\n  style,\n  colors,\n  onChange,\n  size = 24,\n  shape = 'circle',\n  texts,\n  ref,\n  ...rest\n}) => {\n  const [active, setActive] = useMergeState(defaultValue, {\n    defaultValue,\n    onChange,\n    value,\n  });\n\n  // Convert size prop to CSS variable\n  const cssVariables = useMemo<Record<string, string>>(\n    () => ({\n      '--color-swatches-size': `${size}px`,\n    }),\n    [size],\n  );\n\n  const isCustomActive = useMemo(\n    () => active && active !== cssVar.colorPrimary && !colors.some((c) => c.color === active),\n    [active, colors],\n  );\n\n  return (\n    <Flexbox\n      horizontal\n      gap={6}\n      ref={ref}\n      style={{\n        ...cssVariables,\n        flexWrap: 'wrap',\n        ...style,\n      }}\n      {...rest}\n    >\n      {enableColorSwatches &&\n        colors.map((c, i) => {\n          const color = c.color || cssVar.colorPrimary;\n          const isActive = (!active && !c.color) || color === active;\n          // Check if color is transparent or CSS variable (which chroma can't parse)\n          const isTransparent =\n            c.color === 'transparent' ||\n            (c.color &&\n              !c.color.startsWith('var(') &&\n              (() => {\n                try {\n                  return chroma(c.color).alpha() === 0;\n                } catch {\n                  return false;\n                }\n              })());\n          return (\n            <Tooltip key={c?.key || i} title={c.title}>\n              <Center\n                className={cx(\n                  styles.container,\n                  isTransparent && styles.transparent,\n                  isActive && styles.active,\n                )}\n                style={{\n                  background: isTransparent ? undefined : color,\n                  borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n                }}\n                onClick={() => setActive(c.color || undefined)}\n              >\n                {isActive && (\n                  <Icon\n                    color={`color-mix(in srgb, ${safeReadableColor(color)} 33%, transparent)`}\n                    icon={CheckIcon}\n                    size={{ size: 14, strokeWidth: 4 }}\n                    style={{\n                      pointerEvents: 'none',\n                    }}\n                  />\n                )}\n              </Center>\n            </Tooltip>\n          );\n        })}\n      {enableColorPicker && (\n        <Tooltip title={texts?.custom || 'Custom'}>\n          <span style={{ display: 'inline-flex' }}>\n            <ColorPicker\n              presets={enableColorSwatches ? undefined : colors.map((c) => c.color)}\n              value={isCustomActive ? active : undefined}\n              onChangeComplete={setActive}\n            >\n              <button\n                aria-label={texts?.custom || 'Custom'}\n                type=\"button\"\n                className={cx(\n                  styles.picker,\n                  enableColorSwatches && styles.conic,\n                  isCustomActive && styles.active,\n                )}\n                style={{\n                  background: enableColorSwatches ? undefined : active,\n                  borderRadius: shape === 'circle' ? '50%' : cssVar.borderRadius,\n                }}\n              />\n            </ColorPicker>\n          </span>\n        </Tooltip>\n      )}\n    </Flexbox>\n  );\n};\n\nColorSwatches.displayName = 'ColorSwatches';\n\nexport default ColorSwatches;\n"],"mappings":";;;;;;;;;;;;;;;AAiBA,MAAM,iBAAyC,EAC7C,mBACA,sBAAsB,MACtB,cACA,OACA,OACA,QACA,UACA,OAAO,IACP,QAAQ,UACR,OACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAa,cAAc,cAAc;EACtD;EACA;EACA;CACF,CAAC;CAGD,MAAM,eAAe,eACZ,EACL,yBAAyB,GAAG,KAAK,IACnC,IACA,CAAC,IAAI,CACP;CAEA,MAAM,iBAAiB,cACf,UAAU,WAAW,OAAO,gBAAgB,CAAC,OAAO,MAAM,MAAM,EAAE,UAAU,MAAM,GACxF,CAAC,QAAQ,MAAM,CACjB;CAEA,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,KAAK;EACA;EACL,OAAO;GACL,GAAG;GACH,UAAU;GACV,GAAG;EACL;EACA,GAAI;EATN,UAAA,CAWG,uBACC,OAAO,KAAK,GAAG,MAAM;GACnB,MAAM,QAAQ,EAAE,SAAS,OAAO;GAChC,MAAM,WAAY,CAAC,UAAU,CAAC,EAAE,SAAU,UAAU;GAEpD,MAAM,gBACJ,EAAE,UAAU,iBACX,EAAE,SACD,CAAC,EAAE,MAAM,WAAW,MAAM,YACnB;IACL,IAAI;KACF,OAAO,OAAO,EAAE,KAAK,CAAC,CAAC,MAAM,MAAM;IACrC,QAAQ;KACN,OAAO;IACT;GACF,EAAA,CAAG;GACP,OACE,oBAAC,SAAD;IAA2B,OAAO,EAAE;IAClC,UAAA,oBAAC,QAAD;KACE,WAAW,GACT,OAAO,WACP,iBAAiB,OAAO,aACxB,YAAY,OAAO,MACrB;KACA,OAAO;MACL,YAAY,gBAAgB,KAAA,IAAY;MACxC,cAAc,UAAU,WAAW,QAAQ,OAAO;KACpD;KACA,eAAe,UAAU,EAAE,SAAS,KAAA,CAAS;KAE5C,UAAA,YACC,oBAAC,MAAD;MACE,OAAO,sBAAsB,kBAAkB,KAAK,EAAE;MACtD,MAAM;MACN,MAAM;OAAE,MAAM;OAAI,aAAa;MAAE;MACjC,OAAO,EACL,eAAe,OACjB;KACD,CAAA;IAEG,CAAA;GACD,GAxBK,GAAG,OAAO,CAwBf;EAEb,CAAC,GACF,qBACC,oBAAC,SAAD;GAAS,OAAO,OAAO,UAAU;GAC/B,UAAA,oBAAC,QAAD;IAAM,OAAO,EAAE,SAAS,cAAc;IACpC,UAAA,oBAAC,aAAD;KACE,SAAS,sBAAsB,KAAA,IAAY,OAAO,KAAK,MAAM,EAAE,KAAK;KACpE,OAAO,iBAAiB,SAAS,KAAA;KACjC,kBAAkB;KAElB,UAAA,oBAAC,UAAD;MACE,cAAY,OAAO,UAAU;MAC7B,MAAK;MACL,WAAW,GACT,OAAO,QACP,uBAAuB,OAAO,OAC9B,kBAAkB,OAAO,MAC3B;MACA,OAAO;OACL,YAAY,sBAAsB,KAAA,IAAY;OAC9C,cAAc,UAAU,WAAW,QAAQ,OAAO;MACpD;KACD,CAAA;IACU,CAAA;GACT,CAAA;EACC,CAAA,CAEJ;;AAEb;AAEA,cAAc,cAAc"}

package/es/ColorSwatches/style.mjs

@@ -1,6 +1,5 @@
 import { createStaticStyles } from "antd-style";
 //#region src/ColorSwatches/style.ts
-const prefixCls = "ant";
 const styles = createStaticStyles(({ css, cssVar }) => {
 	return {
 		active: css`
@@ -22,9 +21,6 @@ const styles = createStaticStyles(({ css, cssVar }) => {
         ${cssVar.magenta},
         ${cssVar.red}
       );
-      .${prefixCls}-color-picker-color-block {
-        opacity: 0;
-      }
     `,
 		container: css`
       cursor: pointer;
@@ -41,11 +37,13 @@ const styles = createStaticStyles(({ css, cssVar }) => {
 
       &:hover {
         box-shadow:
-          inset 0 0 0 1px rgba(0, 0, 0, 5%),
+          inset 0 0 0 1px rgb(0 0 0 / 5%),
           0 0 0 2px ${cssVar.colorText};
       }
     `,
 		picker: css`
+      cursor: pointer;
+
       overflow: hidden;
       flex: none;
 
@@ -63,13 +61,6 @@ const styles = createStaticStyles(({ css, cssVar }) => {
           inset 0 0 0 1px ${cssVar.colorFillSecondary},
           0 0 0 2px ${cssVar.colorText};
       }
-
-      .${prefixCls}-color-picker-color-block {
-        width: 100%;
-        height: 100%;
-        border: none;
-        border-radius: inherit;
-      }
     `,
 		transparent: css`
       background-image: conic-gradient(

package/es/ColorSwatches/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../src/ColorSwatches/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nconst prefixCls = 'ant';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: css`\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFill};\n    `,\n    conic: css`\n      background: conic-gradient(\n        ${cssVar.red},\n        ${cssVar.volcano},\n        ${cssVar.orange},\n        ${cssVar.gold},\n        ${cssVar.yellow},\n        ${cssVar.lime},\n        ${cssVar.green},\n        ${cssVar.cyan},\n        ${cssVar.blue},\n        ${cssVar.geekblue},\n        ${cssVar.purple},\n        ${cssVar.magenta},\n        ${cssVar.red}\n      );\n      .${prefixCls}-color-picker-color-block {\n        opacity: 0;\n      }\n    `,\n\n    container: css`\n      cursor: pointer;\n\n      flex: none;\n\n      width: var(--color-swatches-size, 24px);\n      min-width: var(--color-swatches-size, 24px);\n      height: var(--color-swatches-size, 24px);\n      min-height: var(--color-swatches-size, 24px);\n\n      background: ${cssVar.colorBgContainer};\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFillSecondary};\n\n      &:hover {\n        box-shadow:\n          inset 0 0 0 1px rgba(0, 0, 0, 5%),\n          0 0 0 2px ${cssVar.colorText};\n      }\n    `,\n\n    picker: css`\n      overflow: hidden;\n      flex: none;\n\n      width: var(--color-swatches-size, 24px);\n      min-width: var(--color-swatches-size, 24px);\n      height: var(--color-swatches-size, 24px);\n      min-height: var(--color-swatches-size, 24px);\n      padding: 0;\n      border: none;\n\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFillSecondary};\n\n      &:hover {\n        box-shadow:\n          inset 0 0 0 1px ${cssVar.colorFillSecondary},\n          0 0 0 2px ${cssVar.colorText};\n      }\n\n      .${prefixCls}-color-picker-color-block {\n        width: 100%;\n        height: 100%;\n        border: none;\n        border-radius: inherit;\n      }\n    `,\n\n    transparent: css`\n      background-image: conic-gradient(\n        ${cssVar.colorFillSecondary} 25%,\n        transparent 25% 50%,\n        ${cssVar.colorFillSecondary} 50% 75%,\n        transparent 75% 100%\n      );\n      background-size: 50% 50%;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAM,YAAY;AAElB,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQ,GAAG;oCACqB,OAAO,UAAU;;EAEjD,OAAO,GAAG;;UAEJ,OAAO,IAAI;UACX,OAAO,QAAQ;UACf,OAAO,OAAO;UACd,OAAO,KAAK;UACZ,OAAO,OAAO;UACd,OAAO,KAAK;UACZ,OAAO,MAAM;UACb,OAAO,KAAK;UACZ,OAAO,KAAK;UACZ,OAAO,SAAS;UAChB,OAAO,OAAO;UACd,OAAO,QAAQ;UACf,OAAO,IAAI;;SAEZ,UAAU;;;;EAKf,WAAW,GAAG;;;;;;;;;;oBAUE,OAAO,iBAAiB;oCACR,OAAO,mBAAmB;;;;;sBAKxC,OAAO,UAAU;;;EAInC,QAAQ,GAAG;;;;;;;;;;;oCAWqB,OAAO,mBAAmB;;;;4BAIlC,OAAO,mBAAmB;sBAChC,OAAO,UAAU;;;SAG9B,UAAU;;;;;;;EAQf,aAAa,GAAG;;UAEV,OAAO,mBAAmB;;UAE1B,OAAO,mBAAmB;;;;;CAKlC;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/ColorSwatches/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: css`\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFill};\n    `,\n    conic: css`\n      background: conic-gradient(\n        ${cssVar.red},\n        ${cssVar.volcano},\n        ${cssVar.orange},\n        ${cssVar.gold},\n        ${cssVar.yellow},\n        ${cssVar.lime},\n        ${cssVar.green},\n        ${cssVar.cyan},\n        ${cssVar.blue},\n        ${cssVar.geekblue},\n        ${cssVar.purple},\n        ${cssVar.magenta},\n        ${cssVar.red}\n      );\n    `,\n\n    container: css`\n      cursor: pointer;\n\n      flex: none;\n\n      width: var(--color-swatches-size, 24px);\n      min-width: var(--color-swatches-size, 24px);\n      height: var(--color-swatches-size, 24px);\n      min-height: var(--color-swatches-size, 24px);\n\n      background: ${cssVar.colorBgContainer};\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFillSecondary};\n\n      &:hover {\n        box-shadow:\n          inset 0 0 0 1px rgb(0 0 0 / 5%),\n          0 0 0 2px ${cssVar.colorText};\n      }\n    `,\n\n    picker: css`\n      cursor: pointer;\n\n      overflow: hidden;\n      flex: none;\n\n      width: var(--color-swatches-size, 24px);\n      min-width: var(--color-swatches-size, 24px);\n      height: var(--color-swatches-size, 24px);\n      min-height: var(--color-swatches-size, 24px);\n      padding: 0;\n      border: none;\n\n      box-shadow: inset 0 0 0 1px ${cssVar.colorFillSecondary};\n\n      &:hover {\n        box-shadow:\n          inset 0 0 0 1px ${cssVar.colorFillSecondary},\n          0 0 0 2px ${cssVar.colorText};\n      }\n    `,\n\n    transparent: css`\n      background-image: conic-gradient(\n        ${cssVar.colorFillSecondary} 25%,\n        transparent 25% 50%,\n        ${cssVar.colorFillSecondary} 50% 75%,\n        transparent 75% 100%\n      );\n      background-size: 50% 50%;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQ,GAAG;oCACqB,OAAO,UAAU;;EAEjD,OAAO,GAAG;;UAEJ,OAAO,IAAI;UACX,OAAO,QAAQ;UACf,OAAO,OAAO;UACd,OAAO,KAAK;UACZ,OAAO,OAAO;UACd,OAAO,KAAK;UACZ,OAAO,MAAM;UACb,OAAO,KAAK;UACZ,OAAO,KAAK;UACZ,OAAO,SAAS;UAChB,OAAO,OAAO;UACd,OAAO,QAAQ;UACf,OAAO,IAAI;;;EAIjB,WAAW,GAAG;;;;;;;;;;oBAUE,OAAO,iBAAiB;oCACR,OAAO,mBAAmB;;;;;sBAKxC,OAAO,UAAU;;;EAInC,QAAQ,GAAG;;;;;;;;;;;;;oCAaqB,OAAO,mBAAmB;;;;4BAIlC,OAAO,mBAAmB;sBAChC,OAAO,UAAU;;;EAInC,aAAa,GAAG;;UAEV,OAAO,mBAAmB;;UAE1B,OAAO,mBAAmB;;;;;CAKlC;AACF,CAAC"}

package/es/DatePicker/DatePicker.mjs

@@ -2,8 +2,8 @@
 import { variants } from "./style.mjs";
 import { memo } from "react";
 import { jsx } from "react/jsx-runtime";
-import { DatePicker } from "antd";
 import { cx, useThemeMode } from "antd-style";
+import { DatePicker } from "antd";
 //#region src/DatePicker/DatePicker.tsx
 const DatePicker$1 = memo(({ variant, shadow, className, ...rest }) => {
 	const { isDarkMode } = useThemeMode();

package/es/DraggablePanel/DraggablePanel.mjs

@@ -5,10 +5,10 @@ import { handleVariants, panelVariants, styles, toggleVariants } from "./style.m
 import { isBelowCollapseThreshold, reversePlacement } from "./utils.mjs";
 import { memo, startTransition, use, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ConfigProvider } from "antd";
 import { cx } from "antd-style";
 import useMergeState from "use-merge-value";
 import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from "lucide-react";
+import { ConfigProvider } from "antd";
 import { useHover } from "ahooks";
 import isEqual from "fast-deep-equal";
 import { Resizable } from "re-resizable";

package/es/Drawer/Drawer.mjs

@@ -3,9 +3,9 @@ import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
 import { memo, useMemo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { Drawer } from "antd";
 import { cssVar } from "antd-style";
 import { XIcon } from "lucide-react";
+import { Drawer } from "antd";
 //#region src/Drawer/Drawer.tsx
 const Drawer$1 = memo(({ onClose, containerMaxWidth = 1024, classNames, title, placement, styles, children, height, width, extra, closeIconProps, noHeader, sidebarWidth = 280, sidebar, closeIcon, ref, ...rest }) => {
 	const headerBorder = useMemo(() => {

package/es/EditableText/ControlInput.d.mts

@@ -1,7 +1,7 @@
 import { ActionIconProps } from "../base-ui/ActionIcon/type.mjs";
 import "../base-ui/ActionIcon/index.mjs";
-import { InputProps } from "../Input/type.mjs";
-import "../Input/index.mjs";
+import { InputProps } from "../base-ui/Input/type.mjs";
+import "../base-ui/Input/index.mjs";
 //#region src/EditableText/ControlInput.d.ts
 interface ControlInputProps extends Omit<InputProps, 'onChange' | 'value' | 'onAbort'> {
   onChange?: (value: string) => void;

package/es/EditableText/ControlInput.mjs

@@ -1,7 +1,7 @@
 "use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
-import Input from "../Input/Input.mjs";
+import Input from "../base-ui/Input/Input.mjs";
 import { memo, useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { RotateCcw, Save } from "lucide-react";

package/es/EditableText/ControlInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ControlInput.mjs","names":["Flexbox"],"sources":["../../src/EditableText/ControlInput.tsx"],"sourcesContent":["'use client';\n\nimport type { InputRef } from 'antd';\nimport { RotateCcw, Save } from 'lucide-react';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport ActionIcon, { type ActionIconProps } from '@/base-ui/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Input, { type InputProps } from '@/Input';\n\nexport interface ControlInputProps extends Omit<InputProps, 'onChange' | 'value' | 'onAbort'> {\n  onChange?: (value: string) => void;\n  onChangeEnd?: (value: string) => void;\n  onValueChanging?: (value: string) => void;\n  submitIcon?: ActionIconProps['icon'];\n  texts?: {\n    reset?: string;\n    submit?: string;\n  };\n  value?: string;\n}\n\nconst ControlInput = memo<ControlInputProps>(\n  ({\n    value,\n    onChange,\n    onValueChanging,\n    onChangeEnd,\n    onCompositionEnd,\n    onCompositionStart,\n    onPressEnter,\n    onFocus,\n    submitIcon,\n    style,\n    texts,\n    ...rest\n  }) => {\n    const ref = useRef<InputRef>(null);\n    const [input, setInput] = useState<string>(value || '');\n\n    const isChineseInput = useRef(false);\n\n    useEffect(() => {\n      if (value !== undefined) setInput(value);\n    }, [value]);\n\n    const handleUpload = () => {\n      onChange?.(input);\n      ref?.current?.blur();\n      onChangeEnd?.(input);\n    };\n\n    return (\n      <Input\n        autoFocus\n        ref={ref}\n        value={input}\n        style={{\n          width: '100%',\n          ...style,\n        }}\n        suffix={\n          value === input ? (\n            <span />\n          ) : (\n            <Flexbox\n              horizontal\n              gap={2}\n              style={{\n                marginRight: -4,\n                zIndex: 1,\n              }}\n            >\n              <ActionIcon\n                icon={RotateCcw}\n                size=\"small\"\n                title={texts?.reset || 'Reset'}\n                onClick={(e) => {\n                  e.preventDefault();\n                  setInput(value || '');\n                }}\n              />\n              <ActionIcon\n                icon={submitIcon || Save}\n                size=\"small\"\n                title={texts?.submit || 'Submit'}\n                variant={'filled'}\n                onClick={(e) => {\n                  e.preventDefault();\n                  handleUpload();\n                }}\n              />\n            </Flexbox>\n          )\n        }\n        onFocus={onFocus}\n        onChange={(e) => {\n          setInput(e.target.value);\n          onValueChanging?.(e.target.value);\n        }}\n        onCompositionEnd={(e) => {\n          isChineseInput.current = false;\n          onCompositionEnd?.(e);\n        }}\n        onCompositionStart={(e) => {\n          isChineseInput.current = true;\n          onCompositionStart?.(e);\n        }}\n        onPressEnter={(e) => {\n          if (!e.shiftKey && !isChineseInput.current) {\n            e.preventDefault();\n            handleUpload();\n            onPressEnter?.(e);\n          }\n        }}\n        {...rest}\n      />\n    );\n  },\n);\n\nControlInput.displayName = 'ControlInput';\n\nexport default ControlInput;\n"],"mappings":";;;;;;;;AAsBA,MAAM,eAAe,MAClB,EACC,OACA,UACA,iBACA,aACA,kBACA,oBACA,cACA,SACA,YACA,OACA,OACA,GAAG,WACC;CACJ,MAAM,MAAM,OAAiB,IAAI;CACjC,MAAM,CAAC,OAAO,YAAY,SAAiB,SAAS,EAAE;CAEtD,MAAM,iBAAiB,OAAO,KAAK;CAEnC,gBAAgB;EACd,IAAI,UAAU,KAAA,GAAW,SAAS,KAAK;CACzC,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,qBAAqB;EACzB,WAAW,KAAK;EAChB,KAAK,SAAS,KAAK;EACnB,cAAc,KAAK;CACrB;CAEA,OACE,oBAAC,OAAD;EACE,WAAA;EACK;EACL,OAAO;EACP,OAAO;GACL,OAAO;GACP,GAAG;EACL;EACA,QACE,UAAU,QACR,oBAAC,QAAD,CAAO,CAAA,IAEP,qBAACA,mBAAD;GACE,YAAA;GACA,KAAK;GACL,OAAO;IACL,aAAa;IACb,QAAQ;GACV;GANF,UAAA,CAQE,oBAAC,YAAD;IACE,MAAM;IACN,MAAK;IACL,OAAO,OAAO,SAAS;IACvB,UAAU,MAAM;KACd,EAAE,eAAe;KACjB,SAAS,SAAS,EAAE;IACtB;GACD,CAAA,GACD,oBAAC,YAAD;IACE,MAAM,cAAc;IACpB,MAAK;IACL,OAAO,OAAO,UAAU;IACxB,SAAS;IACT,UAAU,MAAM;KACd,EAAE,eAAe;KACjB,aAAa;IACf;GACD,CAAA,CACM;;EAGJ;EACT,WAAW,MAAM;GACf,SAAS,EAAE,OAAO,KAAK;GACvB,kBAAkB,EAAE,OAAO,KAAK;EAClC;EACA,mBAAmB,MAAM;GACvB,eAAe,UAAU;GACzB,mBAAmB,CAAC;EACtB;EACA,qBAAqB,MAAM;GACzB,eAAe,UAAU;GACzB,qBAAqB,CAAC;EACxB;EACA,eAAe,MAAM;GACnB,IAAI,CAAC,EAAE,YAAY,CAAC,eAAe,SAAS;IAC1C,EAAE,eAAe;IACjB,aAAa;IACb,eAAe,CAAC;GAClB;EACF;EACA,GAAI;CACL,CAAA;AAEL,CACF;AAEA,aAAa,cAAc"}
+{"version":3,"file":"ControlInput.mjs","names":["Flexbox"],"sources":["../../src/EditableText/ControlInput.tsx"],"sourcesContent":["'use client';\n\nimport { RotateCcw, Save } from 'lucide-react';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport ActionIcon, { type ActionIconProps } from '@/base-ui/ActionIcon';\nimport { Input, type InputProps } from '@/base-ui/Input';\nimport { Flexbox } from '@/Flex';\n\nexport interface ControlInputProps extends Omit<InputProps, 'onChange' | 'value' | 'onAbort'> {\n  onChange?: (value: string) => void;\n  onChangeEnd?: (value: string) => void;\n  onValueChanging?: (value: string) => void;\n  submitIcon?: ActionIconProps['icon'];\n  texts?: {\n    reset?: string;\n    submit?: string;\n  };\n  value?: string;\n}\n\nconst ControlInput = memo<ControlInputProps>(\n  ({\n    value,\n    onChange,\n    onValueChanging,\n    onChangeEnd,\n    onCompositionEnd,\n    onCompositionStart,\n    onPressEnter,\n    onFocus,\n    submitIcon,\n    style,\n    texts,\n    ...rest\n  }) => {\n    const ref = useRef<HTMLInputElement>(null);\n    const [input, setInput] = useState<string>(value || '');\n\n    const isChineseInput = useRef(false);\n\n    useEffect(() => {\n      if (value !== undefined) setInput(value);\n    }, [value]);\n\n    const handleUpload = () => {\n      onChange?.(input);\n      ref?.current?.blur();\n      onChangeEnd?.(input);\n    };\n\n    return (\n      <Input\n        autoFocus\n        ref={ref}\n        value={input}\n        style={{\n          width: '100%',\n          ...style,\n        }}\n        suffix={\n          value === input ? (\n            <span />\n          ) : (\n            <Flexbox\n              horizontal\n              gap={2}\n              style={{\n                marginRight: -4,\n                zIndex: 1,\n              }}\n            >\n              <ActionIcon\n                icon={RotateCcw}\n                size=\"small\"\n                title={texts?.reset || 'Reset'}\n                onClick={(e) => {\n                  e.preventDefault();\n                  setInput(value || '');\n                }}\n              />\n              <ActionIcon\n                icon={submitIcon || Save}\n                size=\"small\"\n                title={texts?.submit || 'Submit'}\n                variant={'filled'}\n                onClick={(e) => {\n                  e.preventDefault();\n                  handleUpload();\n                }}\n              />\n            </Flexbox>\n          )\n        }\n        onFocus={onFocus}\n        onChange={(e) => {\n          setInput(e.target.value);\n          onValueChanging?.(e.target.value);\n        }}\n        onCompositionEnd={(e) => {\n          isChineseInput.current = false;\n          onCompositionEnd?.(e);\n        }}\n        onCompositionStart={(e) => {\n          isChineseInput.current = true;\n          onCompositionStart?.(e);\n        }}\n        onPressEnter={(e) => {\n          if (!e.shiftKey && !isChineseInput.current) {\n            e.preventDefault();\n            handleUpload();\n            onPressEnter?.(e);\n          }\n        }}\n        {...rest}\n      />\n    );\n  },\n);\n\nControlInput.displayName = 'ControlInput';\n\nexport default ControlInput;\n"],"mappings":";;;;;;;;AAqBA,MAAM,eAAe,MAClB,EACC,OACA,UACA,iBACA,aACA,kBACA,oBACA,cACA,SACA,YACA,OACA,OACA,GAAG,WACC;CACJ,MAAM,MAAM,OAAyB,IAAI;CACzC,MAAM,CAAC,OAAO,YAAY,SAAiB,SAAS,EAAE;CAEtD,MAAM,iBAAiB,OAAO,KAAK;CAEnC,gBAAgB;EACd,IAAI,UAAU,KAAA,GAAW,SAAS,KAAK;CACzC,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,qBAAqB;EACzB,WAAW,KAAK;EAChB,KAAK,SAAS,KAAK;EACnB,cAAc,KAAK;CACrB;CAEA,OACE,oBAAC,OAAD;EACE,WAAA;EACK;EACL,OAAO;EACP,OAAO;GACL,OAAO;GACP,GAAG;EACL;EACA,QACE,UAAU,QACR,oBAAC,QAAD,CAAO,CAAA,IAEP,qBAACA,mBAAD;GACE,YAAA;GACA,KAAK;GACL,OAAO;IACL,aAAa;IACb,QAAQ;GACV;GANF,UAAA,CAQE,oBAAC,YAAD;IACE,MAAM;IACN,MAAK;IACL,OAAO,OAAO,SAAS;IACvB,UAAU,MAAM;KACd,EAAE,eAAe;KACjB,SAAS,SAAS,EAAE;IACtB;GACD,CAAA,GACD,oBAAC,YAAD;IACE,MAAM,cAAc;IACpB,MAAK;IACL,OAAO,OAAO,UAAU;IACxB,SAAS;IACT,UAAU,MAAM;KACd,EAAE,eAAe;KACjB,aAAa;IACf;GACD,CAAA,CACM;;EAGJ;EACT,WAAW,MAAM;GACf,SAAS,EAAE,OAAO,KAAK;GACvB,kBAAkB,EAAE,OAAO,KAAK;EAClC;EACA,mBAAmB,MAAM;GACvB,eAAe,UAAU;GACzB,mBAAmB,CAAC;EACtB;EACA,qBAAqB,MAAM;GACzB,eAAe,UAAU;GACzB,qBAAqB,CAAC;EACxB;EACA,eAAe,MAAM;GACnB,IAAI,CAAC,EAAE,YAAY,CAAC,eAAe,SAAS;IAC1C,EAAE,eAAe;IACjB,aAAa;IACb,eAAe,CAAC;GAClB;EACF;EACA,GAAI;CACL,CAAA;AAEL,CACF;AAEA,aAAa,cAAc"}

package/es/EditableText/EditableText.mjs

@@ -36,6 +36,7 @@ const EditableText = memo(({ value, showEditIcon = true, onChange, editing, onEd
 		variant,
 		style: {
 			height,
+			...size === "small" && { fontSize: 14 },
 			...style,
 			...styles?.input
 		},

package/es/EditableText/EditableText.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EditableText.mjs","names":["useControlledState","Flexbox"],"sources":["../../src/EditableText/EditableText.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Edit3 } from 'lucide-react';\nimport { memo, useMemo } from 'react';\nimport { useHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport { Flexbox } from '@/Flex';\n\nimport ControlInput from './ControlInput';\nimport type { EditableTextProps } from './type';\n\nconst EditableText = memo<EditableTextProps>(\n  ({\n    value,\n    showEditIcon = true,\n    onChange,\n    editing,\n    onEditingChange,\n    onChangeEnd,\n    onFocus,\n    onBlur,\n    className,\n    inputProps,\n    onValueChanging,\n    gap = 8,\n    style,\n    size = 'small',\n    styles,\n    classNames,\n    variant = 'borderless',\n    ...rest\n  }) => {\n    const [edited, setEdited] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    useHotkeys(\n      'esc',\n      () => {\n        setEdited(false);\n      },\n      {\n        enableOnFormTags: true,\n        enabled: edited,\n        preventDefault: true,\n      },\n    );\n\n    const height = useMemo(() => {\n      if (!size) return 32;\n      switch (size) {\n        case 'large': {\n          return 40;\n        }\n        case 'middle': {\n          return 32;\n        }\n        case 'small': {\n          return 24;\n        }\n      }\n    }, [size]);\n\n    const input = (\n      <ControlInput\n        className={cx(className, classNames?.input)}\n        size={size}\n        value={value as string}\n        variant={variant}\n        style={{\n          height,\n          ...style,\n          ...styles?.input,\n        }}\n        onBlur={onBlur}\n        onChange={onChange}\n        onFocus={onFocus}\n        onValueChanging={onValueChanging}\n        onChangeEnd={(v) => {\n          onChangeEnd?.(v);\n          setEdited(false);\n        }}\n        {...inputProps}\n      />\n    );\n\n    const content = (\n      <>\n        <span>{value}</span>\n        {showEditIcon && (\n          <ActionIcon\n            icon={Edit3}\n            size=\"small\"\n            title={'Edit'}\n            onClick={() => {\n              setEdited(!edited);\n            }}\n          />\n        )}\n      </>\n    );\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={cx(className, classNames?.container)}\n        gap={gap}\n        style={{\n          height,\n          width: '100%',\n          ...style,\n          ...styles?.container,\n        }}\n        {...rest}\n      >\n        {edited ? input : content}\n      </Flexbox>\n    );\n  },\n);\n\nEditableText.displayName = 'EditableText';\n\nexport default EditableText;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,eAAe,MAClB,EACC,OACA,eAAe,MACf,UACA,SACA,iBACA,aACA,SACA,QACA,WACA,YACA,iBACA,MAAM,GACN,OACA,OAAO,SACP,QACA,YACA,UAAU,cACV,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAaA,cAAmB,OAAO;EACpD,UAAU;EACV,OAAO;CACT,CAAC;CAED,WACE,aACM;EACJ,UAAU,KAAK;CACjB,GACA;EACE,kBAAkB;EAClB,SAAS;EACT,gBAAgB;CAClB,CACF;CAEA,MAAM,SAAS,cAAc;EAC3B,IAAI,CAAC,MAAM,OAAO;EAClB,QAAQ,MAAR;GACE,KAAK,SACH,OAAO;GAET,KAAK,UACH,OAAO;GAET,KAAK,SACH,OAAO;EAEX;CACF,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,QACJ,oBAAC,cAAD;EACE,WAAW,GAAG,WAAW,YAAY,KAAK;EACpC;EACC;EACE;EACT,OAAO;GACL;GACA,GAAG;GACH,GAAG,QAAQ;EACb;EACQ;EACE;EACD;EACQ;EACjB,cAAc,MAAM;GAClB,cAAc,CAAC;GACf,UAAU,KAAK;EACjB;EACA,GAAI;CACL,CAAA;CAGH,MAAM,UACJ,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA,GAClB,gBACC,oBAAC,YAAD;EACE,MAAM;EACN,MAAK;EACL,OAAO;EACP,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;CACD,CAAA,CAEH,EAAA,CAAA;CAGJ,OACE,oBAACC,mBAAD;EACE,YAAA;EACA,OAAO;EACP,WAAW,GAAG,WAAW,YAAY,SAAS;EACzC;EACL,OAAO;GACL;GACA,OAAO;GACP,GAAG;GACH,GAAG,QAAQ;EACb;EACA,GAAI;EAEH,UAAA,SAAS,QAAQ;CACX,CAAA;AAEb,CACF;AAEA,aAAa,cAAc"}
+{"version":3,"file":"EditableText.mjs","names":["useControlledState","Flexbox"],"sources":["../../src/EditableText/EditableText.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Edit3 } from 'lucide-react';\nimport { memo, useMemo } from 'react';\nimport { useHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport { Flexbox } from '@/Flex';\n\nimport ControlInput from './ControlInput';\nimport type { EditableTextProps } from './type';\n\nconst EditableText = memo<EditableTextProps>(\n  ({\n    value,\n    showEditIcon = true,\n    onChange,\n    editing,\n    onEditingChange,\n    onChangeEnd,\n    onFocus,\n    onBlur,\n    className,\n    inputProps,\n    onValueChanging,\n    gap = 8,\n    style,\n    size = 'small',\n    styles,\n    classNames,\n    variant = 'borderless',\n    ...rest\n  }) => {\n    const [edited, setEdited] = useControlledState(false, {\n      onChange: onEditingChange,\n      value: editing,\n    });\n\n    useHotkeys(\n      'esc',\n      () => {\n        setEdited(false);\n      },\n      {\n        enableOnFormTags: true,\n        enabled: edited,\n        preventDefault: true,\n      },\n    );\n\n    const height = useMemo(() => {\n      if (!size) return 32;\n      switch (size) {\n        case 'large': {\n          return 40;\n        }\n        case 'middle': {\n          return 32;\n        }\n        case 'small': {\n          return 24;\n        }\n      }\n    }, [size]);\n\n    const input = (\n      <ControlInput\n        className={cx(className, classNames?.input)}\n        size={size}\n        value={value as string}\n        variant={variant}\n        style={{\n          height,\n          ...(size === 'small' && { fontSize: 14 }),\n          ...style,\n          ...styles?.input,\n        }}\n        onBlur={onBlur}\n        onChange={onChange}\n        onFocus={onFocus}\n        onValueChanging={onValueChanging}\n        onChangeEnd={(v) => {\n          onChangeEnd?.(v);\n          setEdited(false);\n        }}\n        {...inputProps}\n      />\n    );\n\n    const content = (\n      <>\n        <span>{value}</span>\n        {showEditIcon && (\n          <ActionIcon\n            icon={Edit3}\n            size=\"small\"\n            title={'Edit'}\n            onClick={() => {\n              setEdited(!edited);\n            }}\n          />\n        )}\n      </>\n    );\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={cx(className, classNames?.container)}\n        gap={gap}\n        style={{\n          height,\n          width: '100%',\n          ...style,\n          ...styles?.container,\n        }}\n        {...rest}\n      >\n        {edited ? input : content}\n      </Flexbox>\n    );\n  },\n);\n\nEditableText.displayName = 'EditableText';\n\nexport default EditableText;\n"],"mappings":";;;;;;;;;;;AAcA,MAAM,eAAe,MAClB,EACC,OACA,eAAe,MACf,UACA,SACA,iBACA,aACA,SACA,QACA,WACA,YACA,iBACA,MAAM,GACN,OACA,OAAO,SACP,QACA,YACA,UAAU,cACV,GAAG,WACC;CACJ,MAAM,CAAC,QAAQ,aAAaA,cAAmB,OAAO;EACpD,UAAU;EACV,OAAO;CACT,CAAC;CAED,WACE,aACM;EACJ,UAAU,KAAK;CACjB,GACA;EACE,kBAAkB;EAClB,SAAS;EACT,gBAAgB;CAClB,CACF;CAEA,MAAM,SAAS,cAAc;EAC3B,IAAI,CAAC,MAAM,OAAO;EAClB,QAAQ,MAAR;GACE,KAAK,SACH,OAAO;GAET,KAAK,UACH,OAAO;GAET,KAAK,SACH,OAAO;EAEX;CACF,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,QACJ,oBAAC,cAAD;EACE,WAAW,GAAG,WAAW,YAAY,KAAK;EACpC;EACC;EACE;EACT,OAAO;GACL;GACA,GAAI,SAAS,WAAW,EAAE,UAAU,GAAG;GACvC,GAAG;GACH,GAAG,QAAQ;EACb;EACQ;EACE;EACD;EACQ;EACjB,cAAc,MAAM;GAClB,cAAc,CAAC;GACf,UAAU,KAAK;EACjB;EACA,GAAI;CACL,CAAA;CAGH,MAAM,UACJ,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA,GAClB,gBACC,oBAAC,YAAD;EACE,MAAM;EACN,MAAK;EACL,OAAO;EACP,eAAe;GACb,UAAU,CAAC,MAAM;EACnB;CACD,CAAA,CAEH,EAAA,CAAA;CAGJ,OACE,oBAACC,mBAAD;EACE,YAAA;EACA,OAAO;EACP,WAAW,GAAG,WAAW,YAAY,SAAS;EACzC;EACL,OAAO;GACL;GACA,OAAO;GACP,GAAG;GACH,GAAG,QAAQ;EACb;EACA,GAAI;EAEH,UAAA,SAAS,QAAQ;CACX,CAAA;AAEb,CACF;AAEA,aAAa,cAAc"}

package/es/EditableText/type.d.mts

@@ -3,7 +3,7 @@ import "../Flex/index.mjs";
 import { ControlInputProps } from "./ControlInput.mjs";
 import { CSSProperties } from "react";
 //#region src/EditableText/type.d.ts
-interface EditableTextProps extends Omit<FlexboxProps, 'onChange' | 'onBlur' | 'onFocus'>, Pick<ControlInputProps, 'onChange' | 'value' | 'onChangeEnd' | 'onValueChanging' | 'texts' | 'variant' | 'onBlur' | 'onFocus' | 'size'> {
+interface EditableTextProps extends Omit<FlexboxProps, 'onChange' | 'onBlur' | 'onFocus'>, Pick<ControlInputProps, 'onChange' | 'value' | 'onChangeEnd' | 'onValueChanging' | 'texts' | 'variant' | 'onBlur' | 'onFocus'> {
   className?: string;
   classNames?: {
     container?: string;
@@ -17,6 +17,10 @@ interface EditableTextProps extends Omit<FlexboxProps, 'onChange' | 'onBlur' | '
   inputProps?: Omit<ControlInputProps, 'onChange' | 'value' | 'onChangeEnd' | 'onValueChanging' | 'texts' | 'className' | 'style' | 'onBlur' | 'onFocus' | 'size'>;
   onEditingChange?: (editing: boolean) => void;
   showEditIcon?: boolean;
+  /**
+   * @default 'small'
+   */
+  size?: ControlInputProps['size'];
   style?: CSSProperties;
   styles?: {
     container?: CSSProperties;