@hitachivantara/uikit-react-core 3.56.1 → 3.58.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +34 -0
- package/dist/FilterGroup/FilterContent/FilterContent.js +2 -1
- package/dist/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/FilterGroup/FilterGroup.d.ts +6 -0
- package/dist/FilterGroup/FilterGroup.js +9 -1
- package/dist/FilterGroup/FilterGroup.js.map +1 -1
- package/dist/FilterGroup/FilterGroupContext.js +11 -5
- package/dist/FilterGroup/FilterGroupContext.js.map +1 -1
- package/dist/OverflowTooltip/OverflowTooltip.d.ts +26 -6
- package/dist/OverflowTooltip/OverflowTooltip.js +46 -9
- package/dist/OverflowTooltip/OverflowTooltip.js.map +1 -1
- package/dist/TagsInput/TagsInput.d.ts +12 -8
- package/dist/TagsInput/TagsInput.js +52 -24
- package/dist/TagsInput/TagsInput.js.map +1 -1
- package/dist/Tooltip/Tooltip.js +1 -1
- package/dist/Tooltip/Tooltip.js.map +1 -1
- package/dist/legacy/FilterGroup/FilterContent/FilterContent.js +2 -1
- package/dist/legacy/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/legacy/FilterGroup/FilterGroup.d.ts +6 -0
- package/dist/legacy/FilterGroup/FilterGroup.js +9 -1
- package/dist/legacy/FilterGroup/FilterGroup.js.map +1 -1
- package/dist/legacy/FilterGroup/FilterGroupContext.js +11 -5
- package/dist/legacy/FilterGroup/FilterGroupContext.js.map +1 -1
- package/dist/legacy/OverflowTooltip/OverflowTooltip.d.ts +26 -6
- package/dist/legacy/OverflowTooltip/OverflowTooltip.js +30 -9
- package/dist/legacy/OverflowTooltip/OverflowTooltip.js.map +1 -1
- package/dist/legacy/TagsInput/TagsInput.d.ts +12 -8
- package/dist/legacy/TagsInput/TagsInput.js +50 -24
- package/dist/legacy/TagsInput/TagsInput.js.map +1 -1
- package/dist/legacy/Tooltip/Tooltip.js +1 -1
- package/dist/legacy/Tooltip/Tooltip.js.map +1 -1
- package/dist/modern/FilterGroup/FilterContent/FilterContent.js +2 -1
- package/dist/modern/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/modern/FilterGroup/FilterGroup.d.ts +6 -0
- package/dist/modern/FilterGroup/FilterGroup.js +9 -1
- package/dist/modern/FilterGroup/FilterGroup.js.map +1 -1
- package/dist/modern/FilterGroup/FilterGroupContext.js +10 -4
- package/dist/modern/FilterGroup/FilterGroupContext.js.map +1 -1
- package/dist/modern/OverflowTooltip/OverflowTooltip.d.ts +26 -6
- package/dist/modern/OverflowTooltip/OverflowTooltip.js +25 -9
- package/dist/modern/OverflowTooltip/OverflowTooltip.js.map +1 -1
- package/dist/modern/TagsInput/TagsInput.d.ts +12 -8
- package/dist/modern/TagsInput/TagsInput.js +47 -25
- package/dist/modern/TagsInput/TagsInput.js.map +1 -1
- package/dist/modern/Tooltip/Tooltip.js +1 -1
- package/dist/modern/Tooltip/Tooltip.js.map +1 -1
- package/package.json +2 -2
|
@@ -24,7 +24,8 @@ var groups = function groups(filters) {
|
|
|
24
24
|
};
|
|
25
25
|
|
|
26
26
|
export var FilterGroupProvider = function FilterGroupProvider(_ref) {
|
|
27
|
-
var
|
|
27
|
+
var defaultValue = _ref.defaultValue,
|
|
28
|
+
value = _ref.value,
|
|
28
29
|
filters = _ref.filters,
|
|
29
30
|
children = _ref.children;
|
|
30
31
|
|
|
@@ -45,12 +46,15 @@ export var FilterGroupProvider = function FilterGroupProvider(_ref) {
|
|
|
45
46
|
applyDisabled = _useState4[0],
|
|
46
47
|
setApplyDisabled = _useState4[1];
|
|
47
48
|
|
|
49
|
+
useEffect(function () {
|
|
50
|
+
setFilterValues(value, true);
|
|
51
|
+
}, [value, setFilterValues]);
|
|
48
52
|
useEffect(function () {
|
|
49
53
|
setApplyDisabled(isEqual(filterValues, appliedFilters));
|
|
50
54
|
}, [filterValues, appliedFilters]);
|
|
51
55
|
var clearFilters = useCallback(function () {
|
|
52
|
-
setFilterValues(groups(filters));
|
|
53
|
-
}, [filters, setFilterValues]);
|
|
56
|
+
setFilterValues(defaultValue || groups(filters));
|
|
57
|
+
}, [filters, setFilterValues, defaultValue]);
|
|
54
58
|
var applyFilters = useCallback(function () {
|
|
55
59
|
setFilterValues(filterValues, true);
|
|
56
60
|
}, [filterValues, setFilterValues]);
|
|
@@ -65,14 +69,16 @@ export var FilterGroupProvider = function FilterGroupProvider(_ref) {
|
|
|
65
69
|
rollbackFilters: rollbackFilters,
|
|
66
70
|
clearFilters: clearFilters,
|
|
67
71
|
applyFilters: applyFilters,
|
|
68
|
-
applyDisabled: applyDisabled
|
|
72
|
+
applyDisabled: applyDisabled,
|
|
73
|
+
defaultValue: defaultValue
|
|
69
74
|
};
|
|
70
|
-
}, [appliedFilters, applyDisabled, applyFilters, clearFilters, filterValues, filters, group, rollbackFilters, setFilterValues]);
|
|
75
|
+
}, [appliedFilters, applyDisabled, applyFilters, clearFilters, filterValues, filters, group, rollbackFilters, setFilterValues, defaultValue]);
|
|
71
76
|
return /*#__PURE__*/React.createElement(FilterGroupContext.Provider, {
|
|
72
77
|
value: contextValue
|
|
73
78
|
}, children);
|
|
74
79
|
};
|
|
75
80
|
process.env.NODE_ENV !== "production" ? FilterGroupProvider.propTypes = {
|
|
81
|
+
defaultValue: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))),
|
|
76
82
|
value: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))),
|
|
77
83
|
filters: PropTypes.arrayOf(PropTypes.shape({
|
|
78
84
|
id: PropTypes.string.isRequired,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/FilterGroup/FilterGroupContext.js"],"names":["React","useState","useEffect","useMemo","useCallback","PropTypes","isEqual","useSavedState","FilterGroupContext","createContext","activeGroup","setActiveGroup","filterOptions","setFilterOptions","filterValues","setFilterValues","rollbackFilters","clearFilters","applyFilters","applyDisabled","groups","filters","map","FilterGroupProvider","value","children","group","appliedFilters","setApplyDisabled","contextValue","propTypes","arrayOf","oneOfType","string","number","shape","id","isRequired","name","data","node"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,EAA0BC,SAA1B,EAAqCC,OAArC,EAA8CC,WAA9C,QAAiE,OAAjE;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,SAASC,aAAT,QAA8B,UAA9B;AAEA,OAAO,IAAMC,kBAAkB,gBAAGR,KAAK,CAACS,aAAN,CAAoB;AACpDC,EAAAA,WAAW,EAAE,CADuC;AAEpDC,EAAAA,cAAc,EAAE,0BAAM,CAAE,CAF4B;AAGpDC,EAAAA,aAAa,EAAE,EAHqC;AAIpDC,EAAAA,gBAAgB,EAAE,4BAAM,CAAE,CAJ0B;AAKpDC,EAAAA,YAAY,EAAE,EALsC;AAMpDC,EAAAA,eAAe,EAAE,2BAAM,CAAE,CAN2B;AAOpDC,EAAAA,eAAe,EAAE,2BAAM,CAAE,CAP2B;AAQpDC,EAAAA,YAAY,EAAE,wBAAM,CAAE,CAR8B;AASpDC,EAAAA,YAAY,EAAE,wBAAM,CAAE,CAT8B;AAUpDC,EAAAA,aAAa,EAAE;AAVqC,CAApB,CAA3B;;AAaP,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACC,OAAD;AAAA,SAAaA,OAAO,CAACC,GAAR,CAAY;AAAA,WAAM,EAAN;AAAA,GAAZ,CAAb;AAAA,CAAf;;AAEA,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,
|
|
1
|
+
{"version":3,"sources":["../../../src/FilterGroup/FilterGroupContext.js"],"names":["React","useState","useEffect","useMemo","useCallback","PropTypes","isEqual","useSavedState","FilterGroupContext","createContext","activeGroup","setActiveGroup","filterOptions","setFilterOptions","filterValues","setFilterValues","rollbackFilters","clearFilters","applyFilters","applyDisabled","groups","filters","map","FilterGroupProvider","defaultValue","value","children","group","appliedFilters","setApplyDisabled","contextValue","propTypes","arrayOf","oneOfType","string","number","shape","id","isRequired","name","data","node"],"mappings":"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","sourcesContent":["import React, { useState, useEffect, useMemo, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport isEqual from \"lodash/isEqual\";\nimport { useSavedState } from \"../utils\";\n\nexport const FilterGroupContext = React.createContext({\n activeGroup: 0,\n setActiveGroup: () => {},\n filterOptions: [],\n setFilterOptions: () => {},\n filterValues: [],\n setFilterValues: () => {},\n rollbackFilters: () => {},\n clearFilters: () => {},\n applyFilters: () => {},\n applyDisabled: false,\n});\n\nconst groups = (filters) => filters.map(() => []);\n\nexport const FilterGroupProvider = ({ defaultValue, value, filters, children }) => {\n const [group, setActiveGroup] = useState(0);\n const [filterValues, setFilterValues, rollbackFilters, appliedFilters] = useSavedState(\n value || groups(filters)\n );\n const [applyDisabled, setApplyDisabled] = useState(false);\n\n useEffect(() => {\n setFilterValues(value, true);\n }, [value, setFilterValues]);\n\n useEffect(() => {\n setApplyDisabled(isEqual(filterValues, appliedFilters));\n }, [filterValues, appliedFilters]);\n\n const clearFilters = useCallback(() => {\n setFilterValues(defaultValue || groups(filters));\n }, [filters, setFilterValues, defaultValue]);\n\n const applyFilters = useCallback(() => {\n setFilterValues(filterValues, true);\n }, [filterValues, setFilterValues]);\n\n const contextValue = useMemo(\n () => ({\n activeGroup: group,\n setActiveGroup,\n filterOptions: filters,\n filterValues,\n setFilterValues,\n appliedFilters,\n rollbackFilters,\n clearFilters,\n applyFilters,\n applyDisabled,\n defaultValue,\n }),\n [\n appliedFilters,\n applyDisabled,\n applyFilters,\n clearFilters,\n filterValues,\n filters,\n group,\n rollbackFilters,\n setFilterValues,\n defaultValue,\n ]\n );\n\n return <FilterGroupContext.Provider value={contextValue}>{children}</FilterGroupContext.Provider>;\n};\n\nFilterGroupProvider.propTypes = {\n defaultValue: PropTypes.arrayOf(\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n ),\n value: PropTypes.arrayOf(\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n ),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string.isRequired,\n name: PropTypes.string.isRequired,\n data: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n name: PropTypes.string.isRequired,\n })\n ).isRequired,\n })\n ),\n children: PropTypes.node.isRequired,\n};\n"],"file":"FilterGroupContext.js"}
|
|
@@ -4,9 +4,9 @@ export type HvOverflowTooltipKey = "tooltipData" | "tooltipAnchor" | "tooltipAnc
|
|
|
4
4
|
|
|
5
5
|
export interface HvOverflowTooltipProps
|
|
6
6
|
extends StandardProps<React.HTMLAttributes<HTMLElement>, HvOverflowTooltipKey> {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
/**
|
|
8
|
+
* Id to be applied to the tooltip.
|
|
9
|
+
*/
|
|
10
10
|
id?: string;
|
|
11
11
|
/**
|
|
12
12
|
* The node that will be rendered inside the tooltip.
|
|
@@ -20,9 +20,29 @@ export interface HvOverflowTooltipProps
|
|
|
20
20
|
* If `true` the overflow tooltip will always use the paragraph overflow style.
|
|
21
21
|
*/
|
|
22
22
|
paragraphOverflow?: boolean;
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
/**
|
|
24
|
+
* If true, the tooltip is shown.
|
|
25
|
+
*/
|
|
26
|
+
open?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Tooltip placement.
|
|
29
|
+
*/
|
|
30
|
+
placement?:
|
|
31
|
+
| 'bottom-end'
|
|
32
|
+
| 'bottom-start'
|
|
33
|
+
| 'bottom'
|
|
34
|
+
| 'left-end'
|
|
35
|
+
| 'left-start'
|
|
36
|
+
| 'left'
|
|
37
|
+
| 'right-end'
|
|
38
|
+
| 'right-start'
|
|
39
|
+
| 'right'
|
|
40
|
+
| 'top-end'
|
|
41
|
+
| 'top-start'
|
|
42
|
+
| 'top';
|
|
43
|
+
/**
|
|
44
|
+
* Extra properties to add to the tooltip.
|
|
45
|
+
*/
|
|
26
46
|
tooltipsProps?: TooltipProps;
|
|
27
47
|
}
|
|
28
48
|
|
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import "core-js/modules/es.regexp.exec.js";
|
|
3
3
|
import "core-js/modules/es.object.to-string.js";
|
|
4
4
|
import "core-js/modules/es.regexp.to-string.js";
|
|
5
|
-
import React from "react";
|
|
5
|
+
import React, { useMemo } from "react";
|
|
6
6
|
import clsx from "clsx";
|
|
7
7
|
import PropTypes from "prop-types";
|
|
8
8
|
import { useResizeDetector } from "react-resize-detector";
|
|
@@ -38,7 +38,10 @@ var HvOverflowTooltip = function HvOverflowTooltip(_ref) {
|
|
|
38
38
|
className = _ref.className,
|
|
39
39
|
classes = _ref.classes,
|
|
40
40
|
data = _ref.data,
|
|
41
|
+
open = _ref.open,
|
|
41
42
|
paragraphOverflow = _ref.paragraphOverflow,
|
|
43
|
+
_ref$placement = _ref.placement,
|
|
44
|
+
placement = _ref$placement === void 0 ? "top-start" : _ref$placement,
|
|
42
45
|
tooltipsProps = _ref.tooltipsProps;
|
|
43
46
|
|
|
44
47
|
var _useResizeDetector = useResizeDetector({
|
|
@@ -52,20 +55,28 @@ var HvOverflowTooltip = function HvOverflowTooltip(_ref) {
|
|
|
52
55
|
width = _useResizeDetector$wi === void 0 ? 0 : _useResizeDetector$wi,
|
|
53
56
|
ref = _useResizeDetector.ref;
|
|
54
57
|
|
|
55
|
-
var
|
|
56
|
-
|
|
57
|
-
|
|
58
|
+
var scrollWidth = ((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollWidth) || 0; // The difference should be higher than a pixel to be considered as overflowing
|
|
59
|
+
|
|
60
|
+
var isOverflowing = scrollWidth - width >= 1;
|
|
61
|
+
var isParag = useMemo(function () {
|
|
62
|
+
return paragraphOverflow && isParagraph(data.toString());
|
|
63
|
+
}, [data, paragraphOverflow]);
|
|
64
|
+
var content = useMemo(function () {
|
|
65
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
66
|
+
ref: ref,
|
|
67
|
+
className: clsx(className, isParag ? classes.tooltipAnchorParagraph : classes.tooltipAnchor)
|
|
68
|
+
}, data);
|
|
69
|
+
}, [className, classes.tooltipAnchor, classes.tooltipAnchorParagraph, data, isParag, ref]);
|
|
70
|
+
return open || isOverflowing ? /*#__PURE__*/React.createElement(HvTooltip, _extends({
|
|
58
71
|
id: id,
|
|
59
72
|
disableHoverListener: !isOverflowing,
|
|
60
|
-
|
|
73
|
+
open: open,
|
|
74
|
+
placement: placement,
|
|
61
75
|
title: /*#__PURE__*/React.createElement(HvTypography, {
|
|
62
76
|
className: classes.tooltipData,
|
|
63
77
|
variant: "normalText"
|
|
64
78
|
}, data)
|
|
65
|
-
}, tooltipsProps),
|
|
66
|
-
ref: ref,
|
|
67
|
-
className: clsx(className, isParag ? classes.tooltipAnchorParagraph : classes.tooltipAnchor)
|
|
68
|
-
}, data));
|
|
79
|
+
}, tooltipsProps), content) : content;
|
|
69
80
|
};
|
|
70
81
|
|
|
71
82
|
process.env.NODE_ENV !== "production" ? HvOverflowTooltip.propTypes = {
|
|
@@ -114,6 +125,16 @@ process.env.NODE_ENV !== "production" ? HvOverflowTooltip.propTypes = {
|
|
|
114
125
|
*/
|
|
115
126
|
paragraphOverflow: PropTypes.bool,
|
|
116
127
|
|
|
128
|
+
/**
|
|
129
|
+
* Tooltip placement.
|
|
130
|
+
*/
|
|
131
|
+
placement: PropTypes.oneOf(["bottom-end", "bottom-start", "bottom", "left-end", "left-start", "left", "right-end", "right-start", "right", "top-end", "top-start", "top"]),
|
|
132
|
+
|
|
133
|
+
/**
|
|
134
|
+
* If true, the tooltip is shown.
|
|
135
|
+
*/
|
|
136
|
+
open: PropTypes.bool,
|
|
137
|
+
|
|
117
138
|
/**
|
|
118
139
|
* Extra properties to add to the tooltip.
|
|
119
140
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/OverflowTooltip/OverflowTooltip.js"],"names":["React","clsx","PropTypes","useResizeDetector","createStyles","withStyles","HvTooltip","HvTypography","styles","tooltipData","tooltipAnchor","whiteSpace","overflow","textOverflow","tooltipAnchorParagraph","display","isParagraph","children","test","HvOverflowTooltip","id","className","classes","data","paragraphOverflow","tooltipsProps","refreshMode","refreshOptions","trailing","handleHeight","width","ref","
|
|
1
|
+
{"version":3,"sources":["../../../src/OverflowTooltip/OverflowTooltip.js"],"names":["React","useMemo","clsx","PropTypes","useResizeDetector","createStyles","withStyles","HvTooltip","HvTypography","styles","tooltipData","tooltipAnchor","whiteSpace","overflow","textOverflow","tooltipAnchorParagraph","display","isParagraph","children","test","HvOverflowTooltip","id","className","classes","data","open","paragraphOverflow","placement","tooltipsProps","refreshMode","refreshOptions","trailing","handleHeight","width","ref","scrollWidth","current","isOverflowing","isParag","toString","content","propTypes","string","node","shape","root","isRequired","bool","oneOf","instanceOf","Object","name","memo","RawOverflowTooltip"],"mappings":"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","sourcesContent":["import React, { useMemo } from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { createStyles, withStyles } from \"@material-ui/core\";\n\nimport { HvTooltip, HvTypography } from \"..\";\n\nconst styles = createStyles({\n tooltipData: {},\n tooltipAnchor: {\n whiteSpace: \"nowrap\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n tooltipAnchorParagraph: {\n overflow: \"hidden\",\n display: \"-webkit-box\",\n \"-webkit-line-clamp\": 2,\n \"-webkit-box-orient\": \"vertical\",\n },\n});\n\nconst isParagraph = (children) => /\\s/.test(children);\n\n/**\n * This component generates a tooltip whenever the text is overflowed.\n */\nconst HvOverflowTooltip = ({\n id,\n className,\n classes,\n data,\n open,\n paragraphOverflow,\n placement = \"top-start\",\n tooltipsProps,\n}) => {\n const { width = 0, ref } = useResizeDetector({\n refreshMode: \"debounce\",\n refreshOptions: {\n trailing: true,\n },\n handleHeight: false,\n });\n const scrollWidth = ref.current?.scrollWidth || 0;\n // The difference should be higher than a pixel to be considered as overflowing\n const isOverflowing = scrollWidth - width >= 1;\n\n const isParag = useMemo(\n () => paragraphOverflow && isParagraph(data.toString()),\n [data, paragraphOverflow]\n );\n\n const content = useMemo(\n () => (\n <div\n ref={ref}\n className={clsx(className, {\n [classes.tooltipAnchor]: !isParag,\n [classes.tooltipAnchorParagraph]: isParag,\n })}\n >\n {data}\n </div>\n ),\n [className, classes.tooltipAnchor, classes.tooltipAnchorParagraph, data, isParag, ref]\n );\n\n return open || isOverflowing ? (\n <HvTooltip\n id={id}\n disableHoverListener={!isOverflowing}\n open={open}\n placement={placement}\n title={\n <HvTypography className={classes.tooltipData} variant=\"normalText\">\n {data}\n </HvTypography>\n }\n {...tooltipsProps}\n >\n {content}\n </HvTooltip>\n ) : (\n content\n );\n};\n\nHvOverflowTooltip.propTypes = {\n /**\n * Id to be applied to the tooltip.\n */\n id: PropTypes.string,\n /**\n * The node that will be rendered inside the tooltip.\n */\n data: PropTypes.node,\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * A Jss Object used to override or extend the styles applied.\n */\n classes: PropTypes.shape({\n /**\n * Styles applied to the root of the component.\n */\n root: PropTypes.string,\n /**\n * Styles applied to the data container in the tooltip.\n */\n tooltipData: PropTypes.string,\n /**\n * Styles applied to the anchor of the tooltip.\n */\n tooltipAnchor: PropTypes.string,\n /**\n * Styles applied to the anchor of the when it is a paragraph.\n */\n tooltipAnchorParagraph: PropTypes.string,\n }).isRequired,\n /**\n * If `true` the overflow tooltip will always use the paragraph overflow style.\n */\n paragraphOverflow: PropTypes.bool,\n /**\n * Tooltip placement.\n */\n placement: PropTypes.oneOf([\n \"bottom-end\",\n \"bottom-start\",\n \"bottom\",\n \"left-end\",\n \"left-start\",\n \"left\",\n \"right-end\",\n \"right-start\",\n \"right\",\n \"top-end\",\n \"top-start\",\n \"top\",\n ]),\n /**\n * If true, the tooltip is shown.\n */\n open: PropTypes.bool,\n /**\n * Extra properties to add to the tooltip.\n */\n tooltipsProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, {\n name: \"HvOverflowTooltip\",\n})(React.memo(HvOverflowTooltip));\n\nexport { HvOverflowTooltip as RawOverflowTooltip };\n"],"file":"OverflowTooltip.js"}
|
|
@@ -143,18 +143,12 @@ export interface HvTagsInputProps
|
|
|
143
143
|
/**
|
|
144
144
|
* The function that will be executed when the input is blurred.
|
|
145
145
|
*/
|
|
146
|
-
|
|
147
|
-
event: React.FocusEvent<HTMLInputElement>,
|
|
148
|
-
value: string
|
|
149
|
-
) => void;
|
|
146
|
+
onBlur?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;
|
|
150
147
|
|
|
151
148
|
/**
|
|
152
149
|
* The function that will be executed when the input is focused.
|
|
153
150
|
*/
|
|
154
|
-
|
|
155
|
-
event: React.FocusEvent<HTMLInputElement>,
|
|
156
|
-
value: string
|
|
157
|
-
) => void;
|
|
151
|
+
onFocus?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;
|
|
158
152
|
|
|
159
153
|
/**
|
|
160
154
|
* The status of the form element.
|
|
@@ -169,6 +163,16 @@ export interface HvTagsInputProps
|
|
|
169
163
|
* An Object containing the various texts associated with the input.
|
|
170
164
|
*/
|
|
171
165
|
validationMessages?: HvBaseInputValidationMessagesProps;
|
|
166
|
+
|
|
167
|
+
/**
|
|
168
|
+
* An array of strings that represent the character used to input a tag.
|
|
169
|
+
* This character is the string representation of the event.code from the input event.
|
|
170
|
+
*/
|
|
171
|
+
commitTagOn?: string[];
|
|
172
|
+
/**
|
|
173
|
+
* If `true` the tag will be commited when the blur event occurs.
|
|
174
|
+
*/
|
|
175
|
+
comminOnBlur?: boolean;
|
|
172
176
|
}
|
|
173
177
|
|
|
174
178
|
export default function HvTagsInput(props: HvTagsInputProps): JSX.Element | null;
|
|
@@ -9,7 +9,7 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
10
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
11
11
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
12
|
-
var _excluded = ["classes", "className", "id", "name", "value", "defaultValue", "readOnly", "disabled", "required", "label", "aria-label", "aria-labelledby", "description", "aria-describedby", "onChange", "onAdd", "onDelete", "onBlur", "onFocus", "placeholder", "hideCounter", "middleCountLabel", "maxTagsQuantity", "autoFocus", "resizable", "inputProps", "countCharProps", "multiline", "status", "statusMessage", "validationMessages"],
|
|
12
|
+
var _excluded = ["classes", "className", "id", "name", "value", "defaultValue", "readOnly", "disabled", "required", "label", "aria-label", "aria-labelledby", "description", "aria-describedby", "onChange", "onAdd", "onDelete", "onBlur", "onFocus", "placeholder", "hideCounter", "middleCountLabel", "maxTagsQuantity", "autoFocus", "resizable", "inputProps", "countCharProps", "multiline", "status", "statusMessage", "validationMessages", "commitTagOn", "commitOnBlur"],
|
|
13
13
|
_excluded2 = ["label", "type"];
|
|
14
14
|
|
|
15
15
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -21,6 +21,8 @@ import "core-js/modules/es.symbol.js";
|
|
|
21
21
|
import "core-js/modules/es.symbol.description.js";
|
|
22
22
|
import "core-js/modules/es.array.concat.js";
|
|
23
23
|
import "core-js/modules/es.array.slice.js";
|
|
24
|
+
import "core-js/modules/es.array.includes.js";
|
|
25
|
+
import "core-js/modules/es.string.includes.js";
|
|
24
26
|
import "core-js/modules/es.array.map.js";
|
|
25
27
|
import React, { useRef, useState, useCallback, useMemo, useEffect } from "react";
|
|
26
28
|
import PropTypes from "prop-types";
|
|
@@ -79,6 +81,10 @@ var HvTagsInput = function HvTagsInput(props) {
|
|
|
79
81
|
status = props.status,
|
|
80
82
|
statusMessage = props.statusMessage,
|
|
81
83
|
validationMessages = props.validationMessages,
|
|
84
|
+
_props$commitTagOn = props.commitTagOn,
|
|
85
|
+
commitTagOn = _props$commitTagOn === void 0 ? ["Enter"] : _props$commitTagOn,
|
|
86
|
+
_props$commitOnBlur = props.commitOnBlur,
|
|
87
|
+
commitOnBlur = _props$commitOnBlur === void 0 ? false : _props$commitOnBlur,
|
|
82
88
|
others = _objectWithoutProperties(props, _excluded);
|
|
83
89
|
|
|
84
90
|
var elementId = useUniqueId(id, "hvTagsInput");
|
|
@@ -161,14 +167,22 @@ var HvTagsInput = function HvTagsInput(props) {
|
|
|
161
167
|
onChange === null || onChange === void 0 ? void 0 : onChange(event, newTagsArr);
|
|
162
168
|
skipReset.current = true;
|
|
163
169
|
}, [onChange, onDelete, performValidation, setValue, tagCursorPos, value]);
|
|
164
|
-
var
|
|
165
|
-
|
|
166
|
-
* Handler for the `onChange` event on the tag input
|
|
167
|
-
*/
|
|
170
|
+
var addTag = useCallback(function (event, tag) {
|
|
171
|
+
event.preventDefault();
|
|
168
172
|
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
173
|
+
if (tag !== "") {
|
|
174
|
+
var newTag = {
|
|
175
|
+
label: tag,
|
|
176
|
+
type: "semantic"
|
|
177
|
+
};
|
|
178
|
+
var newTagsArr = [].concat(_toConsumableArray(value), [newTag]);
|
|
179
|
+
setValue(newTagsArr);
|
|
180
|
+
performValidation(newTagsArr);
|
|
181
|
+
onAdd === null || onAdd === void 0 ? void 0 : onAdd(event, newTag, newTagsArr.length - 1);
|
|
182
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(event, newTagsArr);
|
|
183
|
+
}
|
|
184
|
+
}, [onAdd, onChange, performValidation, setValue, value]);
|
|
185
|
+
var canShowError = status !== undefined && status === "invalid" && statusMessage !== undefined || !stateValid;
|
|
172
186
|
useEffect(function () {
|
|
173
187
|
if (!multiline) {
|
|
174
188
|
var _containerRef$current;
|
|
@@ -193,24 +207,21 @@ var HvTagsInput = function HvTagsInput(props) {
|
|
|
193
207
|
skipReset.current = false;
|
|
194
208
|
}, [value]);
|
|
195
209
|
/**
|
|
196
|
-
* Handler for the `
|
|
210
|
+
* Handler for the `onChange` event on the tag input
|
|
197
211
|
*/
|
|
198
212
|
|
|
199
|
-
var
|
|
200
|
-
|
|
213
|
+
var onChangeHandler = useCallback(function (event, input) {
|
|
214
|
+
setTagInput(input);
|
|
215
|
+
}, []);
|
|
216
|
+
/**
|
|
217
|
+
* Handler for the `onKeyDown` event on the form element
|
|
218
|
+
*/
|
|
201
219
|
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
type: "semantic"
|
|
206
|
-
};
|
|
207
|
-
var newTagsArr = [].concat(_toConsumableArray(value), [newTag]);
|
|
208
|
-
setValue(newTagsArr);
|
|
209
|
-
performValidation(newTagsArr);
|
|
210
|
-
onAdd === null || onAdd === void 0 ? void 0 : onAdd(event, newTag, newTagsArr.length - 1);
|
|
211
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(event, newTagsArr);
|
|
220
|
+
var onInputKeyDownHandler = useCallback(function (event) {
|
|
221
|
+
if (commitTagOn.includes(event.code)) {
|
|
222
|
+
addTag(event, tagInput);
|
|
212
223
|
}
|
|
213
|
-
}, [
|
|
224
|
+
}, [addTag, commitTagOn, tagInput]);
|
|
214
225
|
/**
|
|
215
226
|
* Handler for the `onKeyDown` event on the list container.
|
|
216
227
|
*/
|
|
@@ -269,6 +280,10 @@ var HvTagsInput = function HvTagsInput(props) {
|
|
|
269
280
|
|
|
270
281
|
var onBlurHandler = function onBlurHandler(evt) {
|
|
271
282
|
blurTimeout.current = setTimeout(function () {
|
|
283
|
+
if (commitOnBlur) {
|
|
284
|
+
addTag(evt, tagInput);
|
|
285
|
+
}
|
|
286
|
+
|
|
272
287
|
onBlur === null || onBlur === void 0 ? void 0 : onBlur(evt, tagInput);
|
|
273
288
|
}, 250);
|
|
274
289
|
};
|
|
@@ -356,7 +371,7 @@ var HvTagsInput = function HvTagsInput(props) {
|
|
|
356
371
|
value: tagInput,
|
|
357
372
|
disableClear: true,
|
|
358
373
|
onChange: onChangeHandler,
|
|
359
|
-
|
|
374
|
+
onKeyDown: onInputKeyDownHandler,
|
|
360
375
|
placeholder: value.length === 0 ? placeholder : "",
|
|
361
376
|
autoFocus: autoFocus,
|
|
362
377
|
className: clsx(!multiline && classes.singleLine),
|
|
@@ -659,7 +674,18 @@ process.env.NODE_ENV !== "production" ? HvTagsInput.propTypes = {
|
|
|
659
674
|
* The message that appears when the input is empty and required.
|
|
660
675
|
*/
|
|
661
676
|
requiredError: PropTypes.string
|
|
662
|
-
})
|
|
677
|
+
}),
|
|
678
|
+
|
|
679
|
+
/**
|
|
680
|
+
* An array of strings that represent the character used to input a tag.
|
|
681
|
+
* This character is the string representation of the event.code from the input event.
|
|
682
|
+
*/
|
|
683
|
+
commitTagOn: PropTypes.arrayOf(PropTypes.string),
|
|
684
|
+
|
|
685
|
+
/**
|
|
686
|
+
* If `true` the tag will be commited when the blur event occurs.
|
|
687
|
+
*/
|
|
688
|
+
commitOnBlur: PropTypes.bool
|
|
663
689
|
} : void 0;
|
|
664
690
|
export default withStyles(styles, {
|
|
665
691
|
name: "HvTagsInput"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/TagsInput/TagsInput.js"],"names":["React","useRef","useState","useCallback","useMemo","useEffect","PropTypes","clsx","isNil","withStyles","setId","useControlled","HvFormElement","HvListContainer","HvListItem","HvTag","HvInput","HvLabel","HvInfoMessage","HvCharCounter","HvWarningText","useUniqueId","validationStates","DEFAULT_ERROR_MESSAGES","styles","HvTagsInput","props","classes","className","id","name","valueProp","value","defaultValue","readOnly","disabled","required","textAreaLabel","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","others","elementId","hasLabel","hasDescription","setValue","standBy","validationState","setValidationState","validationMessage","setValidationMessage","tagInput","setTagInput","length","tagCursorPos","setTagCursorPos","stateValid","setStateValid","inputRef","containerRef","skipReset","blurTimeout","isTagSelected","hasCounter","isStateInvalid","errorMessages","error","requiredError","minCharError","maxCharError","performValidation","currValue","invalid","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","canShowError","undefined","onChangeHandler","input","element","children","setTimeout","container","scrollLeft","offsetLeft","getBoundingClientRect","width","onEnterHandler","tag","preventDefault","newTag","type","onKeyDownHandler","code","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","root","labelContainer","characterCounter","tagsList","singleLine","map","t","otherProps","gutters","listItemGutters","listItemRoot","tagSelected","chipRoot","tabIndex","tagInputContainerRoot","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","propTypes","string","shape","isRequired","array","node","bool","func","number","instanceOf","Object"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useCallback, useMemo, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { withStyles } from \"@material-ui/core\";\nimport { setId, useControlled } from \"../utils\";\nimport {\n HvFormElement,\n HvListContainer,\n HvListItem,\n HvTag,\n HvInput,\n HvLabel,\n HvInfoMessage,\n HvCharCounter,\n HvWarningText,\n useUniqueId,\n} from \"..\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"../BaseInput/validations\";\nimport styles from \"./styles\";\n\n/**\n * A tags input is a single or multiline control that allows the input of tags.\n */\nconst HvTagsInput = (props) => {\n const {\n classes,\n className,\n\n id,\n name,\n\n value: valueProp,\n defaultValue = [],\n\n readOnly = false,\n disabled = false,\n required = false,\n\n label: textAreaLabel,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n onChange,\n onAdd,\n onDelete,\n onBlur,\n onFocus,\n\n placeholder,\n\n hideCounter = false,\n middleCountLabel = \"/\",\n maxTagsQuantity,\n\n autoFocus = false,\n resizable = true,\n\n inputProps = {},\n countCharProps = {},\n\n multiline = false,\n\n status,\n statusMessage,\n\n validationMessages,\n\n ...others\n } = props;\n const elementId = useUniqueId(id, \"hvTagsInput\");\n\n const hasLabel = textAreaLabel != null;\n const hasDescription = description != null;\n\n const [value, setValue] = useControlled(valueProp, defaultValue);\n const [validationState, setValidationState] = useControlled(status, validationStates.standBy);\n const [validationMessage, setValidationMessage] = useControlled(statusMessage, \"\");\n\n const [tagInput, setTagInput] = useState(\"\");\n const [tagCursorPos, setTagCursorPos] = useState(value.length);\n const [stateValid, setStateValid] = useState(true);\n\n const inputRef = useRef();\n const containerRef = useRef();\n const skipReset = useRef(false);\n const blurTimeout = useRef();\n\n const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n const isStateInvalid = useMemo(() => {\n return hasCounter && value.length > maxTagsQuantity;\n }, [hasCounter, maxTagsQuantity, value.length]);\n\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n validationMessages?.error,\n validationMessages?.requiredError,\n validationMessages?.minCharError,\n validationMessages?.maxCharError,\n ]\n );\n\n const performValidation = useCallback(\n (currValue) => {\n if (maxTagsQuantity !== null && currValue.length > maxTagsQuantity) {\n setValidationState(validationStates.invalid);\n setValidationMessage(errorMessages.maxCharError);\n setStateValid(false);\n } else {\n setValidationState(validationStates.valid);\n setValidationMessage(\"\");\n setStateValid(true);\n }\n },\n [errorMessages.maxCharError, maxTagsQuantity, setValidationMessage, setValidationState]\n );\n\n /**\n * Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n * Also executes the user provided onDelete and onChange events.\n *\n * @param {number} tagPos - the position at which to remove the tag\n * @param {Event} event - the event associated with the delete\n * @param {boolean} end - whether or not to set the cursor at the end of the array\n */\n const deleteTag = useCallback(\n (tagPos, event, end) => {\n const newTagsArr = [...value.slice(0, tagPos), ...value.slice(tagPos + 1)];\n setValue(newTagsArr);\n // eslint-disable-next-line no-nested-ternary\n setTagCursorPos(end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n inputRef.current?.focus();\n performValidation(newTagsArr);\n onDelete?.(event, value[tagPos], tagPos);\n onChange?.(event, newTagsArr);\n skipReset.current = true;\n },\n [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n );\n\n const canShowError =\n (status !== undefined && status === \"invalid\" && statusMessage !== undefined) || !stateValid;\n\n /**\n * Handler for the `onChange` event on the tag input\n */\n const onChangeHandler = useCallback((event, input) => {\n setTagInput(input);\n }, []);\n\n useEffect(() => {\n if (!multiline) {\n const element = containerRef?.current?.children[tagCursorPos];\n // this setTimeout is a workaround for Firefox not properly dealing\n // with setting the scrollLeft value.\n setTimeout(() => {\n const container = containerRef.current;\n if (isNil(container)) return;\n container.scrollLeft = element\n ? element.offsetLeft -\n container.getBoundingClientRect().width / 2 +\n element.getBoundingClientRect().width / 2\n : 0;\n }, 50);\n\n element?.focus();\n }\n }, [multiline, tagCursorPos]);\n\n useEffect(() => {\n if (!skipReset.current) {\n setTagInput(\"\");\n setTagCursorPos(value.length);\n }\n skipReset.current = false;\n }, [value]);\n\n /**\n * Handler for the `onEnter` event on the tag input\n */\n const onEnterHandler = useCallback(\n (event, tag) => {\n event.preventDefault();\n if (tag !== \"\") {\n const newTag = { label: tag, type: \"semantic\" };\n const newTagsArr = [...value, newTag];\n setValue(newTagsArr);\n performValidation(newTagsArr);\n onAdd?.(event, newTag, newTagsArr.length - 1);\n onChange?.(event, newTagsArr);\n }\n },\n [onAdd, onChange, performValidation, setValue, value]\n );\n\n /**\n * Handler for the `onKeyDown` event on the list container.\n */\n const onKeyDownHandler = useCallback(\n (event) => {\n if (tagInput === \"\") {\n switch (event.code) {\n case \"ArrowLeft\":\n setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n break;\n case \"ArrowRight\":\n setTagCursorPos(tagCursorPos < value.length ? tagCursorPos + 1 : value.length);\n break;\n case \"Backspace\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n } else {\n setTagCursorPos(value.length - 1);\n }\n break;\n case \"Delete\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n }\n break;\n default:\n break;\n }\n }\n },\n [deleteTag, isTagSelected, tagCursorPos, tagInput, value.length]\n );\n\n /**\n * Handler for the `onDelete` event on the tag component\n */\n const onDeleteTagHandler = useCallback(\n (event, i) => {\n deleteTag(i, event, true);\n setValidationState(validationStates.standBy);\n },\n [deleteTag, setValidationState]\n );\n\n /**\n * Handler for the `onClick` event on the list container\n */\n const onContainerClickHandler = useCallback(() => {\n inputRef.current?.focus();\n clearTimeout(blurTimeout.current);\n setTagCursorPos(value.length);\n }, [value.length]);\n\n const onBlurHandler = (evt) => {\n blurTimeout.current = setTimeout(() => {\n onBlur?.(evt, tagInput);\n }, 250);\n };\n\n const onFocusHandler = (evt) => {\n clearTimeout(blurTimeout.current);\n onFocus?.(evt, tagInput);\n };\n\n return (\n <HvFormElement\n id={id}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n required={required}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n className={clsx(classes.root, className, {\n [classes.disabled]: disabled,\n })}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n className={classes.label}\n id={setId(id, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={textAreaLabel}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage className={classes.description} id={setId(elementId, \"description\")}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n\n {hasCounter && (\n <HvCharCounter\n id={setId(elementId, \"charCounter\")}\n className={classes.characterCounter}\n separator={middleCountLabel}\n currentCharQuantity={value.length}\n maxCharQuantity={maxTagsQuantity}\n {...countCharProps}\n />\n )}\n\n <HvListContainer\n className={clsx(\n classes.tagsList,\n canShowError && classes.error,\n resizable && multiline && classes.resizable,\n isStateInvalid && classes.invalid,\n !multiline && classes.singleLine\n )}\n onKeyDown={onKeyDownHandler}\n onClick={onContainerClickHandler}\n ref={containerRef}\n >\n {value &&\n value.map((t, i) => {\n const tag =\n typeof t === \"string\"\n ? {\n label: t,\n type: \"semantic\",\n }\n : t;\n const { label, type, ...otherProps } = tag;\n return (\n <HvListItem\n // eslint-disable-next-line react/no-array-index-key\n key={`${tag.label}-${i}`}\n tabIndex={-1}\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n gutters: classes.listItemGutters,\n root: classes.listItemRoot,\n }}\n id={`tag-${i}`}\n >\n <HvTag\n label={label}\n className={clsx(i === tagCursorPos && classes.tagSelected)}\n classes={{\n chipRoot: classes.chipRoot,\n }}\n type={type}\n {...(!(readOnly || disabled || type === \"categorical\") && {\n onDelete: (event) => onDeleteTagHandler(event, i),\n })}\n deleteButtonProps={{\n tabIndex: -1,\n }}\n {...otherProps}\n />\n </HvListItem>\n );\n })}\n {!(disabled || readOnly) && (\n <HvListItem\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n root: classes.tagInputContainerRoot,\n gutters: classes.listItemGutters,\n }}\n id={`tag-${value.length}`}\n >\n <HvInput\n value={tagInput}\n disableClear\n onChange={onChangeHandler}\n onEnter={onEnterHandler}\n placeholder={value.length === 0 ? placeholder : \"\"}\n autoFocus={autoFocus}\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n root: classes.tagInputRoot,\n input: classes.input,\n inputBorderContainer: classes.tagInputBorderContainer,\n inputRootFocused: classes.tagInputRootFocused,\n }}\n disabled={disabled}\n readOnly={readOnly || isTagSelected}\n inputProps={{\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : description && setId(elementId, \"description\"),\n\n ...inputProps,\n }}\n inputRef={inputRef}\n {...others}\n />\n </HvListItem>\n )}\n </HvListContainer>\n {canShowError && (\n <HvWarningText id={setId(elementId, \"error\")} disableBorder className={classes.error}>\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n\nHvTagsInput.propTypes = {\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes: PropTypes.PropTypes.shape({\n /**\n * Styles applied to the input element.\n */\n input: PropTypes.string,\n /**\n * Styles applied to the list item gutters.\n */\n listItemGutters: PropTypes.string,\n /**\n * Styles applied to the list item element.\n */\n listItemRoot: PropTypes.string,\n /**\n * Styles applied to the root container of the textarea.\n */\n root: PropTypes.string,\n /**\n *\n */\n chipRoot: PropTypes.string,\n /**\n * Style applied to the root when resizable is `true`.\n */\n disabled: PropTypes.string,\n /**\n * Style applied to the root when resizable is `true`.\n */\n resizable: PropTypes.string,\n /**\n * Style applied to the root when invalid.\n */\n invalid: PropTypes.string,\n /**\n * Styles applied to text area container that holds the label, description and counter.\n */\n labelContainer: PropTypes.string,\n /**\n * Styles applied to the label element.\n */\n label: PropTypes.string,\n /**\n * Styles applied to the label element.\n */\n description: PropTypes.string,\n /**\n * Style applied on the character counter.\n */\n characterCounter: PropTypes.string,\n /**\n * Styles applied to the tags list container element.\n */\n tagsList: PropTypes.string,\n /**\n * Styles applied to the tag input container element.\n */\n tagInputContainerRoot: PropTypes.string,\n /**\n * Styles applied to the tag input element.\n */\n tagInputRoot: PropTypes.string,\n /**\n * Styles applied to a tag element when selected\n */\n tagSelected: PropTypes.string,\n /**\n * Styles applied to the input element border.\n */\n tagInputBorderContainer: PropTypes.string,\n /**\n * Styles applied to the input element when focused.\n */\n tagInputRootFocused: PropTypes.string,\n /**\n * Styles applied to the container when in single line mode.\n */\n singleLine: PropTypes.string,\n /**\n * Styles applied to the tags list when an error occurred.\n */\n error: PropTypes.string,\n }).isRequired,\n /**\n * Id to be applied to the form element root node.\n */\n id: PropTypes.string,\n /**\n * The form element name.\n */\n name: PropTypes.string,\n /**\n * The value of the form element.\n */\n value: PropTypes.array,\n /**\n * When uncontrolled, defines the initial input value.\n */\n defaultValue: PropTypes.array,\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label: PropTypes.node,\n /**\n * @ignore\n */\n \"aria-label\": PropTypes.string,\n /**\n * @ignore\n */\n \"aria-labelledby\": PropTypes.string,\n /**\n * Provide additional descriptive text for the form element.\n */\n description: PropTypes.node,\n /**\n * @ignore\n */\n \"aria-describedby\": PropTypes.string,\n /**\n * Indicates that the form element is disabled.\n */\n disabled: PropTypes.bool,\n /**\n * Indicates that the form element is not editable.\n */\n readOnly: PropTypes.bool,\n /**\n * Indicates that the form element is required.\n */\n required: PropTypes.bool,\n /**\n * The function that will be executed onChange.\n */\n onChange: PropTypes.func,\n /**\n * The function that will be executed when the element is focused.\n */\n onFocus: PropTypes.func,\n /**\n * The function that will be executed when the element is blurred.\n */\n onBlur: PropTypes.func,\n /**\n * The function that will be executed when a tag is deleted.\n */\n onDelete: PropTypes.func,\n /**\n * The function that will be executed when a tag is added.\n */\n onAdd: PropTypes.func,\n /**\n * The placeholder value of the input.\n */\n placeholder: PropTypes.string,\n /**\n * If `true` the character counter isn't shown even if maxTagsQuantity is set.\n */\n hideCounter: PropTypes.bool,\n /**\n * Text between the current char counter and max value.\n */\n middleCountLabel: PropTypes.string,\n /**\n * The maximum allowed length of the characters, if this value is null no check\n * will be performed.\n */\n maxTagsQuantity: PropTypes.number,\n /**\n * Attributes applied to the input element.\n */\n inputProps: PropTypes.instanceOf(Object),\n /**\n * If `true` it should autofocus.\n */\n autoFocus: PropTypes.bool,\n /**\n * If `true` the component is resizable.\n */\n resizable: PropTypes.bool,\n /**\n * Props passed to the HvCharCount component.\n */\n countCharProps: PropTypes.instanceOf(Object),\n /**\n * If `true` the component is in multiline mode.\n */\n multiline: PropTypes.bool,\n /**\n * The status of the form element.\n */\n status: PropTypes.string,\n /**\n * The error message to show when `status` is \"invalid\".\n */\n statusMessage: PropTypes.string,\n\n /**\n * An Object containing the various texts associated with the input.\n */\n validationMessages: PropTypes.shape({\n /**\n * The value when a validation fails.\n */\n error: PropTypes.string,\n /**\n * The message that appears when there are too many characters.\n */\n maxCharError: PropTypes.string,\n /**\n * The message that appears when there are too few characters.\n */\n minCharError: PropTypes.string,\n /**\n * The message that appears when the input is empty and required.\n */\n requiredError: PropTypes.string,\n }),\n};\n\nexport default withStyles(styles, { name: \"HvTagsInput\" })(HvTagsInput);\n"],"file":"TagsInput.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/TagsInput/TagsInput.js"],"names":["React","useRef","useState","useCallback","useMemo","useEffect","PropTypes","clsx","isNil","withStyles","setId","useControlled","HvFormElement","HvListContainer","HvListItem","HvTag","HvInput","HvLabel","HvInfoMessage","HvCharCounter","HvWarningText","useUniqueId","validationStates","DEFAULT_ERROR_MESSAGES","styles","HvTagsInput","props","classes","className","id","name","valueProp","value","defaultValue","readOnly","disabled","required","textAreaLabel","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","commitTagOn","commitOnBlur","others","elementId","hasLabel","hasDescription","setValue","standBy","validationState","setValidationState","validationMessage","setValidationMessage","tagInput","setTagInput","length","tagCursorPos","setTagCursorPos","stateValid","setStateValid","inputRef","containerRef","skipReset","blurTimeout","isTagSelected","hasCounter","isStateInvalid","errorMessages","error","requiredError","minCharError","maxCharError","performValidation","currValue","invalid","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","addTag","tag","preventDefault","newTag","type","canShowError","undefined","element","children","setTimeout","container","scrollLeft","offsetLeft","getBoundingClientRect","width","onChangeHandler","input","onInputKeyDownHandler","includes","code","onKeyDownHandler","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","root","labelContainer","characterCounter","tagsList","singleLine","map","t","otherProps","gutters","listItemGutters","listItemRoot","tagSelected","chipRoot","tabIndex","tagInputContainerRoot","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","propTypes","string","shape","isRequired","array","node","bool","func","number","instanceOf","Object","arrayOf"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useCallback, useMemo, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { withStyles } from \"@material-ui/core\";\nimport { setId, useControlled } from \"../utils\";\nimport {\n HvFormElement,\n HvListContainer,\n HvListItem,\n HvTag,\n HvInput,\n HvLabel,\n HvInfoMessage,\n HvCharCounter,\n HvWarningText,\n useUniqueId,\n} from \"..\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"../BaseInput/validations\";\nimport styles from \"./styles\";\n\n/**\n * A tags input is a single or multiline control that allows the input of tags.\n */\nconst HvTagsInput = (props) => {\n const {\n classes,\n className,\n\n id,\n name,\n\n value: valueProp,\n defaultValue = [],\n\n readOnly = false,\n disabled = false,\n required = false,\n\n label: textAreaLabel,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n onChange,\n onAdd,\n onDelete,\n onBlur,\n onFocus,\n\n placeholder,\n\n hideCounter = false,\n middleCountLabel = \"/\",\n maxTagsQuantity,\n\n autoFocus = false,\n resizable = true,\n\n inputProps = {},\n countCharProps = {},\n\n multiline = false,\n\n status,\n statusMessage,\n\n validationMessages,\n\n commitTagOn = [\"Enter\"],\n commitOnBlur = false,\n\n ...others\n } = props;\n const elementId = useUniqueId(id, \"hvTagsInput\");\n\n const hasLabel = textAreaLabel != null;\n const hasDescription = description != null;\n\n const [value, setValue] = useControlled(valueProp, defaultValue);\n const [validationState, setValidationState] = useControlled(status, validationStates.standBy);\n const [validationMessage, setValidationMessage] = useControlled(statusMessage, \"\");\n\n const [tagInput, setTagInput] = useState(\"\");\n const [tagCursorPos, setTagCursorPos] = useState(value.length);\n const [stateValid, setStateValid] = useState(true);\n\n const inputRef = useRef();\n const containerRef = useRef();\n const skipReset = useRef(false);\n const blurTimeout = useRef();\n\n const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n const isStateInvalid = useMemo(() => {\n return hasCounter && value.length > maxTagsQuantity;\n }, [hasCounter, maxTagsQuantity, value.length]);\n\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n validationMessages?.error,\n validationMessages?.requiredError,\n validationMessages?.minCharError,\n validationMessages?.maxCharError,\n ]\n );\n\n const performValidation = useCallback(\n (currValue) => {\n if (maxTagsQuantity !== null && currValue.length > maxTagsQuantity) {\n setValidationState(validationStates.invalid);\n setValidationMessage(errorMessages.maxCharError);\n setStateValid(false);\n } else {\n setValidationState(validationStates.valid);\n setValidationMessage(\"\");\n setStateValid(true);\n }\n },\n [errorMessages.maxCharError, maxTagsQuantity, setValidationMessage, setValidationState]\n );\n\n /**\n * Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n * Also executes the user provided onDelete and onChange events.\n *\n * @param {number} tagPos - the position at which to remove the tag\n * @param {Event} event - the event associated with the delete\n * @param {boolean} end - whether or not to set the cursor at the end of the array\n */\n const deleteTag = useCallback(\n (tagPos, event, end) => {\n const newTagsArr = [...value.slice(0, tagPos), ...value.slice(tagPos + 1)];\n setValue(newTagsArr);\n // eslint-disable-next-line no-nested-ternary\n setTagCursorPos(end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n inputRef.current?.focus();\n performValidation(newTagsArr);\n onDelete?.(event, value[tagPos], tagPos);\n onChange?.(event, newTagsArr);\n skipReset.current = true;\n },\n [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n );\n\n const addTag = useCallback(\n (event, tag) => {\n event.preventDefault();\n if (tag !== \"\") {\n const newTag = { label: tag, type: \"semantic\" };\n const newTagsArr = [...value, newTag];\n setValue(newTagsArr);\n performValidation(newTagsArr);\n onAdd?.(event, newTag, newTagsArr.length - 1);\n onChange?.(event, newTagsArr);\n }\n },\n [onAdd, onChange, performValidation, setValue, value]\n );\n\n const canShowError =\n (status !== undefined && status === \"invalid\" && statusMessage !== undefined) || !stateValid;\n\n useEffect(() => {\n if (!multiline) {\n const element = containerRef?.current?.children[tagCursorPos];\n // this setTimeout is a workaround for Firefox not properly dealing\n // with setting the scrollLeft value.\n setTimeout(() => {\n const container = containerRef.current;\n if (isNil(container)) return;\n container.scrollLeft = element\n ? element.offsetLeft -\n container.getBoundingClientRect().width / 2 +\n element.getBoundingClientRect().width / 2\n : 0;\n }, 50);\n\n element?.focus();\n }\n }, [multiline, tagCursorPos]);\n\n useEffect(() => {\n if (!skipReset.current) {\n setTagInput(\"\");\n setTagCursorPos(value.length);\n }\n skipReset.current = false;\n }, [value]);\n\n /**\n * Handler for the `onChange` event on the tag input\n */\n const onChangeHandler = useCallback((event, input) => {\n setTagInput(input);\n }, []);\n\n /**\n * Handler for the `onKeyDown` event on the form element\n */\n const onInputKeyDownHandler = useCallback(\n (event) => {\n if (commitTagOn.includes(event.code)) {\n addTag(event, tagInput);\n }\n },\n [addTag, commitTagOn, tagInput]\n );\n\n /**\n * Handler for the `onKeyDown` event on the list container.\n */\n const onKeyDownHandler = useCallback(\n (event) => {\n if (tagInput === \"\") {\n switch (event.code) {\n case \"ArrowLeft\":\n setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n break;\n case \"ArrowRight\":\n setTagCursorPos(tagCursorPos < value.length ? tagCursorPos + 1 : value.length);\n break;\n case \"Backspace\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n } else {\n setTagCursorPos(value.length - 1);\n }\n break;\n case \"Delete\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n }\n break;\n default:\n break;\n }\n }\n },\n [deleteTag, isTagSelected, tagCursorPos, tagInput, value.length]\n );\n\n /**\n * Handler for the `onDelete` event on the tag component\n */\n const onDeleteTagHandler = useCallback(\n (event, i) => {\n deleteTag(i, event, true);\n setValidationState(validationStates.standBy);\n },\n [deleteTag, setValidationState]\n );\n\n /**\n * Handler for the `onClick` event on the list container\n */\n const onContainerClickHandler = useCallback(() => {\n inputRef.current?.focus();\n clearTimeout(blurTimeout.current);\n setTagCursorPos(value.length);\n }, [value.length]);\n\n const onBlurHandler = (evt) => {\n blurTimeout.current = setTimeout(() => {\n if (commitOnBlur) {\n addTag(evt, tagInput);\n }\n onBlur?.(evt, tagInput);\n }, 250);\n };\n\n const onFocusHandler = (evt) => {\n clearTimeout(blurTimeout.current);\n onFocus?.(evt, tagInput);\n };\n\n return (\n <HvFormElement\n id={id}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n required={required}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n className={clsx(classes.root, className, {\n [classes.disabled]: disabled,\n })}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n className={classes.label}\n id={setId(id, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={textAreaLabel}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage className={classes.description} id={setId(elementId, \"description\")}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n\n {hasCounter && (\n <HvCharCounter\n id={setId(elementId, \"charCounter\")}\n className={classes.characterCounter}\n separator={middleCountLabel}\n currentCharQuantity={value.length}\n maxCharQuantity={maxTagsQuantity}\n {...countCharProps}\n />\n )}\n\n <HvListContainer\n className={clsx(\n classes.tagsList,\n canShowError && classes.error,\n resizable && multiline && classes.resizable,\n isStateInvalid && classes.invalid,\n !multiline && classes.singleLine\n )}\n onKeyDown={onKeyDownHandler}\n onClick={onContainerClickHandler}\n ref={containerRef}\n >\n {value &&\n value.map((t, i) => {\n const tag =\n typeof t === \"string\"\n ? {\n label: t,\n type: \"semantic\",\n }\n : t;\n const { label, type, ...otherProps } = tag;\n return (\n <HvListItem\n // eslint-disable-next-line react/no-array-index-key\n key={`${tag.label}-${i}`}\n tabIndex={-1}\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n gutters: classes.listItemGutters,\n root: classes.listItemRoot,\n }}\n id={`tag-${i}`}\n >\n <HvTag\n label={label}\n className={clsx(i === tagCursorPos && classes.tagSelected)}\n classes={{\n chipRoot: classes.chipRoot,\n }}\n type={type}\n {...(!(readOnly || disabled || type === \"categorical\") && {\n onDelete: (event) => onDeleteTagHandler(event, i),\n })}\n deleteButtonProps={{\n tabIndex: -1,\n }}\n {...otherProps}\n />\n </HvListItem>\n );\n })}\n {!(disabled || readOnly) && (\n <HvListItem\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n root: classes.tagInputContainerRoot,\n gutters: classes.listItemGutters,\n }}\n id={`tag-${value.length}`}\n >\n <HvInput\n value={tagInput}\n disableClear\n onChange={onChangeHandler}\n onKeyDown={onInputKeyDownHandler}\n placeholder={value.length === 0 ? placeholder : \"\"}\n autoFocus={autoFocus}\n className={clsx(!multiline && classes.singleLine)}\n classes={{\n root: classes.tagInputRoot,\n input: classes.input,\n inputBorderContainer: classes.tagInputBorderContainer,\n inputRootFocused: classes.tagInputRootFocused,\n }}\n disabled={disabled}\n readOnly={readOnly || isTagSelected}\n inputProps={{\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : description && setId(elementId, \"description\"),\n\n ...inputProps,\n }}\n inputRef={inputRef}\n {...others}\n />\n </HvListItem>\n )}\n </HvListContainer>\n {canShowError && (\n <HvWarningText id={setId(elementId, \"error\")} disableBorder className={classes.error}>\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n\nHvTagsInput.propTypes = {\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes: PropTypes.PropTypes.shape({\n /**\n * Styles applied to the input element.\n */\n input: PropTypes.string,\n /**\n * Styles applied to the list item gutters.\n */\n listItemGutters: PropTypes.string,\n /**\n * Styles applied to the list item element.\n */\n listItemRoot: PropTypes.string,\n /**\n * Styles applied to the root container of the textarea.\n */\n root: PropTypes.string,\n /**\n *\n */\n chipRoot: PropTypes.string,\n /**\n * Style applied to the root when resizable is `true`.\n */\n disabled: PropTypes.string,\n /**\n * Style applied to the root when resizable is `true`.\n */\n resizable: PropTypes.string,\n /**\n * Style applied to the root when invalid.\n */\n invalid: PropTypes.string,\n /**\n * Styles applied to text area container that holds the label, description and counter.\n */\n labelContainer: PropTypes.string,\n /**\n * Styles applied to the label element.\n */\n label: PropTypes.string,\n /**\n * Styles applied to the label element.\n */\n description: PropTypes.string,\n /**\n * Style applied on the character counter.\n */\n characterCounter: PropTypes.string,\n /**\n * Styles applied to the tags list container element.\n */\n tagsList: PropTypes.string,\n /**\n * Styles applied to the tag input container element.\n */\n tagInputContainerRoot: PropTypes.string,\n /**\n * Styles applied to the tag input element.\n */\n tagInputRoot: PropTypes.string,\n /**\n * Styles applied to a tag element when selected\n */\n tagSelected: PropTypes.string,\n /**\n * Styles applied to the input element border.\n */\n tagInputBorderContainer: PropTypes.string,\n /**\n * Styles applied to the input element when focused.\n */\n tagInputRootFocused: PropTypes.string,\n /**\n * Styles applied to the container when in single line mode.\n */\n singleLine: PropTypes.string,\n /**\n * Styles applied to the tags list when an error occurred.\n */\n error: PropTypes.string,\n }).isRequired,\n /**\n * Id to be applied to the form element root node.\n */\n id: PropTypes.string,\n /**\n * The form element name.\n */\n name: PropTypes.string,\n /**\n * The value of the form element.\n */\n value: PropTypes.array,\n /**\n * When uncontrolled, defines the initial input value.\n */\n defaultValue: PropTypes.array,\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label: PropTypes.node,\n /**\n * @ignore\n */\n \"aria-label\": PropTypes.string,\n /**\n * @ignore\n */\n \"aria-labelledby\": PropTypes.string,\n /**\n * Provide additional descriptive text for the form element.\n */\n description: PropTypes.node,\n /**\n * @ignore\n */\n \"aria-describedby\": PropTypes.string,\n /**\n * Indicates that the form element is disabled.\n */\n disabled: PropTypes.bool,\n /**\n * Indicates that the form element is not editable.\n */\n readOnly: PropTypes.bool,\n /**\n * Indicates that the form element is required.\n */\n required: PropTypes.bool,\n /**\n * The function that will be executed onChange.\n */\n onChange: PropTypes.func,\n /**\n * The function that will be executed when the element is focused.\n */\n onFocus: PropTypes.func,\n /**\n * The function that will be executed when the element is blurred.\n */\n onBlur: PropTypes.func,\n /**\n * The function that will be executed when a tag is deleted.\n */\n onDelete: PropTypes.func,\n /**\n * The function that will be executed when a tag is added.\n */\n onAdd: PropTypes.func,\n /**\n * The placeholder value of the input.\n */\n placeholder: PropTypes.string,\n /**\n * If `true` the character counter isn't shown even if maxTagsQuantity is set.\n */\n hideCounter: PropTypes.bool,\n /**\n * Text between the current char counter and max value.\n */\n middleCountLabel: PropTypes.string,\n /**\n * The maximum allowed length of the characters, if this value is null no check\n * will be performed.\n */\n maxTagsQuantity: PropTypes.number,\n /**\n * Attributes applied to the input element.\n */\n inputProps: PropTypes.instanceOf(Object),\n /**\n * If `true` it should autofocus.\n */\n autoFocus: PropTypes.bool,\n /**\n * If `true` the component is resizable.\n */\n resizable: PropTypes.bool,\n /**\n * Props passed to the HvCharCount component.\n */\n countCharProps: PropTypes.instanceOf(Object),\n /**\n * If `true` the component is in multiline mode.\n */\n multiline: PropTypes.bool,\n /**\n * The status of the form element.\n */\n status: PropTypes.string,\n /**\n * The error message to show when `status` is \"invalid\".\n */\n statusMessage: PropTypes.string,\n\n /**\n * An Object containing the various texts associated with the input.\n */\n validationMessages: PropTypes.shape({\n /**\n * The value when a validation fails.\n */\n error: PropTypes.string,\n /**\n * The message that appears when there are too many characters.\n */\n maxCharError: PropTypes.string,\n /**\n * The message that appears when there are too few characters.\n */\n minCharError: PropTypes.string,\n /**\n * The message that appears when the input is empty and required.\n */\n requiredError: PropTypes.string,\n }),\n /**\n * An array of strings that represent the character used to input a tag.\n * This character is the string representation of the event.code from the input event.\n */\n commitTagOn: PropTypes.arrayOf(PropTypes.string),\n /**\n * If `true` the tag will be commited when the blur event occurs.\n */\n commitOnBlur: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvTagsInput\" })(HvTagsInput);\n"],"file":"TagsInput.js"}
|
|
@@ -118,7 +118,7 @@ process.env.NODE_ENV !== "production" ? HvTooltip.propTypes = {
|
|
|
118
118
|
/**
|
|
119
119
|
* Tooltip placement.
|
|
120
120
|
*/
|
|
121
|
-
placement: PropTypes.
|
|
121
|
+
placement: PropTypes.oneOf(["bottom-end", "bottom-start", "bottom", "left-end", "left-start", "left", "right-end", "right-start", "right", "top-end", "top-start", "top"]),
|
|
122
122
|
|
|
123
123
|
/**
|
|
124
124
|
* The number of milliseconds to wait before showing the tooltip.
|