@shopify/polaris/dist/esm/utilities/components.js

Shopify’s product component library

import React$1, { Children, isValidElement } from 'react';

// `Component`. If `props` is passed, those will be added as props on the
// wrapped component. If `element` is null, the component is not wrapped.

function wrapWithComponent(element, Component, props) {
  if (element == null) {
    return null;
  }

  return isElementOfType(element, Component) ? element : /*#__PURE__*/React$1.createElement(Component, props, element);
} // In development, we compare based on the name of the function because
// React Hot Loader proxies React components in order to make updates. In
// production we can simply compare the components for equality.

var isComponent = process.env.NODE_ENV === 'development' ? hotReloadComponentCheck : (AComponent, AnotherComponent) => AComponent === AnotherComponent; // Checks whether `element` is a React element of type `Component` (or one of
// the passed components, if `Component` is an array of React components).

function isElementOfType(element, Component) {
  if (element == null || ! /*#__PURE__*/isValidElement(element) || typeof element.type === 'string') {
    return false;
  }

  var {
    type
  } = element;
  var Components = Array.isArray(Component) ? Component : [Component];
  return Components.some(AComponent => typeof type !== 'string' && isComponent(AComponent, type));
} // Returns all children that are valid elements as an array. Can optionally be
// filtered by passing `predicate`.

function elementChildren(children, predicate = () => true) {
  return Children.toArray(children).filter(child => /*#__PURE__*/isValidElement(child) && predicate(child));
}
function ConditionalWrapper({
  condition,
  wrapper,
  children
}) {
  return condition ? wrapper(children) : children;
}
function ConditionalRender({
  condition,
  children
}) {
  return condition ? children : null;
}

function hotReloadComponentCheck(AComponent, AnotherComponent) {
  var componentName = AComponent.name;
  var anotherComponentName = AnotherComponent.displayName;
  return AComponent === AnotherComponent || Boolean(componentName) && componentName === anotherComponentName;
}

export { ConditionalRender, ConditionalWrapper, elementChildren, isElementOfType, wrapWithComponent };