@lobehub/ui 5.57.2 → 6.0.0-beta.1

package/es/awesome/landingActions.mjs

@@ -1,88 +1,33 @@
+import { styleProps } from "../styles/stylex/props.mjs";
 import Icon from "../Icon/Icon.mjs";
 import { isExternalHref, renderLandingLink } from "./landingLink.mjs";
 import BottomGradientButton from "./BottomGradientButton/BottomGradientButton.mjs";
-import { accentGradient } from "./landingTokens.mjs";
 import { Fragment } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { createStaticStyles, cx } from "antd-style";
+import clsx from "clsx";
 //#region src/awesome/landingActions.tsx
-const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
-	action: css`
-    display: inline-flex;
-    gap: 8px;
-    align-items: center;
-    justify-content: center;
-
-    min-block-size: 44px;
-    padding-block: 0;
-    padding-inline: 22px;
-    border: 1px solid transparent;
-    border-radius: 999px;
-
-    font-size: ${cssVar.fontSize};
-    font-weight: 600;
-    color: ${cssVar.colorText};
-    text-decoration: none;
-    white-space: nowrap;
-
-    background-image:
-      linear-gradient(${cssVar.colorBgContainer}, ${cssVar.colorBgContainer}), ${accentGradient};
-    background-clip: padding-box, border-box;
-    background-origin: border-box;
-
-    transition:
-      filter 140ms ease,
-      transform 90ms ease;
-
-    &:hover {
-      color: ${cssVar.colorText};
-      filter: brightness(1.06);
-    }
-
-    &:active {
-      transform: scale(0.97);
-    }
-  `,
-	actionPrimary: css`
-    && {
-      color: ${cssVar.colorBgContainer};
-      background: ${cssVar.colorText};
-    }
-
-    &&:hover {
-      color: ${cssVar.colorBgContainer};
-    }
-  `,
-	actionSmall: css`
-    && {
-      gap: 6px;
-      min-block-size: 34px;
-      padding-inline: 14px;
-      font-size: ${cssVar.fontSizeSM};
-    }
-  `,
-	group: css`
-    display: flex;
-    flex-wrap: wrap;
-    gap: 12px;
-
-    &[data-size='small'] {
-      gap: 8px;
-    }
-
-    ${responsive.mobile} {
-      &[data-size='large'] {
-        align-self: stretch;
-      }
-
-      &[data-size='large'] > * {
-        flex: 1;
-      }
-    }
-  `
-}));
-const LandingActions = ({ actions, className, onNavigate, renderLink, size = "large" }) => /* @__PURE__ */ jsx("div", {
-	className: cx(styles.group, className),
+const styles = {
+	group: {
+		kOIVth: "lb1v2ro7d",
+		k1xSpc: "lb78zum5",
+		kwnvtZ: "lb1a02dak",
+		$$css: true
+	},
+	groupLarge: {
+		kSGwAc: "lb1mdmdwu",
+		$$css: true
+	},
+	groupSmall: {
+		kOIVth: "lb167g77z",
+		$$css: true
+	}
+};
+const LandingActions = ({ actions, className, onNavigate, renderLink, size = "large", xstyle }) => /* @__PURE__ */ jsx("div", {
+	...styleProps([
+		styles.group,
+		size === "small" ? styles.groupSmall : styles.groupLarge,
+		xstyle
+	], clsx("lobe-landing-actions", className)),
 	"data-size": size,
 	children: actions.map(({ external, href, icon, iconPlacement = "start", label, primary }) => {
 		const iconNode = icon && /* @__PURE__ */ jsx(Icon, {
@@ -111,7 +56,10 @@ const LandingActions = ({ actions, className, onNavigate, renderLink, size = "la
 				label,
 				iconPlacement === "end" && iconNode
 			] }),
-			className: cx(styles.action, styles.actionPrimary, size === "small" && styles.actionSmall),
+			className: {
+				0: { className: "lb167g77z lb9r1u3d lb1e6avla lb1y0btm7 lbmkeg23 lbt970qd lb65v0h lb1p61ccd lb6s0dn4 lbuzaq58 lb1y38k7b lb3nfvp2 lb1ohlld9 lb1pzwcx8 lb1s688f lbl56j7k lb1gg8mnh lb1hl2dhg lbd3so5o lbuxw1ft" },
+				1: { className: "lb9r1u3d lb1e6avla lb1y0btm7 lbmkeg23 lbt970qd lb1p61ccd lb6s0dn4 lbuzaq58 lb1y38k7b lb3nfvp2 lb1ohlld9 lb1s688f lbl56j7k lb1hl2dhg lbd3so5o lbuxw1ft lb17d4w8g lbqin4a2 lbxobqjj lbu97haq" }
+			}[!!(size === "small") << 0].className,
 			external,
 			href
 		}) }, href);

package/es/awesome/landingActions.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"landingActions.mjs","names":[],"sources":["../../src/awesome/landingActions.tsx"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { Fragment, type ReactNode } from 'react';\n\nimport BottomGradientButton from '@/awesome/BottomGradientButton';\nimport { isExternalHref, type LandingLinkRender, renderLandingLink } from '@/awesome/landingLink';\nimport { accentGradient } from '@/awesome/landingTokens';\nimport Icon, { type IconProps } from '@/Icon';\n\nexport interface LandingAction {\n  /** Opens in a new tab. Inferred from absolute URLs when omitted. */\n  external?: boolean;\n  href: string;\n  icon?: IconProps['icon'];\n  /** Places the icon after the label, e.g. for an arrow. */\n  iconPlacement?: 'start' | 'end';\n  label: ReactNode;\n  /** The primary action is a filled pill; others render as BottomGradientButton. */\n  primary?: boolean;\n}\n\nconst styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  action: css`\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n    justify-content: center;\n\n    min-block-size: 44px;\n    padding-block: 0;\n    padding-inline: 22px;\n    border: 1px solid transparent;\n    border-radius: 999px;\n\n    font-size: ${cssVar.fontSize};\n    font-weight: 600;\n    color: ${cssVar.colorText};\n    text-decoration: none;\n    white-space: nowrap;\n\n    background-image:\n      linear-gradient(${cssVar.colorBgContainer}, ${cssVar.colorBgContainer}), ${accentGradient};\n    background-clip: padding-box, border-box;\n    background-origin: border-box;\n\n    transition:\n      filter 140ms ease,\n      transform 90ms ease;\n\n    &:hover {\n      color: ${cssVar.colorText};\n      filter: brightness(1.06);\n    }\n\n    &:active {\n      transform: scale(0.97);\n    }\n  `,\n  actionPrimary: css`\n    && {\n      color: ${cssVar.colorBgContainer};\n      background: ${cssVar.colorText};\n    }\n\n    &&:hover {\n      color: ${cssVar.colorBgContainer};\n    }\n  `,\n  actionSmall: css`\n    && {\n      gap: 6px;\n      min-block-size: 34px;\n      padding-inline: 14px;\n      font-size: ${cssVar.fontSizeSM};\n    }\n  `,\n  group: css`\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px;\n\n    &[data-size='small'] {\n      gap: 8px;\n    }\n\n    ${responsive.mobile} {\n      &[data-size='large'] {\n        align-self: stretch;\n      }\n\n      &[data-size='large'] > * {\n        flex: 1;\n      }\n    }\n  `,\n}));\n\nexport type LandingNavigate = (href: string) => void;\n\nexport interface LandingActionsProps {\n  actions: LandingAction[];\n  className?: string;\n  /** Client-side navigation for internal non-primary actions, which render as buttons with an href. */\n  onNavigate?: LandingNavigate;\n  renderLink?: LandingLinkRender;\n  size?: 'large' | 'small';\n}\n\nexport const LandingActions = ({\n  actions,\n  className,\n  onNavigate,\n  renderLink,\n  size = 'large',\n}: LandingActionsProps) => (\n  <div className={cx(styles.group, className)} data-size={size}>\n    {actions.map(({ external, href, icon, iconPlacement = 'start', label, primary }) => {\n      const iconNode = icon && <Icon icon={icon} size={size === 'small' ? 14 : 16} />;\n      if (!primary) {\n        const isExternal = external ?? isExternalHref(href);\n        return (\n          <BottomGradientButton\n            href={href}\n            icon={iconNode}\n            iconPosition={iconPlacement}\n            key={href}\n            rel={isExternal ? 'noreferrer' : undefined}\n            size={size === 'small' ? 'middle' : 'large'}\n            target={isExternal ? '_blank' : undefined}\n            onClick={\n              !isExternal && onNavigate\n                ? (event) => {\n                    event.preventDefault();\n                    onNavigate(href);\n                  }\n                : undefined\n            }\n          >\n            {label}\n          </BottomGradientButton>\n        );\n      }\n      return (\n        <Fragment key={href}>\n          {renderLandingLink(renderLink, {\n            children: (\n              <>\n                {iconPlacement === 'start' && iconNode}\n                {label}\n                {iconPlacement === 'end' && iconNode}\n              </>\n            ),\n            className: cx(\n              styles.action,\n              styles.actionPrimary,\n              size === 'small' && styles.actionSmall,\n            ),\n            external,\n            href,\n          })}\n        </Fragment>\n      );\n    })}\n  </div>\n);\n"],"mappings":";;;;;;;;AAoBA,MAAM,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CAClE,QAAQ,GAAG;;;;;;;;;;;;iBAYI,OAAO,SAAS;;aAEpB,OAAO,UAAU;;;;;wBAKN,OAAO,iBAAiB,IAAI,OAAO,iBAAiB,KAAK,eAAe;;;;;;;;;eASjF,OAAO,UAAU;;;;;;;;CAQ9B,eAAe,GAAG;;eAEL,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;;eAItB,OAAO,iBAAiB;;;CAGrC,aAAa,GAAG;;;;;mBAKC,OAAO,WAAW;;;CAGnC,OAAO,GAAG;;;;;;;;;MASN,WAAW,OAAO;;;;;;;;;;AAUxB,EAAE;AAaF,MAAa,kBAAkB,EAC7B,SACA,WACA,YACA,YACA,OAAO,cAEP,oBAAC,OAAD;CAAK,WAAW,GAAG,OAAO,OAAO,SAAS;CAAG,aAAW;CACrD,UAAA,QAAQ,KAAK,EAAE,UAAU,MAAM,MAAM,gBAAgB,SAAS,OAAO,cAAc;EAClF,MAAM,WAAW,QAAQ,oBAAC,MAAD;GAAY;GAAM,MAAM,SAAS,UAAU,KAAK;EAAK,CAAA;EAC9E,IAAI,CAAC,SAAS;GACZ,MAAM,aAAa,YAAY,eAAe,IAAI;GAClD,OACE,oBAAC,sBAAD;IACQ;IACN,MAAM;IACN,cAAc;IAEd,KAAK,aAAa,eAAe,KAAA;IACjC,MAAM,SAAS,UAAU,WAAW;IACpC,QAAQ,aAAa,WAAW,KAAA;IAChC,SACE,CAAC,cAAc,cACV,UAAU;KACT,MAAM,eAAe;KACrB,WAAW,IAAI;IACjB,IACA,KAAA;IAGL,UAAA;GACmB,GAdf,IAce;EAE1B;EACA,OACE,oBAAC,UAAD,EAAA,UACG,kBAAkB,YAAY;GAC7B,UACE,qBAAA,YAAA,EAAA,UAAA;IACG,kBAAkB,WAAW;IAC7B;IACA,kBAAkB,SAAS;GAC5B,EAAA,CAAA;GAEJ,WAAW,GACT,OAAO,QACP,OAAO,eACP,SAAS,WAAW,OAAO,WAC7B;GACA;GACA;EACF,CAAC,EACO,GAjBK,IAiBL;CAEd,CAAC;AACE,CAAA"}
+{"version":3,"file":"landingActions.mjs","names":[],"sources":["../../src/awesome/landingActions.tsx"],"sourcesContent":["import './landingActions.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { Fragment, type ReactNode } from 'react';\n\nimport BottomGradientButton from '@/awesome/BottomGradientButton';\nimport { isExternalHref, type LandingLinkRender, renderLandingLink } from '@/awesome/landingLink';\nimport Icon, { type IconProps } from '@/Icon';\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { media } from '@/styles/stylex/media.stylex';\nimport { styleProps } from '@/styles/stylex/props';\n\nexport interface LandingAction {\n  /** Opens in a new tab. Inferred from absolute URLs when omitted. */\n  external?: boolean;\n  href: string;\n  icon?: IconProps['icon'];\n  /** Places the icon after the label, e.g. for an arrow. */\n  iconPlacement?: 'start' | 'end';\n  label: ReactNode;\n  /** The primary action is a filled pill; others render as BottomGradientButton. */\n  primary?: boolean;\n}\n\nconst styles = stylex.create({\n  action: {\n    gap: 8,\n    borderColor: 'transparent',\n    borderRadius: 999,\n    borderStyle: 'solid',\n    borderWidth: 1,\n    paddingBlock: 0,\n    paddingInline: 22,\n    transition: 'filter 140ms ease, transform 90ms ease',\n    alignItems: 'center',\n    backgroundColor: cssVar.colorText,\n    color: cssVar.colorBgContainer,\n    display: 'inline-flex',\n    filter: { 'default': null, ':hover': 'brightness(1.06)' },\n    fontSize: cssVar.fontSize,\n    fontWeight: 600,\n    justifyContent: 'center',\n    minBlockSize: 44,\n    textDecoration: 'none',\n    transform: { 'default': null, ':active': 'scale(0.97)' },\n    whiteSpace: 'nowrap',\n  },\n  actionSmall: {\n    gap: 6,\n    paddingInline: 14,\n    fontSize: cssVar.fontSizeSM,\n    minBlockSize: 34,\n  },\n  group: {\n    gap: 12,\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n  groupLarge: {\n    alignSelf: { default: null, [media.mobile]: 'stretch' },\n  },\n  groupSmall: {\n    gap: 8,\n  },\n});\n\nexport type LandingNavigate = (href: string) => void;\n\nexport interface LandingActionsProps {\n  actions: LandingAction[];\n  className?: string;\n  /** Client-side navigation for internal non-primary actions, which render as buttons with an href. */\n  onNavigate?: LandingNavigate;\n  renderLink?: LandingLinkRender;\n  size?: 'large' | 'small';\n  xstyle?: Parameters<typeof styleProps>[0];\n}\n\nexport const LandingActions = ({\n  actions,\n  className,\n  onNavigate,\n  renderLink,\n  size = 'large',\n  xstyle,\n}: LandingActionsProps) => (\n  <div\n    {...styleProps(\n      [styles.group, size === 'small' ? styles.groupSmall : styles.groupLarge, xstyle],\n      clsx('lobe-landing-actions', className),\n    )}\n    data-size={size}\n  >\n    {actions.map(({ external, href, icon, iconPlacement = 'start', label, primary }) => {\n      const iconNode = icon && <Icon icon={icon} size={size === 'small' ? 14 : 16} />;\n      if (!primary) {\n        const isExternal = external ?? isExternalHref(href);\n        return (\n          <BottomGradientButton\n            href={href}\n            icon={iconNode}\n            iconPosition={iconPlacement}\n            key={href}\n            rel={isExternal ? 'noreferrer' : undefined}\n            size={size === 'small' ? 'middle' : 'large'}\n            target={isExternal ? '_blank' : undefined}\n            onClick={\n              !isExternal && onNavigate\n                ? (event) => {\n                    event.preventDefault();\n                    onNavigate(href);\n                  }\n                : undefined\n            }\n          >\n            {label}\n          </BottomGradientButton>\n        );\n      }\n      return (\n        <Fragment key={href}>\n          {renderLandingLink(renderLink, {\n            children: (\n              <>\n                {iconPlacement === 'start' && iconNode}\n                {label}\n                {iconPlacement === 'end' && iconNode}\n              </>\n            ),\n            className: stylex.props(styles.action, size === 'small' && styles.actionSmall)\n              .className,\n            external,\n            href,\n          })}\n        </Fragment>\n      );\n    })}\n  </div>\n);\n"],"mappings":";;;;;;;;AAuBA,MAAM,SAAS;CACb,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,OAAO;CACT;AACF;AAWA,MAAa,kBAAkB,EAC7B,SACA,WACA,YACA,YACA,OAAO,SACP,aACyB,oBAAC,OAAD;CAAK,GAAI,WAAW;EAAC,OAAO;EAAO,SAAS,UAAU,OAAO,aAAa,OAAO;EAAY;CAAM,GAAG,KAAK,wBAAwB,SAAS,CAAC;CAAG,aAAW;CACjL,UAAA,QAAQ,KAAK,EACd,UACA,MACA,MACA,gBAAgB,SAChB,OACA,cACI;EACJ,MAAM,WAAW,QAAQ,oBAAC,MAAD;GAAY;GAAM,MAAM,SAAS,UAAU,KAAK;EAAK,CAAA;EAC9E,IAAI,CAAC,SAAS;GACZ,MAAM,aAAa,YAAY,eAAe,IAAI;GAClD,OAAO,oBAAC,sBAAD;IAA4B;IAAM,MAAM;IAAU,cAAc;IAA0B,KAAK,aAAa,eAAe,KAAA;IAAW,MAAM,SAAS,UAAU,WAAW;IAAS,QAAQ,aAAa,WAAW,KAAA;IAAW,SAAS,CAAC,cAAc,cAAa,UAAS;KACjR,MAAM,eAAe;KACrB,WAAW,IAAI;IACjB,IAAI,KAAA;IACG,UAAA;GACmB,GALiE,IAKjE;EAC5B;EACA,OAAO,oBAAC,UAAD,EAAA,UACA,kBAAkB,YAAY;GACjC,UAAU,qBAAA,YAAA,EAAA,UAAA;IACD,kBAAkB,WAAW;IAC7B;IACA,kBAAkB,SAAS;GAC5B,EAAA,CAAA;GACR,WAAW;IACT,GAAG,EACD,WAAW,8LACb;IACA,GAAG,EACD,WAAW,6LACb;GACF,EAAE,CAAC,EAAE,SAAS,YAAY,EAAE,CAAC;GAC7B;GACA;EACF,CAAC,EACW,GAlBQ,IAkBR;CAChB,CAAC;AACI,CAAA"}

package/es/awesome/landingLink.d.mts

@@ -1,12 +1,11 @@
 import { ReactNode } from "react";
 //#region src/awesome/landingLink.d.ts
-interface LandingLinkProps {
+export interface LandingLinkProps {
   children: ReactNode;
   className?: string;
   external?: boolean;
   href: string;
 }
-type LandingLinkRender = (props: LandingLinkProps) => ReactNode;
+export type LandingLinkRender = (props: LandingLinkProps) => ReactNode;
 //#endregion
-export { LandingLinkProps, LandingLinkRender };
 //# sourceMappingURL=landingLink.d.mts.map

package/es/awesome/landingTokens.d.mts

@@ -1,10 +1,9 @@
 //#region src/awesome/landingTokens.d.ts
-type LandingPalette = [string, string, string];
-declare const LANDING_PALETTE_LIGHT: LandingPalette;
-declare const LANDING_PALETTE_DARK: LandingPalette;
+export type LandingPalette = [string, string, string];
+export declare const LANDING_PALETTE_LIGHT: LandingPalette;
+export declare const LANDING_PALETTE_DARK: LandingPalette;
 /** Consumers can override the accent of every landing component with this CSS variable. */
-declare const LANDING_GRADIENT_VAR = "--lobe-landing-gradient";
-declare const accentGradient: string;
+export declare const LANDING_GRADIENT_VAR = "--lobe-landing-gradient";
+export declare const accentGradient: string;
 //#endregion
-export { LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, LandingPalette, accentGradient };
 //# sourceMappingURL=landingTokens.d.mts.map

package/es/brand/BrandLoading/index.d.mts

@@ -1,7 +1,7 @@
 import { DivProps, SvgProps } from "../../types/index.mjs";
 import { FC } from "react";
 //#region src/brand/BrandLoading/index.d.ts
-interface BrandLoadingProps {
+export interface BrandLoadingProps {
   size?: number;
   text: FC<SvgProps & DivProps & {
     size?: number;
@@ -9,5 +9,5 @@ interface BrandLoadingProps {
 }
 declare const BrandLoading: FC<BrandLoadingProps & SvgProps & DivProps>;
 //#endregion
-export { BrandLoadingProps, BrandLoading as default };
+export { BrandLoading as default };
 //# sourceMappingURL=index.d.mts.map

package/es/brand/LobeChat/index.d.mts

@@ -1,12 +1,12 @@
 import { DivProps } from "../../types/index.mjs";
 import { ReactNode } from "react";
 //#region src/brand/LobeChat/index.d.ts
-interface LobeChatProps extends DivProps {
+export interface LobeChatProps extends DivProps {
   extra?: ReactNode;
   size?: number;
   type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';
 }
 declare const LobeChat: import("react").NamedExoticComponent<LobeChatProps>;
 //#endregion
-export { LobeChatProps, LobeChat as default };
+export { LobeChat as default };
 //# sourceMappingURL=index.d.mts.map

package/es/brand/LobeChat/index.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { cssVar } from "../../styles/stylex/cssVar.stylex.mjs";
 import FlexBasic_default from "../../Flex/FlexBasic.mjs";
 import Divider from "../components/Divider.mjs";
 import LobeChatText from "../LobeChatText/index.mjs";
@@ -8,7 +9,7 @@ import LogoFlat_default from "../LogoFlat/index.mjs";
 import icons_default from "../LogoMono/index.mjs";
 import { memo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { cssVar } from "antd-style";
+import * as stylex from "@stylexjs/stylex";
 //#region src/brand/LobeChat/index.tsx
 const LobeChat = memo(({ type = "3d", size = 32, style, extra, className, ...rest }) => {
 	let logoComponent;
@@ -73,7 +74,7 @@ const LobeChat = memo(({ type = "3d", size = 32, style, extra, className, ...res
 				style: { color: cssVar.colorFill }
 			}),
 			/* @__PURE__ */ jsx("div", {
-				className: styles.extraTitle,
+				...stylex.props(styles.extraTitle),
 				style: { fontSize: extraSize },
 				children: extra
 			})

package/es/brand/LobeChat/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["LogoFlat","LogoMono","LogoText","Flexbox"],"sources":["../../../src/brand/LobeChat/index.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar } from 'antd-style';\nimport { memo, type ReactNode } from 'react';\n\nimport Divider from '@/brand/components/Divider';\nimport LogoText from '@/brand/LobeChatText';\nimport { styles } from '@/brand/LobeHub/style';\nimport Logo3d from '@/brand/Logo3d';\nimport LogoFlat from '@/brand/LogoFlat';\nimport LogoMono from '@/brand/LogoMono';\nimport { Flexbox } from '@/Flex';\nimport { type DivProps } from '@/types';\n\nexport interface LobeChatProps extends DivProps {\n  extra?: ReactNode;\n  size?: number;\n  type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';\n}\n\nconst LobeChat = memo<LobeChatProps>(\n  ({ type = '3d', size = 32, style, extra, className, ...rest }) => {\n    let logoComponent: ReactNode;\n\n    switch (type) {\n      case '3d': {\n        logoComponent = <Logo3d alt={'LobeChat'} size={size} {...rest} />;\n        break;\n      }\n      case 'flat': {\n        logoComponent = <LogoFlat size={size} style={style} />;\n        break;\n      }\n      case 'mono': {\n        logoComponent = <LogoMono size={size} style={style} />;\n        break;\n      }\n      case 'text': {\n        logoComponent = (\n          <LogoText className={className} size={size} style={style} {...(rest as any)} />\n        );\n        break;\n      }\n      case 'combine': {\n        logoComponent = (\n          <>\n            <Logo3d alt=\"LobeChat\" size={size} />\n            <LogoText size={size} style={{ marginLeft: Math.round(size / 4) }} />\n          </>\n        );\n\n        if (!extra)\n          logoComponent = (\n            <Flexbox horizontal align={'center'} className={className} flex={'none'} style={style}>\n              {logoComponent}\n            </Flexbox>\n          );\n\n        break;\n      }\n    }\n\n    if (!extra) return logoComponent;\n\n    const extraSize = Math.round((size / 3) * 1.9);\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={className}\n        flex={'none'}\n        style={style}\n        {...rest}\n      >\n        {logoComponent}\n        <Divider size={extraSize} style={{ color: cssVar.colorFill }} />\n        <div className={styles.extraTitle} style={{ fontSize: extraSize }}>\n          {extra}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nLobeChat.displayName = 'LobeChatBrand';\n\nexport default LobeChat;\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,WAAW,MACd,EAAE,OAAO,MAAM,OAAO,IAAI,OAAO,OAAO,WAAW,GAAG,WAAW;CAChE,IAAI;CAEJ,QAAQ,MAAR;EACE,KAAK;GACH,gBAAgB,oBAAC,QAAD;IAAQ,KAAK;IAAkB;IAAM,GAAI;GAAO,CAAA;GAChE;EAEF,KAAK;GACH,gBAAgB,oBAACA,kBAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEF,KAAK;GACH,gBAAgB,oBAACC,eAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEF,KAAK;GACH,gBACE,oBAACC,cAAD;IAAqB;IAAiB;IAAa;IAAO,GAAK;GAAe,CAAA;GAEhF;EAEF,KAAK;GACH,gBACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,KAAI;IAAiB;GAAO,CAAA,GACpC,oBAACA,cAAD;IAAgB;IAAM,OAAO,EAAE,YAAY,KAAK,MAAM,OAAO,CAAC,EAAE;GAAI,CAAA,CACpE,EAAA,CAAA;GAGJ,IAAI,CAAC,OACH,gBACE,oBAACC,mBAAD;IAAS,YAAA;IAAW,OAAO;IAAqB;IAAW,MAAM;IAAe;IAC7E,UAAA;GACM,CAAA;CAKjB;CAEA,IAAI,CAAC,OAAO,OAAO;CAEnB,MAAM,YAAY,KAAK,MAAO,OAAO,IAAK,GAAG;CAE7C,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,OAAO;EACI;EACX,MAAM;EACC;EACP,GAAI;EANN,UAAA;GAQG;GACD,oBAAC,SAAD;IAAS,MAAM;IAAW,OAAO,EAAE,OAAO,OAAO,UAAU;GAAI,CAAA;GAC/D,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAY,OAAO,EAAE,UAAU,UAAU;IAC7D,UAAA;GACE,CAAA;EACE;;AAEb,CACF;AAEA,SAAS,cAAc"}
+{"version":3,"file":"index.mjs","names":["LogoFlat","LogoMono","LogoText","Flexbox"],"sources":["../../../src/brand/LobeChat/index.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport { memo, type ReactNode } from 'react';\n\nimport Divider from '@/brand/components/Divider';\nimport LogoText from '@/brand/LobeChatText';\nimport { styles } from '@/brand/LobeHub/style';\nimport Logo3d from '@/brand/Logo3d';\nimport LogoFlat from '@/brand/LogoFlat';\nimport LogoMono from '@/brand/LogoMono';\nimport { Flexbox } from '@/Flex';\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { type DivProps } from '@/types';\n\nexport interface LobeChatProps extends DivProps {\n  extra?: ReactNode;\n  size?: number;\n  type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';\n}\n\nconst LobeChat = memo<LobeChatProps>(\n  ({ type = '3d', size = 32, style, extra, className, ...rest }) => {\n    let logoComponent: ReactNode;\n\n    switch (type) {\n      case '3d': {\n        logoComponent = <Logo3d alt={'LobeChat'} size={size} {...rest} />;\n        break;\n      }\n      case 'flat': {\n        logoComponent = <LogoFlat size={size} style={style} />;\n        break;\n      }\n      case 'mono': {\n        logoComponent = <LogoMono size={size} style={style} />;\n        break;\n      }\n      case 'text': {\n        logoComponent = (\n          <LogoText className={className} size={size} style={style} {...(rest as any)} />\n        );\n        break;\n      }\n      case 'combine': {\n        logoComponent = (\n          <>\n            <Logo3d alt=\"LobeChat\" size={size} />\n            <LogoText size={size} style={{ marginLeft: Math.round(size / 4) }} />\n          </>\n        );\n\n        if (!extra)\n          logoComponent = (\n            <Flexbox horizontal align={'center'} className={className} flex={'none'} style={style}>\n              {logoComponent}\n            </Flexbox>\n          );\n\n        break;\n      }\n    }\n\n    if (!extra) return logoComponent;\n\n    const extraSize = Math.round((size / 3) * 1.9);\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={className}\n        flex={'none'}\n        style={style}\n        {...rest}\n      >\n        {logoComponent}\n        <Divider size={extraSize} style={{ color: cssVar.colorFill }} />\n        <div {...stylex.props(styles.extraTitle)} style={{ fontSize: extraSize }}>\n          {extra}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nLobeChat.displayName = 'LobeChatBrand';\n\nexport default LobeChat;\n"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,WAAW,MAAqB,EACpC,OAAO,MACP,OAAO,IACP,OACA,OACA,WACA,GAAG,WACC;CACJ,IAAI;CACJ,QAAQ,MAAR;EACE,KAAK;GAED,gBAAgB,oBAAC,QAAD;IAAQ,KAAK;IAAkB;IAAM,GAAI;GAAO,CAAA;GAChE;EAEJ,KAAK;GAED,gBAAgB,oBAACA,kBAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEJ,KAAK;GAED,gBAAgB,oBAACC,eAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEJ,KAAK;GAED,gBAAgB,oBAACC,cAAD;IAAqB;IAAiB;IAAa;IAAO,GAAI;GAAc,CAAA;GAC5F;EAEJ,KAAK;GAED,gBAAgB,qBAAA,YAAA,EAAA,UAAA,CACZ,oBAAC,QAAD;IAAQ,KAAI;IAAiB;GAAO,CAAA,GACpC,oBAACA,cAAD;IAAgB;IAAM,OAAO,EAC7B,YAAY,KAAK,MAAM,OAAO,CAAC,EACjC;GAAI,CAAA,CACF,EAAA,CAAA;GACJ,IAAI,CAAC,OAAO,gBAAgB,oBAACC,mBAAD;IAAS,YAAA;IAAW,OAAO;IAAqB;IAAW,MAAM;IAAe;IACrG,UAAA;GACM,CAAA;CAGnB;CACA,IAAI,CAAC,OAAO,OAAO;CACnB,MAAM,YAAY,KAAK,MAAM,OAAO,IAAI,GAAG;CAC3C,OAAO,qBAACA,mBAAD;EAAS,YAAA;EAAW,OAAO;EAAqB;EAAW,MAAM;EAAe;EAAO,GAAI;EAA3F,UAAA;GACA;GACD,oBAAC,SAAD;IAAS,MAAM;IAAW,OAAO,EACnC,OAAO,OAAO,UAChB;GAAI,CAAA;GACA,oBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,UAAU;IAAG,OAAO,EACnD,UAAU,UACZ;IACO,UAAA;GACE,CAAA;EACE;;AACf,CAAC;AACD,SAAS,cAAc"}

package/es/brand/LobeHub/index.d.mts

@@ -1,12 +1,12 @@
 import { DivProps } from "../../types/index.mjs";
 import { ReactNode } from "react";
 //#region src/brand/LobeHub/index.d.ts
-interface LobeHubProps extends DivProps {
+export interface LobeHubProps extends DivProps {
   extra?: ReactNode;
   size?: number;
   type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';
 }
 declare const LobeHub: import("react").NamedExoticComponent<LobeHubProps>;
 //#endregion
-export { LobeHubProps, LobeHub as default };
+export { LobeHub as default };
 //# sourceMappingURL=index.d.mts.map

package/es/brand/LobeHub/index.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { cssVar } from "../../styles/stylex/cssVar.stylex.mjs";
 import FlexBasic_default from "../../Flex/FlexBasic.mjs";
 import Divider from "../components/Divider.mjs";
 import { styles } from "./style.mjs";
@@ -8,7 +9,7 @@ import icons_default from "../LogoMono/index.mjs";
 import LobeHubText from "../LobeHubText/index.mjs";
 import { memo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { cssVar } from "antd-style";
+import * as stylex from "@stylexjs/stylex";
 //#region src/brand/LobeHub/index.tsx
 const LobeHub = memo(({ type = "3d", size = 32, style, extra, className, ...rest }) => {
 	let logoComponent;
@@ -72,7 +73,7 @@ const LobeHub = memo(({ type = "3d", size = 32, style, extra, className, ...rest
 				style: { color: cssVar.colorFill }
 			}),
 			/* @__PURE__ */ jsx("div", {
-				className: styles.extraTitle,
+				...stylex.props(styles.extraTitle),
 				style: { fontSize: extraSize },
 				children: extra
 			})

package/es/brand/LobeHub/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["LogoFlat","LogoMono","LogoText","Flexbox"],"sources":["../../../src/brand/LobeHub/index.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar } from 'antd-style';\nimport { memo, type ReactNode } from 'react';\n\nimport Divider from '@/brand/components/Divider';\nimport LogoText from '@/brand/LobeHubText';\nimport Logo3d from '@/brand/Logo3d';\nimport LogoFlat from '@/brand/LogoFlat';\nimport LogoMono from '@/brand/LogoMono';\nimport { Flexbox } from '@/Flex';\nimport { type DivProps } from '@/types';\n\nimport { styles } from './style';\n\nexport interface LobeHubProps extends DivProps {\n  extra?: ReactNode;\n  size?: number;\n  type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';\n}\n\nconst LobeHub = memo<LobeHubProps>(\n  ({ type = '3d', size = 32, style, extra, className, ...rest }) => {\n    let logoComponent: ReactNode;\n\n    switch (type) {\n      case '3d': {\n        logoComponent = <Logo3d size={size} {...rest} />;\n        break;\n      }\n      case 'flat': {\n        logoComponent = <LogoFlat size={size} style={style} />;\n        break;\n      }\n      case 'mono': {\n        logoComponent = <LogoMono size={size} style={style} />;\n        break;\n      }\n      case 'text': {\n        logoComponent = (\n          <LogoText className={className} size={size} style={style} {...(rest as any)} />\n        );\n        break;\n      }\n      case 'combine': {\n        logoComponent = (\n          <>\n            <Logo3d alt=\"LobeChat\" size={size} />\n            <LogoText size={size} style={{ marginLeft: Math.round(size / 4) }} />\n          </>\n        );\n\n        if (!extra)\n          logoComponent = (\n            <Flexbox horizontal align={'center'} className={className} flex={'none'} style={style}>\n              {logoComponent}\n            </Flexbox>\n          );\n\n        break;\n      }\n    }\n\n    if (!extra) return logoComponent;\n\n    const extraSize = Math.round((size / 3) * 1.9);\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={className}\n        flex={'none'}\n        style={style}\n        {...rest}\n      >\n        {logoComponent}\n        <Divider size={extraSize} style={{ color: cssVar.colorFill }} />\n        <div className={styles.extraTitle} style={{ fontSize: extraSize }}>\n          {extra}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nLobeHub.displayName = 'LobeHubBrand';\n\nexport default LobeHub;\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAM,UAAU,MACb,EAAE,OAAO,MAAM,OAAO,IAAI,OAAO,OAAO,WAAW,GAAG,WAAW;CAChE,IAAI;CAEJ,QAAQ,MAAR;EACE,KAAK;GACH,gBAAgB,oBAAC,QAAD;IAAc;IAAM,GAAI;GAAO,CAAA;GAC/C;EAEF,KAAK;GACH,gBAAgB,oBAACA,kBAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEF,KAAK;GACH,gBAAgB,oBAACC,eAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEF,KAAK;GACH,gBACE,oBAACC,aAAD;IAAqB;IAAiB;IAAa;IAAO,GAAK;GAAe,CAAA;GAEhF;EAEF,KAAK;GACH,gBACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,KAAI;IAAiB;GAAO,CAAA,GACpC,oBAACA,aAAD;IAAgB;IAAM,OAAO,EAAE,YAAY,KAAK,MAAM,OAAO,CAAC,EAAE;GAAI,CAAA,CACpE,EAAA,CAAA;GAGJ,IAAI,CAAC,OACH,gBACE,oBAACC,mBAAD;IAAS,YAAA;IAAW,OAAO;IAAqB;IAAW,MAAM;IAAe;IAC7E,UAAA;GACM,CAAA;CAKjB;CAEA,IAAI,CAAC,OAAO,OAAO;CAEnB,MAAM,YAAY,KAAK,MAAO,OAAO,IAAK,GAAG;CAE7C,OACE,qBAACA,mBAAD;EACE,YAAA;EACA,OAAO;EACI;EACX,MAAM;EACC;EACP,GAAI;EANN,UAAA;GAQG;GACD,oBAAC,SAAD;IAAS,MAAM;IAAW,OAAO,EAAE,OAAO,OAAO,UAAU;GAAI,CAAA;GAC/D,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAY,OAAO,EAAE,UAAU,UAAU;IAC7D,UAAA;GACE,CAAA;EACE;;AAEb,CACF;AAEA,QAAQ,cAAc"}
+{"version":3,"file":"index.mjs","names":["LogoFlat","LogoMono","LogoText","Flexbox"],"sources":["../../../src/brand/LobeHub/index.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport { memo, type ReactNode } from 'react';\n\nimport Divider from '@/brand/components/Divider';\nimport LogoText from '@/brand/LobeHubText';\nimport Logo3d from '@/brand/Logo3d';\nimport LogoFlat from '@/brand/LogoFlat';\nimport LogoMono from '@/brand/LogoMono';\nimport { Flexbox } from '@/Flex';\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { type DivProps } from '@/types';\n\nimport { styles } from './style';\n\nexport interface LobeHubProps extends DivProps {\n  extra?: ReactNode;\n  size?: number;\n  type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';\n}\n\nconst LobeHub = memo<LobeHubProps>(\n  ({ type = '3d', size = 32, style, extra, className, ...rest }) => {\n    let logoComponent: ReactNode;\n\n    switch (type) {\n      case '3d': {\n        logoComponent = <Logo3d size={size} {...rest} />;\n        break;\n      }\n      case 'flat': {\n        logoComponent = <LogoFlat size={size} style={style} />;\n        break;\n      }\n      case 'mono': {\n        logoComponent = <LogoMono size={size} style={style} />;\n        break;\n      }\n      case 'text': {\n        logoComponent = (\n          <LogoText className={className} size={size} style={style} {...(rest as any)} />\n        );\n        break;\n      }\n      case 'combine': {\n        logoComponent = (\n          <>\n            <Logo3d alt=\"LobeChat\" size={size} />\n            <LogoText size={size} style={{ marginLeft: Math.round(size / 4) }} />\n          </>\n        );\n\n        if (!extra)\n          logoComponent = (\n            <Flexbox horizontal align={'center'} className={className} flex={'none'} style={style}>\n              {logoComponent}\n            </Flexbox>\n          );\n\n        break;\n      }\n    }\n\n    if (!extra) return logoComponent;\n\n    const extraSize = Math.round((size / 3) * 1.9);\n\n    return (\n      <Flexbox\n        horizontal\n        align={'center'}\n        className={className}\n        flex={'none'}\n        style={style}\n        {...rest}\n      >\n        {logoComponent}\n        <Divider size={extraSize} style={{ color: cssVar.colorFill }} />\n        <div {...stylex.props(styles.extraTitle)} style={{ fontSize: extraSize }}>\n          {extra}\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nLobeHub.displayName = 'LobeHubBrand';\n\nexport default LobeHub;\n"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,UAAU,MAAoB,EAClC,OAAO,MACP,OAAO,IACP,OACA,OACA,WACA,GAAG,WACC;CACJ,IAAI;CACJ,QAAQ,MAAR;EACE,KAAK;GAED,gBAAgB,oBAAC,QAAD;IAAc;IAAM,GAAI;GAAO,CAAA;GAC/C;EAEJ,KAAK;GAED,gBAAgB,oBAACA,kBAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEJ,KAAK;GAED,gBAAgB,oBAACC,eAAD;IAAgB;IAAa;GAAQ,CAAA;GACrD;EAEJ,KAAK;GAED,gBAAgB,oBAACC,aAAD;IAAqB;IAAiB;IAAa;IAAO,GAAI;GAAc,CAAA;GAC5F;EAEJ,KAAK;GAED,gBAAgB,qBAAA,YAAA,EAAA,UAAA,CACZ,oBAAC,QAAD;IAAQ,KAAI;IAAiB;GAAO,CAAA,GACpC,oBAACA,aAAD;IAAgB;IAAM,OAAO,EAC7B,YAAY,KAAK,MAAM,OAAO,CAAC,EACjC;GAAI,CAAA,CACF,EAAA,CAAA;GACJ,IAAI,CAAC,OAAO,gBAAgB,oBAACC,mBAAD;IAAS,YAAA;IAAW,OAAO;IAAqB;IAAW,MAAM;IAAe;IACrG,UAAA;GACM,CAAA;CAGnB;CACA,IAAI,CAAC,OAAO,OAAO;CACnB,MAAM,YAAY,KAAK,MAAM,OAAO,IAAI,GAAG;CAC3C,OAAO,qBAACA,mBAAD;EAAS,YAAA;EAAW,OAAO;EAAqB;EAAW,MAAM;EAAe;EAAO,GAAI;EAA3F,UAAA;GACA;GACD,oBAAC,SAAD;IAAS,MAAM;IAAW,OAAO,EACnC,OAAO,OAAO,UAChB;GAAI,CAAA;GACA,oBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,UAAU;IAAG,OAAO,EACnD,UAAU,UACZ;IACO,UAAA;GACE,CAAA;EACE;;AACf,CAAC;AACD,QAAQ,cAAc"}

package/es/brand/LobeHub/style.mjs

@@ -1,16 +1,14 @@
-import { createStaticStyles } from "antd-style";
 //#region src/brand/LobeHub/style.ts
 const LOGO_3D = {
 	path: "assets/logo-3d.webp",
 	pkg: "@lobehub/assets-logo",
 	version: "1.2.0"
 };
-const styles = createStaticStyles(({ css }) => {
-	return { extraTitle: css`
-      font-weight: 300;
-      white-space: nowrap;
-    ` };
-});
+const styles = { extraTitle: {
+	k63SB2: "lb1iikomf",
+	khDVqt: "lbuxw1ft",
+	$$css: true
+} };
 //#endregion
 export { LOGO_3D, styles };
 

package/es/brand/LobeHub/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/brand/LobeHub/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const LOGO_3D = {\n  path: 'assets/logo-3d.webp',\n  pkg: '@lobehub/assets-logo',\n  version: '1.2.0',\n};\n\nexport const styles = createStaticStyles(({ css }) => {\n  return {\n    extraTitle: css`\n      font-weight: 300;\n      white-space: nowrap;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAa,UAAU;CACrB,MAAM;CACN,KAAK;CACL,SAAS;AACX;AAEA,MAAa,SAAS,oBAAoB,EAAE,UAAU;CACpD,OAAO,EACL,YAAY,GAAG;;;MAIjB;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/brand/LobeHub/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nexport const LOGO_3D = {\n  path: 'assets/logo-3d.webp',\n  pkg: '@lobehub/assets-logo',\n  version: '1.2.0',\n};\n\nexport const styles = stylex.create({\n  extraTitle: {\n    fontWeight: 300,\n    whiteSpace: 'nowrap',\n  },\n});\n"],"mappings":";AACA,MAAa,UAAU;CACrB,MAAM;CACN,KAAK;CACL,SAAS;AACX;AACA,MAAa,SAAS,EACpB,YAAY;CACV,QAAQ;CACR,QAAQ;CACR,OAAO;AACT,EACF"}

package/es/brand/Logo3d/index.d.mts

@@ -1,8 +1,7 @@
 import { ImgProps } from "../../types/index.mjs";
 import { FC } from "react";
-import { ImageProps } from "antd";
 //#region src/brand/Logo3d/index.d.ts
-type Logo3dProps = Omit<ImgProps & ImageProps, 'width' | 'height' | 'src'> & {
+type Logo3dProps = Omit<ImgProps, 'width' | 'height' | 'src'> & {
   size?: number | string;
 };
 declare const Logo3d: FC<Logo3dProps>;

package/es/brand/Logo3d/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/brand/Logo3d/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ImageProps } from 'antd';\nimport { type FC } from 'react';\n\nimport { useCdnFn } from '@/ConfigProvider';\nimport Img from '@/Img';\nimport type { ImgProps } from '@/types';\n\nimport { LOGO_3D } from '../LobeHub/style';\n\ntype Logo3dProps = Omit<ImgProps & ImageProps, 'width' | 'height' | 'src'> & {\n  size?: number | string;\n};\n\nconst Logo3d: FC<Logo3dProps> = ({ size = '1em', style, alt = 'LobeHub', ...rest }) => {\n  const genCdnUrl = useCdnFn();\n  return (\n    <Img alt={alt} height={size} src={genCdnUrl(LOGO_3D)} style={style} width={size} {...rest} />\n  );\n};\n\nLogo3d.displayName = 'LobeHubLogo3d';\n\nexport default Logo3d;\n"],"mappings":";;;;;;AAeA,MAAM,UAA2B,EAAE,OAAO,OAAO,OAAO,MAAM,WAAW,GAAG,WAAW;CACrF,MAAM,YAAY,SAAS;CAC3B,OACE,oBAAC,KAAD;EAAU;EAAK,QAAQ;EAAM,KAAK,UAAU,OAAO;EAAU;EAAO,OAAO;EAAM,GAAI;CAAO,CAAA;AAEhG;AAEA,OAAO,cAAc"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/brand/Logo3d/index.tsx"],"sourcesContent":["'use client';\n\nimport { type FC } from 'react';\n\nimport { useCdnFn } from '@/ConfigProvider';\nimport Img from '@/Img';\nimport type { ImgProps } from '@/types';\n\nimport { LOGO_3D } from '../LobeHub/style';\n\ntype Logo3dProps = Omit<ImgProps, 'width' | 'height' | 'src'> & {\n  size?: number | string;\n};\n\nconst Logo3d: FC<Logo3dProps> = ({ size = '1em', style, alt = 'LobeHub', ...rest }) => {\n  const genCdnUrl = useCdnFn();\n  return (\n    <Img alt={alt} height={size} src={genCdnUrl(LOGO_3D)} style={style} width={size} {...rest} />\n  );\n};\n\nLogo3d.displayName = 'LobeHubLogo3d';\n\nexport default Logo3d;\n"],"mappings":";;;;;;AAcA,MAAM,UAA2B,EAAE,OAAO,OAAO,OAAO,MAAM,WAAW,GAAG,WAAW;CACrF,MAAM,YAAY,SAAS;CAC3B,OACE,oBAAC,KAAD;EAAU;EAAK,QAAQ;EAAM,KAAK,UAAU,OAAO;EAAU;EAAO,OAAO;EAAM,GAAI;CAAO,CAAA;AAEhG;AAEA,OAAO,cAAc"}

package/es/brand/LogoThree/Loading.mjs

@@ -1,5 +1,5 @@
-import Center from "../../Flex/Center.mjs";
 import Icon from "../../Icon/Icon.mjs";
+import Center from "../../Flex/Center.mjs";
 import { jsx } from "react/jsx-runtime";
 import { Loader2 } from "lucide-react";
 //#region src/brand/LogoThree/Loading.tsx

package/es/brand/LogoThree/LogoSpline.d.mts

@@ -2,7 +2,7 @@ import { SplineProps } from "../../awesome/Spline/type.mjs";
 import "../../awesome/Spline/index.mjs";
 import { CSSProperties } from "react";
 //#region src/brand/LogoThree/LogoSpline.d.ts
-interface LogoSplineProps extends Partial<SplineProps> {
+export interface LogoSplineProps extends Partial<SplineProps> {
   className?: string;
   height?: number | string;
   style?: CSSProperties;
@@ -10,5 +10,5 @@ interface LogoSplineProps extends Partial<SplineProps> {
 }
 declare const LogoSpline: import("react").NamedExoticComponent<LogoSplineProps>;
 //#endregion
-export { LogoSplineProps, LogoSpline as default };
+export { LogoSpline as default };
 //# sourceMappingURL=LogoSpline.d.mts.map

package/es/brand/LogoThree/LogoSpline.mjs

@@ -1,8 +1,8 @@
+import { useThemeMode } from "../../styles/theme/scope.mjs";
 import Spline from "../../awesome/Spline/Spine.mjs";
 import Loading from "./Loading.mjs";
 import { memo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useThemeMode } from "antd-style";
 //#region src/brand/LogoThree/LogoSpline.tsx
 const LIGHT = "https://hub-apac-1.lobeobjects.space/light.splinecode";
 const DARK = "https://hub-apac-1.lobeobjects.space/dark.splinecode";

package/es/brand/LogoThree/LogoSpline.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LogoSpline.mjs","names":[],"sources":["../../../src/brand/LogoThree/LogoSpline.tsx"],"sourcesContent":["import { useThemeMode } from 'antd-style';\nimport { type CSSProperties, memo, useState } from 'react';\n\nimport Spline, { type SplineProps } from '@/awesome/Spline';\n\nimport Loading from './Loading';\n\nconst LIGHT = 'https://hub-apac-1.lobeobjects.space/light.splinecode';\nconst DARK = 'https://hub-apac-1.lobeobjects.space/dark.splinecode';\n\nexport interface LogoSplineProps extends Partial<SplineProps> {\n  className?: string;\n  height?: number | string;\n  style?: CSSProperties;\n  width?: number | string;\n}\n\nconst LogoSpline = memo<LogoSplineProps>(({ className, style, width, height, onLoad, ...rest }) => {\n  const { isDarkMode } = useThemeMode();\n  const [loading, setLoading] = useState(true);\n  return (\n    <div className={className} style={{ height, position: 'relative', width, ...style }}>\n      {loading && <Loading />}\n      <Spline\n        scene={isDarkMode ? DARK : LIGHT}\n        onLoad={(splineApp) => {\n          setLoading(false);\n          onLoad?.(splineApp);\n        }}\n        {...rest}\n      />\n    </div>\n  );\n});\n\nexport default LogoSpline;\n"],"mappings":";;;;;;AAOA,MAAM,QAAQ;AACd,MAAM,OAAO;AASb,MAAM,aAAa,MAAuB,EAAE,WAAW,OAAO,OAAO,QAAQ,QAAQ,GAAG,WAAW;CACjG,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,CAAC,SAAS,cAAc,SAAS,IAAI;CAC3C,OACE,qBAAC,OAAD;EAAgB;EAAW,OAAO;GAAE;GAAQ,UAAU;GAAY;GAAO,GAAG;EAAM;EAAlF,UAAA,CACG,WAAW,oBAAC,SAAD,CAAU,CAAA,GACtB,oBAAC,QAAD;GACE,OAAO,aAAa,OAAO;GAC3B,SAAS,cAAc;IACrB,WAAW,KAAK;IAChB,SAAS,SAAS;GACpB;GACA,GAAI;EACL,CAAA,CACE;;AAET,CAAC"}
+{"version":3,"file":"LogoSpline.mjs","names":[],"sources":["../../../src/brand/LogoThree/LogoSpline.tsx"],"sourcesContent":["import { type CSSProperties, memo, useState } from 'react';\n\nimport Spline, { type SplineProps } from '@/awesome/Spline';\nimport { useThemeMode } from '@/styles/theme/scope';\n\nimport Loading from './Loading';\n\nconst LIGHT = 'https://hub-apac-1.lobeobjects.space/light.splinecode';\nconst DARK = 'https://hub-apac-1.lobeobjects.space/dark.splinecode';\n\nexport interface LogoSplineProps extends Partial<SplineProps> {\n  className?: string;\n  height?: number | string;\n  style?: CSSProperties;\n  width?: number | string;\n}\n\nconst LogoSpline = memo<LogoSplineProps>(({ className, style, width, height, onLoad, ...rest }) => {\n  const { isDarkMode } = useThemeMode();\n  const [loading, setLoading] = useState(true);\n  return (\n    <div className={className} style={{ height, position: 'relative', width, ...style }}>\n      {loading && <Loading />}\n      <Spline\n        scene={isDarkMode ? DARK : LIGHT}\n        onLoad={(splineApp) => {\n          setLoading(false);\n          onLoad?.(splineApp);\n        }}\n        {...rest}\n      />\n    </div>\n  );\n});\n\nexport default LogoSpline;\n"],"mappings":";;;;;;AAOA,MAAM,QAAQ;AACd,MAAM,OAAO;AASb,MAAM,aAAa,MAAuB,EAAE,WAAW,OAAO,OAAO,QAAQ,QAAQ,GAAG,WAAW;CACjG,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,CAAC,SAAS,cAAc,SAAS,IAAI;CAC3C,OACE,qBAAC,OAAD;EAAgB;EAAW,OAAO;GAAE;GAAQ,UAAU;GAAY;GAAO,GAAG;EAAM;EAAlF,UAAA,CACG,WAAW,oBAAC,SAAD,CAAU,CAAA,GACtB,oBAAC,QAAD;GACE,OAAO,aAAa,OAAO;GAC3B,SAAS,cAAc;IACrB,WAAW,KAAK;IAChB,SAAS,SAAS;GACpB;GACA,GAAI;EACL,CAAA,CACE;;AAET,CAAC"}

package/es/brand/LogoThree/index.d.mts

@@ -2,12 +2,12 @@ import { SplineProps } from "../../awesome/Spline/type.mjs";
 import "../../awesome/Spline/index.mjs";
 import { CSSProperties } from "react";
 //#region src/brand/LogoThree/index.d.ts
-interface LogoThreeProps extends Partial<SplineProps> {
+export interface LogoThreeProps extends Partial<SplineProps> {
   className?: string;
   size?: number;
   style?: CSSProperties;
 }
 declare const LogoThree: import("react").NamedExoticComponent<LogoThreeProps>;
 //#endregion
-export { LogoThreeProps, LogoThree as default };
+export { LogoThree as default };
 //# sourceMappingURL=index.d.mts.map

package/es/chat/BackBottom/BackBottom.mjs

@@ -1,10 +1,8 @@
 "use client";
-import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
-import Button from "../../base-ui/Button/Button.mjs";
+import { ButtonImpl } from "../../Button/Button.mjs";
 import { styles } from "./style.mjs";
 import { memo, useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
-import { cx } from "antd-style";
 import { ListEnd } from "lucide-react";
 import { useScroll } from "ahooks";
 //#region src/chat/BackBottom/BackBottom.tsx
@@ -30,14 +28,15 @@ const BackBottom = memo(({ visibilityHeight = 240, target, onClick, style, class
 		});
 		onClick?.(e);
 	};
-	return /* @__PURE__ */ jsx(Button, {
-		className: cx(staticStylish.blur, visible ? styles.visible : styles.hidden, className),
+	return /* @__PURE__ */ jsx(ButtonImpl, {
+		className,
 		icon: ListEnd,
 		ref,
 		shape: "round",
 		size: "small",
 		style,
 		type: "fill",
+		xstyle: [styles.root, visible ? styles.visible : styles.hidden],
 		onClick: scrollToBottom,
 		children: text || "Back to bottom"
 	});

package/es/chat/BackBottom/BackBottom.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BackBottom.mjs","names":["lobeStaticStylish"],"sources":["../../../src/chat/BackBottom/BackBottom.tsx"],"sourcesContent":["'use client';\n\nimport { useScroll } from 'ahooks';\nimport { cx } from 'antd-style';\nimport { ListEnd } from 'lucide-react';\nimport { memo, type MouseEventHandler, useEffect, useRef, useState } from 'react';\n\nimport Button from '@/base-ui/Button';\nimport { lobeStaticStylish } from '@/styles';\n\nimport { styles } from './style';\nimport { type BackBottomProps } from './type';\n\nconst BackBottom = memo<BackBottomProps>(\n  ({ visibilityHeight = 240, target, onClick, style, className, text }) => {\n    const [visible, setVisible] = useState<boolean>(false);\n    const ref = useRef<HTMLButtonElement>(null);\n    const current = (target as any)?.current;\n    const scrollHeight = current?.scrollHeight || 0;\n    const clientHeight = current?.clientHeight || 0;\n    const scroll = useScroll(target);\n\n    useEffect(() => {\n      if (scroll?.top) {\n        setVisible(scroll?.top + clientHeight + visibilityHeight < scrollHeight);\n      }\n    }, [scrollHeight, scroll, visibilityHeight]);\n\n    const scrollToBottom: MouseEventHandler<HTMLElement> = (e) => {\n      (target as any)?.current?.scrollTo({ behavior: 'smooth', left: 0, top: scrollHeight });\n      onClick?.(e);\n    };\n\n    return (\n      <Button\n        className={cx(lobeStaticStylish.blur, visible ? styles.visible : styles.hidden, className)}\n        icon={ListEnd}\n        ref={ref}\n        shape={'round'}\n        size={'small'}\n        style={style}\n        type={'fill'}\n        onClick={scrollToBottom}\n      >\n        {text || 'Back to bottom'}\n      </Button>\n    );\n  },\n);\n\nBackBottom.displayName = 'BackBottom';\n\nexport default BackBottom;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,aAAa,MAChB,EAAE,mBAAmB,KAAK,QAAQ,SAAS,OAAO,WAAW,WAAW;CACvE,MAAM,CAAC,SAAS,cAAc,SAAkB,KAAK;CACrD,MAAM,MAAM,OAA0B,IAAI;CAC1C,MAAM,UAAW,QAAgB;CACjC,MAAM,eAAe,SAAS,gBAAgB;CAC9C,MAAM,eAAe,SAAS,gBAAgB;CAC9C,MAAM,SAAS,UAAU,MAAM;CAE/B,gBAAgB;EACd,IAAI,QAAQ,KACV,WAAW,QAAQ,MAAM,eAAe,mBAAmB,YAAY;CAE3E,GAAG;EAAC;EAAc;EAAQ;CAAgB,CAAC;CAE3C,MAAM,kBAAkD,MAAM;EAC5D,QAAiB,SAAS,SAAS;GAAE,UAAU;GAAU,MAAM;GAAG,KAAK;EAAa,CAAC;EACrF,UAAU,CAAC;CACb;CAEA,OACE,oBAAC,QAAD;EACE,WAAW,GAAGA,cAAkB,MAAM,UAAU,OAAO,UAAU,OAAO,QAAQ,SAAS;EACzF,MAAM;EACD;EACL,OAAO;EACP,MAAM;EACC;EACP,MAAM;EACN,SAAS;EAER,UAAA,QAAQ;CACH,CAAA;AAEZ,CACF;AAEA,WAAW,cAAc"}
+{"version":3,"file":"BackBottom.mjs","names":[],"sources":["../../../src/chat/BackBottom/BackBottom.tsx"],"sourcesContent":["'use client';\n\nimport { useScroll } from 'ahooks';\nimport { ListEnd } from 'lucide-react';\nimport { memo, type MouseEventHandler, useEffect, useRef, useState } from 'react';\n\nimport { ButtonImpl } from '@/Button/Button';\n\nimport { styles } from './style';\nimport { type BackBottomProps } from './type';\n\nconst BackBottom = memo<BackBottomProps>(\n  ({ visibilityHeight = 240, target, onClick, style, className, text }) => {\n    const [visible, setVisible] = useState<boolean>(false);\n    const ref = useRef<HTMLButtonElement>(null);\n    const current = (target as any)?.current;\n    const scrollHeight = current?.scrollHeight || 0;\n    const clientHeight = current?.clientHeight || 0;\n    const scroll = useScroll(target);\n\n    useEffect(() => {\n      if (scroll?.top) {\n        setVisible(scroll?.top + clientHeight + visibilityHeight < scrollHeight);\n      }\n    }, [scrollHeight, scroll, visibilityHeight]);\n\n    const scrollToBottom: MouseEventHandler<HTMLElement> = (e) => {\n      (target as any)?.current?.scrollTo({ behavior: 'smooth', left: 0, top: scrollHeight });\n      onClick?.(e);\n    };\n\n    return (\n      <ButtonImpl\n        className={className}\n        icon={ListEnd}\n        ref={ref}\n        shape={'round'}\n        size={'small'}\n        style={style}\n        type={'fill'}\n        xstyle={[styles.root, visible ? styles.visible : styles.hidden]}\n        onClick={scrollToBottom}\n      >\n        {text || 'Back to bottom'}\n      </ButtonImpl>\n    );\n  },\n);\n\nBackBottom.displayName = 'BackBottom';\n\nexport default BackBottom;\n"],"mappings":";;;;;;;;AAWA,MAAM,aAAa,MAChB,EAAE,mBAAmB,KAAK,QAAQ,SAAS,OAAO,WAAW,WAAW;CACvE,MAAM,CAAC,SAAS,cAAc,SAAkB,KAAK;CACrD,MAAM,MAAM,OAA0B,IAAI;CAC1C,MAAM,UAAW,QAAgB;CACjC,MAAM,eAAe,SAAS,gBAAgB;CAC9C,MAAM,eAAe,SAAS,gBAAgB;CAC9C,MAAM,SAAS,UAAU,MAAM;CAE/B,gBAAgB;EACd,IAAI,QAAQ,KACV,WAAW,QAAQ,MAAM,eAAe,mBAAmB,YAAY;CAE3E,GAAG;EAAC;EAAc;EAAQ;CAAgB,CAAC;CAE3C,MAAM,kBAAkD,MAAM;EAC5D,QAAiB,SAAS,SAAS;GAAE,UAAU;GAAU,MAAM;GAAG,KAAK;EAAa,CAAC;EACrF,UAAU,CAAC;CACb;CAEA,OACE,oBAAC,YAAD;EACa;EACX,MAAM;EACD;EACL,OAAO;EACP,MAAM;EACC;EACP,MAAM;EACN,QAAQ,CAAC,OAAO,MAAM,UAAU,OAAO,UAAU,OAAO,MAAM;EAC9D,SAAS;EAER,UAAA,QAAQ;CACC,CAAA;AAEhB,CACF;AAEA,WAAW,cAAc"}

package/es/chat/BackBottom/style.mjs

@@ -1,41 +1,28 @@
-import { createStaticStyles } from "antd-style";
 //#region src/chat/BackBottom/style.ts
-const styles = createStaticStyles(({ css, responsive }) => ({
-	hidden: css`
-    pointer-events: none;
-
-    position: absolute;
-    inset-block-end: 16px;
-    inset-inline-end: 16px;
-    transform: translateY(16px);
-
-    opacity: 0;
-
-    ${responsive.sm} {
-      inset-inline-end: 0;
-      border-inline-end: none;
-      border-start-end-radius: 0 !important;
-      border-end-end-radius: 0 !important;
-    }
-  `,
-	visible: css`
-    pointer-events: all;
-
-    position: absolute;
-    inset-block-end: 16px;
-    inset-inline-end: 16px;
-    transform: translateY(0);
-
-    opacity: 1;
-
-    ${responsive.sm} {
-      inset-inline-end: 0;
-      border-inline-end: none;
-      border-start-end-radius: 0 !important;
-      border-end-end-radius: 0 !important;
-    }
-  `
-}));
+const styles = {
+	hidden: {
+		kSiTet: "lbg01cxk",
+		kfzvcC: "lb47corl",
+		k3aq6I: "lb1u3r80t",
+		$$css: true
+	},
+	root: {
+		k6WDB: "lb1k0obaa",
+		kT0f0o: "lbg1ws7r",
+		k8ry5P: "lb1td6ucm",
+		kfmiAY: "lbnhwg79",
+		krVfgx: "lb191j7n5",
+		kt4wiu: "lbdg88n9 lb124196w",
+		kVAEAm: "lb10l6tqk",
+		$$css: true
+	},
+	visible: {
+		kSiTet: "lb1hc1fzr",
+		kfzvcC: "lb71s49j",
+		k3aq6I: "lbnn1q72",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

package/es/chat/BackBottom/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/BackBottom/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, responsive }) => ({\n  hidden: css`\n    pointer-events: none;\n\n    position: absolute;\n    inset-block-end: 16px;\n    inset-inline-end: 16px;\n    transform: translateY(16px);\n\n    opacity: 0;\n\n    ${responsive.sm} {\n      inset-inline-end: 0;\n      border-inline-end: none;\n      border-start-end-radius: 0 !important;\n      border-end-end-radius: 0 !important;\n    }\n  `,\n  visible: css`\n    pointer-events: all;\n\n    position: absolute;\n    inset-block-end: 16px;\n    inset-inline-end: 16px;\n    transform: translateY(0);\n\n    opacity: 1;\n\n    ${responsive.sm} {\n      inset-inline-end: 0;\n      border-inline-end: none;\n      border-start-end-radius: 0 !important;\n      border-end-end-radius: 0 !important;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,kBAAkB;CACjE,QAAQ,GAAG;;;;;;;;;;MAUP,WAAW,GAAG;;;;;;;CAOlB,SAAS,GAAG;;;;;;;;;;MAUR,WAAW,GAAG;;;;;;;AAOpB,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/BackBottom/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { media } from '@/styles/stylex/media.stylex';\n\nexport const styles = stylex.create({\n  hidden: {\n    opacity: 0,\n    pointerEvents: 'none',\n    transform: 'translateY(16px)',\n  },\n  root: {\n    backdropFilter: 'saturate(150%) blur(10px)',\n    borderEndEndRadius: { default: null, [media.sm]: 0 },\n    borderInlineEndStyle: { default: null, [media.sm]: 'none' },\n    borderStartEndRadius: { default: null, [media.sm]: 0 },\n    insetBlockEnd: 16,\n    insetInlineEnd: { default: 16, [media.sm]: 0 },\n    position: 'absolute',\n  },\n  visible: {\n    opacity: 1,\n    pointerEvents: 'all',\n    transform: 'translateY(0)',\n  },\n});\n"],"mappings":";AAGA,MAAa,SAAS;CACpB,QAAQ;EACN,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/chat/BackBottom/type.d.mts

@@ -1,7 +1,7 @@
 import { CSSProperties, MouseEventHandler } from "react";
 import { Target } from "ahooks/lib/useScroll/index.js";
 //#region src/chat/BackBottom/type.d.ts
-interface BackBottomProps {
+export interface BackBottomProps {
   className?: string;
   onClick?: MouseEventHandler<HTMLElement>;
   style?: CSSProperties;
@@ -10,5 +10,4 @@ interface BackBottomProps {
   visibilityHeight?: number;
 }
 //#endregion
-export { BackBottomProps };
 //# sourceMappingURL=type.d.mts.map