tango-ui-cw 1.0.10 → 1.2.0

package/dist/component/TDrawer/index.d.ts

@@ -1,58 +1,59 @@
-import type { CSSProperties, HTMLAttributes, ReactNode } from "react";
-import type { SxValue } from "../CSSFab";
-
-export type DrawerType = "top" | "bottom" | "left" | "right";
-
-export type DrawerI18nKey = "title" | "okText" | "cancelText" | "closeAriaLabel" | (string & {});
-
-export type DrawerLocaleText = Partial<{
-  title: string;
-  okText: string;
-  cancelText: string;
-  closeAriaLabel: string;
-}>;
-
-export type DrawerFooterButton = {
-  key: string;
-  text: string;
-  onClick: () => void;
-};
-
-export interface DrawerProps
-  extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "style" | "className"> {
-  /** 抽屉内容 */
-  children?: ReactNode;
-  /** 标题，优先级高于 i18n */
-  title?: string;
-  /** 确定按钮文案，优先级高于 i18n */
-  okText?: string;
-  /** 取消按钮文案，优先级高于 i18n */
-  cancelText?: string;
-  /** 是否打开 */
-  open?: boolean;
-  /** 关闭回调 */
-  onClose?: () => void;
-  /** 确定回调，若未传则默认调用 onClose */
-  onOk?: () => void;
-  /** 抽屉方向 */
-  type?: DrawerType;
-  /** 容器宽度（left/right 生效） */
-  width?: string | number;
-  /** 容器高度（top/bottom 生效） */
-  height?: string | number;
-  /** Style extension via CSSFab sx */
-  sx?: SxValue;
-  style?: CSSProperties;
-  className?: string;
-  /** 点击遮罩是否关闭 */
-  maskClosable?: boolean;
-  /** 自定义底部按钮，传入后替代默认的取消/确定 */
-  footerButtons?: DrawerFooterButton[];
-  /** 覆盖 locale 文案 */
-  localeText?: DrawerLocaleText;
-}
-
-declare function Drawer(props: DrawerProps): JSX.Element;
-
-export { Drawer };
-export default Drawer;
+import type { CSSProperties, HTMLAttributes, ReactNode } from "react";
+import type { SxValue } from "../CSSFab";
+
+export type DrawerSlotNames = readonly ["overlay", "container", "header", "title", "closeBtn", "content", "footer"];
+export type DrawerType = "top" | "bottom" | "left" | "right";
+
+export type DrawerI18nKey = "title" | "okText" | "cancelText" | "closeAriaLabel" | (string & {});
+
+export type DrawerLocaleText = Partial<{
+  title: string;
+  okText: string;
+  cancelText: string;
+  closeAriaLabel: string;
+}>;
+
+export type DrawerFooterButton = {
+  key: string;
+  text: string;
+  onClick: () => void;
+};
+
+export interface DrawerProps
+  extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "style" | "className"> {
+  /** 抽屉内容 */
+  children?: ReactNode;
+  /** 标题，优先级高于 i18n */
+  title?: string;
+  /** 确定按钮文案，优先级高于 i18n */
+  okText?: string;
+  /** 取消按钮文案，优先级高于 i18n */
+  cancelText?: string;
+  /** 是否打开 */
+  open?: boolean;
+  /** 关闭回调 */
+  onClose?: () => void;
+  /** 确定回调，若未传则默认调用 onClose */
+  onOk?: () => void;
+  /** 抽屉方向 */
+  type?: DrawerType;
+  /** 容器宽度（left/right 生效） */
+  width?: string | number;
+  /** 容器高度（top/bottom 生效） */
+  height?: string | number;
+  /** Style extension via CSSFab sx */
+  sx?: SxValue;
+  style?: CSSProperties;
+  className?: string;
+  /** 点击遮罩是否关闭 */
+  maskClosable?: boolean;
+  /** 自定义底部按钮，传入后替代默认的取消/确定 */
+  footerButtons?: DrawerFooterButton[];
+  /** 覆盖 locale 文案 */
+  localeText?: DrawerLocaleText;
+}
+
+declare function Drawer(props: DrawerProps): JSX.Element;
+
+export { Drawer };
+export default Drawer;

package/dist/component/TInput/index.d.ts

@@ -1,81 +1,111 @@
-import type { CSSProperties, InputHTMLAttributes, TextareaHTMLAttributes } from "react";
-import type { SxValue } from "../CSSFab";
-
-export type InputType = "default" | "textarea" | "password";
-export type InputSize = "small" | "medium" | "large" | "huge";
-export type InputStatus = "default" | "error";
-
-export interface InputProps
-  extends Omit<InputHTMLAttributes<HTMLInputElement> & TextareaHTMLAttributes<HTMLTextAreaElement>, "style" | "className" | "size" | "type" | "onChange"> {
-  /** 输入类型 */
-  type?: InputType;
-  /** 尺寸 */
-  size?: InputSize;
-  /** 校验状态 */
-  status?: InputStatus;
-  /** Style extension via CSSFab sx */
-  sx?: SxValue;
-  style?: CSSProperties;
-  className?: string;
-  /** 点击事件 */
-  onClick?: (e: React.MouseEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-  /** 值变化回调，参数为当前输入值 */
-  onChange?: (value: string) => void;
-  /** 受控值 */
-  value?: string;
-  /** 非受控默认值 */
-  defaultValue?: string;
-  /** 是否禁用 */
-  disabled?: boolean;
-  /** 占位文案 */
-  placeholder?: string;
-  /** 最大字符数 */
-  maxlength?: number;
-}
-
-declare function Input(props: InputProps): JSX.Element;
-
-// antd 风格：Input.MaterialInput / const { MaterialInput } = Input
-interface InputNamespace {
-  (props: InputProps): JSX.Element;
-  MaterialInput: typeof MaterialInput;
-}
-
-declare const InputWithType: InputNamespace;
-export { InputWithType as Input };
-export default Input;
-
-// MaterialInput 类型
-export type MaterialInputSize = "small" | "medium" | "large" | "huge";
-
-export interface MaterialInputLocaleText {
-  label?: string;
-}
-
-export interface MaterialInputProps
-  extends Omit<InputHTMLAttributes<HTMLInputElement>, "style" | "className" | "size" | "onChange" | "type"> {
-  /** 浮动标签文案 */
-  label?: string;
-  /** 原生 input type */
-  type?: string;
-  /** 尺寸 */
-  size?: MaterialInputSize;
-  /** Style extension via CSSFab sx */
-  sx?: SxValue;
-  style?: CSSProperties;
-  className?: string;
-  /** 值变化回调，参数为当前输入值 */
-  onChange?: (value: string) => void;
-  /** 受控值 */
-  value?: string;
-  /** 非受控默认值 */
-  defaultValue?: string;
-  /** 是否禁用 */
-  disabled?: boolean;
-  /** 覆盖标签文案 */
-  localeText?: MaterialInputLocaleText;
-}
-
-declare function MaterialInput(props: MaterialInputProps): JSX.Element;
-
-export { MaterialInput };
+import type { CSSProperties, InputHTMLAttributes, ReactNode, TextareaHTMLAttributes } from "react";
+import type { SxValue } from "../CSSFab";
+
+export type InputSlotNames = readonly ["root", "input", "prefix", "suffix", "clearIcon"];
+export type InputType = "default" | "textarea" | "password";
+export type InputSize = "small" | "medium" | "large" | "huge";
+export type InputStatus = "default" | "error";
+
+// added by clayw on 20260624: Input localeText 类型
+export type InputLocaleText = Partial<{
+  clearAriaLabel: string;
+  countTemplate: string;
+}>;
+
+export interface InputProps
+  extends Omit<InputHTMLAttributes<HTMLInputElement> & TextareaHTMLAttributes<HTMLTextAreaElement>, "style" | "className" | "size" | "type" | "onChange"> {
+  /** 输入类型 */
+  type?: InputType;
+  /** 尺寸 */
+  size?: InputSize;
+  /** 校验状态 */
+  status?: InputStatus;
+  /** Style extension via CSSFab sx */
+  sx?: SxValue;
+  style?: CSSProperties;
+  className?: string;
+  /** 点击事件 */
+  onClick?: (e: React.MouseEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+  /** 值变化回调，参数为当前输入值 */
+  onChange?: (value: string) => void;
+  /** 受控值 */
+  value?: string;
+  /** 非受控默认值 */
+  defaultValue?: string;
+  /** 是否禁用 */
+  disabled?: boolean;
+  /** 占位文案 */
+  placeholder?: string;
+  /** 最大字符数 */
+  maxLength?: number;
+  /** 前缀图标/文字，位于输入框内左侧 added by clayw on 20260624 */
+  prefix?: ReactNode;
+  /** 后缀图标/文字，位于输入框内右侧 added by clayw on 20260624 */
+  suffix?: ReactNode;
+  /** 是否显示清除按钮，默认 true，值为空时隐藏图标 added by clayw on 20260624 */
+  allowClear?: boolean;
+  /** 是否显示字数统计，默认 false，支持 i18n added by clayw on 20260624 */
+  showCount?: boolean;
+  /** 覆盖内置文案 added by clayw on 20260624 */
+  localeText?: InputLocaleText;
+}
+
+declare function Input(props: InputProps): JSX.Element;
+
+// antd 风格：Input.MaterialInput / const { MaterialInput } = Input
+interface InputNamespace {
+  (props: InputProps): JSX.Element;
+  MaterialInput: typeof MaterialInput;
+}
+
+declare const InputWithType: InputNamespace;
+export { InputWithType as Input };
+export default Input;
+
+// MaterialInput 类型
+export type MaterialInputSlotNames = readonly ["root", "input", "label", "prefix", "suffix", "clearIcon"];
+export type MaterialInputSize = "small" | "medium" | "large" | "huge";
+
+export type MaterialInputLocaleText = Partial<{
+  label?: string;
+  clearAriaLabel?: string;
+  countTemplate?: string;
+}>;
+
+export interface MaterialInputProps
+  extends Omit<InputHTMLAttributes<HTMLInputElement>, "style" | "className" | "size" | "onChange" | "type"> {
+  /** 浮动标签文案 */
+  label?: string;
+  /** 原生 input type */
+  type?: string;
+  /** 尺寸 */
+  size?: MaterialInputSize;
+  /** Style extension via CSSFab sx */
+  sx?: SxValue;
+  style?: CSSProperties;
+  className?: string;
+  /** 值变化回调，参数为当前输入值 */
+  onChange?: (value: string) => void;
+  /** 受控值 */
+  value?: string;
+  /** 非受控默认值 */
+  defaultValue?: string;
+  /** 是否禁用 */
+  disabled?: boolean;
+  /** 覆盖标签文案 */
+  localeText?: MaterialInputLocaleText;
+  /** 前缀图标/文字 added by clayw on 20260624 */
+  prefix?: ReactNode;
+  /** 后缀图标/文字 added by clayw on 20260624 */
+  suffix?: ReactNode;
+  /** 是否显示清除按钮，默认 true added by clayw on 20260624 */
+  allowClear?: boolean;
+  /** 是否显示字数统计，默认 false added by clayw on 20260624 */
+  showCount?: boolean;
+  /** 最大字符数 added by clayw on 20260624 */
+  maxLength?: number;
+}
+
+declare function MaterialInput(props: MaterialInputProps): JSX.Element;
+
+export { MaterialInput };

package/dist/component/TLayout/index.d.ts

@@ -1,133 +1,136 @@
-import type {
-  CSSProperties,
-  HTMLAttributes,
-  ReactNode,
-  Ref,
-} from "react";
-
-/** sx 值类型（引用自 CSSFab） */
-export type SxValue =
-  | string
-  | { tw?: string; className?: string; css?: CSSProperties; style?: CSSProperties }
-  | Record<string, unknown>;
-
-/** Layout 主容器 Props */
-export interface LayoutProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 是否包含侧边栏（不传则自动检测 Sider 子组件） */
-  hasSider?: boolean;
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Header Props */
-export interface LayoutHeaderProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Footer Props */
-export interface LayoutFooterProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Sider Props */
-export interface LayoutSiderProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 侧边栏宽度，默认取 --layout-sider-width */
-  width?: string | number;
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Content Props */
-export interface LayoutContentProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Toc Props（右侧目录导航） */
-export interface LayoutTocProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
-  /** 目录导航宽度，默认取 --layout-toc-width */
-  width?: string | number;
-  /** 样式扩展 */
-  sx?: SxValue;
-  /** 行内样式 */
-  style?: CSSProperties;
-  /** 额外 CSS 类名 */
-  className?: string;
-  /** 子元素 */
-  children?: ReactNode;
-  /** ref 转发 */
-  ref?: Ref<HTMLElement>;
-}
-
-/** Layout 复合组件类型 */
-interface LayoutComponent
-  extends React.ForwardRefExoticComponent<
-    LayoutProps & React.RefAttributes<HTMLElement>
-  > {
-  Header: React.ForwardRefExoticComponent<
-    LayoutHeaderProps & React.RefAttributes<HTMLElement>
-  >;
-  Footer: React.ForwardRefExoticComponent<
-    LayoutFooterProps & React.RefAttributes<HTMLElement>
-  >;
-  Sider: React.ForwardRefExoticComponent<
-    LayoutSiderProps & React.RefAttributes<HTMLElement>
-  >;
-  Content: React.ForwardRefExoticComponent<
-    LayoutContentProps & React.RefAttributes<HTMLElement>
-  >;
-  Toc: React.ForwardRefExoticComponent<
-    LayoutTocProps & React.RefAttributes<HTMLElement>
-  >;
-}
-
-export declare const Header: LayoutComponent["Header"];
-export declare const Footer: LayoutComponent["Footer"];
-export declare const Sider: LayoutComponent["Sider"];
-export declare const Content: LayoutComponent["Content"];
-export declare const Toc: LayoutComponent["Toc"];
-
-declare const Layout: LayoutComponent;
-export default Layout;
+import type {
+  CSSProperties,
+  HTMLAttributes,
+  ReactNode,
+  Ref,
+} from "react";
+
+/** Layout sx slot 名列表 */
+export type LayoutSlotNames = readonly ["root"];
+
+/** sx 值类型（引用自 CSSFab） */
+export type SxValue =
+  | string
+  | { tw?: string; className?: string; css?: CSSProperties; style?: CSSProperties }
+  | Record<string, unknown>;
+
+/** Layout 主容器 Props */
+export interface LayoutProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 是否包含侧边栏（不传则自动检测 Sider 子组件） */
+  hasSider?: boolean;
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Header Props */
+export interface LayoutHeaderProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Footer Props */
+export interface LayoutFooterProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Sider Props */
+export interface LayoutSiderProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 侧边栏宽度，默认取 --layout-sider-width */
+  width?: string | number;
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Content Props */
+export interface LayoutContentProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Toc Props（右侧目录导航） */
+export interface LayoutTocProps extends Omit<HTMLAttributes<HTMLElement>, "style"> {
+  /** 目录导航宽度，默认取 --layout-toc-width */
+  width?: string | number;
+  /** 样式扩展 */
+  sx?: SxValue;
+  /** 行内样式 */
+  style?: CSSProperties;
+  /** 额外 CSS 类名 */
+  className?: string;
+  /** 子元素 */
+  children?: ReactNode;
+  /** ref 转发 */
+  ref?: Ref<HTMLElement>;
+}
+
+/** Layout 复合组件类型 */
+interface LayoutComponent
+  extends React.ForwardRefExoticComponent<
+    LayoutProps & React.RefAttributes<HTMLElement>
+  > {
+  Header: React.ForwardRefExoticComponent<
+    LayoutHeaderProps & React.RefAttributes<HTMLElement>
+  >;
+  Footer: React.ForwardRefExoticComponent<
+    LayoutFooterProps & React.RefAttributes<HTMLElement>
+  >;
+  Sider: React.ForwardRefExoticComponent<
+    LayoutSiderProps & React.RefAttributes<HTMLElement>
+  >;
+  Content: React.ForwardRefExoticComponent<
+    LayoutContentProps & React.RefAttributes<HTMLElement>
+  >;
+  Toc: React.ForwardRefExoticComponent<
+    LayoutTocProps & React.RefAttributes<HTMLElement>
+  >;
+}
+
+export declare const Header: LayoutComponent["Header"];
+export declare const Footer: LayoutComponent["Footer"];
+export declare const Sider: LayoutComponent["Sider"];
+export declare const Content: LayoutComponent["Content"];
+export declare const Toc: LayoutComponent["Toc"];
+
+declare const Layout: LayoutComponent;
+export default Layout;