@lobehub/ui 5.57.3 → 6.0.0-beta.1

package/es/Hotkey/style.mjs

@@ -1,74 +1,39 @@
-import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
-import { createStaticStyles } from "antd-style";
-import { cva } from "class-variance-authority";
 //#region src/Hotkey/style.ts
-const styles = createStaticStyles(({ css, cssVar }) => {
-	return {
-		borderless: css`
-      ${staticStylish.variantBorderlessWithoutHover};
-      padding-inline: 4px;
-    `,
-		filled: staticStylish.variantFilledWithoutHover,
-		inverseThemeDark: css`
-      color: ${cssVar.colorTextTertiary};
-      background: color-mix(in srgb, ${cssVar.colorBgContainer} 8%, transparent);
-    `,
-		inverseThemeLight: css`
-      color: ${cssVar.colorTextTertiary};
-      background: color-mix(in srgb, ${cssVar.colorBgContainer} 16%, transparent);
-    `,
-		outlined: staticStylish.variantOutlinedWithoutHover,
-		root: css`
-      overflow: hidden;
-
-      min-width: 1.8em;
-      height: 1.8em;
-      padding-block: 0;
-      padding-inline: 8px;
-      border: none;
-      border-radius: ${cssVar.borderRadiusSM};
-
-      font-family: ${cssVar.fontFamily};
-      font-size: 12px;
-      line-height: 1.1;
-      color: ${cssVar.colorTextSecondary};
-      text-align: center;
-      white-space: nowrap;
-    `
-	};
-});
-const variants = cva(styles.root, {
-	compoundVariants: [{
-		class: styles.inverseThemeDark,
-		inverseTheme: true,
-		isDarkMode: true
-	}, {
-		class: styles.inverseThemeLight,
-		inverseTheme: true,
-		isDarkMode: false
-	}],
-	defaultVariants: {
-		inverseTheme: false,
-		isDarkMode: false,
-		variant: "filled"
+const styles = {
+	borderless: {
+		kg3NbH: "lbfn1xvj",
+		$$css: true
+	},
+	inverseThemeDark: {
+		kWkggS: "lb3as4cs",
+		kMwMTN: "lb53gy9q",
+		$$css: true
+	},
+	inverseThemeLight: {
+		kWkggS: "lb1tf3yqh",
+		kMwMTN: "lb53gy9q",
+		$$css: true
 	},
-	variants: {
-		inverseTheme: {
-			false: null,
-			true: null
-		},
-		isDarkMode: {
-			false: null,
-			true: null
-		},
-		variant: {
-			borderless: styles.borderless,
-			filled: styles.filled,
-			outlined: styles.outlined
-		}
+	root: {
+		kVAM5u: "lb181nr7w",
+		kaIpWk: "lb1vihcfj",
+		ksu8eU: "lbng3xce",
+		kMzoRj: "lbfn42iu",
+		kVQacm: "lbb3r6kr",
+		k8WAf4: "lbt970qd",
+		kg3NbH: "lbdqyycr",
+		kMwMTN: "lbc77et8",
+		kMv6JI: "lb10h9pxx",
+		kGuDYH: "lbfifm61",
+		kLWn49: "lb1159mfc",
+		k9WMMc: "lb2b8uid",
+		khDVqt: "lbuxw1ft",
+		kZKoxP: "lbunzqbk",
+		k7Eaqz: "lb1gtvfis",
+		$$css: true
 	}
-});
+};
 //#endregion
-export { styles, variants };
+export { styles };
 
 //# sourceMappingURL=style.mjs.map

package/es/Hotkey/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/Hotkey/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    borderless: css`\n      ${lobeStaticStylish.variantBorderlessWithoutHover};\n      padding-inline: 4px;\n    `,\n    filled: lobeStaticStylish.variantFilledWithoutHover,\n    inverseThemeDark: css`\n      color: ${cssVar.colorTextTertiary};\n      background: color-mix(in srgb, ${cssVar.colorBgContainer} 8%, transparent);\n    `,\n    inverseThemeLight: css`\n      color: ${cssVar.colorTextTertiary};\n      background: color-mix(in srgb, ${cssVar.colorBgContainer} 16%, transparent);\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    root: css`\n      overflow: hidden;\n\n      min-width: 1.8em;\n      height: 1.8em;\n      padding-block: 0;\n      padding-inline: 8px;\n      border: none;\n      border-radius: ${cssVar.borderRadiusSM};\n\n      font-family: ${cssVar.fontFamily};\n      font-size: 12px;\n      line-height: 1.1;\n      color: ${cssVar.colorTextSecondary};\n      text-align: center;\n      white-space: nowrap;\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  compoundVariants: [\n    {\n      class: styles.inverseThemeDark,\n      inverseTheme: true,\n      isDarkMode: true,\n    },\n    {\n      class: styles.inverseThemeLight,\n      inverseTheme: true,\n      isDarkMode: false,\n    },\n  ],\n  defaultVariants: {\n    inverseTheme: false,\n    isDarkMode: false,\n    variant: 'filled',\n  },\n\n  variants: {\n    inverseTheme: {\n      false: null,\n      true: null,\n    },\n    isDarkMode: {\n      false: null,\n      true: null,\n    },\n    variant: {\n      borderless: styles.borderless,\n      filled: styles.filled,\n      outlined: styles.outlined,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,YAAY,GAAG;QACXA,cAAkB,8BAA8B;;;EAGpD,QAAQA,cAAkB;EAC1B,kBAAkB,GAAG;eACV,OAAO,kBAAkB;uCACD,OAAO,iBAAiB;;EAE3D,mBAAmB,GAAG;eACX,OAAO,kBAAkB;uCACD,OAAO,iBAAiB;;EAE3D,UAAUA,cAAkB;EAC5B,MAAM,GAAG;;;;;;;;uBAQU,OAAO,eAAe;;qBAExB,OAAO,WAAW;;;eAGxB,OAAO,mBAAmB;;;;CAIvC;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,kBAAkB,CAChB;EACE,OAAO,OAAO;EACd,cAAc;EACd,YAAY;CACd,GACA;EACE,OAAO,OAAO;EACd,cAAc;EACd,YAAY;CACd,CACF;CACA,iBAAiB;EACf,cAAc;EACd,YAAY;EACZ,SAAS;CACX;CAEA,UAAU;EACR,cAAc;GACZ,OAAO;GACP,MAAM;EACR;EACA,YAAY;GACV,OAAO;GACP,MAAM;EACR;EACA,SAAS;GACP,YAAY,OAAO;GACnB,QAAQ,OAAO;GACf,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/Hotkey/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\n\nexport const styles = stylex.create({\n  borderless: {\n    paddingInline: 4,\n  },\n  inverseThemeDark: {\n    backgroundColor: `color-mix(in srgb, ${cssVar.colorBgContainer} 8%, transparent)`,\n    color: cssVar.colorTextTertiary,\n  },\n  inverseThemeLight: {\n    backgroundColor: `color-mix(in srgb, ${cssVar.colorBgContainer} 16%, transparent)`,\n    color: cssVar.colorTextTertiary,\n  },\n  root: {\n    borderColor: 'currentcolor',\n    borderRadius: cssVar.borderRadiusSM,\n    borderStyle: 'none',\n    borderWidth: 'medium',\n    overflow: 'hidden',\n    paddingBlock: 0,\n    paddingInline: 8,\n    color: cssVar.colorTextSecondary,\n    fontFamily: cssVar.fontFamily,\n    fontSize: 12,\n    lineHeight: 1.1,\n    textAlign: 'center',\n    whiteSpace: 'nowrap',\n    height: '1.8em',\n    minWidth: '1.8em',\n  },\n});\n"],"mappings":";AAGA,MAAa,SAAS;CACpB,YAAY;EACV,QAAQ;EACR,OAAO;CACT;CACA,kBAAkB;EAChB,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,mBAAmB;EACjB,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/Hotkey/type.d.mts

@@ -2,7 +2,7 @@ import { FlexboxProps } from "../Flex/type.mjs";
 import "../Flex/index.mjs";
 import { CSSProperties } from "react";
 //#region src/Hotkey/type.d.ts
-interface HotkeyProps extends Omit<FlexboxProps, 'children'> {
+export interface HotkeyProps extends Omit<FlexboxProps, 'children'> {
   classNames?: {
     kbdClassName?: string;
   };
@@ -16,5 +16,4 @@ interface HotkeyProps extends Omit<FlexboxProps, 'children'> {
   variant?: 'filled' | 'outlined' | 'borderless';
 }
 //#endregion
-export { HotkeyProps };
 //# sourceMappingURL=type.d.mts.map

package/es/Hotkey/utils.d.mts

@@ -1,5 +1,4 @@
 //#region src/Hotkey/utils.d.ts
-declare const combineKeys: (keys: string[]) => string;
+export declare const combineKeys: (keys: string[]) => string;
 //#endregion
-export { combineKeys };
 //# sourceMappingURL=utils.d.mts.map

package/es/HotkeyInput/HotkeyInput.mjs

@@ -1,17 +1,18 @@
 "use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
+import { useThemeMode } from "../styles/theme/scope.mjs";
 import { NORMATIVE_MODIFIER, checkIsAppleDevice, splitKeysByPlus } from "../Hotkey/utils.mjs";
 import Hotkey from "../Hotkey/Hotkey.mjs";
-import ActionIcon from "../base-ui/ActionIcon/ActionIcon.mjs";
+import ActionIcon from "../ActionIcon/ActionIcon.mjs";
 import { useTranslation } from "../i18n/useTranslation.mjs";
 import hotkey_default from "../i18n/resources/en/hotkey.mjs";
-import { styles, variants } from "./style.mjs";
+import { styles } from "./style.mjs";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { cx, useThemeMode } from "antd-style";
-import useMergeState from "use-merge-value";
-import { isEqual } from "es-toolkit/compat";
+import * as stylex from "@stylexjs/stylex";
 import { Undo2Icon, XIcon } from "lucide-react";
+import { isEqual } from "es-toolkit/compat";
+import useControlledState from "use-merge-value";
 import { useHotkeys, useRecordHotkeys } from "react-hotkeys-hook";
 //#region src/HotkeyInput/HotkeyInput.tsx
 const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onChange, onClear, onConflict, placeholder, disabled, shadow, allowClear, allowReset = true, style, className, hotkeyConflicts = [], variant, texts, isApple, onBlur, onReset, onFocus }) => {
@@ -22,7 +23,7 @@ const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onCh
 	const { isDarkMode } = useThemeMode();
 	const { t } = useTranslation(hotkey_default);
 	const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);
-	const [hotkeyValue, setHotkeyValue] = useMergeState(defaultValue, {
+	const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {
 		defaultValue,
 		onChange,
 		value
@@ -134,6 +135,8 @@ const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onCh
 		if (disabled || isFocused) return;
 		inputRef.current?.focus();
 	};
+	const resolvedVariant = variant || (isDarkMode ? "filled" : "outlined");
+	const hasError = hasConflict || hasInvalidCombination;
 	const placeholderText = placeholder ?? t("hotkey.placeholder");
 	const resetTitle = texts?.reset ?? t("hotkey.reset");
 	const clearTitle = texts?.clear ?? t("hotkey.clear");
@@ -151,28 +154,22 @@ const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onCh
 				horizontal: true,
 				align: "center",
 				justify: "space-between",
-				className: cx(variants({
-					disabled,
-					error: hasConflict || hasInvalidCombination,
-					focused: isFocused,
-					shadow,
-					variant: variant || (isDarkMode ? "filled" : "outlined")
-				})),
+				...stylex.props(styles.root, styles[resolvedVariant], shadow && styles.shadow, isFocused && styles.focused, hasError && styles.error, hasError && resolvedVariant === "outlined" && styles.errorOutlined, disabled && styles.disabled),
 				onClick: handleClick,
 				children: [
 					/* @__PURE__ */ jsx("div", {
 						style: { pointerEvents: "none" },
 						children: isRecording ? /* @__PURE__ */ jsx("span", {
-							className: styles.placeholder,
+							...stylex.props(styles.placeholder),
 							children: keys.length > 0 ? /* @__PURE__ */ jsx(Hotkey, { keys: keysString }) : placeholderText
 						}) : hotkeyValue ? /* @__PURE__ */ jsx(Hotkey, { keys: hotkeyValue }) : /* @__PURE__ */ jsx("span", {
-							className: styles.placeholder,
+							...stylex.props(styles.placeholder),
 							children: placeholderText
 						})
 					}),
 					/* @__PURE__ */ jsx("input", {
 						readOnly: true,
-						className: styles.hiddenInput,
+						...stylex.props(styles.hiddenInput),
 						disabled,
 						ref: inputRef,
 						style: { pointerEvents: "none" },
@@ -199,11 +196,11 @@ const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onCh
 				]
 			}),
 			hasConflict && /* @__PURE__ */ jsx("div", {
-				className: styles.errorText,
+				...stylex.props(styles.errorText),
 				children: conflictText
 			}),
 			hasInvalidCombination && /* @__PURE__ */ jsx("div", {
-				className: styles.errorText,
+				...stylex.props(styles.errorText),
 				children: invalidText
 			})
 		]

package/es/HotkeyInput/HotkeyInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HotkeyInput.mjs","names":["hotkeyMessages","useControlledState","Flexbox"],"sources":["../../src/HotkeyInput/HotkeyInput.tsx"],"sourcesContent":["'use client';\n\nimport { type InputRef } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { isEqual } from 'es-toolkit/compat';\nimport { Undo2Icon, XIcon } from 'lucide-react';\nimport {\n  type FocusEvent,\n  memo,\n  type MouseEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useHotkeys, useRecordHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/base-ui/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Hotkey from '@/Hotkey';\nimport { checkIsAppleDevice, NORMATIVE_MODIFIER, splitKeysByPlus } from '@/Hotkey/utils';\nimport hotkeyMessages from '@/i18n/resources/en/hotkey';\nimport { useTranslation } from '@/i18n/useTranslation';\n\nimport { styles, variants } from './style';\nimport { type HotkeyInputProps } from './type';\n\nconst HotkeyInput = memo<HotkeyInputProps>(\n  ({\n    value = '',\n    defaultValue = '',\n    resetValue = '',\n    onChange,\n    onClear,\n    onConflict,\n    placeholder,\n    disabled,\n    shadow,\n    allowClear,\n    allowReset = true,\n    style,\n    className,\n    hotkeyConflicts = [],\n    variant,\n    texts,\n    isApple,\n    onBlur,\n    onReset,\n    onFocus,\n  }) => {\n    const [isFocused, setIsFocused] = useState(false);\n    const [hasConflict, setHasConflict] = useState(false);\n    const [hasInvalidCombination, setHasInvalidCombination] = useState(false);\n    const inputRef = useRef<InputRef>(null);\n    const { isDarkMode } = useThemeMode();\n    const { t } = useTranslation(hotkeyMessages);\n    const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);\n    const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {\n      defaultValue,\n      onChange,\n      value,\n    });\n\n    // 使用 useRecordHotkeys 处理快捷键录入\n    const [recordedKeys, { start, stop, isRecording, resetKeys }] = useRecordHotkeys();\n\n    useHotkeys(\n      '*',\n      () => {\n        inputRef.current?.blur();\n      },\n      {\n        enableOnContentEditable: true,\n        enableOnFormTags: true,\n        enabled: isRecording && !disabled,\n        keydown: false,\n        keyup: true,\n        preventDefault: true,\n      },\n    );\n\n    // 处理按键，保证格式正确：修饰键在前，最多一个非修饰键在后\n    const formatKeys = useCallback((keysSet: Set<string>) => {\n      const modifiers: string[] = [];\n      const normalKeys: string[] = [];\n\n      for (const key of keysSet) {\n        // 处理不同表示的修饰键\n        const normalizedKey: any = key.toLowerCase();\n        if (NORMATIVE_MODIFIER.includes(normalizedKey)) {\n          // 统一修饰键表示\n          if (\n            (!isAppleDevice && normalizedKey === 'ctrl') ||\n            (isAppleDevice && normalizedKey === 'meta')\n          ) {\n            if (!modifiers.includes('mod')) modifiers.push('mod');\n          } else if (!modifiers.includes(normalizedKey)) {\n            modifiers.push(normalizedKey);\n          }\n        } else {\n          normalKeys.push(key);\n        }\n      }\n\n      // 至少需要一个修饰键\n      if (modifiers.length === 0 && normalKeys.length > 0) {\n        return { isValid: false, keys: [] };\n      }\n\n      // 只允许一个非修饰键，如果有多个，只保留最后一个\n      const finalKey = normalKeys.length > 0 ? [normalKeys.at(-1)] : [];\n      const shortcuts = [modifiers, finalKey];\n\n      return {\n        // 组合必须包含至少一个按键\n        isValid: shortcuts.every((k) => k.length > 0),\n        keys: shortcuts.flat(),\n      };\n    }, []);\n\n    // 获取格式化后的按键字符串\n    const { isValid, keys } = formatKeys(recordedKeys);\n    const keysString = keys.join('+');\n\n    // 检查快捷键冲突\n    const checkHotkeyConflict = useCallback(\n      (newHotkey: string): boolean => {\n        return hotkeyConflicts\n          .filter((conflictKey) => conflictKey !== resetValue)\n          .some((conflictKey) => {\n            const newKeys = splitKeysByPlus(newHotkey);\n            const conflictKeys = splitKeysByPlus(conflictKey);\n            return isEqual(newKeys, conflictKeys);\n          });\n      },\n      [hotkeyConflicts],\n    );\n\n    // 当按键组合完成时处理结果\n    useEffect(() => {\n      if (recordedKeys.size > 0 && !isRecording) {\n        if (!isValid) {\n          setHasInvalidCombination(true);\n          setHasConflict(false);\n          return;\n        }\n\n        setHasInvalidCombination(false);\n        const newKeysString = keysString;\n\n        // 检查冲突\n        const conflict = checkHotkeyConflict(newKeysString);\n        if (conflict) {\n          setHasConflict(true);\n          onConflict?.(newKeysString);\n        } else {\n          setHasConflict(false);\n          setHotkeyValue?.(newKeysString);\n        }\n      }\n    }, [\n      recordedKeys,\n      isRecording,\n      isValid,\n      keysString,\n      checkHotkeyConflict,\n      setHotkeyValue,\n      onConflict,\n    ]);\n\n    // 处理输入框焦点\n    const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n      if (disabled) return;\n      setIsFocused(true);\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      start(); // 开始记录\n      onFocus?.(e);\n    };\n\n    const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n      setIsFocused(false);\n      stop(); // 停止记录\n      onBlur?.(e);\n    };\n\n    const handleClear = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setHotkeyValue?.('');\n      resetKeys();\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      setIsFocused(false);\n      stop();\n      onClear?.(hotkeyValue);\n    };\n\n    // 重置功能\n    const handleReset = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setHotkeyValue?.(resetValue);\n      resetKeys();\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      setIsFocused(false);\n      stop(); // 停止记录\n      onReset?.(hotkeyValue, resetValue);\n    };\n\n    const handleClick = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      if (disabled || isFocused) return;\n      inputRef.current?.focus();\n    };\n\n    const placeholderText = placeholder ?? t('hotkey.placeholder');\n    const resetTitle = texts?.reset ?? t('hotkey.reset');\n    const clearTitle = texts?.clear ?? t('hotkey.clear');\n    const conflictText = texts?.conflicts ?? t('hotkey.conflict');\n    const invalidText = texts?.invalidCombination ?? t('hotkey.invalidCombination');\n\n    return (\n      <Flexbox\n        className={className}\n        gap={8}\n        style={{\n          position: 'relative',\n          ...style,\n        }}\n      >\n        <Flexbox\n          horizontal\n          align={'center'}\n          justify={'space-between'}\n          className={cx(\n            variants({\n              disabled,\n              error: hasConflict || hasInvalidCombination,\n              focused: isFocused,\n              shadow,\n              variant: variant || (isDarkMode ? 'filled' : 'outlined'),\n            }),\n          )}\n          onClick={handleClick}\n        >\n          <div style={{ pointerEvents: 'none' }}>\n            {isRecording ? (\n              <span className={styles.placeholder}>\n                {keys.length > 0 ? <Hotkey keys={keysString} /> : placeholderText}\n              </span>\n            ) : hotkeyValue ? (\n              <Hotkey keys={hotkeyValue} />\n            ) : (\n              <span className={styles.placeholder}>{placeholderText}</span>\n            )}\n          </div>\n\n          {/* 隐藏的输入框，用于接收焦点 */}\n          <input\n            readOnly\n            className={styles.hiddenInput}\n            disabled={disabled}\n            ref={inputRef as any}\n            style={{ pointerEvents: 'none' }}\n            onBlur={handleBlur}\n            onFocus={handleFocus}\n          />\n\n          {!isFocused && hotkeyValue && !disabled && (allowReset || allowClear) && (\n            <Flexbox horizontal gap={4}>\n              {allowReset && hotkeyValue !== resetValue && (\n                <ActionIcon\n                  icon={Undo2Icon}\n                  size={'small'}\n                  title={resetTitle}\n                  variant={'filled'}\n                  onClick={handleReset}\n                />\n              )}\n              {allowClear && (\n                <ActionIcon\n                  icon={XIcon}\n                  size={'small'}\n                  title={clearTitle}\n                  variant={'filled'}\n                  onClick={handleClear}\n                />\n              )}\n            </Flexbox>\n          )}\n        </Flexbox>\n        {hasConflict && <div className={styles.errorText}>{conflictText}</div>}\n        {hasInvalidCombination && <div className={styles.errorText}>{invalidText}</div>}\n      </Flexbox>\n    );\n  },\n);\n\nHotkeyInput.displayName = 'HotkeyInput';\n\nexport default HotkeyInput;\n"],"mappings":";;;;;;;;;;;;;;;;AA6BA,MAAM,cAAc,MACjB,EACC,QAAQ,IACR,eAAe,IACf,aAAa,IACb,UACA,SACA,YACA,aACA,UACA,QACA,YACA,aAAa,MACb,OACA,WACA,kBAAkB,CAAC,GACnB,SACA,OACA,SACA,QACA,SACA,cACI;CACJ,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CACpD,MAAM,CAAC,uBAAuB,4BAA4B,SAAS,KAAK;CACxE,MAAM,WAAW,OAAiB,IAAI;CACtC,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,EAAE,MAAM,eAAeA,cAAc;CAC3C,MAAM,gBAAgB,cAAc,mBAAmB,OAAO,GAAG,CAAC,OAAO,CAAC;CAC1E,MAAM,CAAC,aAAa,kBAAkBC,cAAmB,cAAc;EACrE;EACA;EACA;CACF,CAAC;CAGD,MAAM,CAAC,cAAc,EAAE,OAAO,MAAM,aAAa,eAAe,iBAAiB;CAEjF,WACE,WACM;EACJ,SAAS,SAAS,KAAK;CACzB,GACA;EACE,yBAAyB;EACzB,kBAAkB;EAClB,SAAS,eAAe,CAAC;EACzB,SAAS;EACT,OAAO;EACP,gBAAgB;CAClB,CACF;CA0CA,MAAM,EAAE,SAAS,SAvCE,aAAa,YAAyB;EACvD,MAAM,YAAsB,CAAC;EAC7B,MAAM,aAAuB,CAAC;EAE9B,KAAK,MAAM,OAAO,SAAS;GAEzB,MAAM,gBAAqB,IAAI,YAAY;GAC3C,IAAI,mBAAmB,SAAS,aAAa,GAAG;IAE9C,IACG,CAAC,iBAAiB,kBAAkB,UACpC,iBAAiB,kBAAkB,QAEhC;SAAA,CAAC,UAAU,SAAS,KAAK,GAAG,UAAU,KAAK,KAAK;IAAA,OAC/C,IAAI,CAAC,UAAU,SAAS,aAAa,GAC1C,UAAU,KAAK,aAAa;GAEhC,OACE,WAAW,KAAK,GAAG;EAEvB;EAGA,IAAI,UAAU,WAAW,KAAK,WAAW,SAAS,GAChD,OAAO;GAAE,SAAS;GAAO,MAAM,CAAC;EAAE;EAKpC,MAAM,YAAY,CAAC,WADF,WAAW,SAAS,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC,CAC1B;EAEtC,OAAO;GAEL,SAAS,UAAU,OAAO,MAAM,EAAE,SAAS,CAAC;GAC5C,MAAM,UAAU,KAAK;EACvB;CACF,GAAG,CAAC,CAG+B,CAAC,CAAC,YAAY;CACjD,MAAM,aAAa,KAAK,KAAK,GAAG;CAGhC,MAAM,sBAAsB,aACzB,cAA+B;EAC9B,OAAO,gBACJ,QAAQ,gBAAgB,gBAAgB,UAAU,CAAC,CACnD,MAAM,gBAAgB;GACrB,MAAM,UAAU,gBAAgB,SAAS;GACzC,MAAM,eAAe,gBAAgB,WAAW;GAChD,OAAO,QAAQ,SAAS,YAAY;EACtC,CAAC;CACL,GACA,CAAC,eAAe,CAClB;CAGA,gBAAgB;EACd,IAAI,aAAa,OAAO,KAAK,CAAC,aAAa;GACzC,IAAI,CAAC,SAAS;IACZ,yBAAyB,IAAI;IAC7B,eAAe,KAAK;IACpB;GACF;GAEA,yBAAyB,KAAK;GAC9B,MAAM,gBAAgB;GAItB,IADiB,oBAAoB,aAC1B,GAAG;IACZ,eAAe,IAAI;IACnB,aAAa,aAAa;GAC5B,OAAO;IACL,eAAe,KAAK;IACpB,iBAAiB,aAAa;GAChC;EACF;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAGD,MAAM,eAAe,MAAoC;EACvD,IAAI,UAAU;EACd,aAAa,IAAI;EACjB,eAAe,KAAK;EACpB,yBAAyB,KAAK;EAC9B,MAAM;EACN,UAAU,CAAC;CACb;CAEA,MAAM,cAAc,MAAoC;EACtD,aAAa,KAAK;EAClB,KAAK;EACL,SAAS,CAAC;CACZ;CAEA,MAAM,eAAe,MAAkB;EACrC,EAAE,eAAe;EACjB,EAAE,gBAAgB;EAClB,iBAAiB,EAAE;EACnB,UAAU;EACV,eAAe,KAAK;EACpB,yBAAyB,KAAK;EAC9B,aAAa,KAAK;EAClB,KAAK;EACL,UAAU,WAAW;CACvB;CAGA,MAAM,eAAe,MAAkB;EACrC,EAAE,eAAe;EACjB,EAAE,gBAAgB;EAClB,iBAAiB,UAAU;EAC3B,UAAU;EACV,eAAe,KAAK;EACpB,yBAAyB,KAAK;EAC9B,aAAa,KAAK;EAClB,KAAK;EACL,UAAU,aAAa,UAAU;CACnC;CAEA,MAAM,eAAe,MAAkB;EACrC,EAAE,eAAe;EACjB,EAAE,gBAAgB;EAClB,IAAI,YAAY,WAAW;EAC3B,SAAS,SAAS,MAAM;CAC1B;CAEA,MAAM,kBAAkB,eAAe,EAAE,oBAAoB;CAC7D,MAAM,aAAa,OAAO,SAAS,EAAE,cAAc;CACnD,MAAM,aAAa,OAAO,SAAS,EAAE,cAAc;CACnD,MAAM,eAAe,OAAO,aAAa,EAAE,iBAAiB;CAC5D,MAAM,cAAc,OAAO,sBAAsB,EAAE,2BAA2B;CAE9E,OACE,qBAACC,mBAAD;EACa;EACX,KAAK;EACL,OAAO;GACL,UAAU;GACV,GAAG;EACL;EANF,UAAA;GAQE,qBAACA,mBAAD;IACE,YAAA;IACA,OAAO;IACP,SAAS;IACT,WAAW,GACT,SAAS;KACP;KACA,OAAO,eAAe;KACtB,SAAS;KACT;KACA,SAAS,YAAY,aAAa,WAAW;IAC/C,CAAC,CACH;IACA,SAAS;IAbX,UAAA;KAeE,oBAAC,OAAD;MAAK,OAAO,EAAE,eAAe,OAAO;MACjC,UAAA,cACC,oBAAC,QAAD;OAAM,WAAW,OAAO;OACrB,UAAA,KAAK,SAAS,IAAI,oBAAC,QAAD,EAAQ,MAAM,WAAa,CAAA,IAAI;MAC9C,CAAA,IACJ,cACF,oBAAC,QAAD,EAAQ,MAAM,YAAc,CAAA,IAE5B,oBAAC,QAAD;OAAM,WAAW,OAAO;OAAc,UAAA;MAAsB,CAAA;KAE3D,CAAA;KAGL,oBAAC,SAAD;MACE,UAAA;MACA,WAAW,OAAO;MACR;MACV,KAAK;MACL,OAAO,EAAE,eAAe,OAAO;MAC/B,QAAQ;MACR,SAAS;KACV,CAAA;KAEA,CAAC,aAAa,eAAe,CAAC,aAAa,cAAc,eACxD,qBAACA,mBAAD;MAAS,YAAA;MAAW,KAAK;MAAzB,UAAA,CACG,cAAc,gBAAgB,cAC7B,oBAAC,YAAD;OACE,MAAM;OACN,MAAM;OACN,OAAO;OACP,SAAS;OACT,SAAS;MACV,CAAA,GAEF,cACC,oBAAC,YAAD;OACE,MAAM;OACN,MAAM;OACN,OAAO;OACP,SAAS;OACT,SAAS;MACV,CAAA,CAEI;;IAEJ;;GACR,eAAe,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAY,UAAA;GAAkB,CAAA;GACpE,yBAAyB,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAY,UAAA;GAAiB,CAAA;EACvE;;AAEb,CACF;AAEA,YAAY,cAAc"}
+{"version":3,"file":"HotkeyInput.mjs","names":["hotkeyMessages","Flexbox"],"sources":["../../src/HotkeyInput/HotkeyInput.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport { isEqual } from 'es-toolkit/compat';\nimport { Undo2Icon, XIcon } from 'lucide-react';\nimport {\n  type FocusEvent,\n  memo,\n  type MouseEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useHotkeys, useRecordHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Hotkey from '@/Hotkey';\nimport { checkIsAppleDevice, NORMATIVE_MODIFIER, splitKeysByPlus } from '@/Hotkey/utils';\nimport hotkeyMessages from '@/i18n/resources/en/hotkey';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport { useThemeMode } from '@/styles/theme/scope';\n\nimport { styles } from './style';\nimport { type HotkeyInputProps } from './type';\n\nconst HotkeyInput = memo<HotkeyInputProps>(\n  ({\n    value = '',\n    defaultValue = '',\n    resetValue = '',\n    onChange,\n    onClear,\n    onConflict,\n    placeholder,\n    disabled,\n    shadow,\n    allowClear,\n    allowReset = true,\n    style,\n    className,\n    hotkeyConflicts = [],\n    variant,\n    texts,\n    isApple,\n    onBlur,\n    onReset,\n    onFocus,\n  }) => {\n    const [isFocused, setIsFocused] = useState(false);\n    const [hasConflict, setHasConflict] = useState(false);\n    const [hasInvalidCombination, setHasInvalidCombination] = useState(false);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const { isDarkMode } = useThemeMode();\n    const { t } = useTranslation(hotkeyMessages);\n    const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);\n    const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {\n      defaultValue,\n      onChange,\n      value,\n    });\n\n    // 使用 useRecordHotkeys 处理快捷键录入\n    const [recordedKeys, { start, stop, isRecording, resetKeys }] = useRecordHotkeys();\n\n    useHotkeys(\n      '*',\n      () => {\n        inputRef.current?.blur();\n      },\n      {\n        enableOnContentEditable: true,\n        enableOnFormTags: true,\n        enabled: isRecording && !disabled,\n        keydown: false,\n        keyup: true,\n        preventDefault: true,\n      },\n    );\n\n    // 处理按键，保证格式正确：修饰键在前，最多一个非修饰键在后\n    const formatKeys = useCallback((keysSet: Set<string>) => {\n      const modifiers: string[] = [];\n      const normalKeys: string[] = [];\n\n      for (const key of keysSet) {\n        // 处理不同表示的修饰键\n        const normalizedKey: any = key.toLowerCase();\n        if (NORMATIVE_MODIFIER.includes(normalizedKey)) {\n          // 统一修饰键表示\n          if (\n            (!isAppleDevice && normalizedKey === 'ctrl') ||\n            (isAppleDevice && normalizedKey === 'meta')\n          ) {\n            if (!modifiers.includes('mod')) modifiers.push('mod');\n          } else if (!modifiers.includes(normalizedKey)) {\n            modifiers.push(normalizedKey);\n          }\n        } else {\n          normalKeys.push(key);\n        }\n      }\n\n      // 至少需要一个修饰键\n      if (modifiers.length === 0 && normalKeys.length > 0) {\n        return { isValid: false, keys: [] };\n      }\n\n      // 只允许一个非修饰键，如果有多个，只保留最后一个\n      const finalKey = normalKeys.length > 0 ? [normalKeys.at(-1)] : [];\n      const shortcuts = [modifiers, finalKey];\n\n      return {\n        // 组合必须包含至少一个按键\n        isValid: shortcuts.every((k) => k.length > 0),\n        keys: shortcuts.flat(),\n      };\n    }, []);\n\n    // 获取格式化后的按键字符串\n    const { isValid, keys } = formatKeys(recordedKeys);\n    const keysString = keys.join('+');\n\n    // 检查快捷键冲突\n    const checkHotkeyConflict = useCallback(\n      (newHotkey: string): boolean => {\n        return hotkeyConflicts\n          .filter((conflictKey) => conflictKey !== resetValue)\n          .some((conflictKey) => {\n            const newKeys = splitKeysByPlus(newHotkey);\n            const conflictKeys = splitKeysByPlus(conflictKey);\n            return isEqual(newKeys, conflictKeys);\n          });\n      },\n      [hotkeyConflicts],\n    );\n\n    // 当按键组合完成时处理结果\n    useEffect(() => {\n      if (recordedKeys.size > 0 && !isRecording) {\n        if (!isValid) {\n          setHasInvalidCombination(true);\n          setHasConflict(false);\n          return;\n        }\n\n        setHasInvalidCombination(false);\n        const newKeysString = keysString;\n\n        // 检查冲突\n        const conflict = checkHotkeyConflict(newKeysString);\n        if (conflict) {\n          setHasConflict(true);\n          onConflict?.(newKeysString);\n        } else {\n          setHasConflict(false);\n          setHotkeyValue?.(newKeysString);\n        }\n      }\n    }, [\n      recordedKeys,\n      isRecording,\n      isValid,\n      keysString,\n      checkHotkeyConflict,\n      setHotkeyValue,\n      onConflict,\n    ]);\n\n    // 处理输入框焦点\n    const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n      if (disabled) return;\n      setIsFocused(true);\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      start(); // 开始记录\n      onFocus?.(e);\n    };\n\n    const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n      setIsFocused(false);\n      stop(); // 停止记录\n      onBlur?.(e);\n    };\n\n    const handleClear = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setHotkeyValue?.('');\n      resetKeys();\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      setIsFocused(false);\n      stop();\n      onClear?.(hotkeyValue);\n    };\n\n    // 重置功能\n    const handleReset = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setHotkeyValue?.(resetValue);\n      resetKeys();\n      setHasConflict(false);\n      setHasInvalidCombination(false);\n      setIsFocused(false);\n      stop(); // 停止记录\n      onReset?.(hotkeyValue, resetValue);\n    };\n\n    const handleClick = (e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      if (disabled || isFocused) return;\n      inputRef.current?.focus();\n    };\n\n    const resolvedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n    const hasError = hasConflict || hasInvalidCombination;\n\n    const placeholderText = placeholder ?? t('hotkey.placeholder');\n    const resetTitle = texts?.reset ?? t('hotkey.reset');\n    const clearTitle = texts?.clear ?? t('hotkey.clear');\n    const conflictText = texts?.conflicts ?? t('hotkey.conflict');\n    const invalidText = texts?.invalidCombination ?? t('hotkey.invalidCombination');\n\n    return (\n      <Flexbox\n        className={className}\n        gap={8}\n        style={{\n          position: 'relative',\n          ...style,\n        }}\n      >\n        <Flexbox\n          horizontal\n          align={'center'}\n          justify={'space-between'}\n          {...stylex.props(\n            styles.root,\n            styles[resolvedVariant],\n            shadow && styles.shadow,\n            isFocused && styles.focused,\n            hasError && styles.error,\n            hasError && resolvedVariant === 'outlined' && styles.errorOutlined,\n            disabled && styles.disabled,\n          )}\n          onClick={handleClick}\n        >\n          <div style={{ pointerEvents: 'none' }}>\n            {isRecording ? (\n              <span {...stylex.props(styles.placeholder)}>\n                {keys.length > 0 ? <Hotkey keys={keysString} /> : placeholderText}\n              </span>\n            ) : hotkeyValue ? (\n              <Hotkey keys={hotkeyValue} />\n            ) : (\n              <span {...stylex.props(styles.placeholder)}>{placeholderText}</span>\n            )}\n          </div>\n\n          {/* 隐藏的输入框，用于接收焦点 */}\n          <input\n            readOnly\n            {...stylex.props(styles.hiddenInput)}\n            disabled={disabled}\n            ref={inputRef as any}\n            style={{ pointerEvents: 'none' }}\n            onBlur={handleBlur}\n            onFocus={handleFocus}\n          />\n\n          {!isFocused && hotkeyValue && !disabled && (allowReset || allowClear) && (\n            <Flexbox horizontal gap={4}>\n              {allowReset && hotkeyValue !== resetValue && (\n                <ActionIcon\n                  icon={Undo2Icon}\n                  size={'small'}\n                  title={resetTitle}\n                  variant={'filled'}\n                  onClick={handleReset}\n                />\n              )}\n              {allowClear && (\n                <ActionIcon\n                  icon={XIcon}\n                  size={'small'}\n                  title={clearTitle}\n                  variant={'filled'}\n                  onClick={handleClear}\n                />\n              )}\n            </Flexbox>\n          )}\n        </Flexbox>\n        {hasConflict && <div {...stylex.props(styles.errorText)}>{conflictText}</div>}\n        {hasInvalidCombination && <div {...stylex.props(styles.errorText)}>{invalidText}</div>}\n      </Flexbox>\n    );\n  },\n);\n\nHotkeyInput.displayName = 'HotkeyInput';\n\nexport default HotkeyInput;\n"],"mappings":"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"}

package/es/HotkeyInput/style.mjs

@@ -1,85 +1,79 @@
-import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
-import { createStaticStyles } from "antd-style";
-import { cva } from "class-variance-authority";
 //#region src/HotkeyInput/style.ts
-const styles = createStaticStyles(({ css, cssVar }) => {
-	return {
-		borderless: staticStylish.variantBorderless,
-		disabled: staticStylish.disabled,
-		error: css`
-      border: 1px solid ${cssVar.colorError};
-    `,
-		errorText: css`
-      font-size: 12px;
-      color: ${cssVar.colorError};
-    `,
-		filled: staticStylish.variantFilled,
-		focused: css`
-      background: ${cssVar.colorFillSecondary} !important;
-    `,
-		hiddenInput: css`
-      cursor: text;
-
-      position: absolute;
-      z-index: -1;
-      inset-block-start: 0;
-      inset-inline-start: 0;
-
-      width: 100%;
-      height: 100%;
-
-      opacity: 0;
-    `,
-		outlined: staticStylish.variantOutlined,
-		placeholder: css`
-      color: ${cssVar.colorTextDescription};
-    `,
-		root: css`
-      cursor: pointer;
-
-      position: relative;
-
-      max-width: 100%;
-      height: 36px;
-      padding-block: 0;
-      padding-inline: 12px;
-      border-radius: ${cssVar.borderRadius};
-    `,
-		shadow: staticStylish.shadow
-	};
-});
-const variants = cva(styles.root, {
-	defaultVariants: {
-		disabled: false,
-		error: false,
-		shadow: false,
-		variant: "outlined"
+const styles = {
+	borderless: {
+		kVAM5u: "lb181nr7w",
+		ksu8eU: "lbng3xce",
+		kMzoRj: "lbfn42iu",
+		kWkggS: "lbjbqb8w lb1gowcop",
+		kGVxlE: "lb1gnnqk1",
+		$$css: true
+	},
+	disabled: {
+		kkrTdU: "lb1h6gzvc",
+		kSiTet: "lbbyyjgo",
+		$$css: true
+	},
+	error: {
+		kVAM5u: "lb11fhi00",
+		ksu8eU: "lb1y0btm7",
+		kMzoRj: "lbmkeg23",
+		$$css: true
+	},
+	errorOutlined: {
+		kVAM5u: "lb11fhi00 lb3mg3nv",
+		$$css: true
+	},
+	errorText: {
+		kMwMTN: "lb12ap7uz",
+		kGuDYH: "lbfifm61",
+		$$css: true
+	},
+	filled: {
+		kWkggS: "lbaljia1 lb1ri6zej",
+		$$css: true
+	},
+	focused: {
+		kWkggS: "lbjjy28o",
+		$$css: true
+	},
+	hiddenInput: {
+		kkrTdU: "lb1ed109x",
+		k87sOh: "lb13vifvy",
+		kLqNvP: "lb1o0tod",
+		kSiTet: "lbg01cxk",
+		kVAEAm: "lb10l6tqk",
+		kY2c9j: "lb8knxv4",
+		kZKoxP: "lb5yr21d",
+		kzqmXN: "lbh8yej3",
+		$$css: true
+	},
+	outlined: {
+		kVAM5u: "lb10cypdb lb3mg3nv",
+		ksu8eU: "lb1y0btm7",
+		kMzoRj: "lbmkeg23",
+		kWkggS: "lb6yijhg",
+		$$css: true
+	},
+	placeholder: {
+		kMwMTN: "lb19ppog9",
+		$$css: true
+	},
+	root: {
+		kaIpWk: "lb1sbi92r",
+		k8WAf4: "lbt970qd",
+		kg3NbH: "lbaope02",
+		kkrTdU: "lb1ypdohk",
+		kVAEAm: "lb1n2onr6",
+		kZKoxP: "lbc9qbxq",
+		ks0D6T: "lb193iq5w",
+		$$css: true
 	},
-	variants: {
-		variant: {
-			filled: styles.filled,
-			outlined: styles.outlined,
-			borderless: styles.borderless
-		},
-		shadow: {
-			false: null,
-			true: styles.shadow
-		},
-		focused: {
-			false: null,
-			true: styles.focused
-		},
-		error: {
-			fales: null,
-			true: styles.error
-		},
-		disabled: {
-			false: null,
-			true: styles.disabled
-		}
+	shadow: {
+		kGVxlE: "lbpjwdtl",
+		$$css: true
 	}
-});
+};
 //#endregion
-export { styles, variants };
+export { styles };
 
 //# sourceMappingURL=style.mjs.map

package/es/HotkeyInput/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/HotkeyInput/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    borderless: lobeStaticStylish.variantBorderless,\n    disabled: lobeStaticStylish.disabled,\n    error: css`\n      border: 1px solid ${cssVar.colorError};\n    `,\n    errorText: css`\n      font-size: 12px;\n      color: ${cssVar.colorError};\n    `,\n    filled: lobeStaticStylish.variantFilled,\n    focused: css`\n      background: ${cssVar.colorFillSecondary} !important;\n    `,\n    hiddenInput: css`\n      cursor: text;\n\n      position: absolute;\n      z-index: -1;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n\n      width: 100%;\n      height: 100%;\n\n      opacity: 0;\n    `,\n    outlined: lobeStaticStylish.variantOutlined,\n    placeholder: css`\n      color: ${cssVar.colorTextDescription};\n    `,\n    root: css`\n      cursor: pointer;\n\n      position: relative;\n\n      max-width: 100%;\n      height: 36px;\n      padding-block: 0;\n      padding-inline: 12px;\n      border-radius: ${cssVar.borderRadius};\n    `,\n    shadow: lobeStaticStylish.shadow,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    disabled: false,\n    error: false,\n    shadow: false,\n    variant: 'outlined',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n    focused: {\n      false: null,\n      true: styles.focused,\n    },\n    error: {\n      fales: null,\n      true: styles.error,\n    },\n    disabled: {\n      false: null,\n      true: styles.disabled,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,YAAYA,cAAkB;EAC9B,UAAUA,cAAkB;EAC5B,OAAO,GAAG;0BACY,OAAO,WAAW;;EAExC,WAAW,GAAG;;eAEH,OAAO,WAAW;;EAE7B,QAAQA,cAAkB;EAC1B,SAAS,GAAG;oBACI,OAAO,mBAAmB;;EAE1C,aAAa,GAAG;;;;;;;;;;;;;EAahB,UAAUA,cAAkB;EAC5B,aAAa,GAAG;eACL,OAAO,qBAAqB;;EAEvC,MAAM,GAAG;;;;;;;;;uBASU,OAAO,aAAa;;EAEvC,QAAQA,cAAkB;CAC5B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB;EACf,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;CACX;CAEA,UAAU;EACR,SAAS;GACP,QAAQ,OAAO;GACf,UAAU,OAAO;GACjB,YAAY,OAAO;EACrB;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,SAAS;GACP,OAAO;GACP,MAAM,OAAO;EACf;EACA,OAAO;GACL,OAAO;GACP,MAAM,OAAO;EACf;EACA,UAAU;GACR,OAAO;GACP,MAAM,OAAO;EACf;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/HotkeyInput/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\n\nexport const styles = stylex.create({\n  borderless: {\n    borderColor: 'currentcolor',\n    borderStyle: 'none',\n    borderWidth: 'medium',\n    backgroundColor: { 'default': 'transparent', ':hover': cssVar.colorFillTertiary },\n    boxShadow: 'none',\n  },\n  disabled: {\n    cursor: 'not-allowed',\n    opacity: 0.5,\n  },\n  error: {\n    borderColor: cssVar.colorError,\n    borderStyle: 'solid',\n    borderWidth: 1,\n  },\n  errorOutlined: {\n    borderColor: { 'default': cssVar.colorError, ':hover': cssVar.colorBorder },\n  },\n  errorText: {\n    color: cssVar.colorError,\n    fontSize: 12,\n  },\n  filled: {\n    backgroundColor: { 'default': cssVar.colorFillTertiary, ':hover': cssVar.colorFillSecondary },\n  },\n  focused: {\n    backgroundColor: cssVar.colorFillSecondary,\n  },\n  hiddenInput: {\n    cursor: 'text',\n    insetBlockStart: 0,\n    insetInlineStart: 0,\n    opacity: 0,\n    position: 'absolute',\n    zIndex: -1,\n    height: '100%',\n    width: '100%',\n  },\n  outlined: {\n    borderColor: { 'default': cssVar.colorBorderSecondary, ':hover': cssVar.colorBorder },\n    borderStyle: 'solid',\n    borderWidth: 1,\n    backgroundColor: cssVar.colorBgContainer,\n  },\n  placeholder: {\n    color: cssVar.colorTextDescription,\n  },\n  root: {\n    borderRadius: cssVar.borderRadius,\n    paddingBlock: 0,\n    paddingInline: 12,\n    cursor: 'pointer',\n    position: 'relative',\n    height: 36,\n    maxWidth: '100%',\n  },\n  shadow: {\n    boxShadow: `0 1px 0 -1px ${cssVar.colorBorder}, 0 1px 2px -0.5px ${cssVar.colorBorder}, 0 2px 2px -1px ${cssVar.colorBorderSecondary}, 0 3px 6px -4px ${cssVar.colorBorderSecondary}`,\n  },\n});\n"],"mappings":";AAGA,MAAa,SAAS;CACpB,YAAY;EACV,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,eAAe;EACb,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,QAAQ;EACN,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,QAAQ;EACN,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/HotkeyInput/type.d.mts

@@ -1,7 +1,6 @@
-import { CSSProperties } from "react";
-import { InputProps } from "antd";
+import { CSSProperties, FocusEventHandler } from "react";
 //#region src/HotkeyInput/type.d.ts
-interface HotkeyInputProps {
+export interface HotkeyInputProps {
   allowClear?: boolean;
   allowReset?: boolean;
   className?: string;
@@ -9,11 +8,11 @@ interface HotkeyInputProps {
   disabled?: boolean;
   hotkeyConflicts?: string[];
   isApple?: boolean;
-  onBlur?: InputProps['onBlur'];
+  onBlur?: FocusEventHandler<HTMLInputElement>;
   onChange?: (value: string) => void;
   onClear?: (currentValue: string) => void;
   onConflict?: (conflictKey: string) => void;
-  onFocus?: InputProps['onFocus'];
+  onFocus?: FocusEventHandler<HTMLInputElement>;
   onReset?: (currentValue: string, resetValue: string) => void;
   placeholder?: string;
   resetValue?: string;
@@ -29,5 +28,4 @@ interface HotkeyInputProps {
   variant?: 'filled' | 'borderless' | 'outlined';
 }
 //#endregion
-export { HotkeyInputProps };
 //# sourceMappingURL=type.d.mts.map