@topconsultnpm/sdkui-react-beta 6.7.110 → 6.7.112

package/lib/components/choosers/TMUserChooser.js

@@ -21,7 +21,7 @@ const TMUserChooser = ({ labelColor, readOnly = false, icon, dataSource, backgro
                 ? _jsx("p", { children: placeHolder })
                 : _jsxs(_Fragment, { children: [_jsx(TMUserIdViewer, { userId: values?.[0], showIcon: true }), values && values.length > 1 && _jsx("p", { style: { marginLeft: '10px' }, children: `(+${values.length - 1} ${values.length == 2 ? 'altro' : 'altri'})` })] }) }));
     };
-    return (_jsxs(_Fragment, { children: [_jsx(TMSummary, { disabled: disabled, labelColor: labelColor, icon: icon, backgroundColor: backgroundColor, buttons: buttons, showBorder: showBorder, hasValue: values && values.length > 0, showClearButton: showClearButton, iconEditButton: _jsx(IconSearch, { fontSize: 16 }), onEditorClick: () => !readOnly && setShowChooser(true), elementStyle: elementStyle, isModifiedWhen: isModifiedWhen, label: label, template: renderTemplate(), onClearClick: showClearButton ? () => { onValueChanged?.([]); } : undefined, validationItems: validationItems }), showChooser &&
+    return (_jsxs(_Fragment, { children: [_jsx(TMSummary, { disabled: disabled, readOnly: readOnly, labelColor: labelColor, icon: icon, backgroundColor: backgroundColor, buttons: buttons, showBorder: showBorder, hasValue: values && values.length > 0, showClearButton: showClearButton, iconEditButton: _jsx(IconSearch, { fontSize: 16 }), onEditorClick: () => !readOnly && setShowChooser(true), elementStyle: elementStyle, isModifiedWhen: isModifiedWhen, label: label, template: renderTemplate(), onClearClick: showClearButton ? () => { onValueChanged?.([]); } : undefined, validationItems: validationItems }), showChooser &&
                 _jsx(TMUserChooserForm, { allowMultipleSelection: allowMultipleSelection, dataSource: dataSource, selectedIDs: values, onClose: () => setShowChooser(false), onChoose: (IDs) => { onValueChanged?.(IDs); } })] }));
 };
 export default TMUserChooser;

package/lib/components/editors/TMDateBox.js

@@ -15,6 +15,7 @@ const TMDateBox = (props) => {
             let inputContainer = htmlElement.getElementsByClassName("dx-texteditor-input-container")[0];
             if (inputContainer) {
                 inputContainer.style.background = 'linear-gradient(white 20%, #d6d6d6 80%)';
+                inputContainer.style.color = '#525252';
             }
         }
         let label = htmlElement.getElementsByClassName("dx-label")[0];

package/lib/components/editors/TMEditorStyled.js

@@ -26,7 +26,7 @@ border-bottom-color: ${props => (props.$vil.length === 0) ? !props.$isModified ?
 color: ${props => props.readOnly ? '#525252' : !props.$disabled ? (props.$vil.length === 0) ? !props.$isModified ? 'black' : TMColors.isModified : editorColorManager(props.$vil) : TMColors.disabled};
 border-radius: ${props => props.$borderRadius ?? TMEditorsDefaultBorderRadius};
 min-width: ${props => props.$isMobile && '70px'};
-background: ${props => props.readOnly ? 'linear-gradient(white 20%, #d6d6d6 80%)' : 'transparent'};
+background: ${props => props.readOnly ? 'linear-gradient(white 20%, #d6d6d6 80%)' : 'white'};
 &:focus{
     outline: none;
     background-image: linear-gradient(white, #E4E9F7);

package/lib/components/editors/TMMetadataEditor.js

@@ -36,21 +36,21 @@ const TMMetadataEditor = ({ isLexProt, layoutMode, isModifiedWhen = false, tid,
     if (value?.startsWith("{@QueryParam") || value == "{@UserName}" || value == "{@UserID}")
         return _jsx(TMTextBox, { isModifiedWhen: isModifiedWhenInternal(), readOnly: isReadOnlyResult, label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, elementStyle: { width: '100%' }, type: 'text', maxLength: md?.length, autoFocus: autoFocus, value: value || '', onValueChanged: (e) => onValueChange?.(e.target.value), onBlur: (newValue) => onValueChanged?.(newValue) });
     if (md?.dataDomain == MetadataDataDomains.DynamicDataList)
-        return _jsx(TMDynDataListItemChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, md: md, tid: tid, buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, queryParamsDynDataList: queryParamsDynDataList, onCascadeRefreshDynDataLists: onCascadeRefreshDynDataLists, elementStyle: { width: '100%' }, backgroundColor: isReadOnlyResult ? 'linear-gradient(white 20%, #d6d6d6 80%)' : TMColors.default_background, allowMultipleSelection: allowMultipleSelection, values: value ? [value] : [], showClearButton: !isReadOnlyResult, onValueChanged: (IDs) => {
+        return _jsx(TMDynDataListItemChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, md: md, tid: tid, buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, queryParamsDynDataList: queryParamsDynDataList, onCascadeRefreshDynDataLists: onCascadeRefreshDynDataLists, elementStyle: { width: '100%' }, backgroundColor: TMColors.default_background, allowMultipleSelection: allowMultipleSelection, values: value ? [value] : [], showClearButton: !isReadOnlyResult, onValueChanged: (IDs) => {
                 if (!IDs || IDs.length <= 0)
                     onValueChanged?.(undefined);
                 else
                     onValueChanged?.(IDs[0]);
             } });
     if (md?.dataDomain == MetadataDataDomains.DataList)
-        return _jsx(TMDataListItemChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, elementStyle: { width: '100%' }, backgroundColor: isReadOnlyResult ? 'linear-gradient(white 20%, #d6d6d6 80%)' : TMColors.default_background, dataListId: md.dataListID, allowMultipleSelection: allowMultipleSelection, values: value?.split(',').map((item) => !item.startsWith("'") ? item : item.slice(1, -1)) ?? [], showClearButton: !isReadOnlyResult, buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, onValueChanged: (IDs) => {
+        return _jsx(TMDataListItemChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, elementStyle: { width: '100%' }, backgroundColor: TMColors.default_background, dataListId: md.dataListID, allowMultipleSelection: allowMultipleSelection, values: value?.split(',').map((item) => !item.startsWith("'") ? item : item.slice(1, -1)) ?? [], showClearButton: !isReadOnlyResult, buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, onValueChanged: (IDs) => {
                 if (!IDs || IDs.length <= 0)
                     onValueChanged?.(undefined);
                 else
                     onValueChanged?.(IDs.join(","));
             } });
     if (md?.dataDomain == MetadataDataDomains.UserID)
-        return _jsx(TMUserChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, elementStyle: { width: '100%' }, backgroundColor: isReadOnlyResult ? 'linear-gradient(white 20%, #d6d6d6 80%)' : TMColors.default_background, placeHolder: " ", showClearButton: !isReadOnlyResult, allowMultipleSelection: allowMultipleSelection, values: value?.split(',').map((item) => !item.startsWith("'") ? Number(item) : Number(item.slice(1, -1))) ?? [], buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, onValueChanged: (IDs) => {
+        return _jsx(TMUserChooser, { readOnly: isReadOnlyResult, isModifiedWhen: isModifiedWhenInternal(), label: showLabelTop ? md?.nameLoc : undefined, icon: showLabelTop ? _jsx(TMMetadataIcon, { md: md, tid: tid }) : undefined, validationItems: validationItems, disabled: disabled, elementStyle: { width: '100%' }, backgroundColor: TMColors.default_background, placeHolder: " ", showClearButton: !isReadOnlyResult, allowMultipleSelection: allowMultipleSelection, values: value?.split(',').map((item) => !item.startsWith("'") ? Number(item) : Number(item.slice(1, -1))) ?? [], buttons: !isReadOnlyResult ? [btnDistincValues] : undefined, onValueChanged: (IDs) => {
                 if (!IDs || IDs.length <= 0)
                     onValueChanged?.(undefined);
                 else

package/lib/components/editors/TMSummary.js

@@ -11,11 +11,11 @@ const StyledSummaryTemplateInput = styled.div `
     height: ${props => props.$height};
     padding: ${props => !props.$showBorder ? '0px 5px' : '4px 5px 4px 13px'};
     border: ${props => !props.$showBorder ? '' : '1px solid'};
-    background: ${props => props.$backgroundColor};
+    background: ${props => props.$readOnly ? 'linear-gradient(white 20%, #d6d6d6 80%)' : props.$backgroundColor};
     border-color: ${props => props.$isModified ? TMColors.isModified : TMColors.border_normal};
     border-bottom: ${props => !props.$showBorder ? '' : (props.$vil.length > 0) ? '3px solid' : '1px solid'} ;
     border-bottom-color: ${props => (props.$vil.length === 0) ? !props.$isModified ? TMColors.border_normal : TMColors.isModified : editorColorManager(props.$vil)};
-    color: ${props => !props.$disabled ? (props.$vil.length === 0) ? !props.$isModified ? 'black' : TMColors.isModified : editorColorManager(props.$vil) : TMColors.disabled};
+    color: ${props => props.$readOnly ? '#525252' : !props.$disabled ? (props.$vil.length === 0) ? !props.$isModified ? 'black' : TMColors.isModified : editorColorManager(props.$vil) : TMColors.disabled};
     border-radius: ${props => !props.$showBorder ? props.$borderRadius : TMEditorsDefaultBorderRadius};
     display: flex;
     align-items: center;
@@ -46,9 +46,9 @@ const StyledEditorButtonIcon2 = styled.div `
         border-bottom-color: ${TMColors.primary};
      }
 `;
-const TMSummary = ({ labelColor, hasValue, borderRadius = '4px', validationItems = [], buttons = [], label = '', onClearClick, openEditorOnSummaryClick, onEditorClick, backgroundColor = 'transparent', showBorder = true, isModifiedWhen, elementStyle, width = '100%', height = '100%', fontSize = FontSize.defaultFontSize, icon, showEditButton = true, showClearButton, iconEditButton, iconeEditTooltip, labelPosition = 'left', template, disabled = false, onValueChanged }) => {
+const TMSummary = ({ readOnly, labelColor, hasValue, borderRadius = '4px', validationItems = [], buttons = [], label = '', onClearClick, openEditorOnSummaryClick, onEditorClick, backgroundColor = 'transparent', showBorder = true, isModifiedWhen, elementStyle, width = '100%', height = '100%', fontSize = FontSize.defaultFontSize, icon, showEditButton = true, showClearButton, iconEditButton, iconeEditTooltip, labelPosition = 'left', template, disabled = false, onValueChanged }) => {
     const renderTemplateField = () => {
-        return (_jsx(StyledSummaryTemplateInput, { tabIndex: 0, "$backgroundColor": backgroundColor, "$borderRadius": borderRadius, "$isModified": isModifiedWhen, "$vil": validationItems, "$disabled": disabled, "$showBorder": showBorder, "$fontSize": fontSize, "$width": width, "$height": height, onChange: onValueChanged, children: _jsxs("div", { onClick: () => { if (openEditorOnSummaryClick && !disabled)
+        return (_jsx(StyledSummaryTemplateInput, { "$readOnly": readOnly, tabIndex: 0, "$backgroundColor": backgroundColor, "$borderRadius": borderRadius, "$isModified": isModifiedWhen, "$vil": validationItems, "$disabled": disabled, "$showBorder": showBorder, "$fontSize": fontSize, "$width": width, "$height": height, onChange: onValueChanged, children: _jsxs("div", { onClick: () => { if (openEditorOnSummaryClick && !disabled)
                     onEditorClick?.(); }, onDoubleClick: () => { if (!openEditorOnSummaryClick && !disabled)
                     onEditorClick?.(); }, style: { display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%', minHeight: '16px', cursor: openEditorOnSummaryClick ? 'pointer' : 'default' }, children: [template, _jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', pointerEvents: disabled ? 'none' : 'auto', opacity: disabled ? 0.4 : 1 }, children: [showClearButton && hasValue && _jsx(StyledEditorButtonIcon2, { tabIndex: disabled ? -1 : 0, onKeyDown: (e) => e.code === 'Space' && onClearClick?.(), onClick: onClearClick, children: _jsx(TMTooltip, { content: SDKUI_Localizator.Clear, children: _jsx(IconClearButton, {}) }) }), !openEditorOnSummaryClick && showEditButton && _jsx(StyledEditorButtonIcon2, { tabIndex: disabled ? -1 : 0, onKeyDown: (e) => e.code === 'Space' && onEditorClick?.(), onClick: onEditorClick, children: _jsx(TMTooltip, { content: iconeEditTooltip ?? SDKUI_Localizator.Update, children: iconEditButton ?? _jsx(IconPencil, {}) }) }), buttons.map((buttonItem) => {
                                 return (_jsx(StyledEditorButtonIcon2, { onClick: buttonItem.onClick, children: _jsx(TMTooltip, { content: buttonItem.text, children: buttonItem.icon }) }, buttonItem.text));

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react-beta",
-    "version": "6.7.110",
+    "version": "6.7.112",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",