@pdg/react-form 1.0.141 → 1.0.142
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/index.esm.js +25 -30
- package/dist/index.js +25 -30
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -1412,7 +1412,7 @@ FormText.displayName = 'FormText';var FormTagText = React.forwardRef(function (_
|
|
|
1412
1412
|
/********************************************************************************************************************
|
|
1413
1413
|
* Render
|
|
1414
1414
|
* ******************************************************************************************************************/
|
|
1415
|
-
return (React.createElement(StyledFormText, __assign({ ref: ref }, props, { value: valueRef.current, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: handleBlur })));
|
|
1415
|
+
return (React.createElement(StyledFormText, __assign({ ref: ref }, props, { clear: false, value: valueRef.current, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: handleBlur })));
|
|
1416
1416
|
});
|
|
1417
1417
|
/********************************************************************************************************************
|
|
1418
1418
|
* Styled Components
|
|
@@ -1423,11 +1423,15 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1423
1423
|
/********************************************************************************************************************
|
|
1424
1424
|
* FormState
|
|
1425
1425
|
* ******************************************************************************************************************/
|
|
1426
|
-
var
|
|
1427
|
-
|
|
1426
|
+
var initVariant = _a.variant, initSize = _a.size,
|
|
1427
|
+
//----------------------------------------------------------------------------------------------------------------
|
|
1428
|
+
className = _a.className, name = _a.name, _b = _a.value, initValue = _b === void 0 ? _emptyValue : _b, exceptValue = _a.exceptValue, _c = _a.clear, clear = _c === void 0 ? true : _c, required = _a.required, readOnly = _a.readOnly, maxLength = _a.maxLength, initDisabled = _a.disabled, initFullWidth = _a.fullWidth, initError = _a.error, helperText = _a.helperText, _d = _a.formValueSeparator, formValueSeparator = _d === void 0 ? ',' : _d, formValueSort = _a.formValueSort, limitTags = _a.limitTags, getLimitTagsText = _a.getLimitTagsText, slotProps = _a.slotProps, onAppendTag = _a.onAppendTag, onRemoveTag = _a.onRemoveTag, onValidate = _a.onValidate, onChange = _a.onChange, onValue = _a.onValue, props = __rest(_a, ["variant", "size", "className", "name", "value", "exceptValue", "clear", "required", "readOnly", "maxLength", "disabled", "fullWidth", "error", "helperText", "formValueSeparator", "formValueSort", "limitTags", "getLimitTagsText", "slotProps", "onAppendTag", "onRemoveTag", "onValidate", "onChange", "onValue"]);
|
|
1429
|
+
var _e = useFormState(), formVariant = _e.variant, formSize = _e.size, formFullWidth = _e.fullWidth, formDisabled = _e.disabled, onAddValueItem = _e.onAddValueItem, onValueChange = _e.onValueChange, onValueChangeByUser = _e.onValueChangeByUser, onRequestSearchSubmit = _e.onRequestSearchSubmit, otherFormState = __rest(_e, ["variant", "size", "fullWidth", "disabled", "onAddValueItem", "onValueChange", "onValueChangeByUser", "onRequestSearchSubmit"]);
|
|
1428
1430
|
/********************************************************************************************************************
|
|
1429
1431
|
* FormState - Variables
|
|
1430
1432
|
* ******************************************************************************************************************/
|
|
1433
|
+
var variant = ifUndefined(initVariant, formVariant);
|
|
1434
|
+
var size = ifUndefined(initSize, formSize);
|
|
1431
1435
|
var fullWidth = ifUndefined(initFullWidth, formFullWidth);
|
|
1432
1436
|
/********************************************************************************************************************
|
|
1433
1437
|
* State
|
|
@@ -1554,16 +1558,19 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1554
1558
|
}
|
|
1555
1559
|
}, [ref, getCommands]);
|
|
1556
1560
|
var handleRenderValue = useCallback(function (tags) {
|
|
1557
|
-
return tags.map(function (tag) { return (React.createElement(Chip, { className: 'MuiAutocomplete-tag', key: tag, label: tag, size: 'small', disabled: readOnly || disabled, onDelete: readOnly || disabled ? undefined : function () { return removeTag(tag); } })); });
|
|
1558
|
-
}, [disabled, readOnly, removeTag]);
|
|
1561
|
+
return tags.map(function (tag) { return (React.createElement(Chip, { className: 'MuiAutocomplete-tag', key: tag, label: tag, size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, disabled: readOnly || disabled, onDelete: readOnly || disabled ? undefined : function () { return removeTag(tag); } })); });
|
|
1562
|
+
}, [disabled, readOnly, removeTag, size, variant]);
|
|
1559
1563
|
/********************************************************************************************************************
|
|
1560
1564
|
* Render
|
|
1561
1565
|
* ******************************************************************************************************************/
|
|
1562
1566
|
var handleRenderInput = useCallback(function (params) {
|
|
1567
|
+
var _a, _b;
|
|
1563
1568
|
var htmlInputProps = __assign(__assign({}, params.inputProps), { className: classNames('FormTag-Input', readOnly && 'Mui-disabled'), readOnly: readOnly, tabIndex: readOnly ? -1 : undefined, maxLength: maxLength });
|
|
1564
1569
|
delete htmlInputProps.onChange;
|
|
1565
1570
|
delete htmlInputProps.value;
|
|
1566
|
-
var renderProps = __assign({ name: name, clear: clear, className: classNames(className, 'FormValueItem', 'FormTag'), error: error, disabled: disabled, fullWidth: fullWidth, required: required, exceptValue: exceptValue, slotProps: __assign(__assign({}, slotProps), { inputLabel: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel), { htmlFor: params.InputLabelProps.htmlFor, id: params.InputLabelProps.id }), input: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input), {
|
|
1571
|
+
var renderProps = __assign({ name: name, clear: clear, className: classNames(className, 'FormValueItem', 'FormTag'), error: error, disabled: disabled, fullWidth: fullWidth, required: required, exceptValue: exceptValue, slotProps: __assign(__assign({}, slotProps), { inputLabel: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel), { htmlFor: params.InputLabelProps.htmlFor, id: params.InputLabelProps.id }), input: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input), { style: __assign(__assign({}, (_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.input) === null || _a === void 0 ? void 0 : _a.style), (variant === 'outlined' && size === 'small'
|
|
1572
|
+
? { paddingTop: 7, paddingBottom: 6, marginTop: -2 }
|
|
1573
|
+
: undefined)), className: params.InputProps.className, ref: params.InputProps.ref, startAdornment: params.InputProps.startAdornment }), htmlInput: __assign(__assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.htmlInput), htmlInputProps), { style: __assign(__assign(__assign({}, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.htmlInput) === null || _b === void 0 ? void 0 : _b.style), htmlInputProps.style), (variant === 'outlined' && size === 'small' ? { marginTop: 4, paddingBottom: 2 } : undefined)) }) }), helperText: error ? errorHelperText : helperText, onAppendTag: appendTag }, props);
|
|
1567
1574
|
return React.createElement(FormTagText, __assign({ ref: handleRef }, renderProps));
|
|
1568
1575
|
}, [
|
|
1569
1576
|
appendTag,
|
|
@@ -1581,9 +1588,11 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1581
1588
|
props,
|
|
1582
1589
|
readOnly,
|
|
1583
1590
|
required,
|
|
1591
|
+
size,
|
|
1584
1592
|
slotProps,
|
|
1593
|
+
variant,
|
|
1585
1594
|
]);
|
|
1586
|
-
return (React.createElement(FormContextProvider, { value: __assign(__assign({}, otherFormState), { fullWidth: formFullWidth, onAddValueItem: handleAddValueItem, onValueChange: function () { }, onValueChangeByUser: function () { }, onRequestSearchSubmit: function () { } }) },
|
|
1595
|
+
return (React.createElement(FormContextProvider, { value: __assign(__assign({}, otherFormState), { variant: formVariant, size: formSize, fullWidth: formFullWidth, onAddValueItem: handleAddValueItem, onValueChange: function () { }, onValueChangeByUser: function () { }, onRequestSearchSubmit: function () { } }) },
|
|
1587
1596
|
React.createElement(Autocomplete, { options: [], multiple: true, freeSolo: true, value: value, readOnly: readOnly, disableClearable: true, limitTags: limitTags, getLimitTagsText: getLimitTagsText, disabled: disabled, renderValue: handleRenderValue, style: { display: fullWidth ? 'block' : 'inline-block', width: fullWidth ? '100%' : undefined }, renderInput: handleRenderInput })));
|
|
1588
1597
|
});
|
|
1589
1598
|
FormTag.displayName = 'FormTag';var FormEmail = React.forwardRef(function (_a, ref) {
|
|
@@ -4483,25 +4492,6 @@ FormTextEditor.displayName = 'FormTextEditor';var FormAutocomplete = ToForwardRe
|
|
|
4483
4492
|
/********************************************************************************************************************
|
|
4484
4493
|
* Render
|
|
4485
4494
|
* ******************************************************************************************************************/
|
|
4486
|
-
// const realComponentValue = useMemo(() => {
|
|
4487
|
-
// let newRealValue = componentValue;
|
|
4488
|
-
// if (items && value != null) {
|
|
4489
|
-
// if (Array.isArray(newRealValue)) {
|
|
4490
|
-
// const stringRealValues = newRealValue.map((v) => v.toString());
|
|
4491
|
-
// if (multiple) {
|
|
4492
|
-
// const foundItems = items.filter((v) => stringRealValues.includes(v.value.toString()));
|
|
4493
|
-
// newRealValue = foundItems.map((v) => v.value) as any;
|
|
4494
|
-
// }
|
|
4495
|
-
// } else if (newRealValue != null) {
|
|
4496
|
-
// const stringRealValue = newRealValue.toString();
|
|
4497
|
-
// const foundItem = items.find((v) => v.value.toString() === stringRealValue);
|
|
4498
|
-
// if (foundItem) {
|
|
4499
|
-
// newRealValue = foundItem.value as any;
|
|
4500
|
-
// }
|
|
4501
|
-
// }
|
|
4502
|
-
// }
|
|
4503
|
-
// return newRealValue;
|
|
4504
|
-
// }, [componentValue, items, multiple, value]);
|
|
4505
4495
|
return (React.createElement(Autocomplete, { options: items || [], className: classNames(className, 'FormValueItem', 'FormAutocomplete'), sx: sx, multiple: multiple, fullWidth: !width && fullWidth, openOnFocus: openOnFocus, disableClearable: disableClearable, disablePortal: disablePortal, noOptionsText: noOptionsText, value: componentValue, style: style, isOptionEqualToValue: function (option, value) { return option.value === value.value; }, getOptionDisabled: handleGetOptionDisabled, disabled: disabled, readOnly: readOnly, loading: loading || isOnGetItemLoading, loadingText: loadingText, limitTags: limitTags, getLimitTagsText: getLimitTagsText, onChange: function (e, value, reason, details) { return handleChange(value, reason, details); }, renderOption: function (props, option) { return (React.createElement("li", __assign({}, props, { key: "".concat(option.value) }), onRenderItem ? onRenderItem(option) : option.label)); }, onInputChange: function (event, newInputValue, reason) {
|
|
4506
4496
|
if (reason === 'input') {
|
|
4507
4497
|
setInputValue(newInputValue);
|
|
@@ -4511,17 +4501,22 @@ FormTextEditor.displayName = 'FormTextEditor';var FormAutocomplete = ToForwardRe
|
|
|
4511
4501
|
}
|
|
4512
4502
|
}, renderValue: function (value, getItemProps) {
|
|
4513
4503
|
if (Array.isArray(value)) {
|
|
4514
|
-
return value.map(function (option, index) { return (React.createElement(Chip, __assign({ size: 'small', label: onRenderTag ? onRenderTag(option) : option.label }, getItemProps({ index: index })))); });
|
|
4504
|
+
return value.map(function (option, index) { return (React.createElement(Chip, __assign({ size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, label: onRenderTag ? onRenderTag(option) : option.label }, getItemProps({ index: index })))); });
|
|
4515
4505
|
}
|
|
4516
4506
|
else {
|
|
4517
|
-
return (React.createElement(Chip, __assign({ size: 'small', label: onRenderTag ? onRenderTag(value) : value.label }, getItemProps({ index: 0 }))));
|
|
4507
|
+
return (React.createElement(Chip, __assign({ size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, label: onRenderTag ? onRenderTag(value) : value.label }, getItemProps({ index: 0 }))));
|
|
4518
4508
|
}
|
|
4519
4509
|
}, renderInput: function (params) {
|
|
4510
|
+
var _a;
|
|
4520
4511
|
var slotProps = {
|
|
4521
|
-
input: __assign(__assign({}, params.InputProps), {
|
|
4512
|
+
input: __assign(__assign({}, params.InputProps), { style: {
|
|
4513
|
+
paddingTop: variant === 'outlined' && size === 'small' ? 7 : undefined,
|
|
4514
|
+
paddingBottom: variant === 'outlined' && size === 'small' ? 5 : undefined,
|
|
4515
|
+
marginTop: variant === 'outlined' && size === 'small' ? -1 : undefined,
|
|
4516
|
+
}, endAdornment: (React.createElement(React.Fragment, null,
|
|
4522
4517
|
loading || isOnGetItemLoading ? React.createElement(CircularProgress, { color: 'inherit', size: 20 }) : null,
|
|
4523
4518
|
params.InputProps.endAdornment)) }),
|
|
4524
|
-
htmlInput: __assign(__assign({}, params.inputProps), { tabIndex: readOnly || disabled ? -1 : undefined }),
|
|
4519
|
+
htmlInput: __assign(__assign({}, params.inputProps), { style: __assign(__assign({}, (_a = params.inputProps) === null || _a === void 0 ? void 0 : _a.style), (variant === 'outlined' && size === 'small' ? { marginTop: 1 } : undefined)), tabIndex: readOnly || disabled ? -1 : undefined }),
|
|
4525
4520
|
};
|
|
4526
4521
|
return (React.createElement(FormTextField, __assign({}, params, { ref: textFieldRef, name: name, variant: variant, size: size, color: color, labelIcon: labelIcon, label: label, labelShrink: labelShrink, required: required, focused: focused, error: error, readOnly: readOnly, helperText: error ? errorHelperText : helperText, slotProps: slotProps, placeholder: placeholder, noFormValueItem: true })));
|
|
4527
4522
|
} }));
|
package/dist/index.js
CHANGED
|
@@ -1412,7 +1412,7 @@ FormText.displayName = 'FormText';var FormTagText = React.forwardRef(function (_
|
|
|
1412
1412
|
/********************************************************************************************************************
|
|
1413
1413
|
* Render
|
|
1414
1414
|
* ******************************************************************************************************************/
|
|
1415
|
-
return (React.createElement(StyledFormText, __assign({ ref: ref }, props, { value: valueRef.current, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: handleBlur })));
|
|
1415
|
+
return (React.createElement(StyledFormText, __assign({ ref: ref }, props, { clear: false, value: valueRef.current, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: handleBlur })));
|
|
1416
1416
|
});
|
|
1417
1417
|
/********************************************************************************************************************
|
|
1418
1418
|
* Styled Components
|
|
@@ -1423,11 +1423,15 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1423
1423
|
/********************************************************************************************************************
|
|
1424
1424
|
* FormState
|
|
1425
1425
|
* ******************************************************************************************************************/
|
|
1426
|
-
var
|
|
1427
|
-
|
|
1426
|
+
var initVariant = _a.variant, initSize = _a.size,
|
|
1427
|
+
//----------------------------------------------------------------------------------------------------------------
|
|
1428
|
+
className = _a.className, name = _a.name, _b = _a.value, initValue = _b === void 0 ? _emptyValue : _b, exceptValue = _a.exceptValue, _c = _a.clear, clear = _c === void 0 ? true : _c, required = _a.required, readOnly = _a.readOnly, maxLength = _a.maxLength, initDisabled = _a.disabled, initFullWidth = _a.fullWidth, initError = _a.error, helperText = _a.helperText, _d = _a.formValueSeparator, formValueSeparator = _d === void 0 ? ',' : _d, formValueSort = _a.formValueSort, limitTags = _a.limitTags, getLimitTagsText = _a.getLimitTagsText, slotProps = _a.slotProps, onAppendTag = _a.onAppendTag, onRemoveTag = _a.onRemoveTag, onValidate = _a.onValidate, onChange = _a.onChange, onValue = _a.onValue, props = __rest(_a, ["variant", "size", "className", "name", "value", "exceptValue", "clear", "required", "readOnly", "maxLength", "disabled", "fullWidth", "error", "helperText", "formValueSeparator", "formValueSort", "limitTags", "getLimitTagsText", "slotProps", "onAppendTag", "onRemoveTag", "onValidate", "onChange", "onValue"]);
|
|
1429
|
+
var _e = useFormState(), formVariant = _e.variant, formSize = _e.size, formFullWidth = _e.fullWidth, formDisabled = _e.disabled, onAddValueItem = _e.onAddValueItem, onValueChange = _e.onValueChange, onValueChangeByUser = _e.onValueChangeByUser, onRequestSearchSubmit = _e.onRequestSearchSubmit, otherFormState = __rest(_e, ["variant", "size", "fullWidth", "disabled", "onAddValueItem", "onValueChange", "onValueChangeByUser", "onRequestSearchSubmit"]);
|
|
1428
1430
|
/********************************************************************************************************************
|
|
1429
1431
|
* FormState - Variables
|
|
1430
1432
|
* ******************************************************************************************************************/
|
|
1433
|
+
var variant = util.ifUndefined(initVariant, formVariant);
|
|
1434
|
+
var size = util.ifUndefined(initSize, formSize);
|
|
1431
1435
|
var fullWidth = util.ifUndefined(initFullWidth, formFullWidth);
|
|
1432
1436
|
/********************************************************************************************************************
|
|
1433
1437
|
* State
|
|
@@ -1554,16 +1558,19 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1554
1558
|
}
|
|
1555
1559
|
}, [ref, getCommands]);
|
|
1556
1560
|
var handleRenderValue = React.useCallback(function (tags) {
|
|
1557
|
-
return tags.map(function (tag) { return (React.createElement(material.Chip, { className: 'MuiAutocomplete-tag', key: tag, label: tag, size: 'small', disabled: readOnly || disabled, onDelete: readOnly || disabled ? undefined : function () { return removeTag(tag); } })); });
|
|
1558
|
-
}, [disabled, readOnly, removeTag]);
|
|
1561
|
+
return tags.map(function (tag) { return (React.createElement(material.Chip, { className: 'MuiAutocomplete-tag', key: tag, label: tag, size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, disabled: readOnly || disabled, onDelete: readOnly || disabled ? undefined : function () { return removeTag(tag); } })); });
|
|
1562
|
+
}, [disabled, readOnly, removeTag, size, variant]);
|
|
1559
1563
|
/********************************************************************************************************************
|
|
1560
1564
|
* Render
|
|
1561
1565
|
* ******************************************************************************************************************/
|
|
1562
1566
|
var handleRenderInput = React.useCallback(function (params) {
|
|
1567
|
+
var _a, _b;
|
|
1563
1568
|
var htmlInputProps = __assign(__assign({}, params.inputProps), { className: classNames('FormTag-Input', readOnly && 'Mui-disabled'), readOnly: readOnly, tabIndex: readOnly ? -1 : undefined, maxLength: maxLength });
|
|
1564
1569
|
delete htmlInputProps.onChange;
|
|
1565
1570
|
delete htmlInputProps.value;
|
|
1566
|
-
var renderProps = __assign({ name: name, clear: clear, className: classNames(className, 'FormValueItem', 'FormTag'), error: error, disabled: disabled, fullWidth: fullWidth, required: required, exceptValue: exceptValue, slotProps: __assign(__assign({}, slotProps), { inputLabel: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel), { htmlFor: params.InputLabelProps.htmlFor, id: params.InputLabelProps.id }), input: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input), {
|
|
1571
|
+
var renderProps = __assign({ name: name, clear: clear, className: classNames(className, 'FormValueItem', 'FormTag'), error: error, disabled: disabled, fullWidth: fullWidth, required: required, exceptValue: exceptValue, slotProps: __assign(__assign({}, slotProps), { inputLabel: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel), { htmlFor: params.InputLabelProps.htmlFor, id: params.InputLabelProps.id }), input: __assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input), { style: __assign(__assign({}, (_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.input) === null || _a === void 0 ? void 0 : _a.style), (variant === 'outlined' && size === 'small'
|
|
1572
|
+
? { paddingTop: 7, paddingBottom: 6, marginTop: -2 }
|
|
1573
|
+
: undefined)), className: params.InputProps.className, ref: params.InputProps.ref, startAdornment: params.InputProps.startAdornment }), htmlInput: __assign(__assign(__assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.htmlInput), htmlInputProps), { style: __assign(__assign(__assign({}, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.htmlInput) === null || _b === void 0 ? void 0 : _b.style), htmlInputProps.style), (variant === 'outlined' && size === 'small' ? { marginTop: 4, paddingBottom: 2 } : undefined)) }) }), helperText: error ? errorHelperText : helperText, onAppendTag: appendTag }, props);
|
|
1567
1574
|
return React.createElement(FormTagText, __assign({ ref: handleRef }, renderProps));
|
|
1568
1575
|
}, [
|
|
1569
1576
|
appendTag,
|
|
@@ -1581,9 +1588,11 @@ var FormTag = React.forwardRef(function (_a, ref) {
|
|
|
1581
1588
|
props,
|
|
1582
1589
|
readOnly,
|
|
1583
1590
|
required,
|
|
1591
|
+
size,
|
|
1584
1592
|
slotProps,
|
|
1593
|
+
variant,
|
|
1585
1594
|
]);
|
|
1586
|
-
return (React.createElement(FormContextProvider, { value: __assign(__assign({}, otherFormState), { fullWidth: formFullWidth, onAddValueItem: handleAddValueItem, onValueChange: function () { }, onValueChangeByUser: function () { }, onRequestSearchSubmit: function () { } }) },
|
|
1595
|
+
return (React.createElement(FormContextProvider, { value: __assign(__assign({}, otherFormState), { variant: formVariant, size: formSize, fullWidth: formFullWidth, onAddValueItem: handleAddValueItem, onValueChange: function () { }, onValueChangeByUser: function () { }, onRequestSearchSubmit: function () { } }) },
|
|
1587
1596
|
React.createElement(material.Autocomplete, { options: [], multiple: true, freeSolo: true, value: value, readOnly: readOnly, disableClearable: true, limitTags: limitTags, getLimitTagsText: getLimitTagsText, disabled: disabled, renderValue: handleRenderValue, style: { display: fullWidth ? 'block' : 'inline-block', width: fullWidth ? '100%' : undefined }, renderInput: handleRenderInput })));
|
|
1588
1597
|
});
|
|
1589
1598
|
FormTag.displayName = 'FormTag';var FormEmail = React.forwardRef(function (_a, ref) {
|
|
@@ -4483,25 +4492,6 @@ FormTextEditor.displayName = 'FormTextEditor';var FormAutocomplete = ToForwardRe
|
|
|
4483
4492
|
/********************************************************************************************************************
|
|
4484
4493
|
* Render
|
|
4485
4494
|
* ******************************************************************************************************************/
|
|
4486
|
-
// const realComponentValue = useMemo(() => {
|
|
4487
|
-
// let newRealValue = componentValue;
|
|
4488
|
-
// if (items && value != null) {
|
|
4489
|
-
// if (Array.isArray(newRealValue)) {
|
|
4490
|
-
// const stringRealValues = newRealValue.map((v) => v.toString());
|
|
4491
|
-
// if (multiple) {
|
|
4492
|
-
// const foundItems = items.filter((v) => stringRealValues.includes(v.value.toString()));
|
|
4493
|
-
// newRealValue = foundItems.map((v) => v.value) as any;
|
|
4494
|
-
// }
|
|
4495
|
-
// } else if (newRealValue != null) {
|
|
4496
|
-
// const stringRealValue = newRealValue.toString();
|
|
4497
|
-
// const foundItem = items.find((v) => v.value.toString() === stringRealValue);
|
|
4498
|
-
// if (foundItem) {
|
|
4499
|
-
// newRealValue = foundItem.value as any;
|
|
4500
|
-
// }
|
|
4501
|
-
// }
|
|
4502
|
-
// }
|
|
4503
|
-
// return newRealValue;
|
|
4504
|
-
// }, [componentValue, items, multiple, value]);
|
|
4505
4495
|
return (React.createElement(material.Autocomplete, { options: items || [], className: classNames(className, 'FormValueItem', 'FormAutocomplete'), sx: sx, multiple: multiple, fullWidth: !width && fullWidth, openOnFocus: openOnFocus, disableClearable: disableClearable, disablePortal: disablePortal, noOptionsText: noOptionsText, value: componentValue, style: style, isOptionEqualToValue: function (option, value) { return option.value === value.value; }, getOptionDisabled: handleGetOptionDisabled, disabled: disabled, readOnly: readOnly, loading: loading || isOnGetItemLoading, loadingText: loadingText, limitTags: limitTags, getLimitTagsText: getLimitTagsText, onChange: function (e, value, reason, details) { return handleChange(value, reason, details); }, renderOption: function (props, option) { return (React.createElement("li", __assign({}, props, { key: "".concat(option.value) }), onRenderItem ? onRenderItem(option) : option.label)); }, onInputChange: function (event, newInputValue, reason) {
|
|
4506
4496
|
if (reason === 'input') {
|
|
4507
4497
|
setInputValue(newInputValue);
|
|
@@ -4511,17 +4501,22 @@ FormTextEditor.displayName = 'FormTextEditor';var FormAutocomplete = ToForwardRe
|
|
|
4511
4501
|
}
|
|
4512
4502
|
}, renderValue: function (value, getItemProps) {
|
|
4513
4503
|
if (Array.isArray(value)) {
|
|
4514
|
-
return value.map(function (option, index) { return (React.createElement(material.Chip, __assign({ size: 'small', label: onRenderTag ? onRenderTag(option) : option.label }, getItemProps({ index: index })))); });
|
|
4504
|
+
return value.map(function (option, index) { return (React.createElement(material.Chip, __assign({ size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, label: onRenderTag ? onRenderTag(option) : option.label }, getItemProps({ index: index })))); });
|
|
4515
4505
|
}
|
|
4516
4506
|
else {
|
|
4517
|
-
return (React.createElement(material.Chip, __assign({ size: 'small', label: onRenderTag ? onRenderTag(value) : value.label }, getItemProps({ index: 0 }))));
|
|
4507
|
+
return (React.createElement(material.Chip, __assign({ size: 'small', style: variant === 'outlined' && size === 'small' ? { marginTop: 2, marginBottom: 0 } : undefined, label: onRenderTag ? onRenderTag(value) : value.label }, getItemProps({ index: 0 }))));
|
|
4518
4508
|
}
|
|
4519
4509
|
}, renderInput: function (params) {
|
|
4510
|
+
var _a;
|
|
4520
4511
|
var slotProps = {
|
|
4521
|
-
input: __assign(__assign({}, params.InputProps), {
|
|
4512
|
+
input: __assign(__assign({}, params.InputProps), { style: {
|
|
4513
|
+
paddingTop: variant === 'outlined' && size === 'small' ? 7 : undefined,
|
|
4514
|
+
paddingBottom: variant === 'outlined' && size === 'small' ? 5 : undefined,
|
|
4515
|
+
marginTop: variant === 'outlined' && size === 'small' ? -1 : undefined,
|
|
4516
|
+
}, endAdornment: (React.createElement(React.Fragment, null,
|
|
4522
4517
|
loading || isOnGetItemLoading ? React.createElement(material.CircularProgress, { color: 'inherit', size: 20 }) : null,
|
|
4523
4518
|
params.InputProps.endAdornment)) }),
|
|
4524
|
-
htmlInput: __assign(__assign({}, params.inputProps), { tabIndex: readOnly || disabled ? -1 : undefined }),
|
|
4519
|
+
htmlInput: __assign(__assign({}, params.inputProps), { style: __assign(__assign({}, (_a = params.inputProps) === null || _a === void 0 ? void 0 : _a.style), (variant === 'outlined' && size === 'small' ? { marginTop: 1 } : undefined)), tabIndex: readOnly || disabled ? -1 : undefined }),
|
|
4525
4520
|
};
|
|
4526
4521
|
return (React.createElement(FormTextField, __assign({}, params, { ref: textFieldRef, name: name, variant: variant, size: size, color: color, labelIcon: labelIcon, label: label, labelShrink: labelShrink, required: required, focused: focused, error: error, readOnly: readOnly, helperText: error ? errorHelperText : helperText, slotProps: slotProps, placeholder: placeholder, noFormValueItem: true })));
|
|
4527
4522
|
} }));
|