@elliemae/ds-props-helpers 2.3.0-alpha.6 → 2.3.0-next.0

package/esm/propTypes/customPropTypes.js

@@ -0,0 +1,17 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
+
+/* eslint-disable max-params */
+const tupleValidator = tupleShape => {
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-call
+  const func = function (value, index) {
+    for (var _len = arguments.length, rest = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      rest[_key - 2] = arguments[_key];
+    }
+
+    return tupleShape[index](value, index, ...rest);
+  };
+
+  return func;
+};
+
+export { tupleValidator };

package/esm/propTypes/describe.js

@@ -0,0 +1,62 @@
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { convertPropType } from './describeConversions.js';
+import descToTypescript from './toTypescript.js';
+
+function describe(ComponentInstance) {
+  if (!ComponentInstance) {
+    throw new Error('react-desc: component is required');
+  }
+
+  const documentation = {
+    propTypes: {}
+  };
+  const DocumentedComponent = ComponentInstance;
+
+  const addDocumentationProp = propName => {
+    const func = value => {
+      documentation[propName] = value;
+      return DocumentedComponent;
+    };
+
+    return func;
+  };
+
+  DocumentedComponent.availableAt = addDocumentationProp('availableAt');
+  DocumentedComponent.description = addDocumentationProp('description');
+  DocumentedComponent.details = addDocumentationProp('details');
+  DocumentedComponent.deprecated = addDocumentationProp('deprecated');
+  DocumentedComponent.usage = addDocumentationProp('usage');
+  DocumentedComponent.intrinsicElement = addDocumentationProp('intrinsicElement');
+
+  DocumentedComponent.toTypescript = () => descToTypescript(ComponentInstance, documentation);
+
+  Object.defineProperty(DocumentedComponent, 'propTypes', {
+    get: () => DocumentedComponent.propTypesValue,
+    set: value => {
+      if (!DocumentedComponent.propTypesValue) {
+        DocumentedComponent.propTypesValue = {};
+      }
+
+      Object.keys(value).forEach(name => {
+        const propType = value[name];
+        let realPropType;
+        documentation.propTypes[name] = propType;
+        realPropType = convertPropType(propType);
+
+        if (value[name].reactDesc.required) {
+          realPropType = realPropType.isRequired;
+        }
+
+        DocumentedComponent.propTypesValue[name] = realPropType;
+        return propType;
+      });
+    },
+    enumerable: true,
+    configurable: true
+  });
+  return DocumentedComponent;
+}
+
+export { describe as default };

package/esm/propTypes/describeConversions.js

@@ -0,0 +1,96 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import PropTypes from 'prop-types';
+import { tupleValidator } from './customPropTypes.js';
+import { hasArguments, isOneOfType, isArrayOf, isShape, isInstanceOf, isOneOf, isObjectOf, isExact } from './describeGuards.js';
+
+const enrichPropType = (propType, reactDesc) => {
+  const func = function (props, propName, componentName) {
+    if (reactDesc && reactDesc.deprecated && propName in props && !reactDesc.warned) {
+      const {
+        version = '',
+        message = ''
+      } = reactDesc.deprecated;
+      const warning = "\"".concat(propName, "\" property of \"").concat(componentName, "\" will be deprecated on VERSION: ").concat(version, ".\n").concat(message);
+      console.warn(warning);
+      reactDesc.warned = true;
+    }
+
+    for (var _len = arguments.length, rest = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+      rest[_key - 3] = arguments[_key];
+    }
+
+    return propType(props, propName, componentName, ...rest);
+  };
+
+  Object.defineProperty(func, 'isRequired', Object.getOwnPropertyDescriptor(propType, 'isRequired'));
+  return func;
+};
+
+const convertArray = array => array.map(type => convertPropType(type));
+
+const convertShape = _shape => {
+  const result = {};
+  Object.keys(_shape).forEach(key => {
+    result[key] = convertPropType(_shape[key]);
+  });
+  return result;
+};
+
+const convertPropType = propType => {
+  if (!propType || !propType.type) {
+    throw new Error("react-desc: unknown error -- proptype is not well defined");
+  } // DimSum PropTypes conversion
+
+
+  if (propType.type === 'tuple') {
+    return enrichPropType(PropTypes.arrayOf(tupleValidator(convertArray(propType.args))), propType.reactDesc);
+  } // Default PropType conversion
+
+
+  const realPropType = PropTypes[propType.type];
+
+  if (!realPropType) {
+    throw new Error("react-desc: unknown type ".concat(propType.type));
+  }
+
+  if (hasArguments(propType)) {
+    if (isOneOfType(propType)) {
+      return enrichPropType(realPropType(convertArray(propType.args)), propType.reactDesc);
+    }
+
+    if (isArrayOf(propType)) {
+      return enrichPropType(realPropType(convertPropType(propType.args)), propType.reactDesc);
+    }
+
+    if (isShape(propType)) {
+      return enrichPropType(realPropType(convertShape(propType.args)), propType.reactDesc);
+    }
+
+    if (isInstanceOf(propType)) {
+      return enrichPropType(realPropType(propType.args), propType.reactDesc);
+    }
+
+    if (isOneOf(propType)) {
+      return enrichPropType(realPropType(propType.args), propType.reactDesc);
+    }
+
+    if (isObjectOf(propType)) {
+      return enrichPropType(realPropType(propType.args), propType.reactDesc);
+    }
+
+    if (isExact(propType)) {
+      return enrichPropType(realPropType(propType.args), propType.reactDesc);
+    }
+
+    throw new Error("react-desc: unknown error -- proptype with args is not matching");
+  }
+
+  return enrichPropType(realPropType, propType.reactDesc);
+};
+
+export { convertPropType };

package/esm/propTypes/describeGuards.js

@@ -0,0 +1,10 @@
+const hasArguments = (propType, realPropType) => !!propType.args;
+const isOneOfType = (propType, realPropType) => propType.type === 'oneOfType';
+const isArrayOf = (propType, realPropType) => propType.type === 'arrayOf';
+const isShape = (propType, realPropType) => propType.type === 'shape';
+const isInstanceOf = (propType, realPropType) => propType.type === 'instanceOf';
+const isOneOf = (propType, realPropType) => propType.type === 'oneOf';
+const isObjectOf = (propType, realPropType) => propType.type === 'objectOf';
+const isExact = (propType, realPropType) => propType.type === 'exact';
+
+export { hasArguments, isArrayOf, isExact, isInstanceOf, isObjectOf, isOneOf, isOneOfType, isShape };

package/esm/propTypes/index.js

@@ -0,0 +1,2 @@
+export { default as PropTypes } from './PropTypes.js';
+export { default as describe } from './describe.js';

package/esm/propTypes/toTypescript.js

@@ -0,0 +1,154 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+/* eslint-disable @typescript-eslint/restrict-template-expressions */
+
+/* eslint-disable @typescript-eslint/no-use-before-define */
+
+/* eslint-disable complexity */
+
+/* eslint-disable react/forbid-foreign-prop-types */
+const arrayFormat = array => array.map(propType => propTypeFormat(propType));
+
+const shapeFormat = shape => {
+  const props = Object.keys(shape).map(key => {
+    const value = shape[key];
+    let valueFormat;
+
+    if (value.type && (value.type === 'arrayOf' || value.type === 'oneOfType' || value.type === 'oneOf') && Array.isArray(value.args)) {
+      valueFormat = "".concat(propTypeFormat(value));
+    } else if (value.type === 'shape') {
+      valueFormat = "".concat(propTypeFormat(value));
+    } else {
+      valueFormat = propTypeFormat(value);
+    }
+
+    return "".concat(key).concat(value.reactDesc && value.reactDesc.required ? '' : '?', ": ").concat(valueFormat);
+  });
+  return "{".concat(props.join(','), "}");
+};
+
+const propTypeFormat = function (propType) {
+  let joinWith = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  let result;
+
+  if (Array.isArray(propType)) {
+    result = arrayFormat(propType).join(joinWith);
+  } else if (typeof propType !== 'function' && propType.type) {
+    switch (propType.type) {
+      case 'array':
+        result = 'any[]';
+        break;
+
+      case 'arrayOf':
+        if (propType.args.type === 'oneOfType') {
+          result = "(".concat(propTypeFormat(propType.args, ' | '), ")[]");
+        } else {
+          result = "".concat(propTypeFormat(propType.args, '\n'), "[]");
+        }
+
+        break;
+
+      case 'tuple':
+        result = "[".concat(propTypeFormat(propType.args, ', '), "]");
+        break;
+
+      case 'bool':
+        result = 'boolean';
+        break;
+
+      case 'func':
+        result = '((...args: any[]) => any)';
+        break;
+
+      case 'node':
+        result = 'React.ReactNode';
+        break;
+
+      case 'element':
+        result = 'JSX.Element';
+        break;
+
+      case 'instanceOf':
+        result = 'any';
+        break;
+
+      case 'symbol':
+        result = 'any';
+        break;
+
+      case 'objectOf':
+        result = "{ [key: string]: ".concat(propTypeFormat(propType.args), " }");
+        break;
+
+      case 'oneOf':
+        result = propType.args.map(a => "\"".concat(a, "\"")).join(' | ');
+        break;
+
+      case 'oneOfType':
+        result = "".concat(propTypeFormat(propType.args, ' | '));
+        break;
+
+      case 'shape':
+        result = "".concat(shapeFormat(propType.args));
+        break;
+
+      default:
+        result = "".concat(propType.type);
+        break;
+    }
+  } else {
+    result = 'any';
+  }
+
+  return result;
+};
+
+const propTypeAsTypescript = (propType, propName) => {
+  const documentation = _objectSpread(_objectSpread({}, propType.reactDesc), {}, {
+    name: propName
+  });
+
+  documentation.format = propTypeFormat(propType);
+  return documentation;
+};
+
+function descToTypescript(component, reactDesc) {
+  if (!component) {
+    throw new Error('react-desc: component is required');
+  }
+
+  const documentation = _objectSpread({
+    name: component.displayName || component.name
+  }, reactDesc);
+
+  if (reactDesc) {
+    delete documentation.propTypes;
+
+    if (reactDesc.propTypes) {
+      const propTypes = [];
+      Object.keys(reactDesc.propTypes).forEach(propName => {
+        const propType = reactDesc.propTypes[propName];
+        propTypes.push(propTypeAsTypescript(propType, propName));
+      });
+
+      if (propTypes.length > 0) {
+        documentation.properties = propTypes;
+      }
+    }
+  }
+
+  return documentation;
+}
+
+export { descToTypescript as default };

package/esm/propTypes/types.js

@@ -0,0 +1 @@
+

package/esm/validation/errorTemplates.js

@@ -0,0 +1,11 @@
+import 'core-js/modules/es.string.replace.js';
+
+/* eslint-disable max-params */
+const throwTypeError = (componentName, validPropKey, invalidProp, validFormat) => {
+  throw new Error("".concat(componentName, ":: You are trying to pass a not valid \"").concat(validPropKey, "\" property, \n    please provide a valid type.\n\n  Received: ").concat(invalidProp, " (").concat(typeof invalidProp, ")\n  Expected: (").concat(validFormat.replace('\n', ' or '), ")\n  "));
+};
+const throwRequiredError = (componentName, validPropKey) => {
+  throw new Error("".concat(componentName, ":: Please provide a/an \"").concat(validPropKey, "\" property to use this component. \n     This property is required.\n  "));
+};
+
+export { throwRequiredError, throwTypeError };

package/esm/validation/index.js

@@ -0,0 +1,3 @@
+export { useValidatePropTypes } from './validator.js';
+export { throwRequiredError, throwTypeError } from './errorTemplates.js';
+export { useValidateTypescriptPropTypes, validateTypescriptPropTypesImplementation } from './typescriptValidator.js';

package/esm/validation/typescriptGuards.js

@@ -0,0 +1,23 @@
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+
+const isPrimitiveType = format => ['string', 'number', 'boolean'].includes(format);
+const isUndefined = format => format === '"undefined"';
+const isNull = format => format === '"null"';
+const isUnion = format => {
+  let depth = 0;
+  let satisfies = false;
+  format.split('').forEach(char => {
+    if (['{', '('].includes(char)) depth += 1;else if (['}', ')'].includes(char)) depth -= 1;else if (char === '|' && depth === 0) satisfies = true;
+  });
+  return satisfies;
+};
+const isString = format => !isUnion(format) && format[0] === '"' && format.slice(-1) === '"';
+const isArray = format => !isUnion(format) && format.slice(-2) === '[]';
+const isObject = format => format === 'object' || !isUnion(format) && format[0] === '{' && format.slice(-1) === '}';
+const isFunction = format => !isUnion(format) && format === '((...args: any[]) => any)';
+const isJSXorNode = format => !isUnion(format) && ['React.ReactNode', 'JSX.Element'].includes(format);
+const isSomethingWithParenthesis = format => !isUnion(format) && format[0] === '(' && format.slice(-1) === ')';
+
+export { isArray, isFunction, isJSXorNode, isNull, isObject, isPrimitiveType, isSomethingWithParenthesis, isString, isUndefined, isUnion };

package/esm/validation/typescriptParsers.js

@@ -0,0 +1,41 @@
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+
+/* eslint-disable complexity */
+const typescriptObjectParser = format => {
+  const keyValuePairs = []; // State of the algorithm
+
+  let lastKey = '';
+  let lastValue = '';
+  let shouldAppendToKey = true;
+
+  const pushPair = () => {
+    if (lastKey) keyValuePairs.push([lastKey, lastValue]);
+    lastKey = '';
+    lastValue = '';
+    shouldAppendToKey = true;
+  }; // Complex -- but working -- logic
+
+
+  let depth = 0;
+  format.split('').forEach(char => {
+    if (char === '{') {
+      depth += 1;
+      if (depth > 1) lastValue += char;
+    } else if (char === '}') {
+      if (depth > 1) lastValue += char;
+      depth -= 1;
+      if (depth === 1) pushPair();
+    } else if (char === ':') {
+      shouldAppendToKey = false;
+      if (depth > 1) lastValue += char;
+    } else if (char === ',') {
+      if (depth === 1) pushPair();else lastValue += char;
+    } else if (char === ' ') ; else if (shouldAppendToKey) lastKey += char;else lastValue += char;
+  });
+  pushPair();
+  return keyValuePairs;
+};
+
+export { typescriptObjectParser };

package/esm/validation/typescriptValidator.js

@@ -0,0 +1,203 @@
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { useState, useMemo } from 'react';
+import '../propTypes/PropTypes.js';
+import describe from '../propTypes/describe.js';
+import { throwRequiredError, throwTypeError } from './errorTemplates.js';
+import { isUndefined, isNull, isPrimitiveType, isUnion, isString, isArray, isObject, isFunction, isJSXorNode, isSomethingWithParenthesis } from './typescriptGuards.js';
+import { typescriptObjectParser } from './typescriptParsers.js';
+
+// =============================================================================
+// Atom Validators
+// =============================================================================
+// This functions will validate something from the data
+// and optionally recursively apply `validateValueWithFormat`
+// in smaller parts
+const validateUndefined = (schemaName, key, value, format) => {
+  if (value !== undefined || value === 'undefined') {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+const validateNull = (schemaName, key, value, format) => {
+  if (value !== null || value === 'null') {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+const validatePrimitiveType = (schemaName, key, value, format) => {
+  if (typeof value !== format) {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+const validateString = (schemaName, key, value, format) => {
+  if (value !== format.slice(1, -1)) {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+const validateArray = (schemaName, key, value, format, validationsMemo, nextValidationsMemo) => {
+  // Check that we have an array
+  if (!Array.isArray(value)) {
+    throwTypeError(schemaName, key, value, format);
+  } // Check that each element inside satisfies the format
+
+
+  value.forEach((val, index) => {
+    // this is a recursive func, we need to invoke it before it's defined.
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    validateValueWithFormat(schemaName, "".concat(key, "[").concat(index, "]"), val, format.slice(0, -2), validationsMemo, nextValidationsMemo);
+  });
+};
+
+function isObjectType(value) {
+  return !(typeof value !== 'object' || Array.isArray(value));
+}
+
+const validateObject = (schemaName, key, value, format, validationsMemo, nextValidationsMemo) => {
+  const valuesIsObject = isObjectType(value); // Check that we have an object
+
+  if (!valuesIsObject) {
+    throwTypeError(schemaName, key, value, format);
+    return;
+  }
+
+  if (format === 'object') return;
+  const keyValuePairs = typescriptObjectParser(format); // Now we have the key - value pairs
+  // Each key could either be required or not
+  // Just recursively check the object
+
+  keyValuePairs.forEach(_ref => {
+    let [objectKey, objectValue] = _ref;
+    const trueKey = objectKey.slice(-1) === '?' ? objectKey.slice(0, -1) : objectKey;
+
+    if (trueKey === objectKey && !(trueKey in value)) {
+      throwRequiredError(schemaName, key);
+    }
+
+    if (trueKey in value) {
+      // this is a recursive func, we need to invoke it before it's defined.
+      // eslint-disable-next-line @typescript-eslint/no-use-before-define
+      validateValueWithFormat(schemaName, "".concat(key, "[").concat(trueKey, "]"), value[trueKey], objectValue, validationsMemo, nextValidationsMemo);
+    }
+  });
+};
+
+const validateUnion = (schemaName, key, value, format, validationsMemo, nextValidationsMemo) => {
+  const possibilities = format.split(/\s?\|\s?/);
+  const errors = [];
+  possibilities.forEach(possibility => {
+    try {
+      // this is a recursive func, we need to invoke it before it's defined.
+      // eslint-disable-next-line @typescript-eslint/no-use-before-define
+      validateValueWithFormat(schemaName, key, value, possibility, validationsMemo, nextValidationsMemo);
+    } catch (e) {
+      errors.push(e);
+    }
+  });
+
+  if (errors.length === possibilities.length) {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+const validateFunction = (schemaName, key, value, format) => {
+  // Check that we have a function
+  if (typeof value !== 'function') {
+    throwTypeError(schemaName, key, value, format);
+  }
+};
+
+function isJSXElement(value) {
+  return value === null || typeof value === 'object' && value !== null && '$$typeof' in value;
+}
+
+const validateJSXorNode = (schemaName, key, value, format) => {
+  const valueIsJSX = isJSXElement(value);
+
+  if (format === 'JSX.Element' && !valueIsJSX) {
+    throwTypeError(schemaName, key, value, format);
+  }
+}; // =============================================================================
+// Schema validator
+// =============================================================================
+
+
+const validateValueWithFormat = (schemaName, key, value, format, validationsMemo, nextValidationsMemo) => {
+  nextValidationsMemo[value] = format;
+
+  if (value in validationsMemo) {
+    // We already validated this value on this format
+    return;
+  }
+
+  if (isUndefined(format)) {
+    validateUndefined(schemaName, key, value, format);
+  } else if (isNull(format)) {
+    validateNull(schemaName, key, value, format);
+  } else if (isPrimitiveType(format)) {
+    validatePrimitiveType(schemaName, key, value, format);
+  } else if (isUnion(format)) {
+    validateUnion(schemaName, key, value, format, validationsMemo, nextValidationsMemo);
+  } else if (isString(format)) {
+    validateString(schemaName, key, value, format);
+  } else if (isArray(format)) {
+    validateArray(schemaName, key, value, format, validationsMemo, nextValidationsMemo);
+  } else if (isObject(format)) {
+    validateObject(schemaName, key, value, format, validationsMemo, nextValidationsMemo);
+  } else if (isFunction(format)) {
+    validateFunction(schemaName, key, value, format);
+  } else if (isJSXorNode(format)) {
+    validateJSXorNode(schemaName, key, value, format);
+  } else if (isSomethingWithParenthesis(format)) {
+    validateValueWithFormat(schemaName, key, value, format.slice(1, -1), validationsMemo, nextValidationsMemo);
+  }
+};
+
+const validateTypescriptPropTypesImplementation = function (props, schema) {
+  let validationsMemo = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  let nextValidationsMemo = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+  const {
+    properties,
+    name: schemaName
+  } = schema;
+  properties.forEach(property => {
+    const {
+      name,
+      format,
+      required
+    } = property;
+
+    if (required && !(name in props)) {
+      throwRequiredError(schema.name, name);
+    }
+
+    if (name in props && (props[name] !== undefined || required)) {
+      validateValueWithFormat(schemaName, name, props[name], format, validationsMemo, nextValidationsMemo);
+    }
+  });
+}; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+const useValidateTypescriptPropTypes = (props, propTypes) => {
+  const [validationsMemo, setValidationsMemo] = useState({}); // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+
+  const ComponentWithSchema = useMemo(() => {
+    const Component = () => {}; // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-call
+
+
+    return describe(Component);
+  }, []); // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,  @typescript-eslint/no-unsafe-assignment
+
+  ComponentWithSchema.propTypes = propTypes;
+  useMemo(() => {
+    const nextValidationsMemo = {};
+    validateTypescriptPropTypesImplementation(props, // eslint-disable-next-line  @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+    ComponentWithSchema.toTypescript(), validationsMemo, nextValidationsMemo);
+    setValidationsMemo(nextValidationsMemo); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [props]);
+};
+
+export { useValidateTypescriptPropTypes, validateTypescriptPropTypesImplementation };

package/esm/validation/validator.js

@@ -0,0 +1,32 @@
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { throwRequiredError, throwTypeError } from './errorTemplates.js';
+
+const useValidatePropTypes = (props, schema) => {
+  schema.properties.forEach(property => {
+    const propertyName = property.name;
+    const currentProp = props[propertyName];
+    const currentPropTypeOf = typeof currentProp; // eslint-disable-next-line max-len
+
+    const currentFormat = property.format; // this is csv representing types e.g.: "string"/"string,number"/"[object],string"
+
+    let isValidReactElement = false; // this depends on react desc definition
+
+    if (property.required && !Object.prototype.hasOwnProperty.call(props, property.name)) {
+      throwRequiredError(schema.name, property.name);
+    }
+
+    if (currentPropTypeOf !== 'undefined' && currentProp !== null) {
+      if (currentPropTypeOf === 'object' && Object.prototype.hasOwnProperty.call(currentProp, '$$typeof') && (currentFormat.includes('node') || currentFormat.includes('element'))) {
+        isValidReactElement = true;
+      }
+
+      if (!currentFormat.includes(currentPropTypeOf) && !currentFormat.includes(currentProp) && !isValidReactElement) {
+        throwTypeError(schema.name, propertyName, currentProp, currentFormat);
+      }
+    }
+  });
+};
+
+export { useValidatePropTypes };