@wisdomgarden/torque 0.1.0

package/dist/components/_inner/tags-input/tags-input.types.d.ts

@@ -0,0 +1,57 @@
+import { SimpleComponentSizeBase } from '../../../common/components.types';
+/**
+ * 单个标签数据
+ */
+export interface TagItem {
+    /** 唯一标识，与外部 value 对应 */
+    id: string;
+    /** 显示文本 */
+    label: string;
+}
+/**
+ * TagsInput 组件 Props
+ *
+ * 与业务数据结构解耦：父组件负责将 value[] 解析为 TagItem[]，
+ * 本组件只负责渲染和交互。
+ */
+export interface TagsInputProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** 当前已选标签列表（父组件预先解析好 label） */
+    tags?: TagItem[];
+    /** 移除某个标签时的回调，参数为该标签的 id */
+    onRemove?: (id: string) => void;
+    /** 点击整个输入框时的回调（用于打开下拉） */
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    /**
+     * 搜索输入框插槽（searchable 模式下由父组件传入）。
+     * 不传时若无已选标签则显示 placeholder。
+     */
+    renderInput?: () => React.ReactNode;
+    /** 占位提示文本 */
+    placeholder?: string;
+    /**
+     * 单行模式：超过 2 个标签时折叠显示为 "+N..."
+     * @default true
+     */
+    singleLine?: boolean;
+    /** 下拉是否已打开，用于控制箭头旋转方向 */
+    dropdownOpened?: boolean;
+    /**
+     * 点击右侧箭头时的回调。传入后箭头变为可点击的开关；
+     * 不传时箭头保持纯装饰（`pointer-events-none`），点击穿透到整个输入区域。
+     */
+    onToggleDropdown?: () => void;
+    /** 尺寸 */
+    size?: SimpleComponentSizeBase;
+    /** 边框圆角风格 */
+    borderRadius?: 'full' | 'sm';
+    /** 关联的 HTML id */
+    ref?: React.Ref<HTMLInputElement>;
+    /** 错误状态，触发红色边框 */
+    error?: boolean | string;
+    /** 禁用整个输入区域 */
+    disabled?: boolean;
+    /** 有值时是否显示清除按钮 */
+    clearable?: boolean;
+    /** 点击清除按钮时的回调 */
+    onClear?: () => void;
+}

package/dist/components/alert/alert.d.ts

@@ -0,0 +1,6 @@
+import { AlertProps } from './alert.types';
+/**
+ * 显示警示或者状态信息的组件
+ */
+export declare const Alert: import("react").NamedExoticComponent<AlertProps>;
+export declare const AlertSkeleton: () => import("react").JSX.Element;

package/dist/components/alert/alert.js

@@ -0,0 +1,102 @@
+"use client";
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
+import { Skeleton as O } from "@mantine/core";
+import { useId as g } from "@mantine/hooks";
+import { Icon as z } from "@wisdomgarden/torque-icons";
+import { clsx as B } from "clsx";
+import { memo as M, useState as h, useRef as T, useLayoutEffect as _, useCallback as j } from "react";
+import "../../provider/ui-context.js";
+import { useLocale as E } from "../../provider/hooks.js";
+import { Box as l } from "../box/box.js";
+import { IconButton as H } from "../icon-button/icon-button.js";
+import { Paper as L } from "../paper/paper.js";
+import { Text as w } from "../text/text.js";
+import e from "./alert.module.css.js";
+const U = {
+  info: "info-fill",
+  success: "success-fill",
+  warning: "warning-fill-triangle",
+  wrong: "error-fill",
+  air: "copilot/generate"
+}, W = {
+  info: "status",
+  success: "status",
+  warning: "alert",
+  wrong: "alert",
+  air: "alert"
+}, D = 50, oe = M(function({
+  status: o,
+  title: i,
+  message: s,
+  closable: c = !0,
+  radius: t,
+  className: A,
+  children: R,
+  renderRight: m,
+  ...x
+}) {
+  const N = E(), [v, I] = h(!0), [S, k] = h("full"), u = T(null);
+  _(() => {
+    if (t) return;
+    const n = u.current;
+    if (!n) return;
+    const d = () => {
+      const C = n.getBoundingClientRect().height > D ? "md" : "full";
+      k(C);
+    };
+    if (d(), typeof ResizeObserver > "u") return;
+    const b = new ResizeObserver(d);
+    return b.observe(n), () => b.disconnect();
+  }, [t]);
+  const y = j(() => {
+    I(!1);
+  }, []), f = g(), p = g();
+  return v && /* @__PURE__ */ a(
+    L,
+    {
+      ref: u,
+      radius: t ?? S,
+      className: B(e.alert, A),
+      "data-status": o,
+      role: W[o],
+      "aria-live": o === "wrong" || o === "warning" ? "assertive" : "polite",
+      "aria-atomic": "true",
+      "aria-labelledby": f,
+      "aria-label": i,
+      "aria-description": s,
+      "aria-describedby": p,
+      ...x,
+      children: [
+        /* @__PURE__ */ r(l, { className: e.iconWrapper, children: /* @__PURE__ */ r(
+          z,
+          {
+            name: U[o],
+            className: e.icon,
+            "aria-hidden": "true"
+          }
+        ) }),
+        /* @__PURE__ */ a(l, { className: e.content, children: [
+          /* @__PURE__ */ r(w, { id: f, component: "span", className: e.title, children: i }),
+          /* @__PURE__ */ r(w, { id: p, component: "span", children: s ?? R })
+        ] }),
+        (c || m) && /* @__PURE__ */ a(l, { className: e.closeWrapper, children: [
+          m?.(),
+          c && /* @__PURE__ */ r(
+            H,
+            {
+              variant: "text",
+              color: "regular",
+              iconName: "close",
+              onClick: y,
+              "aria-label": N.closeAlert
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}), te = () => /* @__PURE__ */ r(O, { className: e.skeleton });
+export {
+  oe as Alert,
+  te as AlertSkeleton
+};

package/dist/components/alert/alert.module.css.js

@@ -0,0 +1,20 @@
+"use client";
+const e = "_alert_1a9me_2", t = "_iconWrapper_1a9me_39", n = "_icon_1a9me_39", o = "_content_1a9me_80", c = "_title_1a9me_87", _ = "_closeWrapper_1a9me_91", a = "_skeleton_1a9me_101", s = {
+  alert: e,
+  iconWrapper: t,
+  icon: n,
+  content: o,
+  title: c,
+  closeWrapper: _,
+  skeleton: a
+};
+export {
+  e as alert,
+  _ as closeWrapper,
+  o as content,
+  s as default,
+  n as icon,
+  t as iconWrapper,
+  a as skeleton,
+  c as title
+};

package/dist/components/alert/alert.types.d.ts

@@ -0,0 +1,18 @@
+export interface AlertProps {
+    /** 警告状态类型：info(信息)、success(成功)、warning(警告)、wrong(错误)、air(AIR 专属) */
+    status: 'info' | 'success' | 'warning' | 'wrong' | 'air';
+    /** 圆角大小；未传时高度不超过 50px 使用 full，超过 50px 使用 md */
+    radius?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'full';
+    /** 警告标题 */
+    title?: string;
+    /** 警告详细信息内容 */
+    message?: string;
+    /** 是否显示关闭按钮 */
+    closable?: boolean;
+    /** 自定义 CSS 类名,作用在最外层div上 */
+    className?: string;
+    /** 右侧区域的自定义渲染函数 */
+    renderRight?: () => React.ReactNode;
+    /** 子节点内容 */
+    children?: React.ReactNode;
+}

package/dist/components/alert/index.d.ts

@@ -0,0 +1,2 @@
+export type { AlertProps } from './alert.types';
+export { Alert, AlertSkeleton } from './alert';

package/dist/components/alert/index.js

@@ -0,0 +1,6 @@
+"use client";
+import { Alert as l, AlertSkeleton as r } from "./alert.js";
+export {
+  l as Alert,
+  r as AlertSkeleton
+};

package/dist/components/base-input/base-input.d.ts

@@ -0,0 +1,5 @@
+import { BaseInputProps } from './base-input.types';
+export declare const BaseInput: {
+    (props: BaseInputProps): import("react").JSX.Element;
+    displayName: string;
+};

package/dist/components/base-input/base-input.js

@@ -0,0 +1,143 @@
+"use client";
+import { jsxs as te, jsx as l } from "react/jsx-runtime";
+import { useMergedRef as ne } from "@mantine/hooks";
+import { useRef as oe, useState as re } from "react";
+import { useImeSafeInput as ie } from "../../common/use-ime-safe-input.js";
+import { BaseInputLeftSection as ae } from "./subs/base-input-left-section.js";
+import { BaseInputRightSection as se } from "./subs/base-input-right-section.js";
+import { BaseInputTarget as ue } from "./subs/base-input-target.js";
+import { BaseInputWrapper as le } from "./subs/base-input-wrapper.js";
+const ce = (t) => typeof t == "string" ? t : typeof t == "number" ? String(t) : "", me = (t) => {
+  const {
+    classNames: i,
+    size: I = "md",
+    borderRadius: b = "full",
+    error: c,
+    disabled: a,
+    pointer: v,
+    onClick: S,
+    onMouseEnter: y,
+    onMouseLeave: B,
+    leftIconName: R,
+    leftIconUseOriginalColor: E,
+    renderLeftSection: L,
+    clearable: N,
+    rightIconName: x,
+    rightToolTipContent: V,
+    rightIconAriaLabel: M,
+    rightIconClassName: O,
+    rightIconColor: T,
+    rightIconUseOriginalColor: j,
+    onRightIconClick: k,
+    disableMaxLengthLabel: m,
+    renderRightSection: w,
+    renderRoot: A,
+    hideValue: D,
+    textColor: U,
+    children: z,
+    ref: W,
+    onChange: d,
+    onClear: _,
+    value: e,
+    defaultValue: s,
+    maxLength: u,
+    className: de,
+    wrapperRef: $,
+    imeSafe: q = !0,
+    onCompositionStart: F,
+    onCompositionEnd: G,
+    ...p
+  } = t, o = oe(null), H = ne(W, o), [J, f] = re(() => typeof s == "string" ? s : typeof e == "string" ? e : typeof e == "number" ? String(e) : ""), r = ie(e, (n) => {
+    const h = o.current, ee = {
+      nativeEvent: new Event("input"),
+      target: h ?? { value: n },
+      currentTarget: h ?? { value: n }
+    };
+    d?.(ee);
+  }), g = q && e !== void 0, K = (n) => {
+    f(n.target.value), d?.(n);
+  }, P = (n) => {
+    e === void 0 && o.current && (o.current.value = ""), f(""), o.current?.focus(), _?.(n);
+  }, Q = !m && !!u && typeof e == "string", C = t.id && Q ? `${t.id}-counter` : void 0, X = [p["aria-describedby"], C].filter(Boolean).join(" ") || void 0, Y = g ? {
+    value: r.value,
+    onChange: r.onChange,
+    onCompositionStart: r.onCompositionStart,
+    onCompositionEnd: r.onCompositionEnd
+  } : {
+    value: e,
+    onChange: K,
+    onCompositionStart: F,
+    onCompositionEnd: G
+  }, Z = g ? ce(r.value) : J;
+  return /* @__PURE__ */ te(
+    le,
+    {
+      ref: $,
+      classNames: i,
+      size: I,
+      borderRadius: b,
+      error: c,
+      disabled: a,
+      pointer: v,
+      inputRef: o,
+      onClick: S,
+      onMouseEnter: y,
+      onMouseLeave: B,
+      children: [
+        /* @__PURE__ */ l(
+          ae,
+          {
+            leftIconName: R,
+            leftIconUseOriginalColor: E,
+            classNames: i,
+            renderLeftSection: L
+          }
+        ),
+        /* @__PURE__ */ l(
+          ue,
+          {
+            ref: H,
+            error: c,
+            disabled: a,
+            ...Y,
+            defaultValue: s,
+            maxLength: u,
+            hideValue: D,
+            textColor: U,
+            classNames: i,
+            renderRoot: A,
+            ...p,
+            "aria-describedby": X,
+            children: z
+          }
+        ),
+        /* @__PURE__ */ l(
+          se,
+          {
+            clearable: N,
+            rightIconName: x,
+            rightToolTipContent: V,
+            rightIconAriaLabel: M,
+            rightIconClassName: O,
+            rightIconColor: T,
+            rightIconUseOriginalColor: j,
+            onRightIconClick: k,
+            disableMaxLengthLabel: m,
+            maxLength: u,
+            value: e,
+            disabled: a,
+            classNames: i,
+            renderRightSection: w,
+            internalValue: Z,
+            onClear: P,
+            counterId: C
+          }
+        )
+      ]
+    }
+  );
+};
+me.displayName = "BaseInput";
+export {
+  me as BaseInput
+};

package/dist/components/base-input/base-input.types.d.ts

@@ -0,0 +1,89 @@
+import React from 'react';
+import { FormProps, InputSize, InputWrapProps, RefProps, RootClassNameProps } from '../../common/components.types';
+import { ButtonColor } from '../button/button.types';
+import type { IconName } from '@wisdomgarden/torque-icons';
+/**
+ * 基础输入框组件属性
+ */
+export interface InnerInputProps extends InputWrapProps, FormProps, RootClassNameProps, RefProps<HTMLInputElement>, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'form' | 'size'> {
+    /** 是否显示清空按钮 */
+    clearable?: boolean;
+    /** 后置图标名称 */
+    rightIconName?: IconName;
+    /** 后置图标的 Tooltip 提示内容 */
+    rightToolTipContent?: string;
+    /** 后置图标按钮的可访问标签，onRightIconClick 存在时应提供 */
+    rightIconAriaLabel?: string;
+    /** 后置图标的自定义类名 */
+    rightIconClassName?: string;
+    /** 后置图标按钮的颜色，默认 secondary（text-2） */
+    rightIconColor?: ButtonColor;
+    /** 前置图标名称 */
+    leftIconName?: IconName;
+    /** 前置图标是否使用其原色（多色 SVG） */
+    leftIconUseOriginalColor?: boolean;
+    /** 后置图标是否使用其原色（多色 SVG） */
+    rightIconUseOriginalColor?: boolean;
+    /** 输入框尺寸 */
+    size?: InputSize;
+    /** 错误状态或错误提示信息 */
+    error?: boolean | string;
+    /** 设置了 maxLength 时，是否隐藏右侧的字符长度统计标签 */
+    disableMaxLengthLabel?: boolean;
+    /** 点击清空按钮时的回调事件 */
+    onClear?: (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /** 点击后置图标时的回调事件 */
+    onRightIconClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /** 文本颜色 */
+    textColor?: string;
+    /** 输入框的圆角大小 */
+    borderRadius?: 'sm' | 'full';
+    /** 鼠标悬停时是否显示为指针手型（通常用于不可输入但可点击的场景，如 Select） */
+    pointer?: boolean;
+    /** 是否隐藏输入框内的值 */
+    hideValue?: boolean;
+    /**
+     * 自定义根节点渲染函数，接收完整的 wrapper props（className、data 属性、事件等），
+     * 由调用方决定渲染什么元素
+     */
+    renderRoot?: (props: Record<string, any>) => any;
+    /**
+     * 各内部层的额外 className，与内部样式合并
+     */
+    classNames?: BaseInputClassNames;
+    /**
+     * 完全自定义左侧区域渲染。
+     * 提供此 prop 时，leftIconName / leftIconUseOriginalColor 被忽略。
+     */
+    renderLeftSection?: React.ReactNode;
+    /**
+     * 完全自定义右侧区域渲染。
+     * 提供此 prop 时，rightIconName / clearable / disableMaxLengthLabel 等被忽略。
+     */
+    renderRightSection?: React.ReactNode;
+    /**
+     * 外层容器 div 的 ref
+     */
+    wrapperRef?: React.Ref<HTMLDivElement>;
+    /**
+     * 是否启用中文输入法安全模式。
+     * 默认 `true`：中文输入过程中不触发 `onChange`，输入法确认后（compositionend）再提交最终值，
+     * 避免拼音中间态触发搜索/过滤等副作用。
+     * 显式传 `false` 可恢复原生行为（每次按键都触发 onChange）。
+     */
+    imeSafe?: boolean;
+}
+/**
+ * 各内部层的额外 className，与内部样式合并（追加，不替换）
+ */
+export interface BaseInputClassNames {
+    /** 外层容器 div */
+    wrapper?: string;
+    /** 原生 <input> 元素 */
+    input?: string;
+    /** 左侧区域容器 */
+    leftSection?: string;
+    /** 右侧区域容器 */
+    rightSection?: string;
+}
+export type BaseInputProps = InnerInputProps;

package/dist/components/base-input/index.d.ts

@@ -0,0 +1,5 @@
+export { BaseInput } from './base-input';
+export { BaseInputWrapper } from './subs/base-input-wrapper';
+export { BaseInputTarget } from './subs/base-input-target';
+export * from './util';
+export type * from './base-input.types';

package/dist/components/base-input/index.js

@@ -0,0 +1,11 @@
+"use client";
+import { BaseInput as o } from "./base-input.js";
+import { BaseInputWrapper as t } from "./subs/base-input-wrapper.js";
+import { BaseInputTarget as m } from "./subs/base-input-target.js";
+import { getFormProps as f } from "./util.js";
+export {
+  o as BaseInput,
+  m as BaseInputTarget,
+  t as BaseInputWrapper,
+  f as getFormProps
+};

package/dist/components/base-input/styles/base-input-variables.module.css.js

@@ -0,0 +1,8 @@
+"use client";
+const t = "_inputVar_z2vhf_2", a = {
+  inputVar: t
+};
+export {
+  a as default,
+  t as inputVar
+};

package/dist/components/base-input/styles/base-input.module.css.js

@@ -0,0 +1,24 @@
+"use client";
+const t = "_inputRoot_16s57_2", n = "_inputNative_16s57_19", e = "_inputNativeHidden_16s57_43", i = "_leftSection_16s57_47", o = "_rightSection_16s57_55", s = "_maxLengthLabel_16s57_61", _ = "_disabledRight_16s57_68", a = "_clearButton_16s57_72", c = "_noInteraction_16s57_77", l = {
+  inputRoot: t,
+  inputNative: n,
+  inputNativeHidden: e,
+  leftSection: i,
+  rightSection: o,
+  maxLengthLabel: s,
+  disabledRight: _,
+  clearButton: a,
+  noInteraction: c
+};
+export {
+  a as clearButton,
+  l as default,
+  _ as disabledRight,
+  n as inputNative,
+  e as inputNativeHidden,
+  t as inputRoot,
+  i as leftSection,
+  s as maxLengthLabel,
+  c as noInteraction,
+  o as rightSection
+};

package/dist/components/base-input/subs/base-input-left-section.d.ts

@@ -0,0 +1,10 @@
+import { BaseInputClassNames } from '../base-input.types';
+import type { IconName } from '@wisdomgarden/torque-icons';
+interface BaseInputLeftSectionProps {
+    readonly leftIconName?: IconName;
+    readonly leftIconUseOriginalColor?: boolean;
+    readonly classNames?: BaseInputClassNames;
+    readonly renderLeftSection?: React.ReactNode;
+}
+export declare const BaseInputLeftSection: ({ leftIconName, leftIconUseOriginalColor, classNames, renderLeftSection, }: BaseInputLeftSectionProps) => import("react").JSX.Element | null;
+export {};

package/dist/components/base-input/subs/base-input-left-section.js

@@ -0,0 +1,29 @@
+"use client";
+import { jsx as r, Fragment as o } from "react/jsx-runtime";
+import { Icon as s } from "@wisdomgarden/torque-icons";
+import { clsx as l } from "clsx";
+import m from "../styles/base-input.module.css.js";
+const p = ({
+  leftIconName: i,
+  leftIconUseOriginalColor: e,
+  classNames: n,
+  renderLeftSection: t
+}) => t !== void 0 ? /* @__PURE__ */ r(o, { children: t }) : i ? /* @__PURE__ */ r(
+  "span",
+  {
+    className: l(m.leftSection, n?.leftSection),
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ r(
+      s,
+      {
+        name: i,
+        width: 16,
+        height: 16,
+        useOriginalColor: e
+      }
+    )
+  }
+) : null;
+export {
+  p as BaseInputLeftSection
+};

package/dist/components/base-input/subs/base-input-right-section.d.ts

@@ -0,0 +1,23 @@
+import { BaseInputClassNames, BaseInputProps } from '../base-input.types';
+import type { IconName } from '@wisdomgarden/torque-icons';
+interface BaseInputRightSectionProps {
+    readonly clearable?: boolean;
+    readonly rightIconName?: IconName;
+    readonly rightToolTipContent?: string;
+    readonly rightIconAriaLabel?: string;
+    readonly rightIconClassName?: string;
+    readonly rightIconColor?: BaseInputProps['rightIconColor'];
+    readonly rightIconUseOriginalColor?: boolean;
+    readonly onRightIconClick?: BaseInputProps['onRightIconClick'];
+    readonly disableMaxLengthLabel?: boolean;
+    readonly maxLength?: number;
+    readonly value?: BaseInputProps['value'];
+    readonly disabled?: boolean;
+    readonly classNames?: BaseInputClassNames;
+    readonly renderRightSection?: React.ReactNode;
+    readonly internalValue: string;
+    readonly onClear: (e?: React.MouseEvent<HTMLButtonElement>) => void;
+    readonly counterId?: string;
+}
+export declare const BaseInputRightSection: ({ clearable, rightIconName, rightToolTipContent, rightIconAriaLabel, rightIconClassName, rightIconColor, rightIconUseOriginalColor, onRightIconClick, disableMaxLengthLabel, maxLength, value, disabled, classNames, renderRightSection, internalValue, onClear, counterId, }: BaseInputRightSectionProps) => import("react").JSX.Element | null;
+export {};

package/dist/components/base-input/subs/base-input-right-section.js

@@ -0,0 +1,87 @@
+"use client";
+import { jsx as e, Fragment as M, jsxs as x } from "react/jsx-runtime";
+import { clsx as i } from "clsx";
+import "../../../provider/ui-context.js";
+import "react";
+import { useLocale as P } from "../../../provider/hooks.js";
+import { IconButton as v } from "../../icon-button/icon-button.js";
+import { Tooltip as A } from "../../tooltip/index.js";
+import a from "../styles/base-input.module.css.js";
+const I = ({
+  clearable: g,
+  rightIconName: c,
+  rightToolTipContent: t,
+  rightIconAriaLabel: l,
+  rightIconClassName: w,
+  rightIconColor: B,
+  rightIconUseOriginalColor: N,
+  onRightIconClick: r,
+  disableMaxLengthLabel: b,
+  maxLength: m,
+  value: s,
+  disabled: n,
+  classNames: p,
+  renderRightSection: d,
+  internalValue: y,
+  onClear: L,
+  counterId: S
+}) => {
+  const j = P();
+  if (d !== void 0)
+    return /* @__PURE__ */ e(M, { children: d });
+  const u = g && (y || s) && !n, f = !!c, h = !b && !!m && typeof s == "string";
+  if (!u && !f && !h && !p?.rightSection)
+    return null;
+  r && !l && !t && console.warn(
+    "[BaseInput]: 当提供 onRightIconClick 时，必须同时提供 rightIconAriaLabel 或 rightToolTipContent，以确保按钮可访问（WCAG 4.1.2）。"
+  );
+  const D = i(
+    w,
+    n && a.disabledRight,
+    !t && !r && a.noInteraction
+  );
+  return /* @__PURE__ */ x("span", { className: i(a.rightSection, p?.rightSection), children: [
+    u && /* @__PURE__ */ e(
+      v,
+      {
+        className: i(
+          a.clearButton,
+          n && a.disabledRight
+        ),
+        disabled: n,
+        iconName: "icon-clear-input",
+        variant: "text",
+        "aria-label": j.clear,
+        color: "secondary",
+        onMouseDown: (o) => o.preventDefault(),
+        onClick: (o) => {
+          o.stopPropagation(), L(o);
+        }
+      }
+    ),
+    f && /* @__PURE__ */ e(A, { label: t, disabled: !t, children: /* @__PURE__ */ e(
+      v,
+      {
+        className: D,
+        renderRoot: r ? void 0 : (o) => /* @__PURE__ */ e("span", { ...o }),
+        iconName: c,
+        variant: "text",
+        useOriginalColor: N,
+        "aria-label": r ? l ?? t ?? "" : void 0,
+        "aria-hidden": r ? void 0 : !0,
+        onClick: r ? (o) => {
+          o.stopPropagation(), r(o);
+        } : void 0,
+        color: B ?? "secondary"
+      }
+    ) }),
+    h && /* @__PURE__ */ x("span", { id: S, className: a.maxLengthLabel, children: [
+      s.length,
+      "/",
+      m
+    ] })
+  ] });
+};
+export {
+  I as BaseInputRightSection
+};

package/dist/components/base-input/subs/base-input-target.d.ts

@@ -0,0 +1,11 @@
+import { BaseInputClassNames, BaseInputProps } from '../base-input.types';
+interface BaseInputTargetProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    readonly ref: React.Ref<HTMLInputElement>;
+    readonly error?: boolean | string;
+    readonly hideValue?: boolean;
+    readonly textColor?: string;
+    readonly classNames?: BaseInputClassNames;
+    readonly renderRoot?: BaseInputProps['renderRoot'];
+}
+export declare const BaseInputTarget: ({ ref, error, hideValue, textColor, classNames, renderRoot, children, required, ...rest }: BaseInputTargetProps) => any;
+export {};