@canonical/react-components 0.40.1 → 0.42.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/__mocks__/nanoid.js +0 -2
- package/dist/components/Accordion/Accordion.js +13 -37
- package/dist/components/Accordion/AccordionSection/AccordionSection.js +8 -14
- package/dist/components/Accordion/AccordionSection/index.js +0 -2
- package/dist/components/Accordion/index.js +0 -2
- package/dist/components/ActionButton/ActionButton.js +36 -68
- package/dist/components/ActionButton/index.js +0 -2
- package/dist/components/ArticlePagination/ArticlePagination.js +5 -15
- package/dist/components/ArticlePagination/index.js +0 -2
- package/dist/components/Badge/Badge.js +10 -28
- package/dist/components/Badge/index.js +0 -2
- package/dist/components/Button/Button.js +12 -25
- package/dist/components/Button/index.js +0 -4
- package/dist/components/Card/Card.js +6 -17
- package/dist/components/Card/index.js +0 -2
- package/dist/components/CheckboxInput/CheckableInput/CheckableInput.js +6 -20
- package/dist/components/CheckboxInput/CheckableInput/index.js +0 -2
- package/dist/components/CheckboxInput/CheckboxInput.js +3 -13
- package/dist/components/CheckboxInput/index.js +0 -2
- package/dist/components/Chip/Chip.js +18 -35
- package/dist/components/Chip/index.js +0 -2
- package/dist/components/Code/Code.js +5 -23
- package/dist/components/Code/index.js +0 -2
- package/dist/components/CodeSnippet/CodeSnippet.js +2 -12
- package/dist/components/CodeSnippet/CodeSnippetBlock.js +10 -18
- package/dist/components/CodeSnippet/CodeSnippetDropdown.js +5 -14
- package/dist/components/CodeSnippet/index.js +0 -3
- package/dist/components/Col/Col.js +15 -25
- package/dist/components/Col/index.js +0 -4
- package/dist/components/ContextualMenu/ContextualMenu.js +70 -105
- package/dist/components/ContextualMenu/ContextualMenuDropdown/ContextualMenuDropdown.js +51 -88
- package/dist/components/ContextualMenu/ContextualMenuDropdown/index.js +0 -2
- package/dist/components/ContextualMenu/index.js +0 -2
- package/dist/components/Field/Field.js +35 -51
- package/dist/components/Field/index.js +0 -2
- package/dist/components/Form/Form.js +4 -14
- package/dist/components/Form/index.js +0 -2
- package/dist/components/Icon/Icon.js +3 -14
- package/dist/components/Icon/index.js +0 -4
- package/dist/components/Input/Input.js +21 -39
- package/dist/components/Input/index.js +0 -2
- package/dist/components/Label/Label.js +7 -13
- package/dist/components/Label/index.js +0 -2
- package/dist/components/Link/Link.js +10 -22
- package/dist/components/Link/index.js +0 -2
- package/dist/components/List/List.js +18 -31
- package/dist/components/List/index.js +0 -2
- package/dist/components/Loader/Loader.js +0 -7
- package/dist/components/Loader/index.js +0 -2
- package/dist/components/MainTable/MainTable.js +60 -112
- package/dist/components/MainTable/index.js +0 -2
- package/dist/components/Modal/Modal.js +7 -34
- package/dist/components/Modal/index.js +0 -2
- package/dist/components/ModularTable/ModularTable.d.ts +9 -1
- package/dist/components/ModularTable/ModularTable.js +74 -63
- package/dist/components/ModularTable/index.js +0 -2
- package/dist/components/Navigation/Navigation.js +46 -82
- package/dist/components/Navigation/NavigationLink/NavigationLink.js +15 -30
- package/dist/components/Navigation/NavigationLink/index.js +0 -2
- package/dist/components/Navigation/NavigationMenu/NavigationMenu.js +12 -35
- package/dist/components/Navigation/NavigationMenu/index.js +0 -2
- package/dist/components/Navigation/index.js +0 -2
- package/dist/components/Notification/Notification.d.ts +6 -1
- package/dist/components/Notification/Notification.js +31 -46
- package/dist/components/Notification/index.js +0 -4
- package/dist/components/Pagination/Pagination.js +14 -44
- package/dist/components/Pagination/PaginationButton/PaginationButton.js +7 -14
- package/dist/components/Pagination/PaginationButton/index.js +0 -2
- package/dist/components/Pagination/PaginationItem/PaginationItem.js +3 -8
- package/dist/components/Pagination/PaginationItem/index.js +0 -2
- package/dist/components/Pagination/index.js +0 -2
- package/dist/components/PasswordToggle/PasswordToggle.js +21 -50
- package/dist/components/PasswordToggle/index.js +0 -2
- package/dist/components/RadioInput/RadioInput.js +1 -11
- package/dist/components/RadioInput/index.js +0 -2
- package/dist/components/Row/Row.js +2 -12
- package/dist/components/Row/index.js +0 -2
- package/dist/components/SearchAndFilter/FilterPanelSection/FilterPanelSection.js +27 -49
- package/dist/components/SearchAndFilter/FilterPanelSection/index.js +0 -2
- package/dist/components/SearchAndFilter/SearchAndFilter.d.ts +9 -1
- package/dist/components/SearchAndFilter/SearchAndFilter.js +84 -105
- package/dist/components/SearchAndFilter/index.js +0 -2
- package/dist/components/SearchAndFilter/utils.js +1 -7
- package/dist/components/SearchBox/SearchBox.js +18 -38
- package/dist/components/SearchBox/index.js +0 -2
- package/dist/components/Select/Select.js +20 -33
- package/dist/components/Select/index.js +0 -2
- package/dist/components/Slider/Slider.js +16 -32
- package/dist/components/Slider/index.js +0 -2
- package/dist/components/Spinner/Spinner.js +8 -19
- package/dist/components/Spinner/index.js +0 -2
- package/dist/components/StatusLabel/StatusLabel.js +4 -15
- package/dist/components/StatusLabel/index.js +0 -4
- package/dist/components/Strip/Strip.js +25 -36
- package/dist/components/Strip/index.js +0 -2
- package/dist/components/SummaryButton/SummaryButton.js +4 -10
- package/dist/components/SummaryButton/index.js +0 -2
- package/dist/components/Switch/Switch.js +3 -12
- package/dist/components/Switch/index.js +0 -2
- package/dist/components/Table/Table.js +6 -16
- package/dist/components/Table/index.js +0 -2
- package/dist/components/TableCell/TableCell.js +10 -20
- package/dist/components/TableCell/index.js +0 -2
- package/dist/components/TableHeader/TableHeader.js +2 -11
- package/dist/components/TableHeader/index.js +0 -2
- package/dist/components/TableRow/TableRow.js +1 -10
- package/dist/components/TableRow/index.js +0 -2
- package/dist/components/Tabs/Tabs.js +7 -17
- package/dist/components/Tabs/index.js +0 -2
- package/dist/components/Textarea/Textarea.js +23 -36
- package/dist/components/Textarea/index.js +0 -2
- package/dist/components/Tooltip/Tooltip.js +42 -87
- package/dist/components/Tooltip/index.js +0 -4
- package/dist/enums.js +4 -6
- package/dist/hooks/index.js +0 -8
- package/dist/hooks/useClickOutside.js +2 -7
- package/dist/hooks/useId.js +0 -4
- package/dist/hooks/useListener.js +0 -8
- package/dist/hooks/useOnEscapePressed.js +0 -3
- package/dist/hooks/usePagination.js +13 -25
- package/dist/hooks/usePrevious.js +0 -3
- package/dist/hooks/useThrottle.js +1 -15
- package/dist/hooks/useWindowFitment.d.ts +12 -0
- package/dist/hooks/useWindowFitment.js +22 -17
- package/dist/index.js +0 -52
- package/dist/utils.js +3 -10
- package/package.json +36 -35
|
@@ -1,85 +1,58 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = exports.Label = void 0;
|
|
9
|
-
|
|
10
8
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
-
|
|
12
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
-
|
|
14
10
|
var _Button = _interopRequireDefault(require("../Button"));
|
|
15
|
-
|
|
16
11
|
var _Field = _interopRequireDefault(require("../Field"));
|
|
17
|
-
|
|
18
12
|
var _Label = _interopRequireDefault(require("../Label"));
|
|
19
|
-
|
|
20
13
|
var _hooks = require("../../hooks");
|
|
21
|
-
|
|
22
14
|
var _excluded = ["caution", "className", "error", "help", "id", "label", "readOnly", "required", "success", "type", "wrapperClassName"];
|
|
23
|
-
|
|
24
15
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
25
|
-
|
|
26
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
27
|
-
|
|
28
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
29
|
-
|
|
30
18
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
31
|
-
|
|
32
19
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
33
|
-
|
|
34
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."); }
|
|
35
|
-
|
|
36
21
|
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); }
|
|
37
|
-
|
|
38
|
-
function
|
|
39
|
-
|
|
40
|
-
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; }
|
|
41
|
-
|
|
22
|
+
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; }
|
|
23
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
42
24
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
43
|
-
|
|
44
25
|
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; }
|
|
45
|
-
|
|
46
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; }
|
|
47
|
-
|
|
48
|
-
|
|
27
|
+
var Label = /*#__PURE__*/function (Label) {
|
|
28
|
+
Label["Hide"] = "Hide";
|
|
29
|
+
Label["Show"] = "Show";
|
|
30
|
+
return Label;
|
|
31
|
+
}({});
|
|
49
32
|
/**
|
|
50
33
|
* The props for the Password Toggle component.
|
|
51
34
|
*/
|
|
52
|
-
|
|
53
35
|
exports.Label = Label;
|
|
54
|
-
|
|
55
|
-
(function (Label) {
|
|
56
|
-
Label["Hide"] = "Hide";
|
|
57
|
-
Label["Show"] = "Show";
|
|
58
|
-
})(Label || (exports.Label = Label = {}));
|
|
59
|
-
|
|
60
36
|
var PasswordToggle = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
61
37
|
var caution = _ref.caution,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
38
|
+
className = _ref.className,
|
|
39
|
+
error = _ref.error,
|
|
40
|
+
help = _ref.help,
|
|
41
|
+
id = _ref.id,
|
|
42
|
+
label = _ref.label,
|
|
43
|
+
readOnly = _ref.readOnly,
|
|
44
|
+
required = _ref.required,
|
|
45
|
+
success = _ref.success,
|
|
46
|
+
type = _ref.type,
|
|
47
|
+
wrapperClassName = _ref.wrapperClassName,
|
|
48
|
+
inputProps = _objectWithoutProperties(_ref, _excluded);
|
|
74
49
|
var _useState = (0, _react.useState)(true),
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
50
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
51
|
+
isPassword = _useState2[0],
|
|
52
|
+
setIsPassword = _useState2[1];
|
|
79
53
|
var validationId = (0, _hooks.useId)();
|
|
80
54
|
var helpId = (0, _hooks.useId)();
|
|
81
55
|
var hasError = !!error;
|
|
82
|
-
|
|
83
56
|
var togglePassword = function togglePassword() {
|
|
84
57
|
if (isPassword) {
|
|
85
58
|
setIsPassword(false);
|
|
@@ -87,7 +60,6 @@ var PasswordToggle = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
|
|
|
87
60
|
setIsPassword(true);
|
|
88
61
|
}
|
|
89
62
|
};
|
|
90
|
-
|
|
91
63
|
return /*#__PURE__*/_react.default.createElement(_Field.default, {
|
|
92
64
|
caution: caution,
|
|
93
65
|
className: wrapperClassName,
|
|
@@ -127,6 +99,5 @@ var PasswordToggle = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
|
|
|
127
99
|
type: isPassword ? "password" : "text"
|
|
128
100
|
}, inputProps)));
|
|
129
101
|
});
|
|
130
|
-
|
|
131
102
|
var _default = PasswordToggle;
|
|
132
103
|
exports.default = _default;
|
|
@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
|
|
|
9
9
|
return _PasswordToggle.default;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
|
|
13
12
|
var _PasswordToggle = _interopRequireDefault(require("./PasswordToggle"));
|
|
14
|
-
|
|
15
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -4,30 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _CheckableInput = _interopRequireDefault(require("../CheckboxInput/CheckableInput"));
|
|
11
|
-
|
|
12
9
|
var _excluded = ["label"];
|
|
13
|
-
|
|
14
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
11
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
17
|
-
|
|
18
12
|
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; }
|
|
19
|
-
|
|
20
13
|
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; }
|
|
21
|
-
|
|
22
14
|
var RadioInput = function RadioInput(_ref) {
|
|
23
15
|
var label = _ref.label,
|
|
24
|
-
|
|
25
|
-
|
|
16
|
+
radioProps = _objectWithoutProperties(_ref, _excluded);
|
|
26
17
|
return /*#__PURE__*/_react.default.createElement(_CheckableInput.default, _extends({
|
|
27
18
|
inputType: "radio",
|
|
28
19
|
label: label
|
|
29
20
|
}, radioProps));
|
|
30
21
|
};
|
|
31
|
-
|
|
32
22
|
var _default = RadioInput;
|
|
33
23
|
exports.default = _default;
|
|
@@ -4,30 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
9
|
var _excluded = ["children", "className"];
|
|
13
|
-
|
|
14
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
11
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
17
|
-
|
|
18
12
|
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; }
|
|
19
|
-
|
|
20
13
|
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; }
|
|
21
|
-
|
|
22
14
|
var Row = function Row(_ref) {
|
|
23
15
|
var children = _ref.children,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
16
|
+
className = _ref.className,
|
|
17
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
27
18
|
return /*#__PURE__*/_react.default.createElement("div", _extends({
|
|
28
19
|
className: (0, _classnames.default)(className, "row")
|
|
29
20
|
}, props), children);
|
|
30
21
|
};
|
|
31
|
-
|
|
32
22
|
var _default = Row;
|
|
33
23
|
exports.default = _default;
|
|
@@ -1,92 +1,73 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
-
|
|
14
10
|
var _Chip = _interopRequireDefault(require("../../Chip"));
|
|
15
|
-
|
|
16
11
|
var _utils = require("../utils");
|
|
17
|
-
|
|
18
12
|
var _utils2 = require("../../../utils");
|
|
19
|
-
|
|
20
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
-
|
|
22
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
-
|
|
24
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
|
-
|
|
26
16
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
27
|
-
|
|
28
17
|
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."); }
|
|
29
|
-
|
|
30
18
|
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); }
|
|
31
|
-
|
|
32
|
-
function
|
|
33
|
-
|
|
34
|
-
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; }
|
|
35
|
-
|
|
19
|
+
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; }
|
|
20
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
36
21
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
37
|
-
|
|
38
22
|
var FilterPanelSection = function FilterPanelSection(_ref) {
|
|
39
23
|
var data = _ref.data,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
24
|
+
searchData = _ref.searchData,
|
|
25
|
+
_ref$searchTerm = _ref.searchTerm,
|
|
26
|
+
searchTerm = _ref$searchTerm === void 0 ? "" : _ref$searchTerm,
|
|
27
|
+
sectionHidden = _ref.sectionHidden,
|
|
28
|
+
toggleSelected = _ref.toggleSelected;
|
|
45
29
|
var chips = data.chips,
|
|
46
|
-
|
|
47
|
-
|
|
30
|
+
heading = data.heading;
|
|
48
31
|
var _useState = (0, _react.useState)(0),
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
32
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
33
|
+
overflowCounter = _useState2[0],
|
|
34
|
+
setOverflowCounter = _useState2[1];
|
|
53
35
|
var _useState3 = (0, _react.useState)(false),
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
36
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
37
|
+
expanded = _useState4[0],
|
|
38
|
+
setExpanded = _useState4[1];
|
|
58
39
|
var chipWrapper = (0, _react.useRef)(null);
|
|
59
|
-
|
|
60
40
|
var handleChipClick = function handleChipClick(chip) {
|
|
61
41
|
toggleSelected(chip);
|
|
62
|
-
};
|
|
63
|
-
// overflowing
|
|
64
|
-
|
|
42
|
+
};
|
|
65
43
|
|
|
44
|
+
// If the offsetTop is more than double height of a single chip, consider it
|
|
45
|
+
// overflowing
|
|
66
46
|
var updateFlowCount = function updateFlowCount() {
|
|
67
47
|
var _chipWrapper$current;
|
|
68
|
-
|
|
69
48
|
var chips = chipWrapper === null || chipWrapper === void 0 ? void 0 : (_chipWrapper$current = chipWrapper.current) === null || _chipWrapper$current === void 0 ? void 0 : _chipWrapper$current.querySelectorAll(".p-chip");
|
|
70
49
|
var overflowCount = (0, _utils.overflowingChipsCount)(chips, 2);
|
|
71
50
|
setOverflowCounter(overflowCount);
|
|
72
|
-
};
|
|
73
|
-
|
|
51
|
+
};
|
|
74
52
|
|
|
75
|
-
|
|
53
|
+
// Check if search term characters matches any characters in panel heading
|
|
54
|
+
var searchTermInHeading = (0, _utils2.highlightSubString)(heading, searchTerm).match;
|
|
76
55
|
|
|
56
|
+
// Serialise chip values into string so it can be interrogated with subString
|
|
77
57
|
var chipValues = [];
|
|
78
58
|
Object.entries(chips).forEach(function (chipValue) {
|
|
79
59
|
chipValues.push(chipValue[1].value);
|
|
80
|
-
});
|
|
60
|
+
});
|
|
81
61
|
|
|
62
|
+
// Search chips for character match with search term
|
|
82
63
|
var searchTermInChips = (0, _utils2.highlightSubString)(chipValues.toString(), searchTerm).match;
|
|
83
|
-
var panelSectionVisible = searchTermInHeading || searchTermInChips || searchTerm === "";
|
|
64
|
+
var panelSectionVisible = searchTermInHeading || searchTermInChips || searchTerm === "";
|
|
84
65
|
|
|
66
|
+
// Update overflow count when component is resized
|
|
85
67
|
(0, _react.useEffect)(function () {
|
|
86
68
|
var resizeObserverSupported = typeof ResizeObserver !== "undefined";
|
|
87
69
|
var wrapper = chipWrapper === null || chipWrapper === void 0 ? void 0 : chipWrapper.current;
|
|
88
70
|
var wrapperWidthObserver;
|
|
89
|
-
|
|
90
71
|
if (resizeObserverSupported && panelSectionVisible) {
|
|
91
72
|
wrapperWidthObserver = new ResizeObserver(function () {
|
|
92
73
|
updateFlowCount();
|
|
@@ -95,18 +76,16 @@ var FilterPanelSection = function FilterPanelSection(_ref) {
|
|
|
95
76
|
} else {
|
|
96
77
|
updateFlowCount();
|
|
97
78
|
}
|
|
98
|
-
|
|
99
79
|
return function () {
|
|
100
80
|
var _wrapperWidthObserver;
|
|
101
|
-
|
|
102
81
|
resizeObserverSupported && ((_wrapperWidthObserver = wrapperWidthObserver) === null || _wrapperWidthObserver === void 0 ? void 0 : _wrapperWidthObserver.disconnect());
|
|
103
82
|
};
|
|
104
|
-
}, [panelSectionVisible]);
|
|
83
|
+
}, [panelSectionVisible]);
|
|
105
84
|
|
|
85
|
+
// When overflow counter is clicked, all chips are shown
|
|
106
86
|
var showAllChips = function showAllChips() {
|
|
107
87
|
setExpanded(true);
|
|
108
88
|
};
|
|
109
|
-
|
|
110
89
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, panelSectionVisible && /*#__PURE__*/_react.default.createElement("div", {
|
|
111
90
|
className: "p-filter-panel-section"
|
|
112
91
|
}, heading && chips.length > 0 && /*#__PURE__*/_react.default.createElement("h3", {
|
|
@@ -140,7 +119,6 @@ var FilterPanelSection = function FilterPanelSection(_ref) {
|
|
|
140
119
|
tabIndex: 0
|
|
141
120
|
}, "+", overflowCounter))));
|
|
142
121
|
};
|
|
143
|
-
|
|
144
122
|
FilterPanelSection.propTypes = {
|
|
145
123
|
searchData: _propTypes.default.array.isRequired,
|
|
146
124
|
searchTerm: _propTypes.default.string.isRequired,
|
|
@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
|
|
|
9
9
|
return _FilterPanelSection.default;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
|
|
13
12
|
var _FilterPanelSection = _interopRequireDefault(require("./FilterPanelSection"));
|
|
14
|
-
|
|
15
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -17,6 +17,14 @@ export type Props = {
|
|
|
17
17
|
* A function that is called when the search data changes.
|
|
18
18
|
*/
|
|
19
19
|
returnSearchData: (searchData: SearchAndFilterChip[]) => void;
|
|
20
|
+
/**
|
|
21
|
+
* A function that is called when the filter panel is shown/hidden.
|
|
22
|
+
*/
|
|
23
|
+
onPanelToggle?: () => void;
|
|
24
|
+
/**
|
|
25
|
+
* A function that is called when the height of the search container changes.
|
|
26
|
+
*/
|
|
27
|
+
onExpandChange?: () => void;
|
|
20
28
|
};
|
|
21
|
-
declare const SearchAndFilter: ({ existingSearchData, filterPanelData, returnSearchData, ...props }: Props) => JSX.Element;
|
|
29
|
+
declare const SearchAndFilter: ({ existingSearchData, filterPanelData, returnSearchData, onPanelToggle, onExpandChange, ...props }: Props) => JSX.Element;
|
|
22
30
|
export default SearchAndFilter;
|