@elliemae/ds-props-helpers 2.3.0-alpha.8 → 2.3.0-next.10

package/esm/globalProps/useGetGlobalAttributes.js

@@ -0,0 +1,33 @@
+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 { useMemo } from 'react';
+import { globalAttributes } from './constants.js';
+
+const useGetGlobalAttributes = (props, overrides) => {
+  const componentGlobalAttributes = useMemo(() => {
+    const globalAttributesObject = {};
+    Object.entries(props).forEach(_ref => {
+      let [key, value] = _ref;
+
+      if (key in globalAttributes || key.startsWith('data-')) {
+        if (overrides && key in overrides && typeof value === 'function' && typeof overrides[key] === 'function') {
+          const newFunc = function () {
+            value(...arguments);
+            overrides[key](...arguments);
+          };
+
+          globalAttributesObject[key] = newFunc;
+        } else {
+          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+          globalAttributesObject[key] = value;
+        }
+      }
+    });
+    return globalAttributesObject;
+  }, [props, overrides]);
+  return componentGlobalAttributes;
+};
+
+export { useGetGlobalAttributes };

package/esm/index.js

@@ -0,0 +1,11 @@
+export { useMemoMergePropsWithDefault } from './defaultProps/useMemoMergePropsWithDefault.js';
+export { getAriaProps, getDataProps } from './getProps/index.js';
+export { useGetGlobalAttributes } from './globalProps/useGetGlobalAttributes.js';
+export { globalAttributesPropTypes } from './globalProps/globalAttributesPropTypes.js';
+export { default as PropTypes } from './propTypes/PropTypes.js';
+export { default as describe } from './propTypes/describe.js';
+export { useValidatePropTypes } from './validation/validator.js';
+export { throwRequiredError, throwTypeError } from './validation/errorTemplates.js';
+export { useValidateTypescriptPropTypes, validateTypescriptPropTypesImplementation } from './validation/typescriptValidator.js';
+export { useGetXstyledProps } from './xstyledProps/useGetXstyledProps.js';
+export { xstyledPropTypes } from './xstyledProps/xstyledPropTypes.js';

package/esm/propTypes/PropTypes.js

@@ -0,0 +1,125 @@
+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.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; }
+
+const addPropTypeDocumentationField = fieldName => function addFieldToReactDesc(value) {
+  if (!this.reactDesc) {
+    this.reactDesc = {};
+  }
+
+  let realValue = value;
+  if (fieldName === 'global' || fieldName === 'hidden' || fieldName === 'xstyled') realValue = true;
+  this.reactDesc[fieldName] = realValue;
+  return this;
+};
+
+const documentedPropType = {
+  defaultValue: addPropTypeDocumentationField('defaultValue'),
+  description: addPropTypeDocumentationField('description'),
+  deprecated: addPropTypeDocumentationField('deprecated'),
+  format: addPropTypeDocumentationField('format'),
+  global: addPropTypeDocumentationField('global'),
+  hidden: addPropTypeDocumentationField('hidden'),
+  xstyled: addPropTypeDocumentationField('hidden')
+};
+
+const createPropType = type => {
+  const propTypeObj = _objectSpread({
+    type
+  }, documentedPropType);
+
+  Object.defineProperty(propTypeObj, 'isRequired', {
+    get: function getRequired() {
+      if (!this.reactDesc) {
+        this.reactDesc = {};
+      }
+
+      this.reactDesc.required = true;
+      return this;
+    },
+    enumerable: true,
+    configurable: true
+  });
+  return propTypeObj;
+};
+
+const createPropTypeWithArgs = type => args => {
+  const propTypeObj = _objectSpread({
+    args,
+    type
+  }, documentedPropType);
+
+  Object.defineProperty(propTypeObj, 'isRequired', {
+    get: function getRequired() {
+      if (!this.reactDesc) {
+        this.reactDesc = {};
+      }
+
+      this.reactDesc.required = true;
+      return this;
+    },
+    enumerable: true,
+    configurable: true
+  });
+  return propTypeObj;
+};
+
+const PropTypes = {
+  custom: callback => {
+    const target = callback.bind(null);
+    target.type = 'func';
+    Object.keys(documentedPropType).forEach(fieldName => {
+      const fieldNameCasted = fieldName; // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+
+      target[fieldNameCasted] = documentedPropType[fieldNameCasted];
+    });
+    return target;
+  }
+};
+
+function definePropType(type) {
+  Object.defineProperty(PropTypes, type, {
+    get: function getPropType() {
+      return createPropType(type);
+    },
+    enumerable: true,
+    configurable: true
+  });
+}
+
+function definePropTypeWithArgs(type) {
+  Object.defineProperty(PropTypes, type, {
+    get: function getPropType() {
+      return createPropTypeWithArgs(type);
+    },
+    enumerable: true,
+    configurable: true
+  });
+}
+
+definePropType('any');
+definePropType('array');
+definePropType('bool');
+definePropType('element');
+definePropType('func');
+definePropType('node');
+definePropType('number');
+definePropType('object');
+definePropType('symbol');
+definePropType('string');
+definePropTypeWithArgs('arrayOf');
+definePropTypeWithArgs('instanceOf');
+definePropTypeWithArgs('objectOf');
+definePropTypeWithArgs('oneOfType');
+definePropTypeWithArgs('oneOf');
+definePropTypeWithArgs('shape');
+definePropTypeWithArgs('tuple');
+
+export { PropTypes as default };

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 };