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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (171) hide show
  1. package/CHANGELOG.md +556 -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/index.js +12 -31
  151. package/build/tokens/shadows.json +3 -3
  152. package/package.json +5 -2
  153. package/build/Banner/styles.js +0 -41
  154. package/build/Header/Header.js +0 -163
  155. package/build/Header/Header.test.js +0 -118
  156. package/build/Header/Menu/Menu.js +0 -135
  157. package/build/Header/Menu/Menu.test.js +0 -107
  158. package/build/Header/Menu/__snapshots__/Menu.test.js.snap +0 -113
  159. package/build/Header/Menu/styles.js +0 -123
  160. package/build/Header/Nav/Nav.test.js +0 -81
  161. package/build/Header/Nav/__snapshots__/Nav.test.js.snap +0 -101
  162. package/build/Header/Nav/styles.js +0 -110
  163. package/build/Header/__snapshots__/Header.test.js.snap +0 -79
  164. package/build/Header/styles.js +0 -94
  165. package/build/NavIcon/NavIcon.js +0 -112
  166. package/build/NavIcon/styles.js +0 -81
  167. package/build/Pager/Break/Break.js +0 -27
  168. package/build/Pager/Break/Break.test.js +0 -53
  169. package/build/Pager/Break/__snapshots__/Break.test.js.snap +0 -13
  170. package/build/Pager/Break/index.js +0 -18
  171. /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;