@topconsultnpm/sdkui-react 6.21.0-dev3.31 → 6.21.0-dev3.32
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.
|
@@ -15,6 +15,8 @@ import { TMNothingToShow } from "../features/documents/TMDcmtPreview";
|
|
|
15
15
|
import TMAccordion from "../base/TMAccordion";
|
|
16
16
|
import TabPanel, { Item } from 'devextreme-react/tab-panel';
|
|
17
17
|
import { TMExceptionBoxManager } from "../base/TMPopUp";
|
|
18
|
+
// Costante per la minWidth degli elementi - garantisce coerenza tra layout orizzontale e verticale
|
|
19
|
+
const ITEM_MIN_WIDTH = 200;
|
|
18
20
|
export var ShowCheckBoxesMode;
|
|
19
21
|
(function (ShowCheckBoxesMode) {
|
|
20
22
|
ShowCheckBoxesMode[ShowCheckBoxesMode["Never"] = 0] = "Never";
|
|
@@ -616,7 +618,7 @@ const TMMetadataValues = ({ showCheckBoxes = ShowCheckBoxesMode.Never, checkPerm
|
|
|
616
618
|
}
|
|
617
619
|
// Orizzontale con bordo, children e titolo
|
|
618
620
|
if (!groupIsNoBorder && isHorizontal && children.length > 0 && groupTitle.length > 0) {
|
|
619
|
-
return (_jsxs("div", { style:
|
|
621
|
+
return (_jsxs("div", { style: { position: 'relative', border: '2px solid #CAD9EB', borderRadius: '3px', padding: '12px 6px 6px', margin: '10px' }, children: [groupTitleElement, _jsx("div", { style: { display: 'flex', flexDirection: 'row', flexWrap: 'nowrap', gap: '8px', overflowX: 'auto', overflowY: 'hidden', paddingBottom: '8px' }, children: children.map(child => (_jsx("div", { style: { flex: `1 1 ${ITEM_MIN_WIDTH}px`, minWidth: `${ITEM_MIN_WIDTH}px` }, children: renderLayoutItem(child, nextDepth, visited) }, child.layoutItemID))) })] }, `group-horizontal-${layoutItem.layoutItemID}`));
|
|
620
622
|
}
|
|
621
623
|
// Verticale senza bordo
|
|
622
624
|
if (groupIsNoBorder && isVertical) {
|
|
@@ -633,8 +635,14 @@ const TMMetadataValues = ({ showCheckBoxes = ShowCheckBoxesMode.Never, checkPerm
|
|
|
633
635
|
}
|
|
634
636
|
// Orizzontale
|
|
635
637
|
if (isHorizontal) {
|
|
636
|
-
const renderHorizontalChildren = () => children.map(child => (_jsx("div", { style: { flex:
|
|
637
|
-
|
|
638
|
+
const renderHorizontalChildren = () => (_jsx("div", { style: { display: 'flex', flexDirection: 'row', flexWrap: 'nowrap', gap: '8px', overflowX: 'auto', overflowY: 'hidden', paddingBottom: '8px' }, children: children.map(child => (_jsx("div", { style: { flex: `1 1 ${ITEM_MIN_WIDTH}px`, minWidth: `${ITEM_MIN_WIDTH}px` }, children: renderLayoutItem(child, nextDepth, visited) }, child.layoutItemID))) }));
|
|
639
|
+
if (groupDescriptor.borderStyle === LayoutGroupBorderStyles.GroupBox || groupDescriptor.borderStyle === LayoutGroupBorderStyles.Tabbed) {
|
|
640
|
+
return (_jsx(TMAccordion, { title: groupTitle, titleSize: "Small", children: renderHorizontalChildren() }, `group-horizontal-${layoutItem.layoutItemID}`));
|
|
641
|
+
}
|
|
642
|
+
if (groupDescriptor.borderStyle === LayoutGroupBorderStyles.Group) {
|
|
643
|
+
return (_jsxs("div", { style: { position: 'relative', border: '2px solid #CAD9EB', borderRadius: '3px', padding: '12px 6px 6px', margin: '10px' }, children: [groupTitleElement, renderHorizontalChildren()] }, `group-horizontal-${layoutItem.layoutItemID}`));
|
|
644
|
+
}
|
|
645
|
+
return (_jsx("div", { children: renderHorizontalChildren() }, `group-horizontal-${layoutItem.layoutItemID}`));
|
|
638
646
|
}
|
|
639
647
|
// Fallback: gruppo con accordion e indentazione
|
|
640
648
|
const indentationPx = depth > 0 ? depth * 10 : 0;
|
|
@@ -717,6 +725,7 @@ const StyledRow = styled.div `
|
|
|
717
725
|
display: flex;
|
|
718
726
|
flex-direction: row;
|
|
719
727
|
width: 100%;
|
|
728
|
+
min-width: ${ITEM_MIN_WIDTH}px;
|
|
720
729
|
gap: 5px;
|
|
721
730
|
`;
|
|
722
731
|
const StyledSeparator = styled.hr `
|