@hanwenbo/x-taro-ui 0.0.1

package/es/components/tag/tokens.js

@@ -0,0 +1,173 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * Tag Component Tokens
+ * Following x-design-system tag.yaml spec
+ */
+
+import { useMemo } from 'react';
+import { useTokens, withOpacity } from "../../theme";
+function getReadableTagTextColor(color, darkText, lightText) {
+  var rawHex = color.startsWith('#') ? color.slice(1) : '';
+  var normalized = rawHex.length === 3 || rawHex.length === 4 ? rawHex.split('').map(function (character) {
+    return "".concat(character).concat(character);
+  }).join('') : rawHex;
+  if (normalized.length !== 6 && normalized.length !== 8 || !/^[\da-f]+$/i.test(normalized)) {
+    return undefined;
+  }
+  var red = parseInt(normalized.slice(0, 2), 16);
+  var green = parseInt(normalized.slice(2, 4), 16);
+  var blue = parseInt(normalized.slice(4, 6), 16);
+  var luminance = (0.299 * red + 0.587 * green + 0.114 * blue) / 255;
+  return luminance > 0.62 ? darkText : lightText;
+}
+
+/**
+ * Get tag size tokens
+ */
+export function useTagSizeTokens() {
+  var size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'middle';
+  return useMemo(function () {
+    var sizeMap = {
+      mini: {
+        paddingInline: 6,
+        paddingBlock: 2,
+        fontSize: 12,
+        lineHeight: 16
+      },
+      small: {
+        paddingInline: 8,
+        paddingBlock: 2,
+        fontSize: 12,
+        lineHeight: 16
+      },
+      middle: {
+        paddingInline: 10,
+        paddingBlock: 4,
+        fontSize: 14,
+        lineHeight: 20
+      },
+      large: {
+        paddingInline: 12,
+        paddingBlock: 6,
+        fontSize: 16,
+        lineHeight: 24
+      }
+    };
+    var tokens = sizeMap[size];
+    return _objectSpread({}, tokens);
+  }, [size]);
+}
+
+/**
+ * Get tag colors for variant and color
+ */
+export function useTagColors() {
+  var variant = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'default';
+  var color = arguments.length > 1 ? arguments[1] : undefined;
+  var _useTokens = useTokens(),
+    colors = _useTokens.colors,
+    namedColors = _useTokens.namedColors;
+  return useMemo(function () {
+    var _getReadableTagTextCo;
+    // Get actual color value
+    var actualColor = color;
+    if (color && color in namedColors) {
+      actualColor = namedColors[color];
+    }
+    var baseColor = actualColor || colors.primary;
+    if (actualColor && variant !== 'solid') {
+      return {
+        background: withOpacity(actualColor, variant === 'outlined' ? 0.06 : 0.12),
+        color: actualColor,
+        border: withOpacity(actualColor, variant === 'outlined' ? 0.36 : 0.24)
+      };
+    }
+    switch (variant) {
+      case 'solid':
+        return {
+          background: baseColor,
+          color: actualColor ? (_getReadableTagTextCo = getReadableTagTextColor(actualColor, colors.foreground, colors['primary-foreground'])) !== null && _getReadableTagTextCo !== void 0 ? _getReadableTagTextCo : colors['primary-foreground'] : colors['primary-foreground'],
+          border: baseColor
+        };
+      case 'filled':
+        return {
+          background: colors.muted,
+          color: colors.foreground,
+          border: colors.border
+        };
+      case 'outlined':
+        return {
+          background: 'transparent',
+          color: colors.foreground,
+          border: colors.border
+        };
+      case 'default':
+      default:
+        return {
+          background: colors.muted,
+          color: colors.foreground,
+          border: colors.border
+        };
+    }
+  }, [variant, color, colors, namedColors]);
+}
+
+/**
+ * Get shared hover, close, focus, and motion tokens.
+ */
+export function useTagInteractionTokens() {
+  var _useTokens2 = useTokens(),
+    colors = _useTokens2.colors,
+    motion = _useTokens2.motion;
+  return useMemo(function () {
+    return {
+      hoverBackground: withOpacity(colors.accent, 0.6),
+      hoverBorder: withOpacity(colors.primary, 0.3),
+      closeIcon: colors['muted-foreground'],
+      ring: colors.ring,
+      ringOffset: colors.background,
+      transition: "".concat(motion.durationsMs.emphasis, "ms ").concat(motion.easing.standard)
+    };
+  }, [colors, motion]);
+}
+
+/**
+ * Build tag style
+ */
+export function useTagStyle(variant, size, color, disabled) {
+  var _useTokens3 = useTokens(),
+    radius = _useTokens3.radius;
+  var sizeTokens = useTagSizeTokens(size);
+  var colorTokens = useTagColors(variant, color);
+  return useMemo(function () {
+    return {
+      display: 'inline-flex',
+      alignItems: 'center',
+      alignSelf: 'flex-start',
+      gap: 4,
+      // px
+      boxSizing: 'border-box',
+      flexShrink: 0,
+      whiteSpace: 'nowrap',
+      paddingLeft: sizeTokens.paddingInline,
+      paddingRight: sizeTokens.paddingInline,
+      paddingTop: sizeTokens.paddingBlock,
+      paddingBottom: sizeTokens.paddingBlock,
+      fontSize: sizeTokens.fontSize,
+      lineHeight: "".concat(sizeTokens.lineHeight, "px"),
+      borderRadius: radius.md,
+      borderWidth: 1,
+      borderStyle: 'solid',
+      borderColor: colorTokens.border,
+      backgroundColor: colorTokens.background,
+      color: colorTokens.color,
+      opacity: disabled ? 0.5 : 1,
+      transition: 'background-color var(--x-duration-emphasis) var(--x-easing-standard), border-color var(--x-duration-emphasis) var(--x-easing-standard), color var(--x-duration-emphasis) var(--x-easing-standard)'
+    };
+  }, [sizeTokens, colorTokens, radius.md, disabled]);
+}

package/es/components/tag/types.d.ts

@@ -0,0 +1,107 @@
+/**
+ * Tag Component Types
+ * Following x-design-system tag.yaml spec
+ */
+/// <reference types="react" />
+import type { SizeVariant } from '../../theme/types';
+export declare type TagVariant = 'default' | 'filled' | 'solid' | 'outlined';
+export interface TagCloseEvent {
+    /** Whether the default removal behavior has been prevented */
+    readonly defaultPrevented: boolean;
+    /** Keep the tag mounted */
+    preventDefault: () => void;
+    /** Stop the close action from reaching the tag root */
+    stopPropagation: () => void;
+}
+export interface TagProps {
+    /** Tag content */
+    children?: React.ReactNode;
+    /** Show close button */
+    closable?: boolean;
+    /** Custom close icon */
+    closeIcon?: React.ReactNode;
+    /** Tag color (preset names or custom) */
+    color?: string;
+    /** Internal semantic class names, matching x-web-ui */
+    classNames?: {
+        root?: string;
+        icon?: string;
+        content?: string;
+        closeIcon?: string;
+    };
+    /** Link URL */
+    href?: string;
+    /** Click handler */
+    onClick?: () => void;
+    /** Prefix icon */
+    icon?: React.ReactNode;
+    /** Close handler - preventDefault keeps tag visible */
+    onClose?: (e: TagCloseEvent) => void;
+    /** Internal semantic styles, matching x-web-ui */
+    styles?: {
+        root?: React.CSSProperties;
+        icon?: React.CSSProperties;
+        content?: React.CSSProperties;
+        closeIcon?: React.CSSProperties;
+    };
+    /** Link target */
+    target?: string;
+    /** Size variant */
+    size?: SizeVariant;
+    /** Visual variant */
+    variant?: TagVariant;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Additional CSS class */
+    className?: string;
+    /** Additional inline styles */
+    style?: React.CSSProperties;
+}
+export interface CheckableTagProps {
+    /** Checked state */
+    checked: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Prefix icon */
+    icon?: React.ReactNode;
+    /** Size variant */
+    size?: SizeVariant;
+    /** Change handler */
+    onChange?: (checked: boolean) => void;
+    /** Tag content */
+    children?: React.ReactNode;
+    /** Additional CSS class */
+    className?: string;
+    /** Additional inline styles */
+    style?: React.CSSProperties;
+}
+export interface CheckableTagGroupProps {
+    /** Initial selected value */
+    defaultValue?: string | number | Array<string | number> | null;
+    /** Disable all options */
+    disabled?: boolean;
+    /** Enable multiple selection */
+    multiple?: boolean;
+    /** Option list */
+    options?: Array<{
+        label: React.ReactNode;
+        value: string | number;
+    } | string | number>;
+    /** Controlled selected value */
+    value?: string | number | Array<string | number> | null;
+    /** Selection change callback */
+    onChange?: (value: string | number | Array<string | number> | null) => void;
+    /** Shared tag size */
+    size?: SizeVariant;
+    /** Internal semantic class names */
+    classNames?: {
+        root?: string;
+        item?: string;
+    };
+    /** Internal semantic styles */
+    styles?: {
+        root?: React.CSSProperties;
+        item?: React.CSSProperties;
+    };
+}
+//# sourceMappingURL=types.d.ts.map

package/es/components/tag/types.js

@@ -0,0 +1 @@
+export {};

package/es/components/text/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export { default as Text } from './text';
+export { default } from './text';
+//# sourceMappingURL=index.d.ts.map

package/es/components/text/index.js

@@ -0,0 +1,3 @@
+export * from "./types";
+export { default as Text } from "./text";
+export { default } from "./text";

package/es/components/text/text.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { TextProps } from './types';
+declare const Text: React.FC<TextProps>;
+export default Text;
+//# sourceMappingURL=text.d.ts.map

package/es/components/text/text.js

@@ -0,0 +1,235 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["variant", "color", "size", "weight", "align", "lineHeight", "block", "decoration", "numberOfLines", "onClick", "children", "className", "style", "testID", "ariaLabel", "role", "maxLines"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from 'react';
+import { Text as TaroText } from '@tarojs/components';
+import { classNames } from "../../utils";
+import { getTypographySize, typographyLineHeight, useTheme, withOpacity } from "../../theme";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Text Component
+ *
+ * @description
+ * Design system aligned text component
+ */
+var tightTracking = '-0.025em';
+var variantMap = {
+  display: {
+    fontSize: 48,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('display'),
+    letterSpacing: tightTracking
+  },
+  h1: {
+    fontSize: 36,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h1'),
+    letterSpacing: tightTracking
+  },
+  h2: {
+    fontSize: 30,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h2'),
+    letterSpacing: tightTracking
+  },
+  h3: {
+    fontSize: 24,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h3'),
+    letterSpacing: tightTracking
+  },
+  h4: {
+    fontSize: 20,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h4'),
+    letterSpacing: tightTracking
+  },
+  h5: {
+    fontSize: 18,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h5'),
+    letterSpacing: tightTracking
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: 600,
+    lineHeight: typographyLineHeight('h5'),
+    letterSpacing: tightTracking
+  },
+  body: {
+    fontSize: 16,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('body')
+  },
+  bodyMuted: {
+    fontSize: 16,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('body'),
+    muted: true
+  },
+  label: {
+    fontSize: 14,
+    fontWeight: 500,
+    lineHeight: typographyLineHeight('label')
+  },
+  helper: {
+    fontSize: 14,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('helper'),
+    muted: true
+  },
+  caption: {
+    fontSize: 12,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('caption'),
+    muted: true
+  },
+  overline: {
+    fontSize: 12,
+    fontWeight: 500,
+    lineHeight: typographyLineHeight('overline')
+  },
+  tableHeader: {
+    fontSize: 14,
+    fontWeight: 500,
+    lineHeight: typographyLineHeight('tableHeader'),
+    foregroundOpacity: 0.7
+  },
+  tableBody: {
+    fontSize: 14,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('tableBody')
+  },
+  numeric: {
+    fontSize: 14,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('numeric')
+  },
+  code: {
+    fontSize: 14,
+    fontWeight: 400,
+    lineHeight: typographyLineHeight('code')
+  }
+};
+var namedSizeMap = {
+  small: {
+    fontSize: getTypographySize('sm'),
+    lineHeight: typographyLineHeight('label')
+  },
+  base: {
+    fontSize: getTypographySize('base'),
+    lineHeight: typographyLineHeight('body')
+  },
+  large: {
+    fontSize: getTypographySize('lg'),
+    lineHeight: typographyLineHeight('h5')
+  }
+};
+var defaultTextPreset = {
+  fontSize: 14,
+  fontWeight: 400,
+  lineHeight: '22px'
+};
+function resolveColor(color, themeColors) {
+  if (!color) return undefined;
+  var colorMap = {
+    primary: themeColors.primary,
+    success: themeColors.success,
+    warning: themeColors.warning,
+    danger: themeColors.destructive,
+    weak: themeColors['muted-foreground'],
+    light: withOpacity(themeColors.foreground, 0.55),
+    text: themeColors.foreground,
+    // x-mobile-ui's `white` compatibility name maps to the inverse foreground token.
+    white: themeColors['primary-foreground']
+  };
+  if (color in colorMap) return colorMap[color];
+  // x-mobile-ui stories historically use secondary as a muted text alias.
+  if (color === 'secondary') return themeColors['muted-foreground'];
+  return color;
+}
+function resolveSize(size) {
+  if (typeof size === 'number') return "".concat(size, "px");
+  return size;
+}
+var Text = function Text(_ref) {
+  var _resolveColor, _namedSize$lineHeight;
+  var variant = _ref.variant,
+    color = _ref.color,
+    size = _ref.size,
+    weight = _ref.weight,
+    align = _ref.align,
+    lineHeight = _ref.lineHeight,
+    _ref$block = _ref.block,
+    block = _ref$block === void 0 ? true : _ref$block,
+    decoration = _ref.decoration,
+    numberOfLines = _ref.numberOfLines,
+    onClick = _ref.onClick,
+    children = _ref.children,
+    className = _ref.className,
+    style = _ref.style,
+    testID = _ref.testID,
+    ariaLabel = _ref.ariaLabel,
+    role = _ref.role,
+    maxLines = _ref.maxLines,
+    nativeProps = _objectWithoutProperties(_ref, _excluded);
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  var resolvedVariant = variant !== null && variant !== void 0 ? variant : 'body';
+  var preset = variant ? variantMap[resolvedVariant] : defaultTextPreset;
+  var namedSize = size && size in namedSizeMap ? namedSizeMap[size] : null;
+  var resolvedSize = namedSize ? "".concat(namedSize.fontSize, "px") : !variant && size ? resolveSize(size) : "".concat(preset.fontSize, "px");
+  var clampedLines = typeof numberOfLines === 'number' && numberOfLines > 0 ? Math.floor(numberOfLines) : undefined;
+  var foregroundColor = 'foregroundOpacity' in preset && typeof preset.foregroundOpacity === 'number' ? withOpacity(theme.colors.foreground, preset.foregroundOpacity) : theme.colors.foreground;
+  var resolvedStyle = _objectSpread({
+    display: clampedLines ? '-webkit-box' : block ? 'block' : 'inline',
+    color: (_resolveColor = resolveColor(color, theme.colors)) !== null && _resolveColor !== void 0 ? _resolveColor : 'muted' in preset && preset.muted ? theme.colors['muted-foreground'] : foregroundColor,
+    fontSize: resolvedSize,
+    fontWeight: preset.fontWeight,
+    textAlign: align,
+    lineHeight: (_namedSize$lineHeight = namedSize === null || namedSize === void 0 ? void 0 : namedSize.lineHeight) !== null && _namedSize$lineHeight !== void 0 ? _namedSize$lineHeight : preset.lineHeight,
+    letterSpacing: 'letterSpacing' in preset ? preset.letterSpacing : resolvedVariant === 'overline' ? '0.2em' : undefined,
+    textTransform: resolvedVariant === 'overline' ? 'uppercase' : undefined,
+    fontVariantNumeric: resolvedVariant === 'numeric' ? 'tabular-nums' : undefined,
+    fontFamily: resolvedVariant === 'code' ? 'monospace' : undefined,
+    textDecoration: decoration && decoration !== 'none' ? decoration : undefined,
+    overflow: clampedLines ? 'hidden' : undefined,
+    textOverflow: clampedLines ? 'ellipsis' : undefined,
+    WebkitLineClamp: clampedLines,
+    WebkitBoxOrient: clampedLines ? 'vertical' : undefined
+  }, style);
+
+  // x-mobile-ui keeps variant metrics authoritative while allowing weight overrides.
+  if (!variant && lineHeight) {
+    resolvedStyle.lineHeight = typeof lineHeight === 'number' ? String(lineHeight) : lineHeight;
+  }
+  if (!variant && size && !namedSize) {
+    resolvedStyle.fontSize = resolveSize(size);
+  }
+  if (weight !== undefined) {
+    resolvedStyle.fontWeight = weight;
+  }
+  return /*#__PURE__*/_jsx(TaroText, _objectSpread(_objectSpread({}, nativeProps), {}, {
+    className: classNames('x-text', className),
+    "data-slot": "text",
+    "data-text-color": color && color in theme.colors ? color : undefined,
+    "data-text-variant": resolvedVariant,
+    "data-text-truncated": clampedLines ? 'true' : 'false',
+    "data-text-native-max-lines": clampedLines !== null && clampedLines !== void 0 ? clampedLines : maxLines,
+    "data-testid": testID,
+    ariaLabel: ariaLabel,
+    role: role,
+    style: resolvedStyle,
+    numberOfLines: clampedLines,
+    maxLines: clampedLines !== null && clampedLines !== void 0 ? clampedLines : maxLines,
+    onClick: onClick,
+    children: children
+  }));
+};
+export default Text;

package/es/components/text/types.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Text Component Types
+ *
+ * @description
+ * Design system aligned text component types
+ */
+import type { CSSProperties, ReactNode } from 'react';
+import type { TextProps as TaroTextProps } from '@tarojs/components/types/Text';
+import type { designSystemTypographyRoles } from '../../theme/generated/design-system.generated';
+declare type NativeTextProps = Omit<TaroTextProps, 'children' | 'className' | 'numberOfLines' | 'onClick' | 'ref' | 'style'>;
+export declare type TextVariant = keyof typeof designSystemTypographyRoles | 'title';
+export declare type TextColor = 'primary' | 'success' | 'warning' | 'danger' | 'weak' | 'light' | 'text' | 'white';
+export declare type TextNamedSize = 'small' | 'base' | 'large';
+export declare type TextWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+export interface TextProps extends NativeTextProps {
+    /** Typography preset */
+    variant?: TextVariant;
+    /** Semantic text color or custom CSS color. */
+    color?: TextColor | (string & {});
+    /** Font size override */
+    size?: number | TextNamedSize | (string & {});
+    /** Font weight override */
+    weight?: TextWeight;
+    /** Text alignment */
+    align?: 'left' | 'center' | 'right' | 'justify';
+    /** Line height */
+    lineHeight?: number | string;
+    /** Render as block */
+    block?: boolean;
+    /** Text decoration */
+    decoration?: 'none' | 'underline' | 'line-through';
+    /** Clamp line count */
+    numberOfLines?: number;
+    /** Click callback with the native Taro event. */
+    onClick?: TaroTextProps['onClick'];
+    /** Component children */
+    children?: ReactNode;
+    /** Custom className */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** React Native compatible test id. */
+    testID?: string;
+    /** Accessible label forwarded to the Taro primitive. */
+    ariaLabel?: string;
+    /** Optional semantic role. */
+    role?: string;
+}
+export {};
+//# sourceMappingURL=types.d.ts.map

package/es/components/text/types.js

@@ -0,0 +1 @@
+export {};

package/es/components/textInput/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export { default as TextInput } from './textInput';
+export { default } from './textInput';
+//# sourceMappingURL=index.d.ts.map

package/es/components/textInput/index.js

@@ -0,0 +1,3 @@
+export * from "./types";
+export { default as TextInput } from "./textInput";
+export { default } from "./textInput";

package/es/components/textInput/style.css

@@ -0,0 +1,37 @@
+.x-text-input input,
+.x-text-input textarea {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  letter-spacing: inherit;
+  color: inherit;
+  background: transparent;
+  text-align: inherit;
+  caret-color: var(--x-text-input-caret-color);
+}
+
+.x-text-input::placeholder,
+.x-text-input input::placeholder,
+.x-text-input textarea::placeholder {
+  color: var(--x-text-input-placeholder-color);
+  opacity: 1;
+}
+
+.x-text-input__placeholder {
+  color: var(--x-text-input-placeholder-color);
+}
+
+.x-text-input--custom-selection::selection,
+.x-text-input--custom-selection input::selection,
+.x-text-input--custom-selection textarea::selection {
+  background-color: var(--x-text-input-selection-color);
+}
+
+.x-text-input input:-webkit-autofill,
+.x-text-input input:-webkit-autofill:hover,
+.x-text-input input:-webkit-autofill:focus {
+  box-shadow: inset 0 0 0 1000px var(--x-text-input-background);
+  -webkit-text-fill-color: var(--x-text-input-foreground);
+  caret-color: var(--x-text-input-caret-color);
+}

package/es/components/textInput/textInput.d.ts

@@ -0,0 +1,10 @@
+/**
+ * TextInput Component
+ * Bare RN-compatible input primitive aligned with x-mobile-ui.
+ */
+import React from 'react';
+import type { TextInputProps, TextInputRef } from './types';
+import './style.css';
+export declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<TextInputRef>>;
+export default TextInput;
+//# sourceMappingURL=textInput.d.ts.map