@hitachivantara/uikit-react-lab 3.47.3 → 3.49.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/QueryBuilder/Rule/Rule.js +0 -2
- package/dist/QueryBuilder/Rule/Rule.js.map +1 -1
- package/dist/QueryBuilder/RuleGroup/RuleGroup.js +6 -2
- package/dist/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
- package/dist/QueryBuilder/{types.ts → types.d.ts} +1 -1
- package/dist/Table/TableBody/TableBody.js +1 -3
- package/dist/Table/TableBody/TableBody.js.map +1 -1
- 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/QueryBuilder/Rule/Rule.js +0 -2
- package/dist/legacy/QueryBuilder/Rule/Rule.js.map +1 -1
- package/dist/legacy/QueryBuilder/RuleGroup/RuleGroup.js +6 -2
- package/dist/legacy/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
- package/dist/legacy/QueryBuilder/{types.ts → types.d.ts} +1 -1
- package/dist/legacy/Table/TableBody/TableBody.js +2 -3
- package/dist/legacy/Table/TableBody/TableBody.js.map +1 -1
- 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/QueryBuilder/Rule/Rule.js +0 -2
- package/dist/modern/QueryBuilder/Rule/Rule.js.map +1 -1
- package/dist/modern/QueryBuilder/RuleGroup/RuleGroup.js +6 -2
- package/dist/modern/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
- package/dist/modern/QueryBuilder/{types.ts → types.d.ts} +1 -1
- package/dist/modern/Table/TableBody/TableBody.js +2 -3
- package/dist/modern/Table/TableBody/TableBody.js.map +1 -1
- 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 +22 -28
|
@@ -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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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { StandardProps } from "@material-ui/core";
|
|
2
|
+
import { HvInputProps } from "@hitachivantara/uikit-react-core";
|
|
3
|
+
|
|
4
|
+
export type HvLeftControlClassKey = "root";
|
|
5
|
+
|
|
6
|
+
export interface HvLeftControlProps
|
|
7
|
+
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvLeftControlClassKey> {
|
|
8
|
+
/** Children to be rendered. */
|
|
9
|
+
id?: string;
|
|
10
|
+
/**
|
|
11
|
+
* Class names to be applied.
|
|
12
|
+
*/
|
|
13
|
+
className?: string;
|
|
14
|
+
/**
|
|
15
|
+
* if `true` the hide sort by dropdown is not rendered
|
|
16
|
+
*/
|
|
17
|
+
hideSearch?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* placeholder of the input
|
|
20
|
+
*/
|
|
21
|
+
placeholder?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Callback called when a search action occurs
|
|
24
|
+
*/
|
|
25
|
+
onSearch?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;
|
|
26
|
+
/**
|
|
27
|
+
* Extra props passed to input
|
|
28
|
+
*/
|
|
29
|
+
searchProps?: HvInputProps;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export default function HvLeftControl(props: HvLeftControlProps): JSX.Element | null;
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["id", "classes", "className", "children", "placeholder", "onSearch", "hideSearch", "searchProps"];
|
|
4
|
+
import React, { useContext } from "react";
|
|
5
|
+
import clsx from "clsx";
|
|
6
|
+
import PropTypes from "prop-types";
|
|
7
|
+
import { withStyles } from "@material-ui/core";
|
|
8
|
+
import { HvInput, setId } from "@hitachivantara/uikit-react-core";
|
|
9
|
+
import { HvControlsContext } from "../context/ControlsContext";
|
|
10
|
+
import styleCreator from "./styles";
|
|
11
|
+
|
|
12
|
+
var HvLeftControl = function HvLeftControl(_ref) {
|
|
13
|
+
var id = _ref.id,
|
|
14
|
+
classes = _ref.classes,
|
|
15
|
+
className = _ref.className,
|
|
16
|
+
children = _ref.children,
|
|
17
|
+
_ref$placeholder = _ref.placeholder,
|
|
18
|
+
placeholder = _ref$placeholder === void 0 ? "Search" : _ref$placeholder,
|
|
19
|
+
onSearch = _ref.onSearch,
|
|
20
|
+
_ref$hideSearch = _ref.hideSearch,
|
|
21
|
+
hideSearch = _ref$hideSearch === void 0 ? false : _ref$hideSearch,
|
|
22
|
+
searchProps = _ref.searchProps,
|
|
23
|
+
others = _objectWithoutProperties(_ref, _excluded);
|
|
24
|
+
|
|
25
|
+
var _useContext = useContext(HvControlsContext),
|
|
26
|
+
onSearchHandler = _useContext.onSearch;
|
|
27
|
+
|
|
28
|
+
var onChangeFilter = function onChangeFilter(e, value) {
|
|
29
|
+
onSearch === null || onSearch === void 0 ? void 0 : onSearch(e, value);
|
|
30
|
+
onSearchHandler === null || onSearchHandler === void 0 ? void 0 : onSearchHandler(value);
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
return /*#__PURE__*/React.createElement("div", _extends({
|
|
34
|
+
id: id,
|
|
35
|
+
className: clsx(className, classes.root)
|
|
36
|
+
}, others), !hideSearch && /*#__PURE__*/React.createElement(HvInput, _extends({
|
|
37
|
+
id: setId(id, "search-input"),
|
|
38
|
+
type: "search",
|
|
39
|
+
placeholder: placeholder,
|
|
40
|
+
onChange: function onChange(e, value) {
|
|
41
|
+
return onChangeFilter(e, value);
|
|
42
|
+
}
|
|
43
|
+
}, searchProps)), children);
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
process.env.NODE_ENV !== "production" ? HvLeftControl.propTypes = {
|
|
47
|
+
/** Children to be rendered. */
|
|
48
|
+
id: PropTypes.string,
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* Class names to be applied.
|
|
52
|
+
*/
|
|
53
|
+
className: PropTypes.string,
|
|
54
|
+
|
|
55
|
+
/** Children to be rendered. */
|
|
56
|
+
children: PropTypes.node,
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* the classes object to be applied.
|
|
60
|
+
*/
|
|
61
|
+
classes: PropTypes.shape({
|
|
62
|
+
/**
|
|
63
|
+
* Style applied to the root of the component.
|
|
64
|
+
*/
|
|
65
|
+
root: PropTypes.string,
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* Style applied to the dropdown in charge of sorting.
|
|
69
|
+
*/
|
|
70
|
+
sortDropdown: PropTypes.string
|
|
71
|
+
}).isRequired,
|
|
72
|
+
|
|
73
|
+
/** Placeholder text to be show within the search input. */
|
|
74
|
+
placeholder: PropTypes.string,
|
|
75
|
+
|
|
76
|
+
/** Callback fired when the user starts to type in the search field. */
|
|
77
|
+
onSearch: PropTypes.func,
|
|
78
|
+
|
|
79
|
+
/** Boolean to control whether if the search input should appears or not. */
|
|
80
|
+
hideSearch: PropTypes.bool,
|
|
81
|
+
|
|
82
|
+
/**
|
|
83
|
+
* Extra props to be passed onto the input
|
|
84
|
+
*/
|
|
85
|
+
searchProps: PropTypes.object
|
|
86
|
+
} : void 0;
|
|
87
|
+
export default withStyles(styleCreator, {
|
|
88
|
+
name: "HvLeftControl",
|
|
89
|
+
withTheme: true
|
|
90
|
+
})(HvLeftControl);
|
|
91
|
+
//# sourceMappingURL=LeftControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LeftControl.js","names":["React","useContext","clsx","PropTypes","withStyles","HvInput","setId","HvControlsContext","styleCreator","HvLeftControl","id","classes","className","children","placeholder","onSearch","hideSearch","searchProps","others","onSearchHandler","onChangeFilter","e","value","root","propTypes","string","node","shape","sortDropdown","isRequired","func","bool","object","name","withTheme"],"sources":["../../../../src/Controls/LeftControl/LeftControl.js"],"sourcesContent":["import React, { useContext } from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvInput, setId } from \"@hitachivantara/uikit-react-core\";\nimport { HvControlsContext } from \"../context/ControlsContext\";\nimport styleCreator from \"./styles\";\n\nconst HvLeftControl = ({\n id,\n classes,\n className,\n children,\n placeholder = \"Search\",\n onSearch,\n hideSearch = false,\n searchProps,\n ...others\n}) => {\n const { onSearch: onSearchHandler } = useContext(HvControlsContext);\n\n const onChangeFilter = (e, value) => {\n onSearch?.(e, value);\n onSearchHandler?.(value);\n };\n\n return (\n <div id={id} className={clsx(className, classes.root)} {...others}>\n {!hideSearch && (\n <HvInput\n id={setId(id, \"search-input\")}\n type=\"search\"\n placeholder={placeholder}\n onChange={(e, value) => onChangeFilter(e, value)}\n {...searchProps}\n />\n )}\n {children}\n </div>\n );\n};\n\nHvLeftControl.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 /** Placeholder text to be show within the search input. */\n placeholder: PropTypes.string,\n /** Callback fired when the user starts to type in the search field. */\n onSearch: PropTypes.func,\n /** Boolean to control whether if the search input should appears or not. */\n hideSearch: PropTypes.bool,\n /**\n * Extra props to be passed onto the input\n */\n searchProps: PropTypes.object,\n};\n\nexport default withStyles(styleCreator, { name: \"HvLeftControl\", withTheme: true })(HvLeftControl);\n"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,IAAP,MAAiB,MAAjB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,OAAT,EAAkBC,KAAlB,QAA+B,kCAA/B;AACA,SAASC,iBAAT,QAAkC,4BAAlC;AACA,OAAOC,YAAP,MAAyB,UAAzB;;AAEA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OAUhB;EAAA,IATJC,EASI,QATJA,EASI;EAAA,IARJC,OAQI,QARJA,OAQI;EAAA,IAPJC,SAOI,QAPJA,SAOI;EAAA,IANJC,QAMI,QANJA,QAMI;EAAA,4BALJC,WAKI;EAAA,IALJA,WAKI,iCALU,QAKV;EAAA,IAJJC,QAII,QAJJA,QAII;EAAA,2BAHJC,UAGI;EAAA,IAHJA,UAGI,gCAHS,KAGT;EAAA,IAFJC,WAEI,QAFJA,WAEI;EAAA,IADDC,MACC;;EACJ,kBAAsCjB,UAAU,CAACM,iBAAD,CAAhD;EAAA,IAAkBY,eAAlB,eAAQJ,QAAR;;EAEA,IAAMK,cAAc,GAAG,SAAjBA,cAAiB,CAACC,CAAD,EAAIC,KAAJ,EAAc;IACnCP,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGM,CAAH,EAAMC,KAAN,CAAR;IACAH,eAAe,SAAf,IAAAA,eAAe,WAAf,YAAAA,eAAe,CAAGG,KAAH,CAAf;EACD,CAHD;;EAKA,oBACE;IAAK,EAAE,EAAEZ,EAAT;IAAa,SAAS,EAAER,IAAI,CAACU,SAAD,EAAYD,OAAO,CAACY,IAApB;EAA5B,GAA2DL,MAA3D,GACG,CAACF,UAAD,iBACC,oBAAC,OAAD;IACE,EAAE,EAAEV,KAAK,CAACI,EAAD,EAAK,cAAL,CADX;IAEE,IAAI,EAAC,QAFP;IAGE,WAAW,EAAEI,WAHf;IAIE,QAAQ,EAAE,kBAACO,CAAD,EAAIC,KAAJ;MAAA,OAAcF,cAAc,CAACC,CAAD,EAAIC,KAAJ,CAA5B;IAAA;EAJZ,GAKML,WALN,EAFJ,EAUGJ,QAVH,CADF;AAcD,CAhCD;;AAkCA,wCAAAJ,aAAa,CAACe,SAAd,GAA0B;EACxB;EACAd,EAAE,EAAEP,SAAS,CAACsB,MAFU;;EAGxB;AACF;AACA;EACEb,SAAS,EAAET,SAAS,CAACsB,MANG;;EAOxB;EACAZ,QAAQ,EAAEV,SAAS,CAACuB,IARI;;EASxB;AACF;AACA;EACEf,OAAO,EAAER,SAAS,CAACwB,KAAV,CAAgB;IACvB;AACJ;AACA;IACIJ,IAAI,EAAEpB,SAAS,CAACsB,MAJO;;IAKvB;AACJ;AACA;IACIG,YAAY,EAAEzB,SAAS,CAACsB;EARD,CAAhB,EASNI,UArBqB;;EAsBxB;EACAf,WAAW,EAAEX,SAAS,CAACsB,MAvBC;;EAwBxB;EACAV,QAAQ,EAAEZ,SAAS,CAAC2B,IAzBI;;EA0BxB;EACAd,UAAU,EAAEb,SAAS,CAAC4B,IA3BE;;EA4BxB;AACF;AACA;EACEd,WAAW,EAAEd,SAAS,CAAC6B;AA/BC,CAA1B;AAkCA,eAAe5B,UAAU,CAACI,YAAD,EAAe;EAAEyB,IAAI,EAAE,eAAR;EAAyBC,SAAS,EAAE;AAApC,CAAf,CAAV,CAAqEzB,aAArE,CAAf"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["default"],"sources":["../../../../src/Controls/LeftControl/index.js"],"sourcesContent":["export { default } from \"./LeftControl\";\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,eAAxB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","names":["styles","root","display","gap"],"sources":["../../../../src/Controls/LeftControl/styles.js"],"sourcesContent":["const styles = () => ({\n root: {\n display: \"inline-flex\",\n gap: 10,\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;EADc,CAAP;AAAA,CAAf;;AAOA,eAAeH,MAAf"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { StandardProps } from "@material-ui/core";
|
|
2
|
+
import { HvDropdownProps, ListValueProp } from "@hitachivantara/uikit-react-core";
|
|
3
|
+
|
|
4
|
+
export type HvRightControlClassKey = "root" | "sortDropdown";
|
|
5
|
+
|
|
6
|
+
export interface HvControlsViewConfiguration extends Record<string, unknown> {
|
|
7
|
+
id: string;
|
|
8
|
+
label: string;
|
|
9
|
+
icon: React.ReactNode;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export interface RightListControls extends ListValueProp {
|
|
13
|
+
accesor: string;
|
|
14
|
+
desc: boolean;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
export interface HvRightControlProps
|
|
18
|
+
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvRightControlClassKey> {
|
|
19
|
+
/** Children to be rendered. */
|
|
20
|
+
id?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Class names to be applied.
|
|
23
|
+
*/
|
|
24
|
+
className?: string;
|
|
25
|
+
/**
|
|
26
|
+
* if `true` the hide sort by dropdown is not rendered
|
|
27
|
+
*/
|
|
28
|
+
hideSortBy?: boolean;
|
|
29
|
+
/**
|
|
30
|
+
* options for the dropdown to sort
|
|
31
|
+
*/
|
|
32
|
+
values?: RightListControls[];
|
|
33
|
+
/**
|
|
34
|
+
* Callback called when a sort action occurs
|
|
35
|
+
*/
|
|
36
|
+
onSort?: (selected: RightListControls | ListValueProp | ListValueProp[] | undefined) => void;
|
|
37
|
+
/**
|
|
38
|
+
* Extra props passed to dropdown
|
|
39
|
+
*/
|
|
40
|
+
sortProps?: HvDropdownProps;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export default function HvRightControl(props: HvRightControlProps): JSX.Element | null;
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
3
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
|
+
var _excluded = ["id", "classes", "className", "children", "values", "onSort", "hideSortBy", "sortProps"];
|
|
6
|
+
|
|
7
|
+
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; }
|
|
8
|
+
|
|
9
|
+
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) { _defineProperty(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; }
|
|
10
|
+
|
|
11
|
+
import "core-js/modules/es.array.iterator.js";
|
|
12
|
+
import "core-js/modules/es.object.to-string.js";
|
|
13
|
+
import "core-js/modules/web.dom-collections.iterator.js";
|
|
14
|
+
import "core-js/modules/es.array.map.js";
|
|
15
|
+
import "core-js/modules/es.object.keys.js";
|
|
16
|
+
import "core-js/modules/es.symbol.js";
|
|
17
|
+
import "core-js/modules/es.array.filter.js";
|
|
18
|
+
import "core-js/modules/es.object.get-own-property-descriptor.js";
|
|
19
|
+
import "core-js/modules/web.dom-collections.for-each.js";
|
|
20
|
+
import "core-js/modules/es.object.get-own-property-descriptors.js";
|
|
21
|
+
import React, { useContext, useState } from "react";
|
|
22
|
+
import PropTypes from "prop-types";
|
|
23
|
+
import clsx from "clsx";
|
|
24
|
+
import { withStyles } from "@material-ui/core";
|
|
25
|
+
import { HvDropdown, setId } from "@hitachivantara/uikit-react-core";
|
|
26
|
+
import styleCreator from "./styles";
|
|
27
|
+
import { HvControlsContext } from "../context/ControlsContext";
|
|
28
|
+
|
|
29
|
+
var HvRightControl = function HvRightControl(_ref) {
|
|
30
|
+
var id = _ref.id,
|
|
31
|
+
classes = _ref.classes,
|
|
32
|
+
className = _ref.className,
|
|
33
|
+
children = _ref.children,
|
|
34
|
+
values = _ref.values,
|
|
35
|
+
onSort = _ref.onSort,
|
|
36
|
+
_ref$hideSortBy = _ref.hideSortBy,
|
|
37
|
+
hideSortBy = _ref$hideSortBy === void 0 ? false : _ref$hideSortBy,
|
|
38
|
+
sortProps = _ref.sortProps,
|
|
39
|
+
others = _objectWithoutProperties(_ref, _excluded);
|
|
40
|
+
|
|
41
|
+
var _useState = useState(values),
|
|
42
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
43
|
+
dropDownValues = _useState2[0],
|
|
44
|
+
setDropdownValues = _useState2[1];
|
|
45
|
+
|
|
46
|
+
var _useContext = useContext(HvControlsContext),
|
|
47
|
+
onSortHandler = _useContext.onSort;
|
|
48
|
+
|
|
49
|
+
var handleChangeSort = function handleChangeSort(value) {
|
|
50
|
+
onSort === null || onSort === void 0 ? void 0 : onSort(value);
|
|
51
|
+
onSortHandler === null || onSortHandler === void 0 ? void 0 : onSortHandler(value); // this should be changed when dropdown changes his "values" behavior
|
|
52
|
+
|
|
53
|
+
setDropdownValues(function (prevValues) {
|
|
54
|
+
return prevValues.map(function (prevValue) {
|
|
55
|
+
return _objectSpread(_objectSpread({}, prevValue), {}, {
|
|
56
|
+
selected: prevValue.id === value.id
|
|
57
|
+
});
|
|
58
|
+
});
|
|
59
|
+
});
|
|
60
|
+
};
|
|
61
|
+
|
|
62
|
+
return /*#__PURE__*/React.createElement("div", _extends({
|
|
63
|
+
id: id,
|
|
64
|
+
className: clsx(className, classes.root)
|
|
65
|
+
}, others), !hideSortBy && /*#__PURE__*/React.createElement(HvDropdown, _extends({
|
|
66
|
+
id: setId(id, "sort-by-dropdown"),
|
|
67
|
+
values: dropDownValues,
|
|
68
|
+
className: classes.sortDropdown,
|
|
69
|
+
onChange: handleChangeSort,
|
|
70
|
+
singleSelectionToggle: false
|
|
71
|
+
}, sortProps)), children);
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
process.env.NODE_ENV !== "production" ? HvRightControl.propTypes = {
|
|
75
|
+
/** Children to be rendered. */
|
|
76
|
+
id: PropTypes.string,
|
|
77
|
+
|
|
78
|
+
/**
|
|
79
|
+
* Class names to be applied.
|
|
80
|
+
*/
|
|
81
|
+
className: PropTypes.string,
|
|
82
|
+
|
|
83
|
+
/** Children to be rendered. */
|
|
84
|
+
children: PropTypes.node,
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* the classes object to be applied.
|
|
88
|
+
*/
|
|
89
|
+
classes: PropTypes.shape({
|
|
90
|
+
/**
|
|
91
|
+
* Style applied to the root of the component.
|
|
92
|
+
*/
|
|
93
|
+
root: PropTypes.string,
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* Style applied to the dropdown in charge of sorting.
|
|
97
|
+
*/
|
|
98
|
+
sortDropdown: PropTypes.string
|
|
99
|
+
}).isRequired,
|
|
100
|
+
|
|
101
|
+
/** Data collection to be listed on the sort field. */
|
|
102
|
+
values: PropTypes.arrayOf(PropTypes.shape({
|
|
103
|
+
id: PropTypes.string,
|
|
104
|
+
accessor: PropTypes.string,
|
|
105
|
+
label: PropTypes.string,
|
|
106
|
+
selected: PropTypes.bool,
|
|
107
|
+
desc: PropTypes.bool
|
|
108
|
+
})),
|
|
109
|
+
|
|
110
|
+
/** Callback fired when the selected sort item is changed. */
|
|
111
|
+
onSort: PropTypes.func,
|
|
112
|
+
|
|
113
|
+
/** Boolean to control whether if the sort input should appears or not. */
|
|
114
|
+
hideSortBy: PropTypes.bool,
|
|
115
|
+
|
|
116
|
+
/**
|
|
117
|
+
* Extra props to be passed onto the dropdown
|
|
118
|
+
*/
|
|
119
|
+
sortProps: PropTypes.object
|
|
120
|
+
} : void 0;
|
|
121
|
+
export default withStyles(styleCreator, {
|
|
122
|
+
name: "HvRightControl",
|
|
123
|
+
withTheme: true
|
|
124
|
+
})(HvRightControl);
|
|
125
|
+
//# sourceMappingURL=RightControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RightControl.js","names":["React","useContext","useState","PropTypes","clsx","withStyles","HvDropdown","setId","styleCreator","HvControlsContext","HvRightControl","id","classes","className","children","values","onSort","hideSortBy","sortProps","others","dropDownValues","setDropdownValues","onSortHandler","handleChangeSort","value","prevValues","map","prevValue","selected","root","sortDropdown","propTypes","string","node","shape","isRequired","arrayOf","accessor","label","bool","desc","func","object","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,OAAOA,KAAP,IAAgBC,UAAhB,EAA4BC,QAA5B,QAA4C,OAA5C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,IAAP,MAAiB,MAAjB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,UAAT,EAAqBC,KAArB,QAAkC,kCAAlC;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,SAASC,iBAAT,QAAkC,4BAAlC;;AAEA,IAAMC,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,gBAA4CjB,QAAQ,CAACa,MAAD,CAApD;EAAA;EAAA,IAAOK,cAAP;EAAA,IAAuBC,iBAAvB;;EAEA,kBAAkCpB,UAAU,CAACQ,iBAAD,CAA5C;EAAA,IAAgBa,aAAhB,eAAQN,MAAR;;EAEA,IAAMO,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAAW;IAClCR,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM,CAAGQ,KAAH,CAAN;IACAF,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGE,KAAH,CAAb,CAFkC,CAGlC;;IACAH,iBAAiB,CAAC,UAACI,UAAD;MAAA,OAChBA,UAAU,CAACC,GAAX,CAAe,UAACC,SAAD;QAAA,uCACVA,SADU;UAEbC,QAAQ,EAAED,SAAS,CAAChB,EAAV,KAAiBa,KAAK,CAACb;QAFpB;MAAA,CAAf,CADgB;IAAA,CAAD,CAAjB;EAMD,CAVD;;EAWA,oBACE;IAAK,EAAE,EAAEA,EAAT;IAAa,SAAS,EAAEP,IAAI,CAACS,SAAD,EAAYD,OAAO,CAACiB,IAApB;EAA5B,GAA2DV,MAA3D,GACG,CAACF,UAAD,iBACC,oBAAC,UAAD;IACE,EAAE,EAAEV,KAAK,CAACI,EAAD,EAAK,kBAAL,CADX;IAEE,MAAM,EAAES,cAFV;IAGE,SAAS,EAAER,OAAO,CAACkB,YAHrB;IAIE,QAAQ,EAAEP,gBAJZ;IAKE,qBAAqB,EAAE;EALzB,GAMML,SANN,EAFJ,EAWGJ,QAXH,CADF;AAeD,CAzCD;;AA2CA,wCAAAJ,cAAc,CAACqB,SAAf,GAA2B;EACzB;EACApB,EAAE,EAAER,SAAS,CAAC6B,MAFW;;EAGzB;AACF;AACA;EACEnB,SAAS,EAAEV,SAAS,CAAC6B,MANI;;EAOzB;EACAlB,QAAQ,EAAEX,SAAS,CAAC8B,IARK;;EASzB;AACF;AACA;EACErB,OAAO,EAAET,SAAS,CAAC+B,KAAV,CAAgB;IACvB;AACJ;AACA;IACIL,IAAI,EAAE1B,SAAS,CAAC6B,MAJO;;IAKvB;AACJ;AACA;IACIF,YAAY,EAAE3B,SAAS,CAAC6B;EARD,CAAhB,EASNG,UArBsB;;EAsBzB;EACApB,MAAM,EAAEZ,SAAS,CAACiC,OAAV,CACNjC,SAAS,CAAC+B,KAAV,CAAgB;IACdvB,EAAE,EAAER,SAAS,CAAC6B,MADA;IAEdK,QAAQ,EAAElC,SAAS,CAAC6B,MAFN;IAGdM,KAAK,EAAEnC,SAAS,CAAC6B,MAHH;IAIdJ,QAAQ,EAAEzB,SAAS,CAACoC,IAJN;IAKdC,IAAI,EAAErC,SAAS,CAACoC;EALF,CAAhB,CADM,CAvBiB;;EAgCzB;EACAvB,MAAM,EAAEb,SAAS,CAACsC,IAjCO;;EAkCzB;EACAxB,UAAU,EAAEd,SAAS,CAACoC,IAnCG;;EAoCzB;AACF;AACA;EACErB,SAAS,EAAEf,SAAS,CAACuC;AAvCI,CAA3B;AA0CA,eAAerC,UAAU,CAACG,YAAD,EAAe;EAAEmC,IAAI,EAAE,gBAAR;EAA0BC,SAAS,EAAE;AAArC,CAAf,CAAV,CACblC,cADa,CAAf"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["default"],"sources":["../../../../src/Controls/RightControl/index.js"],"sourcesContent":["export { default } from \"./RightControl\";\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,gBAAxB"}
|
|
@@ -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;;AAUA,eAAeL,MAAf"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export var HvControlsContext = /*#__PURE__*/React.createContext({});
|
|
3
|
+
export var HvControlsContextProvider = HvControlsContext.Provider;
|
|
4
|
+
export var HvControlsContextConsumer = HvControlsContext.Consumer;
|
|
5
|
+
export default HvControlsContext;
|
|
6
|
+
//# sourceMappingURL=ControlsContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ControlsContext.js","names":["React","HvControlsContext","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,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAO,IAAMC,iBAAiB,gBAAGD,KAAK,CAACE,aAAN,CAAoB,EAApB,CAA1B;AAEP,OAAO,IAAMC,yBAAyB,GAAGF,iBAAiB,CAACG,QAApD;AACP,OAAO,IAAMC,yBAAyB,GAAGJ,iBAAiB,CAACK,QAApD;AACP,eAAeL,iBAAf"}
|