@hitachivantara/uikit-react-lab 3.47.3 → 3.48.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/Controls/Controls.d.ts +57 -0
- package/dist/Controls/Controls.js +197 -0
- package/dist/Controls/Controls.js.map +1 -0
- package/dist/Controls/LeftControl/LeftControl.d.ts +32 -0
- package/dist/Controls/LeftControl/LeftControl.js +130 -0
- package/dist/Controls/LeftControl/LeftControl.js.map +1 -0
- package/dist/Controls/LeftControl/index.d.ts +2 -0
- package/dist/Controls/LeftControl/index.js +16 -0
- package/dist/Controls/LeftControl/index.js.map +1 -0
- package/dist/Controls/LeftControl/styles.js +19 -0
- package/dist/Controls/LeftControl/styles.js.map +1 -0
- package/dist/Controls/RightControl/RightControl.d.ts +43 -0
- package/dist/Controls/RightControl/RightControl.js +167 -0
- package/dist/Controls/RightControl/RightControl.js.map +1 -0
- package/dist/Controls/RightControl/index.d.ts +2 -0
- package/dist/Controls/RightControl/index.js +16 -0
- package/dist/Controls/RightControl/index.js.map +1 -0
- package/dist/Controls/RightControl/styles.js +22 -0
- package/dist/Controls/RightControl/styles.js.map +1 -0
- package/dist/Controls/context/ControlsContext.js +21 -0
- package/dist/Controls/context/ControlsContext.js.map +1 -0
- package/dist/Controls/index.d.ts +3 -0
- package/dist/Controls/index.js +32 -0
- package/dist/Controls/index.js.map +1 -0
- package/dist/Controls/styles.js +30 -0
- package/dist/Controls/styles.js.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +21 -0
- package/dist/index.js.map +1 -1
- package/dist/legacy/Controls/Controls.d.ts +57 -0
- package/dist/legacy/Controls/Controls.js +174 -0
- package/dist/legacy/Controls/Controls.js.map +1 -0
- package/dist/legacy/Controls/LeftControl/LeftControl.d.ts +32 -0
- package/dist/legacy/Controls/LeftControl/LeftControl.js +91 -0
- package/dist/legacy/Controls/LeftControl/LeftControl.js.map +1 -0
- package/dist/legacy/Controls/LeftControl/index.d.ts +2 -0
- package/dist/legacy/Controls/LeftControl/index.js +2 -0
- package/dist/legacy/Controls/LeftControl/index.js.map +1 -0
- package/dist/legacy/Controls/LeftControl/styles.js +11 -0
- package/dist/legacy/Controls/LeftControl/styles.js.map +1 -0
- package/dist/legacy/Controls/RightControl/RightControl.d.ts +43 -0
- package/dist/legacy/Controls/RightControl/RightControl.js +125 -0
- package/dist/legacy/Controls/RightControl/RightControl.js.map +1 -0
- package/dist/legacy/Controls/RightControl/index.d.ts +2 -0
- package/dist/legacy/Controls/RightControl/index.js +2 -0
- package/dist/legacy/Controls/RightControl/index.js.map +1 -0
- package/dist/legacy/Controls/RightControl/styles.js +14 -0
- package/dist/legacy/Controls/RightControl/styles.js.map +1 -0
- package/dist/legacy/Controls/context/ControlsContext.js +6 -0
- package/dist/legacy/Controls/context/ControlsContext.js.map +1 -0
- package/dist/legacy/Controls/index.d.ts +3 -0
- package/dist/legacy/Controls/index.js +4 -0
- package/dist/legacy/Controls/index.js.map +1 -0
- package/dist/legacy/Controls/styles.js +22 -0
- package/dist/legacy/Controls/styles.js.map +1 -0
- package/dist/legacy/index.d.ts +3 -0
- package/dist/legacy/index.js +2 -0
- package/dist/legacy/index.js.map +1 -1
- package/dist/modern/Controls/Controls.d.ts +57 -0
- package/dist/modern/Controls/Controls.js +164 -0
- package/dist/modern/Controls/Controls.js.map +1 -0
- package/dist/modern/Controls/LeftControl/LeftControl.d.ts +32 -0
- package/dist/modern/Controls/LeftControl/LeftControl.js +90 -0
- package/dist/modern/Controls/LeftControl/LeftControl.js.map +1 -0
- package/dist/modern/Controls/LeftControl/index.d.ts +2 -0
- package/dist/modern/Controls/LeftControl/index.js +2 -0
- package/dist/modern/Controls/LeftControl/index.js.map +1 -0
- package/dist/modern/Controls/LeftControl/styles.js +9 -0
- package/dist/modern/Controls/LeftControl/styles.js.map +1 -0
- package/dist/modern/Controls/RightControl/RightControl.d.ts +43 -0
- package/dist/modern/Controls/RightControl/RightControl.js +109 -0
- package/dist/modern/Controls/RightControl/RightControl.js.map +1 -0
- package/dist/modern/Controls/RightControl/index.d.ts +2 -0
- package/dist/modern/Controls/RightControl/index.js +2 -0
- package/dist/modern/Controls/RightControl/index.js.map +1 -0
- package/dist/modern/Controls/RightControl/styles.js +12 -0
- package/dist/modern/Controls/RightControl/styles.js.map +1 -0
- package/dist/modern/Controls/context/ControlsContext.js +6 -0
- package/dist/modern/Controls/context/ControlsContext.js.map +1 -0
- package/dist/modern/Controls/index.d.ts +3 -0
- package/dist/modern/Controls/index.js +4 -0
- package/dist/modern/Controls/index.js.map +1 -0
- package/dist/modern/Controls/styles.js +20 -0
- package/dist/modern/Controls/styles.js.map +1 -0
- package/dist/modern/index.d.ts +3 -0
- package/dist/modern/index.js +2 -0
- package/dist/modern/index.js.map +1 -1
- package/package.json +4 -4
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
require("core-js/modules/es.object.keys.js");
|
|
4
|
+
|
|
5
|
+
require("core-js/modules/es.symbol.js");
|
|
6
|
+
|
|
7
|
+
require("core-js/modules/es.array.filter.js");
|
|
8
|
+
|
|
9
|
+
require("core-js/modules/es.object.get-own-property-descriptor.js");
|
|
10
|
+
|
|
11
|
+
require("core-js/modules/web.dom-collections.for-each.js");
|
|
12
|
+
|
|
13
|
+
require("core-js/modules/es.object.get-own-property-descriptors.js");
|
|
14
|
+
|
|
15
|
+
require("core-js/modules/es.string.iterator.js");
|
|
16
|
+
|
|
17
|
+
require("core-js/modules/es.weak-map.js");
|
|
18
|
+
|
|
19
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
20
|
+
|
|
21
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
22
|
+
|
|
23
|
+
Object.defineProperty(exports, "__esModule", {
|
|
24
|
+
value: true
|
|
25
|
+
});
|
|
26
|
+
exports.default = void 0;
|
|
27
|
+
|
|
28
|
+
require("core-js/modules/es.array.iterator.js");
|
|
29
|
+
|
|
30
|
+
require("core-js/modules/es.object.to-string.js");
|
|
31
|
+
|
|
32
|
+
require("core-js/modules/web.dom-collections.iterator.js");
|
|
33
|
+
|
|
34
|
+
require("core-js/modules/es.array.map.js");
|
|
35
|
+
|
|
36
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
37
|
+
|
|
38
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
39
|
+
|
|
40
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
41
|
+
|
|
42
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
43
|
+
|
|
44
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
45
|
+
|
|
46
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
47
|
+
|
|
48
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
49
|
+
|
|
50
|
+
var _core = require("@material-ui/core");
|
|
51
|
+
|
|
52
|
+
var _uikitReactCore = require("@hitachivantara/uikit-react-core");
|
|
53
|
+
|
|
54
|
+
var _styles = _interopRequireDefault(require("./styles"));
|
|
55
|
+
|
|
56
|
+
var _ControlsContext = require("../context/ControlsContext");
|
|
57
|
+
|
|
58
|
+
var _excluded = ["id", "classes", "className", "children", "values", "onSort", "hideSortBy", "sortProps"];
|
|
59
|
+
|
|
60
|
+
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); }
|
|
61
|
+
|
|
62
|
+
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; }
|
|
63
|
+
|
|
64
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
65
|
+
|
|
66
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
67
|
+
|
|
68
|
+
var HvRightControl = function HvRightControl(_ref) {
|
|
69
|
+
var id = _ref.id,
|
|
70
|
+
classes = _ref.classes,
|
|
71
|
+
className = _ref.className,
|
|
72
|
+
children = _ref.children,
|
|
73
|
+
values = _ref.values,
|
|
74
|
+
onSort = _ref.onSort,
|
|
75
|
+
_ref$hideSortBy = _ref.hideSortBy,
|
|
76
|
+
hideSortBy = _ref$hideSortBy === void 0 ? false : _ref$hideSortBy,
|
|
77
|
+
sortProps = _ref.sortProps,
|
|
78
|
+
others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
79
|
+
|
|
80
|
+
var _useState = (0, _react.useState)(values),
|
|
81
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
82
|
+
dropDownValues = _useState2[0],
|
|
83
|
+
setDropdownValues = _useState2[1];
|
|
84
|
+
|
|
85
|
+
var _useContext = (0, _react.useContext)(_ControlsContext.HvControlsContext),
|
|
86
|
+
onSortHandler = _useContext.onSort;
|
|
87
|
+
|
|
88
|
+
var handleChangeSort = function handleChangeSort(value) {
|
|
89
|
+
onSort === null || onSort === void 0 ? void 0 : onSort(value);
|
|
90
|
+
onSortHandler === null || onSortHandler === void 0 ? void 0 : onSortHandler(value); // this should be changed when dropdown changes his "values" behavior
|
|
91
|
+
|
|
92
|
+
setDropdownValues(function (prevValues) {
|
|
93
|
+
return prevValues.map(function (prevValue) {
|
|
94
|
+
return _objectSpread(_objectSpread({}, prevValue), {}, {
|
|
95
|
+
selected: prevValue.id === value.id
|
|
96
|
+
});
|
|
97
|
+
});
|
|
98
|
+
});
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
102
|
+
id: id,
|
|
103
|
+
className: (0, _clsx.default)(className, classes.root)
|
|
104
|
+
}, others), !hideSortBy && /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvDropdown, (0, _extends2.default)({
|
|
105
|
+
id: (0, _uikitReactCore.setId)(id, "sort-by-dropdown"),
|
|
106
|
+
values: dropDownValues,
|
|
107
|
+
className: classes.sortDropdown,
|
|
108
|
+
onChange: handleChangeSort,
|
|
109
|
+
singleSelectionToggle: false
|
|
110
|
+
}, sortProps)), children);
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
process.env.NODE_ENV !== "production" ? HvRightControl.propTypes = {
|
|
114
|
+
/** Children to be rendered. */
|
|
115
|
+
id: _propTypes.default.string,
|
|
116
|
+
|
|
117
|
+
/**
|
|
118
|
+
* Class names to be applied.
|
|
119
|
+
*/
|
|
120
|
+
className: _propTypes.default.string,
|
|
121
|
+
|
|
122
|
+
/** Children to be rendered. */
|
|
123
|
+
children: _propTypes.default.node,
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* the classes object to be applied.
|
|
127
|
+
*/
|
|
128
|
+
classes: _propTypes.default.shape({
|
|
129
|
+
/**
|
|
130
|
+
* Style applied to the root of the component.
|
|
131
|
+
*/
|
|
132
|
+
root: _propTypes.default.string,
|
|
133
|
+
|
|
134
|
+
/**
|
|
135
|
+
* Style applied to the dropdown in charge of sorting.
|
|
136
|
+
*/
|
|
137
|
+
sortDropdown: _propTypes.default.string
|
|
138
|
+
}).isRequired,
|
|
139
|
+
|
|
140
|
+
/** Data collection to be listed on the sort field. */
|
|
141
|
+
values: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
142
|
+
id: _propTypes.default.string,
|
|
143
|
+
accessor: _propTypes.default.string,
|
|
144
|
+
label: _propTypes.default.string,
|
|
145
|
+
selected: _propTypes.default.bool,
|
|
146
|
+
desc: _propTypes.default.bool
|
|
147
|
+
})),
|
|
148
|
+
|
|
149
|
+
/** Callback fired when the selected sort item is changed. */
|
|
150
|
+
onSort: _propTypes.default.func,
|
|
151
|
+
|
|
152
|
+
/** Boolean to control whether if the sort input should appears or not. */
|
|
153
|
+
hideSortBy: _propTypes.default.bool,
|
|
154
|
+
|
|
155
|
+
/**
|
|
156
|
+
* Extra props to be passed onto the dropdown
|
|
157
|
+
*/
|
|
158
|
+
sortProps: _propTypes.default.object
|
|
159
|
+
} : void 0;
|
|
160
|
+
|
|
161
|
+
var _default = (0, _core.withStyles)(_styles.default, {
|
|
162
|
+
name: "HvRightControl",
|
|
163
|
+
withTheme: true
|
|
164
|
+
})(HvRightControl);
|
|
165
|
+
|
|
166
|
+
exports.default = _default;
|
|
167
|
+
//# sourceMappingURL=RightControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RightControl.js","names":["HvRightControl","id","classes","className","children","values","onSort","hideSortBy","sortProps","others","dropDownValues","setDropdownValues","HvControlsContext","onSortHandler","handleChangeSort","value","prevValues","map","prevValue","selected","root","sortDropdown","propTypes","PropTypes","string","node","shape","isRequired","arrayOf","accessor","label","bool","desc","func","object","styleCreator","name","withTheme"],"sources":["../../../src/Controls/RightControl/RightControl.js"],"sourcesContent":["import React, { useContext, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvDropdown, setId } from \"@hitachivantara/uikit-react-core\";\nimport styleCreator from \"./styles\";\nimport { HvControlsContext } from \"../context/ControlsContext\";\n\nconst HvRightControl = ({\n id,\n classes,\n className,\n children,\n values,\n onSort,\n hideSortBy = false,\n sortProps,\n ...others\n}) => {\n const [dropDownValues, setDropdownValues] = useState(values);\n\n const { onSort: onSortHandler } = useContext(HvControlsContext);\n\n const handleChangeSort = (value) => {\n onSort?.(value);\n onSortHandler?.(value);\n // this should be changed when dropdown changes his \"values\" behavior\n setDropdownValues((prevValues) =>\n prevValues.map((prevValue) => ({\n ...prevValue,\n selected: prevValue.id === value.id,\n }))\n );\n };\n return (\n <div id={id} className={clsx(className, classes.root)} {...others}>\n {!hideSortBy && (\n <HvDropdown\n id={setId(id, \"sort-by-dropdown\")}\n values={dropDownValues}\n className={classes.sortDropdown}\n onChange={handleChangeSort}\n singleSelectionToggle={false}\n {...sortProps}\n />\n )}\n {children}\n </div>\n );\n};\n\nHvRightControl.propTypes = {\n /** Children to be rendered. */\n id: PropTypes.string,\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /** Children to be rendered. */\n children: PropTypes.node,\n /**\n * the classes object to be applied.\n */\n classes: PropTypes.shape({\n /**\n * Style applied to the root of the component.\n */\n root: PropTypes.string,\n /**\n * Style applied to the dropdown in charge of sorting.\n */\n sortDropdown: PropTypes.string,\n }).isRequired,\n /** Data collection to be listed on the sort field. */\n values: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n accessor: PropTypes.string,\n label: PropTypes.string,\n selected: PropTypes.bool,\n desc: PropTypes.bool,\n })\n ),\n /** Callback fired when the selected sort item is changed. */\n onSort: PropTypes.func,\n /** Boolean to control whether if the sort input should appears or not. */\n hideSortBy: PropTypes.bool,\n /**\n * Extra props to be passed onto the dropdown\n */\n sortProps: PropTypes.object,\n};\n\nexport default withStyles(styleCreator, { name: \"HvRightControl\", withTheme: true })(\n HvRightControl\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,OAUjB;EAAA,IATJC,EASI,QATJA,EASI;EAAA,IARJC,OAQI,QARJA,OAQI;EAAA,IAPJC,SAOI,QAPJA,SAOI;EAAA,IANJC,QAMI,QANJA,QAMI;EAAA,IALJC,MAKI,QALJA,MAKI;EAAA,IAJJC,MAII,QAJJA,MAII;EAAA,2BAHJC,UAGI;EAAA,IAHJA,UAGI,gCAHS,KAGT;EAAA,IAFJC,SAEI,QAFJA,SAEI;EAAA,IADDC,MACC;;EACJ,gBAA4C,qBAASJ,MAAT,CAA5C;EAAA;EAAA,IAAOK,cAAP;EAAA,IAAuBC,iBAAvB;;EAEA,kBAAkC,uBAAWC,kCAAX,CAAlC;EAAA,IAAgBC,aAAhB,eAAQP,MAAR;;EAEA,IAAMQ,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAAW;IAClCT,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM,CAAGS,KAAH,CAAN;IACAF,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGE,KAAH,CAAb,CAFkC,CAGlC;;IACAJ,iBAAiB,CAAC,UAACK,UAAD;MAAA,OAChBA,UAAU,CAACC,GAAX,CAAe,UAACC,SAAD;QAAA,uCACVA,SADU;UAEbC,QAAQ,EAAED,SAAS,CAACjB,EAAV,KAAiBc,KAAK,CAACd;QAFpB;MAAA,CAAf,CADgB;IAAA,CAAD,CAAjB;EAMD,CAVD;;EAWA,oBACE;IAAK,EAAE,EAAEA,EAAT;IAAa,SAAS,EAAE,mBAAKE,SAAL,EAAgBD,OAAO,CAACkB,IAAxB;EAAxB,GAA2DX,MAA3D,GACG,CAACF,UAAD,iBACC,6BAAC,0BAAD;IACE,EAAE,EAAE,2BAAMN,EAAN,EAAU,kBAAV,CADN;IAEE,MAAM,EAAES,cAFV;IAGE,SAAS,EAAER,OAAO,CAACmB,YAHrB;IAIE,QAAQ,EAAEP,gBAJZ;IAKE,qBAAqB,EAAE;EALzB,GAMMN,SANN,EAFJ,EAWGJ,QAXH,CADF;AAeD,CAzCD;;AA2CA,wCAAAJ,cAAc,CAACsB,SAAf,GAA2B;EACzB;EACArB,EAAE,EAAEsB,mBAAUC,MAFW;;EAGzB;AACF;AACA;EACErB,SAAS,EAAEoB,mBAAUC,MANI;;EAOzB;EACApB,QAAQ,EAAEmB,mBAAUE,IARK;;EASzB;AACF;AACA;EACEvB,OAAO,EAAEqB,mBAAUG,KAAV,CAAgB;IACvB;AACJ;AACA;IACIN,IAAI,EAAEG,mBAAUC,MAJO;;IAKvB;AACJ;AACA;IACIH,YAAY,EAAEE,mBAAUC;EARD,CAAhB,EASNG,UArBsB;;EAsBzB;EACAtB,MAAM,EAAEkB,mBAAUK,OAAV,CACNL,mBAAUG,KAAV,CAAgB;IACdzB,EAAE,EAAEsB,mBAAUC,MADA;IAEdK,QAAQ,EAAEN,mBAAUC,MAFN;IAGdM,KAAK,EAAEP,mBAAUC,MAHH;IAIdL,QAAQ,EAAEI,mBAAUQ,IAJN;IAKdC,IAAI,EAAET,mBAAUQ;EALF,CAAhB,CADM,CAvBiB;;EAgCzB;EACAzB,MAAM,EAAEiB,mBAAUU,IAjCO;;EAkCzB;EACA1B,UAAU,EAAEgB,mBAAUQ,IAnCG;;EAoCzB;AACF;AACA;EACEvB,SAAS,EAAEe,mBAAUW;AAvCI,CAA3B;;eA0Ce,sBAAWC,eAAX,EAAyB;EAAEC,IAAI,EAAE,gBAAR;EAA0BC,SAAS,EAAE;AAArC,CAAzB,EACbrC,cADa,C"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "default", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _RightControl.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
var _RightControl = _interopRequireDefault(require("./RightControl"));
|
|
16
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/Controls/RightControl/index.js"],"sourcesContent":["export { default } from \"./RightControl\";\n"],"mappings":";;;;;;;;;;;;;;AAAA"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var styles = function styles() {
|
|
9
|
+
return {
|
|
10
|
+
root: {
|
|
11
|
+
display: "inline-flex",
|
|
12
|
+
gap: 10
|
|
13
|
+
},
|
|
14
|
+
sortDropdown: {
|
|
15
|
+
minWidth: 200
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
var _default = styles;
|
|
21
|
+
exports.default = _default;
|
|
22
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","names":["styles","root","display","gap","sortDropdown","minWidth"],"sources":["../../../src/Controls/RightControl/styles.js"],"sourcesContent":["const styles = () => ({\n root: {\n display: \"inline-flex\",\n gap: 10,\n },\n sortDropdown: {\n minWidth: 200,\n },\n});\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA,IAAMA,MAAM,GAAG,SAATA,MAAS;EAAA,OAAO;IACpBC,IAAI,EAAE;MACJC,OAAO,EAAE,aADL;MAEJC,GAAG,EAAE;IAFD,CADc;IAKpBC,YAAY,EAAE;MACZC,QAAQ,EAAE;IADE;EALM,CAAP;AAAA,CAAf;;eAUeL,M"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = exports.HvControlsContextProvider = exports.HvControlsContextConsumer = exports.HvControlsContext = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var HvControlsContext = /*#__PURE__*/_react.default.createContext({});
|
|
13
|
+
|
|
14
|
+
exports.HvControlsContext = HvControlsContext;
|
|
15
|
+
var HvControlsContextProvider = HvControlsContext.Provider;
|
|
16
|
+
exports.HvControlsContextProvider = HvControlsContextProvider;
|
|
17
|
+
var HvControlsContextConsumer = HvControlsContext.Consumer;
|
|
18
|
+
exports.HvControlsContextConsumer = HvControlsContextConsumer;
|
|
19
|
+
var _default = HvControlsContext;
|
|
20
|
+
exports.default = _default;
|
|
21
|
+
//# sourceMappingURL=ControlsContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ControlsContext.js","names":["HvControlsContext","React","createContext","HvControlsContextProvider","Provider","HvControlsContextConsumer","Consumer"],"sources":["../../../src/Controls/context/ControlsContext.js"],"sourcesContent":["import React from \"react\";\n\nexport const HvControlsContext = React.createContext({});\n\nexport const HvControlsContextProvider = HvControlsContext.Provider;\nexport const HvControlsContextConsumer = HvControlsContext.Consumer;\nexport default HvControlsContext;\n"],"mappings":";;;;;;;;;AAAA;;AAEO,IAAMA,iBAAiB,gBAAGC,eAAMC,aAAN,CAAoB,EAApB,CAA1B;;;AAEA,IAAMC,yBAAyB,GAAGH,iBAAiB,CAACI,QAApD;;AACA,IAAMC,yBAAyB,GAAGL,iBAAiB,CAACM,QAApD;;eACQN,iB"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "HvLeftControl", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _LeftControl.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "HvRightControl", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function get() {
|
|
17
|
+
return _RightControl.default;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
Object.defineProperty(exports, "default", {
|
|
21
|
+
enumerable: true,
|
|
22
|
+
get: function get() {
|
|
23
|
+
return _Controls.default;
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
var _Controls = _interopRequireDefault(require("./Controls"));
|
|
28
|
+
|
|
29
|
+
var _LeftControl = _interopRequireDefault(require("./LeftControl"));
|
|
30
|
+
|
|
31
|
+
var _RightControl = _interopRequireDefault(require("./RightControl"));
|
|
32
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/Controls/index.js"],"sourcesContent":["export { default } from \"./Controls\";\nexport { default as HvLeftControl } from \"./LeftControl\";\nexport { default as HvRightControl } from \"./RightControl\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var styles = function styles() {
|
|
9
|
+
return {
|
|
10
|
+
root: {
|
|
11
|
+
display: "inline-flex",
|
|
12
|
+
width: "100%",
|
|
13
|
+
justifyContent: "space-between"
|
|
14
|
+
},
|
|
15
|
+
section: {
|
|
16
|
+
display: "inline-flex",
|
|
17
|
+
alignItems: "flex-end",
|
|
18
|
+
gap: 10
|
|
19
|
+
},
|
|
20
|
+
leftSection: {},
|
|
21
|
+
rightSection: {},
|
|
22
|
+
sortInput: {
|
|
23
|
+
minWidth: 200
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
var _default = styles;
|
|
29
|
+
exports.default = _default;
|
|
30
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","names":["styles","root","display","width","justifyContent","section","alignItems","gap","leftSection","rightSection","sortInput","minWidth"],"sources":["../../src/Controls/styles.js"],"sourcesContent":["const styles = () => ({\n root: {\n display: \"inline-flex\",\n width: \"100%\",\n justifyContent: \"space-between\",\n },\n section: {\n display: \"inline-flex\",\n alignItems: \"flex-end\",\n gap: 10,\n },\n leftSection: {},\n rightSection: {},\n sortInput: {\n minWidth: 200,\n },\n});\n\nexport default styles;\n"],"mappings":";;;;;;;AAAA,IAAMA,MAAM,GAAG,SAATA,MAAS;EAAA,OAAO;IACpBC,IAAI,EAAE;MACJC,OAAO,EAAE,aADL;MAEJC,KAAK,EAAE,MAFH;MAGJC,cAAc,EAAE;IAHZ,CADc;IAMpBC,OAAO,EAAE;MACPH,OAAO,EAAE,aADF;MAEPI,UAAU,EAAE,UAFL;MAGPC,GAAG,EAAE;IAHE,CANW;IAWpBC,WAAW,EAAE,EAXO;IAYpBC,YAAY,EAAE,EAZM;IAapBC,SAAS,EAAE;MACTC,QAAQ,EAAE;IADD;EAbS,CAAP;AAAA,CAAf;;eAkBeX,M"}
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -36,6 +36,7 @@ var _exportNames = {
|
|
|
36
36
|
HvDrawer: true,
|
|
37
37
|
HvColorPicker: true,
|
|
38
38
|
HvQueryBuilder: true,
|
|
39
|
+
HvControls: true,
|
|
39
40
|
HvInlineEditor: true,
|
|
40
41
|
HvProgressBar: true,
|
|
41
42
|
HvDotPagination: true
|
|
@@ -52,6 +53,12 @@ Object.defineProperty(exports, "HvColorPicker", {
|
|
|
52
53
|
return _ColorPicker.default;
|
|
53
54
|
}
|
|
54
55
|
});
|
|
56
|
+
Object.defineProperty(exports, "HvControls", {
|
|
57
|
+
enumerable: true,
|
|
58
|
+
get: function get() {
|
|
59
|
+
return _Controls.default;
|
|
60
|
+
}
|
|
61
|
+
});
|
|
55
62
|
Object.defineProperty(exports, "HvDotPagination", {
|
|
56
63
|
enumerable: true,
|
|
57
64
|
get: function get() {
|
|
@@ -203,6 +210,20 @@ Object.keys(_QueryBuilder).forEach(function (key) {
|
|
|
203
210
|
});
|
|
204
211
|
});
|
|
205
212
|
|
|
213
|
+
var _Controls = _interopRequireWildcard(require("./Controls"));
|
|
214
|
+
|
|
215
|
+
Object.keys(_Controls).forEach(function (key) {
|
|
216
|
+
if (key === "default" || key === "__esModule") return;
|
|
217
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
218
|
+
if (key in exports && exports[key] === _Controls[key]) return;
|
|
219
|
+
Object.defineProperty(exports, key, {
|
|
220
|
+
enumerable: true,
|
|
221
|
+
get: function get() {
|
|
222
|
+
return _Controls[key];
|
|
223
|
+
}
|
|
224
|
+
});
|
|
225
|
+
});
|
|
226
|
+
|
|
206
227
|
var _InlineEditor = _interopRequireDefault(require("./InlineEditor"));
|
|
207
228
|
|
|
208
229
|
var _ProgressBar = _interopRequireDefault(require("./ProgressBar"));
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../src/index.js"],"sourcesContent":["// components\nexport { default as HvAppSwitcherPanel } from \"./AppSwitcherPanel\";\nexport * from \"./AppSwitcherPanel\";\nexport { default as HvFormComposer } from \"./FormComposer\";\nexport { default as HvNavigationAnchors } from \"./NavigationAnchors\";\nexport { default as HvNotificationPanel } from \"./NotificationPanel\";\nexport { default as HvSlider } from \"./Slider\";\nexport { default as HvTable } from \"./Table\";\nexport * from \"./Table\";\nexport { default as HvTimeAgo } from \"./TimeAgo\";\nexport * from \"./TimeAgo\";\nexport { default as HvTimePicker } from \"./TimePicker\";\nexport { default as HvTag } from \"./Tag\";\nexport { default as HvDrawer } from \"./Drawer\";\nexport { default as HvColorPicker } from \"./ColorPicker\";\nexport { default as HvQueryBuilder } from \"./QueryBuilder\";\nexport * from \"./QueryBuilder\";\nexport { default as HvInlineEditor } from \"./InlineEditor\";\nexport { default as HvProgressBar } from \"./ProgressBar\";\nexport { default as HvDotPagination } from \"./DotPagination\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../src/index.js"],"sourcesContent":["// components\nexport { default as HvAppSwitcherPanel } from \"./AppSwitcherPanel\";\nexport * from \"./AppSwitcherPanel\";\nexport { default as HvFormComposer } from \"./FormComposer\";\nexport { default as HvNavigationAnchors } from \"./NavigationAnchors\";\nexport { default as HvNotificationPanel } from \"./NotificationPanel\";\nexport { default as HvSlider } from \"./Slider\";\nexport { default as HvTable } from \"./Table\";\nexport * from \"./Table\";\nexport { default as HvTimeAgo } from \"./TimeAgo\";\nexport * from \"./TimeAgo\";\nexport { default as HvTimePicker } from \"./TimePicker\";\nexport { default as HvTag } from \"./Tag\";\nexport { default as HvDrawer } from \"./Drawer\";\nexport { default as HvColorPicker } from \"./ColorPicker\";\nexport { default as HvQueryBuilder } from \"./QueryBuilder\";\nexport { default as HvControls } from \"./Controls\";\nexport * from \"./Controls\";\nexport * from \"./QueryBuilder\";\nexport { default as HvInlineEditor } from \"./InlineEditor\";\nexport { default as HvProgressBar } from \"./ProgressBar\";\nexport { default as HvDotPagination } from \"./DotPagination\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAFA;;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAEA;;AACA;;AACA"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { StandardProps } from "@material-ui/core";
|
|
2
|
+
|
|
3
|
+
export type HvControlsClassKey = "root" | "rightSection" | "leftSection";
|
|
4
|
+
|
|
5
|
+
export interface HvControlsSortValue {
|
|
6
|
+
id: string;
|
|
7
|
+
desc: string;
|
|
8
|
+
}
|
|
9
|
+
export interface HvControlsViewConfiguration extends Record<string, unknown> {
|
|
10
|
+
setSortBy?: (v: HvControlsSortValue[]) => void;
|
|
11
|
+
setGlobalFilter?: (v: string) => void;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export interface HvControlsCallbacks extends Record<string, unknown> {
|
|
15
|
+
id: string;
|
|
16
|
+
label: string;
|
|
17
|
+
icon: React.ReactNode;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
export interface HvControlsProps
|
|
21
|
+
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvControlsClassKey> {
|
|
22
|
+
/** Children to be rendered. */
|
|
23
|
+
id?: string;
|
|
24
|
+
/**
|
|
25
|
+
* Class names to be applied.
|
|
26
|
+
*/
|
|
27
|
+
className?: string;
|
|
28
|
+
/**
|
|
29
|
+
* An instance of useHvTable or useTable used to manage the data
|
|
30
|
+
* if this is not provided data sorting and search must be handled externally
|
|
31
|
+
*/
|
|
32
|
+
callbacks?: HvControlsCallbacks;
|
|
33
|
+
/**
|
|
34
|
+
* Views configuration required for the view buttons
|
|
35
|
+
*/
|
|
36
|
+
views?: HvControlsViewConfiguration[];
|
|
37
|
+
/**
|
|
38
|
+
* What view is selected by default
|
|
39
|
+
*/
|
|
40
|
+
defaultView?: string;
|
|
41
|
+
/**
|
|
42
|
+
* Sets the selected view to be the one specified
|
|
43
|
+
* if specified the component is in a controlled state and it won't change it state
|
|
44
|
+
* unless specified externally
|
|
45
|
+
*/
|
|
46
|
+
selectedView?: string;
|
|
47
|
+
/**
|
|
48
|
+
* Callback called when the view switcher button is pressed
|
|
49
|
+
*/
|
|
50
|
+
onViewChange?: (event: Event, id: string) => void;
|
|
51
|
+
/**
|
|
52
|
+
* if `true` the button to switch views is not rendered
|
|
53
|
+
*/
|
|
54
|
+
hideViewSwitcher?: boolean;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
export default function HvControls(props: HvControlsProps): JSX.Element | null;
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
|
+
var _excluded = ["id", "icon"];
|
|
5
|
+
import "core-js/modules/es.array.slice.js";
|
|
6
|
+
import "core-js/modules/es.array.map.js";
|
|
7
|
+
import React from "react";
|
|
8
|
+
import PropTypes from "prop-types";
|
|
9
|
+
import clsx from "clsx";
|
|
10
|
+
import { withStyles } from "@material-ui/core";
|
|
11
|
+
import { useControlled, HvMultiButton, HvButton, setId } from "@hitachivantara/uikit-react-core";
|
|
12
|
+
import { HvControlsContextProvider } from "./context/ControlsContext";
|
|
13
|
+
import styleCreator from "./styles";
|
|
14
|
+
/** Controls it's a group of features used to control data that can be rendered using different views (table, cards, list). */
|
|
15
|
+
|
|
16
|
+
var HvControls = function HvControls(_ref) {
|
|
17
|
+
var id = _ref.id,
|
|
18
|
+
views = _ref.views,
|
|
19
|
+
classes = _ref.classes,
|
|
20
|
+
className = _ref.className,
|
|
21
|
+
callbacks = _ref.callbacks,
|
|
22
|
+
selectedView = _ref.selectedView,
|
|
23
|
+
defaultView = _ref.defaultView,
|
|
24
|
+
children = _ref.children,
|
|
25
|
+
_ref$hideViewSwitcher = _ref.hideViewSwitcher,
|
|
26
|
+
hideViewSwitcher = _ref$hideViewSwitcher === void 0 ? false : _ref$hideViewSwitcher,
|
|
27
|
+
onViewChange = _ref.onViewChange;
|
|
28
|
+
|
|
29
|
+
var _useControlled = useControlled(selectedView, defaultView),
|
|
30
|
+
_useControlled2 = _slicedToArray(_useControlled, 2),
|
|
31
|
+
currentView = _useControlled2[0],
|
|
32
|
+
setCurrentView = _useControlled2[1];
|
|
33
|
+
|
|
34
|
+
var onViewChangeHandler = function onViewChangeHandler(evt, btnId) {
|
|
35
|
+
setCurrentView(btnId);
|
|
36
|
+
onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(evt, btnId);
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
var onSearchHandler = function onSearchHandler(value) {
|
|
40
|
+
return callbacks === null || callbacks === void 0 ? void 0 : callbacks.setGlobalFilter(value);
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
var onSortHandler = function onSortHandler(value) {
|
|
44
|
+
return callbacks === null || callbacks === void 0 ? void 0 : callbacks.setSortBy([{
|
|
45
|
+
id: value === null || value === void 0 ? void 0 : value.accessor,
|
|
46
|
+
desc: value === null || value === void 0 ? void 0 : value.desc
|
|
47
|
+
}]);
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
var childrenIndexCut = (children === null || children === void 0 ? void 0 : children.length) > 0 ? Math.round(children.length * 0.5) : 0;
|
|
51
|
+
var leftChildren = children.slice(0, childrenIndexCut);
|
|
52
|
+
var rightChildren = children.slice(childrenIndexCut, (children === null || children === void 0 ? void 0 : children.length) || 0);
|
|
53
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
54
|
+
id: id,
|
|
55
|
+
className: clsx(className, classes.root)
|
|
56
|
+
}, /*#__PURE__*/React.createElement(HvControlsContextProvider, {
|
|
57
|
+
value: {
|
|
58
|
+
onSearch: onSearchHandler,
|
|
59
|
+
onSort: onSortHandler
|
|
60
|
+
}
|
|
61
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
62
|
+
className: clsx(classes.section, classes.leftSection)
|
|
63
|
+
}, leftChildren), /*#__PURE__*/React.createElement("div", {
|
|
64
|
+
className: clsx(classes.section, classes.rightSection)
|
|
65
|
+
}, rightChildren, !hideViewSwitcher && (views === null || views === void 0 ? void 0 : views.length) > 0 && /*#__PURE__*/React.createElement(HvMultiButton, {
|
|
66
|
+
id: setId(id, "view-multi-button")
|
|
67
|
+
}, views === null || views === void 0 ? void 0 : views.map(function (_ref2) {
|
|
68
|
+
var btnId = _ref2.id,
|
|
69
|
+
icon = _ref2.icon,
|
|
70
|
+
others = _objectWithoutProperties(_ref2, _excluded);
|
|
71
|
+
|
|
72
|
+
return /*#__PURE__*/React.createElement(HvButton, _extends({
|
|
73
|
+
id: btnId,
|
|
74
|
+
key: btnId,
|
|
75
|
+
icon: true,
|
|
76
|
+
selected: currentView === btnId,
|
|
77
|
+
onClick: function onClick(evt) {
|
|
78
|
+
return onViewChangeHandler(evt, btnId);
|
|
79
|
+
}
|
|
80
|
+
}, others), icon);
|
|
81
|
+
})))));
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
process.env.NODE_ENV !== "production" ? HvControls.propTypes = {
|
|
85
|
+
/** Children to be rendered. */
|
|
86
|
+
id: PropTypes.string,
|
|
87
|
+
|
|
88
|
+
/**
|
|
89
|
+
* Class names to be applied.
|
|
90
|
+
*/
|
|
91
|
+
className: PropTypes.string,
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
* Children elements to be rendered
|
|
95
|
+
*/
|
|
96
|
+
children: PropTypes.node,
|
|
97
|
+
|
|
98
|
+
/**
|
|
99
|
+
* An instance of useHvTable or useTable used to manage the data
|
|
100
|
+
* if this is not provided data sorting and search must be handled externally
|
|
101
|
+
*/
|
|
102
|
+
callbacks: PropTypes.shape({
|
|
103
|
+
/**
|
|
104
|
+
* Callback used by the .
|
|
105
|
+
*/
|
|
106
|
+
setSortBy: PropTypes.func,
|
|
107
|
+
|
|
108
|
+
/**
|
|
109
|
+
* Callback used by the search input to filter data across all fields
|
|
110
|
+
*/
|
|
111
|
+
setGlobalFilter: PropTypes.func
|
|
112
|
+
}),
|
|
113
|
+
|
|
114
|
+
/**
|
|
115
|
+
* Views configuration required for the view buttons
|
|
116
|
+
*/
|
|
117
|
+
views: PropTypes.arrayOf(PropTypes.shape({
|
|
118
|
+
label: PropTypes.string,
|
|
119
|
+
icon: PropTypes.node,
|
|
120
|
+
id: PropTypes.string
|
|
121
|
+
})),
|
|
122
|
+
|
|
123
|
+
/**
|
|
124
|
+
* the classes object to be applied into the root object.
|
|
125
|
+
*/
|
|
126
|
+
classes: PropTypes.shape({
|
|
127
|
+
/**
|
|
128
|
+
* Style applied to the root of the component.
|
|
129
|
+
*/
|
|
130
|
+
root: PropTypes.string,
|
|
131
|
+
|
|
132
|
+
/**
|
|
133
|
+
* Right box of the controls
|
|
134
|
+
*/
|
|
135
|
+
rightSection: PropTypes.string,
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* Left box of the controls
|
|
139
|
+
*/
|
|
140
|
+
leftSection: PropTypes.string,
|
|
141
|
+
|
|
142
|
+
/**
|
|
143
|
+
* common styles for left and right controls
|
|
144
|
+
*/
|
|
145
|
+
section: PropTypes.string
|
|
146
|
+
}).isRequired,
|
|
147
|
+
|
|
148
|
+
/**
|
|
149
|
+
* What view is selected by default
|
|
150
|
+
*/
|
|
151
|
+
defaultView: PropTypes.string,
|
|
152
|
+
|
|
153
|
+
/**
|
|
154
|
+
* Sets the selected view to be the one specified
|
|
155
|
+
* if specified the component is in a controlled state and it won't change it state
|
|
156
|
+
* unless specified externally
|
|
157
|
+
*/
|
|
158
|
+
selectedView: PropTypes.string,
|
|
159
|
+
|
|
160
|
+
/**
|
|
161
|
+
* Callback called when the view switcher button is pressed
|
|
162
|
+
*/
|
|
163
|
+
onViewChange: PropTypes.func,
|
|
164
|
+
|
|
165
|
+
/**
|
|
166
|
+
* if `true` the button to switch views is not rendered
|
|
167
|
+
*/
|
|
168
|
+
hideViewSwitcher: PropTypes.bool
|
|
169
|
+
} : void 0;
|
|
170
|
+
export default withStyles(styleCreator, {
|
|
171
|
+
name: "HvControls",
|
|
172
|
+
withTheme: true
|
|
173
|
+
})(HvControls);
|
|
174
|
+
//# sourceMappingURL=Controls.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Controls.js","names":["React","PropTypes","clsx","withStyles","useControlled","HvMultiButton","HvButton","setId","HvControlsContextProvider","styleCreator","HvControls","id","views","classes","className","callbacks","selectedView","defaultView","children","hideViewSwitcher","onViewChange","currentView","setCurrentView","onViewChangeHandler","evt","btnId","onSearchHandler","value","setGlobalFilter","onSortHandler","setSortBy","accessor","desc","childrenIndexCut","length","Math","round","leftChildren","slice","rightChildren","root","onSearch","onSort","section","leftSection","rightSection","map","icon","others","propTypes","string","node","shape","func","arrayOf","label","isRequired","bool","name","withTheme"],"sources":["../../../src/Controls/Controls.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { useControlled, HvMultiButton, HvButton, setId } from \"@hitachivantara/uikit-react-core\";\nimport { HvControlsContextProvider } from \"./context/ControlsContext\";\nimport styleCreator from \"./styles\";\n\n/** Controls it's a group of features used to control data that can be rendered using different views (table, cards, list). */\nconst HvControls = ({\n id,\n views,\n classes,\n className,\n callbacks,\n selectedView,\n defaultView,\n children,\n hideViewSwitcher = false,\n onViewChange,\n}) => {\n const [currentView, setCurrentView] = useControlled(selectedView, defaultView);\n\n const onViewChangeHandler = (evt, btnId) => {\n setCurrentView(btnId);\n onViewChange?.(evt, btnId);\n };\n\n const onSearchHandler = (value) => callbacks?.setGlobalFilter(value);\n const onSortHandler = (value) =>\n callbacks?.setSortBy([\n {\n id: value?.accessor,\n desc: value?.desc,\n },\n ]);\n const childrenIndexCut = children?.length > 0 ? Math.round(children.length * 0.5) : 0;\n const leftChildren = children.slice(0, childrenIndexCut);\n const rightChildren = children.slice(childrenIndexCut, children?.length || 0);\n return (\n <div id={id} className={clsx(className, classes.root)}>\n <HvControlsContextProvider\n value={{\n onSearch: onSearchHandler,\n onSort: onSortHandler,\n }}\n >\n <div className={clsx(classes.section, classes.leftSection)}>{leftChildren}</div>\n <div className={clsx(classes.section, classes.rightSection)}>\n {rightChildren}\n {!hideViewSwitcher && views?.length > 0 && (\n <HvMultiButton id={setId(id, \"view-multi-button\")}>\n {views?.map(({ id: btnId, icon, ...others }) => (\n <HvButton\n id={btnId}\n key={btnId}\n icon\n selected={currentView === btnId}\n onClick={(evt) => onViewChangeHandler(evt, btnId)}\n {...others}\n >\n {icon}\n </HvButton>\n ))}\n </HvMultiButton>\n )}\n </div>\n </HvControlsContextProvider>\n </div>\n );\n};\n\nHvControls.propTypes = {\n /** Children to be rendered. */\n id: PropTypes.string,\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * Children elements to be rendered\n */\n children: PropTypes.node,\n /**\n * An instance of useHvTable or useTable used to manage the data\n * if this is not provided data sorting and search must be handled externally\n */\n callbacks: PropTypes.shape({\n /**\n * Callback used by the .\n */\n setSortBy: PropTypes.func,\n /**\n * Callback used by the search input to filter data across all fields\n */\n setGlobalFilter: PropTypes.func,\n }),\n /**\n * Views configuration required for the view buttons\n */\n views: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string,\n icon: PropTypes.node,\n id: PropTypes.string,\n })\n ),\n /**\n * the classes object to be applied into the root object.\n */\n classes: PropTypes.shape({\n /**\n * Style applied to the root of the component.\n */\n root: PropTypes.string,\n /**\n * Right box of the controls\n */\n rightSection: PropTypes.string,\n /**\n * Left box of the controls\n */\n leftSection: PropTypes.string,\n /**\n * common styles for left and right controls\n */\n section: PropTypes.string,\n }).isRequired,\n /**\n * What view is selected by default\n */\n defaultView: PropTypes.string,\n /**\n * Sets the selected view to be the one specified\n * if specified the component is in a controlled state and it won't change it state\n * unless specified externally\n */\n selectedView: PropTypes.string,\n /**\n * Callback called when the view switcher button is pressed\n */\n onViewChange: PropTypes.func,\n /**\n * if `true` the button to switch views is not rendered\n */\n hideViewSwitcher: PropTypes.bool,\n};\n\nexport default withStyles(styleCreator, { name: \"HvControls\", withTheme: true })(HvControls);\n"],"mappings":"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"}
|