@topconsultnpm/sdkui-react-beta 6.8.68 → 6.8.69

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.
@@ -6,7 +6,6 @@ import styled from 'styled-components';
6
6
  import { SDK_Globals, AuthenticationModes } from '@topconsultnpm/sdk-ts-beta';
7
7
  import { FontSize, TMColors } from '../../utils/theme';
8
8
  import { ButtonNames, TMMessageBoxManager } from '../base/TMPopUp';
9
- import Logo from '../../assets/Toppy-generico.png';
10
9
  import { DeviceType, useDeviceType } from '../base/TMDeviceProvider';
11
10
  import { TMAboutApp } from './TMAboutApp';
12
11
  export var TMSearchContext;
@@ -24,11 +23,6 @@ const StyledMenuItem = styled.p ` font-size: ${props => props.$fontSize}; displa
24
23
  const StyledHeaderIcon = styled.div ` width: 50px; height: 50px; margin-left: 10px; display: flex; align-items: center; justify-content: center; color: ${props => props.$isSelected ? '#135596' : '#ffffff'}; transition: color ease 100ms; background-color: ${props => props.$isSelected && '#ffffff'}; cursor: pointer; &:hover { color: #ffffff; background-color: #0d3862; transition: color ease 100ms; } `;
25
24
  const StyledSearchBarContainer = styled.div ` position: relative; height:30px; width: 100%; max-width: ${props => props.$isMobile ? '65%' : '650px'}; margin-left: ${props => props.$isMobile ? '10px' : '50px'}; `;
26
25
  const StyledSearchBar = styled.input ` background: #FFFFFF 0% 0% no-repeat padding-box; border: 1px solid #dbdbdb; border-radius: 5px; padding: 5px 30px; width:100%; transition: 100ms linear; &:focus{ outline: none; border-bottom: 2px solid ${TMColors.primary}; } `;
27
- const StyledChatBotWrapper = styled.div ` `;
28
- const StyledChatBotcloseButton = styled.div ` cursor: pointer; font-size: 16px; color: white; width: 299px; height: 20px; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; padding: 5px; background-color: orange; `;
29
- const StyledChaBotBtnWrapper = styled.div ` position: relative; cursor: pointer; display: flex; flex-direction: row; padding: 0 10px; width: 150px; height: 30px; border-radius: 10px; justify-content: flex-end; background-color: orange;align-items: center; gap: 5px; `;
30
- const StyledChatBotToppyContainer = styled.div ` background-color: orange; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50px; position: absolute; left: -10px; `;
31
- const StyledToppyImage = styled.div ` display: flex; align-items: center; justify-content: center; width: 25px; height: 25px; border-radius: 50px; overflow: hidden; background-color: white; `;
32
26
  export const TMSearchBar = ({ searchValue, onSearchValueChanged, maxWidth, marginLeft }) => {
33
27
  const deviceType = useDeviceType();
34
28
  return (_jsxs(StyledSearchBarContainer, { style: { maxWidth: maxWidth ? maxWidth : deviceType === DeviceType.MOBILE ? '65%' : '650px', marginLeft: marginLeft ? marginLeft : deviceType === DeviceType.MOBILE ? '10px' : '50px' }, "$isMobile": deviceType === DeviceType.MOBILE, children: [_jsx(IconSearch, { fontSize: 12, color: '#00000060', style: { position: 'absolute', width: '20px', height: '20px', left: '5px', top: '5px', zIndex: 1 } }), _jsx(StyledSearchBar, { placeholder: SDKUI_Localizator.Search + '...', type: "text", value: searchValue, onChange: (e) => onSearchValueChanged(e.target.value) }), searchValue.length > 0 && _jsx(IconCloseOutline, { onClick: () => onSearchValueChanged(''), color: '#00000060', style: { cursor: 'pointer', position: 'absolute', width: '20px', height: '20px', right: '5px', top: '5px', zIndex: 1 } })] }));
@@ -41,7 +35,6 @@ const TMHeader = ({ showSearchBar = true, clearSearchJobValue, clearSearchQEValu
41
35
  const [searchProcessMonitorValue, setSearchProcessMonitorValue] = useState('');
42
36
  const [searchPlatformValue, setSearchPlatformValue] = useState('');
43
37
  const [searchQEValue, setSearchQEValue] = useState('');
44
- const [isChatbot, setIsChatbot] = useState(false);
45
38
  const menuRef = useRef(null);
46
39
  const userIcon = useRef(null);
47
40
  const deviceType = useDeviceType();
@@ -81,7 +74,6 @@ const TMHeader = ({ showSearchBar = true, clearSearchJobValue, clearSearchQEValu
81
74
  document.addEventListener('click', handleClickOutside);
82
75
  return () => document.removeEventListener('click', handleClickOutside);
83
76
  }, [menuRef, userIcon, menuStatus]);
84
- return (_jsxs(StyledHeaderContainer, { "$appName": SDK_Globals.appModule, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', width: '100%' }, children: [_jsx("div", { style: { width: '50px', height: '50px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, children: _jsx("img", { src: six, height: 30, alt: "" }) }), !isMobile && _jsxs("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-start', justifyContent: 'flex-start', gap: '1px', fontSize: '14px' }, children: [_jsx("div", { style: { userSelect: 'none', color: '#135596' }, children: "TopMedia" }), _jsx("div", { style: { userSelect: 'none', color: '#135596' }, children: SDK_Globals.appModule })] }), showSearchBar && _jsxs(_Fragment, { children: [searchContext === TMSearchContext.JOBS_LIST && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchJobListValue(e), searchValue: searchJobListValue }), searchContext === TMSearchContext.JOBS && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchJobsValue(e), searchValue: searchJobsValue }), searchContext === TMSearchContext.PROCESSES && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchProcessesValue(e), searchValue: searchProcessesValue }), searchContext === TMSearchContext.PROCESS_MONITOR && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchProcessMonitorValue(e), searchValue: searchProcessMonitorValue }), searchContext === TMSearchContext.PLATFORM && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchPlatformValue(e), searchValue: searchPlatformValue }), searchContext === TMSearchContext.QE && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchQEValue(e), searchValue: searchQEValue })] })] }), _jsxs(StyledChatBotWrapper, { children: [isChatbot &&
85
- _jsxs("div", { style: { position: 'fixed', top: '50px', right: isMobile ? '5px' : '100px', zIndex: 1000000000 }, children: [_jsx(StyledChatBotcloseButton, { onClick: () => setIsChatbot(false), children: _jsx(IconCloseOutline, { color: 'white' }) }), _jsx("iframe", { allow: "microphone;", width: "300", height: "400", src: "https://console.dialogflow.com/api-client/demo/embedded/ee1ed045-bbf6-4740-8f2c-314cbc857dd8" })] }), _jsxs(StyledChaBotBtnWrapper, { style: { width: isMobile ? '0' : '150px', backgroundColor: isMobile ? 'transparent' : 'orange' }, onClick: () => setIsChatbot(true), children: [_jsxs(StyledChatBotToppyContainer, { style: { backgroundColor: isMobile ? 'transparent' : 'orange' }, children: [" ", _jsx(StyledToppyImage, { children: _jsx("img", { style: { cursor: 'pointer', transform: 'translateY(3px)' }, src: Logo, width: 20, alt: '', onClick: () => setIsChatbot(true) }) }), " "] }), !isMobile && _jsx("p", { style: { color: 'white', fontWeight: 'bold' }, children: "Chiedimi qualcosa" })] })] }), _jsxs(StyledHeaderIcon, { onClick: () => onSettingsClick?.(), children: [" ", _jsx(IconSettings, { fontSize: 20 }), " "] }), _jsxs(StyledHeaderIcon, { "$isSelected": menuStatus, ref: userIcon, onClick: () => setMenuStatus(!menuStatus), children: [" ", _jsx(IconUserProfile, { fontSize: 20 }), " "] }), menuStatus && _jsxs(StyledMenu, { ref: menuRef, children: [SDK_Globals.tmSession?.SessionDescr?.authenticationMode === AuthenticationModes.TopMedia && _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); onChangePassword && onChangePassword(); }, style: { fontSize: FontSize.defaultFontSize }, children: [" ", _jsx("span", { children: _jsx(IconPassword, {}) }), " ", _jsx("span", { children: SDKUI_Localizator.ChangePassword }), " "] }), _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); onLogout && onLogout(); }, children: [_jsx("span", { children: _jsx(IconLogout, {}) }), " ", _jsx("span", { children: "Logout" }), " "] }), _jsx("div", { style: { width: '100%', height: '1px', backgroundColor: 'gray' } }), _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); TMMessageBoxManager.show({ buttons: [ButtonNames.OK], title: `About. ${SDK_Globals.appModule}`, message: _jsx(TMAboutApp, { app: true, skdui: true, sdk: true, websdk: true }) }); }, style: { fontSize: FontSize.defaultFontSize }, children: [" ", _jsx("span", { children: _jsx(IconBxInfo, {}) }), " ", _jsx("span", { children: "About" }), " "] })] })] }));
77
+ return (_jsxs(StyledHeaderContainer, { "$appName": SDK_Globals.appModule, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', width: '100%' }, children: [_jsx("div", { style: { width: '50px', height: '50px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, children: _jsx("img", { src: six, height: 30, alt: "" }) }), !isMobile && _jsxs("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-start', justifyContent: 'flex-start', gap: '1px', fontSize: '14px' }, children: [_jsx("div", { style: { userSelect: 'none', color: '#135596' }, children: "TopMedia" }), _jsx("div", { style: { userSelect: 'none', color: '#135596' }, children: SDK_Globals.appModule })] }), showSearchBar && _jsxs(_Fragment, { children: [searchContext === TMSearchContext.JOBS_LIST && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchJobListValue(e), searchValue: searchJobListValue }), searchContext === TMSearchContext.JOBS && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchJobsValue(e), searchValue: searchJobsValue }), searchContext === TMSearchContext.PROCESSES && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchProcessesValue(e), searchValue: searchProcessesValue }), searchContext === TMSearchContext.PROCESS_MONITOR && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchProcessMonitorValue(e), searchValue: searchProcessMonitorValue }), searchContext === TMSearchContext.PLATFORM && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchPlatformValue(e), searchValue: searchPlatformValue }), searchContext === TMSearchContext.QE && _jsx(TMSearchBar, { onSearchValueChanged: (e) => setSearchQEValue(e), searchValue: searchQEValue })] })] }), _jsxs(StyledHeaderIcon, { onClick: () => onSettingsClick?.(), children: [" ", _jsx(IconSettings, { fontSize: 20 }), " "] }), _jsxs(StyledHeaderIcon, { "$isSelected": menuStatus, ref: userIcon, onClick: () => setMenuStatus(!menuStatus), children: [" ", _jsx(IconUserProfile, { fontSize: 20 }), " "] }), menuStatus && _jsxs(StyledMenu, { ref: menuRef, children: [SDK_Globals.tmSession?.SessionDescr?.authenticationMode === AuthenticationModes.TopMedia && _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); onChangePassword && onChangePassword(); }, style: { fontSize: FontSize.defaultFontSize }, children: [" ", _jsx("span", { children: _jsx(IconPassword, {}) }), " ", _jsx("span", { children: SDKUI_Localizator.ChangePassword }), " "] }), _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); onLogout && onLogout(); }, children: [_jsx("span", { children: _jsx(IconLogout, {}) }), " ", _jsx("span", { children: "Logout" }), " "] }), _jsx("div", { style: { width: '100%', height: '1px', backgroundColor: 'gray' } }), _jsxs(StyledMenuItem, { "$fontSize": FontSize.defaultFontSize, onClick: () => { setMenuStatus(false); TMMessageBoxManager.show({ buttons: [ButtonNames.OK], title: `About. ${SDK_Globals.appModule}`, message: _jsx(TMAboutApp, { app: true, skdui: true, sdk: true, websdk: true }) }); }, style: { fontSize: FontSize.defaultFontSize }, children: [" ", _jsx("span", { children: _jsx(IconBxInfo, {}) }), " ", _jsx("span", { children: "About" }), " "] })] })] }));
86
78
  };
87
79
  export default TMHeader;
@@ -1,9 +1,9 @@
1
1
  import { DataListViewModes } from '@topconsultnpm/sdk-ts-beta';
2
2
  import { DataGridTypes } from 'devextreme-react/cjs/data-grid';
3
3
  declare const TMDataListItemViewer: ({ dataListId, value, viewMode }: {
4
- dataListId?: number;
5
- value?: string;
6
- viewMode?: DataListViewModes;
4
+ dataListId?: number | undefined;
5
+ value?: string | undefined;
6
+ viewMode?: DataListViewModes | undefined;
7
7
  }) => import("react/jsx-runtime").JSX.Element;
8
8
  export default TMDataListItemViewer;
9
9
  export declare const cellRenderDataListItem: (data: DataGridTypes.ColumnCellTemplateData, dataListId?: number, viewMode?: DataListViewModes) => import("react/jsx-runtime").JSX.Element;
@@ -3,12 +3,12 @@ import { ITopMediaSession, LayoutModes, MetadataDescriptor } from '@topconsultnp
3
3
  import { TID_MID } from '../../ts';
4
4
  import { DataGridTypes } from 'devextreme-react/cjs/data-grid';
5
5
  export declare const TMMidViewer: ({ tmSession, tid_mid, showCompleteName, showIcon, showId, noneSelectionText }: {
6
- tmSession?: ITopMediaSession;
6
+ tmSession?: ITopMediaSession | undefined;
7
7
  tid_mid: TID_MID | undefined;
8
- showCompleteName?: boolean;
9
- showIcon?: boolean;
10
- showId?: boolean;
11
- noneSelectionText?: string;
8
+ showCompleteName?: boolean | undefined;
9
+ showIcon?: boolean | undefined;
10
+ showId?: boolean | undefined;
11
+ noneSelectionText?: string | undefined;
12
12
  }) => import("react/jsx-runtime").JSX.Element;
13
13
  interface ITMMetadataIcon {
14
14
  tid: number | undefined;
@@ -11,11 +11,11 @@ interface ITMDcmtTypeTooltip {
11
11
  }
12
12
  export declare const TMDcmtTypeTooltip: React.FC<ITMDcmtTypeTooltip>;
13
13
  declare const TMTidViewer: ({ tmSession, tid, showIcon, showId, noneSelectionText }: {
14
- tmSession?: ITopMediaSession;
15
- tid?: number;
16
- showIcon?: boolean;
17
- showId?: boolean;
18
- noneSelectionText?: string;
14
+ tmSession?: ITopMediaSession | undefined;
15
+ tid?: number | undefined;
16
+ showIcon?: boolean | undefined;
17
+ showId?: boolean | undefined;
18
+ noneSelectionText?: string | undefined;
19
19
  }) => import("react/jsx-runtime").JSX.Element;
20
20
  export default TMTidViewer;
21
21
  export declare const cellRenderTID: (data: DataGridTypes.ColumnCellTemplateData, noneSelectionText?: string) => import("react/jsx-runtime").JSX.Element;
@@ -4,7 +4,7 @@ import { AppModules, DataColumnDescriptor, ITopMediaSession, QueryDescriptor, Se
4
4
  import { FormModes, moduleTypes } from "../ts";
5
5
  declare const TABLET_WIDTH = 1024;
6
6
  declare const MOBILE_WIDTH = 640;
7
- declare const calcResponsiveDirection: (deviceType: DeviceType, desktopDir: "horizontal" | "vertical", tabletDir: "horizontal" | "vertical", mobileDir: "horizontal" | "vertical") => "horizontal" | "vertical";
7
+ declare const calcResponsiveDirection: (deviceType: DeviceType, desktopDir: 'horizontal' | 'vertical', tabletDir: 'horizontal' | 'vertical', mobileDir: 'horizontal' | 'vertical') => 'horizontal' | 'vertical';
8
8
  declare const openApps: (appModule: AppModules, tmSession: ITopMediaSession, appRoutes?: any[]) => Promise<void>;
9
9
  export declare const setSDK_GlobalsInfoAsync: (tms: ITopMediaSession | undefined) => Promise<ITopMediaSession>;
10
10
  declare const calcResponsiveSizes: (deviceType: DeviceType | undefined, desktopSize: string, tabletSize: string, mobileSize: string) => string;
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  import { FormModes } from "../ts";
2
3
  import { JobTypes, ObjectClasses, ValidationItem } from "@topconsultnpm/sdk-ts-beta";
3
4
  export declare class SaveFormOptions {
@@ -1,2 +1,3 @@
1
+ /// <reference types="react" />
1
2
  export declare const useOutsideClick: (callback: (escPressed?: boolean) => void) => import("react").RefObject<HTMLDivElement>;
2
3
  export declare const useEscapeKeyPress: (callback: () => void) => import("react").RefObject<HTMLDivElement>;
@@ -1,2 +1,3 @@
1
+ /// <reference types="react" />
1
2
  import { QueryDescriptor, QueryParameterDescriptor } from '@topconsultnpm/sdk-ts-beta';
2
3
  export declare const useQueryParametersDialog: () => [(inputQd: QueryDescriptor) => Promise<QueryParameterDescriptor[]>, () => JSX.Element];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@topconsultnpm/sdkui-react-beta",
3
- "version": "6.8.68",
3
+ "version": "6.8.69",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "test": "echo \"Error: no test specified\" && exit 1",