@xqmsg/ui-core 0.24.5 → 0.24.6
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/components/input/StackedPilledInput/index.d.ts +1 -0
- package/dist/components/input/components/token/index.d.ts +1 -0
- package/dist/components/input/index.d.ts +2 -1
- package/dist/ui-core.cjs.development.js +12 -6
- package/dist/ui-core.cjs.development.js.map +1 -1
- package/dist/ui-core.cjs.production.min.js +1 -1
- package/dist/ui-core.cjs.production.min.js.map +1 -1
- package/dist/ui-core.esm.js +12 -6
- package/dist/ui-core.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/input/StackedPilledInput/index.tsx +3 -0
- package/src/components/input/components/token/index.tsx +8 -2
- package/src/components/input/index.tsx +3 -0
|
@@ -25,9 +25,10 @@ export interface InputProps<T extends FieldValues = FieldValues> extends Validat
|
|
|
25
25
|
variant?: string;
|
|
26
26
|
separators?: string[];
|
|
27
27
|
loadingOptions?: boolean;
|
|
28
|
+
truncatePillLength?: number;
|
|
28
29
|
}
|
|
29
30
|
/**
|
|
30
31
|
* A functional React component utilized to render the `Input` component. Utilizes a switch statement
|
|
31
32
|
* to render the correct input based on the `inputType`.
|
|
32
33
|
*/
|
|
33
|
-
export declare function Input<T extends FieldValues>({ inputType, label, ariaLabel, className, placeholder, name, helperText, options, tooltipText, isInvalid, errorText, isRequired, maxLength, defaultValue, fullOptions, control, disabled, rightElement, leftElement, variant, onChange, setValue, setError, clearErrors, separators, loadingOptions, }: InputProps<T>): React.JSX.Element;
|
|
34
|
+
export declare function Input<T extends FieldValues>({ inputType, label, ariaLabel, className, placeholder, name, helperText, options, tooltipText, isInvalid, errorText, isRequired, maxLength, defaultValue, fullOptions, control, disabled, rightElement, leftElement, variant, onChange, setValue, setError, clearErrors, separators, loadingOptions, truncatePillLength, }: InputProps<T>): React.JSX.Element;
|
|
@@ -1279,7 +1279,9 @@ var Token = function Token(_ref) {
|
|
|
1279
1279
|
var label = _ref.label,
|
|
1280
1280
|
onDelete = _ref.onDelete,
|
|
1281
1281
|
_ref$isMobile = _ref.isMobile,
|
|
1282
|
-
isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile
|
|
1282
|
+
isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile,
|
|
1283
|
+
_ref$truncateLength = _ref.truncateLength,
|
|
1284
|
+
truncateLength = _ref$truncateLength === void 0 ? 15 : _ref$truncateLength;
|
|
1283
1285
|
return /*#__PURE__*/React__default.createElement(react.Flex, {
|
|
1284
1286
|
key: label,
|
|
1285
1287
|
borderRadius: 'full',
|
|
@@ -1298,7 +1300,7 @@ var Token = function Token(_ref) {
|
|
|
1298
1300
|
fontSize: isMobile ? '17px' : '13px',
|
|
1299
1301
|
pr: "4px"
|
|
1300
1302
|
}, lodash.truncate(label.trim(), {
|
|
1301
|
-
length:
|
|
1303
|
+
length: truncateLength,
|
|
1302
1304
|
omission: '...'
|
|
1303
1305
|
})), /*#__PURE__*/React__default.createElement(Close, {
|
|
1304
1306
|
boxSize: isMobile ? '17px' : '11px',
|
|
@@ -1611,7 +1613,8 @@ var StackedPilledInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
|
|
|
1611
1613
|
_ref2$separators = _ref2.separators,
|
|
1612
1614
|
separators = _ref2$separators === void 0 ? ['Enter', ' ', ',', ';', 'Tab'] : _ref2$separators,
|
|
1613
1615
|
variant = _ref2.variant,
|
|
1614
|
-
label = _ref2.label
|
|
1616
|
+
label = _ref2.label,
|
|
1617
|
+
truncatePillLength = _ref2.truncatePillLength;
|
|
1615
1618
|
var watchedValue = reactHookForm.useWatch({
|
|
1616
1619
|
control: control,
|
|
1617
1620
|
name: name
|
|
@@ -1820,7 +1823,8 @@ var StackedPilledInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
|
|
|
1820
1823
|
e.preventDefault();
|
|
1821
1824
|
onRemoveTag(index);
|
|
1822
1825
|
},
|
|
1823
|
-
isMobile: isMobile
|
|
1826
|
+
isMobile: isMobile,
|
|
1827
|
+
truncateLength: truncatePillLength
|
|
1824
1828
|
}));
|
|
1825
1829
|
}) : null, !lastestFormValueToArray.length && !isFocussed ? /*#__PURE__*/React__default.createElement(react.Text, {
|
|
1826
1830
|
color: colors.label.secondary.light,
|
|
@@ -1939,7 +1943,8 @@ function Input(_ref) {
|
|
|
1939
1943
|
clearErrors = _ref.clearErrors,
|
|
1940
1944
|
separators = _ref.separators,
|
|
1941
1945
|
_ref$loadingOptions = _ref.loadingOptions,
|
|
1942
|
-
loadingOptions = _ref$loadingOptions === void 0 ? false : _ref$loadingOptions
|
|
1946
|
+
loadingOptions = _ref$loadingOptions === void 0 ? false : _ref$loadingOptions,
|
|
1947
|
+
truncatePillLength = _ref.truncatePillLength;
|
|
1943
1948
|
function selectedInputField(onChange, onBlur, ref, value) {
|
|
1944
1949
|
switch (inputType) {
|
|
1945
1950
|
case 'text':
|
|
@@ -2068,7 +2073,8 @@ function Input(_ref) {
|
|
|
2068
2073
|
maxLength: maxLength,
|
|
2069
2074
|
variant: variant,
|
|
2070
2075
|
label: label,
|
|
2071
|
-
separators: separators
|
|
2076
|
+
separators: separators,
|
|
2077
|
+
truncatePillLength: truncatePillLength
|
|
2072
2078
|
});
|
|
2073
2079
|
case 'switch':
|
|
2074
2080
|
return /*#__PURE__*/React__default.createElement(StackedSwitch, {
|