@openzeppelin/ui-components 1.0.0 → 1.0.1

package/dist/ErrorMessage-D4BAP8iw.cjs

@@ -0,0 +1,281 @@
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+			key = keys[i];
+			if (!__hasOwnProp.call(to, key) && key !== except) {
+				__defProp(to, key, {
+					get: ((k) => from[k]).bind(null, key),
+					enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+				});
+			}
+		}
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let react = require("react");
+react = __toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/fields/utils/integerValidation.ts
+/**
+* Shared integer validation patterns for BigInt fields and validation utilities.
+*
+* These patterns ensure consistent validation across the application.
+*/
+/**
+* Integer validation pattern - requires at least one digit
+* Used for validation to ensure complete integers are entered
+* Matches: -123, 0, 456
+* Does not match: -, abc, 12.3
+*/
+const INTEGER_PATTERN = /^-?\d+$/;
+/**
+* Integer input pattern - allows partial input during typing
+* Used during input to allow users to type minus sign first
+* Matches: -, -1, 123, (empty string)
+* Does not match: abc, 12.3
+*/
+const INTEGER_INPUT_PATTERN = /^-?\d*$/;
+/**
+* HTML pattern attribute for integer inputs
+* Must use [0-9] instead of \d for HTML5 pattern attribute
+*/
+const INTEGER_HTML_PATTERN = "-?[0-9]*";
+
+//#endregion
+//#region src/components/fields/utils/validation.ts
+/**
+* Determines if a field has an error
+*/
+function hasFieldError(error) {
+	return !!error;
+}
+/**
+* Gets appropriate error message from field error
+*/
+function getErrorMessage(error) {
+	if (!error) return void 0;
+	return error.message || "This field is invalid";
+}
+/**
+* Formats validation error messages for display
+*/
+function formatValidationError(error, fieldName) {
+	if (!error) return void 0;
+	const defaultMessage = fieldName ? `${fieldName} is invalid` : "This field is invalid";
+	return error.message || defaultMessage;
+}
+/**
+* Generates common CSS classes for field validation states
+*/
+function getValidationStateClasses(error, touched) {
+	if (error) return "border-destructive focus:border-destructive focus:ring-destructive/30";
+	if (touched) return "border-success focus:border-success focus:ring-success/30";
+	return "";
+}
+/**
+* Helper for handling form validation errors with React Hook Form
+*/
+function handleValidationError(error, id) {
+	const hasError = hasFieldError(error);
+	const errorMessage = getErrorMessage(error);
+	return {
+		errorId: `${id}-error`,
+		errorMessage,
+		hasError,
+		validationClasses: getValidationStateClasses(error)
+	};
+}
+/**
+* Creates a validation result object for field components
+*/
+function createValidationResult(id, error, touched) {
+	const hasError = hasFieldError(error);
+	const errorMessage = getErrorMessage(error);
+	const errorId = `${id}-error`;
+	return {
+		hasError,
+		errorMessage,
+		errorId,
+		validationClasses: getValidationStateClasses(error, touched),
+		"aria-invalid": hasError,
+		"aria-errormessage": hasError ? errorId : void 0
+	};
+}
+/**
+* Generic field validation function that can be used to validate any field type
+* based on common validation criteria
+*/
+function validateField(value, validation) {
+	if (!validation) return true;
+	if (validation.required && (value === void 0 || value === null || value === "")) return typeof validation.required === "boolean" ? "This field is required" : "This field is required";
+	if (value === void 0 || value === null || value === "") return true;
+	if (typeof value === "string") {
+		if (validation.minLength && value.length < validation.minLength) return `Minimum length is ${validation.minLength} characters`;
+		if (validation.maxLength && value.length > validation.maxLength) return `Maximum length is ${validation.maxLength} characters`;
+		if (validation.pattern) {
+			if (!(typeof validation.pattern === "string" ? new RegExp(validation.pattern) : validation.pattern).test(value)) {
+				if (!INTEGER_PATTERN.test(value) && /\d/.test(value)) return "Value must be a valid integer (no decimals)";
+				return "Value does not match the required pattern";
+			}
+		}
+	}
+	if (typeof value === "number" || typeof value === "string" && !isNaN(Number(value))) {
+		const numValue = typeof value === "number" ? value : Number(value);
+		if (validation.min !== void 0 && numValue < validation.min) return `Minimum value is ${validation.min}`;
+		if (validation.max !== void 0 && numValue > validation.max) return `Maximum value is ${validation.max}`;
+	}
+	if (validation.conditions && validation.conditions.length > 0) {}
+	return true;
+}
+/**
+* Map validation utilities
+*/
+/**
+* Checks if a map entry at the given index has a duplicate key
+* @param entries - Array of map entries
+* @param currentIndex - Index of the entry to check
+* @returns true if the key at currentIndex is duplicated elsewhere in the array
+*/
+function isDuplicateMapKey(entries, currentIndex) {
+	if (!Array.isArray(entries) || entries.length <= 1) return false;
+	const currentKeyValue = entries[currentIndex]?.key;
+	if (!currentKeyValue || currentKeyValue === "") return false;
+	return entries.some((entry, i) => {
+		if (i === currentIndex) return false;
+		const key = entry?.key;
+		if (key === "") return false;
+		if (typeof key === "string" && typeof currentKeyValue === "string") return key === currentKeyValue;
+		if (typeof key === "number" && typeof currentKeyValue === "number") return Number.isNaN(key) ? Number.isNaN(currentKeyValue) : key === currentKeyValue;
+		if (typeof key === "boolean" && typeof currentKeyValue === "boolean") return key === currentKeyValue;
+		if (typeof key === "object" && key !== null && typeof currentKeyValue === "object" && currentKeyValue !== null) return key === currentKeyValue;
+		return false;
+	});
+}
+/**
+* Validates an array of map entries for duplicate keys
+* @param entries - Array of map entries to validate
+* @returns Validation error message if duplicates found, otherwise undefined
+*/
+function validateMapEntries(entries) {
+	if (!Array.isArray(entries) || entries.length <= 1) return;
+	const keyStrings = entries.map((entry) => entry?.key).filter((key) => key !== void 0 && key !== null && key !== "").map((key) => String(key));
+	const uniqueKeyStrings = new Set(keyStrings);
+	if (keyStrings.length !== uniqueKeyStrings.size) return "Duplicate keys are not allowed";
+}
+
+//#endregion
+//#region src/components/fields/utils/ErrorMessage.tsx
+/**
+* Displays validation error messages for form fields
+*/
+function ErrorMessage({ error, id, message, className = "" }) {
+	const errorMessage = message || getErrorMessage(error);
+	if (!errorMessage) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		id,
+		className: `text-destructive mt-1 text-sm ${className}`,
+		role: "alert",
+		children: errorMessage
+	});
+}
+
+//#endregion
+Object.defineProperty(exports, 'ErrorMessage', {
+  enumerable: true,
+  get: function () {
+    return ErrorMessage;
+  }
+});
+Object.defineProperty(exports, 'INTEGER_HTML_PATTERN', {
+  enumerable: true,
+  get: function () {
+    return INTEGER_HTML_PATTERN;
+  }
+});
+Object.defineProperty(exports, 'INTEGER_INPUT_PATTERN', {
+  enumerable: true,
+  get: function () {
+    return INTEGER_INPUT_PATTERN;
+  }
+});
+Object.defineProperty(exports, 'INTEGER_PATTERN', {
+  enumerable: true,
+  get: function () {
+    return INTEGER_PATTERN;
+  }
+});
+Object.defineProperty(exports, '__toESM', {
+  enumerable: true,
+  get: function () {
+    return __toESM;
+  }
+});
+Object.defineProperty(exports, 'createValidationResult', {
+  enumerable: true,
+  get: function () {
+    return createValidationResult;
+  }
+});
+Object.defineProperty(exports, 'formatValidationError', {
+  enumerable: true,
+  get: function () {
+    return formatValidationError;
+  }
+});
+Object.defineProperty(exports, 'getErrorMessage', {
+  enumerable: true,
+  get: function () {
+    return getErrorMessage;
+  }
+});
+Object.defineProperty(exports, 'getValidationStateClasses', {
+  enumerable: true,
+  get: function () {
+    return getValidationStateClasses;
+  }
+});
+Object.defineProperty(exports, 'handleValidationError', {
+  enumerable: true,
+  get: function () {
+    return handleValidationError;
+  }
+});
+Object.defineProperty(exports, 'hasFieldError', {
+  enumerable: true,
+  get: function () {
+    return hasFieldError;
+  }
+});
+Object.defineProperty(exports, 'isDuplicateMapKey', {
+  enumerable: true,
+  get: function () {
+    return isDuplicateMapKey;
+  }
+});
+Object.defineProperty(exports, 'validateField', {
+  enumerable: true,
+  get: function () {
+    return validateField;
+  }
+});
+Object.defineProperty(exports, 'validateMapEntries', {
+  enumerable: true,
+  get: function () {
+    return validateMapEntries;
+  }
+});
+//# sourceMappingURL=ErrorMessage-D4BAP8iw.cjs.map

package/dist/ErrorMessage-D4BAP8iw.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage-D4BAP8iw.cjs","names":[],"sources":["../src/components/fields/utils/integerValidation.ts","../src/components/fields/utils/validation.ts","../src/components/fields/utils/ErrorMessage.tsx"],"sourcesContent":["/**\n * Shared integer validation patterns for BigInt fields and validation utilities.\n *\n * These patterns ensure consistent validation across the application.\n */\n\n/**\n * Integer validation pattern - requires at least one digit\n * Used for validation to ensure complete integers are entered\n * Matches: -123, 0, 456\n * Does not match: -, abc, 12.3\n */\nexport const INTEGER_PATTERN = /^-?\\d+$/;\n\n/**\n * Integer input pattern - allows partial input during typing\n * Used during input to allow users to type minus sign first\n * Matches: -, -1, 123, (empty string)\n * Does not match: abc, 12.3\n */\nexport const INTEGER_INPUT_PATTERN = /^-?\\d*$/;\n\n/**\n * HTML pattern attribute for integer inputs\n * Must use [0-9] instead of \\d for HTML5 pattern attribute\n */\nexport const INTEGER_HTML_PATTERN = '-?[0-9]*';\n","/**\n * Validation and error handling utilities for form field components\n */\nimport { FieldError } from 'react-hook-form';\n\nimport { FieldValidation, MapEntry } from '@openzeppelin/ui-types';\n\nimport { INTEGER_PATTERN } from './integerValidation';\n\n/**\n * Determines if a field has an error\n */\nexport function hasFieldError(error: FieldError | undefined): boolean {\n  return !!error;\n}\n\n/**\n * Gets appropriate error message from field error\n */\nexport function getErrorMessage(error: FieldError | undefined): string | undefined {\n  if (!error) return undefined;\n\n  return error.message || 'This field is invalid';\n}\n\n/**\n * Formats validation error messages for display\n */\nexport function formatValidationError(\n  error: FieldError | undefined,\n  fieldName?: string\n): string | undefined {\n  if (!error) return undefined;\n\n  const defaultMessage = fieldName ? `${fieldName} is invalid` : 'This field is invalid';\n\n  return error.message || defaultMessage;\n}\n\n/**\n * Generates common CSS classes for field validation states\n */\nexport function getValidationStateClasses(\n  error: FieldError | undefined,\n  touched?: boolean\n): string {\n  if (error) {\n    return 'border-destructive focus:border-destructive focus:ring-destructive/30';\n  }\n\n  if (touched) {\n    return 'border-success focus:border-success focus:ring-success/30';\n  }\n\n  return '';\n}\n\n/**\n * Helper for handling form validation errors with React Hook Form\n */\nexport function handleValidationError(\n  error: FieldError | undefined,\n  id: string\n): {\n  errorId: string;\n  errorMessage: string | undefined;\n  hasError: boolean;\n  validationClasses: string;\n} {\n  const hasError = hasFieldError(error);\n  const errorMessage = getErrorMessage(error);\n  const errorId = `${id}-error`;\n  const validationClasses = getValidationStateClasses(error);\n\n  return {\n    errorId,\n    errorMessage,\n    hasError,\n    validationClasses,\n  };\n}\n\n/**\n * Creates a validation result object for field components\n */\nexport function createValidationResult(\n  id: string,\n  error: FieldError | undefined,\n  touched?: boolean\n): {\n  hasError: boolean;\n  errorMessage: string | undefined;\n  errorId: string;\n  validationClasses: string;\n  'aria-invalid': boolean;\n  'aria-errormessage'?: string;\n} {\n  const hasError = hasFieldError(error);\n  const errorMessage = getErrorMessage(error);\n  const errorId = `${id}-error`;\n  const validationClasses = getValidationStateClasses(error, touched);\n\n  return {\n    hasError,\n    errorMessage,\n    errorId,\n    validationClasses,\n    'aria-invalid': hasError,\n    'aria-errormessage': hasError ? errorId : undefined,\n  };\n}\n\n/**\n * Generic field validation function that can be used to validate any field type\n * based on common validation criteria\n */\nexport function validateField(value: unknown, validation?: FieldValidation): string | boolean {\n  // Return true if no validation rules are provided\n  if (!validation) return true;\n\n  // Check if required but empty\n  if (validation.required && (value === undefined || value === null || value === '')) {\n    return typeof validation.required === 'boolean'\n      ? 'This field is required'\n      : 'This field is required'; // Always return the standard message for required fields\n  }\n\n  // Skip other validations if value is empty and not required\n  if (value === undefined || value === null || value === '') {\n    return true;\n  }\n\n  // Validate string length\n  if (typeof value === 'string') {\n    if (validation.minLength && value.length < validation.minLength) {\n      return `Minimum length is ${validation.minLength} characters`;\n    }\n\n    if (validation.maxLength && value.length > validation.maxLength) {\n      return `Maximum length is ${validation.maxLength} characters`;\n    }\n\n    // Validate pattern\n    if (validation.pattern) {\n      const pattern =\n        typeof validation.pattern === 'string'\n          ? new RegExp(validation.pattern)\n          : validation.pattern;\n\n      if (!pattern.test(value)) {\n        // Provide more specific error message for integer validation\n        if (!INTEGER_PATTERN.test(value) && /\\d/.test(value)) {\n          return 'Value must be a valid integer (no decimals)';\n        }\n        return 'Value does not match the required pattern';\n      }\n    }\n  }\n\n  // Validate number range\n  if (typeof value === 'number' || (typeof value === 'string' && !isNaN(Number(value)))) {\n    const numValue = typeof value === 'number' ? value : Number(value);\n\n    if (validation.min !== undefined && numValue < validation.min) {\n      return `Minimum value is ${validation.min}`;\n    }\n\n    if (validation.max !== undefined && numValue > validation.max) {\n      return `Maximum value is ${validation.max}`;\n    }\n  }\n\n  // Check field conditions if defined\n  if (validation.conditions && validation.conditions.length > 0) {\n    // Note: This would need the current form values to evaluate conditions\n    // This is intended to be used with React Hook Form's validation context\n    // Implementation would depend on how conditions are evaluated in the form context\n  }\n\n  // If all validations pass\n  return true;\n}\n\n/**\n * Map validation utilities\n */\n\n/**\n * Checks if a map entry at the given index has a duplicate key\n * @param entries - Array of map entries\n * @param currentIndex - Index of the entry to check\n * @returns true if the key at currentIndex is duplicated elsewhere in the array\n */\nexport function isDuplicateMapKey(entries: MapEntry[], currentIndex: number): boolean {\n  if (!Array.isArray(entries) || entries.length <= 1) {\n    return false;\n  }\n\n  const currentKeyValue = entries[currentIndex]?.key;\n\n  // Don't consider empty keys as duplicates\n  if (!currentKeyValue || currentKeyValue === '') {\n    return false;\n  }\n\n  // Prefer strict equality to avoid cross-type false positives (e.g., 123 vs \"123\")\n  // Treat empty string as non-duplicate as above.\n  return entries.some((entry: MapEntry, i: number) => {\n    if (i === currentIndex) return false;\n    const key = entry?.key;\n    if (key === '') return false;\n    // If both are strings, compare strings\n    if (typeof key === 'string' && typeof currentKeyValue === 'string') {\n      return key === currentKeyValue;\n    }\n    // If both are numbers, compare numbers\n    if (typeof key === 'number' && typeof currentKeyValue === 'number') {\n      return Number.isNaN(key) ? Number.isNaN(currentKeyValue) : key === currentKeyValue;\n    }\n    // If both are booleans\n    if (typeof key === 'boolean' && typeof currentKeyValue === 'boolean') {\n      return key === currentKeyValue;\n    }\n    // For objects (including dates) fall back to reference equality\n    if (\n      typeof key === 'object' &&\n      key !== null &&\n      typeof currentKeyValue === 'object' &&\n      currentKeyValue !== null\n    ) {\n      return key === currentKeyValue;\n    }\n    // Otherwise, consider different types as different keys\n    return false;\n  });\n}\n\n/**\n * Validates an array of map entries for duplicate keys\n * @param entries - Array of map entries to validate\n * @returns Validation error message if duplicates found, otherwise undefined\n */\nexport function validateMapEntries(entries: MapEntry[]): string | undefined {\n  if (!Array.isArray(entries) || entries.length <= 1) {\n    return undefined;\n  }\n\n  const keys = entries\n    .map((entry) => entry?.key)\n    .filter((key) => key !== undefined && key !== null && key !== '');\n\n  const keyStrings = keys.map((key) => String(key));\n  const uniqueKeyStrings = new Set(keyStrings);\n\n  if (keyStrings.length !== uniqueKeyStrings.size) {\n    return 'Duplicate keys are not allowed';\n  }\n\n  return undefined;\n}\n","import React from 'react';\nimport { FieldError } from 'react-hook-form';\n\nimport { getErrorMessage } from './validation';\n\ninterface ErrorMessageProps {\n  /**\n   * The error object from React Hook Form\n   */\n  error?: FieldError;\n\n  /**\n   * The ID of the error message for aria-errormessage references\n   */\n  id: string;\n\n  /**\n   * Optional custom error message to display instead of the error from React Hook Form\n   */\n  message?: string;\n\n  /**\n   * Optional additional CSS classes\n   */\n  className?: string;\n}\n\n/**\n * Displays validation error messages for form fields\n */\nexport function ErrorMessage({\n  error,\n  id,\n  message,\n  className = '',\n}: ErrorMessageProps): React.ReactElement | null {\n  const errorMessage = message || getErrorMessage(error);\n\n  if (!errorMessage) return null;\n\n  return (\n    <div id={id} className={`text-destructive mt-1 text-sm ${className}`} role=\"alert\">\n      {errorMessage}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAa,kBAAkB;;;;;;;AAQ/B,MAAa,wBAAwB;;;;;AAMrC,MAAa,uBAAuB;;;;;;;ACdpC,SAAgB,cAAc,OAAwC;AACpE,QAAO,CAAC,CAAC;;;;;AAMX,SAAgB,gBAAgB,OAAmD;AACjF,KAAI,CAAC,MAAO,QAAO;AAEnB,QAAO,MAAM,WAAW;;;;;AAM1B,SAAgB,sBACd,OACA,WACoB;AACpB,KAAI,CAAC,MAAO,QAAO;CAEnB,MAAM,iBAAiB,YAAY,GAAG,UAAU,eAAe;AAE/D,QAAO,MAAM,WAAW;;;;;AAM1B,SAAgB,0BACd,OACA,SACQ;AACR,KAAI,MACF,QAAO;AAGT,KAAI,QACF,QAAO;AAGT,QAAO;;;;;AAMT,SAAgB,sBACd,OACA,IAMA;CACA,MAAM,WAAW,cAAc,MAAM;CACrC,MAAM,eAAe,gBAAgB,MAAM;AAI3C,QAAO;EACL,SAJc,GAAG,GAAG;EAKpB;EACA;EACA,mBANwB,0BAA0B,MAAM;EAOzD;;;;;AAMH,SAAgB,uBACd,IACA,OACA,SAQA;CACA,MAAM,WAAW,cAAc,MAAM;CACrC,MAAM,eAAe,gBAAgB,MAAM;CAC3C,MAAM,UAAU,GAAG,GAAG;AAGtB,QAAO;EACL;EACA;EACA;EACA,mBANwB,0BAA0B,OAAO,QAAQ;EAOjE,gBAAgB;EAChB,qBAAqB,WAAW,UAAU;EAC3C;;;;;;AAOH,SAAgB,cAAc,OAAgB,YAAgD;AAE5F,KAAI,CAAC,WAAY,QAAO;AAGxB,KAAI,WAAW,aAAa,UAAU,UAAa,UAAU,QAAQ,UAAU,IAC7E,QAAO,OAAO,WAAW,aAAa,YAClC,2BACA;AAIN,KAAI,UAAU,UAAa,UAAU,QAAQ,UAAU,GACrD,QAAO;AAIT,KAAI,OAAO,UAAU,UAAU;AAC7B,MAAI,WAAW,aAAa,MAAM,SAAS,WAAW,UACpD,QAAO,qBAAqB,WAAW,UAAU;AAGnD,MAAI,WAAW,aAAa,MAAM,SAAS,WAAW,UACpD,QAAO,qBAAqB,WAAW,UAAU;AAInD,MAAI,WAAW,SAMb;OAAI,EAJF,OAAO,WAAW,YAAY,WAC1B,IAAI,OAAO,WAAW,QAAQ,GAC9B,WAAW,SAEJ,KAAK,MAAM,EAAE;AAExB,QAAI,CAAC,gBAAgB,KAAK,MAAM,IAAI,KAAK,KAAK,MAAM,CAClD,QAAO;AAET,WAAO;;;;AAMb,KAAI,OAAO,UAAU,YAAa,OAAO,UAAU,YAAY,CAAC,MAAM,OAAO,MAAM,CAAC,EAAG;EACrF,MAAM,WAAW,OAAO,UAAU,WAAW,QAAQ,OAAO,MAAM;AAElE,MAAI,WAAW,QAAQ,UAAa,WAAW,WAAW,IACxD,QAAO,oBAAoB,WAAW;AAGxC,MAAI,WAAW,QAAQ,UAAa,WAAW,WAAW,IACxD,QAAO,oBAAoB,WAAW;;AAK1C,KAAI,WAAW,cAAc,WAAW,WAAW,SAAS,GAAG;AAO/D,QAAO;;;;;;;;;;;AAaT,SAAgB,kBAAkB,SAAqB,cAA+B;AACpF,KAAI,CAAC,MAAM,QAAQ,QAAQ,IAAI,QAAQ,UAAU,EAC/C,QAAO;CAGT,MAAM,kBAAkB,QAAQ,eAAe;AAG/C,KAAI,CAAC,mBAAmB,oBAAoB,GAC1C,QAAO;AAKT,QAAO,QAAQ,MAAM,OAAiB,MAAc;AAClD,MAAI,MAAM,aAAc,QAAO;EAC/B,MAAM,MAAM,OAAO;AACnB,MAAI,QAAQ,GAAI,QAAO;AAEvB,MAAI,OAAO,QAAQ,YAAY,OAAO,oBAAoB,SACxD,QAAO,QAAQ;AAGjB,MAAI,OAAO,QAAQ,YAAY,OAAO,oBAAoB,SACxD,QAAO,OAAO,MAAM,IAAI,GAAG,OAAO,MAAM,gBAAgB,GAAG,QAAQ;AAGrE,MAAI,OAAO,QAAQ,aAAa,OAAO,oBAAoB,UACzD,QAAO,QAAQ;AAGjB,MACE,OAAO,QAAQ,YACf,QAAQ,QACR,OAAO,oBAAoB,YAC3B,oBAAoB,KAEpB,QAAO,QAAQ;AAGjB,SAAO;GACP;;;;;;;AAQJ,SAAgB,mBAAmB,SAAyC;AAC1E,KAAI,CAAC,MAAM,QAAQ,QAAQ,IAAI,QAAQ,UAAU,EAC/C;CAOF,MAAM,aAJO,QACV,KAAK,UAAU,OAAO,IAAI,CAC1B,QAAQ,QAAQ,QAAQ,UAAa,QAAQ,QAAQ,QAAQ,GAAG,CAE3C,KAAK,QAAQ,OAAO,IAAI,CAAC;CACjD,MAAM,mBAAmB,IAAI,IAAI,WAAW;AAE5C,KAAI,WAAW,WAAW,iBAAiB,KACzC,QAAO;;;;;;;;ACjOX,SAAgB,aAAa,EAC3B,OACA,IACA,SACA,YAAY,MACmC;CAC/C,MAAM,eAAe,WAAW,gBAAgB,MAAM;AAEtD,KAAI,CAAC,aAAc,QAAO;AAE1B,QACE,2CAAC;EAAQ;EAAI,WAAW,iCAAiC;EAAa,MAAK;YACxE;GACG"}

package/dist/ErrorMessage-DyO9ZWWz.js

@@ -0,0 +1,170 @@
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/fields/utils/integerValidation.ts
+/**
+* Shared integer validation patterns for BigInt fields and validation utilities.
+*
+* These patterns ensure consistent validation across the application.
+*/
+/**
+* Integer validation pattern - requires at least one digit
+* Used for validation to ensure complete integers are entered
+* Matches: -123, 0, 456
+* Does not match: -, abc, 12.3
+*/
+const INTEGER_PATTERN = /^-?\d+$/;
+/**
+* Integer input pattern - allows partial input during typing
+* Used during input to allow users to type minus sign first
+* Matches: -, -1, 123, (empty string)
+* Does not match: abc, 12.3
+*/
+const INTEGER_INPUT_PATTERN = /^-?\d*$/;
+/**
+* HTML pattern attribute for integer inputs
+* Must use [0-9] instead of \d for HTML5 pattern attribute
+*/
+const INTEGER_HTML_PATTERN = "-?[0-9]*";
+
+//#endregion
+//#region src/components/fields/utils/validation.ts
+/**
+* Determines if a field has an error
+*/
+function hasFieldError(error) {
+	return !!error;
+}
+/**
+* Gets appropriate error message from field error
+*/
+function getErrorMessage(error) {
+	if (!error) return void 0;
+	return error.message || "This field is invalid";
+}
+/**
+* Formats validation error messages for display
+*/
+function formatValidationError(error, fieldName) {
+	if (!error) return void 0;
+	const defaultMessage = fieldName ? `${fieldName} is invalid` : "This field is invalid";
+	return error.message || defaultMessage;
+}
+/**
+* Generates common CSS classes for field validation states
+*/
+function getValidationStateClasses(error, touched) {
+	if (error) return "border-destructive focus:border-destructive focus:ring-destructive/30";
+	if (touched) return "border-success focus:border-success focus:ring-success/30";
+	return "";
+}
+/**
+* Helper for handling form validation errors with React Hook Form
+*/
+function handleValidationError(error, id) {
+	const hasError = hasFieldError(error);
+	const errorMessage = getErrorMessage(error);
+	return {
+		errorId: `${id}-error`,
+		errorMessage,
+		hasError,
+		validationClasses: getValidationStateClasses(error)
+	};
+}
+/**
+* Creates a validation result object for field components
+*/
+function createValidationResult(id, error, touched) {
+	const hasError = hasFieldError(error);
+	const errorMessage = getErrorMessage(error);
+	const errorId = `${id}-error`;
+	return {
+		hasError,
+		errorMessage,
+		errorId,
+		validationClasses: getValidationStateClasses(error, touched),
+		"aria-invalid": hasError,
+		"aria-errormessage": hasError ? errorId : void 0
+	};
+}
+/**
+* Generic field validation function that can be used to validate any field type
+* based on common validation criteria
+*/
+function validateField(value, validation) {
+	if (!validation) return true;
+	if (validation.required && (value === void 0 || value === null || value === "")) return typeof validation.required === "boolean" ? "This field is required" : "This field is required";
+	if (value === void 0 || value === null || value === "") return true;
+	if (typeof value === "string") {
+		if (validation.minLength && value.length < validation.minLength) return `Minimum length is ${validation.minLength} characters`;
+		if (validation.maxLength && value.length > validation.maxLength) return `Maximum length is ${validation.maxLength} characters`;
+		if (validation.pattern) {
+			if (!(typeof validation.pattern === "string" ? new RegExp(validation.pattern) : validation.pattern).test(value)) {
+				if (!INTEGER_PATTERN.test(value) && /\d/.test(value)) return "Value must be a valid integer (no decimals)";
+				return "Value does not match the required pattern";
+			}
+		}
+	}
+	if (typeof value === "number" || typeof value === "string" && !isNaN(Number(value))) {
+		const numValue = typeof value === "number" ? value : Number(value);
+		if (validation.min !== void 0 && numValue < validation.min) return `Minimum value is ${validation.min}`;
+		if (validation.max !== void 0 && numValue > validation.max) return `Maximum value is ${validation.max}`;
+	}
+	if (validation.conditions && validation.conditions.length > 0) {}
+	return true;
+}
+/**
+* Map validation utilities
+*/
+/**
+* Checks if a map entry at the given index has a duplicate key
+* @param entries - Array of map entries
+* @param currentIndex - Index of the entry to check
+* @returns true if the key at currentIndex is duplicated elsewhere in the array
+*/
+function isDuplicateMapKey(entries, currentIndex) {
+	if (!Array.isArray(entries) || entries.length <= 1) return false;
+	const currentKeyValue = entries[currentIndex]?.key;
+	if (!currentKeyValue || currentKeyValue === "") return false;
+	return entries.some((entry, i) => {
+		if (i === currentIndex) return false;
+		const key = entry?.key;
+		if (key === "") return false;
+		if (typeof key === "string" && typeof currentKeyValue === "string") return key === currentKeyValue;
+		if (typeof key === "number" && typeof currentKeyValue === "number") return Number.isNaN(key) ? Number.isNaN(currentKeyValue) : key === currentKeyValue;
+		if (typeof key === "boolean" && typeof currentKeyValue === "boolean") return key === currentKeyValue;
+		if (typeof key === "object" && key !== null && typeof currentKeyValue === "object" && currentKeyValue !== null) return key === currentKeyValue;
+		return false;
+	});
+}
+/**
+* Validates an array of map entries for duplicate keys
+* @param entries - Array of map entries to validate
+* @returns Validation error message if duplicates found, otherwise undefined
+*/
+function validateMapEntries(entries) {
+	if (!Array.isArray(entries) || entries.length <= 1) return;
+	const keyStrings = entries.map((entry) => entry?.key).filter((key) => key !== void 0 && key !== null && key !== "").map((key) => String(key));
+	const uniqueKeyStrings = new Set(keyStrings);
+	if (keyStrings.length !== uniqueKeyStrings.size) return "Duplicate keys are not allowed";
+}
+
+//#endregion
+//#region src/components/fields/utils/ErrorMessage.tsx
+/**
+* Displays validation error messages for form fields
+*/
+function ErrorMessage({ error, id, message, className = "" }) {
+	const errorMessage = message || getErrorMessage(error);
+	if (!errorMessage) return null;
+	return /* @__PURE__ */ jsx("div", {
+		id,
+		className: `text-destructive mt-1 text-sm ${className}`,
+		role: "alert",
+		children: errorMessage
+	});
+}
+
+//#endregion
+export { getValidationStateClasses as a, isDuplicateMapKey as c, INTEGER_HTML_PATTERN as d, INTEGER_INPUT_PATTERN as f, getErrorMessage as i, validateField as l, createValidationResult as n, handleValidationError as o, INTEGER_PATTERN as p, formatValidationError as r, hasFieldError as s, ErrorMessage as t, validateMapEntries as u };
+//# sourceMappingURL=ErrorMessage-DyO9ZWWz.js.map

package/dist/ErrorMessage-DyO9ZWWz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage-DyO9ZWWz.js","names":[],"sources":["../src/components/fields/utils/integerValidation.ts","../src/components/fields/utils/validation.ts","../src/components/fields/utils/ErrorMessage.tsx"],"sourcesContent":["/**\n * Shared integer validation patterns for BigInt fields and validation utilities.\n *\n * These patterns ensure consistent validation across the application.\n */\n\n/**\n * Integer validation pattern - requires at least one digit\n * Used for validation to ensure complete integers are entered\n * Matches: -123, 0, 456\n * Does not match: -, abc, 12.3\n */\nexport const INTEGER_PATTERN = /^-?\\d+$/;\n\n/**\n * Integer input pattern - allows partial input during typing\n * Used during input to allow users to type minus sign first\n * Matches: -, -1, 123, (empty string)\n * Does not match: abc, 12.3\n */\nexport const INTEGER_INPUT_PATTERN = /^-?\\d*$/;\n\n/**\n * HTML pattern attribute for integer inputs\n * Must use [0-9] instead of \\d for HTML5 pattern attribute\n */\nexport const INTEGER_HTML_PATTERN = '-?[0-9]*';\n","/**\n * Validation and error handling utilities for form field components\n */\nimport { FieldError } from 'react-hook-form';\n\nimport { FieldValidation, MapEntry } from '@openzeppelin/ui-types';\n\nimport { INTEGER_PATTERN } from './integerValidation';\n\n/**\n * Determines if a field has an error\n */\nexport function hasFieldError(error: FieldError | undefined): boolean {\n  return !!error;\n}\n\n/**\n * Gets appropriate error message from field error\n */\nexport function getErrorMessage(error: FieldError | undefined): string | undefined {\n  if (!error) return undefined;\n\n  return error.message || 'This field is invalid';\n}\n\n/**\n * Formats validation error messages for display\n */\nexport function formatValidationError(\n  error: FieldError | undefined,\n  fieldName?: string\n): string | undefined {\n  if (!error) return undefined;\n\n  const defaultMessage = fieldName ? `${fieldName} is invalid` : 'This field is invalid';\n\n  return error.message || defaultMessage;\n}\n\n/**\n * Generates common CSS classes for field validation states\n */\nexport function getValidationStateClasses(\n  error: FieldError | undefined,\n  touched?: boolean\n): string {\n  if (error) {\n    return 'border-destructive focus:border-destructive focus:ring-destructive/30';\n  }\n\n  if (touched) {\n    return 'border-success focus:border-success focus:ring-success/30';\n  }\n\n  return '';\n}\n\n/**\n * Helper for handling form validation errors with React Hook Form\n */\nexport function handleValidationError(\n  error: FieldError | undefined,\n  id: string\n): {\n  errorId: string;\n  errorMessage: string | undefined;\n  hasError: boolean;\n  validationClasses: string;\n} {\n  const hasError = hasFieldError(error);\n  const errorMessage = getErrorMessage(error);\n  const errorId = `${id}-error`;\n  const validationClasses = getValidationStateClasses(error);\n\n  return {\n    errorId,\n    errorMessage,\n    hasError,\n    validationClasses,\n  };\n}\n\n/**\n * Creates a validation result object for field components\n */\nexport function createValidationResult(\n  id: string,\n  error: FieldError | undefined,\n  touched?: boolean\n): {\n  hasError: boolean;\n  errorMessage: string | undefined;\n  errorId: string;\n  validationClasses: string;\n  'aria-invalid': boolean;\n  'aria-errormessage'?: string;\n} {\n  const hasError = hasFieldError(error);\n  const errorMessage = getErrorMessage(error);\n  const errorId = `${id}-error`;\n  const validationClasses = getValidationStateClasses(error, touched);\n\n  return {\n    hasError,\n    errorMessage,\n    errorId,\n    validationClasses,\n    'aria-invalid': hasError,\n    'aria-errormessage': hasError ? errorId : undefined,\n  };\n}\n\n/**\n * Generic field validation function that can be used to validate any field type\n * based on common validation criteria\n */\nexport function validateField(value: unknown, validation?: FieldValidation): string | boolean {\n  // Return true if no validation rules are provided\n  if (!validation) return true;\n\n  // Check if required but empty\n  if (validation.required && (value === undefined || value === null || value === '')) {\n    return typeof validation.required === 'boolean'\n      ? 'This field is required'\n      : 'This field is required'; // Always return the standard message for required fields\n  }\n\n  // Skip other validations if value is empty and not required\n  if (value === undefined || value === null || value === '') {\n    return true;\n  }\n\n  // Validate string length\n  if (typeof value === 'string') {\n    if (validation.minLength && value.length < validation.minLength) {\n      return `Minimum length is ${validation.minLength} characters`;\n    }\n\n    if (validation.maxLength && value.length > validation.maxLength) {\n      return `Maximum length is ${validation.maxLength} characters`;\n    }\n\n    // Validate pattern\n    if (validation.pattern) {\n      const pattern =\n        typeof validation.pattern === 'string'\n          ? new RegExp(validation.pattern)\n          : validation.pattern;\n\n      if (!pattern.test(value)) {\n        // Provide more specific error message for integer validation\n        if (!INTEGER_PATTERN.test(value) && /\\d/.test(value)) {\n          return 'Value must be a valid integer (no decimals)';\n        }\n        return 'Value does not match the required pattern';\n      }\n    }\n  }\n\n  // Validate number range\n  if (typeof value === 'number' || (typeof value === 'string' && !isNaN(Number(value)))) {\n    const numValue = typeof value === 'number' ? value : Number(value);\n\n    if (validation.min !== undefined && numValue < validation.min) {\n      return `Minimum value is ${validation.min}`;\n    }\n\n    if (validation.max !== undefined && numValue > validation.max) {\n      return `Maximum value is ${validation.max}`;\n    }\n  }\n\n  // Check field conditions if defined\n  if (validation.conditions && validation.conditions.length > 0) {\n    // Note: This would need the current form values to evaluate conditions\n    // This is intended to be used with React Hook Form's validation context\n    // Implementation would depend on how conditions are evaluated in the form context\n  }\n\n  // If all validations pass\n  return true;\n}\n\n/**\n * Map validation utilities\n */\n\n/**\n * Checks if a map entry at the given index has a duplicate key\n * @param entries - Array of map entries\n * @param currentIndex - Index of the entry to check\n * @returns true if the key at currentIndex is duplicated elsewhere in the array\n */\nexport function isDuplicateMapKey(entries: MapEntry[], currentIndex: number): boolean {\n  if (!Array.isArray(entries) || entries.length <= 1) {\n    return false;\n  }\n\n  const currentKeyValue = entries[currentIndex]?.key;\n\n  // Don't consider empty keys as duplicates\n  if (!currentKeyValue || currentKeyValue === '') {\n    return false;\n  }\n\n  // Prefer strict equality to avoid cross-type false positives (e.g., 123 vs \"123\")\n  // Treat empty string as non-duplicate as above.\n  return entries.some((entry: MapEntry, i: number) => {\n    if (i === currentIndex) return false;\n    const key = entry?.key;\n    if (key === '') return false;\n    // If both are strings, compare strings\n    if (typeof key === 'string' && typeof currentKeyValue === 'string') {\n      return key === currentKeyValue;\n    }\n    // If both are numbers, compare numbers\n    if (typeof key === 'number' && typeof currentKeyValue === 'number') {\n      return Number.isNaN(key) ? Number.isNaN(currentKeyValue) : key === currentKeyValue;\n    }\n    // If both are booleans\n    if (typeof key === 'boolean' && typeof currentKeyValue === 'boolean') {\n      return key === currentKeyValue;\n    }\n    // For objects (including dates) fall back to reference equality\n    if (\n      typeof key === 'object' &&\n      key !== null &&\n      typeof currentKeyValue === 'object' &&\n      currentKeyValue !== null\n    ) {\n      return key === currentKeyValue;\n    }\n    // Otherwise, consider different types as different keys\n    return false;\n  });\n}\n\n/**\n * Validates an array of map entries for duplicate keys\n * @param entries - Array of map entries to validate\n * @returns Validation error message if duplicates found, otherwise undefined\n */\nexport function validateMapEntries(entries: MapEntry[]): string | undefined {\n  if (!Array.isArray(entries) || entries.length <= 1) {\n    return undefined;\n  }\n\n  const keys = entries\n    .map((entry) => entry?.key)\n    .filter((key) => key !== undefined && key !== null && key !== '');\n\n  const keyStrings = keys.map((key) => String(key));\n  const uniqueKeyStrings = new Set(keyStrings);\n\n  if (keyStrings.length !== uniqueKeyStrings.size) {\n    return 'Duplicate keys are not allowed';\n  }\n\n  return undefined;\n}\n","import React from 'react';\nimport { FieldError } from 'react-hook-form';\n\nimport { getErrorMessage } from './validation';\n\ninterface ErrorMessageProps {\n  /**\n   * The error object from React Hook Form\n   */\n  error?: FieldError;\n\n  /**\n   * The ID of the error message for aria-errormessage references\n   */\n  id: string;\n\n  /**\n   * Optional custom error message to display instead of the error from React Hook Form\n   */\n  message?: string;\n\n  /**\n   * Optional additional CSS classes\n   */\n  className?: string;\n}\n\n/**\n * Displays validation error messages for form fields\n */\nexport function ErrorMessage({\n  error,\n  id,\n  message,\n  className = '',\n}: ErrorMessageProps): React.ReactElement | null {\n  const errorMessage = message || getErrorMessage(error);\n\n  if (!errorMessage) return null;\n\n  return (\n    <div id={id} className={`text-destructive mt-1 text-sm ${className}`} role=\"alert\">\n      {errorMessage}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/code-editor-BKEEXGxt.d.cts

@@ -0,0 +1,122 @@
+import React from "react";
+import { Control, FieldValues, Path } from "react-hook-form";
+
+//#region src/components/fields/CodeEditorField.d.ts
+
+/**
+ * CodeEditorField component properties
+ */
+interface CodeEditorFieldProps<TFieldValues extends FieldValues = FieldValues> {
+  /**
+   * Unique identifier for the field
+   */
+  id: string;
+  /**
+   * Optional CSS class name for the container
+   */
+  className?: string;
+  /**
+   * Field name for form control
+   */
+  name: Path<TFieldValues>;
+  /**
+   * React Hook Form control object
+   */
+  control: Control<TFieldValues>;
+  /**
+   * Field label
+   */
+  label?: string;
+  /**
+   * Helper text displayed below the field
+   */
+  helperText?: string;
+  /**
+   * Placeholder text when empty
+   */
+  placeholder?: string;
+  /**
+   * Programming language for syntax highlighting
+   */
+  language?: string;
+  /**
+   * Editor theme
+   */
+  theme?: string;
+  /**
+   * Editor height
+   */
+  height?: string;
+  /**
+   * Editor maximum height (with scrollbar for overflow)
+   */
+  maxHeight?: string;
+  /**
+   * Content size threshold for disabling syntax highlighting (default: 5000 chars)
+   */
+  performanceThreshold?: number;
+  /**
+   * Whether the field is required
+   */
+  required?: boolean;
+  /**
+   * Whether the field is disabled
+   */
+  disabled?: boolean;
+  /**
+   * Whether the field is read-only
+   */
+  readOnly?: boolean;
+  /**
+   * Custom validation function for code values
+   */
+  validateCode?: (value: string) => boolean | string;
+}
+/**
+ * CodeEditorField provides syntax-highlighted code editing with form integration.
+ *
+ * Features:
+ * - Syntax highlighting via @uiw/react-textarea-code-editor
+ * - React Hook Form integration with Controller
+ * - Configurable language support (JSON, TypeScript, etc.)
+ * - Performance optimizations with smart highlighting
+ * - Constrained height with automatic scrolling
+ * - Design system styling integration
+ *
+ * @example
+ * ```tsx
+ * <CodeEditorField
+ *   id="contractAbi"
+ *   name="contractSchema"
+ *   control={control}
+ *   label="Contract ABI"
+ *   language="json"
+ *   placeholder="Paste your ABI JSON here..."
+ * />
+ * ```
+ */
+declare function CodeEditorField<TFieldValues extends FieldValues = FieldValues>({
+  id,
+  name,
+  control,
+  label,
+  helperText,
+  placeholder,
+  language,
+  theme,
+  height,
+  maxHeight,
+  performanceThreshold,
+  required,
+  disabled,
+  readOnly,
+  validateCode,
+  className
+}: CodeEditorFieldProps<TFieldValues>): React.ReactElement;
+declare namespace CodeEditorField {
+  var displayName: string;
+}
+//# sourceMappingURL=CodeEditorField.d.ts.map
+//#endregion
+export { CodeEditorField, CodeEditorFieldProps };
+//# sourceMappingURL=code-editor-BKEEXGxt.d.cts.map

package/dist/code-editor-BKEEXGxt.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor-BKEEXGxt.d.cts","names":[],"sources":["../src/components/fields/CodeEditorField.tsx"],"sourcesContent":[],"mappings":";;;;;;;AAUA;AAAqC,UAApB,oBAAoB,CAAA,qBAAsB,WAAtB,GAAoC,WAApC,CAAA,CAAA;;;;MAc7B,MAAA;;;;EA2FQ,SAAA,CAAA,EAAA,MAAe;EAAA;;;MAC7B,EA5FM,IA4FN,CA5FW,YA4FX,CAAA;;;;SAIA,EA3FS,OA2FT,CA3FiB,YA2FjB,CAAA;;;;OAIA,CAAA,EAAA,MAAA;;;;YAIA,CAAA,EAAA,MAAA;;;;aAIsB,CAAA,EAAA,MAAA;;;;EAjBR,QAAA,CAAA,EAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAA,qCAAqC,cAAc;;;;;;;;;;;;;;;;;GAiBhE,qBAAqB,gBAAgB,KAAA,CAAM;kBAjB9B,eAAA"}