@hitachivantara/uikit-react-core 4.0.1-next.2 → 4.0.1-next.5
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 +2 -10
- package/dist/Controls/RightControl/RightControl.d.ts +1 -1
- package/dist/Provider/Provider.d.ts +5 -18
- package/dist/Provider/Provider.js +25 -38
- package/dist/Provider/Provider.js.map +1 -1
- package/dist/SimpleGrid/SimpleGrid.d.ts +7 -8
- package/dist/Table/TableBody/TableBody.d.ts +4 -0
- package/dist/Table/renderers/index.js +50 -0
- package/dist/Table/renderers/index.js.map +1 -1
- package/dist/Table/renderers/renderers.js +9 -15
- package/dist/Table/renderers/renderers.js.map +1 -1
- package/dist/Tag/Tag.js +1 -13
- package/dist/Tag/Tag.js.map +1 -1
- package/dist/Tag/styles.js +5 -3
- package/dist/Tag/styles.js.map +1 -1
- package/dist/legacy/Controls/Controls.d.ts +2 -10
- package/dist/legacy/Controls/RightControl/RightControl.d.ts +1 -1
- package/dist/legacy/Provider/Provider.d.ts +5 -18
- package/dist/legacy/Provider/Provider.js +29 -40
- package/dist/legacy/Provider/Provider.js.map +1 -1
- package/dist/legacy/SimpleGrid/SimpleGrid.d.ts +7 -8
- package/dist/legacy/Table/TableBody/TableBody.d.ts +4 -0
- package/dist/legacy/Table/renderers/index.js +1 -0
- package/dist/legacy/Table/renderers/index.js.map +1 -1
- package/dist/legacy/Table/renderers/renderers.js +6 -6
- package/dist/legacy/Table/renderers/renderers.js.map +1 -1
- package/dist/legacy/Tag/Tag.js +3 -15
- package/dist/legacy/Tag/Tag.js.map +1 -1
- package/dist/legacy/Tag/styles.js +5 -3
- package/dist/legacy/Tag/styles.js.map +1 -1
- package/dist/legacy/theme/index.d.ts +2 -1
- package/dist/modern/Controls/Controls.d.ts +2 -10
- package/dist/modern/Controls/RightControl/RightControl.d.ts +1 -1
- package/dist/modern/Provider/Provider.d.ts +5 -18
- package/dist/modern/Provider/Provider.js +28 -38
- package/dist/modern/Provider/Provider.js.map +1 -1
- package/dist/modern/SimpleGrid/SimpleGrid.d.ts +7 -8
- package/dist/modern/Table/TableBody/TableBody.d.ts +4 -0
- package/dist/modern/Table/renderers/index.js +1 -0
- package/dist/modern/Table/renderers/index.js.map +1 -1
- package/dist/modern/Table/renderers/renderers.js +6 -6
- package/dist/modern/Table/renderers/renderers.js.map +1 -1
- package/dist/modern/Tag/Tag.js +3 -15
- package/dist/modern/Tag/Tag.js.map +1 -1
- package/dist/modern/Tag/styles.js +5 -3
- package/dist/modern/Tag/styles.js.map +1 -1
- package/dist/modern/theme/index.d.ts +2 -1
- package/dist/theme/index.d.ts +2 -1
- package/package.json +2 -2
package/dist/Tag/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","names":["styles","theme","root","chipRoot","height","borderRadius","maxWidth","backgroundColor","fade","palette","base1","focusVisible","primaryButton","background","label","paddingLeft","hv","spacing","xs","paddingRight","
|
|
1
|
+
{"version":3,"file":"styles.js","names":["styles","theme","root","chipRoot","height","borderRadius","maxWidth","backgroundColor","fade","palette","base1","focusVisible","primaryButton","background","label","paddingLeft","hv","spacing","xs","paddingRight","typography","normalText","color","base2","base","tagButton","width","minWidth","minHeight","padding","margin","deleteIcon","marginRight","outlineStyles","outline","boxShadow","disabledDeleteIcon","atmosphere","atmo3","outlineOffset","titleOverflow","whiteSpace","overflow","textOverflow","categorical","cursor","accent","acce1","clickable","categoricalFocus","disabled","atmo5","categoricalDisabled","semanticTextColor","categoricalTextColor"],"sources":["../../src/Tag/styles.js"],"sourcesContent":["import fade from \"../utils/hexToRgbA\";\nimport { outlineStyles } from \"../Focus/styles\";\n\nconst styles = (theme) => ({\n root: {},\n\n chipRoot: {\n height: 16,\n borderRadius: 0,\n maxWidth: 180,\n \"& $focusVisible\": {\n backgroundColor: fade(theme.palette.base1, 0.3),\n },\n },\n\n focusVisible: {},\n\n primaryButton: {\n background: \"transparent\",\n },\n\n label: {\n paddingLeft: theme.hv.spacing.xs,\n paddingRight: theme.hv.spacing.xs,\n ...theme.hv.typography.normalText,\n color: theme.palette.base2,\n \"& p\": {\n color: theme.hv.palette.base.base2,\n },\n },\n\n tagButton: {\n width: 16,\n height: 16,\n minWidth: 16,\n minHeight: 16,\n padding: 0,\n margin: 0,\n },\n\n deleteIcon: {\n marginRight: 0,\n width: 16,\n height: 16,\n minWidth: 16,\n minHeight: 16,\n padding: 0,\n \"&:hover\": {\n backgroundColor: fade(theme.palette.base1, 0.3),\n },\n \"&:focus\": {\n ...outlineStyles,\n borderRadius: 0,\n },\n \"&:focus:not(:focus-visible)\": {\n outline: \"0 !important\",\n boxShadow: \"none !important\",\n },\n },\n disabledDeleteIcon: {\n \"&:hover\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n },\n \"&:focus\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n outline: \"none\",\n boxShadow: \"none\",\n outlineOffset: 0,\n },\n },\n titleOverflow: {\n whiteSpace: \"nowrap\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n categorical: {\n borderRadius: 8,\n \"&$clickable\": {\n cursor: \"pointer\",\n },\n \"&:hover\": {\n borderRadius: 8,\n },\n \"& $label > p\": {\n color: theme.hv.palette.accent.acce1,\n },\n \"&:focus:not(:focus-visible)\": {\n outline: \"0 !important\",\n boxShadow: \"none !important\",\n },\n },\n clickable: {},\n\n categoricalFocus: {\n \"&:focus\": {\n ...outlineStyles,\n },\n },\n\n disabled: {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n cursor: \"not-allowed\",\n \"& $label > p\": {\n color: theme.hv.palette.atmosphere.atmo5,\n },\n },\n\n categoricalDisabled: {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n cursor: \"not-allowed\",\n \"& $label > p\": {\n color: theme.hv.palette.atmosphere.atmo5,\n },\n \"&:hover\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n },\n \"&:focus\": {\n outline: \"none\",\n },\n },\n\n semanticTextColor: {\n color: theme.hv.palette.base.base2,\n },\n categoricalTextColor: {\n color: theme.hv.palette.accent.acce1,\n },\n});\n\nexport default styles;\n"],"mappings":"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"}
|
|
@@ -1,22 +1,14 @@
|
|
|
1
1
|
import { StandardProps } from "@mui/material";
|
|
2
|
+
import { HvTableInstance } from "../Table";
|
|
2
3
|
|
|
3
4
|
export type HvControlsClassKey = "root" | "rightSection" | "leftSection";
|
|
4
5
|
|
|
5
|
-
export interface HvControlsSortValue {
|
|
6
|
-
id: string;
|
|
7
|
-
desc: string;
|
|
8
|
-
}
|
|
9
6
|
export interface HvControlsViewConfiguration extends Record<string, unknown> {
|
|
10
7
|
id: string;
|
|
11
8
|
label: string;
|
|
12
9
|
icon: React.ReactNode;
|
|
13
10
|
}
|
|
14
11
|
|
|
15
|
-
export interface HvControlsCallbacks extends Record<string, unknown> {
|
|
16
|
-
setSortBy?: (v: HvControlsSortValue[]) => void;
|
|
17
|
-
setGlobalFilter?: (v: string) => void;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
12
|
export interface HvControlsProps
|
|
21
13
|
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvControlsClassKey> {
|
|
22
14
|
/** Children to be rendered. */
|
|
@@ -29,7 +21,7 @@ export interface HvControlsProps
|
|
|
29
21
|
* An instance of useHvTable or useTable used to manage the data
|
|
30
22
|
* if this is not provided data sorting and search must be handled externally
|
|
31
23
|
*/
|
|
32
|
-
callbacks?:
|
|
24
|
+
callbacks?: Pick<HvTableInstance, "setSortBy" | "setGlobalFilter">;
|
|
33
25
|
/**
|
|
34
26
|
* Views configuration required for the view buttons
|
|
35
27
|
*/
|
|
@@ -52,32 +52,19 @@ export interface HvProviderProps {
|
|
|
52
52
|
* Ignored if a custom `generateClassName` is provided.
|
|
53
53
|
*/
|
|
54
54
|
generateClassNameOptions?: GenerateClassNameOptions;
|
|
55
|
-
/**
|
|
56
|
-
* Injects the generated stylesheets at the top of the `<head>` element of the page.
|
|
57
|
-
* This can ease the override of UI Kit components styles.
|
|
58
|
-
*
|
|
59
|
-
* By default, the styles are injected last in the `<head>` element of the page.
|
|
60
|
-
*/
|
|
61
|
-
injectStylesFirst?: boolean;
|
|
62
55
|
/**
|
|
63
56
|
* Disables the generation of the styles.
|
|
64
57
|
*/
|
|
65
58
|
disableStylesGeneration?: boolean;
|
|
66
59
|
|
|
67
60
|
/**
|
|
68
|
-
*
|
|
69
|
-
*
|
|
70
|
-
*
|
|
71
|
-
*
|
|
72
|
-
* The application using UI Kit should be responsible for adding the baseline css styles, by
|
|
73
|
-
* either using the `<HvCssBaseline />` component, using the `<HvScopedCssBaseline />` component,
|
|
74
|
-
* or ensuring that the necessary base styles are applied.
|
|
75
|
-
*
|
|
76
|
-
* Defaults to `false`. Will be removed in the next major release.
|
|
61
|
+
* By default the baseline styles are applied globally to the application.
|
|
62
|
+
* If you need to scope the CSS to avoid styling conflicts, you can set this prop to `"scoped"`.
|
|
63
|
+
* If you are providing the baseline styles, you can set this prop to false.
|
|
77
64
|
*
|
|
78
|
-
* @see https://lumada-design.github.io/uikit/master/?path=/docs/
|
|
65
|
+
* @see https://lumada-design.github.io/uikit/master/?path=/docs/theme-css-baseline--page
|
|
79
66
|
*/
|
|
80
|
-
|
|
67
|
+
cssBaseline?: "global" | "scoped" | "none";
|
|
81
68
|
}
|
|
82
69
|
|
|
83
70
|
export default function HvProvider(props: HvProviderProps): JSX.Element | null;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
2
|
|
|
3
|
-
var _HvCssBaseline;
|
|
3
|
+
var _HvCssBaseline, _HvScopedCssBaseline;
|
|
4
4
|
|
|
5
5
|
import React, { useState, useEffect, useMemo } from "react";
|
|
6
6
|
import PropTypes from "prop-types";
|
|
@@ -14,11 +14,8 @@ import "focus-visible";
|
|
|
14
14
|
import { createTheme, ThemeProvider } from "@mui/material";
|
|
15
15
|
import { StylesProvider } from "@mui/styles";
|
|
16
16
|
import { StyledEngineProvider } from "@mui/material/styles";
|
|
17
|
-
import { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme } from "../theme";
|
|
17
|
+
import { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme, HvScopedCssBaseline } from "../theme";
|
|
18
18
|
import ConfigContext from "./context";
|
|
19
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
20
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
21
|
-
var warnedOnce = false;
|
|
22
19
|
/**
|
|
23
20
|
* Augments the target theme with the differences found in the source theme.
|
|
24
21
|
*
|
|
@@ -27,6 +24,9 @@ var warnedOnce = false;
|
|
|
27
24
|
* @returns {Object} - A new modified material UI theme.
|
|
28
25
|
*/
|
|
29
26
|
|
|
27
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
28
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
29
|
+
|
|
30
30
|
var applyCustomTheme = function applyCustomTheme(InputTargetTheme, InputSourceTheme) {
|
|
31
31
|
var muiDefaultTheme = createTheme();
|
|
32
32
|
var targetTheme = cloneDeep(InputTargetTheme);
|
|
@@ -82,31 +82,21 @@ var HvProvider = function HvProvider(_ref) {
|
|
|
82
82
|
locale = _ref$locale === void 0 ? "en-US" : _ref$locale,
|
|
83
83
|
generateClassNameProp = _ref.generateClassName,
|
|
84
84
|
generateClassNameOptions = _ref.generateClassNameOptions,
|
|
85
|
-
_ref$injectStylesFirs = _ref.injectStylesFirst,
|
|
86
|
-
injectStylesFirst = _ref$injectStylesFirs === void 0 ? true : _ref$injectStylesFirs,
|
|
87
85
|
_ref$disableStylesGen = _ref.disableStylesGeneration,
|
|
88
86
|
disableStylesGeneration = _ref$disableStylesGen === void 0 ? false : _ref$disableStylesGen,
|
|
89
|
-
_ref$
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
if (process.env.NODE_ENV !== "production") {
|
|
93
|
-
if (!warnedOnce && !disableCssBaseline) {
|
|
94
|
-
warnedOnce = true; // eslint-disable-next-line no-console
|
|
95
|
-
|
|
96
|
-
console.warn("UI Kit HvProvider's automatic definition of a css styles baseline will be removed in the next major version.\n" + "You can use the `disableCssBaseline` property to disable it already.\n" + "See https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main");
|
|
97
|
-
}
|
|
98
|
-
}
|
|
87
|
+
_ref$cssBaseline = _ref.cssBaseline,
|
|
88
|
+
cssBaseline = _ref$cssBaseline === void 0 ? "global" : _ref$cssBaseline;
|
|
99
89
|
|
|
100
90
|
var _useState = useState(locale),
|
|
101
91
|
_useState2 = _slicedToArray(_useState, 2),
|
|
102
92
|
localeSetting = _useState2[0],
|
|
103
|
-
|
|
93
|
+
setLocaleSetting = _useState2[1];
|
|
104
94
|
|
|
105
95
|
useEffect(function () {
|
|
106
96
|
var _navigator;
|
|
107
97
|
|
|
108
98
|
// ssr - only runs at the rendering phase, so it won't run on the server
|
|
109
|
-
|
|
99
|
+
setLocaleSetting(locale || ((_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.language));
|
|
110
100
|
}, [locale]);
|
|
111
101
|
var rawUiKitTheme = getTheme(uiKitTheme);
|
|
112
102
|
var customTheme = applyCustomTheme(themeBuilder(rawUiKitTheme), theme);
|
|
@@ -117,14 +107,27 @@ var HvProvider = function HvProvider(_ref) {
|
|
|
117
107
|
locale: localeSetting
|
|
118
108
|
};
|
|
119
109
|
}, [changeTheme, localeSetting]);
|
|
110
|
+
|
|
111
|
+
var renderCssBaseline = function renderCssBaseline() {
|
|
112
|
+
if (cssBaseline === "global") {
|
|
113
|
+
return _HvCssBaseline || (_HvCssBaseline = /*#__PURE__*/_jsx(HvCssBaseline, {}));
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
if (cssBaseline === "scoped") {
|
|
117
|
+
return _HvScopedCssBaseline || (_HvScopedCssBaseline = /*#__PURE__*/_jsx(HvScopedCssBaseline, {}));
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
return null;
|
|
121
|
+
};
|
|
122
|
+
|
|
120
123
|
return /*#__PURE__*/_jsx(StyledEngineProvider, {
|
|
121
|
-
injectFirst:
|
|
124
|
+
injectFirst: true,
|
|
122
125
|
children: /*#__PURE__*/_jsx(StylesProvider, {
|
|
123
126
|
generateClassName: generateClassName,
|
|
124
127
|
disableGeneration: disableStylesGeneration,
|
|
125
128
|
children: /*#__PURE__*/_jsxs(ThemeProvider, {
|
|
126
129
|
theme: customTheme,
|
|
127
|
-
children: [
|
|
130
|
+
children: [renderCssBaseline(), /*#__PURE__*/_jsx(ConfigContext.Provider, {
|
|
128
131
|
value: pConfig,
|
|
129
132
|
children: children
|
|
130
133
|
})]
|
|
@@ -195,33 +198,19 @@ process.env.NODE_ENV !== "production" ? HvProvider.propTypes = {
|
|
|
195
198
|
seed: PropTypes.string
|
|
196
199
|
}),
|
|
197
200
|
|
|
198
|
-
/**
|
|
199
|
-
* Injects the generated stylesheets at the top of the `<head>` element of the page.
|
|
200
|
-
* This can ease the override of UI Kit components styles.
|
|
201
|
-
*
|
|
202
|
-
* By default, the styles are injected last in the `<head>` element of the page.
|
|
203
|
-
*/
|
|
204
|
-
injectStylesFirst: PropTypes.bool,
|
|
205
|
-
|
|
206
201
|
/**
|
|
207
202
|
* Disables the generation of the styles.
|
|
208
203
|
*/
|
|
209
204
|
disableStylesGeneration: PropTypes.bool,
|
|
210
205
|
|
|
211
206
|
/**
|
|
212
|
-
*
|
|
213
|
-
*
|
|
214
|
-
*
|
|
215
|
-
*
|
|
216
|
-
* The application using UI Kit should be responsible for adding the baseline css styles, by
|
|
217
|
-
* either using the `<HvCssBaseline />` component, using the `<HvScopedCssBaseline />` component,
|
|
218
|
-
* or ensuring that the necessary base styles are applied.
|
|
219
|
-
*
|
|
220
|
-
* Defaults to `false`. Will be removed in the next major release.
|
|
207
|
+
* By default the baseline styles are applied globally to the application.
|
|
208
|
+
* If you need to scope the CSS to avoid styling conflicts, you can set this prop to `"scoped"`.
|
|
209
|
+
* If you are providing the baseline styles, you can set this prop to false.
|
|
221
210
|
*
|
|
222
|
-
* @see https://lumada-design.github.io/uikit/master/?path=/docs/
|
|
211
|
+
* @see https://lumada-design.github.io/uikit/master/?path=/docs/theme-css-baseline--page
|
|
223
212
|
*/
|
|
224
|
-
|
|
213
|
+
cssBaseline: PropTypes.oneOf(["global", "scoped", "none"])
|
|
225
214
|
} : void 0;
|
|
226
215
|
export default HvProvider;
|
|
227
216
|
//# sourceMappingURL=Provider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.js","names":["React","useState","useEffect","useMemo","PropTypes","set","merge","isEmpty","cloneDeep","diff","createTheme","ThemeProvider","StylesProvider","StyledEngineProvider","themeBuilder","createGenerateClassName","HvCssBaseline","getTheme","ConfigContext","warnedOnce","applyCustomTheme","InputTargetTheme","InputSourceTheme","muiDefaultTheme","targetTheme","sourceTheme","deleteDifference","observableDiff","difference","partialCustomTheme","path","rhs","kind","HvProvider","children","uiKitTheme","theme","changeTheme","locale","generateClassNameProp","generateClassName","generateClassNameOptions","injectStylesFirst","disableStylesGeneration","disableCssBaseline","process","env","NODE_ENV","console","warn","localeSetting","setLocaleStting","navigator","language","rawUiKitTheme","customTheme","pConfig","propTypes","node","isRequired","oneOf","instanceOf","Object","func","string","shape","disableGlobal","bool","productionPrefix","seed"],"sources":["../../../src/Provider/Provider.js"],"sourcesContent":["import React, { useState, useEffect, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport set from \"lodash/set\";\nimport merge from \"lodash/merge\";\nimport isEmpty from \"lodash/isEmpty\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport diff from \"deep-diff\";\n\nimport \"focus-within-polyfill\";\nimport \"focus-visible\";\n\nimport { createTheme, ThemeProvider } from \"@mui/material\";\nimport { StylesProvider } from \"@mui/styles\";\nimport { StyledEngineProvider } from \"@mui/material/styles\";\nimport { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme } from \"../theme\";\n\nimport ConfigContext from \"./context\";\n\nlet warnedOnce = false;\n\n/**\n * Augments the target theme with the differences found in the source theme.\n *\n * @param {Object} InputTargetTheme - A material UI Theme to be changed.\n * @param {Object} InputSourceTheme - A material UI Theme to apply on top.\n * @returns {Object} - A new modified material UI theme.\n */\nconst applyCustomTheme = (InputTargetTheme, InputSourceTheme) => {\n const muiDefaultTheme = createTheme();\n const targetTheme = cloneDeep(InputTargetTheme);\n const sourceTheme = cloneDeep(InputSourceTheme);\n const deleteDifference = \"D\";\n if (!isEmpty(targetTheme) && !isEmpty(sourceTheme)) {\n diff.observableDiff(muiDefaultTheme, sourceTheme, (difference) => {\n const partialCustomTheme = set({}, difference.path, difference.rhs);\n if (difference.kind !== deleteDifference) {\n // Do not include the differences of type \"delete\"\n merge(targetTheme, partialCustomTheme);\n }\n });\n return targetTheme;\n }\n return targetTheme;\n};\n\n/**\n * This component makes cross-component properties, like the active `theme` and `locale`,\n * available down the React tree thanks to React context.\n *\n * This component should preferably be used at **the root of your component tree** and\n * be unique in the App in most cases.\n *\n * ```jsx\n * <HvProvider>\n * <MyApp />\n * <HvProvider/>\n * ```\n *\n * If several `HvProvider`'s are used, either nested or in parallel, the `generateClassNameOptions`\n * must be tweaked to avoid CSS classnames collision. Or a custom JSS's class name generator can\n * be provided via the `generateClassName` property.\n *\n * **UI Kit components will not work at all if the `HvProvider` is not configured correctly**,\n * as they will not be able to access the properties of the active theme..\n *\n */\nconst HvProvider = ({\n children,\n\n uiKitTheme = \"dawn\",\n theme = null,\n changeTheme = () => {},\n\n locale = \"en-US\",\n\n generateClassName: generateClassNameProp,\n generateClassNameOptions,\n injectStylesFirst = true,\n disableStylesGeneration = false,\n\n disableCssBaseline = false,\n}) => {\n if (process.env.NODE_ENV !== \"production\") {\n if (!warnedOnce && !disableCssBaseline) {\n warnedOnce = true;\n // eslint-disable-next-line no-console\n console.warn(\n \"UI Kit HvProvider's automatic definition of a css styles baseline will be removed in the next major version.\\n\" +\n \"You can use the `disableCssBaseline` property to disable it already.\\n\" +\n \"See https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\"\n );\n }\n }\n\n const [localeSetting, setLocaleStting] = useState(locale);\n\n useEffect(() => {\n // ssr - only runs at the rendering phase, so it won't run on the server\n setLocaleStting(locale || navigator?.language);\n }, [locale]);\n\n const rawUiKitTheme = getTheme(uiKitTheme);\n const customTheme = applyCustomTheme(themeBuilder(rawUiKitTheme), theme);\n\n const generateClassName =\n generateClassNameProp || createGenerateClassName(generateClassNameOptions);\n\n const pConfig = useMemo(\n () => ({ changeTheme, locale: localeSetting }),\n [changeTheme, localeSetting]\n );\n\n return (\n <StyledEngineProvider injectFirst={injectStylesFirst}>\n <StylesProvider\n generateClassName={generateClassName}\n disableGeneration={disableStylesGeneration}\n >\n <ThemeProvider theme={customTheme}>\n {!disableCssBaseline && <HvCssBaseline />}\n <ConfigContext.Provider value={pConfig}>{children}</ConfigContext.Provider>\n </ThemeProvider>\n </StylesProvider>\n </StyledEngineProvider>\n );\n};\n\nHvProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node.isRequired,\n\n /**\n * The Design System base theme in use. Defaults to `\"dawn\"`.\n */\n uiKitTheme: PropTypes.oneOf([\"dawn\", \"wicked\"]),\n /**\n * The UI Kit theme object to be applied on top of the base theme.\n */\n theme: PropTypes.instanceOf(Object),\n /**\n * Function stored in the provider's context to allow runtime switching of the active theme.\n * The implementation is up to each App.\n */\n changeTheme: PropTypes.func,\n\n /**\n * The locale to be used.\n * Defaults to the browser's configured locale or \"en-US\" if not available.\n */\n locale: PropTypes.string,\n\n /**\n * Custom JSS's class name generator.\n */\n generateClassName: PropTypes.func,\n /**\n * Built-in JSS's class name generator options.\n * Ignored if a custom `generateClassName` is provided.\n *\n * `disableGlobal`: Disable the generation of deterministic class names. Defaults to `false`.\n *\n * `productionPrefix`: The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n *\n * `seed`: The string used to uniquely identify the generator. Defaults to `\"\"`.\n * It can be used to avoid class name collisions when using multiple generators in the same document.\n */\n generateClassNameOptions: PropTypes.shape({\n /**\n * Disable the generation of deterministic class names. Defaults to `false`.\n */\n disableGlobal: PropTypes.bool,\n /**\n * The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n */\n productionPrefix: PropTypes.string,\n /**\n * The string used to uniquely identify the generator. Defaults to `\"\"`.\n * It can be used to avoid class name collisions when using multiple generators in the same document.\n */\n seed: PropTypes.string,\n }),\n /**\n * Injects the generated stylesheets at the top of the `<head>` element of the page.\n * This can ease the override of UI Kit components styles.\n *\n * By default, the styles are injected last in the `<head>` element of the page.\n */\n injectStylesFirst: PropTypes.bool,\n /**\n * Disables the generation of the styles.\n */\n disableStylesGeneration: PropTypes.bool,\n\n /**\n * Disables the generation of the baseline css styles.\n *\n * This will be the default behavior in the future.\n *\n * The application using UI Kit should be responsible for adding the baseline css styles, by\n * either using the `<HvCssBaseline />` component, using the `<HvScopedCssBaseline />` component,\n * or ensuring that the necessary base styles are applied.\n *\n * Defaults to `false`. Will be removed in the next major release.\n *\n * @see https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\n */\n disableCssBaseline: PropTypes.bool,\n};\n\nexport default HvProvider;\n"],"mappings":";;;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,EAA0BC,SAA1B,EAAqCC,OAArC,QAAoD,OAApD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,GAAP,MAAgB,YAAhB;AACA,OAAOC,KAAP,MAAkB,cAAlB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,SAAP,MAAsB,kBAAtB;AACA,OAAOC,IAAP,MAAiB,WAAjB;AAEA,OAAO,uBAAP;AACA,OAAO,eAAP;AAEA,SAASC,WAAT,EAAsBC,aAAtB,QAA2C,eAA3C;AACA,SAASC,cAAT,QAA+B,aAA/B;AACA,SAASC,oBAAT,QAAqC,sBAArC;AACA,SAASC,YAAT,EAAuBC,uBAAvB,EAAgDC,aAAhD,EAA+DC,QAA/D,QAA+E,UAA/E;AAEA,OAAOC,aAAP,MAA0B,WAA1B;;;AAEA,IAAIC,UAAU,GAAG,KAAjB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,gBAAD,EAAmBC,gBAAnB,EAAwC;EAC/D,IAAMC,eAAe,GAAGb,WAAW,EAAnC;EACA,IAAMc,WAAW,GAAGhB,SAAS,CAACa,gBAAD,CAA7B;EACA,IAAMI,WAAW,GAAGjB,SAAS,CAACc,gBAAD,CAA7B;EACA,IAAMI,gBAAgB,GAAG,GAAzB;;EACA,IAAI,CAACnB,OAAO,CAACiB,WAAD,CAAR,IAAyB,CAACjB,OAAO,CAACkB,WAAD,CAArC,EAAoD;IAClDhB,IAAI,CAACkB,cAAL,CAAoBJ,eAApB,EAAqCE,WAArC,EAAkD,UAACG,UAAD,EAAgB;MAChE,IAAMC,kBAAkB,GAAGxB,GAAG,CAAC,EAAD,EAAKuB,UAAU,CAACE,IAAhB,EAAsBF,UAAU,CAACG,GAAjC,CAA9B;;MACA,IAAIH,UAAU,CAACI,IAAX,KAAoBN,gBAAxB,EAA0C;QACxC;QACApB,KAAK,CAACkB,WAAD,EAAcK,kBAAd,CAAL;MACD;IACF,CAND;IAOA,OAAOL,WAAP;EACD;;EACD,OAAOA,WAAP;AACD,CAhBD;AAkBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,IAAMS,UAAU,GAAG,SAAbA,UAAa,OAeb;EAAA,IAdJC,QAcI,QAdJA,QAcI;EAAA,2BAZJC,UAYI;EAAA,IAZJA,UAYI,gCAZS,MAYT;EAAA,sBAXJC,KAWI;EAAA,IAXJA,KAWI,2BAXI,IAWJ;EAAA,4BAVJC,WAUI;EAAA,IAVJA,WAUI,iCAVU,YAAM,CAAE,CAUlB;EAAA,uBARJC,MAQI;EAAA,IARJA,MAQI,4BARK,OAQL;EAAA,IANeC,qBAMf,QANJC,iBAMI;EAAA,IALJC,wBAKI,QALJA,wBAKI;EAAA,iCAJJC,iBAII;EAAA,IAJJA,iBAII,sCAJgB,IAIhB;EAAA,iCAHJC,uBAGI;EAAA,IAHJA,uBAGI,sCAHsB,KAGtB;EAAA,iCADJC,kBACI;EAAA,IADJA,kBACI,sCADiB,KACjB;;EACJ,IAAIC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;IACzC,IAAI,CAAC5B,UAAD,IAAe,CAACyB,kBAApB,EAAwC;MACtCzB,UAAU,GAAG,IAAb,CADsC,CAEtC;;MACA6B,OAAO,CAACC,IAAR,CACE,mHACE,wEADF,GAEE,4FAHJ;IAKD;EACF;;EAED,gBAAyChD,QAAQ,CAACqC,MAAD,CAAjD;EAAA;EAAA,IAAOY,aAAP;EAAA,IAAsBC,eAAtB;;EAEAjD,SAAS,CAAC,YAAM;IAAA;;IACd;IACAiD,eAAe,CAACb,MAAM,mBAAIc,SAAJ,+CAAI,WAAWC,QAAf,CAAP,CAAf;EACD,CAHQ,EAGN,CAACf,MAAD,CAHM,CAAT;EAKA,IAAMgB,aAAa,GAAGrC,QAAQ,CAACkB,UAAD,CAA9B;EACA,IAAMoB,WAAW,GAAGnC,gBAAgB,CAACN,YAAY,CAACwC,aAAD,CAAb,EAA8BlB,KAA9B,CAApC;EAEA,IAAMI,iBAAiB,GACrBD,qBAAqB,IAAIxB,uBAAuB,CAAC0B,wBAAD,CADlD;EAGA,IAAMe,OAAO,GAAGrD,OAAO,CACrB;IAAA,OAAO;MAAEkC,WAAW,EAAXA,WAAF;MAAeC,MAAM,EAAEY;IAAvB,CAAP;EAAA,CADqB,EAErB,CAACb,WAAD,EAAca,aAAd,CAFqB,CAAvB;EAKA,oBACE,KAAC,oBAAD;IAAsB,WAAW,EAAER,iBAAnC;IAAA,uBACE,KAAC,cAAD;MACE,iBAAiB,EAAEF,iBADrB;MAEE,iBAAiB,EAAEG,uBAFrB;MAAA,uBAIE,MAAC,aAAD;QAAe,KAAK,EAAEY,WAAtB;QAAA,WACG,CAACX,kBAAD,sDAAuB,KAAC,aAAD,KAAvB,EADH,eAEE,KAAC,aAAD,CAAe,QAAf;UAAwB,KAAK,EAAEY,OAA/B;UAAA,UAAyCtB;QAAzC,EAFF;MAAA;IAJF;EADF,EADF;AAaD,CA3DD;;AA6DA,wCAAAD,UAAU,CAACwB,SAAX,GAAuB;EACrB;AACF;AACA;EACEvB,QAAQ,EAAE9B,SAAS,CAACsD,IAAV,CAAeC,UAJJ;;EAMrB;AACF;AACA;EACExB,UAAU,EAAE/B,SAAS,CAACwD,KAAV,CAAgB,CAAC,MAAD,EAAS,QAAT,CAAhB,CATS;;EAUrB;AACF;AACA;EACExB,KAAK,EAAEhC,SAAS,CAACyD,UAAV,CAAqBC,MAArB,CAbc;;EAcrB;AACF;AACA;AACA;EACEzB,WAAW,EAAEjC,SAAS,CAAC2D,IAlBF;;EAoBrB;AACF;AACA;AACA;EACEzB,MAAM,EAAElC,SAAS,CAAC4D,MAxBG;;EA0BrB;AACF;AACA;EACExB,iBAAiB,EAAEpC,SAAS,CAAC2D,IA7BR;;EA8BrB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEtB,wBAAwB,EAAErC,SAAS,CAAC6D,KAAV,CAAgB;IACxC;AACJ;AACA;IACIC,aAAa,EAAE9D,SAAS,CAAC+D,IAJe;;IAKxC;AACJ;AACA;IACIC,gBAAgB,EAAEhE,SAAS,CAAC4D,MARY;;IASxC;AACJ;AACA;AACA;IACIK,IAAI,EAAEjE,SAAS,CAAC4D;EAbwB,CAAhB,CAzCL;;EAwDrB;AACF;AACA;AACA;AACA;AACA;EACEtB,iBAAiB,EAAEtC,SAAS,CAAC+D,IA9DR;;EA+DrB;AACF;AACA;EACExB,uBAAuB,EAAEvC,SAAS,CAAC+D,IAlEd;;EAoErB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEvB,kBAAkB,EAAExC,SAAS,CAAC+D;AAjFT,CAAvB;AAoFA,eAAelC,UAAf"}
|
|
1
|
+
{"version":3,"file":"Provider.js","names":["React","useState","useEffect","useMemo","PropTypes","set","merge","isEmpty","cloneDeep","diff","createTheme","ThemeProvider","StylesProvider","StyledEngineProvider","themeBuilder","createGenerateClassName","HvCssBaseline","getTheme","HvScopedCssBaseline","ConfigContext","applyCustomTheme","InputTargetTheme","InputSourceTheme","muiDefaultTheme","targetTheme","sourceTheme","deleteDifference","observableDiff","difference","partialCustomTheme","path","rhs","kind","HvProvider","children","uiKitTheme","theme","changeTheme","locale","generateClassNameProp","generateClassName","generateClassNameOptions","disableStylesGeneration","cssBaseline","localeSetting","setLocaleSetting","navigator","language","rawUiKitTheme","customTheme","pConfig","renderCssBaseline","propTypes","node","isRequired","oneOf","instanceOf","Object","func","string","shape","disableGlobal","bool","productionPrefix","seed"],"sources":["../../../src/Provider/Provider.js"],"sourcesContent":["import React, { useState, useEffect, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport set from \"lodash/set\";\nimport merge from \"lodash/merge\";\nimport isEmpty from \"lodash/isEmpty\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport diff from \"deep-diff\";\n\nimport \"focus-within-polyfill\";\nimport \"focus-visible\";\n\nimport { createTheme, ThemeProvider } from \"@mui/material\";\nimport { StylesProvider } from \"@mui/styles\";\nimport { StyledEngineProvider } from \"@mui/material/styles\";\nimport {\n themeBuilder,\n createGenerateClassName,\n HvCssBaseline,\n getTheme,\n HvScopedCssBaseline,\n} from \"../theme\";\n\nimport ConfigContext from \"./context\";\n\n/**\n * Augments the target theme with the differences found in the source theme.\n *\n * @param {Object} InputTargetTheme - A material UI Theme to be changed.\n * @param {Object} InputSourceTheme - A material UI Theme to apply on top.\n * @returns {Object} - A new modified material UI theme.\n */\nconst applyCustomTheme = (InputTargetTheme, InputSourceTheme) => {\n const muiDefaultTheme = createTheme();\n const targetTheme = cloneDeep(InputTargetTheme);\n const sourceTheme = cloneDeep(InputSourceTheme);\n const deleteDifference = \"D\";\n if (!isEmpty(targetTheme) && !isEmpty(sourceTheme)) {\n diff.observableDiff(muiDefaultTheme, sourceTheme, (difference) => {\n const partialCustomTheme = set({}, difference.path, difference.rhs);\n if (difference.kind !== deleteDifference) {\n // Do not include the differences of type \"delete\"\n merge(targetTheme, partialCustomTheme);\n }\n });\n return targetTheme;\n }\n return targetTheme;\n};\n\n/**\n * This component makes cross-component properties, like the active `theme` and `locale`,\n * available down the React tree thanks to React context.\n *\n * This component should preferably be used at **the root of your component tree** and\n * be unique in the App in most cases.\n *\n * ```jsx\n * <HvProvider>\n * <MyApp />\n * <HvProvider/>\n * ```\n *\n * If several `HvProvider`'s are used, either nested or in parallel, the `generateClassNameOptions`\n * must be tweaked to avoid CSS classnames collision. Or a custom JSS's class name generator can\n * be provided via the `generateClassName` property.\n *\n * **UI Kit components will not work at all if the `HvProvider` is not configured correctly**,\n * as they will not be able to access the properties of the active theme..\n *\n */\nconst HvProvider = ({\n children,\n\n uiKitTheme = \"dawn\",\n theme = null,\n changeTheme = () => {},\n\n locale = \"en-US\",\n\n generateClassName: generateClassNameProp,\n generateClassNameOptions,\n disableStylesGeneration = false,\n\n cssBaseline = \"global\",\n}) => {\n const [localeSetting, setLocaleSetting] = useState(locale);\n\n useEffect(() => {\n // ssr - only runs at the rendering phase, so it won't run on the server\n setLocaleSetting(locale || navigator?.language);\n }, [locale]);\n\n const rawUiKitTheme = getTheme(uiKitTheme);\n const customTheme = applyCustomTheme(themeBuilder(rawUiKitTheme), theme);\n\n const generateClassName =\n generateClassNameProp || createGenerateClassName(generateClassNameOptions);\n\n const pConfig = useMemo(\n () => ({ changeTheme, locale: localeSetting }),\n [changeTheme, localeSetting]\n );\n\n const renderCssBaseline = () => {\n if (cssBaseline === \"global\") {\n return <HvCssBaseline />;\n }\n if (cssBaseline === \"scoped\") {\n return <HvScopedCssBaseline />;\n }\n return null;\n };\n\n return (\n <StyledEngineProvider injectFirst>\n <StylesProvider\n generateClassName={generateClassName}\n disableGeneration={disableStylesGeneration}\n >\n <ThemeProvider theme={customTheme}>\n {renderCssBaseline()}\n <ConfigContext.Provider value={pConfig}>{children}</ConfigContext.Provider>\n </ThemeProvider>\n </StylesProvider>\n </StyledEngineProvider>\n );\n};\n\nHvProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node.isRequired,\n\n /**\n * The Design System base theme in use. Defaults to `\"dawn\"`.\n */\n uiKitTheme: PropTypes.oneOf([\"dawn\", \"wicked\"]),\n /**\n * The UI Kit theme object to be applied on top of the base theme.\n */\n theme: PropTypes.instanceOf(Object),\n /**\n * Function stored in the provider's context to allow runtime switching of the active theme.\n * The implementation is up to each App.\n */\n changeTheme: PropTypes.func,\n\n /**\n * The locale to be used.\n * Defaults to the browser's configured locale or \"en-US\" if not available.\n */\n locale: PropTypes.string,\n\n /**\n * Custom JSS's class name generator.\n */\n generateClassName: PropTypes.func,\n /**\n * Built-in JSS's class name generator options.\n * Ignored if a custom `generateClassName` is provided.\n *\n * `disableGlobal`: Disable the generation of deterministic class names. Defaults to `false`.\n *\n * `productionPrefix`: The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n *\n * `seed`: The string used to uniquely identify the generator. Defaults to `\"\"`.\n * It can be used to avoid class name collisions when using multiple generators in the same document.\n */\n generateClassNameOptions: PropTypes.shape({\n /**\n * Disable the generation of deterministic class names. Defaults to `false`.\n */\n disableGlobal: PropTypes.bool,\n /**\n * The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n */\n productionPrefix: PropTypes.string,\n /**\n * The string used to uniquely identify the generator. Defaults to `\"\"`.\n * It can be used to avoid class name collisions when using multiple generators in the same document.\n */\n seed: PropTypes.string,\n }),\n /**\n * Disables the generation of the styles.\n */\n disableStylesGeneration: PropTypes.bool,\n /**\n * By default the baseline styles are applied globally to the application.\n * If you need to scope the CSS to avoid styling conflicts, you can set this prop to `\"scoped\"`.\n * If you are providing the baseline styles, you can set this prop to false.\n *\n * @see https://lumada-design.github.io/uikit/master/?path=/docs/theme-css-baseline--page\n */\n cssBaseline: PropTypes.oneOf([\"global\", \"scoped\", \"none\"]),\n};\n\nexport default HvProvider;\n"],"mappings":"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"}
|
|
@@ -1,17 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export type GridSpacing = "xs" | "sm" | "md" | "lg";
|
|
4
|
-
export type Breakpoints = {
|
|
1
|
+
export type Spacing = "xs" | "sm" | "md" | "lg";
|
|
2
|
+
export type Breakpoint = {
|
|
5
3
|
cols?: number;
|
|
6
4
|
maxWidth?: number;
|
|
7
5
|
minWidth?: number;
|
|
8
|
-
spacing?:
|
|
6
|
+
spacing?: Spacing;
|
|
9
7
|
};
|
|
10
8
|
|
|
11
|
-
export interface SimpleGridProps
|
|
12
|
-
|
|
9
|
+
export interface SimpleGridProps {
|
|
10
|
+
children?: JSX.Element | JSX.Element[];
|
|
11
|
+
spacing?: Spacing;
|
|
13
12
|
cols?: number;
|
|
14
|
-
breakpoints?:
|
|
13
|
+
breakpoints?: Breakpoint[];
|
|
15
14
|
}
|
|
16
15
|
|
|
17
16
|
export default function HvSimpleGrid(props: SimpleGridProps): JSX.Element | null;
|
|
@@ -9,6 +9,10 @@ export interface HvTableBodyProps
|
|
|
9
9
|
* Defaults to `thead`.
|
|
10
10
|
*/
|
|
11
11
|
component?: React.ElementType<React.HTMLAttributes<HTMLElement>>;
|
|
12
|
+
/**
|
|
13
|
+
* Sets whether or not there should be arrow navigation between the table rows
|
|
14
|
+
*/
|
|
15
|
+
withNavigation?: boolean;
|
|
12
16
|
}
|
|
13
17
|
|
|
14
18
|
export default function HvTableBody(props: HvTableBodyProps): JSX.Element | null;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
export { hvTextColumn, hvNumberColumn, hvDateColumn, hvExpandColumn, hvTagColumn, hvSwitchColumn, hvDropdownColumn, hvProgressColumn } from "./renderers";
|
|
1
2
|
export { default as HvDateColumnCell } from "./DateColumnCell";
|
|
2
3
|
export { default as HvDropdownColumnCell } from "./DropdownColumnCell";
|
|
3
4
|
export { default as HvProgressColumnCell, normalizeProgressBar } from "./ProgressColumnCell";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["default","HvDateColumnCell","HvDropdownColumnCell","HvProgressColumnCell","normalizeProgressBar","HvSwitchColumnCell"],"sources":["../../../../src/Table/renderers/index.js"],"sourcesContent":["export { default as HvDateColumnCell } from \"./DateColumnCell\";\nexport { default as HvDropdownColumnCell } from \"./DropdownColumnCell\";\nexport { default as HvProgressColumnCell, normalizeProgressBar } from \"./ProgressColumnCell\";\nexport { default as HvSwitchColumnCell } from \"./SwitchColumnCell\";\n"],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.js","names":["hvTextColumn","hvNumberColumn","hvDateColumn","hvExpandColumn","hvTagColumn","hvSwitchColumn","hvDropdownColumn","hvProgressColumn","default","HvDateColumnCell","HvDropdownColumnCell","HvProgressColumnCell","normalizeProgressBar","HvSwitchColumnCell"],"sources":["../../../../src/Table/renderers/index.js"],"sourcesContent":["export {\n hvTextColumn,\n hvNumberColumn,\n hvDateColumn,\n hvExpandColumn,\n hvTagColumn,\n hvSwitchColumn,\n hvDropdownColumn,\n hvProgressColumn,\n} from \"./renderers\";\nexport { default as HvDateColumnCell } from \"./DateColumnCell\";\nexport { default as HvDropdownColumnCell } from \"./DropdownColumnCell\";\nexport { default as HvProgressColumnCell, normalizeProgressBar } from \"./ProgressColumnCell\";\nexport { default as HvSwitchColumnCell } from \"./SwitchColumnCell\";\n"],"mappings":"AAAA,SACEA,YADF,EAEEC,cAFF,EAGEC,YAHF,EAIEC,cAJF,EAKEC,WALF,EAMEC,cANF,EAOEC,gBAPF,EAQEC,gBARF,QASO,aATP;AAUA,SAASC,OAAO,IAAIC,gBAApB,QAA4C,kBAA5C;AACA,SAASD,OAAO,IAAIE,oBAApB,QAAgD,sBAAhD;AACA,SAASF,OAAO,IAAIG,oBAApB,EAA0CC,oBAA1C,QAAsE,sBAAtE;AACA,SAASJ,OAAO,IAAIK,kBAApB,QAA8C,oBAA9C"}
|
|
@@ -28,7 +28,7 @@ import { hvStringFallback, hvNumberFallback } from "../utils";
|
|
|
28
28
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
29
29
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
30
30
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
31
|
-
export
|
|
31
|
+
export function hvTextColumn(col) {
|
|
32
32
|
return _objectSpread({
|
|
33
33
|
Cell: function Cell(cellProps) {
|
|
34
34
|
return /*#__PURE__*/_jsx(HvOverflowTooltip, {
|
|
@@ -37,8 +37,8 @@ export var hvTextColumn = function hvTextColumn(col) {
|
|
|
37
37
|
},
|
|
38
38
|
sortType: "alphanumeric"
|
|
39
39
|
}, col);
|
|
40
|
-
}
|
|
41
|
-
export
|
|
40
|
+
}
|
|
41
|
+
export function hvNumberColumn(col) {
|
|
42
42
|
return _objectSpread({
|
|
43
43
|
Cell: function Cell(_ref) {
|
|
44
44
|
var value = _ref.value;
|
|
@@ -47,8 +47,8 @@ export var hvNumberColumn = function hvNumberColumn(col) {
|
|
|
47
47
|
align: "right",
|
|
48
48
|
sortType: "number"
|
|
49
49
|
}, col);
|
|
50
|
-
}
|
|
51
|
-
export
|
|
50
|
+
}
|
|
51
|
+
export function hvDateColumn(col, dateFormat) {
|
|
52
52
|
return _objectSpread({
|
|
53
53
|
Cell: function Cell(cellProps) {
|
|
54
54
|
return /*#__PURE__*/_jsx(DateColumnCell, {
|
|
@@ -59,7 +59,7 @@ export var hvDateColumn = function hvDateColumn(col, dateFormat) {
|
|
|
59
59
|
sortType: "alphanumeric",
|
|
60
60
|
sortDescFirst: true
|
|
61
61
|
}, col);
|
|
62
|
-
}
|
|
62
|
+
}
|
|
63
63
|
export function hvExpandColumn(col, expandRowButtonAriaLabel, collapseRowButtonAriaLabel, getCanRowExpand) {
|
|
64
64
|
return _objectSpread({
|
|
65
65
|
Cell: function Cell(cellProps) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderers.js","names":["React","DropDownXS","DropRightXS","HvButton","HvTag","HvTypography","HvOverflowTooltip","setId","DateColumnCell","SwitchColumnCell","ProgressColumnCell","DropdownColumnCell","hvStringFallback","hvNumberFallback","hvTextColumn","col","Cell","cellProps","value","sortType","hvNumberColumn","align","hvDateColumn","dateFormat","sortDescFirst","hvExpandColumn","expandRowButtonAriaLabel","collapseRowButtonAriaLabel","getCanRowExpand","row","getToggleRowExpandedProps","onClick","hasContent","isExpanded","position","left","top","cellStyle","hvTagColumn","valueDataKey","colorDataKey","textColorDataKey","fromRowData","tagProps","original","name","color","textColor","paddingTop","paddingBottom","hvSwitchColumn","switchLabel","falseLabel","trueLabel","switchProps","id","hvDropdownColumn","placeholder","disabledPlaceholder","onChange","column","dsbld","length","val","hvProgressColumn","getPartial","getTotal","partial","total"],"sources":["../../../../src/Table/renderers/renderers.js"],"sourcesContent":["import React from \"react\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport HvButton from \"../../Button\";\nimport HvTag from \"../../Tag\";\nimport HvTypography from \"../../Typography\";\nimport HvOverflowTooltip from \"../../OverflowTooltip\";\nimport { setId } from \"../../utils\";\n\nimport DateColumnCell from \"./DateColumnCell\";\nimport SwitchColumnCell from \"./SwitchColumnCell\";\nimport ProgressColumnCell from \"./ProgressColumnCell\";\nimport DropdownColumnCell from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\n\nexport const hvTextColumn = (col) => {\n return {\n Cell: (cellProps) => <HvOverflowTooltip data={hvStringFallback(cellProps?.value)} />,\n sortType: \"alphanumeric\",\n ...col,\n };\n};\n\nexport const hvNumberColumn = (col) => {\n return {\n Cell: ({ value }) => hvNumberFallback(value),\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n};\n\nexport const hvDateColumn = (col, dateFormat) => {\n return {\n Cell: (cellProps) => <DateColumnCell date={cellProps?.value} dateFormat={dateFormat} />,\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n};\n\nexport function hvExpandColumn(\n col,\n expandRowButtonAriaLabel,\n collapseRowButtonAriaLabel,\n getCanRowExpand\n) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n const { onClick } = row.getToggleRowExpandedProps();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <>\n {hasContent && (\n <HvButton\n icon\n category=\"ghost\"\n aria-label={row.isExpanded ? collapseRowButtonAriaLabel : expandRowButtonAriaLabel}\n aria-expanded={row.isExpanded}\n onClick={onClick}\n style={{ position: \"absolute\", left: 0, top: 0 }}\n >\n {row.isExpanded ? <DropDownXS /> : <DropRightXS />}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn(\n col,\n valueDataKey,\n colorDataKey,\n textColorDataKey,\n fromRowData = false,\n tagProps\n) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n if (!value) {\n return \"—\";\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"normalText\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvSwitchColumn(col, switchLabel, falseLabel, trueLabel, switchProps) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n return (\n <SwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {\n return {\n Cell: (cellProps) => {\n const { value, row, column } = cellProps;\n const dsbld = value.length < 1;\n return (\n <DropdownColumnCell\n values={value}\n placeholder={dsbld ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={dsbld}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id),\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn(col, getPartial, getTotal, color) {\n return {\n Cell: (cellProps) => {\n const { row } = cellProps;\n const partial = getPartial?.(row);\n const total = getTotal?.(row);\n\n if (total) {\n return <ProgressColumnCell partial={partial} total={total} color={color} />;\n }\n\n return \"—\";\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"renderers.js","names":["React","DropDownXS","DropRightXS","HvButton","HvTag","HvTypography","HvOverflowTooltip","setId","DateColumnCell","SwitchColumnCell","ProgressColumnCell","DropdownColumnCell","hvStringFallback","hvNumberFallback","hvTextColumn","col","Cell","cellProps","value","sortType","hvNumberColumn","align","hvDateColumn","dateFormat","sortDescFirst","hvExpandColumn","expandRowButtonAriaLabel","collapseRowButtonAriaLabel","getCanRowExpand","row","getToggleRowExpandedProps","onClick","hasContent","isExpanded","position","left","top","cellStyle","hvTagColumn","valueDataKey","colorDataKey","textColorDataKey","fromRowData","tagProps","original","name","color","textColor","paddingTop","paddingBottom","hvSwitchColumn","switchLabel","falseLabel","trueLabel","switchProps","id","hvDropdownColumn","placeholder","disabledPlaceholder","onChange","column","dsbld","length","val","hvProgressColumn","getPartial","getTotal","partial","total"],"sources":["../../../../src/Table/renderers/renderers.js"],"sourcesContent":["import React from \"react\";\nimport { DropDownXS, DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport HvButton from \"../../Button\";\nimport HvTag from \"../../Tag\";\nimport HvTypography from \"../../Typography\";\nimport HvOverflowTooltip from \"../../OverflowTooltip\";\nimport { setId } from \"../../utils\";\n\nimport DateColumnCell from \"./DateColumnCell\";\nimport SwitchColumnCell from \"./SwitchColumnCell\";\nimport ProgressColumnCell from \"./ProgressColumnCell\";\nimport DropdownColumnCell from \"./DropdownColumnCell\";\nimport { hvStringFallback, hvNumberFallback } from \"../utils\";\n\nexport function hvTextColumn(col) {\n return {\n Cell: (cellProps) => <HvOverflowTooltip data={hvStringFallback(cellProps?.value)} />,\n sortType: \"alphanumeric\",\n ...col,\n };\n}\n\nexport function hvNumberColumn(col) {\n return {\n Cell: ({ value }) => hvNumberFallback(value),\n align: \"right\",\n sortType: \"number\",\n ...col,\n };\n}\n\nexport function hvDateColumn(col, dateFormat) {\n return {\n Cell: (cellProps) => <DateColumnCell date={cellProps?.value} dateFormat={dateFormat} />,\n sortType: \"alphanumeric\",\n sortDescFirst: true,\n ...col,\n };\n}\n\nexport function hvExpandColumn(\n col,\n expandRowButtonAriaLabel,\n collapseRowButtonAriaLabel,\n getCanRowExpand\n) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n const { onClick } = row.getToggleRowExpandedProps();\n\n const hasContent = getCanRowExpand?.(row) ?? true;\n\n return (\n <>\n {hasContent && (\n <HvButton\n icon\n category=\"ghost\"\n aria-label={row.isExpanded ? collapseRowButtonAriaLabel : expandRowButtonAriaLabel}\n aria-expanded={row.isExpanded}\n onClick={onClick}\n style={{ position: \"absolute\", left: 0, top: 0 }}\n >\n {row.isExpanded ? <DropDownXS /> : <DropRightXS />}\n </HvButton>\n )}\n\n <HvOverflowTooltip data={hvStringFallback(value)} />\n </>\n );\n },\n sortType: \"alphanumeric\",\n cellStyle: {\n position: \"relative\",\n },\n ...col,\n };\n}\n\nexport function hvTagColumn(\n col,\n valueDataKey,\n colorDataKey,\n textColorDataKey,\n fromRowData = false,\n tagProps\n) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n if (!value) {\n return \"—\";\n }\n\n const {\n [valueDataKey]: name,\n [colorDataKey]: color,\n [textColorDataKey]: textColor,\n } = fromRowData ? row.original : value;\n\n return (\n <HvTag\n label={<HvTypography variant=\"normalText\">{name}</HvTypography>}\n type=\"semantic\"\n color={color}\n style={textColor != null ? { color: textColor } : {}}\n tabIndex={-1}\n {...tagProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvSwitchColumn(col, switchLabel, falseLabel, trueLabel, switchProps) {\n return {\n Cell: (cellProps) => {\n const { value, row } = cellProps;\n return (\n <SwitchColumnCell\n checked={value}\n value={row.id}\n switchLabel={switchLabel}\n falseLabel={falseLabel}\n trueLabel={trueLabel}\n switchProps={switchProps}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvDropdownColumn(col, id, placeholder, disabledPlaceholder, onChange) {\n return {\n Cell: (cellProps) => {\n const { value, row, column } = cellProps;\n const dsbld = value.length < 1;\n return (\n <DropdownColumnCell\n values={value}\n placeholder={dsbld ? disabledPlaceholder : placeholder}\n onChange={(val) => onChange?.(row.id, val)}\n disabled={dsbld}\n dropdownProps={{\n \"aria-labelledby\": setId(id, column.id),\n }}\n />\n );\n },\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n\nexport function hvProgressColumn(col, getPartial, getTotal, color) {\n return {\n Cell: (cellProps) => {\n const { row } = cellProps;\n const partial = getPartial?.(row);\n const total = getTotal?.(row);\n\n if (total) {\n return <ProgressColumnCell partial={partial} total={total} color={color} />;\n }\n\n return \"—\";\n },\n\n cellStyle: {\n paddingTop: 0,\n paddingBottom: 0,\n },\n ...col,\n };\n}\n"],"mappings":"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"}
|
package/dist/legacy/Tag/Tag.js
CHANGED
|
@@ -14,14 +14,14 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
14
14
|
|
|
15
15
|
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; }
|
|
16
16
|
|
|
17
|
-
import React, {
|
|
17
|
+
import React, { useState } from "react";
|
|
18
18
|
import { Chip } from "@mui/material";
|
|
19
19
|
import { withStyles, useTheme } from "@mui/styles";
|
|
20
20
|
import PropTypes from "prop-types";
|
|
21
21
|
import clsx from "clsx";
|
|
22
22
|
import { CloseXS } from "@hitachivantara/uikit-react-icons";
|
|
23
23
|
import fade from "../utils/hexToRgbA";
|
|
24
|
-
import { HvButton
|
|
24
|
+
import { HvButton } from "..";
|
|
25
25
|
import styles from "./styles";
|
|
26
26
|
import { getOnDeleteCallback, hasDeleteAction, hasClickAction } from "./utils";
|
|
27
27
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -52,8 +52,6 @@ var getColor = function getColor(theme, customColor, type) {
|
|
|
52
52
|
|
|
53
53
|
|
|
54
54
|
var HvTag = function HvTag(props) {
|
|
55
|
-
var _HvTypography;
|
|
56
|
-
|
|
57
55
|
var classes = props.classes,
|
|
58
56
|
style = props.style,
|
|
59
57
|
className = props.className,
|
|
@@ -115,18 +113,8 @@ var HvTag = function HvTag(props) {
|
|
|
115
113
|
hover = _useState2[0],
|
|
116
114
|
setHover = _useState2[1];
|
|
117
115
|
|
|
118
|
-
var chipLabel = useMemo(function () {
|
|
119
|
-
if (typeof label === "string") {
|
|
120
|
-
return _HvTypography || (_HvTypography = /*#__PURE__*/_jsx(HvTypography, {
|
|
121
|
-
variant: "normalText",
|
|
122
|
-
children: label
|
|
123
|
-
}));
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
return label;
|
|
127
|
-
}, [label]);
|
|
128
116
|
return /*#__PURE__*/_jsx(Chip, _objectSpread({
|
|
129
|
-
label:
|
|
117
|
+
label: label,
|
|
130
118
|
className: clsx(classes.root, className),
|
|
131
119
|
onMouseEnter: function onMouseEnter() {
|
|
132
120
|
setHover(!!onClick);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tag.js","names":["React","useMemo","useState","Chip","withStyles","useTheme","PropTypes","clsx","CloseXS","fade","HvButton","HvTypography","styles","getOnDeleteCallback","hasDeleteAction","hasClickAction","getColor","theme","customColor","type","defaultSemanticColor","hv","palette","semantic","sema7","defaultCategoricalColor","viz","categorical","cviz1","backgroundColor","HvTag","props","classes","style","className","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","getDeleteIcon","disabledSemanticColor","tabIndex","startIcon","tagButton","focusVisible","primary","primaryButton","cursor","undefined","height","inlineStyle","categoricalBackgroundColor","hover","setHover","chipLabel","root","boxShadow","chipRoot","clickable","categoricalDisabled","categoricalFocus","disabledDeleteIcon","propTypes","shape","string","titleOverflow","semanticTextColor","categoricalTextColor","deletable","isRequired","instanceOf","Object","node","bool","oneOf","func","name"],"sources":["../../../src/Tag/Tag.js"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { Chip } from \"@mui/material\";\nimport { withStyles, useTheme } from \"@mui/styles\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport fade from \"../utils/hexToRgbA\";\nimport { HvButton, HvTypography } from \"..\";\nimport styles from \"./styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\n\nconst getColor = (theme, customColor, type) => {\n const defaultSemanticColor = theme.hv.palette.semantic.sema7;\n const defaultCategoricalColor = theme.hv.viz.palette.categorical.cviz1;\n\n let backgroundColor;\n\n if (type === \"semantic\") {\n backgroundColor = theme.palette[customColor] || customColor || defaultSemanticColor;\n }\n if (type === \"categorical\") {\n backgroundColor =\n theme.hv.viz.palette.categorical[customColor] || customColor || defaultCategoricalColor;\n }\n\n return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nconst HvTag = (props) => {\n const {\n classes,\n style,\n className,\n label,\n disabled,\n type = \"semantic\",\n color,\n deleteIcon,\n onDelete,\n onClick,\n role,\n deleteButtonArialLabel = \"Delete tag\",\n deleteButtonProps = {},\n ...others\n } = props;\n\n const getDeleteIcon = () => {\n const disabledSemanticColor = type === \"semantic\" ? \"atmo5\" : \"base2\";\n const { tabIndex = 0 } = deleteButtonProps;\n\n return (\n <HvButton\n classes={{\n startIcon: classes.tagButton,\n focusVisible: classes.focusVisible,\n primary: classes.primaryButton,\n }}\n aria-label={deleteButtonArialLabel}\n tabIndex={tabIndex}\n {...deleteButtonProps}\n >\n <CloseXS\n iconSize=\"XS\"\n style={{\n ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n height: 16,\n }}\n color={disabled ? disabledSemanticColor : \"base2\"}\n />\n </HvButton>\n );\n };\n\n const theme = useTheme();\n\n const inlineStyle = {\n ...style,\n };\n\n let categoricalBackgroundColor;\n\n if (type === \"semantic\") {\n inlineStyle.backgroundColor = getColor(theme, color, type);\n } else if (type === \"categorical\") {\n categoricalBackgroundColor = getColor(theme, color, type);\n\n inlineStyle.backgroundColor = fade(categoricalBackgroundColor, 0.3);\n }\n\n const [hover, setHover] = useState(false);\n\n const chipLabel = useMemo(() => {\n if (typeof label === \"string\") {\n return <HvTypography variant=\"normalText\">{label}</HvTypography>;\n }\n\n return label;\n }, [label]);\n\n return (\n <Chip\n label={chipLabel}\n className={clsx(classes.root, className)}\n onMouseEnter={() => {\n setHover(!!onClick);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n style={{\n ...(disabled ? null : inlineStyle),\n ...(hover && !disabled ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` } : null),\n }}\n classes={{\n root: clsx(classes.chipRoot, {\n [classes.disabled]: disabled,\n [classes.clickable]: !!onClick,\n [classes.categorical]: type === \"categorical\",\n [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n }),\n label: classes.label,\n deleteIcon: clsx(classes.deleteIcon, {\n [classes.disabledDeleteIcon]: disabled,\n }),\n }}\n deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n onDelete={getOnDeleteCallback(disabled, onDelete)}\n onClick={disabled ? undefined : onClick}\n role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n {...others}\n />\n );\n};\n\nHvTag.propTypes = {\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes: PropTypes.shape({\n /**\n * Styles applied to the component.\n */\n root: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n chipRoot: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n label: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n tagButton: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n deleteIcon: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n disabledDeleteIcon: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n titleOverflow: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categorical: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalDisabled: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n disabled: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n semanticTextColor: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalTextColor: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n deletable: PropTypes.string,\n /**\n * Styles applied to the component if has onClick.\n */\n clickable: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n focusVisible: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n primaryButton: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalFocus: PropTypes.string,\n }).isRequired,\n\n /**\n * Inline styles to be applied to the root element.\n */\n style: PropTypes.instanceOf(Object),\n\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n\n /**\n * The label of the tag element.\n *\n */\n label: PropTypes.node,\n\n /**\n * Indicates that the form element is disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * The type of the tag element.\n *\n * A tag can be of semantic or categoric type\n */\n type: PropTypes.oneOf([\"semantic\", \"categorical\"]),\n\n /**\n * Background color to be applied to the tag\n */\n color: PropTypes.string,\n /**\n * Icon used to customize the delete icon in the Chip element\n */\n deleteIcon: PropTypes.node,\n\n /**\n * The callback fired when the delete icon is pressed.\n * This function has to be provided to the component,\n * in order to render the delete icon\n */\n onDelete: PropTypes.func,\n /**\n * Callback triggered when any item is clicked.\n */\n onClick: PropTypes.func,\n\n /**\n * The role of the element with an attributed event.\n */\n role: PropTypes.string,\n /**\n * Aria properties to apply to delete button in tag\n */\n deleteButtonArialLabel: PropTypes.string,\n /**\n * Props to apply to delete button\n */\n deleteButtonProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvTag\" })(HvTag);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tag.js","names":["React","useState","Chip","withStyles","useTheme","PropTypes","clsx","CloseXS","fade","HvButton","styles","getOnDeleteCallback","hasDeleteAction","hasClickAction","getColor","theme","customColor","type","defaultSemanticColor","hv","palette","semantic","sema7","defaultCategoricalColor","viz","categorical","cviz1","backgroundColor","HvTag","props","classes","style","className","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","getDeleteIcon","disabledSemanticColor","tabIndex","startIcon","tagButton","focusVisible","primary","primaryButton","cursor","undefined","height","inlineStyle","categoricalBackgroundColor","hover","setHover","root","boxShadow","chipRoot","clickable","categoricalDisabled","categoricalFocus","disabledDeleteIcon","propTypes","shape","string","titleOverflow","semanticTextColor","categoricalTextColor","deletable","isRequired","instanceOf","Object","node","bool","oneOf","func","name"],"sources":["../../../src/Tag/Tag.js"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Chip } from \"@mui/material\";\nimport { withStyles, useTheme } from \"@mui/styles\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\nimport fade from \"../utils/hexToRgbA\";\nimport { HvButton } from \"..\";\nimport styles from \"./styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\n\nconst getColor = (theme, customColor, type) => {\n const defaultSemanticColor = theme.hv.palette.semantic.sema7;\n const defaultCategoricalColor = theme.hv.viz.palette.categorical.cviz1;\n\n let backgroundColor;\n\n if (type === \"semantic\") {\n backgroundColor = theme.palette[customColor] || customColor || defaultSemanticColor;\n }\n if (type === \"categorical\") {\n backgroundColor =\n theme.hv.viz.palette.categorical[customColor] || customColor || defaultCategoricalColor;\n }\n\n return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nconst HvTag = (props) => {\n const {\n classes,\n style,\n className,\n label,\n disabled,\n type = \"semantic\",\n color,\n deleteIcon,\n onDelete,\n onClick,\n role,\n deleteButtonArialLabel = \"Delete tag\",\n deleteButtonProps = {},\n ...others\n } = props;\n\n const getDeleteIcon = () => {\n const disabledSemanticColor = type === \"semantic\" ? \"atmo5\" : \"base2\";\n const { tabIndex = 0 } = deleteButtonProps;\n\n return (\n <HvButton\n classes={{\n startIcon: classes.tagButton,\n focusVisible: classes.focusVisible,\n primary: classes.primaryButton,\n }}\n aria-label={deleteButtonArialLabel}\n tabIndex={tabIndex}\n {...deleteButtonProps}\n >\n <CloseXS\n iconSize=\"XS\"\n style={{\n ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n height: 16,\n }}\n color={disabled ? disabledSemanticColor : \"base2\"}\n />\n </HvButton>\n );\n };\n\n const theme = useTheme();\n\n const inlineStyle = {\n ...style,\n };\n\n let categoricalBackgroundColor;\n\n if (type === \"semantic\") {\n inlineStyle.backgroundColor = getColor(theme, color, type);\n } else if (type === \"categorical\") {\n categoricalBackgroundColor = getColor(theme, color, type);\n\n inlineStyle.backgroundColor = fade(categoricalBackgroundColor, 0.3);\n }\n\n const [hover, setHover] = useState(false);\n\n return (\n <Chip\n label={label}\n className={clsx(classes.root, className)}\n onMouseEnter={() => {\n setHover(!!onClick);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n style={{\n ...(disabled ? null : inlineStyle),\n ...(hover && !disabled ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` } : null),\n }}\n classes={{\n root: clsx(classes.chipRoot, {\n [classes.disabled]: disabled,\n [classes.clickable]: !!onClick,\n [classes.categorical]: type === \"categorical\",\n [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n }),\n label: classes.label,\n deleteIcon: clsx(classes.deleteIcon, {\n [classes.disabledDeleteIcon]: disabled,\n }),\n }}\n deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n onDelete={getOnDeleteCallback(disabled, onDelete)}\n onClick={disabled ? undefined : onClick}\n role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n {...others}\n />\n );\n};\n\nHvTag.propTypes = {\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes: PropTypes.shape({\n /**\n * Styles applied to the component.\n */\n root: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n chipRoot: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n label: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n tagButton: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n deleteIcon: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n disabledDeleteIcon: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n titleOverflow: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categorical: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalDisabled: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n disabled: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n semanticTextColor: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalTextColor: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n deletable: PropTypes.string,\n /**\n * Styles applied to the component if has onClick.\n */\n clickable: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n focusVisible: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n primaryButton: PropTypes.string,\n /**\n * Styles applied to the component.\n */\n categoricalFocus: PropTypes.string,\n }).isRequired,\n\n /**\n * Inline styles to be applied to the root element.\n */\n style: PropTypes.instanceOf(Object),\n\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n\n /**\n * The label of the tag element.\n *\n */\n label: PropTypes.node,\n\n /**\n * Indicates that the form element is disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * The type of the tag element.\n *\n * A tag can be of semantic or categoric type\n */\n type: PropTypes.oneOf([\"semantic\", \"categorical\"]),\n\n /**\n * Background color to be applied to the tag\n */\n color: PropTypes.string,\n /**\n * Icon used to customize the delete icon in the Chip element\n */\n deleteIcon: PropTypes.node,\n\n /**\n * The callback fired when the delete icon is pressed.\n * This function has to be provided to the component,\n * in order to render the delete icon\n */\n onDelete: PropTypes.func,\n /**\n * Callback triggered when any item is clicked.\n */\n onClick: PropTypes.func,\n\n /**\n * The role of the element with an attributed event.\n */\n role: PropTypes.string,\n /**\n * Aria properties to apply to delete button in tag\n */\n deleteButtonArialLabel: PropTypes.string,\n /**\n * Props to apply to delete button\n */\n deleteButtonProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvTag\" })(HvTag);\n"],"mappings":"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"}
|
|
@@ -29,13 +29,15 @@ var styles = function styles(theme) {
|
|
|
29
29
|
primaryButton: {
|
|
30
30
|
background: "transparent"
|
|
31
31
|
},
|
|
32
|
-
label: {
|
|
32
|
+
label: _objectSpread(_objectSpread({
|
|
33
33
|
paddingLeft: theme.hv.spacing.xs,
|
|
34
|
-
paddingRight: theme.hv.spacing.xs
|
|
34
|
+
paddingRight: theme.hv.spacing.xs
|
|
35
|
+
}, theme.hv.typography.normalText), {}, {
|
|
36
|
+
color: theme.palette.base2,
|
|
35
37
|
"& p": {
|
|
36
38
|
color: theme.hv.palette.base.base2
|
|
37
39
|
}
|
|
38
|
-
},
|
|
40
|
+
}),
|
|
39
41
|
tagButton: {
|
|
40
42
|
width: 16,
|
|
41
43
|
height: 16,
|