add text input validation

2026-08-31 22:51:44 -04:00
parent b99e8d0be4
commit 057d41e1c2
61 changed files with 968 additions and 302 deletions
@@ -22,11 +22,15 @@ export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(function T
  ref,
 ) {
  const dir = bidiValue || type === 'email' || type === 'tel' || type === 'url' ? 'ltr' : undefined;
+  const maxLength = props.maxLength ?? (type === 'email' ? 254 : type === 'tel' ? 20 : undefined);
+  const pattern = props.pattern ?? (type === 'tel' ? '^(?:(?:\\+|00)212|0)\\s?[5-7](?:\\s?\\d){8}$' : undefined);
  return (
    <input
      ref={ref}
      type={type}
      dir={dir}
+      maxLength={maxLength}
+      pattern={pattern}
      className={classNames(styles.control, className)}
      aria-invalid={invalid || undefined}
      aria-describedby={describedBy}