@occmundial/occ-atomic 3.0.0-beta.7 → 3.0.0-beta.70

Sign up to get free protection for your applications and to get access to all the features.
Files changed (170) hide show
  1. package/CHANGELOG.md +549 -0
  2. package/build/Avatar/Avatar.js +69 -21
  3. package/build/Avatar/Avatar.test.js +15 -8
  4. package/build/Avatar/AvatarContent/AvatarContent.js +61 -21
  5. package/build/Avatar/AvatarContent/AvatarContent.test.js +4 -18
  6. package/build/Avatar/AvatarContent/__snapshots__/AvatarContent.test.js.snap +75 -15
  7. package/build/Avatar/AvatarContent/styles.js +88 -21
  8. package/build/Avatar/__snapshots__/Avatar.test.js.snap +11 -2
  9. package/build/Avatar/styles.js +18 -7
  10. package/build/Banner/Banner.js +30 -40
  11. package/build/Banner/Banner.test.js +64 -17
  12. package/build/Banner/__snapshots__/Banner.test.js.snap +0 -28
  13. package/build/Banner/index.js +1 -6
  14. package/build/Button/Button.js +1 -1
  15. package/build/Button/Button.test.js +0 -11
  16. package/build/Button/__snapshots__/Button.test.js.snap +63 -67
  17. package/build/Button/styles.js +42 -75
  18. package/build/Checkbox/Checkbox.js +48 -3
  19. package/build/Checkbox/__snapshots__/Checkbox.test.js.snap +81 -49
  20. package/build/Checkbox/styles.js +91 -48
  21. package/build/Drawer/Drawer.js +40 -0
  22. package/build/{Header/Nav/Nav.js → Drawer/index.js} +54 -39
  23. package/build/Drawer/index.test.js +52 -0
  24. package/build/Drawer/styles.js +61 -0
  25. package/build/Droplist/__snapshots__/Droplist.test.js.snap +5 -5
  26. package/build/Fab/__snapshots__/Fab.test.js.snap +2 -2
  27. package/build/Footer/Footer.js +81 -87
  28. package/build/Footer/List/List.js +89 -124
  29. package/build/Footer/List/styles.js +85 -31
  30. package/build/Footer/__snapshots__/Footer.test.js.snap +109 -59
  31. package/build/Footer/styles.js +116 -51
  32. package/build/Grid/Col/__snapshots__/Col.test.js.snap +16 -2
  33. package/build/Grid/Col/styles.js +12 -6
  34. package/build/Grid/Row/__snapshots__/Row.test.js.snap +18 -2
  35. package/build/Grid/Row/styles.js +15 -5
  36. package/build/Grid/styles.js +26 -9
  37. package/build/Menu/Menu.js +96 -0
  38. package/build/Menu/index.js +34 -0
  39. package/build/Menu/styles.js +25 -0
  40. package/build/MenuDivider/MenuDivider.js +47 -0
  41. package/build/MenuDivider/index.js +18 -0
  42. package/build/MenuDivider/styles.js +21 -0
  43. package/build/MenuItem/MenuItem.js +160 -0
  44. package/build/{Header/Menu → MenuItem}/index.js +2 -2
  45. package/build/MenuItem/styles.js +25 -0
  46. package/build/MenuItemBase/MenuItemBase.js +94 -0
  47. package/build/MenuItemBase/index.js +18 -0
  48. package/build/MenuItemBase/styles.js +57 -0
  49. package/build/MenuList/MenuList.js +71 -0
  50. package/build/{Header → MenuList}/index.js +2 -2
  51. package/build/MenuList/styles.js +54 -0
  52. package/build/MenuUser/MenuUser.js +152 -0
  53. package/build/MenuUser/index.js +18 -0
  54. package/build/MenuUser/styles.js +22 -0
  55. package/build/Modal/Modal.js +94 -66
  56. package/build/Modal/Modal.test.js +14 -7
  57. package/build/Modal/__snapshots__/Modal.test.js.snap +155 -100
  58. package/build/Modal/styles.js +165 -143
  59. package/build/NavAside/NavAside.js +54 -113
  60. package/build/NavAside/NavAside.test.js +0 -57
  61. package/build/NavAside/__snapshots__/NavAside.test.js.snap +35 -43
  62. package/build/NavAside/index.js +6 -0
  63. package/build/NavAside/styles.js +45 -63
  64. package/build/NavAvatarButton/NavAvatarButton.js +134 -0
  65. package/build/{NavIcon → NavAvatarButton}/index.js +2 -2
  66. package/build/NavAvatarButton/styles.js +33 -0
  67. package/build/NavButton/NavButton.js +73 -0
  68. package/build/{Header/Nav → NavButton}/index.js +2 -2
  69. package/build/NavButton/styles.js +79 -0
  70. package/build/NavItem/styles.js +4 -4
  71. package/build/NavTab/NavTab.js +45 -32
  72. package/build/NavTab/styles.js +59 -27
  73. package/build/NavTop/styles.js +6 -6
  74. package/build/OrderBy/OrderBy.js +2 -1
  75. package/build/Pager/Page/Page.js +11 -6
  76. package/build/Pager/Page/Page.test.js +13 -9
  77. package/build/Pager/Page/__snapshots__/Page.test.js.snap +34 -10
  78. package/build/Pager/Page/styles.js +48 -14
  79. package/build/Pager/Pager.js +144 -235
  80. package/build/Pager/Pager.test.js +81 -36
  81. package/build/Pager/__snapshots__/Pager.test.js.snap +3 -36
  82. package/build/Pager/styles.js +5 -40
  83. package/build/Pill/Choice/Choice.js +6 -4
  84. package/build/Pill/Choice/styles.js +13 -10
  85. package/build/Pill/Group/styles.js +5 -5
  86. package/build/Pill/Stack/Stack.js +2 -2
  87. package/build/Pill/Stack/styles.js +5 -8
  88. package/build/Placeholder/Placeholder.js +29 -12
  89. package/build/Placeholder/Placeholder.test.js +4 -4
  90. package/build/Placeholder/__snapshots__/Placeholder.test.js.snap +81 -38
  91. package/build/Placeholder/styles.js +86 -42
  92. package/build/Provider/MenuListProvider.js +38 -0
  93. package/build/Provider/usePrevious.js +1 -1
  94. package/build/Radio/Radio.js +22 -7
  95. package/build/Radio/__snapshots__/Radio.test.js.snap +71 -79
  96. package/build/Radio/styles.js +84 -85
  97. package/build/SlideDown/SlideDown.js +167 -169
  98. package/build/SlideDown/SlideDown.test.js +49 -44
  99. package/build/SlideDown/__snapshots__/SlideDown.test.js.snap +44 -15
  100. package/build/SlideDown/styles.js +51 -20
  101. package/build/SlideToggle/SlideToggle.js +38 -6
  102. package/build/SlideToggle/SlideToggle.test.js +2 -2
  103. package/build/SlideToggle/__snapshots__/SlideToggle.test.js.snap +53 -38
  104. package/build/SlideToggle/styles.js +64 -45
  105. package/build/Tabs/Tab/Tab.js +73 -0
  106. package/build/Tabs/Tab/index.js +34 -0
  107. package/build/Tabs/Tab/index.test.js +132 -0
  108. package/build/Tabs/Tab/styles.js +74 -0
  109. package/build/Tabs/TabContent/TabContent.js +76 -0
  110. package/build/Tabs/TabContent/index.js +34 -0
  111. package/build/Tabs/TabContent/index.test.js +68 -0
  112. package/build/Tabs/TabContent/styles.js +23 -0
  113. package/build/Tabs/TabIndicator/TabIndicator.js +158 -0
  114. package/build/Tabs/TabIndicator/index.js +34 -0
  115. package/build/Tabs/TabIndicator/styles.js +24 -0
  116. package/build/Tabs/TabList/TabList.js +108 -0
  117. package/build/Tabs/TabList/index.js +34 -0
  118. package/build/{Pager/Break → Tabs/TabList}/styles.js +3 -2
  119. package/build/Tabs/Tabs.js +74 -0
  120. package/build/Tabs/context.js +94 -0
  121. package/build/Tabs/index.js +34 -0
  122. package/build/Tabs/index.test.js +157 -0
  123. package/build/Tabs/styles.js +19 -0
  124. package/build/Tag/Tag.js +2 -2
  125. package/build/Tag/__snapshots__/Tag.test.js.snap +40 -43
  126. package/build/Tag/styles.js +76 -82
  127. package/build/Text/Text.js +2 -1
  128. package/build/TextField/TextField.js +7 -6
  129. package/build/TextField/__snapshots__/TextField.test.js.snap +3 -0
  130. package/build/TextField/styles.js +3 -0
  131. package/build/Tip/Tip.js +62 -95
  132. package/build/Tip/Tip.test.js +29 -6
  133. package/build/Tip/TipText/index.js +32 -0
  134. package/build/Tip/__snapshots__/Tip.test.js.snap +127 -15
  135. package/build/Tip/styles.js +125 -31
  136. package/build/Toaster/Toast/Toast.js +76 -64
  137. package/build/Toaster/Toast/styles.js +118 -46
  138. package/build/Toaster/Toaster.js +3 -2
  139. package/build/Toaster/Toaster.test.js +5 -2
  140. package/build/Toaster/__snapshots__/Toaster.test.js.snap +1 -1
  141. package/build/Toaster/functions.js +4 -0
  142. package/build/Toaster/styles.js +3 -3
  143. package/build/Tooltip/Tooltip.js +73 -22
  144. package/build/Tooltip/__snapshots__/Tooltip.test.js.snap +22 -6
  145. package/build/Tooltip/styles.js +32 -10
  146. package/build/index.js +33 -19
  147. package/build/plugin/babel.js +0 -2
  148. package/build/subatomic/grid.js +5 -5
  149. package/build/tokens/colors.json +94 -60
  150. package/build/tokens/shadows.json +3 -3
  151. package/package.json +5 -2
  152. package/build/Banner/styles.js +0 -41
  153. package/build/Header/Header.js +0 -163
  154. package/build/Header/Header.test.js +0 -118
  155. package/build/Header/Menu/Menu.js +0 -135
  156. package/build/Header/Menu/Menu.test.js +0 -107
  157. package/build/Header/Menu/__snapshots__/Menu.test.js.snap +0 -113
  158. package/build/Header/Menu/styles.js +0 -123
  159. package/build/Header/Nav/Nav.test.js +0 -81
  160. package/build/Header/Nav/__snapshots__/Nav.test.js.snap +0 -101
  161. package/build/Header/Nav/styles.js +0 -110
  162. package/build/Header/__snapshots__/Header.test.js.snap +0 -79
  163. package/build/Header/styles.js +0 -94
  164. package/build/NavIcon/NavIcon.js +0 -112
  165. package/build/NavIcon/styles.js +0 -81
  166. package/build/Pager/Break/Break.js +0 -27
  167. package/build/Pager/Break/Break.test.js +0 -53
  168. package/build/Pager/Break/__snapshots__/Break.test.js.snap +0 -13
  169. package/build/Pager/Break/index.js +0 -18
  170. /package/build/Button/{Loading.js → Loading/index.js} +0 -0
@@ -0,0 +1,160 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+
12
+ var _MenuItemBase = _interopRequireDefault(require("../MenuItemBase"));
13
+
14
+ var _Icon = _interopRequireDefault(require("../Icon"));
15
+
16
+ var _Text = _interopRequireDefault(require("../Text"));
17
+
18
+ var _idx = _interopRequireDefault(require("idx"));
19
+
20
+ var _colors = _interopRequireDefault(require("../tokens/colors.json"));
21
+
22
+ var _MenuListProvider = require("../Provider/MenuListProvider");
23
+
24
+ var _excluded = ["classes", "disableText", "className", "textProps", "iconRightProps", "iconLeftProps", "dense", "children", "style", "component"];
25
+
26
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
27
+
28
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
+
30
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
31
+
32
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
33
+
34
+ /** MenuItem component with left and right icons. */
35
+ function MenuItem(_ref, ref) {
36
+ var classes = _ref.classes,
37
+ _ref$disableText = _ref.disableText,
38
+ disableText = _ref$disableText === void 0 ? false : _ref$disableText,
39
+ className = _ref.className,
40
+ textProps = _ref.textProps,
41
+ iconRightProps = _ref.iconRightProps,
42
+ iconLeftProps = _ref.iconLeftProps,
43
+ dense = _ref.dense,
44
+ children = _ref.children,
45
+ style = _ref.style,
46
+ _ref$component = _ref.component,
47
+ component = _ref$component === void 0 ? 'div' : _ref$component,
48
+ menuItemprops = _objectWithoutProperties(_ref, _excluded);
49
+
50
+ var listContext = (0, _MenuListProvider.useMenuListContext)();
51
+ var isDense = typeof dense === 'undefined' ? listContext.dense : dense;
52
+ var leftIconContainerClasses = classes.iconContainer;
53
+ leftIconContainerClasses += (0, _idx["default"])(className, function (_) {
54
+ return _.iconLeftContainer;
55
+ }) ? " ".concat(className.iconLeftContainer) : '';
56
+ leftIconContainerClasses += isDense ? " ".concat(classes.iconContainerSizeDense) : " ".concat(classes.iconContainerSize);
57
+ var textContainerClasses = classes.textContainer;
58
+ textContainerClasses += (0, _idx["default"])(className, function (_) {
59
+ return _.textContainer;
60
+ }) ? " ".concat(className.textContainer) : '';
61
+ var rightIconContainerClasses = classes.iconContainer;
62
+ leftIconContainerClasses += (0, _idx["default"])(className, function (_) {
63
+ return _.iconRightContainer;
64
+ }) ? " ".concat(className.iconRightContainer) : '';
65
+ rightIconContainerClasses += " ".concat(classes.iconRight);
66
+ rightIconContainerClasses += isDense ? " ".concat(classes.iconContainerSizeDense) : " ".concat(classes.iconContainerSize);
67
+ return /*#__PURE__*/_react["default"].createElement(_MenuItemBase["default"], _extends({
68
+ className: (0, _idx["default"])(className, function (_) {
69
+ return _.root;
70
+ }),
71
+ dense: isDense,
72
+ component: component,
73
+ ref: ref,
74
+ style: style && style.root
75
+ }, menuItemprops), (0, _idx["default"])(iconLeftProps, function (_) {
76
+ return _.iconName;
77
+ }) && /*#__PURE__*/_react["default"].createElement("div", {
78
+ className: leftIconContainerClasses,
79
+ style: style && style.iconLeftContainer
80
+ }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], _extends({
81
+ width: 16,
82
+ height: 16,
83
+ colors: [_colors["default"].icon["default"].bold]
84
+ }, iconLeftProps))), /*#__PURE__*/_react["default"].createElement("div", {
85
+ className: textContainerClasses,
86
+ style: style && style.textContainer
87
+ }, disableText ? children : /*#__PURE__*/_react["default"].createElement(_Text["default"], _extends({
88
+ bodyRegularStrong: !isDense,
89
+ bodySmallStrong: isDense,
90
+ tag: "span"
91
+ }, textProps), children)), (0, _idx["default"])(iconRightProps, function (_) {
92
+ return _.iconName;
93
+ }) && /*#__PURE__*/_react["default"].createElement("div", {
94
+ className: rightIconContainerClasses,
95
+ style: style && style.iconLeftContainer
96
+ }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], _extends({
97
+ width: 16,
98
+ height: 16,
99
+ colors: [_colors["default"].icon["default"]["default"]]
100
+ }, iconRightProps))));
101
+ }
102
+
103
+ var _default = /*#__PURE__*/_react["default"].forwardRef(MenuItem);
104
+
105
+ exports["default"] = _default;
106
+ MenuItem.propTypes = {
107
+ classes: _propTypes["default"].object,
108
+
109
+ /** Defines the align-items style property. */
110
+ alignItems: _propTypes["default"].oneOf(['center', 'start']),
111
+
112
+ /** Adds classes to the root, text, iconRight, iconLeft containers. */
113
+ className: _propTypes["default"].exact({
114
+ root: _propTypes["default"].string,
115
+ textContainer: _propTypes["default"].string,
116
+ iconRightContainer: _propTypes["default"].string,
117
+ iconLeftContainer: _propTypes["default"].string
118
+ }),
119
+
120
+ /** Adds styles to the root, text, iconRight, iconLeft containers. */
121
+ style: _propTypes["default"].exact({
122
+ root: _propTypes["default"].object,
123
+ textContainer: _propTypes["default"].object,
124
+ iconRightContainer: _propTypes["default"].object,
125
+ iconLeftContainer: _propTypes["default"].object
126
+ }),
127
+
128
+ /** Use to remove hover, focus and active stylings. */
129
+ nonActivatable: _propTypes["default"].bool,
130
+
131
+ /** If true, compact vertical padding designed for keyboard and mouse input is used. The prop defaults to the value inherited from the parent List component. */
132
+ dense: _propTypes["default"].bool,
133
+
134
+ /** If true, compact vertical padding designed for keyboard and mouse input is used. The prop defaults to the value inherited from the parent List component. */
135
+ disablePadding: _propTypes["default"].bool,
136
+
137
+ /** If true, the left and right padding is removed. */
138
+ disableGutters: _propTypes["default"].bool,
139
+
140
+ /** The content of the component. */
141
+ children: _propTypes["default"].node,
142
+
143
+ /** The component used for the root node. Either a string to use a HTML element or a component. */
144
+ selected: _propTypes["default"].bool,
145
+
146
+ /** If true, the children won't be wrapped by a Text component. This can be useful to render an alternative Text variant by wrapping the children text. */
147
+ component: _propTypes["default"].elementType,
148
+
149
+ /** If true, the children won't be wrapped by a Text component. This can be useful to render an alternative Text variant by wrapping the children text. */
150
+ disableText: _propTypes["default"].bool,
151
+
152
+ /**These props will be forwarded to the primary typography component (as long as disableText is not true). */
153
+ textProps: _propTypes["default"].object,
154
+
155
+ /** These props will be forwarded to the Icon component. */
156
+ iconRightProps: _propTypes["default"].object,
157
+
158
+ /** These props will be forwarded to the Icon component. */
159
+ iconLeftProps: _propTypes["default"].object
160
+ };
@@ -7,12 +7,12 @@ exports["default"] = void 0;
7
7
 
8
8
  var _reactJss = _interopRequireDefault(require("react-jss"));
9
9
 
10
- var _Menu = _interopRequireDefault(require("./Menu"));
10
+ var _MenuItem = _interopRequireDefault(require("./MenuItem"));
11
11
 
12
12
  var _styles = _interopRequireDefault(require("./styles"));
13
13
 
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
15
 
16
- var _default = (0, _reactJss["default"])(_styles["default"])(_Menu["default"]);
16
+ var _default = (0, _reactJss["default"])(_styles["default"])(_MenuItem["default"]);
17
17
 
18
18
  exports["default"] = _default;
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+ var _default = {
8
+ iconContainer: {
9
+ flexShrink: 0,
10
+ display: 'inline-flex'
11
+ },
12
+ iconRight: {
13
+ justifyContent: 'end'
14
+ },
15
+ iconContainerSize: {
16
+ minWidth: 28
17
+ },
18
+ iconContainerSizeDense: {
19
+ minWidth: 24
20
+ },
21
+ textContainer: {
22
+ flex: '1 1 auto'
23
+ }
24
+ };
25
+ exports["default"] = _default;
@@ -0,0 +1,94 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+
10
+ var _react = _interopRequireDefault(require("react"));
11
+
12
+ var _excluded = ["classes", "alignItems", "className", "nonActivatable", "dense", "disablePadding", "disableGutters", "children", "selected", "component"];
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
+
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
17
+
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
19
+
20
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
21
+
22
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
23
+
24
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
25
+
26
+ function MenuItemBase(_ref, ref) {
27
+ var classes = _ref.classes,
28
+ _ref$alignItems = _ref.alignItems,
29
+ alignItems = _ref$alignItems === void 0 ? 'center' : _ref$alignItems,
30
+ className = _ref.className,
31
+ nonActivatable = _ref.nonActivatable,
32
+ dense = _ref.dense,
33
+ _ref$disablePadding = _ref.disablePadding,
34
+ disablePadding = _ref$disablePadding === void 0 ? false : _ref$disablePadding,
35
+ _ref$disableGutters = _ref.disableGutters,
36
+ disableGutters = _ref$disableGutters === void 0 ? false : _ref$disableGutters,
37
+ children = _ref.children,
38
+ _ref$selected = _ref.selected,
39
+ selected = _ref$selected === void 0 ? false : _ref$selected,
40
+ _ref$component = _ref.component,
41
+ component = _ref$component === void 0 ? 'div' : _ref$component,
42
+ props = _objectWithoutProperties(_ref, _excluded);
43
+
44
+ var classNames = classes.root;
45
+ classNames += className ? " ".concat(className) : '';
46
+ classNames += !disablePadding ? dense ? " ".concat(classes.paddingVerticalDense) : " ".concat(classes.paddingVertical) : '';
47
+ classNames += !disablePadding && !disableGutters ? " ".concat(classes.paddingHorizontal) : '';
48
+ classNames += alignItems === 'center' ? " ".concat(classes.alignItemsCenter) : " ".concat(classes.alignItemsStart);
49
+ classNames += component === 'a' ? " ".concat(classes.containerAnchor) : '';
50
+ classNames += selected ? " ".concat(classes.selected) : '';
51
+ classNames += !nonActivatable ? " ".concat(classes.activatable) : '';
52
+ return /*#__PURE__*/_react["default"].createElement(component, _objectSpread({
53
+ ref: ref,
54
+ className: classNames,
55
+ tabIndex: '0'
56
+ }, props), children);
57
+ }
58
+
59
+ var _default = /*#__PURE__*/_react["default"].forwardRef(MenuItemBase);
60
+
61
+ exports["default"] = _default;
62
+ MenuItemBase.propTypes = {
63
+ classes: _propTypes["default"].object,
64
+
65
+ /** Defines the align-items style property. */
66
+ alignItems: _propTypes["default"].oneOf(['center', 'start']),
67
+
68
+ /** Adds classes to the root container. */
69
+ className: _propTypes["default"].string,
70
+
71
+ /** Adds styles to the root container. */
72
+ style: _propTypes["default"].object,
73
+
74
+ /** Use to remove hover, focus and active stylings. */
75
+ nonActivatable: _propTypes["default"].bool,
76
+
77
+ /** If true, compact vertical padding designed for keyboard and mouse input is used. The prop defaults to the value inherited from the parent List component. */
78
+ dense: _propTypes["default"].bool,
79
+
80
+ /** If true, compact vertical padding designed for keyboard and mouse input is used. The prop defaults to the value inherited from the parent List component. */
81
+ disablePadding: _propTypes["default"].bool,
82
+
83
+ /** If true, the left and right padding is removed. */
84
+ disableGutters: _propTypes["default"].bool,
85
+
86
+ /** The content of the component. */
87
+ children: _propTypes["default"].node,
88
+
89
+ /** The component used for the root node. Either a string to use a HTML element or a component. */
90
+ selected: _propTypes["default"].bool,
91
+
92
+ /** If true, the children won't be wrapped by a Text component. This can be useful to render an alternative Text variant by wrapping the children text. */
93
+ component: _propTypes["default"].elementType
94
+ };
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _reactJss = _interopRequireDefault(require("react-jss"));
9
+
10
+ var _MenuItemBase = _interopRequireDefault(require("./MenuItemBase"));
11
+
12
+ var _styles = _interopRequireDefault(require("./styles"));
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
+
16
+ var _default = (0, _reactJss["default"])(_styles["default"])(_MenuItemBase["default"]);
17
+
18
+ exports["default"] = _default;
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _spacing = _interopRequireDefault(require("../tokens/spacing.json"));
9
+
10
+ var _borderRadius = _interopRequireDefault(require("../tokens/borderRadius.json"));
11
+
12
+ var _colors = _interopRequireDefault(require("../tokens/colors.json"));
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
+
16
+ var _default = {
17
+ root: {
18
+ listStyleType: 'none',
19
+ display: 'flex',
20
+ justifyContent: 'flex-start',
21
+ borderRadius: _borderRadius["default"]['br-xs']
22
+ },
23
+ paddingVertical: {
24
+ paddingTop: _spacing["default"]['size-4'],
25
+ paddingBottom: _spacing["default"]['size-4']
26
+ },
27
+ paddingVerticalDense: {
28
+ paddingTop: _spacing["default"]['size-3'],
29
+ paddingBottom: _spacing["default"]['size-3']
30
+ },
31
+ paddingHorizontal: {
32
+ paddingRight: _spacing["default"]['size-3'],
33
+ paddingLeft: _spacing["default"]['size-3']
34
+ },
35
+ alignItemsCenter: {
36
+ alignItems: 'center'
37
+ },
38
+ alignItemsStart: {
39
+ alignItems: 'start'
40
+ },
41
+ containerAnchor: {
42
+ textDecoration: 'none'
43
+ },
44
+ activatable: {
45
+ '&:hover, &:focus': {
46
+ background: _colors["default"].bg.action.tertiary.hover,
47
+ outline: 'none'
48
+ },
49
+ '&:active': {
50
+ background: _colors["default"].bg.action.tertiary.active
51
+ }
52
+ },
53
+ selected: {
54
+ background: _colors["default"].bg.action.tertiary.active
55
+ }
56
+ };
57
+ exports["default"] = _default;
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+
12
+ var _MenuListProvider = _interopRequireDefault(require("../Provider/MenuListProvider"));
13
+
14
+ var _excluded = ["classes", "children", "className", "component", "padding", "dense"];
15
+
16
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
+
18
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
19
+
20
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
21
+
22
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
23
+
24
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
25
+
26
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
27
+
28
+ /** MenuList wrapper component. */
29
+ function MenuList(_ref, ref) {
30
+ var classes = _ref.classes,
31
+ children = _ref.children,
32
+ className = _ref.className,
33
+ _ref$component = _ref.component,
34
+ component = _ref$component === void 0 ? 'menu' : _ref$component,
35
+ _ref$padding = _ref.padding,
36
+ padding = _ref$padding === void 0 ? 'size-2' : _ref$padding,
37
+ dense = _ref.dense,
38
+ props = _objectWithoutProperties(_ref, _excluded);
39
+
40
+ var containerClasses = classes.container;
41
+ containerClasses += padding ? " ".concat(classes[padding]) : '';
42
+ containerClasses += className ? " ".concat(className) : '';
43
+ return /*#__PURE__*/_react["default"].createElement(_MenuListProvider["default"], {
44
+ dense: dense
45
+ }, /*#__PURE__*/_react["default"].createElement(component, _objectSpread({
46
+ className: containerClasses,
47
+ ref: ref
48
+ }, props), children));
49
+ }
50
+
51
+ var _default = /*#__PURE__*/_react["default"].forwardRef(MenuList);
52
+
53
+ exports["default"] = _default;
54
+ MenuList.propTypes = {
55
+ classes: _propTypes["default"].object,
56
+
57
+ /** The content of the component. */
58
+ children: _propTypes["default"].node,
59
+
60
+ /** Adds classes to the root container. */
61
+ className: _propTypes["default"].string,
62
+
63
+ /** Adds or removes padding to the root container. */
64
+ padding: _propTypes["default"].oneOf([false, "size-4", "size-3", "size-0", "size-1", "size-2", "size-5", "size-6", "size-7", "size-8", "size-9", "size-10", "size-11", "size-12", "base-value"]),
65
+
66
+ /** If true, compact vertical padding designed for keyboard and mouse input is used for the list and list items. The prop is available to descendant components as the dense context. */
67
+ dense: _propTypes["default"].bool,
68
+
69
+ /** The component used for the root node. Either a string to use a HTML element or a component. */
70
+ component: _propTypes["default"].elementType
71
+ };
@@ -7,12 +7,12 @@ exports["default"] = void 0;
7
7
 
8
8
  var _reactJss = _interopRequireDefault(require("react-jss"));
9
9
 
10
- var _Header = _interopRequireDefault(require("./Header"));
10
+ var _MenuList = _interopRequireDefault(require("./MenuList"));
11
11
 
12
12
  var _styles = _interopRequireDefault(require("./styles"));
13
13
 
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
15
 
16
- var _default = (0, _reactJss["default"])(_styles["default"])(_Header["default"]);
16
+ var _default = (0, _reactJss["default"])(_styles["default"])(_MenuList["default"]);
17
17
 
18
18
  exports["default"] = _default;
@@ -0,0 +1,54 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _spacing = _interopRequireDefault(require("../tokens/spacing.json"));
9
+
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+
12
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
13
+
14
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
15
+
16
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
17
+
18
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
19
+
20
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
21
+
22
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
23
+
24
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
25
+
26
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
27
+
28
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
29
+
30
+ function generateSpacingClasses() {
31
+ var spacingClasses = {};
32
+
33
+ for (var _i = 0, _Object$entries = Object.entries(_spacing["default"]); _i < _Object$entries.length; _i++) {
34
+ var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
35
+ key = _Object$entries$_i[0],
36
+ value = _Object$entries$_i[1];
37
+
38
+ spacingClasses[key] = {
39
+ padding: value
40
+ };
41
+ }
42
+
43
+ return spacingClasses;
44
+ }
45
+
46
+ var _default = _objectSpread({
47
+ container: {
48
+ marginBlock: 0,
49
+ paddingBlock: 0,
50
+ paddingInline: 0
51
+ }
52
+ }, generateSpacingClasses());
53
+
54
+ exports["default"] = _default;