@lobehub/ui 5.16.2 → 5.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,6 +2,9 @@ import { ButtonProps } from "./type.mjs";
2
2
  import { FC } from "react";
3
3
 
4
4
  //#region src/Button/Button.d.ts
5
+ /**
6
+ * @deprecated Use `Button` from `@lobehub/ui/base-ui` instead.
7
+ */
5
8
  declare const Button: FC<ButtonProps>;
6
9
  //#endregion
7
10
  export { Button };
@@ -7,6 +7,9 @@ import { Button } from "antd";
7
7
  import { cx, useThemeMode } from "antd-style";
8
8
  import { Loader2Icon } from "lucide-react";
9
9
  //#region src/Button/Button.tsx
10
+ /**
11
+ * @deprecated Use `Button` from `@lobehub/ui/base-ui` instead.
12
+ */
10
13
  const Button$1 = ({ icon, variant, glass, shadow, loading, className, type, color, danger, children, iconProps, ref, ...rest }) => {
11
14
  const { isDarkMode } = useThemeMode();
12
15
  const defaultVariant = type ? void 0 : variant || (isDarkMode ? "filled" : "outlined");
@@ -1 +1 @@
1
- {"version":3,"file":"Button.mjs","names":["Button","AntdButton"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { Button as AntdButton } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { Loader2Icon } from 'lucide-react';\nimport { type FC, isValidElement } from 'react';\n\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport type { ButtonProps } from './type';\n\nconst Button: FC<ButtonProps> = ({\n icon,\n variant,\n glass,\n shadow,\n loading,\n className,\n type,\n color,\n danger,\n children,\n iconProps,\n ref,\n ...rest\n}) => {\n const { isDarkMode } = useThemeMode();\n\n const defaultVariant = type ? undefined : variant || (isDarkMode ? 'filled' : 'outlined');\n\n return (\n <AntdButton\n color={color || (defaultVariant === 'filled' ? 'default' : undefined)}\n danger={danger}\n ref={ref}\n type={type}\n variant={defaultVariant}\n className={cx(\n variants({\n glass,\n shadow,\n }),\n className,\n )}\n icon={\n icon &&\n (isValidElement(icon) ? (\n icon\n ) : (\n <Icon icon={icon} {...iconProps} size={iconProps?.size || { size: '1.2em' }} />\n ))\n }\n loading={\n loading\n ? {\n icon: (\n <Icon\n icon={Loader2Icon}\n {...iconProps}\n spin\n size={iconProps?.size || { size: '1.2em' }}\n />\n ),\n }\n : false\n }\n {...rest}\n >\n {children}\n </AntdButton>\n );\n};\n\nexport default Button;\n"],"mappings":";;;;;;;;;AAYA,MAAMA,YAA2B,EAC/B,MACA,SACA,OACA,QACA,SACA,WACA,MACA,OACA,QACA,UACA,WACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,iBAAiB,OAAO,KAAA,IAAY,YAAY,aAAa,WAAW;AAE9E,QACE,oBAACC,QAAD;EACE,OAAO,UAAU,mBAAmB,WAAW,YAAY,KAAA;EACnD;EACH;EACC;EACN,SAAS;EACT,WAAW,GACT,SAAS;GACP;GACA;GACD,CAAC,EACF,UACD;EACD,MACE,SACC,eAAe,KAAK,GACnB,OAEA,oBAAC,MAAD;GAAY;GAAM,GAAI;GAAW,MAAM,WAAW,QAAQ,EAAE,MAAM,SAAS;GAAI,CAAA;EAGnF,SACE,UACI,EACE,MACE,oBAAC,MAAD;GACE,MAAM;GACN,GAAI;GACJ,MAAA;GACA,MAAM,WAAW,QAAQ,EAAE,MAAM,SAAS;GAC1C,CAAA,EAEL,GACD;EAEN,GAAI;EAEH;EACU,CAAA"}
1
+ {"version":3,"file":"Button.mjs","names":["Button","AntdButton"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["'use client';\n\nimport { Button as AntdButton } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { Loader2Icon } from 'lucide-react';\nimport { type FC, isValidElement } from 'react';\n\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport type { ButtonProps } from './type';\n\n/**\n * @deprecated Use `Button` from `@lobehub/ui/base-ui` instead.\n */\nconst Button: FC<ButtonProps> = ({\n icon,\n variant,\n glass,\n shadow,\n loading,\n className,\n type,\n color,\n danger,\n children,\n iconProps,\n ref,\n ...rest\n}) => {\n const { isDarkMode } = useThemeMode();\n\n const defaultVariant = type ? undefined : variant || (isDarkMode ? 'filled' : 'outlined');\n\n return (\n <AntdButton\n color={color || (defaultVariant === 'filled' ? 'default' : undefined)}\n danger={danger}\n ref={ref}\n type={type}\n variant={defaultVariant}\n className={cx(\n variants({\n glass,\n shadow,\n }),\n className,\n )}\n icon={\n icon &&\n (isValidElement(icon) ? (\n icon\n ) : (\n <Icon icon={icon} {...iconProps} size={iconProps?.size || { size: '1.2em' }} />\n ))\n }\n loading={\n loading\n ? {\n icon: (\n <Icon\n icon={Loader2Icon}\n {...iconProps}\n spin\n size={iconProps?.size || { size: '1.2em' }}\n />\n ),\n }\n : false\n }\n {...rest}\n >\n {children}\n </AntdButton>\n );\n};\n\nexport default Button;\n"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,YAA2B,EAC/B,MACA,SACA,OACA,QACA,SACA,WACA,MACA,OACA,QACA,UACA,WACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,iBAAiB,OAAO,KAAA,IAAY,YAAY,aAAa,WAAW;AAE9E,QACE,oBAACC,QAAD;EACE,OAAO,UAAU,mBAAmB,WAAW,YAAY,KAAA;EACnD;EACH;EACC;EACN,SAAS;EACT,WAAW,GACT,SAAS;GACP;GACA;GACD,CAAC,EACF,UACD;EACD,MACE,SACC,eAAe,KAAK,GACnB,OAEA,oBAAC,MAAD;GAAY;GAAM,GAAI;GAAW,MAAM,WAAW,QAAQ,EAAE,MAAM,SAAS;GAAI,CAAA;EAGnF,SACE,UACI,EACE,MACE,oBAAC,MAAD;GACE,MAAM;GACN,GAAI;GACJ,MAAA;GACA,MAAM,WAAW,QAAQ,EAAE,MAAM,SAAS;GAC1C,CAAA,EAEL,GACD;EAEN,GAAI;EAEH;EACU,CAAA"}
@@ -2,6 +2,9 @@ import { ModalProps } from "./type.mjs";
2
2
  import * as _$react from "react";
3
3
 
4
4
  //#region src/Modal/Modal.d.ts
5
+ /**
6
+ * @deprecated Use `Modal` from `@lobehub/ui/base-ui` instead.
7
+ */
5
8
  declare const Modal: _$react.NamedExoticComponent<ModalProps>;
6
9
  //#endregion
7
10
  export { Modal };
@@ -8,6 +8,9 @@ import { Button, ConfigProvider, Drawer, Modal } from "antd";
8
8
  import { cssVar, cx, useResponsive } from "antd-style";
9
9
  import { Maximize2, Minimize2, X } from "lucide-react";
10
10
  //#region src/Modal/Modal.tsx
11
+ /**
12
+ * @deprecated Use `Modal` from `@lobehub/ui/base-ui` instead.
13
+ */
11
14
  const Modal$1 = memo(({ panelRef, allowFullscreen, children, title = " ", className, classNames, width = 700, onCancel, open, destroyOnHidden, paddings, height = "75dvh", enableResponsive = true, footer, styles: customStyles, okText, onOk, cancelText, okButtonProps, cancelButtonProps, confirmLoading, ...rest }) => {
12
15
  const [fullscreen, setFullscreen] = useState(false);
13
16
  const { mobile } = useResponsive();
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mjs","names":["Modal","AntModal"],"sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { Button, ConfigProvider, Drawer, type DrawerProps,Modal as AntModal } from 'antd';\nimport { cssVar, cx, useResponsive } from 'antd-style';\nimport { Maximize2, Minimize2, X } from 'lucide-react';\nimport { memo, type ReactNode, useState } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport { type ModalProps } from './type';\n\nconst Modal = memo<ModalProps>(\n ({\n panelRef,\n allowFullscreen,\n children,\n title = ' ',\n className,\n classNames,\n width = 700,\n onCancel,\n open,\n destroyOnHidden,\n paddings,\n height = '75dvh',\n enableResponsive = true,\n footer,\n styles: customStyles,\n okText,\n onOk,\n cancelText,\n okButtonProps,\n cancelButtonProps,\n confirmLoading,\n ...rest\n }) => {\n const [fullscreen, setFullscreen] = useState(false);\n const { mobile } = useResponsive();\n const hideFooter = footer === false || footer === null;\n if (enableResponsive && mobile)\n return (\n <ConfigProvider\n theme={{\n token: {\n colorBgElevated: cssVar.colorBgContainer,\n },\n }}\n >\n <Drawer\n className={cx(styles.drawerContent, className)}\n closeIcon={<ActionIcon icon={X} />}\n destroyOnHidden={destroyOnHidden}\n height={fullscreen ? 'calc(100% - env(safe-area-inset-top))' : height}\n open={open}\n panelRef={panelRef}\n placement={'bottom'}\n title={title}\n classNames={\n (typeof classNames === 'function'\n ? classNames\n : {\n ...classNames,\n wrapper: cx(styles.wrap, classNames?.wrapper),\n }) as DrawerProps['classNames']\n }\n extra={\n allowFullscreen && (\n <ActionIcon\n icon={fullscreen ? Minimize2 : Maximize2}\n onClick={() => setFullscreen(!fullscreen)}\n />\n )\n }\n footer={\n hideFooter\n ? null\n : (footer as ReactNode) || (\n <>\n <Button\n color={'default'}\n variant={'filled'}\n onClick={onCancel as any}\n {...cancelButtonProps}\n >\n {cancelText || 'Cancel'}\n </Button>\n <Button\n loading={confirmLoading}\n type=\"primary\"\n onClick={onOk as any}\n {...okButtonProps}\n style={{\n marginInlineStart: 8,\n ...okButtonProps?.style,\n }}\n >\n {okText || 'OK'}\n </Button>\n </>\n )\n }\n styles={\n (typeof customStyles === 'function'\n ? customStyles\n : {\n ...customStyles,\n body: {\n paddingBlock: `16px ${footer ? 0 : '16px'}`,\n paddingInline: paddings?.desktop ?? 16,\n ...customStyles?.body,\n },\n }) as DrawerProps['styles']\n }\n onClose={onCancel as any}\n {...rest}\n >\n {children}\n </Drawer>\n </ConfigProvider>\n );\n\n return (\n <ConfigProvider\n theme={{\n token: {\n colorBgElevated: cssVar.colorBgContainer,\n },\n }}\n >\n <AntModal\n closable\n cancelText={cancelText}\n className={cx(styles.content, className)}\n closeIcon={<Icon icon={X} size={20} />}\n confirmLoading={confirmLoading}\n destroyOnHidden={destroyOnHidden}\n footer={hideFooter ? null : footer}\n mask={{ closable: true }}\n okButtonProps={okButtonProps}\n okText={okText}\n open={open}\n panelRef={panelRef}\n title={title}\n width={width}\n cancelButtonProps={{\n color: 'default',\n variant: 'filled',\n ...cancelButtonProps,\n }}\n classNames={\n typeof classNames === 'function'\n ? classNames\n : {\n ...classNames,\n wrapper: cx(styles.wrap, classNames?.wrapper),\n }\n }\n styles={\n typeof customStyles === 'function'\n ? customStyles\n : {\n ...customStyles,\n body: {\n maxHeight: height,\n overflow: 'hidden auto',\n paddingBlock: `0 ${footer === null ? '16px' : 0}`,\n paddingInline: paddings?.desktop ?? 16,\n ...customStyles?.body,\n },\n }\n }\n onCancel={onCancel}\n onOk={onOk}\n {...rest}\n >\n {children}\n </AntModal>\n </ConfigProvider>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":";;;;;;;;;;AAaA,MAAMA,UAAQ,MACX,EACC,UACA,iBACA,UACA,QAAQ,KACR,WACA,YACA,QAAQ,KACR,UACA,MACA,iBACA,UACA,SAAS,SACT,mBAAmB,MACnB,QACA,QAAQ,cACR,QACA,MACA,YACA,eACA,mBACA,gBACA,GAAG,WACC;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,aAAa,WAAW,SAAS,WAAW;AAClD,KAAI,oBAAoB,OACtB,QACE,oBAAC,gBAAD;EACE,OAAO,EACL,OAAO,EACL,iBAAiB,OAAO,kBACzB,EACF;YAED,oBAAC,QAAD;GACE,WAAW,GAAG,OAAO,eAAe,UAAU;GAC9C,WAAW,oBAAC,YAAD,EAAY,MAAM,GAAK,CAAA;GACjB;GACjB,QAAQ,aAAa,0CAA0C;GACzD;GACI;GACV,WAAW;GACJ;GACP,YACG,OAAO,eAAe,aACnB,aACA;IACE,GAAG;IACH,SAAS,GAAG,OAAO,MAAM,YAAY,QAAQ;IAC9C;GAEP,OACE,mBACE,oBAAC,YAAD;IACE,MAAM,aAAa,YAAY;IAC/B,eAAe,cAAc,CAAC,WAAW;IACzC,CAAA;GAGN,QACE,aACI,OACC,UACC,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;IACE,OAAO;IACP,SAAS;IACT,SAAS;IACT,GAAI;cAEH,cAAc;IACR,CAAA,EACT,oBAAC,QAAD;IACE,SAAS;IACT,MAAK;IACL,SAAS;IACT,GAAI;IACJ,OAAO;KACL,mBAAmB;KACnB,GAAG,eAAe;KACnB;cAEA,UAAU;IACJ,CAAA,CACR,EAAA,CAAA;GAGX,QACG,OAAO,iBAAiB,aACrB,eACA;IACE,GAAG;IACH,MAAM;KACJ,cAAc,QAAQ,SAAS,IAAI;KACnC,eAAe,UAAU,WAAW;KACpC,GAAG,cAAc;KAClB;IACF;GAEP,SAAS;GACT,GAAI;GAEH;GACM,CAAA;EACM,CAAA;AAGrB,QACE,oBAAC,gBAAD;EACE,OAAO,EACL,OAAO,EACL,iBAAiB,OAAO,kBACzB,EACF;YAED,oBAACC,OAAD;GACE,UAAA;GACY;GACZ,WAAW,GAAG,OAAO,SAAS,UAAU;GACxC,WAAW,oBAAC,MAAD;IAAM,MAAM;IAAG,MAAM;IAAM,CAAA;GACtB;GACC;GACjB,QAAQ,aAAa,OAAO;GAC5B,MAAM,EAAE,UAAU,MAAM;GACT;GACP;GACF;GACI;GACH;GACA;GACP,mBAAmB;IACjB,OAAO;IACP,SAAS;IACT,GAAG;IACJ;GACD,YACE,OAAO,eAAe,aAClB,aACA;IACE,GAAG;IACH,SAAS,GAAG,OAAO,MAAM,YAAY,QAAQ;IAC9C;GAEP,QACE,OAAO,iBAAiB,aACpB,eACA;IACE,GAAG;IACH,MAAM;KACJ,WAAW;KACX,UAAU;KACV,cAAc,KAAK,WAAW,OAAO,SAAS;KAC9C,eAAe,UAAU,WAAW;KACpC,GAAG,cAAc;KAClB;IACF;GAEG;GACJ;GACN,GAAI;GAEH;GACQ,CAAA;EACI,CAAA;EAGtB;AAED,QAAM,cAAc"}
1
+ {"version":3,"file":"Modal.mjs","names":["Modal","AntModal"],"sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { Button, ConfigProvider, Drawer, type DrawerProps, Modal as AntModal } from 'antd';\nimport { cssVar, cx, useResponsive } from 'antd-style';\nimport { Maximize2, Minimize2, X } from 'lucide-react';\nimport { memo, type ReactNode, useState } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport { type ModalProps } from './type';\n\n/**\n * @deprecated Use `Modal` from `@lobehub/ui/base-ui` instead.\n */\nconst Modal = memo<ModalProps>(\n ({\n panelRef,\n allowFullscreen,\n children,\n title = ' ',\n className,\n classNames,\n width = 700,\n onCancel,\n open,\n destroyOnHidden,\n paddings,\n height = '75dvh',\n enableResponsive = true,\n footer,\n styles: customStyles,\n okText,\n onOk,\n cancelText,\n okButtonProps,\n cancelButtonProps,\n confirmLoading,\n ...rest\n }) => {\n const [fullscreen, setFullscreen] = useState(false);\n const { mobile } = useResponsive();\n const hideFooter = footer === false || footer === null;\n if (enableResponsive && mobile)\n return (\n <ConfigProvider\n theme={{\n token: {\n colorBgElevated: cssVar.colorBgContainer,\n },\n }}\n >\n <Drawer\n className={cx(styles.drawerContent, className)}\n closeIcon={<ActionIcon icon={X} />}\n destroyOnHidden={destroyOnHidden}\n height={fullscreen ? 'calc(100% - env(safe-area-inset-top))' : height}\n open={open}\n panelRef={panelRef}\n placement={'bottom'}\n title={title}\n classNames={\n (typeof classNames === 'function'\n ? classNames\n : {\n ...classNames,\n wrapper: cx(styles.wrap, classNames?.wrapper),\n }) as DrawerProps['classNames']\n }\n extra={\n allowFullscreen && (\n <ActionIcon\n icon={fullscreen ? Minimize2 : Maximize2}\n onClick={() => setFullscreen(!fullscreen)}\n />\n )\n }\n footer={\n hideFooter\n ? null\n : (footer as ReactNode) || (\n <>\n <Button\n color={'default'}\n variant={'filled'}\n onClick={onCancel as any}\n {...cancelButtonProps}\n >\n {cancelText || 'Cancel'}\n </Button>\n <Button\n loading={confirmLoading}\n type=\"primary\"\n onClick={onOk as any}\n {...okButtonProps}\n style={{\n marginInlineStart: 8,\n ...okButtonProps?.style,\n }}\n >\n {okText || 'OK'}\n </Button>\n </>\n )\n }\n styles={\n (typeof customStyles === 'function'\n ? customStyles\n : {\n ...customStyles,\n body: {\n paddingBlock: `16px ${footer ? 0 : '16px'}`,\n paddingInline: paddings?.desktop ?? 16,\n ...customStyles?.body,\n },\n }) as DrawerProps['styles']\n }\n onClose={onCancel as any}\n {...rest}\n >\n {children}\n </Drawer>\n </ConfigProvider>\n );\n\n return (\n <ConfigProvider\n theme={{\n token: {\n colorBgElevated: cssVar.colorBgContainer,\n },\n }}\n >\n <AntModal\n closable\n cancelText={cancelText}\n className={cx(styles.content, className)}\n closeIcon={<Icon icon={X} size={20} />}\n confirmLoading={confirmLoading}\n destroyOnHidden={destroyOnHidden}\n footer={hideFooter ? null : footer}\n mask={{ closable: true }}\n okButtonProps={okButtonProps}\n okText={okText}\n open={open}\n panelRef={panelRef}\n title={title}\n width={width}\n cancelButtonProps={{\n color: 'default',\n variant: 'filled',\n ...cancelButtonProps,\n }}\n classNames={\n typeof classNames === 'function'\n ? classNames\n : {\n ...classNames,\n wrapper: cx(styles.wrap, classNames?.wrapper),\n }\n }\n styles={\n typeof customStyles === 'function'\n ? customStyles\n : {\n ...customStyles,\n body: {\n maxHeight: height,\n overflow: 'hidden auto',\n paddingBlock: `0 ${footer === null ? '16px' : 0}`,\n paddingInline: paddings?.desktop ?? 16,\n ...customStyles?.body,\n },\n }\n }\n onCancel={onCancel}\n onOk={onOk}\n {...rest}\n >\n {children}\n </AntModal>\n </ConfigProvider>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAMA,UAAQ,MACX,EACC,UACA,iBACA,UACA,QAAQ,KACR,WACA,YACA,QAAQ,KACR,UACA,MACA,iBACA,UACA,SAAS,SACT,mBAAmB,MACnB,QACA,QAAQ,cACR,QACA,MACA,YACA,eACA,mBACA,gBACA,GAAG,WACC;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,aAAa,WAAW,SAAS,WAAW;AAClD,KAAI,oBAAoB,OACtB,QACE,oBAAC,gBAAD;EACE,OAAO,EACL,OAAO,EACL,iBAAiB,OAAO,kBACzB,EACF;YAED,oBAAC,QAAD;GACE,WAAW,GAAG,OAAO,eAAe,UAAU;GAC9C,WAAW,oBAAC,YAAD,EAAY,MAAM,GAAK,CAAA;GACjB;GACjB,QAAQ,aAAa,0CAA0C;GACzD;GACI;GACV,WAAW;GACJ;GACP,YACG,OAAO,eAAe,aACnB,aACA;IACE,GAAG;IACH,SAAS,GAAG,OAAO,MAAM,YAAY,QAAQ;IAC9C;GAEP,OACE,mBACE,oBAAC,YAAD;IACE,MAAM,aAAa,YAAY;IAC/B,eAAe,cAAc,CAAC,WAAW;IACzC,CAAA;GAGN,QACE,aACI,OACC,UACC,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;IACE,OAAO;IACP,SAAS;IACT,SAAS;IACT,GAAI;cAEH,cAAc;IACR,CAAA,EACT,oBAAC,QAAD;IACE,SAAS;IACT,MAAK;IACL,SAAS;IACT,GAAI;IACJ,OAAO;KACL,mBAAmB;KACnB,GAAG,eAAe;KACnB;cAEA,UAAU;IACJ,CAAA,CACR,EAAA,CAAA;GAGX,QACG,OAAO,iBAAiB,aACrB,eACA;IACE,GAAG;IACH,MAAM;KACJ,cAAc,QAAQ,SAAS,IAAI;KACnC,eAAe,UAAU,WAAW;KACpC,GAAG,cAAc;KAClB;IACF;GAEP,SAAS;GACT,GAAI;GAEH;GACM,CAAA;EACM,CAAA;AAGrB,QACE,oBAAC,gBAAD;EACE,OAAO,EACL,OAAO,EACL,iBAAiB,OAAO,kBACzB,EACF;YAED,oBAACC,OAAD;GACE,UAAA;GACY;GACZ,WAAW,GAAG,OAAO,SAAS,UAAU;GACxC,WAAW,oBAAC,MAAD;IAAM,MAAM;IAAG,MAAM;IAAM,CAAA;GACtB;GACC;GACjB,QAAQ,aAAa,OAAO;GAC5B,MAAM,EAAE,UAAU,MAAM;GACT;GACP;GACF;GACI;GACH;GACA;GACP,mBAAmB;IACjB,OAAO;IACP,SAAS;IACT,GAAG;IACJ;GACD,YACE,OAAO,eAAe,aAClB,aACA;IACE,GAAG;IACH,SAAS,GAAG,OAAO,MAAM,YAAY,QAAQ;IAC9C;GAEP,QACE,OAAO,iBAAiB,aACpB,eACA;IACE,GAAG;IACH,MAAM;KACJ,WAAW;KACX,UAAU;KACV,cAAc,KAAK,WAAW,OAAO,SAAS;KAC9C,eAAe,UAAU,WAAW;KACpC,GAAG,cAAc;KAClB;IACF;GAEG;GACJ;GACN,GAAI;GAEH;GACQ,CAAA;EACI,CAAA;EAGtB;AAED,QAAM,cAAc"}
@@ -2,6 +2,9 @@ import { SegmentedProps } from "./type.mjs";
2
2
  import * as _$react from "react";
3
3
 
4
4
  //#region src/Segmented/Segmented.d.ts
5
+ /**
6
+ * @deprecated Use `Segmented` from `@lobehub/ui/base-ui` instead.
7
+ */
5
8
  declare const Segmented: _$react.NamedExoticComponent<SegmentedProps>;
6
9
  //#endregion
7
10
  export { Segmented };
@@ -5,6 +5,9 @@ import { jsx } from "react/jsx-runtime";
5
5
  import { Segmented } from "antd";
6
6
  import { cx } from "antd-style";
7
7
  //#region src/Segmented/Segmented.tsx
8
+ /**
9
+ * @deprecated Use `Segmented` from `@lobehub/ui/base-ui` instead.
10
+ */
8
11
  const Segmented$1 = memo(({ ref, padding, style, className, variant = "filled", shadow, glass, ...rest }) => {
9
12
  return /* @__PURE__ */ jsx(Segmented, {
10
13
  className: cx(variants({
@@ -1 +1 @@
1
- {"version":3,"file":"Segmented.mjs","names":["Segmented","AntdSegmented"],"sources":["../../src/Segmented/Segmented.tsx"],"sourcesContent":["'use client';\n\nimport { Segmented as AntdSegmented } from 'antd';\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { variants } from './style';\nimport type { SegmentedProps } from './type';\n\nconst Segmented = memo<SegmentedProps>(\n ({ ref, padding, style, className, variant = 'filled', shadow, glass, ...rest }) => {\n return (\n <AntdSegmented\n className={cx(variants({ glass, shadow, variant }), className)}\n ref={ref}\n style={{\n padding,\n ...style,\n }}\n {...rest}\n />\n );\n },\n);\n\nSegmented.displayName = 'Segmented';\n\nexport default Segmented;\n"],"mappings":";;;;;;;AASA,MAAMA,cAAY,MACf,EAAE,KAAK,SAAS,OAAO,WAAW,UAAU,UAAU,QAAQ,OAAO,GAAG,WAAW;AAClF,QACE,oBAACC,WAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAO;GAAQ;GAAS,CAAC,EAAE,UAAU;EACzD;EACL,OAAO;GACL;GACA,GAAG;GACJ;EACD,GAAI;EACJ,CAAA;EAGP;AAED,YAAU,cAAc"}
1
+ {"version":3,"file":"Segmented.mjs","names":["Segmented","AntdSegmented"],"sources":["../../src/Segmented/Segmented.tsx"],"sourcesContent":["'use client';\n\nimport { Segmented as AntdSegmented } from 'antd';\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { variants } from './style';\nimport type { SegmentedProps } from './type';\n\n/**\n * @deprecated Use `Segmented` from `@lobehub/ui/base-ui` instead.\n */\nconst Segmented = memo<SegmentedProps>(\n ({ ref, padding, style, className, variant = 'filled', shadow, glass, ...rest }) => {\n return (\n <AntdSegmented\n className={cx(variants({ glass, shadow, variant }), className)}\n ref={ref}\n style={{\n padding,\n ...style,\n }}\n {...rest}\n />\n );\n },\n);\n\nSegmented.displayName = 'Segmented';\n\nexport default Segmented;\n"],"mappings":";;;;;;;;;;AAYA,MAAMA,cAAY,MACf,EAAE,KAAK,SAAS,OAAO,WAAW,UAAU,UAAU,QAAQ,OAAO,GAAG,WAAW;AAClF,QACE,oBAACC,WAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAO;GAAQ;GAAS,CAAC,EAAE,UAAU;EACzD;EACL,OAAO;GACL;GACA,GAAG;GACJ;EACD,GAAI;EACJ,CAAA;EAGP;AAED,YAAU,cAAc"}
@@ -2,6 +2,9 @@ import { TabsProps } from "./type.mjs";
2
2
  import { FC } from "react";
3
3
 
4
4
  //#region src/Tabs/Tabs.d.ts
5
+ /**
6
+ * @deprecated Use `Tabs` from `@lobehub/ui/base-ui` instead.
7
+ */
5
8
  declare const Tabs: FC<TabsProps>;
6
9
  //#endregion
7
10
  export { Tabs };
package/es/Tabs/Tabs.mjs CHANGED
@@ -6,6 +6,9 @@ import { Tabs } from "antd";
6
6
  import { cx } from "antd-style";
7
7
  import { MoreHorizontalIcon } from "lucide-react";
8
8
  //#region src/Tabs/Tabs.tsx
9
+ /**
10
+ * @deprecated Use `Tabs` from `@lobehub/ui/base-ui` instead.
11
+ */
9
12
  const Tabs$1 = ({ className, compact, variant = "rounded", items, classNames, ...rest }) => {
10
13
  const hasContent = items?.some((item) => !!item.children);
11
14
  const popupClassNames = {
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.mjs","names":["Tabs","AntdTabs"],"sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["'use client';\n\nimport { Tabs as AntdTabs } from 'antd';\nimport { cx } from 'antd-style';\nimport { MoreHorizontalIcon } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\n\nimport { styles, variants } from './style';\nimport type { TabsProps } from './type';\n\nconst Tabs: FC<TabsProps> = ({\n className,\n compact,\n variant = 'rounded',\n items,\n classNames,\n ...rest\n}) => {\n const hasContent = items?.some((item) => !!item.children);\n const popupClassNames = {\n root: styles.dropdown,\n ...(typeof classNames === 'function' ? undefined : classNames?.popup),\n };\n const mergedClassNames: TabsProps['classNames'] =\n typeof classNames === 'function'\n ? Object.assign((info: Parameters<typeof classNames>[0]) => classNames(info), {\n popup: popupClassNames,\n })\n : {\n ...classNames,\n popup: popupClassNames,\n };\n\n return (\n <AntdTabs\n className={cx(variants({ compact, underlined: hasContent, variant }), className)}\n items={items}\n {...rest}\n classNames={mergedClassNames}\n more={{\n icon: <ActionIcon icon={MoreHorizontalIcon} />,\n ...rest?.more,\n }}\n />\n );\n};\n\nTabs.displayName = 'Tabs';\n\nexport default Tabs;\n"],"mappings":";;;;;;;;AAYA,MAAMA,UAAuB,EAC3B,WACA,SACA,UAAU,WACV,OACA,YACA,GAAG,WACC;CACJ,MAAM,aAAa,OAAO,MAAM,SAAS,CAAC,CAAC,KAAK,SAAS;CACzD,MAAM,kBAAkB;EACtB,MAAM,OAAO;EACb,GAAI,OAAO,eAAe,aAAa,KAAA,IAAY,YAAY;EAChE;CACD,MAAM,mBACJ,OAAO,eAAe,aAClB,OAAO,QAAQ,SAA2C,WAAW,KAAK,EAAE,EAC1E,OAAO,iBACR,CAAC,GACF;EACE,GAAG;EACH,OAAO;EACR;AAEP,QACE,oBAACC,MAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAS,YAAY;GAAY;GAAS,CAAC,EAAE,UAAU;EACzE;EACP,GAAI;EACJ,YAAY;EACZ,MAAM;GACJ,MAAM,oBAAC,YAAD,EAAY,MAAM,oBAAsB,CAAA;GAC9C,GAAG,MAAM;GACV;EACD,CAAA;;AAIN,OAAK,cAAc"}
1
+ {"version":3,"file":"Tabs.mjs","names":["Tabs","AntdTabs"],"sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["'use client';\n\nimport { Tabs as AntdTabs } from 'antd';\nimport { cx } from 'antd-style';\nimport { MoreHorizontalIcon } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\n\nimport { styles, variants } from './style';\nimport type { TabsProps } from './type';\n\n/**\n * @deprecated Use `Tabs` from `@lobehub/ui/base-ui` instead.\n */\nconst Tabs: FC<TabsProps> = ({\n className,\n compact,\n variant = 'rounded',\n items,\n classNames,\n ...rest\n}) => {\n const hasContent = items?.some((item) => !!item.children);\n const popupClassNames = {\n root: styles.dropdown,\n ...(typeof classNames === 'function' ? undefined : classNames?.popup),\n };\n const mergedClassNames: TabsProps['classNames'] =\n typeof classNames === 'function'\n ? Object.assign((info: Parameters<typeof classNames>[0]) => classNames(info), {\n popup: popupClassNames,\n })\n : {\n ...classNames,\n popup: popupClassNames,\n };\n\n return (\n <AntdTabs\n className={cx(variants({ compact, underlined: hasContent, variant }), className)}\n items={items}\n {...rest}\n classNames={mergedClassNames}\n more={{\n icon: <ActionIcon icon={MoreHorizontalIcon} />,\n ...rest?.more,\n }}\n />\n );\n};\n\nTabs.displayName = 'Tabs';\n\nexport default Tabs;\n"],"mappings":";;;;;;;;;;;AAeA,MAAMA,UAAuB,EAC3B,WACA,SACA,UAAU,WACV,OACA,YACA,GAAG,WACC;CACJ,MAAM,aAAa,OAAO,MAAM,SAAS,CAAC,CAAC,KAAK,SAAS;CACzD,MAAM,kBAAkB;EACtB,MAAM,OAAO;EACb,GAAI,OAAO,eAAe,aAAa,KAAA,IAAY,YAAY;EAChE;CACD,MAAM,mBACJ,OAAO,eAAe,aAClB,OAAO,QAAQ,SAA2C,WAAW,KAAK,EAAE,EAC1E,OAAO,iBACR,CAAC,GACF;EACE,GAAG;EACH,OAAO;EACR;AAEP,QACE,oBAACC,MAAD;EACE,WAAW,GAAG,SAAS;GAAE;GAAS,YAAY;GAAY;GAAS,CAAC,EAAE,UAAU;EACzE;EACP,GAAI;EACJ,YAAY;EACZ,MAAM;GACJ,MAAM,oBAAC,YAAD,EAAY,MAAM,oBAAsB,CAAA;GAC9C,GAAG,MAAM;GACV;EACD,CAAA;;AAIN,OAAK,cAAc"}
@@ -0,0 +1,30 @@
1
+ import { SegmentedProps } from "./type.mjs";
2
+ import * as _$react from "react";
3
+
4
+ //#region src/base-ui/Segmented/Segmented.d.ts
5
+ declare const Segmented: {
6
+ <Value extends string = string>({
7
+ block,
8
+ className,
9
+ classNames,
10
+ defaultValue,
11
+ disabled,
12
+ glass,
13
+ id,
14
+ name,
15
+ onChange,
16
+ options,
17
+ ref,
18
+ shadow,
19
+ size,
20
+ style,
21
+ styles: customStyles,
22
+ value,
23
+ variant,
24
+ vertical
25
+ }: SegmentedProps<Value>): _$react.JSX.Element;
26
+ displayName: string;
27
+ };
28
+ //#endregion
29
+ export { Segmented };
30
+ //# sourceMappingURL=Segmented.d.mts.map
@@ -0,0 +1,109 @@
1
+ "use client";
2
+ import { SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot } from "./atoms.mjs";
3
+ import { useCallback, useEffect, useLayoutEffect, useMemo, useRef } from "react";
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
+ import { cx } from "antd-style";
6
+ import useMergeState from "use-merge-value";
7
+ //#region src/base-ui/Segmented/Segmented.tsx
8
+ const normalizeOption = (option) => typeof option === "string" ? {
9
+ label: option,
10
+ value: option
11
+ } : option;
12
+ const Segmented = ({ block = false, className, classNames, defaultValue, disabled = false, glass = false, id, name, onChange, options, ref, shadow = false, size = "middle", style, styles: customStyles, value, variant = "filled", vertical = false }) => {
13
+ const [innerValue, setInnerValue] = useMergeState(defaultValue, {
14
+ defaultValue,
15
+ onChange: (next) => {
16
+ if (next != null) onChange?.(next);
17
+ },
18
+ value
19
+ });
20
+ const listRef = useRef(null);
21
+ const mergedRef = useCallback((node) => {
22
+ listRef.current = node;
23
+ if (typeof ref === "function") ref(node);
24
+ else if (ref) ref.current = node;
25
+ }, [ref]);
26
+ const normalizedOptions = useMemo(() => (options ?? []).map((o) => normalizeOption(o)), [options]);
27
+ const updateIndicator = useCallback(() => {
28
+ const list = listRef.current;
29
+ if (!list) return;
30
+ const active = list.querySelector("[data-segmented-item][data-pressed]");
31
+ if (!active) {
32
+ list.style.setProperty("--active-item-width", "0px");
33
+ list.style.setProperty("--active-item-height", "0px");
34
+ return;
35
+ }
36
+ list.style.setProperty("--active-item-left", `${active.offsetLeft}px`);
37
+ list.style.setProperty("--active-item-top", `${active.offsetTop}px`);
38
+ list.style.setProperty("--active-item-width", `${active.offsetWidth}px`);
39
+ list.style.setProperty("--active-item-height", `${active.offsetHeight}px`);
40
+ }, []);
41
+ useLayoutEffect(() => {
42
+ updateIndicator();
43
+ }, [
44
+ innerValue,
45
+ normalizedOptions,
46
+ vertical,
47
+ size,
48
+ block,
49
+ updateIndicator
50
+ ]);
51
+ useEffect(() => {
52
+ const list = listRef.current;
53
+ if (!list || typeof ResizeObserver === "undefined") return;
54
+ const ro = new ResizeObserver(() => updateIndicator());
55
+ ro.observe(list);
56
+ return () => ro.disconnect();
57
+ }, [updateIndicator]);
58
+ const groupValue = useMemo(() => innerValue != null ? [innerValue] : [], [innerValue]);
59
+ const rootStyle = {
60
+ ...style,
61
+ ...customStyles?.root
62
+ };
63
+ return /* @__PURE__ */ jsxs(SegmentedRoot, {
64
+ block,
65
+ className: cx(classNames?.root, className),
66
+ disabled,
67
+ glass,
68
+ id,
69
+ orientation: vertical ? "vertical" : "horizontal",
70
+ ref: mergedRef,
71
+ shadow,
72
+ style: rootStyle,
73
+ value: groupValue,
74
+ variant,
75
+ onValueChange: (next) => {
76
+ const picked = next[0];
77
+ if (picked != null) setInnerValue(picked);
78
+ },
79
+ children: [/* @__PURE__ */ jsx(SegmentedIndicator, {
80
+ className: classNames?.indicator,
81
+ style: customStyles?.indicator
82
+ }), normalizedOptions.map((opt) => /* @__PURE__ */ jsxs(SegmentedItem, {
83
+ "aria-label": typeof opt.label === "string" ? opt.label : void 0,
84
+ block,
85
+ className: cx(classNames?.item, opt.className),
86
+ "data-segmented-item": "",
87
+ disabled: disabled || opt.disabled,
88
+ name,
89
+ size,
90
+ style: customStyles?.item,
91
+ title: opt.title,
92
+ value: opt.value,
93
+ children: [opt.icon != null && /* @__PURE__ */ jsx(SegmentedItemIcon, {
94
+ className: classNames?.itemIcon,
95
+ style: customStyles?.itemIcon,
96
+ children: opt.icon
97
+ }), opt.label != null && /* @__PURE__ */ jsx(SegmentedItemLabel, {
98
+ className: classNames?.itemLabel,
99
+ style: customStyles?.itemLabel,
100
+ children: opt.label
101
+ })]
102
+ }, opt.value))]
103
+ });
104
+ };
105
+ Segmented.displayName = "Segmented";
106
+ //#endregion
107
+ export { Segmented as default };
108
+
109
+ //# sourceMappingURL=Segmented.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Segmented.mjs","names":["useControlledState"],"sources":["../../../src/base-ui/Segmented/Segmented.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport {\n type CSSProperties,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n} from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport {\n SegmentedIndicator,\n SegmentedItem,\n SegmentedItemIcon,\n SegmentedItemLabel,\n SegmentedRoot,\n} from './atoms';\nimport type { SegmentedOption, SegmentedProps } from './type';\n\nconst normalizeOption = <Value extends string>(\n option: SegmentedOption<Value> | Value,\n): SegmentedOption<Value> =>\n typeof option === 'string' ? { label: option, value: option } : option;\n\nconst Segmented = <Value extends string = string>({\n block = false,\n className,\n classNames,\n defaultValue,\n disabled = false,\n glass = false,\n id,\n name,\n onChange,\n options,\n ref,\n shadow = false,\n size = 'middle',\n style,\n styles: customStyles,\n value,\n variant = 'filled',\n vertical = false,\n}: SegmentedProps<Value>) => {\n const [innerValue, setInnerValue] = useControlledState<Value | undefined>(defaultValue, {\n defaultValue,\n onChange: (next) => {\n if (next != null) onChange?.(next);\n },\n value,\n });\n\n const listRef = useRef<HTMLDivElement | null>(null);\n\n const mergedRef = useCallback(\n (node: HTMLDivElement | null) => {\n listRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) (ref as React.RefObject<HTMLDivElement | null>).current = node;\n },\n [ref],\n );\n\n const normalizedOptions = useMemo(\n () => (options ?? []).map((o) => normalizeOption<Value>(o)),\n [options],\n );\n\n const updateIndicator = useCallback(() => {\n const list = listRef.current;\n if (!list) return;\n const active = list.querySelector<HTMLElement>('[data-segmented-item][data-pressed]');\n if (!active) {\n list.style.setProperty('--active-item-width', '0px');\n list.style.setProperty('--active-item-height', '0px');\n return;\n }\n list.style.setProperty('--active-item-left', `${active.offsetLeft}px`);\n list.style.setProperty('--active-item-top', `${active.offsetTop}px`);\n list.style.setProperty('--active-item-width', `${active.offsetWidth}px`);\n list.style.setProperty('--active-item-height', `${active.offsetHeight}px`);\n }, []);\n\n useLayoutEffect(() => {\n updateIndicator();\n }, [innerValue, normalizedOptions, vertical, size, block, updateIndicator]);\n\n useEffect(() => {\n const list = listRef.current;\n if (!list || typeof ResizeObserver === 'undefined') return;\n const ro = new ResizeObserver(() => updateIndicator());\n ro.observe(list);\n return () => ro.disconnect();\n }, [updateIndicator]);\n\n const groupValue = useMemo<Value[]>(() => (innerValue != null ? [innerValue] : []), [innerValue]);\n\n const rootStyle: CSSProperties = { ...style, ...customStyles?.root };\n\n return (\n <SegmentedRoot<Value>\n block={block}\n className={cx(classNames?.root, className)}\n disabled={disabled}\n glass={glass}\n id={id}\n orientation={vertical ? 'vertical' : 'horizontal'}\n ref={mergedRef}\n shadow={shadow}\n style={rootStyle}\n value={groupValue}\n variant={variant}\n onValueChange={(next) => {\n const picked = next[0];\n if (picked != null) setInnerValue(picked);\n }}\n >\n <SegmentedIndicator className={classNames?.indicator} style={customStyles?.indicator} />\n {normalizedOptions.map((opt) => (\n <SegmentedItem<Value>\n aria-label={typeof opt.label === 'string' ? opt.label : undefined}\n block={block}\n className={cx(classNames?.item, opt.className)}\n data-segmented-item=\"\"\n disabled={disabled || opt.disabled}\n key={opt.value}\n name={name}\n size={size}\n style={customStyles?.item}\n title={opt.title}\n value={opt.value}\n >\n {opt.icon != null && (\n <SegmentedItemIcon className={classNames?.itemIcon} style={customStyles?.itemIcon}>\n {opt.icon}\n </SegmentedItemIcon>\n )}\n {opt.label != null && (\n <SegmentedItemLabel className={classNames?.itemLabel} style={customStyles?.itemLabel}>\n {opt.label}\n </SegmentedItemLabel>\n )}\n </SegmentedItem>\n ))}\n </SegmentedRoot>\n );\n};\n\nSegmented.displayName = 'Segmented';\n\nexport default Segmented;\n"],"mappings":";;;;;;;AAsBA,MAAM,mBACJ,WAEA,OAAO,WAAW,WAAW;CAAE,OAAO;CAAQ,OAAO;CAAQ,GAAG;AAElE,MAAM,aAA4C,EAChD,QAAQ,OACR,WACA,YACA,cACA,WAAW,OACX,QAAQ,OACR,IACA,MACA,UACA,SACA,KACA,SAAS,OACT,OAAO,UACP,OACA,QAAQ,cACR,OACA,UAAU,UACV,WAAW,YACgB;CAC3B,MAAM,CAAC,YAAY,iBAAiBA,cAAsC,cAAc;EACtF;EACA,WAAW,SAAS;AAClB,OAAI,QAAQ,KAAM,YAAW,KAAK;;EAEpC;EACD,CAAC;CAEF,MAAM,UAAU,OAA8B,KAAK;CAEnD,MAAM,YAAY,aACf,SAAgC;AAC/B,UAAQ,UAAU;AAClB,MAAI,OAAO,QAAQ,WAAY,KAAI,KAAK;WAC/B,IAAM,KAA+C,UAAU;IAE1E,CAAC,IAAI,CACN;CAED,MAAM,oBAAoB,eACjB,WAAW,EAAE,EAAE,KAAK,MAAM,gBAAuB,EAAE,CAAC,EAC3D,CAAC,QAAQ,CACV;CAED,MAAM,kBAAkB,kBAAkB;EACxC,MAAM,OAAO,QAAQ;AACrB,MAAI,CAAC,KAAM;EACX,MAAM,SAAS,KAAK,cAA2B,sCAAsC;AACrF,MAAI,CAAC,QAAQ;AACX,QAAK,MAAM,YAAY,uBAAuB,MAAM;AACpD,QAAK,MAAM,YAAY,wBAAwB,MAAM;AACrD;;AAEF,OAAK,MAAM,YAAY,sBAAsB,GAAG,OAAO,WAAW,IAAI;AACtE,OAAK,MAAM,YAAY,qBAAqB,GAAG,OAAO,UAAU,IAAI;AACpE,OAAK,MAAM,YAAY,uBAAuB,GAAG,OAAO,YAAY,IAAI;AACxE,OAAK,MAAM,YAAY,wBAAwB,GAAG,OAAO,aAAa,IAAI;IACzE,EAAE,CAAC;AAEN,uBAAsB;AACpB,mBAAiB;IAChB;EAAC;EAAY;EAAmB;EAAU;EAAM;EAAO;EAAgB,CAAC;AAE3E,iBAAgB;EACd,MAAM,OAAO,QAAQ;AACrB,MAAI,CAAC,QAAQ,OAAO,mBAAmB,YAAa;EACpD,MAAM,KAAK,IAAI,qBAAqB,iBAAiB,CAAC;AACtD,KAAG,QAAQ,KAAK;AAChB,eAAa,GAAG,YAAY;IAC3B,CAAC,gBAAgB,CAAC;CAErB,MAAM,aAAa,cAAwB,cAAc,OAAO,CAAC,WAAW,GAAG,EAAE,EAAG,CAAC,WAAW,CAAC;CAEjG,MAAM,YAA2B;EAAE,GAAG;EAAO,GAAG,cAAc;EAAM;AAEpE,QACE,qBAAC,eAAD;EACS;EACP,WAAW,GAAG,YAAY,MAAM,UAAU;EAChC;EACH;EACH;EACJ,aAAa,WAAW,aAAa;EACrC,KAAK;EACG;EACR,OAAO;EACP,OAAO;EACE;EACT,gBAAgB,SAAS;GACvB,MAAM,SAAS,KAAK;AACpB,OAAI,UAAU,KAAM,eAAc,OAAO;;YAd7C,CAiBE,oBAAC,oBAAD;GAAoB,WAAW,YAAY;GAAW,OAAO,cAAc;GAAa,CAAA,EACvF,kBAAkB,KAAK,QACtB,qBAAC,eAAD;GACE,cAAY,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,KAAA;GACjD;GACP,WAAW,GAAG,YAAY,MAAM,IAAI,UAAU;GAC9C,uBAAoB;GACpB,UAAU,YAAY,IAAI;GAEpB;GACA;GACN,OAAO,cAAc;GACrB,OAAO,IAAI;GACX,OAAO,IAAI;aAXb,CAaG,IAAI,QAAQ,QACX,oBAAC,mBAAD;IAAmB,WAAW,YAAY;IAAU,OAAO,cAAc;cACtE,IAAI;IACa,CAAA,EAErB,IAAI,SAAS,QACZ,oBAAC,oBAAD;IAAoB,WAAW,YAAY;IAAW,OAAO,cAAc;cACxE,IAAI;IACc,CAAA,CAET;KAjBT,IAAI,MAiBK,CAChB,CACY;;;AAIpB,UAAU,cAAc"}
@@ -0,0 +1,54 @@
1
+ import { SegmentedSize, SegmentedVariant } from "./type.mjs";
2
+ import * as _$react from "react";
3
+ import { CSSProperties, ComponentProps, FC, ReactNode } from "react";
4
+ import { Toggle } from "@base-ui/react/toggle";
5
+ import { ToggleGroup } from "@base-ui/react/toggle-group";
6
+
7
+ //#region src/base-ui/Segmented/atoms.d.ts
8
+ type SegmentedRootProps<Value extends string = string> = Omit<ComponentProps<typeof ToggleGroup<Value>>, 'className' | 'render'> & {
9
+ block?: boolean;
10
+ className?: string;
11
+ glass?: boolean;
12
+ shadow?: boolean;
13
+ variant?: SegmentedVariant;
14
+ };
15
+ declare const SegmentedRoot: {
16
+ <Value extends string = string>({
17
+ block,
18
+ className,
19
+ glass,
20
+ shadow,
21
+ variant,
22
+ ...rest
23
+ }: SegmentedRootProps<Value>): _$react.JSX.Element;
24
+ displayName: string;
25
+ };
26
+ type SegmentedItemProps<Value extends string = string> = Omit<ComponentProps<typeof Toggle<Value>>, 'className' | 'render'> & {
27
+ block?: boolean;
28
+ className?: string;
29
+ size?: SegmentedSize;
30
+ };
31
+ declare const SegmentedItem: {
32
+ <Value extends string = string>({
33
+ block,
34
+ className,
35
+ size,
36
+ ...rest
37
+ }: SegmentedItemProps<Value>): _$react.JSX.Element;
38
+ displayName: string;
39
+ };
40
+ interface SimpleSpanProps {
41
+ children?: ReactNode;
42
+ className?: string;
43
+ style?: CSSProperties;
44
+ }
45
+ declare const SegmentedItemIcon: FC<SimpleSpanProps>;
46
+ declare const SegmentedItemLabel: FC<SimpleSpanProps>;
47
+ interface SegmentedIndicatorProps {
48
+ className?: string;
49
+ style?: CSSProperties;
50
+ }
51
+ declare const SegmentedIndicator: FC<SegmentedIndicatorProps>;
52
+ //#endregion
53
+ export { SegmentedIndicator, SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedItemProps, SegmentedRoot, SegmentedRootProps };
54
+ //# sourceMappingURL=atoms.d.mts.map
@@ -0,0 +1,51 @@
1
+ "use client";
2
+ import { itemVariants, listVariants, styles } from "./style.mjs";
3
+ import { jsx } from "react/jsx-runtime";
4
+ import { cx } from "antd-style";
5
+ import { Toggle } from "@base-ui/react/toggle";
6
+ import { ToggleGroup } from "@base-ui/react/toggle-group";
7
+ //#region src/base-ui/Segmented/atoms.tsx
8
+ const SegmentedRoot = ({ block = false, className, glass = false, shadow = false, variant = "filled", ...rest }) => {
9
+ return /* @__PURE__ */ jsx(ToggleGroup, {
10
+ className: cx(listVariants({
11
+ block,
12
+ glass,
13
+ shadow,
14
+ variant
15
+ }), className),
16
+ ...rest
17
+ });
18
+ };
19
+ SegmentedRoot.displayName = "SegmentedRoot";
20
+ const SegmentedItem = ({ block = false, className, size = "middle", ...rest }) => {
21
+ return /* @__PURE__ */ jsx(Toggle, {
22
+ className: cx(itemVariants({
23
+ block,
24
+ size
25
+ }), className),
26
+ ...rest
27
+ });
28
+ };
29
+ SegmentedItem.displayName = "SegmentedItem";
30
+ const SegmentedItemIcon = ({ children, className, style }) => /* @__PURE__ */ jsx("span", {
31
+ className: cx(styles.itemIcon, className),
32
+ style,
33
+ children
34
+ });
35
+ SegmentedItemIcon.displayName = "SegmentedItemIcon";
36
+ const SegmentedItemLabel = ({ children, className, style }) => /* @__PURE__ */ jsx("span", {
37
+ className: cx(styles.itemLabel, className),
38
+ style,
39
+ children
40
+ });
41
+ SegmentedItemLabel.displayName = "SegmentedItemLabel";
42
+ const SegmentedIndicator = ({ className, style }) => /* @__PURE__ */ jsx("span", {
43
+ "aria-hidden": true,
44
+ className: cx(styles.indicator, className),
45
+ style
46
+ });
47
+ SegmentedIndicator.displayName = "SegmentedIndicator";
48
+ //#endregion
49
+ export { SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot };
50
+
51
+ //# sourceMappingURL=atoms.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"atoms.mjs","names":["BaseUIToggleGroup","BaseUIToggle"],"sources":["../../../src/base-ui/Segmented/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Toggle as BaseUIToggle } from '@base-ui/react/toggle';\nimport { ToggleGroup as BaseUIToggleGroup } from '@base-ui/react/toggle-group';\nimport { cx } from 'antd-style';\nimport { type ComponentProps, type CSSProperties, type FC, type ReactNode } from 'react';\n\nimport { itemVariants, listVariants, styles } from './style';\nimport type { SegmentedSize, SegmentedVariant } from './type';\n\nexport type SegmentedRootProps<Value extends string = string> = Omit<\n ComponentProps<typeof BaseUIToggleGroup<Value>>,\n 'className' | 'render'\n> & {\n block?: boolean;\n className?: string;\n glass?: boolean;\n shadow?: boolean;\n variant?: SegmentedVariant;\n};\n\nexport const SegmentedRoot = <Value extends string = string>({\n block = false,\n className,\n glass = false,\n shadow = false,\n variant = 'filled',\n ...rest\n}: SegmentedRootProps<Value>) => {\n return (\n <BaseUIToggleGroup<Value>\n className={cx(listVariants({ block, glass, shadow, variant }), className)}\n {...rest}\n />\n );\n};\n\nSegmentedRoot.displayName = 'SegmentedRoot';\n\nexport type SegmentedItemProps<Value extends string = string> = Omit<\n ComponentProps<typeof BaseUIToggle<Value>>,\n 'className' | 'render'\n> & {\n block?: boolean;\n className?: string;\n size?: SegmentedSize;\n};\n\nexport const SegmentedItem = <Value extends string = string>({\n block = false,\n className,\n size = 'middle',\n ...rest\n}: SegmentedItemProps<Value>) => {\n return <BaseUIToggle<Value> className={cx(itemVariants({ block, size }), className)} {...rest} />;\n};\n\nSegmentedItem.displayName = 'SegmentedItem';\n\ninterface SimpleSpanProps {\n children?: ReactNode;\n className?: string;\n style?: CSSProperties;\n}\n\nexport const SegmentedItemIcon: FC<SimpleSpanProps> = ({ children, className, style }) => (\n <span className={cx(styles.itemIcon, className)} style={style}>\n {children}\n </span>\n);\nSegmentedItemIcon.displayName = 'SegmentedItemIcon';\n\nexport const SegmentedItemLabel: FC<SimpleSpanProps> = ({ children, className, style }) => (\n <span className={cx(styles.itemLabel, className)} style={style}>\n {children}\n </span>\n);\nSegmentedItemLabel.displayName = 'SegmentedItemLabel';\n\nexport interface SegmentedIndicatorProps {\n className?: string;\n style?: CSSProperties;\n}\n\nexport const SegmentedIndicator: FC<SegmentedIndicatorProps> = ({ className, style }) => (\n <span aria-hidden className={cx(styles.indicator, className)} style={style} />\n);\nSegmentedIndicator.displayName = 'SegmentedIndicator';\n"],"mappings":";;;;;;;AAqBA,MAAa,iBAAgD,EAC3D,QAAQ,OACR,WACA,QAAQ,OACR,SAAS,OACT,UAAU,UACV,GAAG,WAC4B;AAC/B,QACE,oBAACA,aAAD;EACE,WAAW,GAAG,aAAa;GAAE;GAAO;GAAO;GAAQ;GAAS,CAAC,EAAE,UAAU;EACzE,GAAI;EACJ,CAAA;;AAIN,cAAc,cAAc;AAW5B,MAAa,iBAAgD,EAC3D,QAAQ,OACR,WACA,OAAO,UACP,GAAG,WAC4B;AAC/B,QAAO,oBAACC,QAAD;EAAqB,WAAW,GAAG,aAAa;GAAE;GAAO;GAAM,CAAC,EAAE,UAAU;EAAE,GAAI;EAAQ,CAAA;;AAGnG,cAAc,cAAc;AAQ5B,MAAa,qBAA0C,EAAE,UAAU,WAAW,YAC5E,oBAAC,QAAD;CAAM,WAAW,GAAG,OAAO,UAAU,UAAU;CAAS;CACrD;CACI,CAAA;AAET,kBAAkB,cAAc;AAEhC,MAAa,sBAA2C,EAAE,UAAU,WAAW,YAC7E,oBAAC,QAAD;CAAM,WAAW,GAAG,OAAO,WAAW,UAAU;CAAS;CACtD;CACI,CAAA;AAET,mBAAmB,cAAc;AAOjC,MAAa,sBAAmD,EAAE,WAAW,YAC3E,oBAAC,QAAD;CAAM,eAAA;CAAY,WAAW,GAAG,OAAO,WAAW,UAAU;CAAS;CAAS,CAAA;AAEhF,mBAAmB,cAAc"}
@@ -0,0 +1,3 @@
1
+ import { SegmentedClassNames, SegmentedOption, SegmentedOptions, SegmentedOrientation, SegmentedProps, SegmentedSize, SegmentedStyles, SegmentedVariant } from "./type.mjs";
2
+ import { SegmentedIndicator, SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedItemProps, SegmentedRoot, SegmentedRootProps } from "./atoms.mjs";
3
+ import { Segmented } from "./Segmented.mjs";
@@ -0,0 +1,202 @@
1
+ import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
2
+ import { createStaticStyles } from "antd-style";
3
+ import { cva } from "class-variance-authority";
4
+ //#region src/base-ui/Segmented/style.ts
5
+ const styles = createStaticStyles(({ css, cssVar }) => ({
6
+ indicator: css`
7
+ pointer-events: none;
8
+
9
+ position: absolute;
10
+ z-index: 0;
11
+ inset-block-start: var(--active-item-top);
12
+ inset-inline-start: var(--active-item-left);
13
+
14
+ width: var(--active-item-width);
15
+ height: var(--active-item-height);
16
+ border-radius: ${cssVar.borderRadius};
17
+
18
+ background: ${cssVar.colorBgElevated};
19
+ box-shadow: ${cssVar.boxShadowTertiary};
20
+
21
+ transition-timing-function: ${cssVar.motionEaseOut};
22
+ transition-duration: 240ms;
23
+ transition-property: inset-inline-start, inset-block-start, width, height;
24
+
25
+ @media (prefers-reduced-motion: reduce) {
26
+ transition-duration: 0s;
27
+ }
28
+ `,
29
+ item: css`
30
+ cursor: pointer;
31
+ user-select: none;
32
+
33
+ position: relative;
34
+ z-index: 1;
35
+
36
+ display: inline-flex;
37
+ flex-shrink: 0;
38
+ gap: 6px;
39
+ align-items: center;
40
+ justify-content: center;
41
+
42
+ box-sizing: border-box;
43
+ border: 0;
44
+
45
+ font-weight: 500;
46
+ color: ${cssVar.colorTextSecondary};
47
+ white-space: nowrap;
48
+
49
+ background: transparent;
50
+ outline: none;
51
+
52
+ transition:
53
+ color 120ms ${cssVar.motionEaseOut},
54
+ transform 120ms ${cssVar.motionEaseOut};
55
+
56
+ &:hover:not([data-disabled], [data-pressed]) {
57
+ color: ${cssVar.colorText};
58
+ }
59
+
60
+ &:active:not([data-disabled]) {
61
+ transform: scale(0.98);
62
+ }
63
+
64
+ &:focus-visible {
65
+ border-radius: ${cssVar.borderRadius};
66
+ outline: 2px solid ${cssVar.colorPrimaryBorder};
67
+ outline-offset: -2px;
68
+ }
69
+
70
+ &[data-pressed] {
71
+ color: ${cssVar.colorText};
72
+ }
73
+
74
+ &[data-disabled] {
75
+ cursor: not-allowed;
76
+ color: ${cssVar.colorTextDisabled};
77
+ }
78
+
79
+ @media (prefers-reduced-motion: reduce) {
80
+ transition-duration: 0s;
81
+ }
82
+ `,
83
+ itemBlock: css`
84
+ flex: 1 1 0;
85
+ `,
86
+ itemIcon: css`
87
+ display: inline-flex;
88
+ align-items: center;
89
+ justify-content: center;
90
+ `,
91
+ itemLabel: css`
92
+ display: inline-flex;
93
+ align-items: center;
94
+ `,
95
+ itemLarge: css`
96
+ height: 36px;
97
+ padding-inline: 16px;
98
+ border-radius: ${cssVar.borderRadius};
99
+ font-size: 14px;
100
+ `,
101
+ itemMiddle: css`
102
+ height: 32px;
103
+ padding-inline: 12px;
104
+ border-radius: ${cssVar.borderRadius};
105
+ font-size: 13px;
106
+ `,
107
+ itemSmall: css`
108
+ height: 26px;
109
+ padding-inline: 10px;
110
+ border-radius: ${cssVar.borderRadius};
111
+ font-size: 12px;
112
+ `,
113
+ list: css`
114
+ position: relative;
115
+
116
+ display: inline-flex;
117
+ flex-wrap: nowrap;
118
+ gap: 4px;
119
+ align-items: center;
120
+ align-self: flex-start;
121
+
122
+ box-sizing: border-box;
123
+ padding: 3px;
124
+ border-radius: ${cssVar.borderRadiusLG};
125
+
126
+ &[data-orientation='vertical'] {
127
+ flex-direction: column;
128
+ align-items: stretch;
129
+ align-self: stretch;
130
+ }
131
+ `,
132
+ listBlock: css`
133
+ display: flex;
134
+ align-self: stretch;
135
+ width: 100%;
136
+ `,
137
+ listFilled: css`
138
+ border: 1px solid ${cssVar.colorFillQuaternary};
139
+ background: ${cssVar.colorFillTertiary};
140
+ `,
141
+ listGlass: staticStylish.blur,
142
+ listOutlined: css`
143
+ border: 1px solid ${cssVar.colorBorderSecondary};
144
+ background: transparent;
145
+ `,
146
+ listShadow: staticStylish.shadow,
147
+ root: css`
148
+ display: inline-flex;
149
+
150
+ &[data-block='true'] {
151
+ display: flex;
152
+ width: 100%;
153
+ }
154
+ `
155
+ }));
156
+ const listVariants = cva(styles.list, {
157
+ defaultVariants: {
158
+ block: false,
159
+ glass: false,
160
+ shadow: false,
161
+ variant: "filled"
162
+ },
163
+ variants: {
164
+ block: {
165
+ false: null,
166
+ true: styles.listBlock
167
+ },
168
+ glass: {
169
+ false: null,
170
+ true: styles.listGlass
171
+ },
172
+ shadow: {
173
+ false: null,
174
+ true: styles.listShadow
175
+ },
176
+ variant: {
177
+ filled: styles.listFilled,
178
+ outlined: styles.listOutlined
179
+ }
180
+ }
181
+ });
182
+ const itemVariants = cva(styles.item, {
183
+ defaultVariants: {
184
+ block: false,
185
+ size: "middle"
186
+ },
187
+ variants: {
188
+ block: {
189
+ false: null,
190
+ true: styles.itemBlock
191
+ },
192
+ size: {
193
+ large: styles.itemLarge,
194
+ middle: styles.itemMiddle,
195
+ small: styles.itemSmall
196
+ }
197
+ }
198
+ });
199
+ //#endregion
200
+ export { itemVariants, listVariants, styles };
201
+
202
+ //# sourceMappingURL=style.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Segmented/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n indicator: css`\n pointer-events: none;\n\n position: absolute;\n z-index: 0;\n inset-block-start: var(--active-item-top);\n inset-inline-start: var(--active-item-left);\n\n width: var(--active-item-width);\n height: var(--active-item-height);\n border-radius: ${cssVar.borderRadius};\n\n background: ${cssVar.colorBgElevated};\n box-shadow: ${cssVar.boxShadowTertiary};\n\n transition-timing-function: ${cssVar.motionEaseOut};\n transition-duration: 240ms;\n transition-property: inset-inline-start, inset-block-start, width, height;\n\n @media (prefers-reduced-motion: reduce) {\n transition-duration: 0s;\n }\n `,\n item: css`\n cursor: pointer;\n user-select: none;\n\n position: relative;\n z-index: 1;\n\n display: inline-flex;\n flex-shrink: 0;\n gap: 6px;\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n border: 0;\n\n font-weight: 500;\n color: ${cssVar.colorTextSecondary};\n white-space: nowrap;\n\n background: transparent;\n outline: none;\n\n transition:\n color 120ms ${cssVar.motionEaseOut},\n transform 120ms ${cssVar.motionEaseOut};\n\n &:hover:not([data-disabled], [data-pressed]) {\n color: ${cssVar.colorText};\n }\n\n &:active:not([data-disabled]) {\n transform: scale(0.98);\n }\n\n &:focus-visible {\n border-radius: ${cssVar.borderRadius};\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: -2px;\n }\n\n &[data-pressed] {\n color: ${cssVar.colorText};\n }\n\n &[data-disabled] {\n cursor: not-allowed;\n color: ${cssVar.colorTextDisabled};\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition-duration: 0s;\n }\n `,\n itemBlock: css`\n flex: 1 1 0;\n `,\n itemIcon: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n `,\n itemLabel: css`\n display: inline-flex;\n align-items: center;\n `,\n itemLarge: css`\n height: 36px;\n padding-inline: 16px;\n border-radius: ${cssVar.borderRadius};\n font-size: 14px;\n `,\n itemMiddle: css`\n height: 32px;\n padding-inline: 12px;\n border-radius: ${cssVar.borderRadius};\n font-size: 13px;\n `,\n itemSmall: css`\n height: 26px;\n padding-inline: 10px;\n border-radius: ${cssVar.borderRadius};\n font-size: 12px;\n `,\n list: css`\n position: relative;\n\n display: inline-flex;\n flex-wrap: nowrap;\n gap: 4px;\n align-items: center;\n align-self: flex-start;\n\n box-sizing: border-box;\n padding: 3px;\n border-radius: ${cssVar.borderRadiusLG};\n\n &[data-orientation='vertical'] {\n flex-direction: column;\n align-items: stretch;\n align-self: stretch;\n }\n `,\n listBlock: css`\n display: flex;\n align-self: stretch;\n width: 100%;\n `,\n listFilled: css`\n border: 1px solid ${cssVar.colorFillQuaternary};\n background: ${cssVar.colorFillTertiary};\n `,\n listGlass: lobeStaticStylish.blur,\n listOutlined: css`\n border: 1px solid ${cssVar.colorBorderSecondary};\n background: transparent;\n `,\n listShadow: lobeStaticStylish.shadow,\n root: css`\n display: inline-flex;\n\n &[data-block='true'] {\n display: flex;\n width: 100%;\n }\n `,\n}));\n\nexport const listVariants = cva(styles.list, {\n defaultVariants: {\n block: false,\n glass: false,\n shadow: false,\n variant: 'filled',\n },\n variants: {\n block: {\n false: null,\n true: styles.listBlock,\n },\n glass: {\n false: null,\n true: styles.listGlass,\n },\n shadow: {\n false: null,\n true: styles.listShadow,\n },\n variant: {\n filled: styles.listFilled,\n outlined: styles.listOutlined,\n },\n },\n});\n\nexport const itemVariants = cva(styles.item, {\n defaultVariants: {\n block: false,\n size: 'middle',\n },\n variants: {\n block: {\n false: null,\n true: styles.itemBlock,\n },\n size: {\n large: styles.itemLarge,\n middle: styles.itemMiddle,\n small: styles.itemSmall,\n },\n },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,WAAW,GAAG;;;;;;;;;;qBAUK,OAAO,aAAa;;kBAEvB,OAAO,gBAAgB;kBACvB,OAAO,kBAAkB;;kCAET,OAAO,cAAc;;;;;;;;CAQrD,MAAM,GAAG;;;;;;;;;;;;;;;;;aAiBE,OAAO,mBAAmB;;;;;;;oBAOnB,OAAO,cAAc;wBACjB,OAAO,cAAc;;;eAG9B,OAAO,UAAU;;;;;;;;uBAQT,OAAO,aAAa;2BAChB,OAAO,mBAAmB;;;;;eAKtC,OAAO,UAAU;;;;;eAKjB,OAAO,kBAAkB;;;;;;;CAOtC,WAAW,GAAG;;;CAGd,UAAU,GAAG;;;;;CAKb,WAAW,GAAG;;;;CAId,WAAW,GAAG;;;qBAGK,OAAO,aAAa;;;CAGvC,YAAY,GAAG;;;qBAGI,OAAO,aAAa;;;CAGvC,WAAW,GAAG;;;qBAGK,OAAO,aAAa;;;CAGvC,MAAM,GAAG;;;;;;;;;;;qBAWU,OAAO,eAAe;;;;;;;;CAQzC,WAAW,GAAG;;;;;CAKd,YAAY,GAAG;wBACO,OAAO,oBAAoB;kBACjC,OAAO,kBAAkB;;CAEzC,WAAWA,cAAkB;CAC7B,cAAc,GAAG;wBACK,OAAO,qBAAqB;;;CAGlD,YAAYA,cAAkB;CAC9B,MAAM,GAAG;;;;;;;;CAQV,EAAE;AAEH,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB;EACf,OAAO;EACP,OAAO;EACP,QAAQ;EACR,SAAS;EACV;CACD,UAAU;EACR,OAAO;GACL,OAAO;GACP,MAAM,OAAO;GACd;EACD,OAAO;GACL,OAAO;GACP,MAAM,OAAO;GACd;EACD,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;GACd;EACD,SAAS;GACP,QAAQ,OAAO;GACf,UAAU,OAAO;GAClB;EACF;CACF,CAAC;AAEF,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB;EACf,OAAO;EACP,MAAM;EACP;CACD,UAAU;EACR,OAAO;GACL,OAAO;GACP,MAAM,OAAO;GACd;EACD,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,OAAO,OAAO;GACf;EACF;CACF,CAAC"}
@@ -0,0 +1,55 @@
1
+ import { CSSProperties, ComponentProps, ReactNode, Ref } from "react";
2
+ import { ToggleGroup } from "@base-ui/react/toggle-group";
3
+
4
+ //#region src/base-ui/Segmented/type.d.ts
5
+ type SegmentedSize = 'large' | 'middle' | 'small';
6
+ type SegmentedVariant = 'filled' | 'outlined';
7
+ type SegmentedOrientation = 'horizontal' | 'vertical';
8
+ interface SegmentedOption<Value extends string = string> {
9
+ className?: string;
10
+ disabled?: boolean;
11
+ icon?: ReactNode;
12
+ label?: ReactNode;
13
+ title?: string;
14
+ value: Value;
15
+ }
16
+ type SegmentedOptions<Value extends string = string> = Array<SegmentedOption<Value> | Value>;
17
+ interface SegmentedClassNames {
18
+ indicator?: string;
19
+ item?: string;
20
+ itemIcon?: string;
21
+ itemLabel?: string;
22
+ list?: string;
23
+ root?: string;
24
+ }
25
+ interface SegmentedStyles {
26
+ indicator?: CSSProperties;
27
+ item?: CSSProperties;
28
+ itemIcon?: CSSProperties;
29
+ itemLabel?: CSSProperties;
30
+ list?: CSSProperties;
31
+ root?: CSSProperties;
32
+ }
33
+ interface SegmentedProps<Value extends string = string> {
34
+ block?: boolean;
35
+ className?: string;
36
+ classNames?: SegmentedClassNames;
37
+ defaultValue?: Value;
38
+ disabled?: boolean;
39
+ glass?: boolean;
40
+ id?: string;
41
+ name?: string;
42
+ onChange?: (value: Value) => void;
43
+ options?: SegmentedOptions<Value>;
44
+ ref?: Ref<HTMLDivElement>;
45
+ shadow?: boolean;
46
+ size?: SegmentedSize;
47
+ style?: CSSProperties;
48
+ styles?: SegmentedStyles;
49
+ value?: Value;
50
+ variant?: SegmentedVariant;
51
+ vertical?: boolean;
52
+ }
53
+ //#endregion
54
+ export { SegmentedClassNames, SegmentedOption, SegmentedOptions, SegmentedOrientation, SegmentedProps, SegmentedSize, SegmentedStyles, SegmentedVariant };
55
+ //# sourceMappingURL=type.d.mts.map
@@ -33,6 +33,9 @@ import { BaseModalProps, ImperativeModalProps, ModalComponentProps, ModalConfirm
33
33
  import { ModalContext, useModalContext } from "./Modal/context.mjs";
34
34
  import { ModalHost, ModalHostProps, ModalSystem, confirmModal, createModal, createModalSystem } from "./Modal/imperative.mjs";
35
35
  import { Modal } from "./Modal/Modal.mjs";
36
+ import { SegmentedClassNames, SegmentedOption, SegmentedOptions, SegmentedOrientation, SegmentedProps, SegmentedSize, SegmentedStyles, SegmentedVariant } from "./Segmented/type.mjs";
37
+ import { SegmentedIndicator, SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedItemProps, SegmentedRoot, SegmentedRootProps } from "./Segmented/atoms.mjs";
38
+ import { Segmented } from "./Segmented/Segmented.mjs";
36
39
  import { SelectBehaviorVariant, SelectClassNames, SelectIndicatorVariant, SelectOption, SelectOptionGroup, SelectOptions, SelectProps, SelectRootChangeEventDetails, SelectSize, SelectVariant } from "./Select/type.mjs";
37
40
  import { SelectArrow, SelectArrowProps, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectIcon, SelectIconProps, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectList, SelectListProps, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectRoot, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectSeparator, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps } from "./Select/atoms.mjs";
38
41
  import { Select } from "./Select/Select.mjs";
@@ -44,4 +47,4 @@ import { TabsClassNames, TabsIndicatorProps, TabsItem, TabsListProps, TabsOrient
44
47
  import { styles as styles$2 } from "./Tabs/style.mjs";
45
48
  import { TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, useTabsContext } from "./Tabs/atoms.mjs";
46
49
  import { Tabs } from "./Tabs/Tabs.mjs";
47
- export { BaseModalProps, Button, ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuItem, ContextMenuTrigger, DropdownItem, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuCheckboxItemProps, DropdownMenuFooter, DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuGroupLabelProps, DropdownMenuHeader, DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemContentProps, DropdownMenuItemDesc, DropdownMenuItemDescProps, DropdownMenuItemExtra, DropdownMenuItemExtraProps, DropdownMenuItemIcon, DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuItemLabelGroupProps, DropdownMenuItemLabelProps, DropdownMenuItemProps, DropdownMenuPlacement, DropdownMenuPopup, DropdownMenuPopupProps, DropdownMenuPortal, DropdownMenuPortalProps, DropdownMenuPositioner, DropdownMenuPositionerProps, DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuScrollViewportProps, DropdownMenuSeparator, DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, DropdownMenuSwitchItemProps, DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, DropdownMenuTriggerProps, FloatingSheet, FloatingSheetProps, IconSpaceMode, ImperativeModalProps, Modal, ModalBackdrop, ModalBackdropProps, ModalClose, ModalCloseProps, ModalComponentProps, ModalConfirmConfig, ModalContent, ModalContentProps, ModalContext, ModalContextValue, ModalDescription, ModalDescriptionProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalHost, ModalHostProps, ModalInstance, ModalPopup, ModalPopupProps, ModalPortal, ModalPortalProps, ModalRoot, ModalRootProps, ModalSystem, ModalTitle, ModalTitleProps, ModalTrigger, ModalTriggerProps, ModalViewport, ModalViewportProps, PopoverArrow, PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, PopoverBackdropProps, PopoverContextValue, PopoverGroup, PopoverPlacement, PopoverPopup, PopoverPopupAtomProps, PopoverPopupProps, PopoverPortal, PopoverPortalAtomProps, PopoverPortalProps, PopoverPositioner, PopoverPositionerAtomProps, PopoverPositionerProps, PopoverProps, PopoverProvider, PopoverRoot, PopoverTrigger, PopoverTriggerComponentProps, PopoverTriggerElement, PopoverTriggerElementProps, PopoverViewport, PopoverViewportAtomProps, ScrollArea, ScrollAreaContent, ScrollAreaContentProps, ScrollAreaCorner, ScrollAreaCornerProps, ScrollAreaProps, ScrollAreaRoot, ScrollAreaRootProps, ScrollAreaScrollbar, ScrollAreaScrollbarProps, ScrollAreaThumb, ScrollAreaThumbProps, ScrollAreaViewport, ScrollAreaViewportProps, Select, SelectArrow, SelectArrowProps, SelectBackdrop, SelectBehaviorVariant, SelectClassNames, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectIcon, SelectIconProps, SelectIndicatorVariant, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectList, SelectListProps, SelectOption, SelectOptionGroup, SelectOptions, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectProps, SelectRoot, SelectRootChangeEventDetails, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectSeparator, SelectSize, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps, SelectVariant, Switch, SwitchChangeEventHandler, SwitchClassNames, SwitchClickEventHandler, SwitchContextType, SwitchIcon, SwitchIconPosition, SwitchIconProps, SwitchProps, SwitchRoot, SwitchRootProps, SwitchSize, SwitchStyles, SwitchThumb, SwitchThumbProps, Tabs, TabsClassNames, TabsIndicator, TabsIndicatorProps, TabsItem, TabsList, TabsListProps, TabsOrientation, TabsPanel, TabsPanelProps, TabsProps, TabsRoot, TabsRootProps, TabsSize, TabsStyles, TabsTab, TabsTabProps, TabsVariant, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, Tooltip, TooltipGroup, TooltipGroupProps, TooltipPlacement, TooltipPopupComponentProps, TooltipPortalProps, TooltipPositionerProps, TooltipProps, TooltipTriggerComponentProps, backdropTransition, styles as buttonStyles, closeContextMenu, confirmModal, createModal, createModalSystem, modalMotionConfig, parseTrigger, renderDropdownMenuItems, showContextMenu, styles$1 as switchStyles, styles$2 as tabsStyles, toast, updateContextMenuItems, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
50
+ export { BaseModalProps, Button, ButtonIconPosition, ButtonProps, ButtonShape, ButtonSize, ButtonType, type ContextMenuCheckboxItem, ContextMenuHost, type ContextMenuItem, ContextMenuTrigger, DropdownItem, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuCheckboxItemProps, DropdownMenuFooter, DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuGroupLabelProps, DropdownMenuHeader, DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemContentProps, DropdownMenuItemDesc, DropdownMenuItemDescProps, DropdownMenuItemExtra, DropdownMenuItemExtraProps, DropdownMenuItemIcon, DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuItemLabelGroupProps, DropdownMenuItemLabelProps, DropdownMenuItemProps, DropdownMenuPlacement, DropdownMenuPopup, DropdownMenuPopupProps, DropdownMenuPortal, DropdownMenuPortalProps, DropdownMenuPositioner, DropdownMenuPositionerProps, DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuScrollViewportProps, DropdownMenuSeparator, DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, DropdownMenuSwitchItemProps, DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, DropdownMenuTriggerProps, FloatingSheet, FloatingSheetProps, IconSpaceMode, ImperativeModalProps, Modal, ModalBackdrop, ModalBackdropProps, ModalClose, ModalCloseProps, ModalComponentProps, ModalConfirmConfig, ModalContent, ModalContentProps, ModalContext, ModalContextValue, ModalDescription, ModalDescriptionProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalHost, ModalHostProps, ModalInstance, ModalPopup, ModalPopupProps, ModalPortal, ModalPortalProps, ModalRoot, ModalRootProps, ModalSystem, ModalTitle, ModalTitleProps, ModalTrigger, ModalTriggerProps, ModalViewport, ModalViewportProps, PopoverArrow, PopoverArrowAtomProps, PopoverArrowIcon, PopoverBackdrop, PopoverBackdropProps, PopoverContextValue, PopoverGroup, PopoverPlacement, PopoverPopup, PopoverPopupAtomProps, PopoverPopupProps, PopoverPortal, PopoverPortalAtomProps, PopoverPortalProps, PopoverPositioner, PopoverPositionerAtomProps, PopoverPositionerProps, PopoverProps, PopoverProvider, PopoverRoot, PopoverTrigger, PopoverTriggerComponentProps, PopoverTriggerElement, PopoverTriggerElementProps, PopoverViewport, PopoverViewportAtomProps, ScrollArea, ScrollAreaContent, ScrollAreaContentProps, ScrollAreaCorner, ScrollAreaCornerProps, ScrollAreaProps, ScrollAreaRoot, ScrollAreaRootProps, ScrollAreaScrollbar, ScrollAreaScrollbarProps, ScrollAreaThumb, ScrollAreaThumbProps, ScrollAreaViewport, ScrollAreaViewportProps, Segmented, SegmentedClassNames, SegmentedIndicator, SegmentedIndicatorProps, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedItemProps, SegmentedOption, SegmentedOptions, SegmentedOrientation, SegmentedProps, SegmentedRoot, SegmentedRootProps, SegmentedSize, SegmentedStyles, SegmentedVariant, Select, SelectArrow, SelectArrowProps, SelectBackdrop, SelectBehaviorVariant, SelectClassNames, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectIcon, SelectIconProps, SelectIndicatorVariant, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectList, SelectListProps, SelectOption, SelectOptionGroup, SelectOptions, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectProps, SelectRoot, SelectRootChangeEventDetails, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectSeparator, SelectSize, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps, SelectVariant, Switch, SwitchChangeEventHandler, SwitchClassNames, SwitchClickEventHandler, SwitchContextType, SwitchIcon, SwitchIconPosition, SwitchIconProps, SwitchProps, SwitchRoot, SwitchRootProps, SwitchSize, SwitchStyles, SwitchThumb, SwitchThumbProps, Tabs, TabsClassNames, TabsIndicator, TabsIndicatorProps, TabsItem, TabsList, TabsListProps, TabsOrientation, TabsPanel, TabsPanelProps, TabsProps, TabsRoot, TabsRootProps, TabsSize, TabsStyles, TabsTab, TabsTabProps, TabsVariant, type ToastAPI, ToastHost, type ToastHostProps, type ToastInstance, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastProps, type ToastType, Tooltip, TooltipGroup, TooltipGroupProps, TooltipPlacement, TooltipPopupComponentProps, TooltipPortalProps, TooltipPositionerProps, TooltipProps, TooltipTriggerComponentProps, backdropTransition, styles as buttonStyles, closeContextMenu, confirmModal, createModal, createModalSystem, modalMotionConfig, parseTrigger, renderDropdownMenuItems, showContextMenu, styles$1 as switchStyles, styles$2 as tabsStyles, toast, updateContextMenuItems, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
@@ -26,9 +26,11 @@ import { ModalBackdrop, ModalClose, ModalContent, ModalDescription, ModalFooter,
26
26
  import { ModalContext, useModalContext } from "./Modal/context.mjs";
27
27
  import { ModalHost, confirmModal, createModal, createModalSystem } from "./Modal/imperative.mjs";
28
28
  import Modal from "./Modal/Modal.mjs";
29
+ import { SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot } from "./Segmented/atoms.mjs";
30
+ import Segmented from "./Segmented/Segmented.mjs";
29
31
  import { SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue } from "./Select/atoms.mjs";
30
32
  import Select from "./Select/Select.mjs";
31
33
  import { styles as styles$2 } from "./Tabs/style.mjs";
32
34
  import { TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, useTabsContext } from "./Tabs/atoms.mjs";
33
35
  import Tabs from "./Tabs/Tabs.mjs";
34
- export { Button, ContextMenuHost, ContextMenuTrigger, DropdownMenu, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger, FloatingSheet, Modal, ModalBackdrop, ModalClose, ModalContent, ModalContext, ModalDescription, ModalFooter, ModalHeader, ModalHost, ModalPopup, ModalPortal, ModalRoot, ModalTitle, ModalTrigger, ModalViewport, PopoverArrow, PopoverArrowIcon, PopoverBackdrop, PopoverGroup, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverProvider, PopoverRoot, PopoverTriggerElement, PopoverViewport, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaRoot, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaViewport, Select, SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, ToastHost, Tooltip, TooltipGroup, backdropTransition, styles as buttonStyles, closeContextMenu, confirmModal, createModal, createModalSystem, modalMotionConfig, parseTrigger, renderDropdownMenuItems, showContextMenu, styles$1 as switchStyles, styles$2 as tabsStyles, toast, updateContextMenuItems, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
36
+ export { Button, ContextMenuHost, ContextMenuTrigger, DropdownMenu, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger, FloatingSheet, Modal, ModalBackdrop, ModalClose, ModalContent, ModalContext, ModalDescription, ModalFooter, ModalHeader, ModalHost, ModalPopup, ModalPortal, ModalRoot, ModalTitle, ModalTrigger, ModalViewport, PopoverArrow, PopoverArrowIcon, PopoverBackdrop, PopoverGroup, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverProvider, PopoverRoot, PopoverTriggerElement, PopoverViewport, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaRoot, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaViewport, Segmented, SegmentedIndicator, SegmentedItem, SegmentedItemIcon, SegmentedItemLabel, SegmentedRoot, Select, SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue, Switch, SwitchIcon, SwitchRoot, SwitchThumb, Tabs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, ToastHost, Tooltip, TooltipGroup, backdropTransition, styles as buttonStyles, closeContextMenu, confirmModal, createModal, createModalSystem, modalMotionConfig, parseTrigger, renderDropdownMenuItems, showContextMenu, styles$1 as switchStyles, styles$2 as tabsStyles, toast, updateContextMenuItems, useModalActions, useModalContext, useModalOpen, usePopoverContext, usePopoverPortalContainer, useSwitchContext, useTabsContext, useToast };
@@ -0,0 +1,26 @@
1
+ //#region src/eslint/index.d.ts
2
+ declare const restrictedImports: {
3
+ rules: {
4
+ 'no-restricted-imports': (string | {
5
+ paths: {
6
+ importNames: string[];
7
+ message: string;
8
+ name: string;
9
+ }[];
10
+ })[];
11
+ };
12
+ };
13
+ declare const _default: {
14
+ rules: {
15
+ 'no-restricted-imports': (string | {
16
+ paths: {
17
+ importNames: string[];
18
+ message: string;
19
+ name: string;
20
+ }[];
21
+ })[];
22
+ };
23
+ }[];
24
+ //#endregion
25
+ export { _default as default, restrictedImports };
26
+ //# sourceMappingURL=index.d.mts.map
@@ -0,0 +1 @@
1
+ export * from './index.d.mts';
@@ -0,0 +1 @@
1
+ export * from './index.mjs';
@@ -0,0 +1,20 @@
1
+ const restrictedImports = { rules: { "no-restricted-imports": ["error", { paths: [{
2
+ importNames: [
3
+ "Button",
4
+ "Modal",
5
+ "Segmented",
6
+ "Select",
7
+ "Tabs"
8
+ ],
9
+ message: "The antd-based wrapper is deprecated. Import from \"@lobehub/ui/base-ui\" instead.",
10
+ name: "@lobehub/ui"
11
+ }, {
12
+ importNames: ["createStyles"],
13
+ message: "`createStyles` is banned in this project. Use `createStaticStyles` from \"antd-style\" instead.",
14
+ name: "antd-style"
15
+ }] }] } };
16
+ var eslint_default = [restrictedImports];
17
+ //#endregion
18
+ export { eslint_default as default, restrictedImports };
19
+
20
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../../src/eslint/index.ts"],"sourcesContent":["const DEPRECATED_UI_COMPONENTS = ['Button', 'Modal', 'Segmented', 'Select', 'Tabs'];\n\nexport const restrictedImports = {\n rules: {\n 'no-restricted-imports': [\n 'error',\n {\n paths: [\n {\n importNames: DEPRECATED_UI_COMPONENTS,\n message:\n 'The antd-based wrapper is deprecated. Import from \"@lobehub/ui/base-ui\" instead.',\n name: '@lobehub/ui',\n },\n {\n importNames: ['createStyles'],\n message:\n '`createStyles` is banned in this project. Use `createStaticStyles` from \"antd-style\" instead.',\n name: 'antd-style',\n },\n ],\n },\n ],\n },\n};\n\nexport default [restrictedImports];\n"],"mappings":"AAEA,MAAa,oBAAoB,EAC/B,OAAO,EACL,yBAAyB,CACvB,SACA,EACE,OAAO,CACL;CACE,aAAa;EATS;EAAU;EAAS;EAAa;EAAU;EASnD;CACb,SACE;CACF,MAAM;CACP,EACD;CACE,aAAa,CAAC,eAAe;CAC7B,SACE;CACF,MAAM;CACP,CACF,EACF,CACF,EACF,EACF;AAED,IAAA,iBAAe,CAAC,kBAAkB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/ui",
3
- "version": "5.16.2",
3
+ "version": "5.17.1",
4
4
  "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
5
5
  "keywords": [
6
6
  "lobehub",
@@ -77,6 +77,10 @@
77
77
  "types": "./es/base-ui/index.d.mts",
78
78
  "import": "./es/base-ui/index.mjs"
79
79
  },
80
+ "./eslint": {
81
+ "types": "./es/eslint/index.d.mts",
82
+ "import": "./es/eslint/index.mjs"
83
+ },
80
84
  "./es/*": {
81
85
  "types": "./es/*.d.mts",
82
86
  "import": "./es/*.mjs"