Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

prop-types

v2.6.5arrow_drop_down
v2.6.5
v2.5.5
STATUS
Passing
DOWNLOADS
4,349
LICENSE
Apache 2.0
VISIBILITY
Public
PUBLISHED
8 months ago
SIZE
3 KB
1 contributor
Use prop-types in your project ?
Copied
npm i @bit/grommet.grommet.utils.prop-types
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Files
prop-types.js
71 Lines(66 sloc)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
import { PropTypes } from 'react-desc';

export const a11yTitlePropType = PropTypes.string.description(
  'Custom title to be used by screen readers.',
);

export const backgroundPropType = PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.shape({
    color: PropTypes.string,
    opacity: PropTypes.oneOfType([
      PropTypes.oneOf(['weak', 'medium', 'strong']),
      PropTypes.bool,
    ]),
  }),
]).description('Background color');

export const colorPropType = PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.shape({ dark: PropTypes.string, light: PropTypes.string }),
]);

const MARGIN_SIZES = [
  'xxsmall',
  'xsmall',
  'small',
  'medium',
  'large',
  'xlarge',
];

export const genericProps = {
  a11yTitle: a11yTitlePropType,
  alignSelf: PropTypes.oneOf(['start', 'center', 'end', 'stretch'])
    .description(`How to align along the cross axis when contained in
      a Box or along the column axis when contained in a Grid.`),
  gridArea: PropTypes.string.description(`The name of the area to place
    this inside a parent Grid.`),
  margin: PropTypes.oneOfType([
    PropTypes.oneOf(['none', ...MARGIN_SIZES]),
    PropTypes.shape({
      bottom: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
      horizontal: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
      left: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
      right: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
      top: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
      vertical: PropTypes.oneOfType([
        PropTypes.oneOf(MARGIN_SIZES),
        PropTypes.string,
      ]),
    }),
    PropTypes.string,
  ]).description(`The amount of margin around the component. An object can
      be specified to distinguish horizontal margin, vertical margin, and
      margin on a particular side.`),
};