@moda/om 17.3.0 → 17.5.0
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 +14 -0
- package/dist/index.cjs.js +43 -47
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +43 -47
- package/dist/index.esm.js.map +1 -1
- package/dist/src/components/Checkbox/Checkbox.d.ts +1 -0
- package/dist/src/components/Expandable/Expandable.d.ts +2 -0
- package/dist/src/components/Expandable/Expandable.stories.d.ts +1 -0
- package/dist/styles.css +1 -1
- package/package.json +6 -6
- package/src/components/Checkbox/Checkbox.tsx +4 -0
- package/src/components/Expandable/Expandable.scss +42 -21
- package/src/components/Expandable/Expandable.stories.tsx +12 -0
- package/src/components/Expandable/Expandable.tsx +15 -8
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,20 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [17.5.0](https://github.com/ModaOperandi/om/compare/v17.4.0...v17.5.0) (2022-09-30)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* **checkbox:** adds data-test-id by dataTestId prop ([#2942](https://github.com/ModaOperandi/om/issues/2942)) ([ff1aa3e](https://github.com/ModaOperandi/om/commit/ff1aa3eb5c54c21b2fd45b5ebea07598ce0ab9aa))
|
|
12
|
+
|
|
13
|
+
# [17.4.0](https://github.com/ModaOperandi/om/compare/v17.3.0...v17.4.0) (2022-09-27)
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
### Features
|
|
17
|
+
|
|
18
|
+
* **expandable:** dark background ([#2934](https://github.com/ModaOperandi/om/issues/2934)) ([8fb3bf3](https://github.com/ModaOperandi/om/commit/8fb3bf3fab3fccd3cbc53332438771bddca1c801))
|
|
19
|
+
|
|
6
20
|
# [17.3.0](https://github.com/ModaOperandi/om/compare/v17.2.1...v17.3.0) (2022-08-23)
|
|
7
21
|
|
|
8
22
|
|
package/dist/index.cjs.js
CHANGED
|
@@ -1313,14 +1313,15 @@ var classnames = {exports: {}};
|
|
|
1313
1313
|
}
|
|
1314
1314
|
}
|
|
1315
1315
|
} else if (argType === 'object') {
|
|
1316
|
-
if (arg.toString
|
|
1317
|
-
for (var key in arg) {
|
|
1318
|
-
if (hasOwn.call(arg, key) && arg[key]) {
|
|
1319
|
-
classes.push(key);
|
|
1320
|
-
}
|
|
1321
|
-
}
|
|
1322
|
-
} else {
|
|
1316
|
+
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
|
|
1323
1317
|
classes.push(arg.toString());
|
|
1318
|
+
continue;
|
|
1319
|
+
}
|
|
1320
|
+
|
|
1321
|
+
for (var key in arg) {
|
|
1322
|
+
if (hasOwn.call(arg, key) && arg[key]) {
|
|
1323
|
+
classes.push(key);
|
|
1324
|
+
}
|
|
1324
1325
|
}
|
|
1325
1326
|
}
|
|
1326
1327
|
}
|
|
@@ -1610,9 +1611,6 @@ function useMergeRefs(refs, defaultValue) {
|
|
|
1610
1611
|
});
|
|
1611
1612
|
}
|
|
1612
1613
|
|
|
1613
|
-
// Only Node.JS has a process variable that is of [[Class]] process
|
|
1614
|
-
Object.prototype.toString.call(typeof process !== 'undefined' ? process : 0) === '[object process]';
|
|
1615
|
-
|
|
1616
1614
|
function ItoI(a) {
|
|
1617
1615
|
return a;
|
|
1618
1616
|
}
|
|
@@ -3412,6 +3410,7 @@ FocusLock.defaultProps = {
|
|
|
3412
3410
|
onActivation: undefined,
|
|
3413
3411
|
onDeactivation: undefined
|
|
3414
3412
|
};
|
|
3413
|
+
var FocusLockUI = FocusLock;
|
|
3415
3414
|
|
|
3416
3415
|
function deferAction(action) {
|
|
3417
3416
|
// Hidding setImmediate from Webpack to avoid inserting polyfill
|
|
@@ -3425,28 +3424,9 @@ function deferAction(action) {
|
|
|
3425
3424
|
}
|
|
3426
3425
|
}
|
|
3427
3426
|
|
|
3428
|
-
process.env.NODE_ENV !== "production" ? {
|
|
3429
|
-
children: propTypes.exports.node.isRequired,
|
|
3430
|
-
disabled: propTypes.exports.bool,
|
|
3431
|
-
className: propTypes.exports.string
|
|
3432
|
-
} : {};
|
|
3433
|
-
|
|
3434
|
-
process.env.NODE_ENV !== "production" ? {
|
|
3435
|
-
children: propTypes.exports.node.isRequired,
|
|
3436
|
-
disabled: propTypes.exports.bool,
|
|
3437
|
-
className: propTypes.exports.string
|
|
3438
|
-
} : {};
|
|
3439
|
-
|
|
3440
|
-
process.env.NODE_ENV !== "production" ? {
|
|
3441
|
-
children: propTypes.exports.node.isRequired,
|
|
3442
|
-
className: propTypes.exports.string
|
|
3443
|
-
} : {};
|
|
3444
|
-
|
|
3445
3427
|
var effectCar = createSidecarMedium();
|
|
3446
3428
|
var focusHiddenMarker = 'data-focus-on-hidden';
|
|
3447
3429
|
|
|
3448
|
-
_assign({}, RemoveScroll.classNames);
|
|
3449
|
-
|
|
3450
3430
|
var FocusOn$1 = /*#__PURE__*/React__namespace.forwardRef(function (props, parentRef) {
|
|
3451
3431
|
var _a = React__namespace.useState(false),
|
|
3452
3432
|
lockProps = _a[0],
|
|
@@ -3488,7 +3468,7 @@ var FocusOn$1 = /*#__PURE__*/React__namespace.forwardRef(function (props, parent
|
|
|
3488
3468
|
enabled: enabled && scrollLock
|
|
3489
3469
|
});
|
|
3490
3470
|
|
|
3491
|
-
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(
|
|
3471
|
+
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(FocusLockUI, {
|
|
3492
3472
|
ref: parentRef,
|
|
3493
3473
|
sideCar: sideCar,
|
|
3494
3474
|
disabled: !(lockProps && enabled && focusLock),
|
|
@@ -4304,6 +4284,8 @@ var setFocus = function setFocus(topNode, lastNode, options) {
|
|
|
4304
4284
|
}
|
|
4305
4285
|
};
|
|
4306
4286
|
|
|
4287
|
+
var moveFocusInside = setFocus; //
|
|
4288
|
+
|
|
4307
4289
|
/* eslint-disable no-mixed-operators */
|
|
4308
4290
|
|
|
4309
4291
|
var focusOnBody = function focusOnBody() {
|
|
@@ -4422,7 +4404,7 @@ var activateTrap = function activateTrap() {
|
|
|
4422
4404
|
|
|
4423
4405
|
document.body.focus();
|
|
4424
4406
|
} else {
|
|
4425
|
-
result =
|
|
4407
|
+
result = moveFocusInside(workingArea, lastActiveFocus, {
|
|
4426
4408
|
focusOptions: focusOptions
|
|
4427
4409
|
});
|
|
4428
4410
|
lastPortaledElement = {};
|
|
@@ -4562,7 +4544,7 @@ mediumFocus.assignSyncMedium(onFocus);
|
|
|
4562
4544
|
mediumBlur.assignMedium(onBlur);
|
|
4563
4545
|
mediumEffect.assignMedium(function (cb) {
|
|
4564
4546
|
return cb({
|
|
4565
|
-
moveFocusInside:
|
|
4547
|
+
moveFocusInside: moveFocusInside,
|
|
4566
4548
|
focusInside: focusInside
|
|
4567
4549
|
});
|
|
4568
4550
|
});
|
|
@@ -5885,7 +5867,7 @@ var Circle12 = function Circle12(_a) {
|
|
|
5885
5867
|
|
|
5886
5868
|
Circle12.displayName = 'Circle12';
|
|
5887
5869
|
|
|
5888
|
-
var _excluded$t = ["className", "defaultChecked", "checked", "children", "value", "onChange", "disabled", "checkIcon"];
|
|
5870
|
+
var _excluded$t = ["className", "defaultChecked", "checked", "children", "value", "onChange", "disabled", "checkIcon", "dataTestId"];
|
|
5889
5871
|
var CHECKED_ITEM_PROPS = {
|
|
5890
5872
|
className: 'Checkbox__check-mark',
|
|
5891
5873
|
height: '85%',
|
|
@@ -5903,6 +5885,7 @@ var Checkbox = function Checkbox(_ref) {
|
|
|
5903
5885
|
disabled = _ref.disabled,
|
|
5904
5886
|
_ref$checkIcon = _ref.checkIcon,
|
|
5905
5887
|
checkIcon = _ref$checkIcon === void 0 ? 'checkmark' : _ref$checkIcon,
|
|
5888
|
+
dataTestId = _ref.dataTestId,
|
|
5906
5889
|
rest = _objectWithoutProperties(_ref, _excluded$t);
|
|
5907
5890
|
|
|
5908
5891
|
var _useState = React.useState((_ref2 = checked !== null && checked !== void 0 ? checked : defaultChecked) !== null && _ref2 !== void 0 ? _ref2 : false),
|
|
@@ -5922,7 +5905,8 @@ var Checkbox = function Checkbox(_ref) {
|
|
|
5922
5905
|
tabIndex: 0,
|
|
5923
5906
|
className: classNames('Checkbox', className, {
|
|
5924
5907
|
'Checkbox--disabled': disabled
|
|
5925
|
-
})
|
|
5908
|
+
}),
|
|
5909
|
+
"data-test-id": "".concat(dataTestId, "--label")
|
|
5926
5910
|
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
5927
5911
|
tabIndex: -1,
|
|
5928
5912
|
className: classNames('Checkbox__indicator', {
|
|
@@ -5935,7 +5919,8 @@ var Checkbox = function Checkbox(_ref) {
|
|
|
5935
5919
|
checked: isChecked,
|
|
5936
5920
|
value: value,
|
|
5937
5921
|
onChange: handleChange,
|
|
5938
|
-
disabled: disabled
|
|
5922
|
+
disabled: disabled,
|
|
5923
|
+
"data-test-id": "".concat(dataTestId, "--input")
|
|
5939
5924
|
}, rest)), children && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
5940
5925
|
className: "Checkbox__label"
|
|
5941
5926
|
}, children));
|
|
@@ -9602,6 +9587,8 @@ var T = function T() {
|
|
|
9602
9587
|
return true;
|
|
9603
9588
|
};
|
|
9604
9589
|
|
|
9590
|
+
var otherwise = T;
|
|
9591
|
+
|
|
9605
9592
|
function _isPlaceholder(a) {
|
|
9606
9593
|
return a != null && _typeof(a) === 'object' && a['@@functional/placeholder'] === true;
|
|
9607
9594
|
}
|
|
@@ -10762,6 +10749,8 @@ var cond = /*#__PURE__*/_curry1(function cond(pairs) {
|
|
|
10762
10749
|
});
|
|
10763
10750
|
});
|
|
10764
10751
|
|
|
10752
|
+
var cond$1 = cond;
|
|
10753
|
+
|
|
10765
10754
|
var _Set = /*#__PURE__*/function () {
|
|
10766
10755
|
function _Set() {
|
|
10767
10756
|
/* globals Set */
|
|
@@ -11039,6 +11028,7 @@ var uniqBy = /*#__PURE__*/_curry2( /*#__PURE__*/_dispatchable([], _xuniqBy, func
|
|
|
11039
11028
|
*/
|
|
11040
11029
|
|
|
11041
11030
|
var uniq = /*#__PURE__*/uniqBy(identity);
|
|
11031
|
+
var uniq$1 = uniq;
|
|
11042
11032
|
|
|
11043
11033
|
function _isNumber(x) {
|
|
11044
11034
|
return Object.prototype.toString.call(x) === '[object Number]';
|
|
@@ -11077,6 +11067,8 @@ var range = /*#__PURE__*/_curry2(function range(from, to) {
|
|
|
11077
11067
|
return result;
|
|
11078
11068
|
});
|
|
11079
11069
|
|
|
11070
|
+
var range$1 = range;
|
|
11071
|
+
|
|
11080
11072
|
var __assign$2 = undefined && undefined.__assign || function () {
|
|
11081
11073
|
__assign$2 = Object.assign || function (t) {
|
|
11082
11074
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
@@ -11177,7 +11169,7 @@ var MultiSelect = function MultiSelect(_ref) {
|
|
|
11177
11169
|
dispatch({
|
|
11178
11170
|
type: 'SELECT',
|
|
11179
11171
|
payload: {
|
|
11180
|
-
value: uniq([].concat(_toConsumableArray(values), [option.value]))
|
|
11172
|
+
value: uniq$1([].concat(_toConsumableArray(values), [option.value]))
|
|
11181
11173
|
}
|
|
11182
11174
|
});
|
|
11183
11175
|
}, [dispatch, values]);
|
|
@@ -11378,7 +11370,7 @@ var DefinitionList = function DefinitionList(_ref) {
|
|
|
11378
11370
|
}, rest), /*#__PURE__*/React__default["default"].createElement("dt", null, term), /*#__PURE__*/React__default["default"].createElement("dd", null, children));
|
|
11379
11371
|
};
|
|
11380
11372
|
|
|
11381
|
-
var _excluded$f = ["name", "children", "className", "virtual", "icon", "data-testid", "defaultExpanded", "expanded", "onToggle"];
|
|
11373
|
+
var _excluded$f = ["name", "children", "className", "virtual", "icon", "data-testid", "defaultExpanded", "expanded", "onToggle", "background", "border"];
|
|
11382
11374
|
var Expandable = function Expandable(_ref) {
|
|
11383
11375
|
var name = _ref.name,
|
|
11384
11376
|
children = _ref.children,
|
|
@@ -11392,6 +11384,10 @@ var Expandable = function Expandable(_ref) {
|
|
|
11392
11384
|
defaultExpanded = _ref$defaultExpanded === void 0 ? false : _ref$defaultExpanded,
|
|
11393
11385
|
__expanded__ = _ref.expanded,
|
|
11394
11386
|
onToggle = _ref.onToggle,
|
|
11387
|
+
_ref$background = _ref.background,
|
|
11388
|
+
background = _ref$background === void 0 ? 'light' : _ref$background,
|
|
11389
|
+
_ref$border = _ref.border,
|
|
11390
|
+
border = _ref$border === void 0 ? true : _ref$border,
|
|
11395
11391
|
rest = _objectWithoutProperties(_ref, _excluded$f);
|
|
11396
11392
|
|
|
11397
11393
|
var _useState = React.useState(defaultExpanded),
|
|
@@ -11409,13 +11405,13 @@ var Expandable = function Expandable(_ref) {
|
|
|
11409
11405
|
onToggle === null || onToggle === void 0 ? void 0 : onToggle();
|
|
11410
11406
|
}, [onToggle]);
|
|
11411
11407
|
return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
|
|
11412
|
-
className: classNames('Expandable', {
|
|
11413
|
-
'Expandable--expanded': expanded
|
|
11408
|
+
className: classNames('Expandable', "Expandable--".concat(background, "-background"), {
|
|
11409
|
+
'Expandable--expanded': expanded,
|
|
11410
|
+
'Expandable--with-border': border,
|
|
11411
|
+
'Expandable--plus-minus': icon === 'plus-minus'
|
|
11414
11412
|
}, className)
|
|
11415
11413
|
}, rest), /*#__PURE__*/React__default["default"].createElement(Clickable, {
|
|
11416
|
-
className:
|
|
11417
|
-
'Expandable__name--plusMinus': icon === 'plus-minus'
|
|
11418
|
-
}),
|
|
11414
|
+
className: "Expandable__name",
|
|
11419
11415
|
onClick: handleClick,
|
|
11420
11416
|
"data-testid": dataTestId
|
|
11421
11417
|
}, name, icon !== 'plus-minus' && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
@@ -11938,23 +11934,23 @@ var whenCurrentPageIsGreaterThanHalfTheTotal = function whenCurrentPageIsGreater
|
|
|
11938
11934
|
};
|
|
11939
11935
|
|
|
11940
11936
|
var showAllPages = function showAllPages(_, totalPages) {
|
|
11941
|
-
return range(1, totalPages + 1);
|
|
11937
|
+
return range$1(1, totalPages + 1);
|
|
11942
11938
|
};
|
|
11943
11939
|
|
|
11944
11940
|
var showFirstNPagesAndLastPage = function showFirstNPagesAndLastPage(_, totalPages, maxPages) {
|
|
11945
|
-
return [].concat(_toConsumableArray(range(1, maxPages)), [totalPages]);
|
|
11941
|
+
return [].concat(_toConsumableArray(range$1(1, maxPages)), [totalPages]);
|
|
11946
11942
|
};
|
|
11947
11943
|
|
|
11948
11944
|
var showTheLastNPages = function showTheLastNPages(_, totalPages, maxPages) {
|
|
11949
|
-
return [1].concat(_toConsumableArray(range(totalPages - maxPages + 2, totalPages + 1)));
|
|
11945
|
+
return [1].concat(_toConsumableArray(range$1(totalPages - maxPages + 2, totalPages + 1)));
|
|
11950
11946
|
};
|
|
11951
11947
|
|
|
11952
11948
|
var showAGroupOfPagesCenteredOnTheCurrentPage = function showAGroupOfPagesCenteredOnTheCurrentPage(page, totalPages, maxPages) {
|
|
11953
11949
|
var diff = Math.floor((maxPages - 2) / 2);
|
|
11954
|
-
return [1].concat(_toConsumableArray(range(page - diff, page + diff + 1)), [totalPages]);
|
|
11950
|
+
return [1].concat(_toConsumableArray(range$1(page - diff, page + diff + 1)), [totalPages]);
|
|
11955
11951
|
};
|
|
11956
11952
|
|
|
11957
|
-
var determinePagesToShow = cond([[whenThereAreFewerPagesThanWeDisplay, showAllPages], [whenCurrentPageIsLessThanHalfTheTotal, showFirstNPagesAndLastPage], [whenCurrentPageIsGreaterThanHalfTheTotal, showTheLastNPages], [
|
|
11953
|
+
var determinePagesToShow = cond$1([[whenThereAreFewerPagesThanWeDisplay, showAllPages], [whenCurrentPageIsLessThanHalfTheTotal, showFirstNPagesAndLastPage], [whenCurrentPageIsGreaterThanHalfTheTotal, showTheLastNPages], [otherwise, showAGroupOfPagesCenteredOnTheCurrentPage]]);
|
|
11958
11954
|
var Paginator = function Paginator(_ref) {
|
|
11959
11955
|
var selectedPage = _ref.selectedPage,
|
|
11960
11956
|
totalPages = _ref.totalPages,
|