@moda/om 21.5.2 → 21.6.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/dist/index.cjs.js +80 -97
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +82 -97
- package/dist/index.esm.js.map +1 -1
- package/dist/src/components/Clickable/Clickable.d.ts +10 -2
- package/dist/src/components/Tabs/TabList.d.ts +1 -1
- package/dist/src/components/Tabs/TabPanels.d.ts +1 -1
- package/dist/src/components/Tabs/Tabs.d.ts +1 -1
- package/dist/src/components/index.d.ts +0 -1
- package/dist/src/utilities/index.d.ts +0 -1
- package/dist/styles.css +1 -1
- package/package.json +12 -7
- package/src/components/Clickable/Clickable.tsx +28 -13
- package/src/components/Tabs/TabList.tsx +1 -1
- package/src/components/Tabs/TabPanels.tsx +2 -1
- package/src/components/Tabs/Tabs.tsx +3 -1
- package/src/components/index.ts +0 -1
- package/src/utilities/index.ts +0 -1
- package/dist/src/components/NavigationPreventer/NavigationPreventer.d.ts +0 -8
- package/dist/src/components/NavigationPreventer/index.d.ts +0 -2
- package/dist/src/components/NavigationPreventer/usePreventNavigation.d.ts +0 -1
- package/dist/src/utilities/preventNavigation.d.ts +0 -1
- package/src/components/NavigationPreventer/NavigationPreventer.tsx +0 -17
- package/src/components/NavigationPreventer/index.ts +0 -2
- package/src/components/NavigationPreventer/usePreventNavigation.ts +0 -12
- package/src/utilities/preventNavigation.ts +0 -4
package/dist/index.cjs.js
CHANGED
|
@@ -391,7 +391,7 @@ function requireColors() {
|
|
|
391
391
|
"tuscany": "rgb(186, 83, 44)",
|
|
392
392
|
"klein-blue": "rgb(38, 48, 120)",
|
|
393
393
|
"persian-blue": "rgb(30, 34, 170)",
|
|
394
|
-
"brick": "rgb(
|
|
394
|
+
"brick": "rgb(158, 48, 57)",
|
|
395
395
|
"goldenrod": "rgb(186, 145, 46)",
|
|
396
396
|
"seafoam": "rgb(177, 191, 170)",
|
|
397
397
|
"coral": "rgb(255, 146, 121)",
|
|
@@ -421,7 +421,7 @@ function requireColors() {
|
|
|
421
421
|
"global": {
|
|
422
422
|
"klein-blue": "rgb(38, 48, 120)",
|
|
423
423
|
"persian-blue": "rgb(30, 34, 170)",
|
|
424
|
-
"brick": "rgb(
|
|
424
|
+
"brick": "rgb(158, 48, 57)",
|
|
425
425
|
"goldenrod": "rgb(186, 145, 46)",
|
|
426
426
|
"seafoam": "rgb(177, 191, 170)",
|
|
427
427
|
"coral": "rgb(255, 146, 121)"
|
|
@@ -1380,11 +1380,6 @@ var States = function States(_ref) {
|
|
|
1380
1380
|
}));
|
|
1381
1381
|
};
|
|
1382
1382
|
|
|
1383
|
-
var preventNavigation = function preventNavigation(event) {
|
|
1384
|
-
event.preventDefault();
|
|
1385
|
-
event.returnValue = '';
|
|
1386
|
-
};
|
|
1387
|
-
|
|
1388
1383
|
/******************************************************************************
|
|
1389
1384
|
Copyright (c) Microsoft Corporation.
|
|
1390
1385
|
|
|
@@ -5538,14 +5533,18 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
|
|
|
5538
5533
|
};
|
|
5539
5534
|
|
|
5540
5535
|
var _excluded$B = ["className", "styleless", "disabled"];
|
|
5536
|
+
|
|
5537
|
+
// Define minimal LinkProps that work with both v5 and v7
|
|
5538
|
+
// Using Omit to remove conflicting HTML attributes, then add router-specific props
|
|
5539
|
+
|
|
5541
5540
|
var isLink = function isLink(props) {
|
|
5542
5541
|
return 'to' in props;
|
|
5543
5542
|
};
|
|
5544
5543
|
var isAnchor = function isAnchor(props) {
|
|
5545
|
-
return 'href' in props;
|
|
5544
|
+
return 'href' in props && !('to' in props);
|
|
5546
5545
|
};
|
|
5547
5546
|
var isButton = function isButton(props) {
|
|
5548
|
-
return !('href' in props);
|
|
5547
|
+
return !('href' in props) && !('to' in props);
|
|
5549
5548
|
};
|
|
5550
5549
|
var Clickable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
5551
5550
|
var className = _ref.className,
|
|
@@ -5553,16 +5552,23 @@ var Clickable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
5553
5552
|
styleless = _ref$styleless === void 0 ? false : _ref$styleless,
|
|
5554
5553
|
disabled = _ref.disabled,
|
|
5555
5554
|
rest = _objectWithoutProperties(_ref, _excluded$B);
|
|
5555
|
+
var baseClassName = classNames({
|
|
5556
|
+
Clickable: !styleless,
|
|
5557
|
+
'Clickable--disabled': disabled
|
|
5558
|
+
}, className);
|
|
5559
|
+
if (isLink(rest)) {
|
|
5560
|
+
// Link doesn't support disabled prop, but we handle it via CSS class
|
|
5561
|
+
return /*#__PURE__*/React.createElement(reactRouterDom.Link, _extends$1({}, rest, {
|
|
5562
|
+
className: baseClassName,
|
|
5563
|
+
ref: ref
|
|
5564
|
+
}));
|
|
5565
|
+
}
|
|
5566
|
+
|
|
5567
|
+
// For anchor and button, include the disabled prop
|
|
5556
5568
|
var props = _objectSpread2(_objectSpread2({}, rest), {}, {
|
|
5557
|
-
className:
|
|
5558
|
-
Clickable: !styleless,
|
|
5559
|
-
'Clickable--disabled': disabled
|
|
5560
|
-
}, className),
|
|
5569
|
+
className: baseClassName,
|
|
5561
5570
|
disabled: disabled
|
|
5562
5571
|
});
|
|
5563
|
-
if (isLink(props)) return /*#__PURE__*/React.createElement(reactRouterDom.Link, _extends$1({}, props, {
|
|
5564
|
-
ref: ref
|
|
5565
|
-
}));
|
|
5566
5572
|
if (isAnchor(props)) return /*#__PURE__*/React.createElement("a", _extends$1({}, props, {
|
|
5567
5573
|
ref: ref
|
|
5568
5574
|
}));
|
|
@@ -6066,6 +6072,8 @@ var keys = typeof Object.keys === 'function' && !hasArgsEnumBug ? /*#__PURE__*/_
|
|
|
6066
6072
|
* @example
|
|
6067
6073
|
*
|
|
6068
6074
|
* R.type({}); //=> "Object"
|
|
6075
|
+
* R.type(new Map); //=> "Map"
|
|
6076
|
+
* R.type(new Set); //=> "Set"
|
|
6069
6077
|
* R.type(1); //=> "Number"
|
|
6070
6078
|
* R.type(false); //=> "Boolean"
|
|
6071
6079
|
* R.type('s'); //=> "String"
|
|
@@ -7216,16 +7224,17 @@ var omit = /*#__PURE__*/_curry2(function omit(names, obj) {
|
|
|
7216
7224
|
* @example
|
|
7217
7225
|
*
|
|
7218
7226
|
* R.range(1, 5); //=> [1, 2, 3, 4]
|
|
7219
|
-
* R.range(
|
|
7227
|
+
* R.range(1, 5.5); //=> [1, 2, 3, 4, 5]
|
|
7228
|
+
* R.range(1.5, 5.5); //=> [1.5, 2.5, 3.5, 4.5]
|
|
7220
7229
|
*/
|
|
7221
7230
|
var range = /*#__PURE__*/_curry2(function range(from, to) {
|
|
7222
7231
|
if (!(_isNumber(from) && _isNumber(to))) {
|
|
7223
7232
|
throw new TypeError('Both arguments to range must be numbers');
|
|
7224
7233
|
}
|
|
7225
|
-
var
|
|
7226
|
-
var
|
|
7234
|
+
var length = from < to ? Math.ceil(to - from) : 0;
|
|
7235
|
+
var result = Array(length);
|
|
7227
7236
|
var idx = 0;
|
|
7228
|
-
while (idx <
|
|
7237
|
+
while (idx < length) {
|
|
7229
7238
|
result[idx] = idx + from;
|
|
7230
7239
|
idx += 1;
|
|
7231
7240
|
}
|
|
@@ -12029,30 +12038,6 @@ var LoadingShapesLavenderBlue = function LoadingShapesLavenderBlue() {
|
|
|
12029
12038
|
}));
|
|
12030
12039
|
};
|
|
12031
12040
|
|
|
12032
|
-
var usePreventNavigation = function usePreventNavigation() {
|
|
12033
|
-
var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
|
|
12034
|
-
React.useEffect(function () {
|
|
12035
|
-
if (enabled) {
|
|
12036
|
-
window.addEventListener('beforeunload', preventNavigation);
|
|
12037
|
-
return function () {
|
|
12038
|
-
return window.removeEventListener('beforeunload', preventNavigation);
|
|
12039
|
-
};
|
|
12040
|
-
}
|
|
12041
|
-
}, [enabled]);
|
|
12042
|
-
};
|
|
12043
|
-
|
|
12044
|
-
var NavigationPreventer = function NavigationPreventer(_ref) {
|
|
12045
|
-
var _ref$enabled = _ref.enabled,
|
|
12046
|
-
enabled = _ref$enabled === void 0 ? false : _ref$enabled,
|
|
12047
|
-
_ref$message = _ref.message,
|
|
12048
|
-
message = _ref$message === void 0 ? 'Changes that you made may not be saved.' : _ref$message;
|
|
12049
|
-
usePreventNavigation(enabled);
|
|
12050
|
-
return /*#__PURE__*/React.createElement(reactRouterDom.Prompt, {
|
|
12051
|
-
when: enabled,
|
|
12052
|
-
message: message
|
|
12053
|
-
});
|
|
12054
|
-
};
|
|
12055
|
-
|
|
12056
12041
|
var __assign$1 = undefined && undefined.__assign || function () {
|
|
12057
12042
|
__assign$1 = Object.assign || function (t) {
|
|
12058
12043
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
@@ -12533,35 +12518,23 @@ var SlidingPane = function SlidingPane(_ref) {
|
|
|
12533
12518
|
}, children))));
|
|
12534
12519
|
};
|
|
12535
12520
|
|
|
12536
|
-
var
|
|
12537
|
-
var
|
|
12538
|
-
|
|
12539
|
-
|
|
12540
|
-
|
|
12541
|
-
|
|
12542
|
-
|
|
12543
|
-
|
|
12544
|
-
|
|
12545
|
-
|
|
12546
|
-
|
|
12547
|
-
|
|
12548
|
-
|
|
12549
|
-
|
|
12550
|
-
|
|
12551
|
-
|
|
12552
|
-
|
|
12553
|
-
if (activeTab) setActivePanel(activeTab);
|
|
12554
|
-
}, [activeTab]);
|
|
12555
|
-
return /*#__PURE__*/React.createElement("div", _extends$1({
|
|
12556
|
-
className: classNames('Tabs', className)
|
|
12557
|
-
}, rest), /*#__PURE__*/React.createElement(TabList, {
|
|
12558
|
-
tabs: tabs,
|
|
12559
|
-
onTabSelected: handleTabClick,
|
|
12560
|
-
activePanel: activePanel
|
|
12561
|
-
}), /*#__PURE__*/React.createElement(TabPanels, {
|
|
12562
|
-
panels: tabs,
|
|
12563
|
-
activePanel: activePanel
|
|
12564
|
-
}));
|
|
12521
|
+
var Tab = function Tab(_ref) {
|
|
12522
|
+
var tab = _ref.tab,
|
|
12523
|
+
onTabChosen = _ref.onTabChosen,
|
|
12524
|
+
activeTab = _ref.activeTab;
|
|
12525
|
+
var handleClick = React.useCallback(function () {
|
|
12526
|
+
return onTabChosen(tab.name);
|
|
12527
|
+
}, [tab.name, onTabChosen]);
|
|
12528
|
+
var handleKeyDown = React.useCallback(function (event) {
|
|
12529
|
+
if (event.key === 'Enter') {
|
|
12530
|
+
handleClick();
|
|
12531
|
+
}
|
|
12532
|
+
}, [handleClick]);
|
|
12533
|
+
return /*#__PURE__*/React.createElement(Clickable, {
|
|
12534
|
+
className: "Tab ".concat(activeTab === tab.name ? 'Tab--active' : ''),
|
|
12535
|
+
onClick: handleClick,
|
|
12536
|
+
onKeyDown: handleKeyDown
|
|
12537
|
+
}, tab.title);
|
|
12565
12538
|
};
|
|
12566
12539
|
|
|
12567
12540
|
var TabList = function TabList(_ref) {
|
|
@@ -12580,23 +12553,11 @@ var TabList = function TabList(_ref) {
|
|
|
12580
12553
|
}));
|
|
12581
12554
|
};
|
|
12582
12555
|
|
|
12583
|
-
var
|
|
12584
|
-
var
|
|
12585
|
-
|
|
12586
|
-
|
|
12587
|
-
|
|
12588
|
-
return onTabChosen(tab.name);
|
|
12589
|
-
}, [tab.name, onTabChosen]);
|
|
12590
|
-
var handleKeyDown = React.useCallback(function (event) {
|
|
12591
|
-
if (event.key === 'Enter') {
|
|
12592
|
-
handleClick();
|
|
12593
|
-
}
|
|
12594
|
-
}, [handleClick]);
|
|
12595
|
-
return /*#__PURE__*/React.createElement(Clickable, {
|
|
12596
|
-
className: "Tab ".concat(activeTab === tab.name ? 'Tab--active' : ''),
|
|
12597
|
-
onClick: handleClick,
|
|
12598
|
-
onKeyDown: handleKeyDown
|
|
12599
|
-
}, tab.title);
|
|
12556
|
+
var TabPanel = function TabPanel(_ref) {
|
|
12557
|
+
var children = _ref.children;
|
|
12558
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
12559
|
+
className: "TabPanel"
|
|
12560
|
+
}, children);
|
|
12600
12561
|
};
|
|
12601
12562
|
|
|
12602
12563
|
var TabPanels = function TabPanels(_ref) {
|
|
@@ -12613,11 +12574,35 @@ var TabPanels = function TabPanels(_ref) {
|
|
|
12613
12574
|
}));
|
|
12614
12575
|
};
|
|
12615
12576
|
|
|
12616
|
-
var
|
|
12617
|
-
|
|
12618
|
-
|
|
12619
|
-
|
|
12620
|
-
|
|
12577
|
+
var _excluded$4 = ["tabs", "onTabClicked", "defaultActiveTab", "activeTab", "className"];
|
|
12578
|
+
var Tabs = function Tabs(_ref) {
|
|
12579
|
+
var tabs = _ref.tabs,
|
|
12580
|
+
onTabClicked = _ref.onTabClicked,
|
|
12581
|
+
defaultActiveTab = _ref.defaultActiveTab,
|
|
12582
|
+
activeTab = _ref.activeTab,
|
|
12583
|
+
className = _ref.className,
|
|
12584
|
+
rest = _objectWithoutProperties(_ref, _excluded$4);
|
|
12585
|
+
var _useState = React.useState(activeTab || defaultActiveTab || tabs[0].name),
|
|
12586
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
12587
|
+
activePanel = _useState2[0],
|
|
12588
|
+
setActivePanel = _useState2[1];
|
|
12589
|
+
var handleTabClick = function handleTabClick(tabName) {
|
|
12590
|
+
if (!activeTab) setActivePanel(tabName);
|
|
12591
|
+
if (onTabClicked) onTabClicked(tabName);
|
|
12592
|
+
};
|
|
12593
|
+
React.useEffect(function () {
|
|
12594
|
+
if (activeTab) setActivePanel(activeTab);
|
|
12595
|
+
}, [activeTab]);
|
|
12596
|
+
return /*#__PURE__*/React.createElement("div", _extends$1({
|
|
12597
|
+
className: classNames('Tabs', className)
|
|
12598
|
+
}, rest), /*#__PURE__*/React.createElement(TabList, {
|
|
12599
|
+
tabs: tabs,
|
|
12600
|
+
onTabSelected: handleTabClick,
|
|
12601
|
+
activePanel: activePanel
|
|
12602
|
+
}), /*#__PURE__*/React.createElement(TabPanels, {
|
|
12603
|
+
panels: tabs,
|
|
12604
|
+
activePanel: activePanel
|
|
12605
|
+
}));
|
|
12621
12606
|
};
|
|
12622
12607
|
|
|
12623
12608
|
var _excluded$3 = ["className", "disabled", "onRemove", "children"];
|
|
@@ -12762,7 +12747,6 @@ exports.Mirror = Mirror;
|
|
|
12762
12747
|
exports.Modal = Modal;
|
|
12763
12748
|
exports.ModalOverlay = ModalOverlay;
|
|
12764
12749
|
exports.MultiSelect = MultiSelect;
|
|
12765
|
-
exports.NavigationPreventer = NavigationPreventer;
|
|
12766
12750
|
exports.NoLineDivider = NoLineDivider;
|
|
12767
12751
|
exports.Oval = Oval;
|
|
12768
12752
|
exports.Overlay = Overlay;
|
|
@@ -12800,5 +12784,4 @@ exports.useBreakpoint = useBreakpoint;
|
|
|
12800
12784
|
exports.useClickOutside = useClickOutside;
|
|
12801
12785
|
exports.useConfirm = useConfirm;
|
|
12802
12786
|
exports.useKeyboardListNavigation = useKeyboardListNavigation;
|
|
12803
|
-
exports.usePreventNavigation = usePreventNavigation;
|
|
12804
12787
|
exports.useUpdateEffect = useUpdateEffect;
|