@topconsultnpm/sdkui-react-beta 6.11.61 → 6.11.62
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.
|
@@ -258,14 +258,14 @@ const RapidAccessItem = ({ rapidAccess, isMobile = false, onRemove, onSelect, on
|
|
|
258
258
|
handleClose();
|
|
259
259
|
};
|
|
260
260
|
return (_jsxs(Container, { children: [_jsxs(ItemWrapper, { children: [_jsxs(ItemProfileWrapper, { style: { zIndex: 100 - index }, onDoubleClick: () => onSelect(rapidAccess.id), children: [_jsx(PreferredIconContainer, { onClick: () => onDefault(rapidAccess.id), children: _jsx(TMTooltip, { content: SDKUI_Localizator.Default, children: rapidAccess.preferred ? _jsx(IconStarSolid, { color: TMColors.tertiary, fontSize: 20 }) : _jsx(IconStarOutline, { fontSize: 20 }) }) }), _jsx(ProfileCircle, { "$color": rapidAccess.color ?? TMColors.primary, onClick: () => setIsMenuOpen(true), children: iconMap[rapidAccess.icon] ?? _jsx(IconUser, { fontSize: 20 }) }), _jsxs("p", { children: [" ", truncateText(rapidAccess.name, 50)] })] }), _jsxs(ItemOperationsWrapper, { children: [_jsx(ExpandButton, { onClick: () => setIsExpanded(!isExpanded), children: isExpanded ? _jsx(IconCollapse, { fontSize: 16 }) : _jsx(IconExpand, { fontSize: 16 }) }), _jsx(TMButton, { color: 'primary', caption: SDKUI_Localizator.Select, showTooltip: false, onClick: () => onSelect(rapidAccess.id) }), _jsx(TMButton, { color: 'tertiary', caption: SDKUI_Localizator.Remove, showTooltip: false, onClick: onRemovePopup })] }), _jsx(Menu, { x: isMobile ? 0 : 80, y: isMobile ? -40 : 0, onClose: () => handleClose(), visible: isMenuOpen, children: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [_jsxs(StyledMenuItemContainer, { style: { flexWrap: 'wrap' }, children: [colors.map((color, index) => (_jsx(ColorWrapper, { onClick: () => onColorPick(color), children: _jsx(ColorPicker, { "$color": color }) }, index * 2))), _jsx(ColorWrapper, { onClick: () => setShowIconMenu(!showIconMenu), children: icons.find(icon => icon[0] === rapidAccess.icon)?.[1] ?? _jsx(IconUser, {}) })] }), showIconMenu && _jsx(StyledMenuItemContainer, { style: { flexWrap: 'wrap' }, children: icons.map(([key, icon]) => (_jsx(ColorWrapper, { onClick: () => onIconPick(key), children: _jsx(ColorPicker, { "$color": "white", children: icon }) }, key))) })] }) })] }), isExpanded &&
|
|
261
|
-
_jsxs(ExpandedAria, { children: [_jsxs(InputContainer, { children: [_jsx(TextBox, { value: name, onValueChanged: (value) => setName(value), type: 'text', label: SDKUI_Localizator.NameForAccess, additionalIcons: additionalSaveBtn }), _jsx(TextBox, { value: rapidAccess.endpoint?.Description, type: 'text', label: SDKUI_Localizator.Endpoint, disabled: true })] }), _jsxs(InputContainer, { children: [_jsx(TextBox, { value: rapidAccess.archive?.description, type: 'text', label: SDKUI_Localizator.ArchiveID, disabled: true }), _jsx(TextBox, { value: rapidAccess.authenticationMode, type: 'text', label: SDKUI_Localizator.AuthMode, disabled: true })] }), _jsxs(InputContainer, { children: [_jsx(TextBox, { value: rapidAccess.username, type: 'text', label: SDKUI_Localizator.UserName, disabled: true }), _jsx(TextBox, { value: cultureIDsDataSource.find(cid => cid.value === rapidAccess.language)?.display, type: 'text', label: SDKUI_Localizator.CultureID, disabled: true })] }), hasAuthDomain && _jsxs(InputContainer, { children: [_jsx(TextBox, { value: domainValue, type: 'text', label: SDKUI_Localizator.Domain, disabled: true }), rapidAccess.authenticationMode === AuthenticationModes.TopMediaOnBehalfOf &&
|
|
261
|
+
_jsxs(ExpandedAria, { children: [_jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: name, onValueChanged: (value) => setName(value), type: 'text', label: SDKUI_Localizator.NameForAccess, additionalIcons: additionalSaveBtn }), _jsx(TextBox, { value: rapidAccess.endpoint?.Description, type: 'text', label: SDKUI_Localizator.Endpoint, disabled: true })] }), _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: rapidAccess.archive?.description, type: 'text', label: SDKUI_Localizator.ArchiveID, disabled: true }), _jsx(TextBox, { value: rapidAccess.authenticationMode, type: 'text', label: SDKUI_Localizator.AuthMode, disabled: true })] }), _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: rapidAccess.username, type: 'text', label: SDKUI_Localizator.UserName, disabled: true }), _jsx(TextBox, { value: cultureIDsDataSource.find(cid => cid.value === rapidAccess.language)?.display, type: 'text', label: SDKUI_Localizator.CultureID, disabled: true })] }), hasAuthDomain && _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: domainValue, type: 'text', label: SDKUI_Localizator.Domain, disabled: true }), rapidAccess.authenticationMode === AuthenticationModes.TopMediaOnBehalfOf &&
|
|
262
262
|
_jsx(TextBox, { value: rapidAccess.onBehalfUsername, type: 'text', label: SDKUI_Localizator.UserName + ' ' + `(${SDKUI_Localizator.OnBehalfOf})`, disabled: true })] })] })] }));
|
|
263
263
|
};
|
|
264
264
|
const ColorWrapper = styled.div ` cursor: pointer; width: 30px; height: 30px; background-color: white; border-radius: 30px; display: flex; align-items: center; justify-content: center; `;
|
|
265
265
|
const ColorPicker = styled.div ` width: 25px; height: 25px; border-radius: 25px; background-color: ${props => props.$color} ; display:flex; align-items:center; justify-content:center; `;
|
|
266
266
|
const ExpandButton = styled.div ` cursor: pointer; display: flex; align-items: center; justify-content: center; `;
|
|
267
267
|
const ExpandedAria = styled.div ` width: 100%; padding: 10px 0; display: flex; flex-direction: column; gap: 10px; `;
|
|
268
|
-
const InputContainer = styled.div ` width: 100%; display: flex; align-items: center; gap: 10px; `;
|
|
268
|
+
const InputContainer = styled.div ` width: 100%; display: flex; flex-direction:${props => props.$isMobile ? 'column' : 'row'} ; align-items: center; gap: 10px; `;
|
|
269
269
|
const List = styled.div ` width: 100%; display: flex; flex-direction: column; max-height: calc(100%); overflow: visible; `;
|
|
270
270
|
const ItemWrapper = styled.div ` width: 100%; display: flex; align-items: center; justify-content: space-between; position:relative; `;
|
|
271
271
|
const ItemProfileWrapper = styled.div ` display: flex; align-items: center; gap: 5px; padding: 10px 0; `;
|