@widergy/energy-ui 3.121.3 → 3.122.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +20 -0
- package/README.md +0 -1
- package/dist/components/UTAvatar/constants.js +44 -1
- package/dist/components/UTAvatar/index.js +31 -8
- package/dist/components/UTAvatar/stories/UTAvatar.mdx +13 -0
- package/dist/components/UTAvatar/stories/UTAvatar.stories.js +38 -0
- package/dist/components/UTAvatar/stories/UTAvatarColors.stories.js +91 -0
- package/dist/components/UTAvatar/stories/UTAvatarShapes.stories.js +51 -0
- package/dist/components/UTAvatar/stories/UTAvatarSizes.stories.js +106 -0
- package/dist/components/UTAvatar/stories/UTAvatarTypes.stories.js +51 -0
- package/dist/components/UTAvatar/stories/storiesConstants.js +155 -0
- package/dist/components/UTAvatar/styles.module.scss +24 -0
- package/dist/components/UTBodyPlaceholder/UTBodyPlaceholder.mdx +11 -0
- package/dist/components/UTBodyPlaceholder/UTBodyPlaceholder.stories.js +76 -0
- package/dist/components/UTBodyPlaceholder/constants.js +14 -0
- package/dist/components/UTBodyPlaceholder/index.js +45 -0
- package/dist/components/UTBodyPlaceholder/styles.module.scss +34 -0
- package/dist/components/UTButton/constants.js +8 -5
- package/dist/components/UTButton/stories/UTButton.mdx +13 -0
- package/dist/components/UTButton/stories/UTButton.stories.js +38 -0
- package/dist/components/UTButton/stories/UTButtonAdornments.stories.js +52 -0
- package/dist/components/UTButton/stories/UTButtonColorThemes.stories.js +52 -0
- package/dist/components/UTButton/stories/UTButtonSizes.stories.js +40 -0
- package/dist/components/UTButton/stories/UTButtonStates.stories.js +34 -0
- package/dist/components/UTButton/stories/UTButtonVariants.stories.js +61 -0
- package/dist/components/UTButton/stories/storiesConstants.js +220 -0
- package/dist/components/UTButton/theme.js +15 -14
- package/dist/components/UTButton/utils.js +2 -2
- package/dist/components/UTDataElement/UTDataElement.stories.js +2 -1
- package/dist/components/UTDataElement/theme.js +2 -1
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/CollapsedPanelContent/constants.js +11 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/CollapsedPanelContent/index.js +34 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/CollapsedPanelContent/layout.js +46 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryEmpty/index.js +36 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryEmpty/layout.js +50 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryHeader/constants.js +8 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryHeader/index.js +55 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryHeader/layout.js +78 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryItem/constants.js +21 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryItem/index.js +80 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/components/ExpandedPanelContentCategoryItem/layout.js +132 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/constants.js +7 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/index.js +62 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/layout.js +78 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentCategory/utils.js +23 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentHeader/constants.js +16 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentHeader/index.js +75 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentHeader/layout.js +136 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentPopper/constants.js +11 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentPopper/index.js +40 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/components/ExpandedPanelContentPopper/layout.js +55 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/index.js +37 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/components/ExpandedPanelContent/layout.js +44 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/index.js +57 -0
- package/dist/components/UTFilterGrouping/components/GroupingPanel/layout.js +64 -0
- package/dist/components/UTFilterGrouping/constants.js +10 -0
- package/dist/components/UTFilterGrouping/context.js +9 -0
- package/dist/components/UTFilterGrouping/index.js +187 -0
- package/dist/components/UTFilterGrouping/layout.js +43 -0
- package/dist/components/UTFilterGrouping/stories/UTFilterGrouping.mdx +13 -0
- package/dist/components/UTFilterGrouping/stories/UTFilterGrouping.stories.js +315 -0
- package/dist/components/UTFilterGrouping/stories/constants.json +282 -0
- package/dist/components/UTFilterGrouping/stories/fixtures.js +162 -0
- package/dist/components/UTFilterGrouping/stories/props.schema.json +163 -0
- package/dist/components/UTFilterGrouping/stories/styles.module.scss +19 -0
- package/dist/components/UTFilterGrouping/stories/tests.js +250 -0
- package/dist/components/UTFilterGrouping/stories/utils.js +178 -0
- package/dist/components/UTFilterGrouping/styles.module.scss +251 -0
- package/dist/components/UTFilterGrouping/theme.js +55 -0
- package/dist/components/UTFilterGrouping/types.js +51 -0
- package/dist/components/UTFilterGrouping/utils.js +27 -0
- package/dist/components/UTGraph/UTGraph.stories.js +1 -1
- package/dist/components/UTIcon/UTIcon.mdx +17 -0
- package/dist/components/UTIcon/UTIcon.stories.js +2 -1
- package/dist/components/UTIcon/index.js +2 -19
- package/dist/components/UTKpi/UTKpi.stories.js +2 -1
- package/dist/components/UTLabel/UTLabel.stories.js +2 -1
- package/dist/components/UTPanel/UTPanel.stories.js +2 -1
- package/dist/components/UTRadioGroup/UTRadioGroup.stories.js +2 -1
- package/dist/components/UTSearchField/index.js +8 -2
- package/dist/components/UTSearchField/stories/UTSearchField.mdx +11 -0
- package/dist/components/UTSearchField/stories/UTSearchField.stories.js +250 -0
- package/dist/components/UTSignature/UTSignature.stories.js +2 -1
- package/dist/components/UTStatus/UTStatus.stories.js +2 -1
- package/dist/components/UTSwitch/versions/V1/theme.js +5 -4
- package/dist/components/UTTable/UTTable.stories.js +2 -1
- package/dist/constants/Palette.js +1 -0
- package/dist/constants/testIds.js +53 -1
- package/dist/index.js +7 -0
- package/dist/types/iconTypes.js +25 -0
- package/package.json +8 -1
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _propTypes = require("prop-types");
|
|
9
|
+
var _context = _interopRequireDefault(require("../../../../../../context"));
|
|
10
|
+
var _layout = _interopRequireDefault(require("./layout"));
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
13
|
+
const ExpandedPanelContentPopperContainer = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
dataTestId
|
|
16
|
+
} = _ref;
|
|
17
|
+
const {
|
|
18
|
+
classes,
|
|
19
|
+
closePopper,
|
|
20
|
+
popperState: {
|
|
21
|
+
anchor,
|
|
22
|
+
description,
|
|
23
|
+
title
|
|
24
|
+
} = {},
|
|
25
|
+
position
|
|
26
|
+
} = (0, _react.useContext)(_context.default);
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement(_layout.default, {
|
|
28
|
+
anchor: anchor,
|
|
29
|
+
classes: classes,
|
|
30
|
+
dataTestId: dataTestId,
|
|
31
|
+
description: description,
|
|
32
|
+
onClose: closePopper,
|
|
33
|
+
position: position,
|
|
34
|
+
title: title
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
ExpandedPanelContentPopperContainer.propTypes = {
|
|
38
|
+
dataTestId: _propTypes.string
|
|
39
|
+
};
|
|
40
|
+
var _default = exports.default = ExpandedPanelContentPopperContainer;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _capitalize = _interopRequireDefault(require("lodash/capitalize"));
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _propTypes = require("prop-types");
|
|
10
|
+
var _UTPopper = _interopRequireDefault(require("../../../../../../../UTPopper"));
|
|
11
|
+
var _UTLabel = _interopRequireDefault(require("../../../../../../../UTLabel"));
|
|
12
|
+
var _testIds = require("../../../../../../../../constants/testIds");
|
|
13
|
+
var _constants = require("./constants");
|
|
14
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
|
+
const {
|
|
16
|
+
TITLE,
|
|
17
|
+
LABEL
|
|
18
|
+
} = _testIds.ID_CONSTANTS;
|
|
19
|
+
const ExpandedPanelContentPopper = _ref => {
|
|
20
|
+
let {
|
|
21
|
+
anchor,
|
|
22
|
+
classes,
|
|
23
|
+
dataTestId,
|
|
24
|
+
description,
|
|
25
|
+
onClose,
|
|
26
|
+
position,
|
|
27
|
+
title
|
|
28
|
+
} = _ref;
|
|
29
|
+
return /*#__PURE__*/_react.default.createElement(_UTPopper.default, {
|
|
30
|
+
anchor: anchor,
|
|
31
|
+
className: "".concat(classes.popper, " ").concat(classes["popper".concat((0, _capitalize.default)(position))]),
|
|
32
|
+
onClose: onClose,
|
|
33
|
+
placement: _constants.POPPER_PLACEMENT[position]
|
|
34
|
+
}, /*#__PURE__*/_react.default.createElement("article", {
|
|
35
|
+
className: classes.expandedPanelContentPopperContent
|
|
36
|
+
}, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
|
|
37
|
+
dataTestId: "".concat(dataTestId, ".").concat(TITLE),
|
|
38
|
+
variant: "small",
|
|
39
|
+
weight: "medium"
|
|
40
|
+
}, title), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
|
|
41
|
+
colorTheme: "gray",
|
|
42
|
+
dataTestId: "".concat(dataTestId, ".").concat(LABEL),
|
|
43
|
+
variant: "small"
|
|
44
|
+
}, description)));
|
|
45
|
+
};
|
|
46
|
+
ExpandedPanelContentPopper.propTypes = {
|
|
47
|
+
anchor: _propTypes.object,
|
|
48
|
+
classes: (0, _propTypes.objectOf)(_propTypes.string),
|
|
49
|
+
dataTestId: _propTypes.string,
|
|
50
|
+
description: _propTypes.string,
|
|
51
|
+
onClose: _propTypes.func,
|
|
52
|
+
position: _propTypes.string,
|
|
53
|
+
title: _propTypes.string
|
|
54
|
+
};
|
|
55
|
+
var _default = exports.default = ExpandedPanelContentPopper;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _propTypes = require("prop-types");
|
|
9
|
+
var _context = _interopRequireDefault(require("../../../../context"));
|
|
10
|
+
var _testIds = require("../../../../../../constants/testIds");
|
|
11
|
+
var _layout = _interopRequireDefault(require("./layout"));
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
14
|
+
const {
|
|
15
|
+
EXPANDED_PANEL_CONTENT
|
|
16
|
+
} = _testIds.ID_CONSTANTS;
|
|
17
|
+
const ExpandedPanelContentContainer = _ref => {
|
|
18
|
+
let {
|
|
19
|
+
dataTestId
|
|
20
|
+
} = _ref;
|
|
21
|
+
const {
|
|
22
|
+
classes,
|
|
23
|
+
categories,
|
|
24
|
+
categoriesConfig
|
|
25
|
+
} = (0, _react.useContext)(_context.default);
|
|
26
|
+
const modifiedDataTestId = dataTestId ? "".concat(dataTestId, ".").concat(EXPANDED_PANEL_CONTENT) : undefined;
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement(_layout.default, {
|
|
28
|
+
categories: categories,
|
|
29
|
+
categoriesConfig: categoriesConfig,
|
|
30
|
+
classes: classes,
|
|
31
|
+
modifiedDataTestId: modifiedDataTestId
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
ExpandedPanelContentContainer.propTypes = {
|
|
35
|
+
dataTestId: _propTypes.string
|
|
36
|
+
};
|
|
37
|
+
var _default = exports.default = ExpandedPanelContentContainer;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _propTypes = require("prop-types");
|
|
9
|
+
var _testIds = require("../../../../../../constants/testIds");
|
|
10
|
+
var _ExpandedPanelContentCategory = _interopRequireDefault(require("./components/ExpandedPanelContentCategory"));
|
|
11
|
+
var _ExpandedPanelContentHeader = _interopRequireDefault(require("./components/ExpandedPanelContentHeader"));
|
|
12
|
+
var _ExpandedPanelContentPopper = _interopRequireDefault(require("./components/ExpandedPanelContentPopper"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
|
+
const {
|
|
15
|
+
EXPANDED_PANEL_CONTENT_CATEGORY,
|
|
16
|
+
POPPER
|
|
17
|
+
} = _testIds.ID_CONSTANTS;
|
|
18
|
+
const ExpandedPanelContent = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
modifiedDataTestId,
|
|
21
|
+
classes,
|
|
22
|
+
categories,
|
|
23
|
+
categoriesConfig
|
|
24
|
+
} = _ref;
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement("article", {
|
|
26
|
+
className: classes.expandedPanelContent
|
|
27
|
+
}, /*#__PURE__*/_react.default.createElement(_ExpandedPanelContentHeader.default, {
|
|
28
|
+
dataTestId: modifiedDataTestId
|
|
29
|
+
}), categories && Array.isArray(categories) && categories.map(category => /*#__PURE__*/_react.default.createElement(_ExpandedPanelContentCategory.default, {
|
|
30
|
+
key: category.id,
|
|
31
|
+
category: category,
|
|
32
|
+
dataTestId: modifiedDataTestId ? "".concat(modifiedDataTestId, ".").concat(EXPANDED_PANEL_CONTENT_CATEGORY) : undefined,
|
|
33
|
+
categoryConfig: categoriesConfig[category.category]
|
|
34
|
+
})), /*#__PURE__*/_react.default.createElement(_ExpandedPanelContentPopper.default, {
|
|
35
|
+
dataTestId: "".concat(modifiedDataTestId, ".").concat(POPPER)
|
|
36
|
+
}));
|
|
37
|
+
};
|
|
38
|
+
ExpandedPanelContent.propTypes = {
|
|
39
|
+
categories: _propTypes.array,
|
|
40
|
+
categoriesConfig: (0, _propTypes.objectOf)(_propTypes.object),
|
|
41
|
+
classes: (0, _propTypes.objectOf)(_propTypes.string),
|
|
42
|
+
modifiedDataTestId: _propTypes.string
|
|
43
|
+
};
|
|
44
|
+
var _default = exports.default = ExpandedPanelContent;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
require("react-perfect-scrollbar/dist/css/styles.css");
|
|
9
|
+
var _propTypes = require("prop-types");
|
|
10
|
+
var _context = _interopRequireDefault(require("../../context"));
|
|
11
|
+
var _iconTypes = require("../../../../types/iconTypes");
|
|
12
|
+
var _testIds = require("../../../../constants/testIds");
|
|
13
|
+
var _commonTypes = require("../../../../types/commonTypes");
|
|
14
|
+
var _layout = _interopRequireDefault(require("./layout"));
|
|
15
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
|
+
const {
|
|
18
|
+
GROUPING_PANEL
|
|
19
|
+
} = _testIds.ID_CONSTANTS;
|
|
20
|
+
const GroupingPanelContainer = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
containerRef,
|
|
23
|
+
dataTestId,
|
|
24
|
+
iconProps,
|
|
25
|
+
onClose,
|
|
26
|
+
open,
|
|
27
|
+
panelTitle,
|
|
28
|
+
position
|
|
29
|
+
} = _ref;
|
|
30
|
+
const {
|
|
31
|
+
classes
|
|
32
|
+
} = (0, _react.useContext)(_context.default);
|
|
33
|
+
const appendedDataTestId = dataTestId ? "".concat(dataTestId, ".").concat(GROUPING_PANEL) : undefined;
|
|
34
|
+
const drawerRef = (0, _react.useRef)(null);
|
|
35
|
+
return /*#__PURE__*/_react.default.createElement(_layout.default, {
|
|
36
|
+
appendedDataTestId: appendedDataTestId,
|
|
37
|
+
classes: classes,
|
|
38
|
+
containerRef: containerRef,
|
|
39
|
+
dataTestId: appendedDataTestId,
|
|
40
|
+
drawerRef: drawerRef,
|
|
41
|
+
iconProps: iconProps,
|
|
42
|
+
onClose: onClose,
|
|
43
|
+
open: open,
|
|
44
|
+
panelTitle: panelTitle,
|
|
45
|
+
position: position
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
GroupingPanelContainer.propTypes = {
|
|
49
|
+
containerRef: _commonTypes.refType,
|
|
50
|
+
dataTestId: _propTypes.string,
|
|
51
|
+
onClose: _propTypes.func,
|
|
52
|
+
open: _propTypes.bool,
|
|
53
|
+
position: _propTypes.string,
|
|
54
|
+
panelTitle: _propTypes.string,
|
|
55
|
+
iconProps: _iconTypes.iconPropTypes
|
|
56
|
+
};
|
|
57
|
+
var _default = exports.default = GroupingPanelContainer;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _capitalize = _interopRequireDefault(require("lodash/capitalize"));
|
|
8
|
+
var _reactPerfectScrollbar = _interopRequireDefault(require("react-perfect-scrollbar"));
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
10
|
+
var _propTypes = require("prop-types");
|
|
11
|
+
var _core = require("@material-ui/core");
|
|
12
|
+
var _CollapsedPanelContent = _interopRequireDefault(require("./components/CollapsedPanelContent"));
|
|
13
|
+
var _ExpandedPanelContent = _interopRequireDefault(require("./components/ExpandedPanelContent"));
|
|
14
|
+
require("react-perfect-scrollbar/dist/css/styles.css");
|
|
15
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
+
const GroupingPanel = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
appendedDataTestId,
|
|
19
|
+
classes,
|
|
20
|
+
containerRef,
|
|
21
|
+
drawerRef,
|
|
22
|
+
onClose,
|
|
23
|
+
open,
|
|
24
|
+
position
|
|
25
|
+
} = _ref;
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_core.Drawer, {
|
|
27
|
+
anchor: position,
|
|
28
|
+
classes: {
|
|
29
|
+
paper: "".concat(classes.paper, " ").concat(open ? classes.paperOpen : ''),
|
|
30
|
+
root: classes["panelRoot".concat((0, _capitalize.default)(position))]
|
|
31
|
+
},
|
|
32
|
+
disablePortal: true,
|
|
33
|
+
ModalProps: {
|
|
34
|
+
hideBackdrop: true,
|
|
35
|
+
disableEnforceFocus: true,
|
|
36
|
+
container: containerRef,
|
|
37
|
+
keepMounted: !!containerRef
|
|
38
|
+
},
|
|
39
|
+
onClose: onClose,
|
|
40
|
+
open: open,
|
|
41
|
+
ref: drawerRef,
|
|
42
|
+
swipeAreaWidth: 0,
|
|
43
|
+
variant: "permanent"
|
|
44
|
+
}, open ? /*#__PURE__*/_react.default.createElement(_reactPerfectScrollbar.default, {
|
|
45
|
+
className: classes.perfectScrollbar,
|
|
46
|
+
options: {
|
|
47
|
+
suppressScrollX: true
|
|
48
|
+
}
|
|
49
|
+
}, /*#__PURE__*/_react.default.createElement(_ExpandedPanelContent.default, {
|
|
50
|
+
dataTestId: appendedDataTestId
|
|
51
|
+
})) : /*#__PURE__*/_react.default.createElement(_CollapsedPanelContent.default, {
|
|
52
|
+
dataTestId: appendedDataTestId
|
|
53
|
+
}));
|
|
54
|
+
};
|
|
55
|
+
GroupingPanel.propTypes = {
|
|
56
|
+
appendedDataTestId: _propTypes.string,
|
|
57
|
+
classes: (0, _propTypes.objectOf)(_propTypes.string),
|
|
58
|
+
containerRef: _propTypes.refType,
|
|
59
|
+
drawerRef: _propTypes.refType,
|
|
60
|
+
onClose: _propTypes.func,
|
|
61
|
+
open: _propTypes.bool,
|
|
62
|
+
position: _propTypes.string
|
|
63
|
+
};
|
|
64
|
+
var _default = exports.default = GroupingPanel;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
const UTFilterGroupingContext = /*#__PURE__*/(0, _react.createContext)({});
|
|
9
|
+
var _default = exports.default = UTFilterGroupingContext;
|
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _propTypes = require("prop-types");
|
|
9
|
+
var _WithTheme = _interopRequireDefault(require("../WithTheme"));
|
|
10
|
+
var _iconTypes = require("../../types/iconTypes");
|
|
11
|
+
var _classesUtils = require("../../utils/classesUtils");
|
|
12
|
+
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
13
|
+
var _layout = _interopRequireDefault(require("./layout"));
|
|
14
|
+
var _context = _interopRequireDefault(require("./context"));
|
|
15
|
+
var _constants = require("./constants");
|
|
16
|
+
var _theme = require("./theme");
|
|
17
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
18
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
19
|
+
const UTFilterGroupingContainer = _ref => {
|
|
20
|
+
let {
|
|
21
|
+
categories,
|
|
22
|
+
categoriesConfig,
|
|
23
|
+
children,
|
|
24
|
+
classNames,
|
|
25
|
+
classes: theme,
|
|
26
|
+
dataTestId,
|
|
27
|
+
handleSelectFilter,
|
|
28
|
+
iconProps,
|
|
29
|
+
noFiltersText,
|
|
30
|
+
noFiltersTitle,
|
|
31
|
+
onDeleteFilterGrouping,
|
|
32
|
+
onEditFilterGrouping,
|
|
33
|
+
panelTitle,
|
|
34
|
+
position = _constants.PANEL_POSITIONS.LEFT,
|
|
35
|
+
selectedFilter,
|
|
36
|
+
startOpen = false,
|
|
37
|
+
tooltipsContentMap = {}
|
|
38
|
+
} = _ref;
|
|
39
|
+
const classes = (0, _react.useMemo)(() => (0, _classesUtils.mergeMultipleClassNames)(_stylesModule.default, theme, classNames), [classNames, theme]);
|
|
40
|
+
const containerRef = (0, _react.useRef)(null);
|
|
41
|
+
const [open, setOpen] = (0, _react.useState)(startOpen);
|
|
42
|
+
const [filteredValues, setFilteredValues] = (0, _react.useState)(false);
|
|
43
|
+
const handleTogglePanel = () => {
|
|
44
|
+
setOpen(!open);
|
|
45
|
+
};
|
|
46
|
+
const [filteredCategories, setFilteredCategories] = (0, _react.useState)(categories);
|
|
47
|
+
const handleAddFilterGroup = () => {
|
|
48
|
+
// TODO: desarrollo en otro PR
|
|
49
|
+
alert('handleAddFilterGroup');
|
|
50
|
+
};
|
|
51
|
+
const handleFilterGroupSearch = value => {
|
|
52
|
+
const filteredResults = categories.map(category => {
|
|
53
|
+
const filters = category.filters.filter(filter => filter.name.toLowerCase().includes(value.toLowerCase()));
|
|
54
|
+
return {
|
|
55
|
+
...category,
|
|
56
|
+
filters
|
|
57
|
+
};
|
|
58
|
+
}).filter(category => category.filters.length > 0);
|
|
59
|
+
setFilteredCategories(filteredResults);
|
|
60
|
+
setFilteredValues(Boolean(value));
|
|
61
|
+
};
|
|
62
|
+
const handleDeleteFilterGrouping = filter => {
|
|
63
|
+
onDeleteFilterGrouping(filter);
|
|
64
|
+
};
|
|
65
|
+
const handleEditFilterGrouping = filter => {
|
|
66
|
+
onEditFilterGrouping(filter);
|
|
67
|
+
};
|
|
68
|
+
const [popperState, setPopperState] = (0, _react.useState)({});
|
|
69
|
+
const openPopper = _ref2 => {
|
|
70
|
+
let {
|
|
71
|
+
anchor,
|
|
72
|
+
title,
|
|
73
|
+
description
|
|
74
|
+
} = _ref2;
|
|
75
|
+
if (!anchor) return;
|
|
76
|
+
if (!description && title.length < 20) return;
|
|
77
|
+
setPopperState({
|
|
78
|
+
anchor,
|
|
79
|
+
title,
|
|
80
|
+
description
|
|
81
|
+
});
|
|
82
|
+
};
|
|
83
|
+
const closePopper = () => {
|
|
84
|
+
setPopperState({});
|
|
85
|
+
};
|
|
86
|
+
(0, _react.useEffect)(() => {
|
|
87
|
+
setFilteredCategories(categories);
|
|
88
|
+
}, [categories]);
|
|
89
|
+
const contextValue = (0, _react.useMemo)(() => ({
|
|
90
|
+
categories: filteredCategories,
|
|
91
|
+
categoriesConfig,
|
|
92
|
+
classes,
|
|
93
|
+
closePopper,
|
|
94
|
+
containerRef: containerRef.current,
|
|
95
|
+
filteredValues,
|
|
96
|
+
handleAddFilterGroup,
|
|
97
|
+
handleDeleteFilterGrouping,
|
|
98
|
+
handleEditFilterGrouping,
|
|
99
|
+
handleFilterGroupSearch,
|
|
100
|
+
handleSelectFilter,
|
|
101
|
+
handleTogglePanel,
|
|
102
|
+
iconProps,
|
|
103
|
+
noFiltersText,
|
|
104
|
+
noFiltersTitle,
|
|
105
|
+
open,
|
|
106
|
+
openPopper,
|
|
107
|
+
panelTitle,
|
|
108
|
+
popperState,
|
|
109
|
+
position,
|
|
110
|
+
selectedFilter,
|
|
111
|
+
theme,
|
|
112
|
+
tooltipsContentMap
|
|
113
|
+
}), [categories, categoriesConfig, classes, filteredCategories, filteredValues, iconProps, noFiltersText, noFiltersTitle, open, popperState, position, selectedFilter]);
|
|
114
|
+
return /*#__PURE__*/_react.default.createElement(_context.default.Provider, {
|
|
115
|
+
value: contextValue
|
|
116
|
+
}, /*#__PURE__*/_react.default.createElement("section", {
|
|
117
|
+
className: classes.filterGroupingContainer,
|
|
118
|
+
ref: containerRef
|
|
119
|
+
}, /*#__PURE__*/_react.default.createElement(_layout.default, {
|
|
120
|
+
containerRef: containerRef.current,
|
|
121
|
+
dataTestId: dataTestId,
|
|
122
|
+
handleTogglePanel: handleTogglePanel,
|
|
123
|
+
iconProps: iconProps,
|
|
124
|
+
open: open,
|
|
125
|
+
position: position
|
|
126
|
+
}, children)));
|
|
127
|
+
};
|
|
128
|
+
UTFilterGroupingContainer.propTypes = {
|
|
129
|
+
categories: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
130
|
+
id: _propTypes.number,
|
|
131
|
+
category: _propTypes.string,
|
|
132
|
+
name: _propTypes.string,
|
|
133
|
+
filters: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
134
|
+
id: _propTypes.number,
|
|
135
|
+
name: _propTypes.string,
|
|
136
|
+
category: _propTypes.string,
|
|
137
|
+
description: _propTypes.string,
|
|
138
|
+
order: _propTypes.number,
|
|
139
|
+
pinned: _propTypes.bool,
|
|
140
|
+
visible: _propTypes.bool,
|
|
141
|
+
backoffice_user_id: _propTypes.string,
|
|
142
|
+
filter_params: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
143
|
+
key: _propTypes.string,
|
|
144
|
+
values: (0, _propTypes.arrayOf)(_propTypes.string)
|
|
145
|
+
}))
|
|
146
|
+
}))
|
|
147
|
+
})),
|
|
148
|
+
categoriesConfig: (0, _propTypes.objectOf)((0, _propTypes.shape)({
|
|
149
|
+
icon: _propTypes.string,
|
|
150
|
+
avatarPalette: (0, _propTypes.shape)({
|
|
151
|
+
color: _propTypes.string,
|
|
152
|
+
backgroundColor: _propTypes.string,
|
|
153
|
+
colorTheme: _propTypes.string
|
|
154
|
+
})
|
|
155
|
+
})),
|
|
156
|
+
classNames: (0, _propTypes.objectOf)(_propTypes.string),
|
|
157
|
+
classes: (0, _propTypes.objectOf)(_propTypes.string),
|
|
158
|
+
dataTestId: _propTypes.string,
|
|
159
|
+
handleSelectFilter: _propTypes.func,
|
|
160
|
+
iconProps: _iconTypes.iconPropTypes,
|
|
161
|
+
noFiltersText: _propTypes.string,
|
|
162
|
+
noFiltersTitle: _propTypes.string,
|
|
163
|
+
onDeleteFilterGrouping: _propTypes.func,
|
|
164
|
+
onEditFilterGrouping: _propTypes.func,
|
|
165
|
+
panelTitle: _propTypes.string,
|
|
166
|
+
position: _propTypes.string,
|
|
167
|
+
selectedFilter: (0, _propTypes.shape)({
|
|
168
|
+
id: _propTypes.number,
|
|
169
|
+
name: _propTypes.string,
|
|
170
|
+
category: _propTypes.string,
|
|
171
|
+
description: _propTypes.string,
|
|
172
|
+
order: _propTypes.number,
|
|
173
|
+
pinned: _propTypes.bool,
|
|
174
|
+
visible: _propTypes.bool,
|
|
175
|
+
backoffice_user_id: _propTypes.string,
|
|
176
|
+
filter_params: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
|
|
177
|
+
key: _propTypes.string,
|
|
178
|
+
values: (0, _propTypes.arrayOf)(_propTypes.string)
|
|
179
|
+
}))
|
|
180
|
+
}),
|
|
181
|
+
startOpen: _propTypes.bool,
|
|
182
|
+
tooltipsContentMap: (0, _propTypes.shape)({
|
|
183
|
+
collapseButton: _propTypes.string,
|
|
184
|
+
searchButton: _propTypes.string
|
|
185
|
+
})
|
|
186
|
+
};
|
|
187
|
+
var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTFilterGroupingContainer);
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _propTypes = require("prop-types");
|
|
9
|
+
var _iconTypes = require("../../types/iconTypes");
|
|
10
|
+
var _GroupingPanel = _interopRequireDefault(require("./components/GroupingPanel"));
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
13
|
+
const UTFilterGrouping = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
children,
|
|
16
|
+
containerRef,
|
|
17
|
+
dataTestId,
|
|
18
|
+
handleTogglePanel,
|
|
19
|
+
iconProps,
|
|
20
|
+
open,
|
|
21
|
+
panelTitle,
|
|
22
|
+
position
|
|
23
|
+
} = _ref;
|
|
24
|
+
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_GroupingPanel.default, {
|
|
25
|
+
containerRef: containerRef,
|
|
26
|
+
dataTestId: dataTestId,
|
|
27
|
+
iconProps: iconProps,
|
|
28
|
+
onClose: handleTogglePanel,
|
|
29
|
+
open: open,
|
|
30
|
+
panelTitle: panelTitle,
|
|
31
|
+
position: position
|
|
32
|
+
}), children);
|
|
33
|
+
};
|
|
34
|
+
UTFilterGrouping.propTypes = {
|
|
35
|
+
containerRef: _propTypes.refType,
|
|
36
|
+
dataTestId: _propTypes.string,
|
|
37
|
+
handleTogglePanel: _propTypes.func,
|
|
38
|
+
iconProps: _iconTypes.iconPropTypes,
|
|
39
|
+
open: _propTypes.bool,
|
|
40
|
+
panelTitle: _propTypes.string,
|
|
41
|
+
position: _propTypes.string
|
|
42
|
+
};
|
|
43
|
+
var _default = exports.default = UTFilterGrouping;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ArgTypes, Canvas, Description, Meta, Title } from '@storybook/addon-docs';
|
|
2
|
+
|
|
3
|
+
import * as UTFilterGroupingStories from './UTFilterGrouping.stories';
|
|
4
|
+
|
|
5
|
+
<Meta of={UTFilterGroupingStories} />
|
|
6
|
+
|
|
7
|
+
<Title>UTFilterGrouping</Title>
|
|
8
|
+
|
|
9
|
+
<Description of={UTFilterGroupingStories} />
|
|
10
|
+
|
|
11
|
+
<Canvas of={UTFilterGroupingStories.Playground} />
|
|
12
|
+
|
|
13
|
+
<ArgTypes />
|