@lobehub/ui 6.0.0-beta.6 → 6.0.0-beta.8

package/es/ToggleGroup/ToggleGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroup.mjs","names":[],"sources":["../../src/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useMemo } from 'react';\n\nimport { useControlledState } from '@/hooks/useControlledState';\n\nimport {\n  ToggleGroupItem,\n  ToggleGroupItemIcon,\n  ToggleGroupItemLabel,\n  ToggleGroupRoot,\n} from './atoms';\nimport type { ToggleGroupOption, ToggleGroupProps } from './type';\n\nconst normalizeOption = <Value extends string>(\n  option: ToggleGroupOption<Value> | Value,\n): ToggleGroupOption<Value> => (typeof option === 'string' ? { value: option } : option);\n\nconst ToggleGroup = <Value extends string = string>({\n  className,\n  classNames,\n  defaultValue,\n  disabled = false,\n  onChange,\n  options,\n  ref,\n  size = 'middle',\n  style,\n  styles: customStyles,\n  value,\n  variant = 'outlined',\n}: ToggleGroupProps<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 normalizedOptions = useMemo(\n    () => (options ?? []).map((o) => normalizeOption<Value>(o)),\n    [options],\n  );\n\n  const groupValue = useMemo<Value[]>(() => (innerValue != null ? [innerValue] : []), [innerValue]);\n\n  return (\n    <ToggleGroupRoot<Value>\n      className={clsx(classNames?.root, className)}\n      disabled={disabled}\n      ref={ref}\n      style={{ ...style, ...customStyles?.root }}\n      value={groupValue}\n      variant={variant}\n      onValueChange={(next) => {\n        const picked = next[0];\n        if (picked != null) setInnerValue(picked);\n      }}\n    >\n      {normalizedOptions.map((opt) => (\n        <ToggleGroupItem<Value>\n          aria-label={typeof opt.label === 'string' ? opt.label : opt.title}\n          className={clsx(classNames?.item, opt.className)}\n          disabled={disabled || opt.disabled}\n          key={opt.value}\n          size={size}\n          style={customStyles?.item}\n          title={opt.title}\n          value={opt.value}\n          variant={variant}\n        >\n          {opt.icon != null && (\n            <ToggleGroupItemIcon className={classNames?.itemIcon} style={customStyles?.itemIcon}>\n              {opt.icon}\n            </ToggleGroupItemIcon>\n          )}\n          {opt.label != null && (\n            <ToggleGroupItemLabel className={classNames?.itemLabel} style={customStyles?.itemLabel}>\n              {opt.label}\n            </ToggleGroupItemLabel>\n          )}\n        </ToggleGroupItem>\n      ))}\n    </ToggleGroupRoot>\n  );\n};\n\nToggleGroup.displayName = 'ToggleGroup';\n\nexport default ToggleGroup;\n"],"mappings":";;;;;;;AAeA,MAAM,mBACJ,WAC8B,OAAO,WAAW,WAAW,EAAE,OAAO,OAAO,IAAI;AAEjF,MAAM,eAA8C,EAClD,WACA,YACA,cACA,WAAW,OACX,UACA,SACA,KACA,OAAO,UACP,OACA,QAAQ,cACR,OACA,UAAU,iBACmB;CAC7B,MAAM,CAAC,YAAY,iBAAiB,mBAAsC,cAAc;EACtF;EACA,WAAW,SAAS;GAClB,IAAI,QAAQ,MAAM,WAAW,IAAI;EACnC;EACA;CACF,CAAC;CAED,MAAM,oBAAoB,eACjB,WAAW,CAAC,EAAA,CAAG,KAAK,MAAM,gBAAuB,CAAC,CAAC,GAC1D,CAAC,OAAO,CACV;CAEA,MAAM,aAAa,cAAwB,cAAc,OAAO,CAAC,UAAU,IAAI,CAAC,GAAI,CAAC,UAAU,CAAC;CAEhG,OACE,oBAAC,iBAAD;EACE,WAAW,KAAK,YAAY,MAAM,SAAS;EACjC;EACL;EACL,OAAO;GAAE,GAAG;GAAO,GAAG,cAAc;EAAK;EACzC,OAAO;EACE;EACT,gBAAgB,SAAS;GACvB,MAAM,SAAS,KAAK;GACpB,IAAI,UAAU,MAAM,cAAc,MAAM;EAC1C;EAEC,UAAA,kBAAkB,KAAK,QACtB,qBAAC,iBAAD;GACE,cAAY,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,IAAI;GAC5D,WAAW,KAAK,YAAY,MAAM,IAAI,SAAS;GAC/C,UAAU,YAAY,IAAI;GAEpB;GACN,OAAO,cAAc;GACrB,OAAO,IAAI;GACX,OAAO,IAAI;GACF;GATX,UAAA,CAWG,IAAI,QAAQ,QACX,oBAAC,qBAAD;IAAqB,WAAW,YAAY;IAAU,OAAO,cAAc;IACxE,UAAA,IAAI;GACc,CAAA,GAEtB,IAAI,SAAS,QACZ,oBAAC,sBAAD;IAAsB,WAAW,YAAY;IAAW,OAAO,cAAc;IAC1E,UAAA,IAAI;GACe,CAAA,CAET;EAjBV,GAAA,IAAI,KAiBM,CAClB;CACc,CAAA;AAErB;AAEA,YAAY,cAAc"}
+{"version":3,"file":"ToggleGroup.mjs","names":["clsx"],"sources":["../../src/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useMemo } from 'react';\n\nimport { useControlledState } from '@/hooks/useControlledState';\n\nimport {\n  ToggleGroupItem,\n  ToggleGroupItemIcon,\n  ToggleGroupItemLabel,\n  ToggleGroupRoot,\n} from './atoms';\nimport type { ToggleGroupOption, ToggleGroupProps } from './type';\n\nconst normalizeOption = <Value extends string>(\n  option: ToggleGroupOption<Value> | Value,\n): ToggleGroupOption<Value> => (typeof option === 'string' ? { value: option } : option);\n\nconst ToggleGroup = <Value extends string = string>({\n  className,\n  classNames,\n  defaultValue,\n  disabled = false,\n  onChange,\n  options,\n  ref,\n  size = 'middle',\n  style,\n  styles: customStyles,\n  value,\n  variant = 'outlined',\n}: ToggleGroupProps<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 normalizedOptions = useMemo(\n    () => (options ?? []).map((o) => normalizeOption<Value>(o)),\n    [options],\n  );\n\n  const groupValue = useMemo<Value[]>(() => (innerValue != null ? [innerValue] : []), [innerValue]);\n\n  return (\n    <ToggleGroupRoot<Value>\n      className={clsx(classNames?.root, className)}\n      disabled={disabled}\n      ref={ref}\n      style={{ ...style, ...customStyles?.root }}\n      value={groupValue}\n      variant={variant}\n      onValueChange={(next) => {\n        const picked = next[0];\n        if (picked != null) setInnerValue(picked);\n      }}\n    >\n      {normalizedOptions.map((opt) => (\n        <ToggleGroupItem<Value>\n          aria-label={typeof opt.label === 'string' ? opt.label : opt.title}\n          className={clsx(classNames?.item, opt.className)}\n          disabled={disabled || opt.disabled}\n          key={opt.value}\n          size={size}\n          style={customStyles?.item}\n          title={opt.title}\n          value={opt.value}\n          variant={variant}\n        >\n          {opt.icon != null && (\n            <ToggleGroupItemIcon className={classNames?.itemIcon} style={customStyles?.itemIcon}>\n              {opt.icon}\n            </ToggleGroupItemIcon>\n          )}\n          {opt.label != null && (\n            <ToggleGroupItemLabel className={classNames?.itemLabel} style={customStyles?.itemLabel}>\n              {opt.label}\n            </ToggleGroupItemLabel>\n          )}\n        </ToggleGroupItem>\n      ))}\n    </ToggleGroupRoot>\n  );\n};\n\nToggleGroup.displayName = 'ToggleGroup';\n\nexport default ToggleGroup;\n"],"mappings":";;;;;;;AAeA,MAAM,mBACJ,WAC8B,OAAO,WAAW,WAAW,EAAE,OAAO,OAAO,IAAI;AAEjF,MAAM,eAA8C,EAClD,WACA,YACA,cACA,WAAW,OACX,UACA,SACA,KACA,OAAO,UACP,OACA,QAAQ,cACR,OACA,UAAU,iBACmB;CAC7B,MAAM,CAAC,YAAY,iBAAiB,mBAAsC,cAAc;EACtF;EACA,WAAW,SAAS;GAClB,IAAI,QAAQ,MAAM,WAAW,IAAI;EACnC;EACA;CACF,CAAC;CAED,MAAM,oBAAoB,eACjB,WAAW,CAAC,EAAA,CAAG,KAAK,MAAM,gBAAuB,CAAC,CAAC,GAC1D,CAAC,OAAO,CACV;CAEA,MAAM,aAAa,cAAwB,cAAc,OAAO,CAAC,UAAU,IAAI,CAAC,GAAI,CAAC,UAAU,CAAC;CAEhG,OACE,oBAAC,iBAAD;EACE,WAAWA,OAAK,YAAY,MAAM,SAAS;EACjC;EACL;EACL,OAAO;GAAE,GAAG;GAAO,GAAG,cAAc;EAAK;EACzC,OAAO;EACE;EACT,gBAAgB,SAAS;GACvB,MAAM,SAAS,KAAK;GACpB,IAAI,UAAU,MAAM,cAAc,MAAM;EAC1C;EAEC,UAAA,kBAAkB,KAAK,QACtB,qBAAC,iBAAD;GACE,cAAY,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,IAAI;GAC5D,WAAWA,OAAK,YAAY,MAAM,IAAI,SAAS;GAC/C,UAAU,YAAY,IAAI;GAEpB;GACN,OAAO,cAAc;GACrB,OAAO,IAAI;GACX,OAAO,IAAI;GACF;GATX,UAAA,CAWG,IAAI,QAAQ,QACX,oBAAC,qBAAD;IAAqB,WAAW,YAAY;IAAU,OAAO,cAAc;IACxE,UAAA,IAAI;GACc,CAAA,GAEtB,IAAI,SAAS,QACZ,oBAAC,sBAAD;IAAsB,WAAW,YAAY;IAAW,OAAO,cAAc;IAC1E,UAAA,IAAI;GACe,CAAA,CAET;EAjBV,GAAA,IAAI,KAiBM,CAClB;CACc,CAAA;AAErB;AAEA,YAAY,cAAc"}

package/es/ToggleGroup/atoms.mjs

@@ -4,7 +4,7 @@ import { focusRing } from "../styles/stylex/focusRing.mjs";
 import { toggleGroupItemMarker } from "./marker.stylex.mjs";
 import { styles } from "./style.mjs";
 import { jsx } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 import { Toggle } from "@base-ui/react/toggle";
 import { ToggleGroup } from "@base-ui/react/toggle-group";
@@ -46,7 +46,7 @@ const ToggleGroupItemIcon = ({ children, className, style }) => /* @__PURE__ */
 });
 ToggleGroupItemIcon.displayName = "ToggleGroupItemIcon";
 const ToggleGroupItemLabel = ({ children, className, style }) => /* @__PURE__ */ jsx("span", {
-	...styleProps(styles.itemLabel, clsx("toggle-group-item-label", className), style),
+	...styleProps(styles.itemLabel, clsx$1("toggle-group-item-label", className), style),
 	children
 });
 ToggleGroupItemLabel.displayName = "ToggleGroupItemLabel";

package/es/ToggleGroup/atoms.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"atoms.mjs","names":["BaseUIToggleGroup","BaseUIToggle"],"sources":["../../src/ToggleGroup/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 * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { type ComponentProps, type CSSProperties, type FC, type ReactNode } from 'react';\n\nimport { focusRing } from '@/styles/stylex/focusRing';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { toggleGroupItemMarker } from './marker.stylex';\nimport { styles } from './style';\nimport type { ToggleGroupSize, ToggleGroupVariant } from './type';\n\nconst rootVariantStyles = { borderless: styles.rootBorderless, outlined: styles.rootOutlined };\n\nconst itemSizeStyles = { middle: styles.itemMiddle, small: styles.itemSmall };\n\nconst itemVariantStyles = {\n  borderless: null,\n  outlined: [toggleGroupItemMarker, styles.itemOutlined],\n};\n\nexport type ToggleGroupRootProps<Value extends string = string> = Omit<\n  ComponentProps<typeof BaseUIToggleGroup<Value>>,\n  'className' | 'render'\n> & {\n  className?: string;\n  variant?: ToggleGroupVariant;\n};\n\nexport const ToggleGroupRoot = <Value extends string = string>({\n  className,\n  variant = 'outlined',\n  ...rest\n}: ToggleGroupRootProps<Value>) => {\n  return (\n    <BaseUIToggleGroup<Value>\n      className={styleProps([styles.root, rootVariantStyles[variant]], className).className}\n      {...rest}\n    />\n  );\n};\n\nToggleGroupRoot.displayName = 'ToggleGroupRoot';\n\nexport type ToggleGroupItemProps<Value extends string = string> = Omit<\n  ComponentProps<typeof BaseUIToggle<Value>>,\n  'className' | 'render'\n> & {\n  className?: string;\n  size?: ToggleGroupSize;\n  variant?: ToggleGroupVariant;\n};\n\nexport const ToggleGroupItem = <Value extends string = string>({\n  className,\n  size = 'middle',\n  variant = 'outlined',\n  ...rest\n}: ToggleGroupItemProps<Value>) => {\n  return (\n    <BaseUIToggle<Value>\n      {...rest}\n      className={\n        styleProps(\n          [styles.item, focusRing.info, itemSizeStyles[size], itemVariantStyles[variant]],\n          className,\n        ).className\n      }\n    />\n  );\n};\n\nToggleGroupItem.displayName = 'ToggleGroupItem';\n\ninterface SimpleSpanProps {\n  children?: ReactNode;\n  className?: string;\n  style?: CSSProperties;\n}\n\nexport const ToggleGroupItemIcon: FC<SimpleSpanProps> = ({ children, className, style }) => (\n  <span {...styleProps(styles.itemIcon, className, style)}>{children}</span>\n);\nToggleGroupItemIcon.displayName = 'ToggleGroupItemIcon';\n\nexport const ToggleGroupItemLabel: FC<SimpleSpanProps> = ({ children, className, style }) => (\n  <span {...styleProps(styles.itemLabel, clsx('toggle-group-item-label', className), style)}>\n    {children}\n  </span>\n);\nToggleGroupItemLabel.displayName = 'ToggleGroupItemLabel';\n\nexport const toggleGroupStyles = Object.fromEntries(\n  Object.entries(styles).map(([key, value]) => [key, stylex.props(value).className ?? '']),\n) as Record<keyof typeof styles, string>;\n"],"mappings":";;;;;;;;;;;AAYA,MAAM,oBAAoB;CACxB,YAAY,OAAO;CACnB,UAAU,OAAO;AACnB;AACA,MAAM,iBAAiB;CACrB,QAAQ,OAAO;CACf,OAAO,OAAO;AAChB;AACA,MAAM,oBAAoB;CACxB,YAAY;CACZ,UAAU,CAAC,uBAAuB,OAAO,YAAY;AACvD;AAKA,MAAa,mBAAmD,EAC9D,WACA,UAAU,YACV,GAAG,WAC8B;CACjC,OAAO,oBAACA,aAAD;EAA0B,WAAW,WAAW,CAAC,OAAO,MAAM,kBAAkB,QAAQ,GAAG,SAAS,CAAC,CAAC;EAAW,GAAI;CAAO,CAAA;AACrI;AACA,gBAAgB,cAAc;AAM9B,MAAa,mBAAmD,EAC9D,WACA,OAAO,UACP,UAAU,YACV,GAAG,WAC8B;CACjC,OAAO,oBAACC,QAAD;EAAqB,GAAI;EAAM,WAAW,WAAW;GAAC,OAAO;GAAM,UAAU;GAAM,eAAe;GAAO,kBAAkB;EAAQ,GAAG,SAAS,CAAC,CAAC;CAAY,CAAA;AACtK;AACA,gBAAgB,cAAc;AAM9B,MAAa,uBAA4C,EACvD,UACA,WACA,YACI,oBAAC,QAAD;CAAM,GAAI,WAAW,OAAO,UAAU,WAAW,KAAK;CAAI;AAAe,CAAA;AAC/E,oBAAoB,cAAc;AAClC,MAAa,wBAA6C,EACxD,UACA,WACA,YACI,oBAAC,QAAD;CAAM,GAAI,WAAW,OAAO,WAAW,KAAK,2BAA2B,SAAS,GAAG,KAAK;CACzF;AACG,CAAA;AACR,qBAAqB,cAAc;AACnC,MAAa,oBAAoB,OAAO,YAAY,OAAO,QAAQ,MAAM,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW,CAAC,KAAK,OAAO,MAAM,KAAK,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC"}
+{"version":3,"file":"atoms.mjs","names":["BaseUIToggleGroup","BaseUIToggle","clsx"],"sources":["../../src/ToggleGroup/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 * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { type ComponentProps, type CSSProperties, type FC, type ReactNode } from 'react';\n\nimport { focusRing } from '@/styles/stylex/focusRing';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { toggleGroupItemMarker } from './marker.stylex';\nimport { styles } from './style';\nimport type { ToggleGroupSize, ToggleGroupVariant } from './type';\n\nconst rootVariantStyles = { borderless: styles.rootBorderless, outlined: styles.rootOutlined };\n\nconst itemSizeStyles = { middle: styles.itemMiddle, small: styles.itemSmall };\n\nconst itemVariantStyles = {\n  borderless: null,\n  outlined: [toggleGroupItemMarker, styles.itemOutlined],\n};\n\nexport type ToggleGroupRootProps<Value extends string = string> = Omit<\n  ComponentProps<typeof BaseUIToggleGroup<Value>>,\n  'className' | 'render'\n> & {\n  className?: string;\n  variant?: ToggleGroupVariant;\n};\n\nexport const ToggleGroupRoot = <Value extends string = string>({\n  className,\n  variant = 'outlined',\n  ...rest\n}: ToggleGroupRootProps<Value>) => {\n  return (\n    <BaseUIToggleGroup<Value>\n      className={styleProps([styles.root, rootVariantStyles[variant]], className).className}\n      {...rest}\n    />\n  );\n};\n\nToggleGroupRoot.displayName = 'ToggleGroupRoot';\n\nexport type ToggleGroupItemProps<Value extends string = string> = Omit<\n  ComponentProps<typeof BaseUIToggle<Value>>,\n  'className' | 'render'\n> & {\n  className?: string;\n  size?: ToggleGroupSize;\n  variant?: ToggleGroupVariant;\n};\n\nexport const ToggleGroupItem = <Value extends string = string>({\n  className,\n  size = 'middle',\n  variant = 'outlined',\n  ...rest\n}: ToggleGroupItemProps<Value>) => {\n  return (\n    <BaseUIToggle<Value>\n      {...rest}\n      className={\n        styleProps(\n          [styles.item, focusRing.info, itemSizeStyles[size], itemVariantStyles[variant]],\n          className,\n        ).className\n      }\n    />\n  );\n};\n\nToggleGroupItem.displayName = 'ToggleGroupItem';\n\ninterface SimpleSpanProps {\n  children?: ReactNode;\n  className?: string;\n  style?: CSSProperties;\n}\n\nexport const ToggleGroupItemIcon: FC<SimpleSpanProps> = ({ children, className, style }) => (\n  <span {...styleProps(styles.itemIcon, className, style)}>{children}</span>\n);\nToggleGroupItemIcon.displayName = 'ToggleGroupItemIcon';\n\nexport const ToggleGroupItemLabel: FC<SimpleSpanProps> = ({ children, className, style }) => (\n  <span {...styleProps(styles.itemLabel, clsx('toggle-group-item-label', className), style)}>\n    {children}\n  </span>\n);\nToggleGroupItemLabel.displayName = 'ToggleGroupItemLabel';\n\nexport const toggleGroupStyles = Object.fromEntries(\n  Object.entries(styles).map(([key, value]) => [key, stylex.props(value).className ?? '']),\n) as Record<keyof typeof styles, string>;\n"],"mappings":";;;;;;;;;;;AAYA,MAAM,oBAAoB;CACxB,YAAY,OAAO;CACnB,UAAU,OAAO;AACnB;AACA,MAAM,iBAAiB;CACrB,QAAQ,OAAO;CACf,OAAO,OAAO;AAChB;AACA,MAAM,oBAAoB;CACxB,YAAY;CACZ,UAAU,CAAC,uBAAuB,OAAO,YAAY;AACvD;AAKA,MAAa,mBAAmD,EAC9D,WACA,UAAU,YACV,GAAG,WAC8B;CACjC,OAAO,oBAACA,aAAD;EAA0B,WAAW,WAAW,CAAC,OAAO,MAAM,kBAAkB,QAAQ,GAAG,SAAS,CAAC,CAAC;EAAW,GAAI;CAAO,CAAA;AACrI;AACA,gBAAgB,cAAc;AAM9B,MAAa,mBAAmD,EAC9D,WACA,OAAO,UACP,UAAU,YACV,GAAG,WAC8B;CACjC,OAAO,oBAACC,QAAD;EAAqB,GAAI;EAAM,WAAW,WAAW;GAAC,OAAO;GAAM,UAAU;GAAM,eAAe;GAAO,kBAAkB;EAAQ,GAAG,SAAS,CAAC,CAAC;CAAY,CAAA;AACtK;AACA,gBAAgB,cAAc;AAM9B,MAAa,uBAA4C,EACvD,UACA,WACA,YACI,oBAAC,QAAD;CAAM,GAAI,WAAW,OAAO,UAAU,WAAW,KAAK;CAAI;AAAe,CAAA;AAC/E,oBAAoB,cAAc;AAClC,MAAa,wBAA6C,EACxD,UACA,WACA,YACI,oBAAC,QAAD;CAAM,GAAI,WAAW,OAAO,WAAWC,OAAK,2BAA2B,SAAS,GAAG,KAAK;CACzF;AACG,CAAA;AACR,qBAAqB,cAAc;AACnC,MAAa,oBAAoB,OAAO,YAAY,OAAO,QAAQ,MAAM,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW,CAAC,KAAK,OAAO,MAAM,KAAK,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC"}

package/es/Tooltip/TooltipGroup.mjs

@@ -12,7 +12,7 @@ import { useDestroyOnInvalidActiveTriggerElement, useHidePopupWhenPositionerAtOr
 import { useRepopOnFarTriggerSwitch } from "../utils/useRepopOnFarTriggerSwitch.mjs";
 import { useCallback, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import { Tooltip } from "@base-ui/react/tooltip";
 //#region src/Tooltip/TooltipGroup.tsx
 const TooltipGroup = ({ children, disableDestroyOnInvalidTrigger = false, disableZeroOriginGuard = false, layoutAnimation = true, popupContainer, ...sharedProps }) => {
@@ -55,12 +55,12 @@ const TooltipGroup = ({ children, disableDestroyOnInvalidTrigger = false, disabl
 					const customStyles = typeof item.styles === "function" ? void 0 : item.styles;
 					const slots = {
 						arrow: styleProps(styles.arrow, item.classNames?.arrow, customStyles?.arrow),
-						popup: styleProps(styles.popup, clsx(item.className, item.classNames?.root, item.classNames?.container), {
+						popup: styleProps(styles.popup, clsx$1(item.className, item.classNames?.root, item.classNames?.container), {
 							...customStyles?.root,
 							...customStyles?.container
 						}),
 						positioner: styleProps(styles.positioner, void 0, { zIndex: item.zIndex ?? 114514 }),
-						viewport: styleProps(styles.viewport, clsx("lobe-tooltip-viewport", item.classNames?.content), customStyles?.content)
+						viewport: styleProps(styles.viewport, clsx$1("lobe-tooltip-viewport", item.classNames?.content), customStyles?.content)
 					};
 					const body = /* @__PURE__ */ jsx(Tooltip.Viewport, {
 						"data-repop": repop || void 0,

package/es/Tooltip/TooltipGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipGroup.mjs","names":["BaseTooltip"],"sources":["../../src/Tooltip/TooltipGroup.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';\nimport clsx from 'clsx';\nimport { type FC, useCallback, useRef, useState } from 'react';\n\nimport { useAppElement } from '@/ConfigProvider/AppElementContext';\nimport { useFloatingLayer } from '@/hooks/useFloatingLayer';\nimport { getFloatingCollisionPadding } from '@/internal/floating';\nimport { styleProps } from '@/styles/stylex/props';\nimport {\n  useDestroyOnInvalidActiveTriggerElement,\n  useHidePopupWhenPositionerAtOrigin,\n  usePopupHandleStore,\n} from '@/utils/destroyOnInvalidActiveTriggerElement';\nimport { placementMap } from '@/utils/placement';\nimport { useRepopOnFarTriggerSwitch } from '@/utils/useRepopOnFarTriggerSwitch';\n\nimport { TooltipArrowIcon } from './ArrowIcon';\nimport {\n  TooltipGroupHandleContext,\n  type TooltipGroupItem,\n  TooltipGroupPropsContext,\n} from './groupContext';\nimport { styles } from './style';\nimport TooltipContent from './TooltipContent';\nimport { type TooltipGroupProps } from './type';\n\nconst TooltipGroup: FC<TooltipGroupProps> = ({\n  children,\n  disableDestroyOnInvalidTrigger = false,\n  disableZeroOriginGuard = false,\n  layoutAnimation = true,\n  popupContainer,\n  ...sharedProps\n}) => {\n  const [{ handle, key }, setHandleState] = useState(() => ({\n    handle: BaseTooltip.createHandle<TooltipGroupItem>(),\n    key: 0,\n  }));\n  const activeItemRef = useRef<TooltipGroupItem | null>(null);\n\n  const destroy = useCallback(() => {\n    activeItemRef.current = null;\n    setHandleState(({ key }) => ({\n      handle: BaseTooltip.createHandle<TooltipGroupItem>(),\n      key: key + 1,\n    }));\n  }, []);\n\n  const handleOpenChange = useCallback((open: boolean) => {\n    activeItemRef.current?.onOpenChange?.(open);\n  }, []);\n\n  const appElement = useAppElement();\n  const floatingLayerContainer = useFloatingLayer();\n  const portalContainer = floatingLayerContainer ?? appElement;\n\n  const store = usePopupHandleStore(handle);\n  useDestroyOnInvalidActiveTriggerElement(store, destroy, {\n    enabled: !disableDestroyOnInvalidTrigger,\n  });\n  useHidePopupWhenPositionerAtOrigin(store, { enabled: !disableZeroOriginGuard });\n  const repop = useRepopOnFarTriggerSwitch(store, { enabled: layoutAnimation });\n\n  return (\n    <TooltipGroupHandleContext value={handle}>\n      <TooltipGroupPropsContext value={sharedProps}>\n        {/* Outside Root on purpose: the handle/key reset remounts Root's subtree; children must\n            survive it. Triggers bind to the group via the handle, not DOM nesting. */}\n        {children}\n        <BaseTooltip.Root handle={handle} key={key} onOpenChange={handleOpenChange}>\n          {({ payload }) => {\n            const item = (payload as TooltipGroupItem | null) ?? null;\n            activeItemRef.current = item;\n\n            if (!item || (item.title == null && !item.hotkey)) {\n              return null;\n            }\n\n            const arrow = item.arrow ?? false;\n            const placement = item.placement ?? 'top';\n            const placementConfig = placementMap[placement] ?? placementMap.top;\n            const baseSideOffset = arrow ? 8 : 6;\n\n            const customStyles = typeof item.styles === 'function' ? undefined : item.styles;\n            const slots = {\n              arrow: styleProps(styles.arrow, item.classNames?.arrow, customStyles?.arrow),\n              popup: styleProps(\n                styles.popup,\n                clsx(item.className, item.classNames?.root, item.classNames?.container),\n                { ...customStyles?.root, ...customStyles?.container },\n              ),\n              positioner: styleProps(styles.positioner, undefined, {\n                zIndex: item.zIndex ?? 114_514,\n              }),\n              viewport: styleProps(\n                styles.viewport,\n                clsx('lobe-tooltip-viewport', item.classNames?.content),\n                customStyles?.content,\n              ),\n            };\n\n            const body = (\n              <BaseTooltip.Viewport data-repop={repop || undefined} {...slots.viewport}>\n                <TooltipContent\n                  hotkey={item.hotkey}\n                  hotkeyProps={item.hotkeyProps}\n                  title={item.title}\n                />\n              </BaseTooltip.Viewport>\n            );\n\n            const popup = (\n              <BaseTooltip.Positioner\n                align={placementConfig.align}\n                data-layout-animation={layoutAnimation || undefined}\n                data-placement={placement}\n                data-repop={repop || undefined}\n                side={placementConfig.side}\n                sideOffset={baseSideOffset}\n                {...slots.positioner}\n                {...item.positionerProps}\n                collisionPadding={\n                  item.positionerProps?.collisionPadding ?? getFloatingCollisionPadding()\n                }\n              >\n                <BaseTooltip.Popup\n                  data-layout-animation={layoutAnimation || undefined}\n                  data-repop={repop || undefined}\n                  {...slots.popup}\n                  {...item.popupProps}\n                >\n                  {arrow && (\n                    <BaseTooltip.Arrow {...slots.arrow}>{TooltipArrowIcon}</BaseTooltip.Arrow>\n                  )}\n                  {body}\n                </BaseTooltip.Popup>\n              </BaseTooltip.Positioner>\n            );\n\n            const resolvedPortalContainer =\n              item.popupContainer ?? popupContainer ?? portalContainer;\n\n            return resolvedPortalContainer ? (\n              <BaseTooltip.Portal container={resolvedPortalContainer}>{popup}</BaseTooltip.Portal>\n            ) : null;\n          }}\n        </BaseTooltip.Root>\n      </TooltipGroupPropsContext>\n    </TooltipGroupHandleContext>\n  );\n};\n\nTooltipGroup.displayName = 'TooltipGroup';\n\nexport default TooltipGroup;\n"],"mappings":"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"}
+{"version":3,"file":"TooltipGroup.mjs","names":["BaseTooltip","clsx"],"sources":["../../src/Tooltip/TooltipGroup.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';\nimport clsx from 'clsx';\nimport { type FC, useCallback, useRef, useState } from 'react';\n\nimport { useAppElement } from '@/ConfigProvider/AppElementContext';\nimport { useFloatingLayer } from '@/hooks/useFloatingLayer';\nimport { getFloatingCollisionPadding } from '@/internal/floating';\nimport { styleProps } from '@/styles/stylex/props';\nimport {\n  useDestroyOnInvalidActiveTriggerElement,\n  useHidePopupWhenPositionerAtOrigin,\n  usePopupHandleStore,\n} from '@/utils/destroyOnInvalidActiveTriggerElement';\nimport { placementMap } from '@/utils/placement';\nimport { useRepopOnFarTriggerSwitch } from '@/utils/useRepopOnFarTriggerSwitch';\n\nimport { TooltipArrowIcon } from './ArrowIcon';\nimport {\n  TooltipGroupHandleContext,\n  type TooltipGroupItem,\n  TooltipGroupPropsContext,\n} from './groupContext';\nimport { styles } from './style';\nimport TooltipContent from './TooltipContent';\nimport { type TooltipGroupProps } from './type';\n\nconst TooltipGroup: FC<TooltipGroupProps> = ({\n  children,\n  disableDestroyOnInvalidTrigger = false,\n  disableZeroOriginGuard = false,\n  layoutAnimation = true,\n  popupContainer,\n  ...sharedProps\n}) => {\n  const [{ handle, key }, setHandleState] = useState(() => ({\n    handle: BaseTooltip.createHandle<TooltipGroupItem>(),\n    key: 0,\n  }));\n  const activeItemRef = useRef<TooltipGroupItem | null>(null);\n\n  const destroy = useCallback(() => {\n    activeItemRef.current = null;\n    setHandleState(({ key }) => ({\n      handle: BaseTooltip.createHandle<TooltipGroupItem>(),\n      key: key + 1,\n    }));\n  }, []);\n\n  const handleOpenChange = useCallback((open: boolean) => {\n    activeItemRef.current?.onOpenChange?.(open);\n  }, []);\n\n  const appElement = useAppElement();\n  const floatingLayerContainer = useFloatingLayer();\n  const portalContainer = floatingLayerContainer ?? appElement;\n\n  const store = usePopupHandleStore(handle);\n  useDestroyOnInvalidActiveTriggerElement(store, destroy, {\n    enabled: !disableDestroyOnInvalidTrigger,\n  });\n  useHidePopupWhenPositionerAtOrigin(store, { enabled: !disableZeroOriginGuard });\n  const repop = useRepopOnFarTriggerSwitch(store, { enabled: layoutAnimation });\n\n  return (\n    <TooltipGroupHandleContext value={handle}>\n      <TooltipGroupPropsContext value={sharedProps}>\n        {/* Outside Root on purpose: the handle/key reset remounts Root's subtree; children must\n            survive it. Triggers bind to the group via the handle, not DOM nesting. */}\n        {children}\n        <BaseTooltip.Root handle={handle} key={key} onOpenChange={handleOpenChange}>\n          {({ payload }) => {\n            const item = (payload as TooltipGroupItem | null) ?? null;\n            activeItemRef.current = item;\n\n            if (!item || (item.title == null && !item.hotkey)) {\n              return null;\n            }\n\n            const arrow = item.arrow ?? false;\n            const placement = item.placement ?? 'top';\n            const placementConfig = placementMap[placement] ?? placementMap.top;\n            const baseSideOffset = arrow ? 8 : 6;\n\n            const customStyles = typeof item.styles === 'function' ? undefined : item.styles;\n            const slots = {\n              arrow: styleProps(styles.arrow, item.classNames?.arrow, customStyles?.arrow),\n              popup: styleProps(\n                styles.popup,\n                clsx(item.className, item.classNames?.root, item.classNames?.container),\n                { ...customStyles?.root, ...customStyles?.container },\n              ),\n              positioner: styleProps(styles.positioner, undefined, {\n                zIndex: item.zIndex ?? 114_514,\n              }),\n              viewport: styleProps(\n                styles.viewport,\n                clsx('lobe-tooltip-viewport', item.classNames?.content),\n                customStyles?.content,\n              ),\n            };\n\n            const body = (\n              <BaseTooltip.Viewport data-repop={repop || undefined} {...slots.viewport}>\n                <TooltipContent\n                  hotkey={item.hotkey}\n                  hotkeyProps={item.hotkeyProps}\n                  title={item.title}\n                />\n              </BaseTooltip.Viewport>\n            );\n\n            const popup = (\n              <BaseTooltip.Positioner\n                align={placementConfig.align}\n                data-layout-animation={layoutAnimation || undefined}\n                data-placement={placement}\n                data-repop={repop || undefined}\n                side={placementConfig.side}\n                sideOffset={baseSideOffset}\n                {...slots.positioner}\n                {...item.positionerProps}\n                collisionPadding={\n                  item.positionerProps?.collisionPadding ?? getFloatingCollisionPadding()\n                }\n              >\n                <BaseTooltip.Popup\n                  data-layout-animation={layoutAnimation || undefined}\n                  data-repop={repop || undefined}\n                  {...slots.popup}\n                  {...item.popupProps}\n                >\n                  {arrow && (\n                    <BaseTooltip.Arrow {...slots.arrow}>{TooltipArrowIcon}</BaseTooltip.Arrow>\n                  )}\n                  {body}\n                </BaseTooltip.Popup>\n              </BaseTooltip.Positioner>\n            );\n\n            const resolvedPortalContainer =\n              item.popupContainer ?? popupContainer ?? portalContainer;\n\n            return resolvedPortalContainer ? (\n              <BaseTooltip.Portal container={resolvedPortalContainer}>{popup}</BaseTooltip.Portal>\n            ) : null;\n          }}\n        </BaseTooltip.Root>\n      </TooltipGroupPropsContext>\n    </TooltipGroupHandleContext>\n  );\n};\n\nTooltipGroup.displayName = 'TooltipGroup';\n\nexport default TooltipGroup;\n"],"mappings":"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"}

package/es/Tooltip/TooltipStandalone.mjs

@@ -12,7 +12,7 @@ import { TooltipArrowIcon } from "./ArrowIcon.mjs";
 import TooltipContent from "./TooltipContent.mjs";
 import { cloneElement, isValidElement, memo, useCallback, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { Tooltip } from "@base-ui/react/tooltip";
 //#region src/Tooltip/TooltipStandalone.tsx
@@ -58,12 +58,12 @@ const TooltipStandalone = memo(({ children, title, arrow = false, className, cla
 		const customStyles = typeof customStylesProp === "function" ? void 0 : customStylesProp;
 		return {
 			arrow: styleProps(styles.arrow, classNames?.arrow, customStyles?.arrow),
-			popup: styleProps(styles.popup, clsx(className, classNames?.root, classNames?.container), {
+			popup: styleProps(styles.popup, clsx$1(className, classNames?.root, classNames?.container), {
 				...customStyles?.root,
 				...customStyles?.container
 			}),
 			positioner: styleProps(styles.positioner, void 0, { zIndex: zIndex ?? 114514 }),
-			viewport: styleProps(styles.viewport, clsx("lobe-tooltip-viewport", classNames?.content), customStyles?.content)
+			viewport: styleProps(styles.viewport, clsx$1("lobe-tooltip-viewport", classNames?.content), customStyles?.content)
 		};
 	}, [
 		className,

package/es/Tooltip/TooltipStandalone.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipStandalone.mjs","names":["BaseTooltip"],"sources":["../../src/Tooltip/TooltipStandalone.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';\nimport clsx from 'clsx';\nimport {\n  cloneElement,\n  isValidElement,\n  memo,\n  type Ref,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { useAppElement } from '@/ConfigProvider/AppElementContext';\nimport { useFloatingLayer } from '@/hooks/useFloatingLayer';\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { getFloatingCollisionPadding } from '@/internal/floating';\nimport { styleProps } from '@/styles/stylex/props';\nimport { mergeRefs } from '@/utils/mergeRefs';\nimport { placementMap } from '@/utils/placement';\n\nimport { TooltipArrowIcon } from './ArrowIcon';\nimport { styles } from './style';\nimport TooltipContent from './TooltipContent';\nimport { type TooltipProps } from './type';\n\nconst DEFAULT_OPEN_DELAY = 400;\nconst DEFAULT_CLOSE_DELAY = 100;\n\n/**\n * Tooltip component - displays small contextual hints on hover/focus\n * Compatible with Ant Design Tooltip-like API (subset)\n */\nexport const TooltipStandalone = memo<TooltipProps>(\n  ({\n    children,\n    title,\n    arrow = false,\n    className,\n    classNames,\n    closeDelay,\n    defaultOpen = false,\n    disabled = false,\n    getPopupContainer,\n    hotkey,\n    hotkeyProps,\n    mouseEnterDelay,\n    mouseLeaveDelay,\n    onOpenChange,\n    open,\n    openDelay,\n    placement = 'top',\n    popupContainer,\n    styles: customStylesProp,\n    zIndex,\n    ref: refProp,\n    positionerProps,\n    triggerProps,\n    popupProps,\n    portalProps,\n    standalone: _standalone,\n    ...restProps\n  }) => {\n    const isClient = useIsClient();\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n    const [triggerNode, setTriggerNode] = useState<HTMLElement | null>(null);\n    const triggerCallbackRef = useCallback((node: HTMLElement | null) => {\n      if (node) setTriggerNode(node);\n    }, []);\n\n    const mergedOpen = open ?? uncontrolledOpen;\n    const resolvedOpen = disabled ? false : mergedOpen;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean) => {\n        if (disabled && nextOpen) return;\n        onOpenChange?.(nextOpen);\n        if (open === undefined) {\n          setUncontrolledOpen(nextOpen);\n        }\n      },\n      [disabled, onOpenChange, open],\n    );\n\n    const resolvedOpenDelay = useMemo(() => {\n      if (openDelay !== undefined) return openDelay;\n      if (mouseEnterDelay !== undefined) return mouseEnterDelay * 1000;\n      return DEFAULT_OPEN_DELAY;\n    }, [mouseEnterDelay, openDelay]);\n\n    const resolvedCloseDelay = useMemo(() => {\n      if (closeDelay !== undefined) return closeDelay;\n      if (mouseLeaveDelay !== undefined) return mouseLeaveDelay * 1000;\n      return DEFAULT_CLOSE_DELAY;\n    }, [closeDelay, mouseLeaveDelay]);\n\n    const placementConfig = placementMap[placement] ?? placementMap.top;\n    const baseSideOffset = arrow ? 8 : 6;\n\n    const appElement = useAppElement();\n    const floatingLayerContainer = useFloatingLayer();\n    const portalContainer = floatingLayerContainer ?? appElement;\n\n    const { isNativeButtonTriggerElement } = useNativeButton({\n      children,\n    });\n\n    const slots = useMemo(() => {\n      const customStyles = typeof customStylesProp === 'function' ? undefined : customStylesProp;\n      return {\n        arrow: styleProps(styles.arrow, classNames?.arrow, customStyles?.arrow),\n        popup: styleProps(styles.popup, clsx(className, classNames?.root, classNames?.container), {\n          ...customStyles?.root,\n          ...customStyles?.container,\n        }),\n        positioner: styleProps(styles.positioner, undefined, { zIndex: zIndex ?? 114_514 }),\n        viewport: styleProps(\n          styles.viewport,\n          clsx('lobe-tooltip-viewport', classNames?.content),\n          customStyles?.content,\n        ),\n      };\n    }, [\n      className,\n      classNames?.arrow,\n      classNames?.container,\n      classNames?.content,\n      classNames?.root,\n      customStylesProp,\n      zIndex,\n    ]);\n\n    const triggerElement = useMemo(() => {\n      const popupTriggerId =\n        isValidElement(children) &&\n        (children as any).props['aria-haspopup'] !== undefined &&\n        (children as any).props.id !== undefined\n          ? (children as any).props.id\n          : undefined;\n\n      const baseTriggerProps = {\n        closeDelay: resolvedCloseDelay,\n        delay: resolvedOpenDelay,\n        disabled,\n        ...triggerProps,\n        id: popupTriggerId ?? triggerProps?.id,\n      };\n\n      if (isValidElement(children)) {\n        return (\n          <BaseTooltip.Trigger\n            {...baseTriggerProps}\n            render={(props) => {\n              // Base UI's trigger props include `type=\"button\"` by default.\n              // If we render into a non-<button> element, that prop is invalid and can warn.\n              const resolvedProps = (() => {\n                if (isNativeButtonTriggerElement) return props as any;\n                // eslint-disable-next-line unused-imports/no-unused-vars\n                const { type, ref: triggerRef, ...triggerRest } = props as any;\n                return triggerRest;\n              })();\n\n              const childProps = (children as any).props;\n              const mergedProps = mergeProps(restProps, childProps, resolvedProps);\n              const shouldPreservePopupTriggerId =\n                childProps['aria-haspopup'] !== undefined && childProps.id !== undefined;\n\n              return cloneElement(children as any, {\n                ...mergedProps,\n                id: shouldPreservePopupTriggerId ? childProps.id : mergedProps.id,\n                ref: mergeRefs([\n                  (children as any).ref,\n                  (props as any).ref,\n                  refProp,\n                  triggerCallbackRef,\n                ]),\n              });\n            }}\n          />\n        );\n      }\n\n      return (\n        <BaseTooltip.Trigger\n          {...baseTriggerProps}\n          ref={mergeRefs([refProp, triggerCallbackRef]) as Ref<HTMLButtonElement>}\n        >\n          {children}\n        </BaseTooltip.Trigger>\n      );\n    }, [\n      children,\n      disabled,\n      isNativeButtonTriggerElement,\n      refProp,\n      resolvedCloseDelay,\n      resolvedOpenDelay,\n      restProps,\n      triggerCallbackRef,\n      triggerProps,\n    ]);\n\n    const customContainer = useMemo(() => {\n      if (popupContainer) return popupContainer;\n      if (!getPopupContainer || !isClient || !triggerNode) return undefined;\n      return getPopupContainer(triggerNode);\n    }, [popupContainer, getPopupContainer, isClient, triggerNode]);\n\n    const popup = useMemo(\n      () => (\n        <BaseTooltip.Positioner\n          align={placementConfig.align}\n          data-placement={placement}\n          side={placementConfig.side}\n          sideOffset={baseSideOffset}\n          {...slots.positioner}\n          {...positionerProps}\n          collisionPadding={positionerProps?.collisionPadding ?? getFloatingCollisionPadding()}\n        >\n          <BaseTooltip.Popup {...slots.popup} {...popupProps}>\n            {arrow && <BaseTooltip.Arrow {...slots.arrow}>{TooltipArrowIcon}</BaseTooltip.Arrow>}\n            <BaseTooltip.Viewport {...slots.viewport}>\n              <TooltipContent hotkey={hotkey} hotkeyProps={hotkeyProps} title={title} />\n            </BaseTooltip.Viewport>\n          </BaseTooltip.Popup>\n        </BaseTooltip.Positioner>\n      ),\n      [\n        arrow,\n        baseSideOffset,\n        hotkey,\n        hotkeyProps,\n        placement,\n        placementConfig.align,\n        placementConfig.side,\n        popupProps,\n        positionerProps,\n        slots,\n        title,\n      ],\n    );\n\n    if (title == null && !hotkey) {\n      return children;\n    }\n\n    const resolvedPortalContainer = customContainer ?? portalContainer;\n\n    return (\n      <BaseTooltip.Root\n        defaultOpen={defaultOpen}\n        disabled={disabled}\n        open={resolvedOpen}\n        onOpenChange={handleOpenChange}\n      >\n        {triggerElement}\n        {resolvedPortalContainer ? (\n          <BaseTooltip.Portal container={resolvedPortalContainer} {...portalProps}>\n            {popup}\n          </BaseTooltip.Portal>\n        ) : null}\n      </BaseTooltip.Root>\n    );\n  },\n);\n\nTooltipStandalone.displayName = 'TooltipStandalone';\n"],"mappings":"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"}
+{"version":3,"file":"TooltipStandalone.mjs","names":["clsx","BaseTooltip"],"sources":["../../src/Tooltip/TooltipStandalone.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';\nimport clsx from 'clsx';\nimport {\n  cloneElement,\n  isValidElement,\n  memo,\n  type Ref,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { useAppElement } from '@/ConfigProvider/AppElementContext';\nimport { useFloatingLayer } from '@/hooks/useFloatingLayer';\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { getFloatingCollisionPadding } from '@/internal/floating';\nimport { styleProps } from '@/styles/stylex/props';\nimport { mergeRefs } from '@/utils/mergeRefs';\nimport { placementMap } from '@/utils/placement';\n\nimport { TooltipArrowIcon } from './ArrowIcon';\nimport { styles } from './style';\nimport TooltipContent from './TooltipContent';\nimport { type TooltipProps } from './type';\n\nconst DEFAULT_OPEN_DELAY = 400;\nconst DEFAULT_CLOSE_DELAY = 100;\n\n/**\n * Tooltip component - displays small contextual hints on hover/focus\n * Compatible with Ant Design Tooltip-like API (subset)\n */\nexport const TooltipStandalone = memo<TooltipProps>(\n  ({\n    children,\n    title,\n    arrow = false,\n    className,\n    classNames,\n    closeDelay,\n    defaultOpen = false,\n    disabled = false,\n    getPopupContainer,\n    hotkey,\n    hotkeyProps,\n    mouseEnterDelay,\n    mouseLeaveDelay,\n    onOpenChange,\n    open,\n    openDelay,\n    placement = 'top',\n    popupContainer,\n    styles: customStylesProp,\n    zIndex,\n    ref: refProp,\n    positionerProps,\n    triggerProps,\n    popupProps,\n    portalProps,\n    standalone: _standalone,\n    ...restProps\n  }) => {\n    const isClient = useIsClient();\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n    const [triggerNode, setTriggerNode] = useState<HTMLElement | null>(null);\n    const triggerCallbackRef = useCallback((node: HTMLElement | null) => {\n      if (node) setTriggerNode(node);\n    }, []);\n\n    const mergedOpen = open ?? uncontrolledOpen;\n    const resolvedOpen = disabled ? false : mergedOpen;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean) => {\n        if (disabled && nextOpen) return;\n        onOpenChange?.(nextOpen);\n        if (open === undefined) {\n          setUncontrolledOpen(nextOpen);\n        }\n      },\n      [disabled, onOpenChange, open],\n    );\n\n    const resolvedOpenDelay = useMemo(() => {\n      if (openDelay !== undefined) return openDelay;\n      if (mouseEnterDelay !== undefined) return mouseEnterDelay * 1000;\n      return DEFAULT_OPEN_DELAY;\n    }, [mouseEnterDelay, openDelay]);\n\n    const resolvedCloseDelay = useMemo(() => {\n      if (closeDelay !== undefined) return closeDelay;\n      if (mouseLeaveDelay !== undefined) return mouseLeaveDelay * 1000;\n      return DEFAULT_CLOSE_DELAY;\n    }, [closeDelay, mouseLeaveDelay]);\n\n    const placementConfig = placementMap[placement] ?? placementMap.top;\n    const baseSideOffset = arrow ? 8 : 6;\n\n    const appElement = useAppElement();\n    const floatingLayerContainer = useFloatingLayer();\n    const portalContainer = floatingLayerContainer ?? appElement;\n\n    const { isNativeButtonTriggerElement } = useNativeButton({\n      children,\n    });\n\n    const slots = useMemo(() => {\n      const customStyles = typeof customStylesProp === 'function' ? undefined : customStylesProp;\n      return {\n        arrow: styleProps(styles.arrow, classNames?.arrow, customStyles?.arrow),\n        popup: styleProps(styles.popup, clsx(className, classNames?.root, classNames?.container), {\n          ...customStyles?.root,\n          ...customStyles?.container,\n        }),\n        positioner: styleProps(styles.positioner, undefined, { zIndex: zIndex ?? 114_514 }),\n        viewport: styleProps(\n          styles.viewport,\n          clsx('lobe-tooltip-viewport', classNames?.content),\n          customStyles?.content,\n        ),\n      };\n    }, [\n      className,\n      classNames?.arrow,\n      classNames?.container,\n      classNames?.content,\n      classNames?.root,\n      customStylesProp,\n      zIndex,\n    ]);\n\n    const triggerElement = useMemo(() => {\n      const popupTriggerId =\n        isValidElement(children) &&\n        (children as any).props['aria-haspopup'] !== undefined &&\n        (children as any).props.id !== undefined\n          ? (children as any).props.id\n          : undefined;\n\n      const baseTriggerProps = {\n        closeDelay: resolvedCloseDelay,\n        delay: resolvedOpenDelay,\n        disabled,\n        ...triggerProps,\n        id: popupTriggerId ?? triggerProps?.id,\n      };\n\n      if (isValidElement(children)) {\n        return (\n          <BaseTooltip.Trigger\n            {...baseTriggerProps}\n            render={(props) => {\n              // Base UI's trigger props include `type=\"button\"` by default.\n              // If we render into a non-<button> element, that prop is invalid and can warn.\n              const resolvedProps = (() => {\n                if (isNativeButtonTriggerElement) return props as any;\n                // eslint-disable-next-line unused-imports/no-unused-vars\n                const { type, ref: triggerRef, ...triggerRest } = props as any;\n                return triggerRest;\n              })();\n\n              const childProps = (children as any).props;\n              const mergedProps = mergeProps(restProps, childProps, resolvedProps);\n              const shouldPreservePopupTriggerId =\n                childProps['aria-haspopup'] !== undefined && childProps.id !== undefined;\n\n              return cloneElement(children as any, {\n                ...mergedProps,\n                id: shouldPreservePopupTriggerId ? childProps.id : mergedProps.id,\n                ref: mergeRefs([\n                  (children as any).ref,\n                  (props as any).ref,\n                  refProp,\n                  triggerCallbackRef,\n                ]),\n              });\n            }}\n          />\n        );\n      }\n\n      return (\n        <BaseTooltip.Trigger\n          {...baseTriggerProps}\n          ref={mergeRefs([refProp, triggerCallbackRef]) as Ref<HTMLButtonElement>}\n        >\n          {children}\n        </BaseTooltip.Trigger>\n      );\n    }, [\n      children,\n      disabled,\n      isNativeButtonTriggerElement,\n      refProp,\n      resolvedCloseDelay,\n      resolvedOpenDelay,\n      restProps,\n      triggerCallbackRef,\n      triggerProps,\n    ]);\n\n    const customContainer = useMemo(() => {\n      if (popupContainer) return popupContainer;\n      if (!getPopupContainer || !isClient || !triggerNode) return undefined;\n      return getPopupContainer(triggerNode);\n    }, [popupContainer, getPopupContainer, isClient, triggerNode]);\n\n    const popup = useMemo(\n      () => (\n        <BaseTooltip.Positioner\n          align={placementConfig.align}\n          data-placement={placement}\n          side={placementConfig.side}\n          sideOffset={baseSideOffset}\n          {...slots.positioner}\n          {...positionerProps}\n          collisionPadding={positionerProps?.collisionPadding ?? getFloatingCollisionPadding()}\n        >\n          <BaseTooltip.Popup {...slots.popup} {...popupProps}>\n            {arrow && <BaseTooltip.Arrow {...slots.arrow}>{TooltipArrowIcon}</BaseTooltip.Arrow>}\n            <BaseTooltip.Viewport {...slots.viewport}>\n              <TooltipContent hotkey={hotkey} hotkeyProps={hotkeyProps} title={title} />\n            </BaseTooltip.Viewport>\n          </BaseTooltip.Popup>\n        </BaseTooltip.Positioner>\n      ),\n      [\n        arrow,\n        baseSideOffset,\n        hotkey,\n        hotkeyProps,\n        placement,\n        placementConfig.align,\n        placementConfig.side,\n        popupProps,\n        positionerProps,\n        slots,\n        title,\n      ],\n    );\n\n    if (title == null && !hotkey) {\n      return children;\n    }\n\n    const resolvedPortalContainer = customContainer ?? portalContainer;\n\n    return (\n      <BaseTooltip.Root\n        defaultOpen={defaultOpen}\n        disabled={disabled}\n        open={resolvedOpen}\n        onOpenChange={handleOpenChange}\n      >\n        {triggerElement}\n        {resolvedPortalContainer ? (\n          <BaseTooltip.Portal container={resolvedPortalContainer} {...portalProps}>\n            {popup}\n          </BaseTooltip.Portal>\n        ) : null}\n      </BaseTooltip.Root>\n    );\n  },\n);\n\nTooltipStandalone.displayName = 'TooltipStandalone';\n"],"mappings":"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"}

package/es/Tree/Tree.mjs

@@ -9,7 +9,7 @@ import { conductCheck, flattenVisible, getAllKeys, getAncestorKeys, getSubtreeKe
 import TreeNode from "./TreeNode.mjs";
 import { memo, useId, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 //#region src/Tree/Tree.tsx
 const EMPTY = [];
 const Tree = memo(({ blockNode = false, checkStrictly = false, checkable = false, checkedKeys: checkedKeysProp, className, classNames = {}, defaultCheckedKeys = EMPTY, defaultExpandAll = false, defaultExpandedKeys = EMPTY, defaultSelectedKeys = EMPTY, disabled = false, expandedKeys: expandedKeysProp, indent = 20, multiple = false, onCheck, onExpand, onRightClick, onSelect, scopeId: scopeIdProp, selectedKeys: selectedKeysProp, showIcon = false, showLine = false, size = "middle", style, styles: customStyles = {}, switcherIcon, titleRender, treeData, vimKeys = false }) => {
@@ -155,7 +155,7 @@ const Tree = memo(({ blockNode = false, checkStrictly = false, checkable = false
 		children: /* @__PURE__ */ jsx(FocusScope, {
 			id: scopeId,
 			role: "tree",
-			...styleProps(styles.root, clsx(classNames.root, className), {
+			...styleProps(styles.root, clsx$1(classNames.root, className), {
 				...customStyles.root,
 				...style
 			}),

package/es/Tree/Tree.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.mjs","names":[],"sources":["../../src/Tree/Tree.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { memo, useId, useMemo, useRef, useState } from 'react';\n\nimport { FocusScope, focusScopeItem, useScopeArrowNav } from '@/FocusScope';\nimport { useControlledState } from '@/hooks/useControlledState';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { TreeContext, type TreeContextValue } from './context';\nimport { styles } from './style';\nimport TreeNode from './TreeNode';\nimport type { TreeDataNode, TreeProps } from './type';\nimport { conductCheck, flattenVisible, getAllKeys, getAncestorKeys, getSubtreeKeys } from './utils';\n\nconst EMPTY: string[] = [];\n\nconst Tree = memo<TreeProps>(\n  ({\n    blockNode = false,\n    checkStrictly = false,\n    checkable = false,\n    checkedKeys: checkedKeysProp,\n    className,\n    classNames = {},\n    defaultCheckedKeys = EMPTY,\n    defaultExpandAll = false,\n    defaultExpandedKeys = EMPTY,\n    defaultSelectedKeys = EMPTY,\n    disabled = false,\n    expandedKeys: expandedKeysProp,\n    indent = 20,\n    multiple = false,\n    onCheck,\n    onExpand,\n    onRightClick,\n    onSelect,\n    scopeId: scopeIdProp,\n    selectedKeys: selectedKeysProp,\n    showIcon = false,\n    showLine = false,\n    size = 'middle',\n    style,\n    styles: customStyles = {},\n    switcherIcon,\n    titleRender,\n    treeData,\n    vimKeys = false,\n  }) => {\n    const generatedId = useId();\n    const scopeId = scopeIdProp ?? generatedId;\n    const [expandedKeys, setExpandedKeys] = useControlledState<string[]>(\n      defaultExpandAll ? getAllKeys(treeData) : defaultExpandedKeys,\n      { value: expandedKeysProp },\n    );\n    const [selectedKeys, setSelectedKeys] = useControlledState<string[]>(defaultSelectedKeys, {\n      value: selectedKeysProp,\n    });\n    const [checkedKeys, setCheckedKeys] = useControlledState<string[]>(defaultCheckedKeys, {\n      value: checkedKeysProp,\n    });\n\n    const expanded = useMemo(() => new Set(expandedKeys), [expandedKeys]);\n    const selected = useMemo(() => new Set(selectedKeys), [selectedKeys]);\n    const flat = useMemo(() => flattenVisible(treeData, expanded), [treeData, expanded]);\n    const { checked, halfChecked } = useMemo(\n      () =>\n        checkStrictly\n          ? { checked: new Set(checkedKeys), halfChecked: new Set<string>() }\n          : conductCheck(treeData, checkedKeys),\n      [checkStrictly, treeData, checkedKeys],\n    );\n\n    const [activeKeyState, setActiveKeyState] = useState<string | null>(null);\n    const setActiveKey = setActiveKeyState;\n    const activeKey =\n      activeKeyState && flat.some((row) => row.node.key === activeKeyState)\n        ? activeKeyState\n        : (selectedKeys.find((key) => flat.some((row) => row.node.key === key)) ??\n          flat[0]?.node.key ??\n          null);\n\n    const anchorRef = useRef<string | null>(null);\n\n    const rowOf = (key: string) =>\n      document.querySelector<HTMLElement>(`[data-focus-scope=\"${scopeId}\"] [data-id=\"${key}\"]`);\n    const focusRow = (key: string) => {\n      setActiveKey(key);\n      const row = rowOf(key);\n      if (row) focusScopeItem(scopeId, row);\n    };\n\n    const isDisabled = (node: TreeDataNode) => disabled || !!node.disabled;\n\n    const toggleExpand = (node: TreeDataNode) => {\n      const willExpand = !expanded.has(node.key);\n      const next = willExpand\n        ? [...expandedKeys, node.key]\n        : expandedKeys.filter((key) => key !== node.key);\n      setExpandedKeys(next);\n      onExpand?.(next, { expanded: willExpand, node });\n    };\n\n    const toggleSelect: TreeContextValue['toggleSelect'] = (node, event) => {\n      if (isDisabled(node) || node.selectable === false) return;\n      let next: string[];\n      if (multiple && event?.shiftKey && anchorRef.current) {\n        const a = flat.findIndex((row) => row.node.key === anchorRef.current);\n        const b = flat.findIndex((row) => row.node.key === node.key);\n        next = flat\n          .slice(Math.min(a, b), Math.max(a, b) + 1)\n          .filter((row) => !isDisabled(row.node) && row.node.selectable !== false)\n          .map((row) => row.node.key);\n      } else if (multiple && (event?.metaKey || event?.ctrlKey)) {\n        next = selected.has(node.key)\n          ? selectedKeys.filter((key) => key !== node.key)\n          : [...selectedKeys, node.key];\n        anchorRef.current = node.key;\n      } else {\n        next = [node.key];\n        anchorRef.current = node.key;\n      }\n      setSelectedKeys(next);\n      setActiveKey(node.key);\n      onSelect?.(next, { node, selected: next.includes(node.key) });\n    };\n\n    const toggleCheck = (node: TreeDataNode) => {\n      if (isDisabled(node) || node.checkable === false) return;\n      const willCheck = !checked.has(node.key);\n      const keys = checkStrictly ? [node.key] : getSubtreeKeys(node);\n      const base = new Set(checkStrictly ? checkedKeys : checked);\n      keys.forEach((key) => (willCheck ? base.add(key) : base.delete(key)));\n      if (!willCheck && !checkStrictly)\n        getAncestorKeys(treeData, node.key).forEach((key) => base.delete(key));\n      const next = checkStrictly ? [...base] : [...conductCheck(treeData, base).checked];\n      setCheckedKeys(next);\n      setActiveKey(node.key);\n      onCheck?.(next, { checked: willCheck, node });\n    };\n\n    const currentRow = () => {\n      const focused = document.activeElement?.closest<HTMLElement>('[role=\"treeitem\"]');\n      const key = focused?.dataset.id ?? activeKey;\n      return flat.find((row) => row.node.key === key);\n    };\n\n    const withRow =\n      (fn: (row: (typeof flat)[number], event: KeyboardEvent) => void) =>\n      (event: KeyboardEvent) => {\n        const row = currentRow();\n        if (row) fn(row, event);\n      };\n\n    useScopeArrowNav({\n      extra: {\n        ' ': withRow((row, event) => {\n          if (checkable && row.node.checkable !== false) toggleCheck(row.node);\n          else toggleSelect(row.node, event);\n        }),\n        '*': withRow((row) => {\n          const siblings = flat.filter(\n            (r) => r.parentKey === row.parentKey && r.hasChildren && !expanded.has(r.node.key),\n          );\n          if (siblings.length === 0) return;\n          const next = [...expandedKeys, ...siblings.map((r) => r.node.key)];\n          setExpandedKeys(next);\n          onExpand?.(next, { expanded: true, node: row.node });\n        }),\n        'ArrowLeft': withRow((row) => {\n          if (row.hasChildren && expanded.has(row.node.key)) toggleExpand(row.node);\n          else if (row.parentKey) focusRow(row.parentKey);\n        }),\n        'ArrowRight': withRow((row) => {\n          if (!row.hasChildren) return;\n          if (expanded.has(row.node.key)) focusRow(flat[row.index + 1].node.key);\n          else toggleExpand(row.node);\n        }),\n        'Enter': withRow((row, event) => toggleSelect(row.node, event)),\n      },\n      itemSelector: '[role=\"treeitem\"]',\n      onItemFocus: (el) => el.dataset.id && setActiveKey(el.dataset.id),\n      scopeId,\n      vimKeys,\n    });\n\n    const ctx: TreeContextValue = {\n      activeKey,\n      blockNode,\n      checkable,\n      checked,\n      classNames,\n      disabled,\n      expanded,\n      halfChecked,\n      indent,\n      onRightClick: (event, node) => onRightClick?.({ event, node }),\n      selected,\n      setActiveKey,\n      showIcon,\n      showLine,\n      size,\n      styles: customStyles,\n      switcherIcon,\n      titleRender,\n      toggleCheck,\n      toggleExpand,\n      toggleSelect,\n    };\n\n    return (\n      <TreeContext value={ctx}>\n        <FocusScope\n          id={scopeId}\n          role=\"tree\"\n          {...styleProps(styles.root, clsx(classNames.root, className), {\n            ...customStyles.root,\n            ...style,\n          })}\n        >\n          {treeData.map((node, i) => (\n            <TreeNode\n              depth={0}\n              isLast={i === treeData.length - 1}\n              key={node.key}\n              node={node}\n              trail={[]}\n            />\n          ))}\n        </FocusScope>\n      </TreeContext>\n    );\n  },\n);\n\nTree.displayName = 'Tree';\n\nexport default Tree;\n"],"mappings":"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"}
+{"version":3,"file":"Tree.mjs","names":["clsx"],"sources":["../../src/Tree/Tree.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { memo, useId, useMemo, useRef, useState } from 'react';\n\nimport { FocusScope, focusScopeItem, useScopeArrowNav } from '@/FocusScope';\nimport { useControlledState } from '@/hooks/useControlledState';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { TreeContext, type TreeContextValue } from './context';\nimport { styles } from './style';\nimport TreeNode from './TreeNode';\nimport type { TreeDataNode, TreeProps } from './type';\nimport { conductCheck, flattenVisible, getAllKeys, getAncestorKeys, getSubtreeKeys } from './utils';\n\nconst EMPTY: string[] = [];\n\nconst Tree = memo<TreeProps>(\n  ({\n    blockNode = false,\n    checkStrictly = false,\n    checkable = false,\n    checkedKeys: checkedKeysProp,\n    className,\n    classNames = {},\n    defaultCheckedKeys = EMPTY,\n    defaultExpandAll = false,\n    defaultExpandedKeys = EMPTY,\n    defaultSelectedKeys = EMPTY,\n    disabled = false,\n    expandedKeys: expandedKeysProp,\n    indent = 20,\n    multiple = false,\n    onCheck,\n    onExpand,\n    onRightClick,\n    onSelect,\n    scopeId: scopeIdProp,\n    selectedKeys: selectedKeysProp,\n    showIcon = false,\n    showLine = false,\n    size = 'middle',\n    style,\n    styles: customStyles = {},\n    switcherIcon,\n    titleRender,\n    treeData,\n    vimKeys = false,\n  }) => {\n    const generatedId = useId();\n    const scopeId = scopeIdProp ?? generatedId;\n    const [expandedKeys, setExpandedKeys] = useControlledState<string[]>(\n      defaultExpandAll ? getAllKeys(treeData) : defaultExpandedKeys,\n      { value: expandedKeysProp },\n    );\n    const [selectedKeys, setSelectedKeys] = useControlledState<string[]>(defaultSelectedKeys, {\n      value: selectedKeysProp,\n    });\n    const [checkedKeys, setCheckedKeys] = useControlledState<string[]>(defaultCheckedKeys, {\n      value: checkedKeysProp,\n    });\n\n    const expanded = useMemo(() => new Set(expandedKeys), [expandedKeys]);\n    const selected = useMemo(() => new Set(selectedKeys), [selectedKeys]);\n    const flat = useMemo(() => flattenVisible(treeData, expanded), [treeData, expanded]);\n    const { checked, halfChecked } = useMemo(\n      () =>\n        checkStrictly\n          ? { checked: new Set(checkedKeys), halfChecked: new Set<string>() }\n          : conductCheck(treeData, checkedKeys),\n      [checkStrictly, treeData, checkedKeys],\n    );\n\n    const [activeKeyState, setActiveKeyState] = useState<string | null>(null);\n    const setActiveKey = setActiveKeyState;\n    const activeKey =\n      activeKeyState && flat.some((row) => row.node.key === activeKeyState)\n        ? activeKeyState\n        : (selectedKeys.find((key) => flat.some((row) => row.node.key === key)) ??\n          flat[0]?.node.key ??\n          null);\n\n    const anchorRef = useRef<string | null>(null);\n\n    const rowOf = (key: string) =>\n      document.querySelector<HTMLElement>(`[data-focus-scope=\"${scopeId}\"] [data-id=\"${key}\"]`);\n    const focusRow = (key: string) => {\n      setActiveKey(key);\n      const row = rowOf(key);\n      if (row) focusScopeItem(scopeId, row);\n    };\n\n    const isDisabled = (node: TreeDataNode) => disabled || !!node.disabled;\n\n    const toggleExpand = (node: TreeDataNode) => {\n      const willExpand = !expanded.has(node.key);\n      const next = willExpand\n        ? [...expandedKeys, node.key]\n        : expandedKeys.filter((key) => key !== node.key);\n      setExpandedKeys(next);\n      onExpand?.(next, { expanded: willExpand, node });\n    };\n\n    const toggleSelect: TreeContextValue['toggleSelect'] = (node, event) => {\n      if (isDisabled(node) || node.selectable === false) return;\n      let next: string[];\n      if (multiple && event?.shiftKey && anchorRef.current) {\n        const a = flat.findIndex((row) => row.node.key === anchorRef.current);\n        const b = flat.findIndex((row) => row.node.key === node.key);\n        next = flat\n          .slice(Math.min(a, b), Math.max(a, b) + 1)\n          .filter((row) => !isDisabled(row.node) && row.node.selectable !== false)\n          .map((row) => row.node.key);\n      } else if (multiple && (event?.metaKey || event?.ctrlKey)) {\n        next = selected.has(node.key)\n          ? selectedKeys.filter((key) => key !== node.key)\n          : [...selectedKeys, node.key];\n        anchorRef.current = node.key;\n      } else {\n        next = [node.key];\n        anchorRef.current = node.key;\n      }\n      setSelectedKeys(next);\n      setActiveKey(node.key);\n      onSelect?.(next, { node, selected: next.includes(node.key) });\n    };\n\n    const toggleCheck = (node: TreeDataNode) => {\n      if (isDisabled(node) || node.checkable === false) return;\n      const willCheck = !checked.has(node.key);\n      const keys = checkStrictly ? [node.key] : getSubtreeKeys(node);\n      const base = new Set(checkStrictly ? checkedKeys : checked);\n      keys.forEach((key) => (willCheck ? base.add(key) : base.delete(key)));\n      if (!willCheck && !checkStrictly)\n        getAncestorKeys(treeData, node.key).forEach((key) => base.delete(key));\n      const next = checkStrictly ? [...base] : [...conductCheck(treeData, base).checked];\n      setCheckedKeys(next);\n      setActiveKey(node.key);\n      onCheck?.(next, { checked: willCheck, node });\n    };\n\n    const currentRow = () => {\n      const focused = document.activeElement?.closest<HTMLElement>('[role=\"treeitem\"]');\n      const key = focused?.dataset.id ?? activeKey;\n      return flat.find((row) => row.node.key === key);\n    };\n\n    const withRow =\n      (fn: (row: (typeof flat)[number], event: KeyboardEvent) => void) =>\n      (event: KeyboardEvent) => {\n        const row = currentRow();\n        if (row) fn(row, event);\n      };\n\n    useScopeArrowNav({\n      extra: {\n        ' ': withRow((row, event) => {\n          if (checkable && row.node.checkable !== false) toggleCheck(row.node);\n          else toggleSelect(row.node, event);\n        }),\n        '*': withRow((row) => {\n          const siblings = flat.filter(\n            (r) => r.parentKey === row.parentKey && r.hasChildren && !expanded.has(r.node.key),\n          );\n          if (siblings.length === 0) return;\n          const next = [...expandedKeys, ...siblings.map((r) => r.node.key)];\n          setExpandedKeys(next);\n          onExpand?.(next, { expanded: true, node: row.node });\n        }),\n        'ArrowLeft': withRow((row) => {\n          if (row.hasChildren && expanded.has(row.node.key)) toggleExpand(row.node);\n          else if (row.parentKey) focusRow(row.parentKey);\n        }),\n        'ArrowRight': withRow((row) => {\n          if (!row.hasChildren) return;\n          if (expanded.has(row.node.key)) focusRow(flat[row.index + 1].node.key);\n          else toggleExpand(row.node);\n        }),\n        'Enter': withRow((row, event) => toggleSelect(row.node, event)),\n      },\n      itemSelector: '[role=\"treeitem\"]',\n      onItemFocus: (el) => el.dataset.id && setActiveKey(el.dataset.id),\n      scopeId,\n      vimKeys,\n    });\n\n    const ctx: TreeContextValue = {\n      activeKey,\n      blockNode,\n      checkable,\n      checked,\n      classNames,\n      disabled,\n      expanded,\n      halfChecked,\n      indent,\n      onRightClick: (event, node) => onRightClick?.({ event, node }),\n      selected,\n      setActiveKey,\n      showIcon,\n      showLine,\n      size,\n      styles: customStyles,\n      switcherIcon,\n      titleRender,\n      toggleCheck,\n      toggleExpand,\n      toggleSelect,\n    };\n\n    return (\n      <TreeContext value={ctx}>\n        <FocusScope\n          id={scopeId}\n          role=\"tree\"\n          {...styleProps(styles.root, clsx(classNames.root, className), {\n            ...customStyles.root,\n            ...style,\n          })}\n        >\n          {treeData.map((node, i) => (\n            <TreeNode\n              depth={0}\n              isLast={i === treeData.length - 1}\n              key={node.key}\n              node={node}\n              trail={[]}\n            />\n          ))}\n        </FocusScope>\n      </TreeContext>\n    );\n  },\n);\n\nTree.displayName = 'Tree';\n\nexport default Tree;\n"],"mappings":"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"}

package/es/Tree/TreeNode.mjs

@@ -9,7 +9,7 @@ import { useTreeContext } from "./context.mjs";
 import { hasChildren } from "./utils.mjs";
 import { memo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 import { ChevronRight, File, Folder } from "lucide-react";
 import { Collapsible } from "@base-ui/react/collapsible";
@@ -84,7 +84,7 @@ const TreeNode = memo(({ node, depth, isLast, trail }) => {
 				"aria-hidden": true,
 				tabIndex: -1,
 				type: "button",
-				...styleProps([styles.switcher, !expandable && styles.switcherLeaf], clsx("lobe-tree-switcher", ctx.classNames.switcher), ctx.styles.switcher),
+				...styleProps([styles.switcher, !expandable && styles.switcherLeaf], clsx$1("lobe-tree-switcher", ctx.classNames.switcher), ctx.styles.switcher),
 				onClick: (event) => {
 					event.stopPropagation();
 					ctx.toggleExpand(node);

package/es/Tree/TreeNode.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TreeNode.mjs","names":["isExpandable","Checkbox"],"sources":["../../src/Tree/TreeNode.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport { Collapsible } from '@base-ui/react/collapsible';\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { ChevronRight, File, Folder } from 'lucide-react';\nimport { type CSSProperties, memo, type MouseEvent } from 'react';\n\nimport { Checkbox } from '@/Checkbox';\nimport Icon from '@/Icon';\nimport { controlHeight } from '@/internal/controlSize';\nimport { focusRing } from '@/styles/stylex/focusRing';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { useTreeContext } from './context';\nimport { styles } from './style';\nimport type { TreeDataNode } from './type';\nimport { hasChildren as isExpandable } from './utils';\n\ninterface TreeNodeProps {\n  depth: number;\n  isLast: boolean;\n  node: TreeDataNode;\n  trail: boolean[];\n}\n\nconst ARC = 6;\nconst SWITCHER_CENTER = 11.5;\n\nconst guidePath = (\n  depth: number,\n  isLast: boolean,\n  trail: boolean[],\n  indent: number,\n  height: number,\n) => {\n  const cx = (i: number) => i * indent + SWITCHER_CENTER;\n  let d = '';\n  trail.forEach((more, i) => {\n    if (more && i > 0) d += `M${cx(i)} 0V${height}`;\n  });\n  const x = cx(depth - 1);\n  const y = height / 2;\n  const elbow = `M${x} ${y - ARC}A${ARC} ${ARC} 0 0 0 ${x + ARC} ${y}H${x + indent - 2}`;\n  d += isLast\n    ? `M${x} 0V${y - ARC}${elbow.slice(elbow.indexOf('A'))}`\n    : `M${x} 0V${height}${elbow}`;\n  return d;\n};\n\nconst TreeNode = memo<TreeNodeProps>(({ node, depth, isLast, trail }) => {\n  const ctx = useTreeContext();\n  const expandable = isExpandable(node);\n  const expanded = expandable && ctx.expanded.has(node.key);\n  const disabled = ctx.disabled || !!node.disabled;\n  const selected = ctx.selected.has(node.key);\n  const checkable = ctx.checkable && node.checkable !== false;\n  const checkState = ctx.checked.has(node.key)\n    ? 'checked'\n    : ctx.halfChecked.has(node.key)\n      ? 'mixed'\n      : 'unchecked';\n  const rowHeight =\n    typeof ctx.styles.node?.height === 'number' ? ctx.styles.node.height : controlHeight[ctx.size];\n\n  const switcherIcon =\n    typeof ctx.switcherIcon === 'function'\n      ? ctx.switcherIcon({ expanded, node })\n      : (ctx.switcherIcon ?? <Icon icon={ChevronRight} size={14} />);\n\n  const rowStyle: CSSProperties = {\n    height: rowHeight,\n    paddingInlineStart: depth * ctx.indent,\n    ...ctx.styles.node,\n  };\n\n  const select = (event: MouseEvent) => ctx.toggleSelect(node, event);\n\n  return (\n    <>\n      <div\n        data-scope-item\n        aria-disabled={disabled || undefined}\n        aria-expanded={expandable ? expanded : undefined}\n        aria-level={depth + 1}\n        aria-selected={selected}\n        data-id={node.key}\n        role=\"treeitem\"\n        tabIndex={ctx.activeKey === node.key ? 0 : -1}\n        aria-checked={\n          checkable ? (checkState === 'mixed' ? 'mixed' : checkState === 'checked') : undefined\n        }\n        {...styleProps(\n          [\n            styles.node,\n            focusRing.info,\n            ctx.blockNode && [\n              styles.nodeBlock,\n              disabled\n                ? selected && styles.nodeDisabledSelected\n                : selected\n                  ? styles.nodeSelected\n                  : styles.nodeHover,\n            ],\n            disabled && styles.nodeDisabled,\n          ],\n          ctx.classNames.node,\n          rowStyle,\n        )}\n        onClick={ctx.blockNode ? select : undefined}\n        onContextMenu={(event) => ctx.onRightClick(event, node)}\n        onFocus={() => ctx.setActiveKey(node.key)}\n      >\n        {ctx.showLine && depth > 0 && (\n          <svg\n            aria-hidden\n            height={rowHeight}\n            width={depth * ctx.indent}\n            {...styleProps(styles.guide, ctx.classNames.guide, ctx.styles.guide)}\n          >\n            <path\n              {...stylex.props(styles.guidePath)}\n              d={guidePath(depth, isLast, trail, ctx.indent, rowHeight)}\n            />\n          </svg>\n        )}\n        <button\n          aria-hidden\n          tabIndex={-1}\n          type=\"button\"\n          {...styleProps(\n            [styles.switcher, !expandable && styles.switcherLeaf],\n            clsx('lobe-tree-switcher', ctx.classNames.switcher),\n            ctx.styles.switcher,\n          )}\n          onClick={(event) => {\n            event.stopPropagation();\n            ctx.toggleExpand(node);\n          }}\n        >\n          {switcherIcon}\n        </button>\n        {checkable && (\n          <Checkbox\n            checked={checkState === 'checked'}\n            className={stylex.props(styles.checkbox).className}\n            disabled={disabled}\n            indeterminate={checkState === 'mixed'}\n            onChange={() => ctx.toggleCheck(node)}\n            onClick={(event) => event.stopPropagation()}\n          />\n        )}\n        {ctx.showIcon && (\n          <span {...stylex.props(styles.icon)}>\n            {node.icon ?? <Icon icon={expandable ? Folder : File} size={16} />}\n          </span>\n        )}\n        <span\n          {...styleProps(\n            [\n              styles.title,\n              ctx.blockNode\n                ? styles.titleBlock\n                : [\n                    styles.titleInline,\n                    selected && styles.titleInlineSelected,\n                    disabled && styles.titleInlineDisabled,\n                  ],\n            ],\n            ctx.classNames.title,\n            ctx.styles.title,\n          )}\n          onClick={ctx.blockNode ? undefined : select}\n        >\n          {ctx.titleRender ? ctx.titleRender(node) : node.title}\n        </span>\n      </div>\n      {expandable && (\n        <Collapsible.Root open={expanded}>\n          <Collapsible.Panel className={stylex.props(styles.panel).className}>\n            {node.children!.map((child, i) => (\n              <TreeNode\n                depth={depth + 1}\n                isLast={i === node.children!.length - 1}\n                key={child.key}\n                node={child}\n                trail={[...trail, !isLast]}\n              />\n            ))}\n          </Collapsible.Panel>\n        </Collapsible.Root>\n      )}\n    </>\n  );\n});\n\nTreeNode.displayName = 'TreeNode';\n\nexport default TreeNode;\n"],"mappings":"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"}
+{"version":3,"file":"TreeNode.mjs","names":["isExpandable","clsx","Checkbox"],"sources":["../../src/Tree/TreeNode.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport { Collapsible } from '@base-ui/react/collapsible';\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { ChevronRight, File, Folder } from 'lucide-react';\nimport { type CSSProperties, memo, type MouseEvent } from 'react';\n\nimport { Checkbox } from '@/Checkbox';\nimport Icon from '@/Icon';\nimport { controlHeight } from '@/internal/controlSize';\nimport { focusRing } from '@/styles/stylex/focusRing';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { useTreeContext } from './context';\nimport { styles } from './style';\nimport type { TreeDataNode } from './type';\nimport { hasChildren as isExpandable } from './utils';\n\ninterface TreeNodeProps {\n  depth: number;\n  isLast: boolean;\n  node: TreeDataNode;\n  trail: boolean[];\n}\n\nconst ARC = 6;\nconst SWITCHER_CENTER = 11.5;\n\nconst guidePath = (\n  depth: number,\n  isLast: boolean,\n  trail: boolean[],\n  indent: number,\n  height: number,\n) => {\n  const cx = (i: number) => i * indent + SWITCHER_CENTER;\n  let d = '';\n  trail.forEach((more, i) => {\n    if (more && i > 0) d += `M${cx(i)} 0V${height}`;\n  });\n  const x = cx(depth - 1);\n  const y = height / 2;\n  const elbow = `M${x} ${y - ARC}A${ARC} ${ARC} 0 0 0 ${x + ARC} ${y}H${x + indent - 2}`;\n  d += isLast\n    ? `M${x} 0V${y - ARC}${elbow.slice(elbow.indexOf('A'))}`\n    : `M${x} 0V${height}${elbow}`;\n  return d;\n};\n\nconst TreeNode = memo<TreeNodeProps>(({ node, depth, isLast, trail }) => {\n  const ctx = useTreeContext();\n  const expandable = isExpandable(node);\n  const expanded = expandable && ctx.expanded.has(node.key);\n  const disabled = ctx.disabled || !!node.disabled;\n  const selected = ctx.selected.has(node.key);\n  const checkable = ctx.checkable && node.checkable !== false;\n  const checkState = ctx.checked.has(node.key)\n    ? 'checked'\n    : ctx.halfChecked.has(node.key)\n      ? 'mixed'\n      : 'unchecked';\n  const rowHeight =\n    typeof ctx.styles.node?.height === 'number' ? ctx.styles.node.height : controlHeight[ctx.size];\n\n  const switcherIcon =\n    typeof ctx.switcherIcon === 'function'\n      ? ctx.switcherIcon({ expanded, node })\n      : (ctx.switcherIcon ?? <Icon icon={ChevronRight} size={14} />);\n\n  const rowStyle: CSSProperties = {\n    height: rowHeight,\n    paddingInlineStart: depth * ctx.indent,\n    ...ctx.styles.node,\n  };\n\n  const select = (event: MouseEvent) => ctx.toggleSelect(node, event);\n\n  return (\n    <>\n      <div\n        data-scope-item\n        aria-disabled={disabled || undefined}\n        aria-expanded={expandable ? expanded : undefined}\n        aria-level={depth + 1}\n        aria-selected={selected}\n        data-id={node.key}\n        role=\"treeitem\"\n        tabIndex={ctx.activeKey === node.key ? 0 : -1}\n        aria-checked={\n          checkable ? (checkState === 'mixed' ? 'mixed' : checkState === 'checked') : undefined\n        }\n        {...styleProps(\n          [\n            styles.node,\n            focusRing.info,\n            ctx.blockNode && [\n              styles.nodeBlock,\n              disabled\n                ? selected && styles.nodeDisabledSelected\n                : selected\n                  ? styles.nodeSelected\n                  : styles.nodeHover,\n            ],\n            disabled && styles.nodeDisabled,\n          ],\n          ctx.classNames.node,\n          rowStyle,\n        )}\n        onClick={ctx.blockNode ? select : undefined}\n        onContextMenu={(event) => ctx.onRightClick(event, node)}\n        onFocus={() => ctx.setActiveKey(node.key)}\n      >\n        {ctx.showLine && depth > 0 && (\n          <svg\n            aria-hidden\n            height={rowHeight}\n            width={depth * ctx.indent}\n            {...styleProps(styles.guide, ctx.classNames.guide, ctx.styles.guide)}\n          >\n            <path\n              {...stylex.props(styles.guidePath)}\n              d={guidePath(depth, isLast, trail, ctx.indent, rowHeight)}\n            />\n          </svg>\n        )}\n        <button\n          aria-hidden\n          tabIndex={-1}\n          type=\"button\"\n          {...styleProps(\n            [styles.switcher, !expandable && styles.switcherLeaf],\n            clsx('lobe-tree-switcher', ctx.classNames.switcher),\n            ctx.styles.switcher,\n          )}\n          onClick={(event) => {\n            event.stopPropagation();\n            ctx.toggleExpand(node);\n          }}\n        >\n          {switcherIcon}\n        </button>\n        {checkable && (\n          <Checkbox\n            checked={checkState === 'checked'}\n            className={stylex.props(styles.checkbox).className}\n            disabled={disabled}\n            indeterminate={checkState === 'mixed'}\n            onChange={() => ctx.toggleCheck(node)}\n            onClick={(event) => event.stopPropagation()}\n          />\n        )}\n        {ctx.showIcon && (\n          <span {...stylex.props(styles.icon)}>\n            {node.icon ?? <Icon icon={expandable ? Folder : File} size={16} />}\n          </span>\n        )}\n        <span\n          {...styleProps(\n            [\n              styles.title,\n              ctx.blockNode\n                ? styles.titleBlock\n                : [\n                    styles.titleInline,\n                    selected && styles.titleInlineSelected,\n                    disabled && styles.titleInlineDisabled,\n                  ],\n            ],\n            ctx.classNames.title,\n            ctx.styles.title,\n          )}\n          onClick={ctx.blockNode ? undefined : select}\n        >\n          {ctx.titleRender ? ctx.titleRender(node) : node.title}\n        </span>\n      </div>\n      {expandable && (\n        <Collapsible.Root open={expanded}>\n          <Collapsible.Panel className={stylex.props(styles.panel).className}>\n            {node.children!.map((child, i) => (\n              <TreeNode\n                depth={depth + 1}\n                isLast={i === node.children!.length - 1}\n                key={child.key}\n                node={child}\n                trail={[...trail, !isLast]}\n              />\n            ))}\n          </Collapsible.Panel>\n        </Collapsible.Root>\n      )}\n    </>\n  );\n});\n\nTreeNode.displayName = 'TreeNode';\n\nexport default TreeNode;\n"],"mappings":"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"}

package/es/Video/Video.mjs

@@ -8,11 +8,11 @@ import Frame from "./parts/Frame.mjs";
 import LoadError from "./parts/LoadError.mjs";
 import Root from "./parts/Root.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 //#region src/Video/Video.tsx
 const Overlay = ({ render }) => /* @__PURE__ */ jsx(Fragment, { children: render(useVideo()) });
 const Video = ({ className, classNames, frameStep, overlay, style, styles: customStyles, thumbnails = true, ...rest }) => /* @__PURE__ */ jsx(Root, {
-	className: clsx(className, classNames?.root),
+	className: clsx$1(className, classNames?.root),
 	style: {
 		...customStyles?.root,
 		...style

package/es/Video/Video.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Video.mjs","names":[],"sources":["../../src/Video/Video.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\n\nimport Caption from './parts/Caption';\nimport CenterPlay from './parts/CenterPlay';\nimport Controls from './parts/Controls';\nimport Frame from './parts/Frame';\nimport LoadError from './parts/LoadError';\nimport Root from './parts/Root';\nimport Timeline from './parts/Timeline';\nimport type { VideoProps, VideoState } from './type';\nimport { useVideo } from './useVideo';\n\nconst Overlay = ({ render }: { render: (state: VideoState) => React.ReactNode }) => (\n  <>{render(useVideo())}</>\n);\n\nconst Video = ({\n  className,\n  classNames,\n  frameStep,\n  overlay,\n  style,\n  styles: customStyles,\n  thumbnails = true,\n  ...rest\n}: VideoProps) => (\n  <Root\n    className={clsx(className, classNames?.root)}\n    style={{ ...customStyles?.root, ...style }}\n    {...rest}\n  >\n    <Frame className={classNames?.frame} style={customStyles?.frame}>\n      {overlay && <Overlay render={overlay} />}\n      <Caption />\n      <CenterPlay />\n      <Controls\n        className={classNames?.controls}\n        frameStep={frameStep}\n        style={customStyles?.controls}\n      >\n        <Timeline\n          className={classNames?.timeline}\n          style={customStyles?.timeline}\n          thumbnails={thumbnails}\n        />\n      </Controls>\n      <LoadError />\n    </Frame>\n  </Root>\n);\n\nVideo.displayName = 'Video';\n\nexport default Video;\n"],"mappings":";;;;;;;;;;;;AAcA,MAAM,WAAW,EAAE,aACjB,oBAAA,UAAA,EAAA,UAAG,OAAO,SAAS,CAAC,EAAI,CAAA;AAG1B,MAAM,SAAS,EACb,WACA,YACA,WACA,SACA,OACA,QAAQ,cACR,aAAa,MACb,GAAG,WAEH,oBAAC,MAAD;CACE,WAAW,KAAK,WAAW,YAAY,IAAI;CAC3C,OAAO;EAAE,GAAG,cAAc;EAAM,GAAG;CAAM;CACzC,GAAI;CAEJ,UAAA,qBAAC,OAAD;EAAO,WAAW,YAAY;EAAO,OAAO,cAAc;EAA1D,UAAA;GACG,WAAW,oBAAC,SAAD,EAAS,QAAQ,QAAU,CAAA;GACvC,oBAAC,SAAD,CAAU,CAAA;GACV,oBAAC,YAAD,CAAa,CAAA;GACb,oBAAC,UAAD;IACE,WAAW,YAAY;IACZ;IACX,OAAO,cAAc;IAErB,UAAA,oBAAC,UAAD;KACE,WAAW,YAAY;KACvB,OAAO,cAAc;KACT;IACb,CAAA;GACO,CAAA;GACV,oBAAC,WAAD,CAAY,CAAA;EACP;;AACH,CAAA;AAGR,MAAM,cAAc"}
+{"version":3,"file":"Video.mjs","names":["clsx"],"sources":["../../src/Video/Video.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\n\nimport Caption from './parts/Caption';\nimport CenterPlay from './parts/CenterPlay';\nimport Controls from './parts/Controls';\nimport Frame from './parts/Frame';\nimport LoadError from './parts/LoadError';\nimport Root from './parts/Root';\nimport Timeline from './parts/Timeline';\nimport type { VideoProps, VideoState } from './type';\nimport { useVideo } from './useVideo';\n\nconst Overlay = ({ render }: { render: (state: VideoState) => React.ReactNode }) => (\n  <>{render(useVideo())}</>\n);\n\nconst Video = ({\n  className,\n  classNames,\n  frameStep,\n  overlay,\n  style,\n  styles: customStyles,\n  thumbnails = true,\n  ...rest\n}: VideoProps) => (\n  <Root\n    className={clsx(className, classNames?.root)}\n    style={{ ...customStyles?.root, ...style }}\n    {...rest}\n  >\n    <Frame className={classNames?.frame} style={customStyles?.frame}>\n      {overlay && <Overlay render={overlay} />}\n      <Caption />\n      <CenterPlay />\n      <Controls\n        className={classNames?.controls}\n        frameStep={frameStep}\n        style={customStyles?.controls}\n      >\n        <Timeline\n          className={classNames?.timeline}\n          style={customStyles?.timeline}\n          thumbnails={thumbnails}\n        />\n      </Controls>\n      <LoadError />\n    </Frame>\n  </Root>\n);\n\nVideo.displayName = 'Video';\n\nexport default Video;\n"],"mappings":";;;;;;;;;;;;AAcA,MAAM,WAAW,EAAE,aACjB,oBAAA,UAAA,EAAA,UAAG,OAAO,SAAS,CAAC,EAAI,CAAA;AAG1B,MAAM,SAAS,EACb,WACA,YACA,WACA,SACA,OACA,QAAQ,cACR,aAAa,MACb,GAAG,WAEH,oBAAC,MAAD;CACE,WAAWA,OAAK,WAAW,YAAY,IAAI;CAC3C,OAAO;EAAE,GAAG,cAAc;EAAM,GAAG;CAAM;CACzC,GAAI;CAEJ,UAAA,qBAAC,OAAD;EAAO,WAAW,YAAY;EAAO,OAAO,cAAc;EAA1D,UAAA;GACG,WAAW,oBAAC,SAAD,EAAS,QAAQ,QAAU,CAAA;GACvC,oBAAC,SAAD,CAAU,CAAA;GACV,oBAAC,YAAD,CAAa,CAAA;GACb,oBAAC,UAAD;IACE,WAAW,YAAY;IACZ;IACX,OAAO,cAAc;IAErB,UAAA,oBAAC,UAAD;KACE,WAAW,YAAY;KACvB,OAAO,cAAc;KACT;IACb,CAAA;GACO,CAAA;GACV,oBAAC,WAAD,CAAY,CAAA;EACP;;AACH,CAAA;AAGR,MAAM,cAAc"}

package/es/awesome/Features/FeatureItem.mjs

@@ -9,7 +9,7 @@ import Text from "../../Text/Text.mjs";
 import { childStyles, styles } from "./style.mjs";
 import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 //#region src/awesome/Features/FeatureItem.tsx
 const Image = memo(({ image, className, title, style }) => {
@@ -32,7 +32,7 @@ const Item = memo(({ style, className, row, column, description, image, title, l
 		"--features-title-hover-size": hasLink ? "14px" : "20px"
 	}), [rowNumber, hasLink]);
 	return /* @__PURE__ */ jsx("div", {
-		...styleProps(styles.container, clsx("lobe-features-item", className), {
+		...styleProps(styles.container, clsx$1("lobe-features-item", className), {
 			...cssVariables,
 			gridColumn: `span ${column || 1}`,
 			gridRow: `span ${rowNumber}`,

package/es/awesome/Features/FeatureItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FeatureItem.mjs","names":["Flexbox"],"sources":["../../../src/awesome/Features/FeatureItem.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { type CSSProperties, memo, useMemo } from 'react';\n\nimport A from '@/A';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\nimport { styleProps } from '@/styles/stylex/props';\nimport Text from '@/Text';\n\nimport { childStyles, styles } from './style';\nimport type { FeatureItemProps } from './type';\n\nconst Image = memo<{ className?: string; image: string; style?: CSSProperties; title: string }>(\n  ({ image, className, title, style }) => {\n    return image.startsWith('http') ? (\n      <Img alt={title} className={className} src={image} style={style} />\n    ) : (\n      <Center className={className} style={style}>\n        {image}\n      </Center>\n    );\n  },\n);\n\nconst Item = memo<FeatureItemProps>(\n  ({\n    style,\n    className,\n    row,\n    column,\n    description,\n    image,\n    title,\n    link,\n    icon,\n    imageStyle,\n    openExternal,\n    ...rest\n  }) => {\n    const rowNumber = row || 7;\n    const hasLink = Boolean(link);\n\n    const cssVariables = useMemo<Record<string, string>>(\n      () => ({\n        '--features-row-num': String(rowNumber),\n        '--features-title-hover-size': hasLink ? '14px' : '20px',\n      }),\n      [rowNumber, hasLink],\n    );\n\n    return (\n      <div\n        {...styleProps(styles.container, clsx('lobe-features-item', className), {\n          ...cssVariables,\n          gridColumn: `span ${column || 1}`,\n          gridRow: `span ${rowNumber}`,\n          ...style,\n        })}\n        {...rest}\n      >\n        <div {...stylex.props(styles.cell)}>\n          {image ||\n            (icon && (\n              <Center {...styleProps(styles.imgContainer, undefined, imageStyle)}>\n                {icon && <Icon icon={icon} style={childStyles.img} />}\n                {image && <Image image={image} style={childStyles.img} title={title} />}\n              </Center>\n            ))}\n          {title && (\n            <Flexbox\n              horizontal\n              align={'center'}\n              as={'h3'}\n              className={stylex.props(styles.title).className}\n              gap={8}\n            >\n              {title}\n            </Flexbox>\n          )}\n          {description && (\n            <Text\n              style={childStyles.desc}\n              ellipsis={{\n                rows: 4,\n              }}\n            >\n              {description}\n            </Text>\n          )}\n          {link && (\n            <div {...stylex.props(styles.link)}>\n              <A href={link} rel=\"noreferrer\" target={openExternal ? '_blank' : undefined}>\n                Read More\n              </A>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  },\n);\n\nItem.displayName = 'FeatureItem';\n\nexport default Item;\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,QAAQ,MAKV,EACF,OACA,WACA,OACA,YACI;CACJ,OAAO,MAAM,WAAW,MAAM,IAAI,oBAAC,KAAD;EAAK,KAAK;EAAkB;EAAW,KAAK;EAAc;CAAQ,CAAA,IAAI,oBAAC,QAAD;EAAmB;EAAkB;EACtI,UAAA;CACK,CAAA;AACd,CAAC;AACD,MAAM,OAAO,MAAwB,EACnC,OACA,WACA,KACA,QACA,aACA,OACA,OACA,MACA,MACA,YACA,cACA,GAAG,WACC;CACJ,MAAM,YAAY,OAAO;CACzB,MAAM,UAAU,QAAQ,IAAI;CAC5B,MAAM,eAAe,eAAuC;EAC1D,sBAAsB,OAAO,SAAS;EACtC,+BAA+B,UAAU,SAAS;CACpD,IAAI,CAAC,WAAW,OAAO,CAAC;CACxB,OAAO,oBAAC,OAAD;EAAK,GAAI,WAAW,OAAO,WAAW,KAAK,sBAAsB,SAAS,GAAG;GAClF,GAAG;GACH,YAAY,QAAQ,UAAU;GAC9B,SAAS,QAAQ;GACjB,GAAG;EACL,CAAC;EAAG,GAAI;EACF,UAAA,qBAAC,OAAD;GAAK,GAAI,OAAO,MAAM,OAAO,IAAI;GAAjC,UAAA;IACG,SAAS,QAAQ,qBAAC,QAAD;KAAQ,GAAI,WAAW,OAAO,cAAc,KAAA,GAAW,UAAU;KAAjE,UAAA,CACX,QAAQ,oBAAC,MAAD;MAAY;MAAM,OAAO,YAAY;KAAM,CAAA,GACnD,SAAS,oBAAC,OAAD;MAAc;MAAO,OAAO,YAAY;MAAY;KAAQ,CAAA,CAChE;;IACX,SAAS,oBAACA,mBAAD;KAAS,YAAA;KAAW,OAAO;KAAU,IAAI;KAAM,WAAW,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC;KAAW,KAAK;KAC1G,UAAA;IACM,CAAA;IACV,eAAe,oBAAC,MAAD;KAAM,OAAO,YAAY;KAAM,UAAU,EAC3D,MAAM,EACR;KACS,UAAA;IACG,CAAA;IACP,QAAQ,oBAAC,OAAD;KAAK,GAAI,OAAO,MAAM,OAAO,IAAI;KACtC,UAAA,oBAAC,GAAD;MAAG,MAAM;MAAM,KAAI;MAAa,QAAQ,eAAe,WAAW,KAAA;MAAW,UAAA;KAE1E,CAAA;IACA,CAAA;GACJ;;CACF,CAAA;AACX,CAAC;AACD,KAAK,cAAc"}
+{"version":3,"file":"FeatureItem.mjs","names":["clsx","Flexbox"],"sources":["../../../src/awesome/Features/FeatureItem.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { type CSSProperties, memo, useMemo } from 'react';\n\nimport A from '@/A';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\nimport { styleProps } from '@/styles/stylex/props';\nimport Text from '@/Text';\n\nimport { childStyles, styles } from './style';\nimport type { FeatureItemProps } from './type';\n\nconst Image = memo<{ className?: string; image: string; style?: CSSProperties; title: string }>(\n  ({ image, className, title, style }) => {\n    return image.startsWith('http') ? (\n      <Img alt={title} className={className} src={image} style={style} />\n    ) : (\n      <Center className={className} style={style}>\n        {image}\n      </Center>\n    );\n  },\n);\n\nconst Item = memo<FeatureItemProps>(\n  ({\n    style,\n    className,\n    row,\n    column,\n    description,\n    image,\n    title,\n    link,\n    icon,\n    imageStyle,\n    openExternal,\n    ...rest\n  }) => {\n    const rowNumber = row || 7;\n    const hasLink = Boolean(link);\n\n    const cssVariables = useMemo<Record<string, string>>(\n      () => ({\n        '--features-row-num': String(rowNumber),\n        '--features-title-hover-size': hasLink ? '14px' : '20px',\n      }),\n      [rowNumber, hasLink],\n    );\n\n    return (\n      <div\n        {...styleProps(styles.container, clsx('lobe-features-item', className), {\n          ...cssVariables,\n          gridColumn: `span ${column || 1}`,\n          gridRow: `span ${rowNumber}`,\n          ...style,\n        })}\n        {...rest}\n      >\n        <div {...stylex.props(styles.cell)}>\n          {image ||\n            (icon && (\n              <Center {...styleProps(styles.imgContainer, undefined, imageStyle)}>\n                {icon && <Icon icon={icon} style={childStyles.img} />}\n                {image && <Image image={image} style={childStyles.img} title={title} />}\n              </Center>\n            ))}\n          {title && (\n            <Flexbox\n              horizontal\n              align={'center'}\n              as={'h3'}\n              className={stylex.props(styles.title).className}\n              gap={8}\n            >\n              {title}\n            </Flexbox>\n          )}\n          {description && (\n            <Text\n              style={childStyles.desc}\n              ellipsis={{\n                rows: 4,\n              }}\n            >\n              {description}\n            </Text>\n          )}\n          {link && (\n            <div {...stylex.props(styles.link)}>\n              <A href={link} rel=\"noreferrer\" target={openExternal ? '_blank' : undefined}>\n                Read More\n              </A>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  },\n);\n\nItem.displayName = 'FeatureItem';\n\nexport default Item;\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,QAAQ,MAKV,EACF,OACA,WACA,OACA,YACI;CACJ,OAAO,MAAM,WAAW,MAAM,IAAI,oBAAC,KAAD;EAAK,KAAK;EAAkB;EAAW,KAAK;EAAc;CAAQ,CAAA,IAAI,oBAAC,QAAD;EAAmB;EAAkB;EACtI,UAAA;CACK,CAAA;AACd,CAAC;AACD,MAAM,OAAO,MAAwB,EACnC,OACA,WACA,KACA,QACA,aACA,OACA,OACA,MACA,MACA,YACA,cACA,GAAG,WACC;CACJ,MAAM,YAAY,OAAO;CACzB,MAAM,UAAU,QAAQ,IAAI;CAC5B,MAAM,eAAe,eAAuC;EAC1D,sBAAsB,OAAO,SAAS;EACtC,+BAA+B,UAAU,SAAS;CACpD,IAAI,CAAC,WAAW,OAAO,CAAC;CACxB,OAAO,oBAAC,OAAD;EAAK,GAAI,WAAW,OAAO,WAAWA,OAAK,sBAAsB,SAAS,GAAG;GAClF,GAAG;GACH,YAAY,QAAQ,UAAU;GAC9B,SAAS,QAAQ;GACjB,GAAG;EACL,CAAC;EAAG,GAAI;EACF,UAAA,qBAAC,OAAD;GAAK,GAAI,OAAO,MAAM,OAAO,IAAI;GAAjC,UAAA;IACG,SAAS,QAAQ,qBAAC,QAAD;KAAQ,GAAI,WAAW,OAAO,cAAc,KAAA,GAAW,UAAU;KAAjE,UAAA,CACX,QAAQ,oBAAC,MAAD;MAAY;MAAM,OAAO,YAAY;KAAM,CAAA,GACnD,SAAS,oBAAC,OAAD;MAAc;MAAO,OAAO,YAAY;MAAY;KAAQ,CAAA,CAChE;;IACX,SAAS,oBAACC,mBAAD;KAAS,YAAA;KAAW,OAAO;KAAU,IAAI;KAAM,WAAW,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC;KAAW,KAAK;KAC1G,UAAA;IACM,CAAA;IACV,eAAe,oBAAC,MAAD;KAAM,OAAO,YAAY;KAAM,UAAU,EAC3D,MAAM,EACR;KACS,UAAA;IACG,CAAA;IACP,QAAQ,oBAAC,OAAD;KAAK,GAAI,OAAO,MAAM,OAAO,IAAI;KACtC,UAAA,oBAAC,GAAD;MAAG,MAAM;MAAM,KAAI;MAAa,QAAQ,eAAe,WAAW,KAAA;MAAW,UAAA;KAE1E,CAAA;IACA,CAAA;GACJ;;CACF,CAAA;AACX,CAAC;AACD,KAAK,cAAc"}

package/es/awesome/Hero/Hero.mjs

@@ -11,14 +11,14 @@ import GithubIcon from "../../icons/lucideExtra/GithubIcon.mjs";
 import { styles } from "./style.mjs";
 import { memo, useCallback } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 //#region src/awesome/Hero/Hero.tsx
 const Hero = memo(({ title, description, actions, Link }) => {
 	const { mobile } = useResponsive();
 	const LinkRender = Link || A;
 	const ButtonGroups = useCallback(() => Boolean(actions?.length) && /* @__PURE__ */ jsx("div", {
-		className: clsx(stylex.props(styles.actions).className, "lobe-hero-actions"),
+		className: clsx$1(stylex.props(styles.actions).className, "lobe-hero-actions"),
 		children: actions.map(({ text, link, openExternal, github, type }, index) => {
 			const content = type === "primary" ? /* @__PURE__ */ jsx(GradientButton, {
 				block: mobile,
@@ -62,7 +62,7 @@ const Hero = memo(({ title, description, actions, Link }) => {
 				title && /* @__PURE__ */ jsx(Center, {
 					horizontal: true,
 					as: "h1",
-					className: clsx(stylex.props(styles.title).className, "lobe-hero-title"),
+					className: clsx$1(stylex.props(styles.title).className, "lobe-hero-title"),
 					dangerouslySetInnerHTML: { __html: title },
 					gap: "0.25em",
 					wrap: "wrap"

package/es/awesome/Hero/Hero.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Hero.mjs","names":["Flexbox"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport { GithubIcon } from '@lobehub/ui/icons';\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo, useCallback } from 'react';\n\nimport A from '@/A';\nimport AuroraBackground from '@/awesome/AuroraBackground';\nimport GradientButton from '@/awesome/GradientButton';\nimport Button from '@/Button';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport { useResponsive } from '@/styles/theme/scope';\n\nimport { styles } from './style';\nimport { type HeroProps } from './type';\n\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\n  const { mobile } = useResponsive();\n\n  const LinkRender = Link || A;\n\n  const ButtonGroups = useCallback(\n    () =>\n      Boolean(actions?.length) && (\n        <div className={clsx(stylex.props(styles.actions).className, 'lobe-hero-actions')}>\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\n            const content =\n              type === 'primary' ? (\n                <GradientButton\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                >\n                  {text}\n                </GradientButton>\n              ) : (\n                <Button\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                  type=\"primary\"\n                >\n                  {text}\n                </Button>\n              );\n\n            return openExternal ? (\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\n                {content}\n              </A>\n            ) : (\n              <LinkRender key={text} to={link}>\n                {content}\n              </LinkRender>\n            );\n          })}\n        </div>\n      ),\n    [actions],\n  );\n\n  return (\n    <>\n      <AuroraBackground />\n      <Flexbox align={'center'} style={{ fontSize: 16, zIndex: 1 }}>\n        <Flexbox\n          horizontal\n          className={stylex.props(styles.container).className}\n          distribution={'center'}\n        >\n          <Center>\n            {title && (\n              <Center\n                horizontal\n                as={'h1'}\n                className={clsx(stylex.props(styles.title).className, 'lobe-hero-title')}\n                dangerouslySetInnerHTML={{ __html: title }}\n                gap={'0.25em'}\n                wrap={'wrap'}\n              />\n            )}\n            {description && (\n              <p {...stylex.props(styles.desc)} dangerouslySetInnerHTML={{ __html: description }} />\n            )}\n            <ButtonGroups />\n          </Center>\n        </Flexbox>\n      </Flexbox>\n    </>\n  );\n});\n\nHero.displayName = 'Hero';\n\nexport default Hero;\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAC5B,OACA,aACA,SACA,WACI;CACJ,MAAM,EACJ,WACE,cAAc;CAClB,MAAM,aAAa,QAAQ;CAC3B,MAAM,eAAe,kBAAkB,QAAQ,SAAS,MAAM,KAAK,oBAAC,OAAD;EAAK,WAAW,KAAK,OAAO,MAAM,OAAO,OAAO,CAAC,CAAC,WAAW,mBAAmB;EAC1I,UAAA,QAAS,KAAK,EACnB,MACA,MACA,cACA,QACA,QACC,UAAU;GACX,MAAM,UAAU,SAAS,YAAY,oBAAC,gBAAD;IAAgB,OAAO;IAAQ,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAAuB,MAAK;IACzI,UAAA;GACa,GAFgH,KAEhH,IAAI,oBAAC,QAAD;IAAQ,OAAO;IAAQ,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAAuB,MAAK;IAAQ,MAAK;IACvI,UAAA;GACK,GAFyG,KAEzG;GAClB,OAAO,eAAe,oBAAC,GAAD;IAAG,MAAM;IAAiB,QAAQ,eAAe,WAAW,KAAA;IACvE,UAAA;GACA,GAF+B,IAE/B,IAAI,oBAAC,YAAD;IAAuB,IAAI;IAC/B,UAAA;GACS,GAFY,IAEZ;EACtB,CAAC;CACQ,CAAA,GAAG,CAAC,OAAO,CAAC;CACvB,OAAO,qBAAA,YAAA,EAAA,UAAA,CACH,oBAAC,kBAAD,CAAmB,CAAA,GACnB,oBAACA,mBAAD;EAAS,OAAO;EAAU,OAAO;GACjC,UAAU;GACV,QAAQ;EACV;EACI,UAAA,oBAACA,mBAAD;GAAS,YAAA;GAAW,WAAW,OAAO,MAAM,OAAO,SAAS,CAAC,CAAC;GAAW,cAAc;GACrF,UAAA,qBAAC,QAAD,EAAA,UAAA;IACG,SAAS,oBAAC,QAAD;KAAQ,YAAA;KAAW,IAAI;KAAM,WAAW,KAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,iBAAiB;KAAG,yBAAyB,EAC1I,QAAQ,MACV;KAAG,KAAK;KAAU,MAAM;IAAS,CAAA;IAC9B,eAAe,oBAAC,KAAD;KAAG,GAAI,OAAO,MAAM,OAAO,IAAI;KAAG,yBAAyB,EAC3E,QAAQ,YACV;IAAI,CAAA;IACF,oBAAC,cAAD,CAAe,CAAA;GACT,EAAA,CAAA;EACD,CAAA;CACF,CAAA,CACT,EAAA,CAAA;AACN,CAAC;AACD,KAAK,cAAc"}
+{"version":3,"file":"Hero.mjs","names":["clsx","Flexbox"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport { GithubIcon } from '@lobehub/ui/icons';\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo, useCallback } from 'react';\n\nimport A from '@/A';\nimport AuroraBackground from '@/awesome/AuroraBackground';\nimport GradientButton from '@/awesome/GradientButton';\nimport Button from '@/Button';\nimport { Center, Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport { useResponsive } from '@/styles/theme/scope';\n\nimport { styles } from './style';\nimport { type HeroProps } from './type';\n\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\n  const { mobile } = useResponsive();\n\n  const LinkRender = Link || A;\n\n  const ButtonGroups = useCallback(\n    () =>\n      Boolean(actions?.length) && (\n        <div className={clsx(stylex.props(styles.actions).className, 'lobe-hero-actions')}>\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\n            const content =\n              type === 'primary' ? (\n                <GradientButton\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                >\n                  {text}\n                </GradientButton>\n              ) : (\n                <Button\n                  block={mobile}\n                  icon={github ? <Icon icon={GithubIcon} size={18} /> : undefined}\n                  key={index}\n                  size=\"large\"\n                  type=\"primary\"\n                >\n                  {text}\n                </Button>\n              );\n\n            return openExternal ? (\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\n                {content}\n              </A>\n            ) : (\n              <LinkRender key={text} to={link}>\n                {content}\n              </LinkRender>\n            );\n          })}\n        </div>\n      ),\n    [actions],\n  );\n\n  return (\n    <>\n      <AuroraBackground />\n      <Flexbox align={'center'} style={{ fontSize: 16, zIndex: 1 }}>\n        <Flexbox\n          horizontal\n          className={stylex.props(styles.container).className}\n          distribution={'center'}\n        >\n          <Center>\n            {title && (\n              <Center\n                horizontal\n                as={'h1'}\n                className={clsx(stylex.props(styles.title).className, 'lobe-hero-title')}\n                dangerouslySetInnerHTML={{ __html: title }}\n                gap={'0.25em'}\n                wrap={'wrap'}\n              />\n            )}\n            {description && (\n              <p {...stylex.props(styles.desc)} dangerouslySetInnerHTML={{ __html: description }} />\n            )}\n            <ButtonGroups />\n          </Center>\n        </Flexbox>\n      </Flexbox>\n    </>\n  );\n});\n\nHero.displayName = 'Hero';\n\nexport default Hero;\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAC5B,OACA,aACA,SACA,WACI;CACJ,MAAM,EACJ,WACE,cAAc;CAClB,MAAM,aAAa,QAAQ;CAC3B,MAAM,eAAe,kBAAkB,QAAQ,SAAS,MAAM,KAAK,oBAAC,OAAD;EAAK,WAAWA,OAAK,OAAO,MAAM,OAAO,OAAO,CAAC,CAAC,WAAW,mBAAmB;EAC1I,UAAA,QAAS,KAAK,EACnB,MACA,MACA,cACA,QACA,QACC,UAAU;GACX,MAAM,UAAU,SAAS,YAAY,oBAAC,gBAAD;IAAgB,OAAO;IAAQ,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAAuB,MAAK;IACzI,UAAA;GACa,GAFgH,KAEhH,IAAI,oBAAC,QAAD;IAAQ,OAAO;IAAQ,MAAM,SAAS,oBAAC,MAAD;KAAM,MAAM;KAAY,MAAM;IAAK,CAAA,IAAI,KAAA;IAAuB,MAAK;IAAQ,MAAK;IACvI,UAAA;GACK,GAFyG,KAEzG;GAClB,OAAO,eAAe,oBAAC,GAAD;IAAG,MAAM;IAAiB,QAAQ,eAAe,WAAW,KAAA;IACvE,UAAA;GACA,GAF+B,IAE/B,IAAI,oBAAC,YAAD;IAAuB,IAAI;IAC/B,UAAA;GACS,GAFY,IAEZ;EACtB,CAAC;CACQ,CAAA,GAAG,CAAC,OAAO,CAAC;CACvB,OAAO,qBAAA,YAAA,EAAA,UAAA,CACH,oBAAC,kBAAD,CAAmB,CAAA,GACnB,oBAACC,mBAAD;EAAS,OAAO;EAAU,OAAO;GACjC,UAAU;GACV,QAAQ;EACV;EACI,UAAA,oBAACA,mBAAD;GAAS,YAAA;GAAW,WAAW,OAAO,MAAM,OAAO,SAAS,CAAC,CAAC;GAAW,cAAc;GACrF,UAAA,qBAAC,QAAD,EAAA,UAAA;IACG,SAAS,oBAAC,QAAD;KAAQ,YAAA;KAAW,IAAI;KAAM,WAAWD,OAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,iBAAiB;KAAG,yBAAyB,EAC1I,QAAQ,MACV;KAAG,KAAK;KAAU,MAAM;IAAS,CAAA;IAC9B,eAAe,oBAAC,KAAD;KAAG,GAAI,OAAO,MAAM,OAAO,IAAI;KAAG,yBAAyB,EAC3E,QAAQ,YACV;IAAI,CAAA;IACF,oBAAC,cAAD,CAAe,CAAA;GACT,EAAA,CAAA;EACD,CAAA;CACF,CAAA,CACT,EAAA,CAAA;AACN,CAAC;AACD,KAAK,cAAc"}

package/es/awesome/InstallBanner/InstallBanner.mjs

@@ -4,7 +4,7 @@ import Snippet from "../../Snippet/Snippet.mjs";
 import { styles } from "./style.mjs";
 import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 //#region src/awesome/InstallBanner/InstallBanner.tsx
 const InstallBanner = memo(({ className, command, footnote, prefix = "$", style, title, ...rest }) => /* @__PURE__ */ jsx("section", {
@@ -24,7 +24,7 @@ const InstallBanner = memo(({ className, command, footnote, prefix = "$", style,
 				children: command
 			}),
 			footnote && /* @__PURE__ */ jsx("p", {
-				className: clsx(stylex.props(styles.footnote).className, "lobe-install-banner-footnote"),
+				className: clsx$1(stylex.props(styles.footnote).className, "lobe-install-banner-footnote"),
 				children: footnote
 			})
 		]

package/es/awesome/InstallBanner/InstallBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InstallBanner.mjs","names":[],"sources":["../../../src/awesome/InstallBanner/InstallBanner.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\nimport Snippet from '@/Snippet';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { styles } from './style';\nimport type { InstallBannerProps } from './type';\n\nconst InstallBanner = memo<InstallBannerProps>(\n  ({ className, command, footnote, prefix = '$', style, title, ...rest }) => (\n    <section {...styleProps(styles.root, className, style)} {...rest}>\n      <div {...stylex.props(styles.content)}>\n        {title && <h2 {...stylex.props(styles.title)}>{title}</h2>}\n        <Snippet language={'bash'} prefix={prefix} style={{ borderRadius: 999 }}>\n          {command}\n        </Snippet>\n        {footnote && (\n          <p\n            className={clsx(\n              stylex.props(styles.footnote).className,\n              'lobe-install-banner-footnote',\n            )}\n          >\n            {footnote}\n          </p>\n        )}\n      </div>\n    </section>\n  ),\n);\n\nInstallBanner.displayName = 'InstallBanner';\n\nexport default InstallBanner;\n"],"mappings":";;;;;;;;;AAUA,MAAM,gBAAgB,MAA0B,EAC9C,WACA,SACA,UACA,SAAS,KACT,OACA,OACA,GAAG,WACC,oBAAC,WAAD;CAAS,GAAI,WAAW,OAAO,MAAM,WAAW,KAAK;CAAG,GAAI;CAC5D,UAAA,qBAAC,OAAD;EAAK,GAAI,OAAO,MAAM,OAAO,OAAO;EAApC,UAAA;GACG,SAAS,oBAAC,MAAD;IAAI,GAAI,OAAO,MAAM,OAAO,KAAK;IAAI,UAAA;GAAU,CAAA;GACzD,oBAAC,SAAD;IAAS,UAAU;IAAgB;IAAQ,OAAO,EACpD,cAAc,IAChB;IACO,UAAA;GACM,CAAA;GACR,YAAY,oBAAC,KAAD;IAAG,WAAW,KAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,CAAC,WAAW,8BAA8B;IAClG,UAAA;GACA,CAAA;EACF;;AACE,CAAA,CAAC;AACd,cAAc,cAAc"}
+{"version":3,"file":"InstallBanner.mjs","names":["clsx"],"sources":["../../../src/awesome/InstallBanner/InstallBanner.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\nimport Snippet from '@/Snippet';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { styles } from './style';\nimport type { InstallBannerProps } from './type';\n\nconst InstallBanner = memo<InstallBannerProps>(\n  ({ className, command, footnote, prefix = '$', style, title, ...rest }) => (\n    <section {...styleProps(styles.root, className, style)} {...rest}>\n      <div {...stylex.props(styles.content)}>\n        {title && <h2 {...stylex.props(styles.title)}>{title}</h2>}\n        <Snippet language={'bash'} prefix={prefix} style={{ borderRadius: 999 }}>\n          {command}\n        </Snippet>\n        {footnote && (\n          <p\n            className={clsx(\n              stylex.props(styles.footnote).className,\n              'lobe-install-banner-footnote',\n            )}\n          >\n            {footnote}\n          </p>\n        )}\n      </div>\n    </section>\n  ),\n);\n\nInstallBanner.displayName = 'InstallBanner';\n\nexport default InstallBanner;\n"],"mappings":";;;;;;;;;AAUA,MAAM,gBAAgB,MAA0B,EAC9C,WACA,SACA,UACA,SAAS,KACT,OACA,OACA,GAAG,WACC,oBAAC,WAAD;CAAS,GAAI,WAAW,OAAO,MAAM,WAAW,KAAK;CAAG,GAAI;CAC5D,UAAA,qBAAC,OAAD;EAAK,GAAI,OAAO,MAAM,OAAO,OAAO;EAApC,UAAA;GACG,SAAS,oBAAC,MAAD;IAAI,GAAI,OAAO,MAAM,OAAO,KAAK;IAAI,UAAA;GAAU,CAAA;GACzD,oBAAC,SAAD;IAAS,UAAU;IAAgB;IAAQ,OAAO,EACpD,cAAc,IAChB;IACO,UAAA;GACM,CAAA;GACR,YAAY,oBAAC,KAAD;IAAG,WAAWA,OAAK,OAAO,MAAM,OAAO,QAAQ,CAAC,CAAC,WAAW,8BAA8B;IAClG,UAAA;GACA,CAAA;EACF;;AACE,CAAA,CAAC;AACd,cAAc,cAAc"}

package/es/awesome/LandingHero/LandingHero.mjs

@@ -4,7 +4,7 @@ import { LandingActions } from "../landingActions.mjs";
 import { styles } from "./style.mjs";
 import { memo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
+import clsx$1 from "clsx";
 import * as stylex from "@stylexjs/stylex";
 //#region src/awesome/LandingHero/LandingHero.tsx
 const LandingHero = memo(({ accent, actions, aside, badge, children, className, description, onNavigate, renderLink, style, title, ...rest }) => {
@@ -21,7 +21,7 @@ const LandingHero = memo(({ accent, actions, aside, badge, children, className,
 					...stylex.props(styles.intro, split && styles.introSplit),
 					children: [
 						badge && /* @__PURE__ */ jsx("div", {
-							className: clsx(stylex.props(styles.badge).className, "lobe-landing-hero-badge"),
+							className: clsx$1(stylex.props(styles.badge).className, "lobe-landing-hero-badge"),
 							children: badge
 						}),
 						/* @__PURE__ */ jsxs("h1", {
@@ -43,7 +43,7 @@ const LandingHero = memo(({ accent, actions, aside, badge, children, className,
 						})
 					]
 				}), aside && /* @__PURE__ */ jsx("div", {
-					className: clsx(stylex.props(styles.aside).className, "lobe-landing-hero-aside"),
+					className: clsx$1(stylex.props(styles.aside).className, "lobe-landing-hero-aside"),
 					children: aside
 				})]
 			}), children && /* @__PURE__ */ jsx("div", {

package/es/awesome/LandingHero/LandingHero.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LandingHero.mjs","names":[],"sources":["../../../src/awesome/LandingHero/LandingHero.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\nimport { LandingActions } from '@/awesome/landingActions';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { styles } from './style';\nimport type { LandingHeroProps } from './type';\n\nconst LandingHero = memo<LandingHeroProps>(\n  ({\n    accent,\n    actions,\n    aside,\n    badge,\n    children,\n    className,\n    description,\n    onNavigate,\n    renderLink,\n    style,\n    title,\n    ...rest\n  }) => {\n    const split = !!aside;\n\n    return (\n      <section\n        {...styleProps([styles.root, split && styles.rootSplit], className, style)}\n        data-layout={split ? 'split' : 'center'}\n        {...rest}\n      >\n        <div {...stylex.props(styles.content)}>\n          <div {...stylex.props(styles.main, split && styles.mainSplit)}>\n            <div {...stylex.props(styles.intro, split && styles.introSplit)}>\n              {badge && (\n                <div\n                  className={clsx(stylex.props(styles.badge).className, 'lobe-landing-hero-badge')}\n                >\n                  {badge}\n                </div>\n              )}\n              <h1 {...stylex.props(styles.title, split && styles.titleSplit)}>\n                {title}\n                {accent && (\n                  <>\n                    {' '}\n                    <span {...stylex.props(styles.accent)}>{accent}</span>\n                  </>\n                )}\n              </h1>\n              {description && <p {...stylex.props(styles.description)}>{description}</p>}\n              {actions && actions.length > 0 && (\n                <LandingActions\n                  actions={actions}\n                  renderLink={renderLink}\n                  xstyle={[styles.actions, split && styles.actionsSplit]}\n                  onNavigate={onNavigate}\n                />\n              )}\n            </div>\n            {aside && (\n              <div\n                className={clsx(stylex.props(styles.aside).className, 'lobe-landing-hero-aside')}\n              >\n                {aside}\n              </div>\n            )}\n          </div>\n          {children && <div {...stylex.props(styles.extra)}>{children}</div>}\n        </div>\n      </section>\n    );\n  },\n);\n\nLandingHero.displayName = 'LandingHero';\n\nexport default LandingHero;\n"],"mappings":";;;;;;;;;AAUA,MAAM,cAAc,MAAwB,EAC1C,QACA,SACA,OACA,OACA,UACA,WACA,aACA,YACA,YACA,OACA,OACA,GAAG,WACC;CACJ,MAAM,QAAQ,CAAC,CAAC;CAChB,OAAO,oBAAC,WAAD;EAAS,GAAI,WAAW,CAAC,OAAO,MAAM,SAAS,OAAO,SAAS,GAAG,WAAW,KAAK;EAAG,eAAa,QAAQ,UAAU;EAAU,GAAI;EACnI,UAAA,qBAAC,OAAD;GAAK,GAAI,OAAO,MAAM,OAAO,OAAO;GAApC,UAAA,CACE,qBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,MAAM,SAAS,OAAO,SAAS;IAA5D,UAAA,CACE,qBAAC,OAAD;KAAK,GAAI,OAAO,MAAM,OAAO,OAAO,SAAS,OAAO,UAAU;KAA9D,UAAA;MACG,SAAS,oBAAC,OAAD;OAAK,WAAW,KAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,yBAAyB;OACzF,UAAA;MACE,CAAA;MACP,qBAAC,MAAD;OAAI,GAAI,OAAO,MAAM,OAAO,OAAO,SAAS,OAAO,UAAU;OAA7D,UAAA,CACG,OACA,UAAU,qBAAA,YAAA,EAAA,UAAA,CACN,KACD,oBAAC,QAAD;QAAM,GAAI,OAAO,MAAM,OAAO,MAAM;QAAI,UAAA;OAAa,CAAA,CACrD,EAAA,CAAA,CACF;;MACH,eAAe,oBAAC,KAAD;OAAG,GAAI,OAAO,MAAM,OAAO,WAAW;OAAI,UAAA;MAAe,CAAA;MACxE,WAAW,QAAQ,SAAS,KAAK,oBAAC,gBAAD;OAAyB;OAAqB;OAAY,QAAQ,CAAC,OAAO,SAAS,SAAS,OAAO,YAAY;OAAe;MAAa,CAAA;KAC1K;IACJ,CAAA,GAAA,SAAS,oBAAC,OAAD;KAAK,WAAW,KAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,yBAAyB;KACzF,UAAA;IACE,CAAA,CACJ;GACJ,CAAA,GAAA,YAAY,oBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,KAAK;IAAI;GAAc,CAAA,CAC9D;;CACE,CAAA;AACf,CAAC;AACD,YAAY,cAAc"}
+{"version":3,"file":"LandingHero.mjs","names":["clsx"],"sources":["../../../src/awesome/LandingHero/LandingHero.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\nimport { LandingActions } from '@/awesome/landingActions';\nimport { styleProps } from '@/styles/stylex/props';\n\nimport { styles } from './style';\nimport type { LandingHeroProps } from './type';\n\nconst LandingHero = memo<LandingHeroProps>(\n  ({\n    accent,\n    actions,\n    aside,\n    badge,\n    children,\n    className,\n    description,\n    onNavigate,\n    renderLink,\n    style,\n    title,\n    ...rest\n  }) => {\n    const split = !!aside;\n\n    return (\n      <section\n        {...styleProps([styles.root, split && styles.rootSplit], className, style)}\n        data-layout={split ? 'split' : 'center'}\n        {...rest}\n      >\n        <div {...stylex.props(styles.content)}>\n          <div {...stylex.props(styles.main, split && styles.mainSplit)}>\n            <div {...stylex.props(styles.intro, split && styles.introSplit)}>\n              {badge && (\n                <div\n                  className={clsx(stylex.props(styles.badge).className, 'lobe-landing-hero-badge')}\n                >\n                  {badge}\n                </div>\n              )}\n              <h1 {...stylex.props(styles.title, split && styles.titleSplit)}>\n                {title}\n                {accent && (\n                  <>\n                    {' '}\n                    <span {...stylex.props(styles.accent)}>{accent}</span>\n                  </>\n                )}\n              </h1>\n              {description && <p {...stylex.props(styles.description)}>{description}</p>}\n              {actions && actions.length > 0 && (\n                <LandingActions\n                  actions={actions}\n                  renderLink={renderLink}\n                  xstyle={[styles.actions, split && styles.actionsSplit]}\n                  onNavigate={onNavigate}\n                />\n              )}\n            </div>\n            {aside && (\n              <div\n                className={clsx(stylex.props(styles.aside).className, 'lobe-landing-hero-aside')}\n              >\n                {aside}\n              </div>\n            )}\n          </div>\n          {children && <div {...stylex.props(styles.extra)}>{children}</div>}\n        </div>\n      </section>\n    );\n  },\n);\n\nLandingHero.displayName = 'LandingHero';\n\nexport default LandingHero;\n"],"mappings":";;;;;;;;;AAUA,MAAM,cAAc,MAAwB,EAC1C,QACA,SACA,OACA,OACA,UACA,WACA,aACA,YACA,YACA,OACA,OACA,GAAG,WACC;CACJ,MAAM,QAAQ,CAAC,CAAC;CAChB,OAAO,oBAAC,WAAD;EAAS,GAAI,WAAW,CAAC,OAAO,MAAM,SAAS,OAAO,SAAS,GAAG,WAAW,KAAK;EAAG,eAAa,QAAQ,UAAU;EAAU,GAAI;EACnI,UAAA,qBAAC,OAAD;GAAK,GAAI,OAAO,MAAM,OAAO,OAAO;GAApC,UAAA,CACE,qBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,MAAM,SAAS,OAAO,SAAS;IAA5D,UAAA,CACE,qBAAC,OAAD;KAAK,GAAI,OAAO,MAAM,OAAO,OAAO,SAAS,OAAO,UAAU;KAA9D,UAAA;MACG,SAAS,oBAAC,OAAD;OAAK,WAAWA,OAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,yBAAyB;OACzF,UAAA;MACE,CAAA;MACP,qBAAC,MAAD;OAAI,GAAI,OAAO,MAAM,OAAO,OAAO,SAAS,OAAO,UAAU;OAA7D,UAAA,CACG,OACA,UAAU,qBAAA,YAAA,EAAA,UAAA,CACN,KACD,oBAAC,QAAD;QAAM,GAAI,OAAO,MAAM,OAAO,MAAM;QAAI,UAAA;OAAa,CAAA,CACrD,EAAA,CAAA,CACF;;MACH,eAAe,oBAAC,KAAD;OAAG,GAAI,OAAO,MAAM,OAAO,WAAW;OAAI,UAAA;MAAe,CAAA;MACxE,WAAW,QAAQ,SAAS,KAAK,oBAAC,gBAAD;OAAyB;OAAqB;OAAY,QAAQ,CAAC,OAAO,SAAS,SAAS,OAAO,YAAY;OAAe;MAAa,CAAA;KAC1K;IACJ,CAAA,GAAA,SAAS,oBAAC,OAAD;KAAK,WAAWA,OAAK,OAAO,MAAM,OAAO,KAAK,CAAC,CAAC,WAAW,yBAAyB;KACzF,UAAA;IACE,CAAA,CACJ;GACJ,CAAA,GAAA,YAAY,oBAAC,OAAD;IAAK,GAAI,OAAO,MAAM,OAAO,KAAK;IAAI;GAAc,CAAA,CAC9D;;CACE,CAAA;AACf,CAAC;AACD,YAAY,cAAc"}