@topconsultnpm/sdkui-react-beta 6.5.71 → 6.5.72
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.
|
@@ -11,6 +11,9 @@ interface ITMTextBox extends ITMEditorBase {
|
|
|
11
11
|
buttons?: TMTextBoxButtonData[];
|
|
12
12
|
formulaItems?: string[];
|
|
13
13
|
maxValue?: number;
|
|
14
|
+
maxLength?: number;
|
|
15
|
+
precision?: number;
|
|
16
|
+
scale?: number;
|
|
14
17
|
type?: TextBoxType;
|
|
15
18
|
value?: string | number;
|
|
16
19
|
onValueChanged?: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
@@ -18,7 +18,7 @@ const StyledShowPasswordIcon = styled.div `
|
|
|
18
18
|
transform: translateY(-25px);
|
|
19
19
|
cursor: pointer;
|
|
20
20
|
`;
|
|
21
|
-
const TMTextBox = ({ autoFocus, validationItems = [], label = '', readOnly = false, formulaItems = [], buttons = [], isModifiedWhen, placeHolder, elementStyle, width = '100%', maxValue, fontSize = FontSize.defaultFontSize, icon, labelPosition = 'left', value, disabled = false, type = 'text', onValueChanged, onBlur }) => {
|
|
21
|
+
const TMTextBox = ({ autoFocus, maxLength, precision, scale, validationItems = [], label = '', readOnly = false, formulaItems = [], buttons = [], isModifiedWhen, placeHolder, elementStyle, width = '100%', maxValue, fontSize = FontSize.defaultFontSize, icon, labelPosition = 'left', value, disabled = false, type = 'text', onValueChanged, onBlur }) => {
|
|
22
22
|
const [initialType, setInitialType] = useState(type);
|
|
23
23
|
const [currentType, setCurrentType] = useState(type);
|
|
24
24
|
const [currentValue, setCurrentValue] = useState(value);
|
|
@@ -28,9 +28,7 @@ const TMTextBox = ({ autoFocus, validationItems = [], label = '', readOnly = fal
|
|
|
28
28
|
const inputRef = useRef(null);
|
|
29
29
|
let screenWidth = useWindowWidth();
|
|
30
30
|
useEffect(() => { setCurrentType(type); setInitialType(type); }, [type]);
|
|
31
|
-
useEffect(() => {
|
|
32
|
-
setCurrentValue(value);
|
|
33
|
-
}, [value]);
|
|
31
|
+
useEffect(() => { setCurrentValue(value); }, [value]);
|
|
34
32
|
useEffect(() => {
|
|
35
33
|
if (initialType === 'password' && !value) {
|
|
36
34
|
setCurrentType('password');
|
|
@@ -89,9 +87,40 @@ const TMTextBox = ({ autoFocus, validationItems = [], label = '', readOnly = fal
|
|
|
89
87
|
TMExceptionBoxManager.show({ exception: e });
|
|
90
88
|
}
|
|
91
89
|
};
|
|
90
|
+
const getMaxValue = (curValue) => {
|
|
91
|
+
if (maxValue)
|
|
92
|
+
return maxValue;
|
|
93
|
+
// if (precision && (!scale || scale == 0)) return Number("9".repeat(precision ?? 0));
|
|
94
|
+
console.log(Number("9".repeat((precision ?? 0) - (scale ?? 0)) + '.' + "9".repeat(scale ?? 0)));
|
|
95
|
+
if (precision || scale)
|
|
96
|
+
return Number("9".repeat((precision ?? 0) - (scale ?? 0)) + '.' + "9".repeat(scale ?? 0));
|
|
97
|
+
return Number(curValue);
|
|
98
|
+
};
|
|
92
99
|
const renderInputField = () => {
|
|
93
|
-
return (_jsxs(_Fragment, { children: [_jsx(StyledEditor, { ref: inputRef, autoFocus: autoFocus, readOnly: readOnly, type: currentType, disabled: disabled, value: currentValue, width: width || '100%', placeholder: placeHolder, onFocus: () => setIsFocused(true), onBlur: (e) => { setIsFocused(false); if (currentValue != value)
|
|
94
|
-
onBlur?.(currentValue); }, onChange: (e) => {
|
|
100
|
+
return (_jsxs(_Fragment, { children: [_jsx(StyledEditor, { ref: inputRef, autoFocus: autoFocus, readOnly: readOnly, type: currentType, disabled: disabled, value: currentValue, width: width || '100%', placeholder: placeHolder, maxLength: maxLength, onFocus: () => setIsFocused(true), onBlur: (e) => { setIsFocused(false); if (currentValue != value)
|
|
101
|
+
onBlur?.(currentValue); }, onChange: (e) => {
|
|
102
|
+
if (currentType === 'number') {
|
|
103
|
+
let number = Number(e.target.value);
|
|
104
|
+
let max = getMaxValue(e.target.value);
|
|
105
|
+
if (number > max) {
|
|
106
|
+
ShowAlert({ mode: 'warning', message: `Max value is ${max}`, duration: 3000, title: 'Textbox Warning' });
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
let decimalSeparatorIndex = number.toString().indexOf(".");
|
|
110
|
+
if (!scale && decimalSeparatorIndex >= 0)
|
|
111
|
+
return;
|
|
112
|
+
// Controllo lunghezza decimali
|
|
113
|
+
if (scale) {
|
|
114
|
+
if (decimalSeparatorIndex >= 0) {
|
|
115
|
+
let result = Number(number.toString().substring(decimalSeparatorIndex + 1));
|
|
116
|
+
if (result > Number("9".repeat(scale ?? 0)))
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
setCurrentValue(e.target.value);
|
|
122
|
+
onValueChanged?.(e);
|
|
123
|
+
}, onContextMenu: (e) => {
|
|
95
124
|
if (formulaItems.length <= 0)
|
|
96
125
|
return;
|
|
97
126
|
// prevent default right click behavior
|
|
@@ -103,6 +132,11 @@ const TMTextBox = ({ autoFocus, validationItems = [], label = '', readOnly = fal
|
|
|
103
132
|
const y = e.clientY - bounds.top;
|
|
104
133
|
// set the x and y coordinates of our users right click
|
|
105
134
|
setPoints({ x, y });
|
|
135
|
+
}, onKeyDown: (e) => {
|
|
136
|
+
if (currentType === 'number') {
|
|
137
|
+
if (!scale && (e.key == "." || e.key == ","))
|
|
138
|
+
e.preventDefault();
|
|
139
|
+
}
|
|
106
140
|
}, "$isMobile": screenWidth < 640, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, "$fontSize": fontSize, "$maxValue": maxValue, "$width": width, "$type": currentType }), initialType === 'password' && currentValue && _jsx(StyledShowPasswordIcon, { onClick: toggleShowPassword, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: showPasswordIcon() }), initialType !== 'password' &&
|
|
107
141
|
buttons.map((buttonItem, index) => {
|
|
108
142
|
return (_jsx(StyledEditorButtonIcon, { onClick: buttonItem.onClick, "$index": index, "$transform": '-26px', children: _jsx(TMTooltip, { content: buttonItem.text, children: buttonItem.icon }) }, index));
|
package/lib/helper/TMIcons.d.ts
CHANGED
|
@@ -166,13 +166,15 @@ declare function IconCheck(props: Readonly<React.SVGProps<SVGSVGElement>>): impo
|
|
|
166
166
|
declare function IconUncheck(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
167
167
|
declare function IconSortAsc(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
168
168
|
declare function IconSortDesc(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
169
|
-
declare function IconSortAscLetters(props: React.SVGProps<SVGSVGElement
|
|
170
|
-
declare function IconSortDescLetters(props: React.SVGProps<SVGSVGElement
|
|
171
|
-
declare function IconSortAscNumbers(props: React.SVGProps<SVGSVGElement
|
|
172
|
-
declare function IconSortDescNumbers(props: React.SVGProps<SVGSVGElement
|
|
173
|
-
declare function IconSortAscClock(props: React.SVGProps<SVGSVGElement
|
|
174
|
-
declare function IconSortDescClock(props: React.SVGProps<SVGSVGElement
|
|
169
|
+
declare function IconSortAscLetters(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
170
|
+
declare function IconSortDescLetters(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
171
|
+
declare function IconSortAscNumbers(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
172
|
+
declare function IconSortDescNumbers(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
173
|
+
declare function IconSortAscClock(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
174
|
+
declare function IconSortDescClock(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
175
175
|
declare function IconLayerGroup(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
176
176
|
declare function IconTree(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
177
|
-
|
|
177
|
+
declare function IconGrid(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
178
|
+
declare function IconList(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
|
|
179
|
+
export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };
|
|
178
180
|
/** https://reactsvgicons.com */
|
package/lib/helper/TMIcons.js
CHANGED
|
@@ -517,7 +517,7 @@ function IconSortAscClock(props) {
|
|
|
517
517
|
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M20 17h3l-4 4-4-4h3V3h2v14M8 5c-3.86 0-7 3.13-7 7s3.13 7 7 7c3.86 0 7-3.13 7-7s-3.13-7-7-7m0 2.15c2.67 0 4.85 2.17 4.85 4.85 0 2.68-2.17 4.85-4.85 4.85-2.68 0-4.85-2.17-4.85-4.85 0-2.68 2.17-4.85 4.85-4.85M7 9v3.69l3.19 1.84.75-1.3-2.44-1.41V9" }) }));
|
|
518
518
|
}
|
|
519
519
|
function IconSortDescClock(props) {
|
|
520
|
-
return (_jsx("svg", { viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M18 7h-3l4-4 4 4h-3v14h-2V7M8 5c-3.86 0-7 3.13-7 7s3.13 7 7 7c3.86 0 7-3.13 7-7s-3.13-7-7-7m0 2.15c2.67 0 4.85 2.17 4.85 4.85 0 2.68-2.17 4.85-4.85 4.85-2.68 0-4.85-2.17-4.85-4.85 0-2.68 2.17-4.85 4.85-4.85M7 9v3.69l3.19 1.84.75-1.3-2.44-1.41V9" }) }));
|
|
520
|
+
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M18 7h-3l4-4 4 4h-3v14h-2V7M8 5c-3.86 0-7 3.13-7 7s3.13 7 7 7c3.86 0 7-3.13 7-7s-3.13-7-7-7m0 2.15c2.67 0 4.85 2.17 4.85 4.85 0 2.68-2.17 4.85-4.85 4.85-2.68 0-4.85-2.17-4.85-4.85 0-2.68 2.17-4.85 4.85-4.85M7 9v3.69l3.19 1.84.75-1.3-2.44-1.41V9" }) }));
|
|
521
521
|
}
|
|
522
522
|
function IconLayerGroup(props) {
|
|
523
523
|
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M2.25 8.452l9.5 5.48a.498.498 0 00.5 0l9.5-5.48a.5.5 0 000-.866l-9.5-5.476a.507.507 0 00-.5 0l-9.5 5.476a.5.5 0 000 .866zM12 3.122l8.499 4.898L12 12.923 3.501 8.02 12 3.12zm9.248 12.404L12 20.921l-9.248-5.395a.5.5 0 10-.504.864l9.5 5.542a.496.496 0 00.504 0l9.5-5.542a.5.5 0 10-.504-.864zm0-4L12 16.921l-9.248-5.395a.5.5 0 10-.504.864l9.5 5.542a.496.496 0 00.504 0l9.5-5.542a.5.5 0 10-.504-.864z" }) }));
|
|
@@ -525,4 +525,10 @@ function IconLayerGroup(props) {
|
|
|
525
525
|
function IconTree(props) {
|
|
526
526
|
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M12 9c1.59 7.61-2 13-2 13h3c1.88-5.8 1-9.91.5-12m2.16-2.84c.17.21.34.43.47.66a7.1 7.1 0 01-.63 8.44 7.11 7.11 0 00-.55-6.49c-.08-.13-.17-.24-.25-.36a7.123 7.123 0 00-2.16-1.98 7.127 7.127 0 00-4.96 6.79c0 .74.11 1.45.31 2.11a7.073 7.073 0 01-1.33-4.14c0-2.35 1.14-4.43 2.89-5.73C8 6.35 6.46 6.67 5.12 7.5c-.62.41-1.16.88-1.62 1.41.55-1.33 1.5-2.52 2.8-3.34 1.5-.94 3.2-1.25 4.84-1.01C10.73 4 10.23 3.47 9.63 3c-.58-.42-1.21-.76-1.87-1 1.44.04 2.88.5 4.11 1.43.63.47 1.13 1.04 1.53 1.64.1 0 .19-.01.29-.01 3.2 0 5.91 2.11 6.81 5.02a7.073 7.073 0 00-4.84-2.92z" }) }));
|
|
527
527
|
}
|
|
528
|
-
|
|
528
|
+
function IconGrid(props) {
|
|
529
|
+
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, fill: "currentColor", viewBox: "0 0 16 16", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M1 2.5A1.5 1.5 0 012.5 1h3A1.5 1.5 0 017 2.5v3A1.5 1.5 0 015.5 7h-3A1.5 1.5 0 011 5.5v-3zM2.5 2a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5h-3zm6.5.5A1.5 1.5 0 0110.5 1h3A1.5 1.5 0 0115 2.5v3A1.5 1.5 0 0113.5 7h-3A1.5 1.5 0 019 5.5v-3zm1.5-.5a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5h-3zM1 10.5A1.5 1.5 0 012.5 9h3A1.5 1.5 0 017 10.5v3A1.5 1.5 0 015.5 15h-3A1.5 1.5 0 011 13.5v-3zm1.5-.5a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5h-3zm6.5.5A1.5 1.5 0 0110.5 9h3a1.5 1.5 0 011.5 1.5v3a1.5 1.5 0 01-1.5 1.5h-3A1.5 1.5 0 019 13.5v-3zm1.5-.5a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5h-3z" }) }));
|
|
530
|
+
}
|
|
531
|
+
function IconList(props) {
|
|
532
|
+
return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, fill: "currentColor", viewBox: "0 0 16 16", height: "1em", width: "1em", ...props, children: _jsx("path", { fillRule: "evenodd", d: "M2.5 12a.5.5 0 01.5-.5h10a.5.5 0 010 1H3a.5.5 0 01-.5-.5zm0-4a.5.5 0 01.5-.5h10a.5.5 0 010 1H3a.5.5 0 01-.5-.5zm0-4a.5.5 0 01.5-.5h10a.5.5 0 010 1H3a.5.5 0 01-.5-.5z" }) }));
|
|
533
|
+
}
|
|
534
|
+
export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };
|