@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.
- package/CHANGELOG.md +556 -0
- package/build/Avatar/Avatar.js +69 -21
- package/build/Avatar/Avatar.test.js +15 -8
- package/build/Avatar/AvatarContent/AvatarContent.js +61 -21
- package/build/Avatar/AvatarContent/AvatarContent.test.js +4 -18
- package/build/Avatar/AvatarContent/__snapshots__/AvatarContent.test.js.snap +75 -15
- package/build/Avatar/AvatarContent/styles.js +88 -21
- package/build/Avatar/__snapshots__/Avatar.test.js.snap +11 -2
- package/build/Avatar/styles.js +18 -7
- package/build/Banner/Banner.js +30 -40
- package/build/Banner/Banner.test.js +64 -17
- package/build/Banner/__snapshots__/Banner.test.js.snap +0 -28
- package/build/Banner/index.js +1 -6
- package/build/Button/Button.js +1 -1
- package/build/Button/Button.test.js +0 -11
- package/build/Button/__snapshots__/Button.test.js.snap +63 -67
- package/build/Button/styles.js +42 -75
- package/build/Checkbox/Checkbox.js +48 -3
- package/build/Checkbox/__snapshots__/Checkbox.test.js.snap +81 -49
- package/build/Checkbox/styles.js +91 -48
- package/build/Drawer/Drawer.js +40 -0
- package/build/{Header/Nav/Nav.js → Drawer/index.js} +54 -39
- package/build/Drawer/index.test.js +52 -0
- package/build/Drawer/styles.js +61 -0
- package/build/Droplist/__snapshots__/Droplist.test.js.snap +5 -5
- package/build/Fab/__snapshots__/Fab.test.js.snap +2 -2
- package/build/Footer/Footer.js +81 -87
- package/build/Footer/List/List.js +89 -124
- package/build/Footer/List/styles.js +85 -31
- package/build/Footer/__snapshots__/Footer.test.js.snap +109 -59
- package/build/Footer/styles.js +116 -51
- package/build/Grid/Col/__snapshots__/Col.test.js.snap +16 -2
- package/build/Grid/Col/styles.js +12 -6
- package/build/Grid/Row/__snapshots__/Row.test.js.snap +18 -2
- package/build/Grid/Row/styles.js +15 -5
- package/build/Grid/styles.js +26 -9
- package/build/Menu/Menu.js +96 -0
- package/build/Menu/index.js +34 -0
- package/build/Menu/styles.js +25 -0
- package/build/MenuDivider/MenuDivider.js +47 -0
- package/build/MenuDivider/index.js +18 -0
- package/build/MenuDivider/styles.js +21 -0
- package/build/MenuItem/MenuItem.js +160 -0
- package/build/{Header/Menu → MenuItem}/index.js +2 -2
- package/build/MenuItem/styles.js +25 -0
- package/build/MenuItemBase/MenuItemBase.js +94 -0
- package/build/MenuItemBase/index.js +18 -0
- package/build/MenuItemBase/styles.js +57 -0
- package/build/MenuList/MenuList.js +71 -0
- package/build/{Header → MenuList}/index.js +2 -2
- package/build/MenuList/styles.js +54 -0
- package/build/MenuUser/MenuUser.js +152 -0
- package/build/MenuUser/index.js +18 -0
- package/build/MenuUser/styles.js +22 -0
- package/build/Modal/Modal.js +94 -66
- package/build/Modal/Modal.test.js +14 -7
- package/build/Modal/__snapshots__/Modal.test.js.snap +155 -100
- package/build/Modal/styles.js +165 -143
- package/build/NavAside/NavAside.js +54 -113
- package/build/NavAside/NavAside.test.js +0 -57
- package/build/NavAside/__snapshots__/NavAside.test.js.snap +35 -43
- package/build/NavAside/index.js +6 -0
- package/build/NavAside/styles.js +45 -63
- package/build/NavAvatarButton/NavAvatarButton.js +134 -0
- package/build/{NavIcon → NavAvatarButton}/index.js +2 -2
- package/build/NavAvatarButton/styles.js +33 -0
- package/build/NavButton/NavButton.js +73 -0
- package/build/{Header/Nav → NavButton}/index.js +2 -2
- package/build/NavButton/styles.js +79 -0
- package/build/NavItem/styles.js +4 -4
- package/build/NavTab/NavTab.js +45 -32
- package/build/NavTab/styles.js +59 -27
- package/build/NavTop/styles.js +6 -6
- package/build/OrderBy/OrderBy.js +2 -1
- package/build/Pager/Page/Page.js +11 -6
- package/build/Pager/Page/Page.test.js +13 -9
- package/build/Pager/Page/__snapshots__/Page.test.js.snap +34 -10
- package/build/Pager/Page/styles.js +48 -14
- package/build/Pager/Pager.js +144 -235
- package/build/Pager/Pager.test.js +81 -36
- package/build/Pager/__snapshots__/Pager.test.js.snap +3 -36
- package/build/Pager/styles.js +5 -40
- package/build/Pill/Choice/Choice.js +6 -4
- package/build/Pill/Choice/styles.js +13 -10
- package/build/Pill/Group/styles.js +5 -5
- package/build/Pill/Stack/Stack.js +2 -2
- package/build/Pill/Stack/styles.js +5 -8
- package/build/Placeholder/Placeholder.js +29 -12
- package/build/Placeholder/Placeholder.test.js +4 -4
- package/build/Placeholder/__snapshots__/Placeholder.test.js.snap +81 -38
- package/build/Placeholder/styles.js +86 -42
- package/build/Provider/MenuListProvider.js +38 -0
- package/build/Provider/usePrevious.js +1 -1
- package/build/Radio/Radio.js +22 -7
- package/build/Radio/__snapshots__/Radio.test.js.snap +71 -79
- package/build/Radio/styles.js +84 -85
- package/build/SlideDown/SlideDown.js +167 -169
- package/build/SlideDown/SlideDown.test.js +49 -44
- package/build/SlideDown/__snapshots__/SlideDown.test.js.snap +44 -15
- package/build/SlideDown/styles.js +51 -20
- package/build/SlideToggle/SlideToggle.js +38 -6
- package/build/SlideToggle/SlideToggle.test.js +2 -2
- package/build/SlideToggle/__snapshots__/SlideToggle.test.js.snap +53 -38
- package/build/SlideToggle/styles.js +64 -45
- package/build/Tabs/Tab/Tab.js +73 -0
- package/build/Tabs/Tab/index.js +34 -0
- package/build/Tabs/Tab/index.test.js +132 -0
- package/build/Tabs/Tab/styles.js +74 -0
- package/build/Tabs/TabContent/TabContent.js +76 -0
- package/build/Tabs/TabContent/index.js +34 -0
- package/build/Tabs/TabContent/index.test.js +68 -0
- package/build/Tabs/TabContent/styles.js +23 -0
- package/build/Tabs/TabIndicator/TabIndicator.js +158 -0
- package/build/Tabs/TabIndicator/index.js +34 -0
- package/build/Tabs/TabIndicator/styles.js +24 -0
- package/build/Tabs/TabList/TabList.js +108 -0
- package/build/Tabs/TabList/index.js +34 -0
- package/build/{Pager/Break → Tabs/TabList}/styles.js +3 -2
- package/build/Tabs/Tabs.js +74 -0
- package/build/Tabs/context.js +94 -0
- package/build/Tabs/index.js +34 -0
- package/build/Tabs/index.test.js +157 -0
- package/build/Tabs/styles.js +19 -0
- package/build/Tag/Tag.js +2 -2
- package/build/Tag/__snapshots__/Tag.test.js.snap +40 -43
- package/build/Tag/styles.js +76 -82
- package/build/Text/Text.js +2 -1
- package/build/TextField/TextField.js +7 -6
- package/build/TextField/__snapshots__/TextField.test.js.snap +3 -0
- package/build/TextField/styles.js +3 -0
- package/build/Tip/Tip.js +62 -95
- package/build/Tip/Tip.test.js +29 -6
- package/build/Tip/TipText/index.js +32 -0
- package/build/Tip/__snapshots__/Tip.test.js.snap +127 -15
- package/build/Tip/styles.js +125 -31
- package/build/Toaster/Toast/Toast.js +76 -64
- package/build/Toaster/Toast/styles.js +118 -46
- package/build/Toaster/Toaster.js +3 -2
- package/build/Toaster/Toaster.test.js +5 -2
- package/build/Toaster/__snapshots__/Toaster.test.js.snap +1 -1
- package/build/Toaster/functions.js +4 -0
- package/build/Toaster/styles.js +3 -3
- package/build/Tooltip/Tooltip.js +73 -22
- package/build/Tooltip/__snapshots__/Tooltip.test.js.snap +22 -6
- package/build/Tooltip/styles.js +32 -10
- package/build/index.js +33 -19
- package/build/plugin/babel.js +0 -2
- package/build/subatomic/grid.js +5 -5
- package/build/tokens/colors.json +94 -60
- package/build/tokens/index.js +12 -31
- package/build/tokens/shadows.json +3 -3
- package/package.json +5 -2
- package/build/Banner/styles.js +0 -41
- package/build/Header/Header.js +0 -163
- package/build/Header/Header.test.js +0 -118
- package/build/Header/Menu/Menu.js +0 -135
- package/build/Header/Menu/Menu.test.js +0 -107
- package/build/Header/Menu/__snapshots__/Menu.test.js.snap +0 -113
- package/build/Header/Menu/styles.js +0 -123
- package/build/Header/Nav/Nav.test.js +0 -81
- package/build/Header/Nav/__snapshots__/Nav.test.js.snap +0 -101
- package/build/Header/Nav/styles.js +0 -110
- package/build/Header/__snapshots__/Header.test.js.snap +0 -79
- package/build/Header/styles.js +0 -94
- package/build/NavIcon/NavIcon.js +0 -112
- package/build/NavIcon/styles.js +0 -81
- package/build/Pager/Break/Break.js +0 -27
- package/build/Pager/Break/Break.test.js +0 -53
- package/build/Pager/Break/__snapshots__/Break.test.js.snap +0 -13
- package/build/Pager/Break/index.js +0 -18
- /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
|
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"])(
|
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
|
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"])(
|
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;
|