prop-types#oneOfType JavaScript Examples

FillPreview.propTypes = {
  /** render as some other component or DOM tag */
  as: oneOfType([func, object, string]),

  /** control focusability */
  tabIndex: number,

  /** Color, gradient, image url or svg to be rendered as a preview content */
  fill: oneOfType([string, node]),

  /** Outlines the border when set to true */
  selected: bool,

  /** Pass your handler for click event */
  onClick: func,

  /** Puts the component into a disabled state */
  disabled: bool,

  /** Control elements aspect ratio value:  */
  aspectRatio: oneOfType([string, number]),
};

rootMenuPropTypes = {
  ...menuPropTypes,
  containerProps: object,
  initialMounted: bool,
  unmountOnClose: bool,
  transition: oneOfType([
    bool,
    exact({
      open: bool,
      close: bool,
      item: bool
    })
  ]),
  transitionTimeout: number,
  boundingBoxRef: object,
  boundingBoxPadding: string,
  reposition: oneOf(['auto', 'initial']),
  repositionFlag: oneOfType([string, number]),
  viewScroll: oneOf(['auto', 'close', 'initial']),
  submenuOpenDelay: number,
  submenuCloseDelay: number,
  portal: oneOfType([
    bool,
    exact({
      target: object,
      stablePosition: bool
    })
  ]),
  theming: string,
  onItemClick: func
}

SubMenu.propTypes = {
  ...menuPropTypes,
  ...uncontrolledMenuPropTypes,
  disabled: bool,
  openTrigger: oneOf(['none', 'clickOnly']),
  label: oneOfType([node, func]),
  itemProps: shape({
    ...stylePropTypes()
  })
};

MenuItem.propTypes = {
  ...stylePropTypes(),
  value: any,
  href: string,
  type: oneOf(['checkbox', 'radio']),
  checked: bool,
  disabled: bool,
  children: oneOfType([node, func]),
  onClick: func
};

ControlledMenu.propTypes /* remove-proptypes */ = {
  ...rootMenuPropTypes,
  state: oneOf(values(MenuStateMap)),
  anchorPoint: exact({
    x: number,
    y: number
  }),
  anchorRef: object,
  skipOpen: object,
  captureFocus: bool,
  menuItemFocus: exact({
    position: oneOfType([string, number]),
    alwaysUpdate: bool
  }),
  onClose: func
};

rootMenuPropTypes = /*#__PURE__*/_extends({}, menuPropTypes, {
  containerProps: object,
  initialMounted: bool,
  unmountOnClose: bool,
  transition: /*#__PURE__*/oneOfType([bool, /*#__PURE__*/exact({
    open: bool,
    close: bool,
    item: bool
  })]),
  transitionTimeout: number,
  boundingBoxRef: object,
  boundingBoxPadding: string,
  reposition: /*#__PURE__*/oneOf(['auto', 'initial']),
  repositionFlag: /*#__PURE__*/oneOfType([string, number]),
  viewScroll: /*#__PURE__*/oneOf(['auto', 'close', 'initial']),
  submenuOpenDelay: number,
  submenuCloseDelay: number,
  portal: /*#__PURE__*/oneOfType([bool, /*#__PURE__*/exact({
    target: object,
    stablePosition: bool
  })]),
  theming: string,
  onItemClick: func
})

process.env.NODE_ENV !== "production" ? MenuItem.propTypes = /*#__PURE__*/_extends({}, /*#__PURE__*/stylePropTypes(), {
  value: any,
  href: string,
  type: /*#__PURE__*/oneOf(['checkbox', 'radio']),
  checked: bool,
  disabled: bool,
  children: /*#__PURE__*/oneOfType([node, func]),
  onClick: func
}) : void 0;

process.env.NODE_ENV !== "production" ? ControlledMenu.propTypes = /*#__PURE__*/_extends({}, rootMenuPropTypes, {
  state: /*#__PURE__*/oneOf( /*#__PURE__*/values(MenuStateMap)),
  anchorPoint: /*#__PURE__*/exact({
    x: number,
    y: number
  }),
  anchorRef: object,
  skipOpen: object,
  captureFocus: bool,
  menuItemFocus: /*#__PURE__*/exact({
    position: /*#__PURE__*/oneOfType([string, number]),
    alwaysUpdate: bool
  }),
  onClose: func
}) : void 0;

propTypes = {
    container: oneOfType([
        func,
        shape({current: oneOfType([instanceOf(Element), instanceOf(_window.constructor)])}),
    ]),
    reference: oneOfType([
        func,
        instanceOf(DOMRect),
        shape({current: instanceOf(Element)}),
    ]),
    placements: func,
    placement: shape({
        top: number,
        left: number,
    }),
    overflow: func,
    onPlacement: func,
    default: number,
    children: node,
}

color = oneOfType([
  shape({
    css: shape({
      // TODO
    }),
    value: number,
    hex: string,
    raw: oneOfType([string, array, number, shape]),
    name: string,
    alpha: number,
    rgb: arrayOf(number),
    hsv: arrayOf(number),
    hsl: arrayOf(number),
  }),
  string,
  number,
])

ImageElement.propTypes = {
  item: shape({
    defaultURL: string,
    height: oneOfType([
      number,
      string,
    ]),
    id: string,
    opacity: oneOfType([
      number,
      string,
    ]),
    roundedCorners: oneOfType([
      number,
      string,
    ]),
    url: string,
    width: oneOfType([
      number,
      string,
    ]),
  }),
  itemAccessor: func,
};

Slider.propTypes = {
  /** Allows the slider's handles to cross. */
  allowCross: PropTypes.bool,
  dataHook: PropTypes.string,

  /** Controls the visibility of the marks. */
  displayMarks: PropTypes.bool,

  /** Controls visibility of slide handle tooltip */
  displayTooltip: PropTypes.bool,
  id: PropTypes.string,

  /** The absolute maximum of the slider's range */
  max: PropTypes.number,

  /** The absolute minimum of the slider's range */
  min: PropTypes.number,

  /** Called after every value change */
  onAfterChange: PropTypes.func,

  /** Called upon every value change */
  onChange: PropTypes.func.isRequired,

  /** Adjust for RTL dir. */
  rtl: PropTypes.bool,

  /** The slider's step */
  step: PropTypes.number,

  /** Allow pushing of surrounding handles when moving a handle. Number means a minimum distance between handles */
  pushable: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),

  /** The slider's selected range */
  value: oneOfType([arrayOf(PropTypes.number), number]),

  /** Make it disabled */
  disabled: PropTypes.bool,
};

BulkSelection.propTypes = {
  /** Array of item selection boolean states. Should correspond in length to the data prop */
  selectedIds: oneOfType([arrayOf(string), arrayOf(number)]),
  /** An array of all selectable item ids (string ids) */
  allIds: oneOfType([arrayOf(string), arrayOf(number)]).isRequired,
  /** Called when item selection changes.
   * Receives 2 arguments, the updated selectedIds array, and a `change` object.
   * The `change` object has a `type` property with the following possible values: 'ALL', 'NONE', 'SINGLE_TOGGLE'.
   * In case of 'SINGLE_TOGGLE' the `change` object will also include an `id` prop with the item's id,
   * and a `value` prop with the new boolean selection state of the item.
   * The `change` object also contains an `origin` property which indicates what initiated the selection change.
   * The `origin` property can be set when selection is updated using a `SelectionContext` method.
   * In case `totalSelectableCount` is set and the list is not fully loaded, and the user did bulk selection ("Select All"), the first parameter (selectedIds) will be null.
   * You can use the selection context's getNotSelectedIds() method to get the items that the user unselected after selecting all items. */
  onSelectionChanged: func,
  /** Are checkboxes disabled */
  disabled: bool,
  /** Indicates whether the table is in infinite bulk selection mode (`infiniteScroll` and `totalSelectableCount` props are set) and there are more items to load (`hasMore` prop is `true`) */
  hasMoreInBulkSelection: bool,
  /** The table's `totalSelectableCount` prop  */
  totalCount: number,
  /** Any - can consume the BulkSelectionProvider context */
  children: any,
};

Comp.propTypes = {
  /** should the text get ellipsed with tooltip, or should it get broken into lines when it reaches the end of its container */
  ellipsis: bool,
  /** `ellipsis` prop. Tooltip content calculation relation to a dom element. Can be either:
   *  `'window', 'scrollParent', 'viewport', 'parent'`, `element` or
   * `function` based predicate i.e. (elm) =>
   *  elm.getAttribute('data-hook') === 'value'
   */
  appendTo: oneOfType([
    oneOf(['window', 'scrollParent', 'viewport', 'parent']),
    element,
    func,
  ]),
  /** `ellipsis` prop. Whether to enable the flip behaviour. This behaviour is used to flip the Tooltips placement when it starts to overlap the target element. */
  flip: bool,
  /** `ellipsis` prop. Whether to enable the fixed behaviour. This behaviour is used to keep the Tooltip at it's original placement even when it's being positioned outside the boundary. */
  fixed: bool,
  /** `ellipsis` prop. Tooltip content placement in relation to target element */
  placement: string,
  /** `ellipsis` prop. Tooltip timeout value. */
  timeout: number,
  /** `ellipsis` prop. Tooltip content max width value. */
  maxWidth: oneOfType([string, number]),
  /** `ellipsis` prop. Tooltip content zIndex. */
  zIndex: number,
  /** `ellipsis` prop. Tooltip hide delay. */
  hideDelay: number,
  /** `ellipsis` prop. Tooltip show delay. */
  showDelay: number,
  /** `ellipsis` prop. Whether to enable the tooltip when an ellipsis is necessary */
  showTooltip: bool,
};

SingleComponentStacked.propTypes = {
  /** storybook name */
  name: oneOfType([string, object]),
  /** names of the used components */
  componentsNames: array,
  /** any node to render inside */
  children: node,
  /** size of the children column. Can be one of "singleComponentSizes" constant */
  size: number,
};

process.env.NODE_ENV !== "production" ? SubMenu.propTypes = /*#__PURE__*/_extends({}, menuPropTypes, uncontrolledMenuPropTypes, {
  disabled: bool,
  openTrigger: /*#__PURE__*/oneOf(['none', 'clickOnly']),
  label: /*#__PURE__*/oneOfType([node, func]),
  itemProps: /*#__PURE__*/shape( /*#__PURE__*/_extends({}, /*#__PURE__*/stylePropTypes()))
}) : void 0;

uncontrolledMenuPropTypes = {
  instanceRef: oneOfType([object, func]),
  onMenuChange: func
}

ctaType = shape({
  type: oneOf(['button', 'icon']).isRequired,
  action: func.isRequired,
  label: string,
  icon: oneOfType([string, node]),
  tooltip: string
})

stylePropTypes = (name) => ({
  [name ? `${name}ClassName` : 'className']: oneOfType([string, func])
})

Menu.propTypes = {
  ...rootMenuPropTypes,
  ...uncontrolledMenuPropTypes,
  menuButton: oneOfType([element, func]).isRequired
};

uncontrolledMenuPropTypes = {
  instanceRef: /*#__PURE__*/oneOfType([object, func]),
  onMenuChange: func
}

stylePropTypes = function stylePropTypes(name) {
  var _ref;

  return _ref = {}, _ref[name ? name + "ClassName" : 'className'] = oneOfType([string, func]), _ref;
}

scheduleStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  isLoaded: bool.isRequired,
  data: oneOfType([arrayOf(shape(scheduleShape)), arrayOf(undefined)]).isRequired,
}

studentsStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  isLoaded: bool.isRequired,
  data: oneOfType([arrayOf(shape(studentShape)), arrayOf(undefined)]).isRequired,
}

process.env.NODE_ENV !== "production" ? Menu.propTypes = /*#__PURE__*/_extends({}, rootMenuPropTypes, uncontrolledMenuPropTypes, {
  menuButton: oneOfType([element, func]).isRequired
}) : void 0;

mentorsStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  isLoaded: bool.isRequired,
  data: oneOfType([arrayOf(shape(mentorShape)), arrayOf(undefined)]).isRequired,
}

coursesStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  loaded: bool.isRequired,
  data: oneOfType([arrayOf(shape(courseShape)), arrayOf(undefined)]).isRequired,
}

studentGroupsStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  isLoaded: bool.isRequired,
  data: oneOfType([arrayOf(shape(studentGroupShape)), arrayOf(undefined)]).isRequired,
}

studentGroupByIdStateShape = {
  error: string.isRequired,
  isLoading: bool.isRequired,
  isLoaded: bool.isRequired,
  data: oneOfType([shape(studentGroupShape), object]).isRequired,
}