linear-react-components-ui 2.2.0-beta.10 → 2.2.0-beta.11
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.
- package/lib/assets/styles/datepicker2.css +11 -81
- package/lib/inputs/select/Dropdown.js +1 -11
- package/lib/inputs/select/Dropdown.js.map +1 -1
- package/lib/inputs/select/multiple/index.js +2 -5
- package/lib/inputs/select/multiple/index.js.map +1 -1
- package/lib/inputs/select/simple/index.js +2 -5
- package/lib/inputs/select/simple/index.js.map +1 -1
- package/lib/inputs/select/types.d.ts +2 -3
- package/lib/inputs/types.d.ts +1 -2
- package/lib/inputs2/date/{hooks/useCalendarPosition.d.ts → base/constants.d.ts} +1 -1
- package/lib/inputs2/date/base/constants.js +69 -0
- package/lib/inputs2/date/base/constants.js.map +1 -0
- package/lib/inputs2/date/datefield/base.js +214 -691
- package/lib/inputs2/date/datefield/base.js.map +1 -1
- package/lib/inputs2/date/datefield/calendarbox.d.ts +6 -0
- package/lib/inputs2/date/datefield/calendarbox.js +228 -0
- package/lib/inputs2/date/datefield/calendarbox.js.map +1 -0
- package/lib/inputs2/date/datefield/triggers.js +4 -4
- package/lib/inputs2/date/datefield/triggers.js.map +1 -1
- package/lib/inputs2/date/datefield/types.d.ts +12 -5
- package/lib/inputs2/date/dateperiodfield/base.js +809 -694
- package/lib/inputs2/date/dateperiodfield/base.js.map +1 -1
- package/lib/inputs2/date/dateperiodfield/calendarbox.d.ts +6 -0
- package/lib/inputs2/date/dateperiodfield/calendarbox.js +282 -0
- package/lib/inputs2/date/dateperiodfield/calendarbox.js.map +1 -0
- package/lib/inputs2/date/dateperiodfield/triggers.js +9 -21
- package/lib/inputs2/date/dateperiodfield/triggers.js.map +1 -1
- package/lib/inputs2/date/dateperiodfield/types.d.ts +23 -13
- package/lib/inputs2/date/helpers.d.ts +4 -44
- package/lib/inputs2/date/helpers.js +4 -200
- package/lib/inputs2/date/helpers.js.map +1 -1
- package/lib/inputs2/date/types.d.ts +1 -22
- package/lib/inputs2/date/types.js.map +1 -1
- package/lib/inputs2/selectfield/base.js +33 -16
- package/lib/inputs2/selectfield/base.js.map +1 -1
- package/lib/inputs2/selectfield/context.d.ts +1 -0
- package/lib/inputs2/selectfield/context.js.map +1 -1
- package/lib/inputs2/selectfield/item.js +52 -50
- package/lib/inputs2/selectfield/item.js.map +1 -1
- package/lib/inputs2/selectfield/listbox.d.ts +1 -2
- package/lib/inputs2/selectfield/listbox.js +0 -10
- package/lib/inputs2/selectfield/listbox.js.map +1 -1
- package/lib/inputs2/selectfield/types.d.ts +3 -5
- package/lib/inputs2/selectfield/types.js.map +1 -1
- package/lib/node_modules/lodash/lodash.js +2 -2
- package/lib/node_modules/lodash/lodash.js.map +1 -1
- package/lib/panel/Content.js +82 -28
- package/lib/panel/Content.js.map +1 -1
- package/lib/panel/Default.d.ts +1 -1
- package/lib/panel/Default.js +54 -60
- package/lib/panel/Default.js.map +1 -1
- package/lib/panel/helpers.js +16 -1
- package/lib/panel/helpers.js.map +1 -1
- package/lib/panel/types.d.ts +6 -3
- package/package.json +1 -1
- package/lib/hooks/useScrollEndReached/index.d.ts +0 -8
- package/lib/hooks/useScrollEndReached/index.js +0 -69
- package/lib/hooks/useScrollEndReached/index.js.map +0 -1
- package/lib/hooks/useScrollEndReached/types.d.ts +0 -7
- package/lib/inputs2/date/calendarbox.d.ts +0 -23
- package/lib/inputs2/date/calendarbox.js +0 -254
- package/lib/inputs2/date/calendarbox.js.map +0 -1
- package/lib/inputs2/date/hooks/useCalendarPosition.js +0 -93
- package/lib/inputs2/date/hooks/useCalendarPosition.js.map +0 -1
- package/lib/inputs2/date/hooks/useDateCalendarState.d.ts +0 -14
- package/lib/inputs2/date/hooks/useDateCalendarState.js +0 -250
- package/lib/inputs2/date/hooks/useDateCalendarState.js.map +0 -1
- package/lib/inputs2/date/hooks/useDateMask.d.ts +0 -22
- package/lib/inputs2/date/hooks/useDateMask.js +0 -143
- package/lib/inputs2/date/hooks/useDateMask.js.map +0 -1
- package/lib/inputs2/date/timeselector.d.ts +0 -17
- package/lib/inputs2/date/timeselector.js +0 -226
- package/lib/inputs2/date/timeselector.js.map +0 -1
- package/lib/node_modules/moment/dist/locale/pt-br.js +0 -54
- package/lib/node_modules/moment/dist/locale/pt-br.js.map +0 -1
|
@@ -741,7 +741,7 @@
|
|
|
741
741
|
background-position: -135% 0%;
|
|
742
742
|
}
|
|
743
743
|
}
|
|
744
|
-
.date-calendar-box[aria-expanded=true]
|
|
744
|
+
.date-calendar-box[aria-expanded=true], .date-field-root .container .input {
|
|
745
745
|
color: #666;
|
|
746
746
|
font-size: 16px;
|
|
747
747
|
font-family: Roboto;
|
|
@@ -892,11 +892,8 @@ input::-webkit-inner-spin-button {
|
|
|
892
892
|
border: 1px solid transparent;
|
|
893
893
|
background-color: transparent;
|
|
894
894
|
}
|
|
895
|
-
.date-field-root .container:has(input:
|
|
896
|
-
color: #
|
|
897
|
-
transition: color 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
|
|
898
|
-
background-color: #f5f5f5;
|
|
899
|
-
cursor: not-allowed;
|
|
895
|
+
.date-field-root .container:has(input[data-state-error=true]):has(input[data-state-skeletonize=false]) {
|
|
896
|
+
border-color: #f48181;
|
|
900
897
|
}
|
|
901
898
|
.date-field-root .container:has(input[data-state-read-only=true]) {
|
|
902
899
|
cursor: default;
|
|
@@ -906,8 +903,11 @@ input::-webkit-inner-spin-button {
|
|
|
906
903
|
box-shadow: 0 3px 0 #a10d0d;
|
|
907
904
|
transition: box-shadow 250ms cubic-bezier(0.19, 0.62, 0.58, 0.98) 100ms;
|
|
908
905
|
}
|
|
909
|
-
.date-field-root .container:has(input
|
|
910
|
-
|
|
906
|
+
.date-field-root .container:has(input:disabled) {
|
|
907
|
+
color: #cacaca !important;
|
|
908
|
+
transition: color 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
|
|
909
|
+
background-color: #f5f5f5;
|
|
910
|
+
cursor: not-allowed;
|
|
911
911
|
}
|
|
912
912
|
.date-field-root .container .separator {
|
|
913
913
|
display: flex;
|
|
@@ -1029,10 +1029,9 @@ input::-webkit-inner-spin-button {
|
|
|
1029
1029
|
margin: 5px 0;
|
|
1030
1030
|
font-size: 87.5%;
|
|
1031
1031
|
z-index: auto;
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
min-width: min-content;
|
|
1032
|
+
position: fixed;
|
|
1033
|
+
display: flex;
|
|
1034
|
+
flex-direction: column;
|
|
1036
1035
|
overflow: hidden;
|
|
1037
1036
|
border: 1px solid #dae1e8;
|
|
1038
1037
|
background-color: #fff;
|
|
@@ -1040,7 +1039,6 @@ input::-webkit-inner-spin-button {
|
|
|
1040
1039
|
box-shadow: -6px 6px 50px -12px rgba(51, 51, 51, 0.4);
|
|
1041
1040
|
}
|
|
1042
1041
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-header {
|
|
1043
|
-
grid-area: header;
|
|
1044
1042
|
width: auto;
|
|
1045
1043
|
height: auto;
|
|
1046
1044
|
display: flex;
|
|
@@ -1072,7 +1070,6 @@ input::-webkit-inner-spin-button {
|
|
|
1072
1070
|
font-size: 87.5%;
|
|
1073
1071
|
}
|
|
1074
1072
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-days-of-week {
|
|
1075
|
-
grid-area: weekdays;
|
|
1076
1073
|
height: 28px;
|
|
1077
1074
|
display: flex;
|
|
1078
1075
|
flex-flow: nowrap;
|
|
@@ -1089,13 +1086,11 @@ input::-webkit-inner-spin-button {
|
|
|
1089
1086
|
vertical-align: middle;
|
|
1090
1087
|
}
|
|
1091
1088
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days {
|
|
1092
|
-
grid-area: grid;
|
|
1093
1089
|
padding: 3px;
|
|
1094
1090
|
}
|
|
1095
1091
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table {
|
|
1096
1092
|
width: 100%;
|
|
1097
1093
|
height: 100%;
|
|
1098
|
-
min-height: 252px;
|
|
1099
1094
|
}
|
|
1100
1095
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table td[role=gridcell] {
|
|
1101
1096
|
text-align: center;
|
|
@@ -1132,13 +1127,6 @@ input::-webkit-inner-spin-button {
|
|
|
1132
1127
|
border-color: #d1d3d4;
|
|
1133
1128
|
border-style: dashed;
|
|
1134
1129
|
}
|
|
1135
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table .day-button[data-state-out-of-bounds=true] {
|
|
1136
|
-
color: #cacaca !important;
|
|
1137
|
-
cursor: not-allowed;
|
|
1138
|
-
}
|
|
1139
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table .day-button[data-state-out-of-bounds=true]:hover {
|
|
1140
|
-
background-color: transparent;
|
|
1141
|
-
}
|
|
1142
1130
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table .day-button[data-state-is-today=true] {
|
|
1143
1131
|
position: relative;
|
|
1144
1132
|
}
|
|
@@ -1156,62 +1144,4 @@ input::-webkit-inner-spin-button {
|
|
|
1156
1144
|
}
|
|
1157
1145
|
.date-calendar-box[aria-expanded=true] .date-calendar-box-grid-of-days table .day-button[data-state-is-today=true][aria-selected=true]::after {
|
|
1158
1146
|
background-color: #fff;
|
|
1159
|
-
}
|
|
1160
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector {
|
|
1161
|
-
grid-area: time;
|
|
1162
|
-
display: flex;
|
|
1163
|
-
flex-direction: row;
|
|
1164
|
-
height: 0;
|
|
1165
|
-
min-height: 100%;
|
|
1166
|
-
}
|
|
1167
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-column {
|
|
1168
|
-
display: flex;
|
|
1169
|
-
flex-direction: column;
|
|
1170
|
-
min-height: 0;
|
|
1171
|
-
width: 52px;
|
|
1172
|
-
border-left: 1px solid #dae1e8;
|
|
1173
|
-
}
|
|
1174
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-column .time-column-label {
|
|
1175
|
-
padding: 6px 0;
|
|
1176
|
-
font-size: 87.5%;
|
|
1177
|
-
text-align: center;
|
|
1178
|
-
white-space: nowrap;
|
|
1179
|
-
background-color: #f0f0f0;
|
|
1180
|
-
border-bottom: 1px solid #e1e1e1;
|
|
1181
|
-
}
|
|
1182
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-column .time-column-options {
|
|
1183
|
-
flex: 1 1 auto;
|
|
1184
|
-
min-height: 0;
|
|
1185
|
-
font-size: 87.5%;
|
|
1186
|
-
overflow: hidden auto;
|
|
1187
|
-
scrollbar-width: thin;
|
|
1188
|
-
}
|
|
1189
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button {
|
|
1190
|
-
width: 100%;
|
|
1191
|
-
padding: 6px 0;
|
|
1192
|
-
border: none;
|
|
1193
|
-
cursor: pointer;
|
|
1194
|
-
text-align: center;
|
|
1195
|
-
background-color: transparent;
|
|
1196
|
-
}
|
|
1197
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button:hover {
|
|
1198
|
-
background-color: #dae1e8;
|
|
1199
|
-
}
|
|
1200
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button[aria-selected=true], .date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button[aria-selected=true]:hover {
|
|
1201
|
-
color: #fff;
|
|
1202
|
-
background-color: #6C757D;
|
|
1203
|
-
}
|
|
1204
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button[data-state-out-of-bounds=true] {
|
|
1205
|
-
color: #cacaca !important;
|
|
1206
|
-
cursor: not-allowed;
|
|
1207
|
-
}
|
|
1208
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector .time-unit-button[data-state-out-of-bounds=true]:hover {
|
|
1209
|
-
background-color: transparent;
|
|
1210
|
-
}
|
|
1211
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector[data-state-disabled=true] .time-unit-button {
|
|
1212
|
-
color: #cacaca !important;
|
|
1213
|
-
cursor: not-allowed;
|
|
1214
|
-
}
|
|
1215
|
-
.date-calendar-box[aria-expanded=true] .date-calendar-box-time-selector[data-state-disabled=true] .time-unit-button:hover {
|
|
1216
|
-
background-color: transparent;
|
|
1217
1147
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useState, useEffect } from "react";
|
|
3
|
-
import { useScrollEndReached } from "../../hooks/useScrollEndReached/index.js";
|
|
4
3
|
import Icon from "../../icons/index.js";
|
|
5
4
|
import Avatar from "../../avatar/index.js";
|
|
6
5
|
import { returnDropdownDynamicStyles, getDropdownItemCssClass } from "./helper.js";
|
|
@@ -26,10 +25,7 @@ const Dropdown = (props) => {
|
|
|
26
25
|
handleOnKeydown,
|
|
27
26
|
searchNotFoundText,
|
|
28
27
|
idKey,
|
|
29
|
-
selectFieldRef
|
|
30
|
-
onEndReached,
|
|
31
|
-
onEndReachedThreshold,
|
|
32
|
-
itemsCount
|
|
28
|
+
selectFieldRef
|
|
33
29
|
} = props;
|
|
34
30
|
const [dropdownDynamicStyles, setDropdownDynamicStyles] = useState(returnDropdownDynamicStyles({
|
|
35
31
|
...props
|
|
@@ -41,12 +37,6 @@ const Dropdown = (props) => {
|
|
|
41
37
|
}));
|
|
42
38
|
}
|
|
43
39
|
}, [dropdownRef.current, dataCombo]);
|
|
44
|
-
useScrollEndReached({
|
|
45
|
-
elementRef: dropdownRef,
|
|
46
|
-
onEndReached,
|
|
47
|
-
onEndReachedThreshold,
|
|
48
|
-
itemsCount: itemsCount ?? dataCombo.length
|
|
49
|
-
});
|
|
50
40
|
return /* @__PURE__ */ jsx(DropdownPopup, { align: "left", leftPosition: dropdownDynamicStyles.left, topPosition: dropdownDynamicStyles.top, targetRef: selectFieldRef?.current, children: /* @__PURE__ */ jsxs("div", { className: "select-dropdown", ref: dropdownRef, style: {
|
|
51
41
|
width: dropdownWidth,
|
|
52
42
|
marginLeft: gridWrapperStyle ? gridWrapperStyle.paddingLeft : "0",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.js","sources":["../../../src/lib/inputs/select/Dropdown.tsx"],"sourcesContent":["import { ChangeEvent, KeyboardEvent, useEffect, useState } from 'react';\nimport
|
|
1
|
+
{"version":3,"file":"Dropdown.js","sources":["../../../src/lib/inputs/select/Dropdown.tsx"],"sourcesContent":["import { ChangeEvent, KeyboardEvent, useEffect, useState } from 'react';\nimport Icon from '../../icons';\nimport Avatar from '../../avatar';\nimport * as helper from './helper';\nimport DropdownPopup from '../../dropdown/Popup';\nimport { IDropdownSelectProps } from '../types';\nimport { DataCombo } from '../../@types/DataCombo';\n\nconst Dropdown = (props: IDropdownSelectProps) => {\n const {\n imageAlign = 'left', striped = false, dataCombo, descriptionKey, imgSrcKey, dropdownRef,\n currents = [], dropdownWidth, gridWrapperStyle, handleOnSelect, inputValue,\n handleOnFocus, opened, handleOnFilter, selected = null, searchOnDropdown, handleOnKeydown,\n searchNotFoundText, idKey, selectFieldRef,\n } = props;\n const [dropdownDynamicStyles, setDropdownDynamicStyles] =\n useState(helper.returnDropdownDynamicStyles({ ...props }));\n\n useEffect(() => {\n if (dropdownRef.current) {\n setDropdownDynamicStyles(helper.returnDropdownDynamicStyles({ ...props }));\n }\n }, [dropdownRef.current, dataCombo]);\n\n return (\n <DropdownPopup\n align=\"left\"\n leftPosition={dropdownDynamicStyles.left}\n topPosition={dropdownDynamicStyles.top}\n targetRef={selectFieldRef?.current}>\n <div\n className=\"select-dropdown\"\n ref={dropdownRef}\n style={{\n width: dropdownWidth,\n marginLeft: gridWrapperStyle ? gridWrapperStyle.paddingLeft : '0',\n maxHeight: dropdownDynamicStyles.maxHeight,\n }}>\n {searchOnDropdown &&\n <div className=\"filtercontainer\">\n <input\n className=\"filterinput\"\n type=\"text\"\n value={inputValue}\n onFocus={() => { handleOnFocus(); }}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n handleOnFilter(e.target.value);\n }}\n onKeyDown={(e: KeyboardEvent<Element>) => { handleOnKeydown(e); }}\n autoFocus={opened} />\n <Icon name=\"search\" viewBox=\"0 0 32 32\" />\n </div>\n }\n {dataCombo.map((item: DataCombo) => {\n const disabled = (currents && currents.length > 0 ?\n currents.some(s => s[idKey] === item[idKey])\n : false);\n const itemSelected = Boolean(selected && selected[idKey] === item[idKey]);\n return (\n <div\n key={`dropdowmIten ${item[idKey]}}`}\n className={helper.getDropdownItemCssClass(itemSelected, disabled, striped)} >\n <button\n className=\"menubutton\"\n tabIndex={-1}\n onClick={() => { if (!disabled) { handleOnSelect(item); } }}>\n {item.iconName &&\n <Icon\n name={item.iconName}\n customClass=\"menuicon\"\n style={{ order: imageAlign === 'left' ? 0 : 1 }} />\n }\n {imgSrcKey && item.imgSrcKey &&\n <Avatar\n src={item.imgSrcKey}\n customClass=\"menuicon\"\n style={{ order: imageAlign === 'left' ? 0 : 1 }} />\n }\n <span className=\"label\">{typeof descriptionKey === 'string' ? item[descriptionKey] : descriptionKey(item)}</span>\n </button>\n </div>\n );\n })}\n {dataCombo && dataCombo.length === 0 &&\n <div className=\"notfound\">{searchNotFoundText}</div>\n }\n </div>\n </DropdownPopup>\n );\n};\n\nexport default Dropdown;\n"],"names":["Dropdown","props","imageAlign","striped","dataCombo","descriptionKey","imgSrcKey","dropdownRef","currents","dropdownWidth","gridWrapperStyle","handleOnSelect","inputValue","handleOnFocus","opened","handleOnFilter","selected","searchOnDropdown","handleOnKeydown","searchNotFoundText","idKey","selectFieldRef","dropdownDynamicStyles","setDropdownDynamicStyles","useState","helper","useEffect","current","left","top","width","marginLeft","paddingLeft","maxHeight","e","target","value","map","item","disabled","length","some","s","itemSelected","Boolean","iconName","order"],"mappings":"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"}
|
|
@@ -26,10 +26,7 @@ const MultipleSelect = (props) => {
|
|
|
26
26
|
customClassForInputContent,
|
|
27
27
|
customClassForSideButtons,
|
|
28
28
|
disabled = false,
|
|
29
|
-
dropdownMaxWidth = void 0
|
|
30
|
-
onEndReached,
|
|
31
|
-
onEndReachedThreshold,
|
|
32
|
-
itemsCount
|
|
29
|
+
dropdownMaxWidth = void 0
|
|
33
30
|
} = props;
|
|
34
31
|
const [dataCombo, setDataCombo] = useState(dataSource);
|
|
35
32
|
const [currents, setCurrents] = useState([]);
|
|
@@ -228,7 +225,7 @@ const MultipleSelect = (props) => {
|
|
|
228
225
|
if (shouldDisable()) return null;
|
|
229
226
|
return onClearClick();
|
|
230
227
|
}, handlerOpenClose: onOpenClose, customClassForSideButtons }, "action-buttons-multiselect")], children: /* @__PURE__ */ jsx(Selecteds, { ...props, currents, handlerOnUnselect: onUnselect }) }),
|
|
231
|
-
opened && /* @__PURE__ */ jsx(Dropdown, { ...props, selected, selectFieldRef: componentRef, dropdownRef, gridWrapperStyle: props.gridLayout && gridElRef.current ? window.getComputedStyle(gridElRef.current) : void 0, handleOnSelect: onSelect, handleOnFilter: onFilter, handleOnKeydown: onInputKeyDown, handleOnBlur: () => onBlur, handleOnFocus: onFocus, opened, dataCombo, currents, dropdownWidth: dropdownMaxWidth || dropdownWidth || 0
|
|
228
|
+
opened && /* @__PURE__ */ jsx(Dropdown, { ...props, selected, selectFieldRef: componentRef, dropdownRef, gridWrapperStyle: props.gridLayout && gridElRef.current ? window.getComputedStyle(gridElRef.current) : void 0, handleOnSelect: onSelect, handleOnFilter: onFilter, handleOnKeydown: onInputKeyDown, handleOnBlur: () => onBlur, handleOnFocus: onFocus, opened, dataCombo, currents, dropdownWidth: dropdownMaxWidth || dropdownWidth || 0 }),
|
|
232
229
|
/* @__PURE__ */ jsx(Hint, { visible: !!hint && hintPosition === "below", customClass: "hint", description: hint })
|
|
233
230
|
] });
|
|
234
231
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/multiple/index.tsx"],"sourcesContent":["import { KeyboardEvent, useEffect, useRef, useState } from 'react';\nimport _ from 'lodash';\nimport * as uuid from 'uuid';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport Selecteds from './Selecteds';\nimport * as constants from '../../../internals/constants';\nimport InputTextBase from '../../base/InputTextBase';\nimport { getFilteredMultipleDataCombo } from '../helper';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { IMultipleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\nimport Hint from '../../../hint';\n\nconst MultipleSelect = (props: IMultipleSelectProps) => {\n const {\n idKey, dataSource = [], handlerClear, value = [], remoteSearch = false, descriptionKey,\n showClearButton, rightElements = [], hint, hintPosition = 'below', customClassForLabel,\n customClassForWrapper, customClassForInputContent, customClassForSideButtons, disabled = false,\n dropdownMaxWidth = undefined, onEndReached, onEndReachedThreshold, itemsCount,\n } = props;\n const [dataCombo, setDataCombo] = useState(dataSource);\n const [currents, setCurrents] = useState<DataCombo[]>([]);\n const [selected, setSelected] = useState<DataCombo>();\n const [inputValue, setInputValue] = useState<string[] | number[]>([]);\n const [opened, setOpened] = useState(false);\n const [dropdownWidth, setDropdownWidth] = useState(0);\n const [insideComponent, setInsideComponent] = useState(false);\n const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n const [valueFromProps, setValueFromProps] = useState<string[] | number[]>([]);\n\n const componentId = `select-component${uuid.v1()}`;\n const componentRef = useRef<HTMLInputElement>(null);\n const dropdownRef = useRef<HTMLInputElement>(null);\n const selectWrapper = useRef<HTMLDivElement | HTMLTextAreaElement>(null);\n const gridElRef = useRef<Element>(null);\n const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n const descriptionKeyIsString = typeof descriptionKey === 'string';\n const insideComponents =\n ['item', 'menubutton', 'filterinput', 'filtercontainer', 'label', 'actionbutton'];\n\n const onScreenResize = () => {\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n if (!insideComponents.includes((target as Element).className) &&\n target !== selectWrapper.current && selectWrapper.current &&\n !selectWrapper.current.contains(target as Node) &&\n dropdownRef.current && !dropdownRef.current.contains(target as Node)) {\n setOpened(false);\n }\n };\n\n const onMouseMove = (event: MouseEvent) => {\n const target = event.target as Element;\n const idDropdown = dropdownRef.current?.parentElement?.id || '';\n const dropdownElement = document.getElementById(idDropdown);\n const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n setInsideComponent(keepDropdownOpen);\n };\n\n const onClearClick = () => {\n setSelected(undefined);\n setCurrents([]);\n if (props.onSelect) props.onSelect();\n };\n\n const onFilter = (filteredValue: string) => {\n let selectedFilter = null;\n if (remoteSearch) {\n if (props.onSearch) props.onSearch(filteredValue);\n setOpened(true);\n setInputValue([filteredValue]);\n } else {\n let dataComboFilter = dataSource;\n if (filteredValue.length > 0) {\n dataComboFilter = getFilteredMultipleDataCombo({\n inputText: [filteredValue],\n dataSource,\n descriptionKey,\n currents,\n });\n }\n if (dataComboFilter && dataComboFilter.length > 0) selectedFilter = dataComboFilter[0];\n setDataCombo(dataComboFilter);\n setOpened(true);\n if (selectedFilter) setSelected(selectedFilter);\n setInputValue([filteredValue]);\n }\n };\n\n const onFocus = () => {\n const dropdownWidthFocus =\n selectWrapper.current ? selectWrapper.current.clientWidth : dropdownWidth;\n setOpened(true);\n setDropdownWidth(dropdownWidthFocus);\n };\n\n const onSelect = (select: DataCombo) => {\n if (select === null) return;\n const currentsSelect = [...currents, select];\n\n setCurrents(currentsSelect);\n setDataCombo(dataSource);\n setInputValue([]);\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n if (props.onSelect) setSelected(props.onSelect(currentsSelect.map(i => i[idKey])));\n dropdownRef.current?.focus();\n };\n\n const onUnselect = (id: string) => {\n if (currents) {\n const result = currents.filter(item => item[idKey] !== id);\n setCurrents(result);\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n if (props.onSelect) setSelected(props.onSelect(result.map(i => i[idKey])));\n dropdownRef.current?.focus();\n }\n };\n\n const onOpenClose = () => {\n setOpened(prevState => !prevState);\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onBlur = (e: CustomInputEvent) => {\n if (props.onBlur) props.onBlur(e);\n if (selected && opened) {\n onSelect(selected);\n }\n if (!insideComponent) {\n setOpened(false);\n setDataCombo(dataSource);\n }\n };\n\n const onInputKeyDown = (e: CustomInputEvent | KeyboardEvent) => {\n if (e.keyCode) {\n if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) \n && selected && opened) {\n if (e.keyCode === constants.keyCodes.ENTER) e.preventDefault?.();\n if (!currents.some(current => current[idKey] === selected[idKey])) {\n onSelect(selected);\n }\n } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n if (!opened) setOpened(true);\n let index = dataCombo ? dataCombo.findIndex(d => d === selected) : 0;\n if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n index = (dataCombo && index === dataCombo.length - 1 ? 0 : index + 1);\n } else {\n index = (dataCombo && index === 0 ? dataCombo.length - 1 : index - 1);\n }\n if (dataCombo && dataCombo.length) {\n if (descriptionKeyIsString && dataCombo[index][descriptionKey]) {\n setInputValue(dataCombo[index][descriptionKey]);\n } else if (!descriptionKeyIsString) setInputValue([descriptionKey(dataCombo[index])]);\n }\n if (dataCombo) setSelected(dataCombo[index]);\n } else if (e.keyCode === constants.keyCodes.BACKSPACE) {\n if (inputValue.length === 0) {\n const currentsKeyDown = _.dropRight(currents);\n setCurrents(currentsKeyDown);\n if (props.onSelect) props.onSelect(currentsKeyDown.map(i => i[idKey]));\n }\n } else if (e.keyCode === constants.keyCodes.TAB) {\n setOpened(false);\n }\n }\n };\n\n const setOnDenied = (denied: OnDenied) => {\n setOnDeniedSelect(denied);\n };\n\n const shouldDisable = () =>\n disabled ||\n (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n const shouldBeReadOnly = () => props.readOnly || (onDenied && (onDenied.readOnly));\n\n useEffect(() => {\n window.addEventListener('resize', onScreenResize);\n document.addEventListener('click', onClickOutside);\n document.addEventListener('mousemove', onMouseMove);\n if (handlerClear) onClearClick();\n\n return () => {\n window.removeEventListener('resize', onScreenResize);\n document.removeEventListener('click', onClickOutside);\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, []);\n\n useEffect(() => {\n if (props.gridLayout) {\n const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n if (gridElRef.current !== gridEl && gridEl) gridElRef.current = gridEl;\n }\n }, []);\n\n useEffect(() => {\n if (value.length > 0 && value !== valueFromProps && dataSource.length > 0) {\n const newCurrents = dataSource.filter((item: { [id: string]: string }) =>\n value.includes(item[idKey] as never));\n\n setValueFromProps(value);\n setCurrents(newCurrents);\n }\n }, [dataSource.length, value.length]);\n\n useEffect(() => {\n if (!_.isEqual(dataSource, dataCombo)) {\n const filteredDataCombo = remoteSearch\n ? dataSource\n : getFilteredMultipleDataCombo({\n currents, dataSource, descriptionKey, inputText: inputValue,\n });\n\n setDataCombo(filteredDataCombo);\n setSelected(filteredDataCombo.length > 0 ? dataCombo[0] : null);\n }\n }, [dataSource]);\n\n return (\n <span\n id={componentId}\n ref={componentRef}\n className=\"select-component\">\n <InputTextBase\n {...props}\n inputRef={(ref) => {\n if (props.inputRef) {\n if (!_.isFunction(props.inputRef)) {\n props.inputRef.current = ref;\n } else {\n props.inputRef(ref);\n }\n }\n inputTextRef.current = ref;\n }}\n autoComplete=\"off\"\n value={inputValue.toString()}\n readOnly={shouldBeReadOnly()}\n onFocus={() => { onFocus(); }}\n onBlur={(e: CustomInputEvent) => { onBlur(e); }}\n onChange={(e?: CustomInputEvent) => {\n if (e) onFilter(e.target.value);\n }}\n onClick={onFocus}\n onKeyDown={onInputKeyDown}\n customClassForLabel={customClassForLabel}\n customClassForWrapper={\n `selectwrapper ${(props.readOnly || shouldDisable() || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n }\n customClassForInputContent={`multiselect ${customClassForInputContent}`}\n inputBaseRef={(r: HTMLDivElement | HTMLTextAreaElement) => { selectWrapper.current = r; }}\n handlerSetOnDenied={setOnDenied}\n rightElements={[\n ...rightElements,\n <ActionButtons\n key=\"action-buttons-multiselect\"\n showClearButton={showClearButton}\n disabled={shouldDisable() || shouldBeReadOnly()}\n dropDownOpened={opened}\n handlerClear={() => {\n if (shouldDisable()) return null;\n return onClearClick();\n }}\n handlerOpenClose={onOpenClose}\n customClassForSideButtons={customClassForSideButtons} />,\n ]}>\n <Selecteds\n {...props}\n currents={currents}\n handlerOnUnselect={onUnselect} />\n </InputTextBase>\n {opened &&\n <Dropdown\n {...props}\n selected={selected}\n selectFieldRef={componentRef}\n dropdownRef={dropdownRef}\n gridWrapperStyle={props.gridLayout && gridElRef.current\n ? window.getComputedStyle(gridElRef.current)\n : undefined}\n handleOnSelect={onSelect}\n handleOnFilter={onFilter}\n handleOnKeydown={onInputKeyDown}\n handleOnBlur={() => onBlur}\n handleOnFocus={onFocus}\n opened={opened}\n dataCombo={dataCombo}\n currents={currents}\n dropdownWidth={dropdownMaxWidth || dropdownWidth || 0}\n onEndReached={onEndReached}\n onEndReachedThreshold={onEndReachedThreshold}\n itemsCount={itemsCount} />\n }\n <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n </span>\n );\n};\n\nexport default MultipleSelect;\n"],"names":["MultipleSelect","props","idKey","dataSource","handlerClear","value","remoteSearch","descriptionKey","showClearButton","rightElements","hint","hintPosition","customClassForLabel","customClassForWrapper","customClassForInputContent","customClassForSideButtons","disabled","dropdownMaxWidth","undefined","onEndReached","onEndReachedThreshold","itemsCount","dataCombo","setDataCombo","useState","currents","setCurrents","selected","setSelected","inputValue","setInputValue","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","valueFromProps","setValueFromProps","componentId","uuid","v1","componentRef","useRef","dropdownRef","selectWrapper","gridElRef","inputTextRef","descriptionKeyIsString","insideComponents","onScreenResize","current","clientWidth","onClickOutside","event","target","includes","className","contains","onMouseMove","idDropdown","parentElement","id","dropdownElement","document","getElementById","keepDropdownOpen","Boolean","onClearClick","onSelect","onFilter","filteredValue","selectedFilter","onSearch","dataComboFilter","length","getFilteredMultipleDataCombo","inputText","onFocus","dropdownWidthFocus","select","currentsSelect","focus","map","i","onUnselect","result","filter","item","onOpenClose","prevState","onBlur","e","onInputKeyDown","keyCode","constants","ENTER","key","TAB","preventDefault","some","ARROW_UP","ARROW_DOWN","index","findIndex","d","BACKSPACE","currentsKeyDown","_","dropRight","setOnDenied","denied","shouldDisable","hideContent","shouldBeReadOnly","readOnly","useEffect","window","addEventListener","removeEventListener","gridLayout","gridEl","querySelector","newCurrents","isEqual","filteredDataCombo","ref","inputRef","isFunction","toString","r","getComputedStyle"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/multiple/index.tsx"],"sourcesContent":["import { KeyboardEvent, useEffect, useRef, useState } from 'react';\nimport _ from 'lodash';\nimport * as uuid from 'uuid';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport Selecteds from './Selecteds';\nimport * as constants from '../../../internals/constants';\nimport InputTextBase from '../../base/InputTextBase';\nimport { getFilteredMultipleDataCombo } from '../helper';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { IMultipleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\nimport Hint from '../../../hint';\n\nconst MultipleSelect = (props: IMultipleSelectProps) => {\n const {\n idKey, dataSource = [], handlerClear, value = [], remoteSearch = false, descriptionKey,\n showClearButton, rightElements = [], hint, hintPosition = 'below', customClassForLabel,\n customClassForWrapper, customClassForInputContent, customClassForSideButtons, disabled = false,\n dropdownMaxWidth = undefined,\n } = props;\n const [dataCombo, setDataCombo] = useState(dataSource);\n const [currents, setCurrents] = useState<DataCombo[]>([]);\n const [selected, setSelected] = useState<DataCombo>();\n const [inputValue, setInputValue] = useState<string[] | number[]>([]);\n const [opened, setOpened] = useState(false);\n const [dropdownWidth, setDropdownWidth] = useState(0);\n const [insideComponent, setInsideComponent] = useState(false);\n const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n const [valueFromProps, setValueFromProps] = useState<string[] | number[]>([]);\n\n const componentId = `select-component${uuid.v1()}`;\n const componentRef = useRef<HTMLInputElement>(null);\n const dropdownRef = useRef<HTMLInputElement>(null);\n const selectWrapper = useRef<HTMLDivElement | HTMLTextAreaElement>(null);\n const gridElRef = useRef<Element>(null);\n const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n const descriptionKeyIsString = typeof descriptionKey === 'string';\n const insideComponents =\n ['item', 'menubutton', 'filterinput', 'filtercontainer', 'label', 'actionbutton'];\n\n const onScreenResize = () => {\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n if (!insideComponents.includes((target as Element).className) &&\n target !== selectWrapper.current && selectWrapper.current &&\n !selectWrapper.current.contains(target as Node) &&\n dropdownRef.current && !dropdownRef.current.contains(target as Node)) {\n setOpened(false);\n }\n };\n\n const onMouseMove = (event: MouseEvent) => {\n const target = event.target as Element;\n const idDropdown = dropdownRef.current?.parentElement?.id || '';\n const dropdownElement = document.getElementById(idDropdown);\n const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n setInsideComponent(keepDropdownOpen);\n };\n\n const onClearClick = () => {\n setSelected(undefined);\n setCurrents([]);\n if (props.onSelect) props.onSelect();\n };\n\n const onFilter = (filteredValue: string) => {\n let selectedFilter = null;\n if (remoteSearch) {\n if (props.onSearch) props.onSearch(filteredValue);\n setOpened(true);\n setInputValue([filteredValue]);\n } else {\n let dataComboFilter = dataSource;\n if (filteredValue.length > 0) {\n dataComboFilter = getFilteredMultipleDataCombo({\n inputText: [filteredValue],\n dataSource,\n descriptionKey,\n currents,\n });\n }\n if (dataComboFilter && dataComboFilter.length > 0) selectedFilter = dataComboFilter[0];\n setDataCombo(dataComboFilter);\n setOpened(true);\n if (selectedFilter) setSelected(selectedFilter);\n setInputValue([filteredValue]);\n }\n };\n\n const onFocus = () => {\n const dropdownWidthFocus =\n selectWrapper.current ? selectWrapper.current.clientWidth : dropdownWidth;\n setOpened(true);\n setDropdownWidth(dropdownWidthFocus);\n };\n\n const onSelect = (select: DataCombo) => {\n if (select === null) return;\n const currentsSelect = [...currents, select];\n\n setCurrents(currentsSelect);\n setDataCombo(dataSource);\n setInputValue([]);\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n if (props.onSelect) setSelected(props.onSelect(currentsSelect.map(i => i[idKey])));\n dropdownRef.current?.focus();\n };\n\n const onUnselect = (id: string) => {\n if (currents) {\n const result = currents.filter(item => item[idKey] !== id);\n setCurrents(result);\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n if (props.onSelect) setSelected(props.onSelect(result.map(i => i[idKey])));\n dropdownRef.current?.focus();\n }\n };\n\n const onOpenClose = () => {\n setOpened(prevState => !prevState);\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onBlur = (e: CustomInputEvent) => {\n if (props.onBlur) props.onBlur(e);\n if (selected && opened) {\n onSelect(selected);\n }\n if (!insideComponent) {\n setOpened(false);\n setDataCombo(dataSource);\n }\n };\n\n const onInputKeyDown = (e: CustomInputEvent | KeyboardEvent) => {\n if (e.keyCode) {\n if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) \n && selected && opened) {\n if (e.keyCode === constants.keyCodes.ENTER) e.preventDefault?.();\n if (!currents.some(current => current[idKey] === selected[idKey])) {\n onSelect(selected);\n }\n } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n if (!opened) setOpened(true);\n let index = dataCombo ? dataCombo.findIndex(d => d === selected) : 0;\n if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n index = (dataCombo && index === dataCombo.length - 1 ? 0 : index + 1);\n } else {\n index = (dataCombo && index === 0 ? dataCombo.length - 1 : index - 1);\n }\n if (dataCombo && dataCombo.length) {\n if (descriptionKeyIsString && dataCombo[index][descriptionKey]) {\n setInputValue(dataCombo[index][descriptionKey]);\n } else if (!descriptionKeyIsString) setInputValue([descriptionKey(dataCombo[index])]);\n }\n if (dataCombo) setSelected(dataCombo[index]);\n } else if (e.keyCode === constants.keyCodes.BACKSPACE) {\n if (inputValue.length === 0) {\n const currentsKeyDown = _.dropRight(currents);\n setCurrents(currentsKeyDown);\n if (props.onSelect) props.onSelect(currentsKeyDown.map(i => i[idKey]));\n }\n } else if (e.keyCode === constants.keyCodes.TAB) {\n setOpened(false);\n }\n }\n };\n\n const setOnDenied = (denied: OnDenied) => {\n setOnDeniedSelect(denied);\n };\n\n const shouldDisable = () =>\n disabled ||\n (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n const shouldBeReadOnly = () => props.readOnly || (onDenied && (onDenied.readOnly));\n\n useEffect(() => {\n window.addEventListener('resize', onScreenResize);\n document.addEventListener('click', onClickOutside);\n document.addEventListener('mousemove', onMouseMove);\n if (handlerClear) onClearClick();\n\n return () => {\n window.removeEventListener('resize', onScreenResize);\n document.removeEventListener('click', onClickOutside);\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, []);\n\n useEffect(() => {\n if (props.gridLayout) {\n const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n if (gridElRef.current !== gridEl && gridEl) gridElRef.current = gridEl;\n }\n }, []);\n\n useEffect(() => {\n if (value.length > 0 && value !== valueFromProps && dataSource.length > 0) {\n const newCurrents = dataSource.filter((item: { [id: string]: string }) =>\n value.includes(item[idKey] as never));\n\n setValueFromProps(value);\n setCurrents(newCurrents);\n }\n }, [dataSource.length, value.length]);\n\n useEffect(() => {\n if (!_.isEqual(dataSource, dataCombo)) {\n const filteredDataCombo = remoteSearch\n ? dataSource\n : getFilteredMultipleDataCombo({\n currents, dataSource, descriptionKey, inputText: inputValue,\n });\n\n setDataCombo(filteredDataCombo);\n setSelected(filteredDataCombo.length > 0 ? dataCombo[0] : null);\n }\n }, [dataSource]);\n\n return (\n <span\n id={componentId}\n ref={componentRef}\n className=\"select-component\">\n <InputTextBase\n {...props}\n inputRef={(ref) => {\n if (props.inputRef) {\n if (!_.isFunction(props.inputRef)) {\n props.inputRef.current = ref;\n } else {\n props.inputRef(ref);\n }\n }\n inputTextRef.current = ref;\n }}\n autoComplete=\"off\"\n value={inputValue.toString()}\n readOnly={shouldBeReadOnly()}\n onFocus={() => { onFocus(); }}\n onBlur={(e: CustomInputEvent) => { onBlur(e); }}\n onChange={(e?: CustomInputEvent) => {\n if (e) onFilter(e.target.value);\n }}\n onClick={onFocus}\n onKeyDown={onInputKeyDown}\n customClassForLabel={customClassForLabel}\n customClassForWrapper={\n `selectwrapper ${(props.readOnly || shouldDisable() || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n }\n customClassForInputContent={`multiselect ${customClassForInputContent}`}\n inputBaseRef={(r: HTMLDivElement | HTMLTextAreaElement) => { selectWrapper.current = r; }}\n handlerSetOnDenied={setOnDenied}\n rightElements={[\n ...rightElements,\n <ActionButtons\n key=\"action-buttons-multiselect\"\n showClearButton={showClearButton}\n disabled={shouldDisable() || shouldBeReadOnly()}\n dropDownOpened={opened}\n handlerClear={() => {\n if (shouldDisable()) return null;\n return onClearClick();\n }}\n handlerOpenClose={onOpenClose}\n customClassForSideButtons={customClassForSideButtons} />,\n ]}>\n <Selecteds\n {...props}\n currents={currents}\n handlerOnUnselect={onUnselect} />\n </InputTextBase>\n {opened &&\n <Dropdown\n {...props}\n selected={selected}\n selectFieldRef={componentRef}\n dropdownRef={dropdownRef}\n gridWrapperStyle={props.gridLayout && gridElRef.current\n ? window.getComputedStyle(gridElRef.current)\n : undefined}\n handleOnSelect={onSelect}\n handleOnFilter={onFilter}\n handleOnKeydown={onInputKeyDown}\n handleOnBlur={() => onBlur}\n handleOnFocus={onFocus}\n opened={opened}\n dataCombo={dataCombo}\n currents={currents}\n dropdownWidth={dropdownMaxWidth || dropdownWidth || 0} />\n }\n <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n </span>\n );\n};\n\nexport default MultipleSelect;\n"],"names":["MultipleSelect","props","idKey","dataSource","handlerClear","value","remoteSearch","descriptionKey","showClearButton","rightElements","hint","hintPosition","customClassForLabel","customClassForWrapper","customClassForInputContent","customClassForSideButtons","disabled","dropdownMaxWidth","undefined","dataCombo","setDataCombo","useState","currents","setCurrents","selected","setSelected","inputValue","setInputValue","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","valueFromProps","setValueFromProps","componentId","uuid","v1","componentRef","useRef","dropdownRef","selectWrapper","gridElRef","inputTextRef","descriptionKeyIsString","insideComponents","onScreenResize","current","clientWidth","onClickOutside","event","target","includes","className","contains","onMouseMove","idDropdown","parentElement","id","dropdownElement","document","getElementById","keepDropdownOpen","Boolean","onClearClick","onSelect","onFilter","filteredValue","selectedFilter","onSearch","dataComboFilter","length","getFilteredMultipleDataCombo","inputText","onFocus","dropdownWidthFocus","select","currentsSelect","focus","map","i","onUnselect","result","filter","item","onOpenClose","prevState","onBlur","e","onInputKeyDown","keyCode","constants","ENTER","key","TAB","preventDefault","some","ARROW_UP","ARROW_DOWN","index","findIndex","d","BACKSPACE","currentsKeyDown","_","dropRight","setOnDenied","denied","shouldDisable","hideContent","shouldBeReadOnly","readOnly","useEffect","window","addEventListener","removeEventListener","gridLayout","gridEl","querySelector","newCurrents","isEqual","filteredDataCombo","ref","inputRef","isFunction","toString","r","getComputedStyle"],"mappings":"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"}
|
|
@@ -31,10 +31,7 @@ const SimpleSelect = (props) => {
|
|
|
31
31
|
customClassForInputContent,
|
|
32
32
|
customClassForLabel,
|
|
33
33
|
customClassForSideButtons,
|
|
34
|
-
dropdownMaxWidth = void 0
|
|
35
|
-
onEndReached,
|
|
36
|
-
onEndReachedThreshold,
|
|
37
|
-
itemsCount
|
|
34
|
+
dropdownMaxWidth = void 0
|
|
38
35
|
} = props;
|
|
39
36
|
const descriptionKeyIsString = typeof descriptionKey === "string";
|
|
40
37
|
const dataSourceWithAllOptions = allOptions ? [{
|
|
@@ -261,7 +258,7 @@ const SimpleSelect = (props) => {
|
|
|
261
258
|
}, handlerOpenClose: onOpenClose, customClassForSideButtons }, "action-buttons-simpleselect")] }),
|
|
262
259
|
opened && /* @__PURE__ */ jsx(Dropdown, { ...props, opened, selected, inputValue: inputText, selectFieldRef: componentRef, dropdownRef, searchOnDropdown, gridWrapperStyle: gridLayout && gridElement.current ? window.getComputedStyle(gridElement.current) : void 0, handleOnSelect: (dataSelected) => {
|
|
263
260
|
if (dataSelected) onSelect(dataSelected);
|
|
264
|
-
}, handleOnFilter: (valueFilter_0) => onFilter(valueFilter_0), handleOnKeydown: onInputKeyDown, handleOnBlur: () => onBlur, handleOnFocus: onFocus, dataCombo, searchNotFoundText, dropdownWidth: dropdownMaxWidth || dropdownWidth || 0
|
|
261
|
+
}, handleOnFilter: (valueFilter_0) => onFilter(valueFilter_0), handleOnKeydown: onInputKeyDown, handleOnBlur: () => onBlur, handleOnFocus: onFocus, dataCombo, searchNotFoundText, dropdownWidth: dropdownMaxWidth || dropdownWidth || 0 })
|
|
265
262
|
] });
|
|
266
263
|
};
|
|
267
264
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/simple/index.tsx"],"sourcesContent":["import { KeyboardEvent as KeyboardEventReact, useEffect, useRef, useState } from 'react';\nimport * as uuid from 'uuid';\nimport _ from 'lodash';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport * as constants from '../../../internals/constants';\nimport { getFilteredSimpleDataCombo } from '../helper';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport InputTextBase from '../../base/InputTextBase';\nimport { ISimpleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\n\nconst SimpleSelect = (props: ISimpleSelectProps) => {\n const {\n value, descriptionKey, dataSource = [], gridLayout, onSearch, disabled, readOnly,\n openDropdownOnFocus = true, selectFirstOnEnter = false, idKey, remoteSearch = false, name = '',\n undigitable, searchOnDropdown = false, allOptions = undefined, showClearButton = false,\n searchNotFoundText, rightElements = [], customClassForWrapper, customClassForInputContent, \n customClassForLabel, customClassForSideButtons, dropdownMaxWidth = undefined,\n onEndReached, onEndReachedThreshold, itemsCount,\n } = props;\n\n const descriptionKeyIsString = typeof descriptionKey === 'string';\n const dataSourceWithAllOptions = allOptions\n ? [{\n [idKey]: allOptions.idValue,\n [descriptionKeyIsString ?\n descriptionKey :\n descriptionKey(allOptions.label)]: allOptions.label,\n }, ...dataSource]\n : dataSource;\n const [dataCombo, setDataCombo] = useState<DataCombo[]>(dataSourceWithAllOptions);\n const [selected, setSelected] = useState<DataCombo | null>(null);\n const [inputText, setInputText] = useState('');\n const [opened, setOpened] = useState(false);\n const [dropdownWidth, setDropdownWidth] = useState(0);\n const [insideComponent, setInsideComponent] = useState(false);\n const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n const [isTyping, setIsTyping] = useState(false);\n\n const dropdownRef = useRef<HTMLDivElement>(null);\n const componentId = `select-component-${name}-${uuid.v1()}`;\n const componentRef = useRef<HTMLInputElement>(null);\n const selectWrapper = useRef<HTMLDivElement>(null);\n const gridElement = useRef<Element>(null);\n const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n\n const onScreenResize = () => {\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n if (target !== selectWrapper.current && !selectWrapper.current?.contains(target as Node) &&\n !dropdownRef.current?.contains(target as Node)) {\n setOpened(false);\n }\n };\n\n const onMouseMove = (event: MouseEvent) => {\n const target = event.target as Element;\n const idDropdown = dropdownRef.current?.parentElement?.id || '';\n const dropdownElement = document.getElementById(idDropdown);\n const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n setInsideComponent(keepDropdownOpen);\n };\n\n const getSelectEvent = (selectedEvent?: DataCombo) => (\n {\n target: {\n value: selectedEvent ? selectedEvent[idKey] : undefined,\n name,\n },\n }\n );\n\n const onChange = (selectedChange?: DataCombo) => {\n if (props.onChange) {\n const event = getSelectEvent(selectedChange);\n props.onChange(event);\n }\n };\n\n const onFilter = (valueFilter: string) => {\n let selectedFilter = null;\n if (remoteSearch) {\n if (onSearch) onSearch(valueFilter);\n } else {\n const dataComboFilter = getFilteredSimpleDataCombo({\n inputText: valueFilter,\n descriptionKey,\n dataSource: dataSourceWithAllOptions,\n });\n\n if (dataComboFilter && dataComboFilter.length > 0) {\n selectedFilter = dataComboFilter[0];\n setSelected(selectedFilter);\n }\n setDataCombo(dataComboFilter);\n }\n setOpened(true);\n setInputText(valueFilter);\n if (selectedFilter) {\n if ((descriptionKeyIsString && valueFilter === selectedFilter[descriptionKey])\n || (!descriptionKeyIsString && valueFilter === descriptionKey(selectedFilter))) {\n onChange(selectedFilter);\n }\n }\n };\n\n const onSelect = (selectedDropdown: DataCombo) => {\n if (!selectedDropdown) return;\n setSelected(selectedDropdown);\n\n if (descriptionKeyIsString) setInputText(selectedDropdown[descriptionKey]);\n else setInputText(descriptionKey(selectedDropdown));\n new Promise((resolve) => {\n resolve(onChange(selectedDropdown));\n }).finally(() => {\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n });\n dropdownRef.current?.focus();\n };\n\n const onOpenClose = () => {\n setOpened(prevState => !prevState);\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onFocus = () => {\n if (openDropdownOnFocus) setOpened(true);\n if (selectWrapper) {\n const dropdownWidthFocus = selectWrapper.current ? selectWrapper.current.clientWidth : 0;\n setDropdownWidth(dropdownWidthFocus);\n }\n };\n\n const onBlur = () => {\n if (props.onBlur) {\n const event = getSelectEvent(selected);\n props.onBlur(event);\n if (selected && (descriptionKeyIsString && inputText !== selected[descriptionKey])\n || (!descriptionKeyIsString && inputText !== descriptionKey(selected))) {\n setSelected(null);\n setInputText(inputText);\n new Promise((resolve) => {\n resolve(onChange(null));\n }).finally(() => {\n onChange();\n });\n }\n }\n if (!insideComponent) {\n setOpened(false);\n setIsTyping(false);\n setDataCombo(dataSourceWithAllOptions);\n }\n };\n\n const onInputKeyDown = (e: CustomInputEvent | KeyboardEventReact) => {\n if (e.keyCode) {\n if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) && \n selected && opened) {\n if (e.keyCode === constants.keyCodes.ENTER) e.preventDefault?.();\n onSelect(selected);\n } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n if (!opened) setOpened(true);\n let index = dataCombo.length > 0\n ? dataCombo.findIndex(d => selected &&\n d[idKey] === selected[idKey])\n : 0;\n if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n index = (dataCombo\n && index === dataCombo.length - 1\n ? 0\n : index + 1);\n } else {\n index = (dataCombo\n && index === 0\n ? dataCombo?.length - 1\n : index - 1);\n }\n setSelected(dataCombo[index]);\n if (descriptionKeyIsString) setInputText(dataCombo[index][descriptionKey]);\n if (!descriptionKeyIsString) setInputText(descriptionKey(dataCombo[index]));\n }\n }\n if (!isTyping) setIsTyping(true);\n };\n\n const onClearClick = () => {\n new Promise((resolve) => {\n resolve(onChange(null));\n }).finally(() => {\n setSelected(null);\n setInputText('');\n onChange();\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n });\n };\n\n const setOnDenied = (onDeniedSelect: OnDenied) => {\n setOnDeniedSelect(onDeniedSelect);\n };\n\n const shouldDisable = () =>\n disabled || (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n const shouldBeReadOnly = () => readOnly || (onDenied && (onDenied.readOnly));\n\n useEffect(() => {\n window.addEventListener('resize', onScreenResize);\n document.addEventListener('click', onClickOutside);\n document.addEventListener('mousemove', onMouseMove);\n\n return () => {\n window.removeEventListener('resize', onScreenResize);\n document.removeEventListener('click', onClickOutside);\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, []);\n\n useEffect(() => {\n if (gridLayout) {\n const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n if (gridElement.current !== gridEl && gridEl) gridElement.current = gridEl;\n }\n }, [gridLayout]);\n\n useEffect(() => {\n if (dataSourceWithAllOptions.length > 0) {\n let newCurrent = null;\n if (value || value === 0) {\n newCurrent = dataSourceWithAllOptions.find(i => (value || value === 0)\n && i[idKey]?.toString().toLowerCase() === value?.toString().toLowerCase());\n } else if (dataSourceWithAllOptions.length > 0 && selectFirstOnEnter) {\n newCurrent = dataSourceWithAllOptions[0];\n }\n\n setSelected(newCurrent);\n if (descriptionKeyIsString) setInputText(newCurrent ? newCurrent[descriptionKey] : '');\n else setInputText(newCurrent ? descriptionKey(newCurrent) : '');\n }\n\n if (dataSourceWithAllOptions.length === 0 && inputText) {\n setInputText('');\n }\n }, [dataSourceWithAllOptions.length, value]);\n\n useEffect(() => {\n if (!_.isEqual(dataCombo, dataSourceWithAllOptions)) {\n const dataComboFilteredSimple = (undigitable || remoteSearch || !isTyping) ?\n dataSourceWithAllOptions\n : getFilteredSimpleDataCombo({\n inputText, dataSource: dataSourceWithAllOptions, descriptionKey,\n });\n setDataCombo(dataComboFilteredSimple);\n if (dataSourceWithAllOptions.length > 0 && remoteSearch) {\n const data = dataSourceWithAllOptions[0];\n setSelected(data);\n }\n }\n\n if (allOptions) {\n setDataCombo([\n {\n [idKey]: allOptions.idValue,\n [descriptionKeyIsString ?\n descriptionKey :\n descriptionKey(allOptions.label)]: allOptions.label,\n },\n ...dataSource,\n ]);\n }\n }, [JSON.stringify(dataSourceWithAllOptions)]);\n\n return (\n <span\n id={componentId}\n ref={componentRef}\n className=\"select-component\">\n <InputTextBase\n {...props}\n inputRef={(ref) => {\n if (props.inputRef) {\n if (!_.isFunction(props.inputRef)) {\n props.inputRef.current = ref;\n } else {\n props.inputRef(ref);\n }\n }\n inputTextRef.current = ref;\n }}\n autoComplete=\"off\"\n readOnly={undigitable || shouldBeReadOnly()}\n value={inputText}\n onFocus={onFocus}\n onBlur={onBlur}\n onChange={(e?: CustomInputEvent) => {\n if (e) onFilter(e.target.value);\n }}\n onClick={onFocus}\n onKeyDown={onInputKeyDown}\n customClassForLabel={customClassForLabel}\n customClassForWrapper={\n `selectwrapper ${(undigitable || searchOnDropdown || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n }\n customClassForInputContent={`multiselect ${customClassForInputContent}`}\n inputBaseRef={(r: HTMLDivElement) => { selectWrapper.current = r; }}\n handlerSetOnDenied={(inputOnDenied: OnDenied) => setOnDenied(inputOnDenied)}\n rightElements={[\n ...rightElements,\n <ActionButtons\n key=\"action-buttons-simpleselect\"\n disabled={shouldDisable() || shouldBeReadOnly()}\n showClearButton={showClearButton}\n dropDownOpened={opened}\n handlerClear={() => {\n if (shouldDisable()) return null;\n return onClearClick();\n }}\n handlerOpenClose={onOpenClose}\n customClassForSideButtons={customClassForSideButtons} />,\n ]} />\n {opened &&\n <Dropdown\n {...props}\n opened={opened}\n selected={selected}\n inputValue={inputText}\n selectFieldRef={componentRef}\n dropdownRef={dropdownRef}\n searchOnDropdown={searchOnDropdown}\n gridWrapperStyle={gridLayout && gridElement.current ?\n window.getComputedStyle(gridElement.current)\n : undefined}\n handleOnSelect={(dataSelected?: DataCombo) => {\n if (dataSelected) onSelect(dataSelected);\n }}\n handleOnFilter={(valueFilter: string) => onFilter(valueFilter)}\n handleOnKeydown={onInputKeyDown}\n handleOnBlur={() => onBlur}\n handleOnFocus={onFocus}\n dataCombo={dataCombo}\n searchNotFoundText={searchNotFoundText}\n dropdownWidth={dropdownMaxWidth || dropdownWidth || 0}\n onEndReached={onEndReached}\n onEndReachedThreshold={onEndReachedThreshold}\n itemsCount={itemsCount} />\n }\n </span>\n );\n};\nexport default SimpleSelect;\n"],"names":["SimpleSelect","props","value","descriptionKey","dataSource","gridLayout","onSearch","disabled","readOnly","openDropdownOnFocus","selectFirstOnEnter","idKey","remoteSearch","name","undigitable","searchOnDropdown","allOptions","undefined","showClearButton","searchNotFoundText","rightElements","customClassForWrapper","customClassForInputContent","customClassForLabel","customClassForSideButtons","dropdownMaxWidth","onEndReached","onEndReachedThreshold","itemsCount","descriptionKeyIsString","dataSourceWithAllOptions","idValue","label","dataCombo","setDataCombo","useState","selected","setSelected","inputText","setInputText","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","isTyping","setIsTyping","dropdownRef","useRef","componentId","uuid","componentRef","selectWrapper","gridElement","inputTextRef","onScreenResize","current","clientWidth","onClickOutside","event","target","contains","onMouseMove","idDropdown","parentElement","id","dropdownElement","document","getElementById","keepDropdownOpen","Boolean","getSelectEvent","selectedEvent","onChange","selectedChange","onFilter","valueFilter","selectedFilter","dataComboFilter","getFilteredSimpleDataCombo","length","onSelect","selectedDropdown","Promise","resolve","finally","focus","onOpenClose","prevState","onFocus","dropdownWidthFocus","onBlur","onInputKeyDown","e","keyCode","constants","ENTER","key","TAB","preventDefault","ARROW_UP","ARROW_DOWN","includes","index","findIndex","d","onClearClick","setOnDenied","onDeniedSelect","shouldDisable","hideContent","shouldBeReadOnly","useEffect","window","addEventListener","removeEventListener","gridEl","querySelector","newCurrent","find","i","toString","toLowerCase","_","isEqual","dataComboFilteredSimple","data","JSON","stringify","ref","inputRef","isFunction","r","inputOnDenied","getComputedStyle","dataSelected"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/simple/index.tsx"],"sourcesContent":["import { KeyboardEvent as KeyboardEventReact, useEffect, useRef, useState } from 'react';\nimport * as uuid from 'uuid';\nimport _ from 'lodash';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport * as constants from '../../../internals/constants';\nimport { getFilteredSimpleDataCombo } from '../helper';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport InputTextBase from '../../base/InputTextBase';\nimport { ISimpleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\n\nconst SimpleSelect = (props: ISimpleSelectProps) => {\n const {\n value, descriptionKey, dataSource = [], gridLayout, onSearch, disabled, readOnly,\n openDropdownOnFocus = true, selectFirstOnEnter = false, idKey, remoteSearch = false, name = '',\n undigitable, searchOnDropdown = false, allOptions = undefined, showClearButton = false,\n searchNotFoundText, rightElements = [], customClassForWrapper, customClassForInputContent, \n customClassForLabel, customClassForSideButtons, dropdownMaxWidth = undefined,\n } = props;\n\n const descriptionKeyIsString = typeof descriptionKey === 'string';\n const dataSourceWithAllOptions = allOptions\n ? [{\n [idKey]: allOptions.idValue,\n [descriptionKeyIsString ?\n descriptionKey :\n descriptionKey(allOptions.label)]: allOptions.label,\n }, ...dataSource]\n : dataSource;\n const [dataCombo, setDataCombo] = useState<DataCombo[]>(dataSourceWithAllOptions);\n const [selected, setSelected] = useState<DataCombo | null>(null);\n const [inputText, setInputText] = useState('');\n const [opened, setOpened] = useState(false);\n const [dropdownWidth, setDropdownWidth] = useState(0);\n const [insideComponent, setInsideComponent] = useState(false);\n const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n const [isTyping, setIsTyping] = useState(false);\n\n const dropdownRef = useRef<HTMLDivElement>(null);\n const componentId = `select-component-${name}-${uuid.v1()}`;\n const componentRef = useRef<HTMLInputElement>(null);\n const selectWrapper = useRef<HTMLDivElement>(null);\n const gridElement = useRef<Element>(null);\n const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n\n const onScreenResize = () => {\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n if (target !== selectWrapper.current && !selectWrapper.current?.contains(target as Node) &&\n !dropdownRef.current?.contains(target as Node)) {\n setOpened(false);\n }\n };\n\n const onMouseMove = (event: MouseEvent) => {\n const target = event.target as Element;\n const idDropdown = dropdownRef.current?.parentElement?.id || '';\n const dropdownElement = document.getElementById(idDropdown);\n const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n setInsideComponent(keepDropdownOpen);\n };\n\n const getSelectEvent = (selectedEvent?: DataCombo) => (\n {\n target: {\n value: selectedEvent ? selectedEvent[idKey] : undefined,\n name,\n },\n }\n );\n\n const onChange = (selectedChange?: DataCombo) => {\n if (props.onChange) {\n const event = getSelectEvent(selectedChange);\n props.onChange(event);\n }\n };\n\n const onFilter = (valueFilter: string) => {\n let selectedFilter = null;\n if (remoteSearch) {\n if (onSearch) onSearch(valueFilter);\n } else {\n const dataComboFilter = getFilteredSimpleDataCombo({\n inputText: valueFilter,\n descriptionKey,\n dataSource: dataSourceWithAllOptions,\n });\n\n if (dataComboFilter && dataComboFilter.length > 0) {\n selectedFilter = dataComboFilter[0];\n setSelected(selectedFilter);\n }\n setDataCombo(dataComboFilter);\n }\n setOpened(true);\n setInputText(valueFilter);\n if (selectedFilter) {\n if ((descriptionKeyIsString && valueFilter === selectedFilter[descriptionKey])\n || (!descriptionKeyIsString && valueFilter === descriptionKey(selectedFilter))) {\n onChange(selectedFilter);\n }\n }\n };\n\n const onSelect = (selectedDropdown: DataCombo) => {\n if (!selectedDropdown) return;\n setSelected(selectedDropdown);\n\n if (descriptionKeyIsString) setInputText(selectedDropdown[descriptionKey]);\n else setInputText(descriptionKey(selectedDropdown));\n new Promise((resolve) => {\n resolve(onChange(selectedDropdown));\n }).finally(() => {\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n });\n dropdownRef.current?.focus();\n };\n\n const onOpenClose = () => {\n setOpened(prevState => !prevState);\n if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n };\n\n const onFocus = () => {\n if (openDropdownOnFocus) setOpened(true);\n if (selectWrapper) {\n const dropdownWidthFocus = selectWrapper.current ? selectWrapper.current.clientWidth : 0;\n setDropdownWidth(dropdownWidthFocus);\n }\n };\n\n const onBlur = () => {\n if (props.onBlur) {\n const event = getSelectEvent(selected);\n props.onBlur(event);\n if (selected && (descriptionKeyIsString && inputText !== selected[descriptionKey])\n || (!descriptionKeyIsString && inputText !== descriptionKey(selected))) {\n setSelected(null);\n setInputText(inputText);\n new Promise((resolve) => {\n resolve(onChange(null));\n }).finally(() => {\n onChange();\n });\n }\n }\n if (!insideComponent) {\n setOpened(false);\n setIsTyping(false);\n setDataCombo(dataSourceWithAllOptions);\n }\n };\n\n const onInputKeyDown = (e: CustomInputEvent | KeyboardEventReact) => {\n if (e.keyCode) {\n if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) && \n selected && opened) {\n if (e.keyCode === constants.keyCodes.ENTER) e.preventDefault?.();\n onSelect(selected);\n } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n if (!opened) setOpened(true);\n let index = dataCombo.length > 0\n ? dataCombo.findIndex(d => selected &&\n d[idKey] === selected[idKey])\n : 0;\n if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n index = (dataCombo\n && index === dataCombo.length - 1\n ? 0\n : index + 1);\n } else {\n index = (dataCombo\n && index === 0\n ? dataCombo?.length - 1\n : index - 1);\n }\n setSelected(dataCombo[index]);\n if (descriptionKeyIsString) setInputText(dataCombo[index][descriptionKey]);\n if (!descriptionKeyIsString) setInputText(descriptionKey(dataCombo[index]));\n }\n }\n if (!isTyping) setIsTyping(true);\n };\n\n const onClearClick = () => {\n new Promise((resolve) => {\n resolve(onChange(null));\n }).finally(() => {\n setSelected(null);\n setInputText('');\n onChange();\n if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n setOpened(false);\n });\n };\n\n const setOnDenied = (onDeniedSelect: OnDenied) => {\n setOnDeniedSelect(onDeniedSelect);\n };\n\n const shouldDisable = () =>\n disabled || (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n const shouldBeReadOnly = () => readOnly || (onDenied && (onDenied.readOnly));\n\n useEffect(() => {\n window.addEventListener('resize', onScreenResize);\n document.addEventListener('click', onClickOutside);\n document.addEventListener('mousemove', onMouseMove);\n\n return () => {\n window.removeEventListener('resize', onScreenResize);\n document.removeEventListener('click', onClickOutside);\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, []);\n\n useEffect(() => {\n if (gridLayout) {\n const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n if (gridElement.current !== gridEl && gridEl) gridElement.current = gridEl;\n }\n }, [gridLayout]);\n\n useEffect(() => {\n if (dataSourceWithAllOptions.length > 0) {\n let newCurrent = null;\n if (value || value === 0) {\n newCurrent = dataSourceWithAllOptions.find(i => (value || value === 0)\n && i[idKey]?.toString().toLowerCase() === value?.toString().toLowerCase());\n } else if (dataSourceWithAllOptions.length > 0 && selectFirstOnEnter) {\n newCurrent = dataSourceWithAllOptions[0];\n }\n\n setSelected(newCurrent);\n if (descriptionKeyIsString) setInputText(newCurrent ? newCurrent[descriptionKey] : '');\n else setInputText(newCurrent ? descriptionKey(newCurrent) : '');\n }\n\n if (dataSourceWithAllOptions.length === 0 && inputText) {\n setInputText('');\n }\n }, [dataSourceWithAllOptions.length, value]);\n\n useEffect(() => {\n if (!_.isEqual(dataCombo, dataSourceWithAllOptions)) {\n const dataComboFilteredSimple = (undigitable || remoteSearch || !isTyping) ?\n dataSourceWithAllOptions\n : getFilteredSimpleDataCombo({\n inputText, dataSource: dataSourceWithAllOptions, descriptionKey,\n });\n setDataCombo(dataComboFilteredSimple);\n if (dataSourceWithAllOptions.length > 0 && remoteSearch) {\n const data = dataSourceWithAllOptions[0];\n setSelected(data);\n }\n }\n\n if (allOptions) {\n setDataCombo([\n {\n [idKey]: allOptions.idValue,\n [descriptionKeyIsString ?\n descriptionKey :\n descriptionKey(allOptions.label)]: allOptions.label,\n },\n ...dataSource,\n ]);\n }\n }, [JSON.stringify(dataSourceWithAllOptions)]);\n\n return (\n <span\n id={componentId}\n ref={componentRef}\n className=\"select-component\">\n <InputTextBase\n {...props}\n inputRef={(ref) => {\n if (props.inputRef) {\n if (!_.isFunction(props.inputRef)) {\n props.inputRef.current = ref;\n } else {\n props.inputRef(ref);\n }\n }\n inputTextRef.current = ref;\n }}\n autoComplete=\"off\"\n readOnly={undigitable || shouldBeReadOnly()}\n value={inputText}\n onFocus={onFocus}\n onBlur={onBlur}\n onChange={(e?: CustomInputEvent) => {\n if (e) onFilter(e.target.value);\n }}\n onClick={onFocus}\n onKeyDown={onInputKeyDown}\n customClassForLabel={customClassForLabel}\n customClassForWrapper={\n `selectwrapper ${(undigitable || searchOnDropdown || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n }\n customClassForInputContent={`multiselect ${customClassForInputContent}`}\n inputBaseRef={(r: HTMLDivElement) => { selectWrapper.current = r; }}\n handlerSetOnDenied={(inputOnDenied: OnDenied) => setOnDenied(inputOnDenied)}\n rightElements={[\n ...rightElements,\n <ActionButtons\n key=\"action-buttons-simpleselect\"\n disabled={shouldDisable() || shouldBeReadOnly()}\n showClearButton={showClearButton}\n dropDownOpened={opened}\n handlerClear={() => {\n if (shouldDisable()) return null;\n return onClearClick();\n }}\n handlerOpenClose={onOpenClose}\n customClassForSideButtons={customClassForSideButtons} />,\n ]} />\n {opened &&\n <Dropdown\n {...props}\n opened={opened}\n selected={selected}\n inputValue={inputText}\n selectFieldRef={componentRef}\n dropdownRef={dropdownRef}\n searchOnDropdown={searchOnDropdown}\n gridWrapperStyle={gridLayout && gridElement.current ?\n window.getComputedStyle(gridElement.current)\n : undefined}\n handleOnSelect={(dataSelected?: DataCombo) => {\n if (dataSelected) onSelect(dataSelected);\n }}\n handleOnFilter={(valueFilter: string) => onFilter(valueFilter)}\n handleOnKeydown={onInputKeyDown}\n handleOnBlur={() => onBlur}\n handleOnFocus={onFocus}\n dataCombo={dataCombo}\n searchNotFoundText={searchNotFoundText}\n dropdownWidth={dropdownMaxWidth || dropdownWidth || 0} />\n }\n </span>\n );\n};\nexport default SimpleSelect;\n"],"names":["SimpleSelect","props","value","descriptionKey","dataSource","gridLayout","onSearch","disabled","readOnly","openDropdownOnFocus","selectFirstOnEnter","idKey","remoteSearch","name","undigitable","searchOnDropdown","allOptions","undefined","showClearButton","searchNotFoundText","rightElements","customClassForWrapper","customClassForInputContent","customClassForLabel","customClassForSideButtons","dropdownMaxWidth","descriptionKeyIsString","dataSourceWithAllOptions","idValue","label","dataCombo","setDataCombo","useState","selected","setSelected","inputText","setInputText","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","isTyping","setIsTyping","dropdownRef","useRef","componentId","uuid","componentRef","selectWrapper","gridElement","inputTextRef","onScreenResize","current","clientWidth","onClickOutside","event","target","contains","onMouseMove","idDropdown","parentElement","id","dropdownElement","document","getElementById","keepDropdownOpen","Boolean","getSelectEvent","selectedEvent","onChange","selectedChange","onFilter","valueFilter","selectedFilter","dataComboFilter","getFilteredSimpleDataCombo","length","onSelect","selectedDropdown","Promise","resolve","finally","focus","onOpenClose","prevState","onFocus","dropdownWidthFocus","onBlur","onInputKeyDown","e","keyCode","constants","ENTER","key","TAB","preventDefault","ARROW_UP","ARROW_DOWN","includes","index","findIndex","d","onClearClick","setOnDenied","onDeniedSelect","shouldDisable","hideContent","shouldBeReadOnly","useEffect","window","addEventListener","removeEventListener","gridEl","querySelector","newCurrent","find","i","toString","toLowerCase","_","isEqual","dataComboFilteredSimple","data","JSON","stringify","ref","inputRef","isFunction","r","inputOnDenied","getComputedStyle","dataSelected"],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { TextAlign } from 'src/lib/@types/Align';
|
|
2
2
|
import { JSX, MutableRefObject } from 'react';
|
|
3
|
-
import { UseScrollEndReachedParams } from 'src/lib/hooks/useScrollEndReached/types';
|
|
4
3
|
import { DataCombo } from '../../@types/DataCombo';
|
|
5
4
|
import { PermissionAttr } from '../../@types/PermissionAttr';
|
|
6
5
|
import { CustomInputEvent } from '../base/types';
|
|
@@ -9,7 +8,7 @@ export type AllOptions = {
|
|
|
9
8
|
label: string;
|
|
10
9
|
};
|
|
11
10
|
export type DescriptionKey = string | ((dataSelected: DataCombo) => string);
|
|
12
|
-
export interface ISimpleSelectProps
|
|
11
|
+
export interface ISimpleSelectProps {
|
|
13
12
|
idKey: string;
|
|
14
13
|
descriptionKey: DescriptionKey;
|
|
15
14
|
dataSource?: DataCombo[];
|
|
@@ -80,7 +79,7 @@ export interface ISelectFieldProps extends Omit<ISimpleSelectProps, 'idKey' | 'v
|
|
|
80
79
|
required?: boolean;
|
|
81
80
|
onSelect?: (data?: string | string[]) => DataCombo;
|
|
82
81
|
}
|
|
83
|
-
export interface IMultipleSelectProps extends Omit<ISimpleSelectProps, 'idKey' | 'value' | 'descriptionKey'
|
|
82
|
+
export interface IMultipleSelectProps extends Omit<ISimpleSelectProps, 'idKey' | 'value' | 'descriptionKey'> {
|
|
84
83
|
descriptionKey: DescriptionKey;
|
|
85
84
|
idKey: string;
|
|
86
85
|
dataSource: DataCombo[];
|
package/lib/inputs/types.d.ts
CHANGED
|
@@ -4,7 +4,6 @@ import { DataCombo } from '../@types/DataCombo';
|
|
|
4
4
|
import { CustomInputEvent, IBaseProps } from './base/types';
|
|
5
5
|
import { IDrawerProps } from '../drawer/types';
|
|
6
6
|
import { TextAlign } from '../@types/Align';
|
|
7
|
-
import { UseScrollEndReachedParams } from '../hooks/useScrollEndReached/types';
|
|
8
7
|
type DescriptionKey = string | ((dataSelected: DataCombo) => string);
|
|
9
8
|
export interface IAdvancedFilterProps extends Omit<IDrawerProps, 'content'> {
|
|
10
9
|
onStateChange?: (value?: boolean) => void;
|
|
@@ -95,7 +94,7 @@ export interface IMaskHOCProps {
|
|
|
95
94
|
isDateField?: boolean;
|
|
96
95
|
autoCompleteMask?: 'left' | 'right';
|
|
97
96
|
}
|
|
98
|
-
export interface IDropdownSelectProps
|
|
97
|
+
export interface IDropdownSelectProps {
|
|
99
98
|
idKey: string;
|
|
100
99
|
descriptionKey: DescriptionKey;
|
|
101
100
|
dropdownWidth: number;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { CSSProperties, RefObject } from 'react';
|
|
2
|
-
export declare const useCalendarPosition: (calendarBoxOpen: boolean, containerRef: RefObject<HTMLDivElement | null
|
|
2
|
+
export declare const useCalendarPosition: (calendarBoxOpen: boolean, containerRef: RefObject<HTMLDivElement | null>) => {
|
|
3
3
|
calendarBoxStyles: CSSProperties;
|
|
4
4
|
};
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { c as compilerRuntimeExports } from "../../../_virtual/compiler-runtime.js";
|
|
2
|
+
import { useState, useEffect } from "react";
|
|
3
|
+
const useCalendarPosition = (calendarBoxOpen, containerRef) => {
|
|
4
|
+
const $ = compilerRuntimeExports.c(7);
|
|
5
|
+
let t0;
|
|
6
|
+
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
|
|
7
|
+
t0 = {};
|
|
8
|
+
$[0] = t0;
|
|
9
|
+
} else {
|
|
10
|
+
t0 = $[0];
|
|
11
|
+
}
|
|
12
|
+
const [calendarBoxStyles, setCalendarBoxStyles] = useState(t0);
|
|
13
|
+
let t1;
|
|
14
|
+
let t2;
|
|
15
|
+
if ($[1] !== calendarBoxOpen || $[2] !== containerRef) {
|
|
16
|
+
t1 = () => {
|
|
17
|
+
const updatePosition = () => {
|
|
18
|
+
const selectPositionOnScreen = containerRef.current?.getBoundingClientRect();
|
|
19
|
+
if (selectPositionOnScreen) {
|
|
20
|
+
const {
|
|
21
|
+
top,
|
|
22
|
+
left,
|
|
23
|
+
width,
|
|
24
|
+
height
|
|
25
|
+
} = selectPositionOnScreen;
|
|
26
|
+
setCalendarBoxStyles({
|
|
27
|
+
top: top + height + window.scrollY,
|
|
28
|
+
left: left + window.scrollX,
|
|
29
|
+
width,
|
|
30
|
+
position: "absolute"
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
if (calendarBoxOpen) {
|
|
35
|
+
updatePosition();
|
|
36
|
+
window.addEventListener("resize", updatePosition);
|
|
37
|
+
window.addEventListener("scroll", updatePosition, true);
|
|
38
|
+
}
|
|
39
|
+
return () => {
|
|
40
|
+
window.removeEventListener("resize", updatePosition);
|
|
41
|
+
window.removeEventListener("scroll", updatePosition, true);
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
t2 = [calendarBoxOpen, containerRef];
|
|
45
|
+
$[1] = calendarBoxOpen;
|
|
46
|
+
$[2] = containerRef;
|
|
47
|
+
$[3] = t1;
|
|
48
|
+
$[4] = t2;
|
|
49
|
+
} else {
|
|
50
|
+
t1 = $[3];
|
|
51
|
+
t2 = $[4];
|
|
52
|
+
}
|
|
53
|
+
useEffect(t1, t2);
|
|
54
|
+
let t3;
|
|
55
|
+
if ($[5] !== calendarBoxStyles) {
|
|
56
|
+
t3 = {
|
|
57
|
+
calendarBoxStyles
|
|
58
|
+
};
|
|
59
|
+
$[5] = calendarBoxStyles;
|
|
60
|
+
$[6] = t3;
|
|
61
|
+
} else {
|
|
62
|
+
t3 = $[6];
|
|
63
|
+
}
|
|
64
|
+
return t3;
|
|
65
|
+
};
|
|
66
|
+
export {
|
|
67
|
+
useCalendarPosition
|
|
68
|
+
};
|
|
69
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/lib/inputs2/date/base/constants.ts"],"sourcesContent":["import { CSSProperties, RefObject, useEffect, useState } from \"react\";\n\nexport const useCalendarPosition = (\n calendarBoxOpen: boolean,\n containerRef: RefObject<HTMLDivElement | null>,\n) => {\n const [calendarBoxStyles, setCalendarBoxStyles] = useState<CSSProperties>({});\n\n useEffect(() => {\n const updatePosition = () => {\n const selectPositionOnScreen = containerRef.current?.getBoundingClientRect();\n if (selectPositionOnScreen) {\n const { top, left, width, height } = selectPositionOnScreen;\n setCalendarBoxStyles({\n top: top + height + window.scrollY,\n left: left + window.scrollX,\n width: width,\n position: 'absolute',\n });\n }\n };\n\n if (calendarBoxOpen) {\n updatePosition();\n window.addEventListener('resize', updatePosition);\n window.addEventListener('scroll', updatePosition, true);\n }\n\n return () => {\n window.removeEventListener('resize', updatePosition);\n window.removeEventListener('scroll', updatePosition, true);\n };\n }, [calendarBoxOpen, containerRef]);\n\n return { calendarBoxStyles };\n};\n"],"names":["useCalendarPosition","calendarBoxOpen","containerRef","$","_c","t0","Symbol","for","calendarBoxStyles","setCalendarBoxStyles","useState","t1","t2","updatePosition","selectPositionOnScreen","current","getBoundingClientRect","top","left","width","height","window","scrollY","scrollX","position","addEventListener","removeEventListener","useEffect","t3"],"mappings":";;AAEO,MAAMA,sBAAsBA,CAAAC,iBAAAC,iBAAA;AAAA,QAAAC,IAAAC,uBAAAA,EAAA,CAAA;AAAA,MAAAC;AAAA,MAAAF,EAAA,CAAA,MAAAG,OAAAC,IAAA,2BAAA,GAAA;AAIyCF;AAAEF,WAAAE;AAAAA,EAAA,OAAA;AAAAA,SAAAF,EAAA,CAAA;AAAA,EAAA;AAA5E,QAAA,CAAAK,mBAAAC,oBAAA,IAAkDC,SAAwBL,EAAE;AAAE,MAAAM;AAAA,MAAAC;AAAA,MAAAT,EAAA,CAAA,MAAAF,mBAAAE,SAAAD,cAAA;AAEpES,SAAAA,MAAA;AACR,YAAAE,iBAAuBA,MAAA;AACrB,cAAAC,yBAA+BZ,aAAYa,SAA+BC,sBAAAA;AAC1E,YAAIF,wBAAsB;AACxB,gBAAA;AAAA,YAAAG;AAAAA,YAAAC;AAAAA,YAAAC;AAAAA,YAAAC;AAAAA,UAAAA,IAAqCN;AACrCL,+BAAqB;AAAA,YAAAQ,KACdA,MAAMG,SAASC,OAAMC;AAAAA,YAAQJ,MAC5BA,OAAOG,OAAME;AAAAA,YAAQJ;AAAAA,YAAAK,UAEjB;AAAA,UAAA,CACX;AAAA,QAAC;AAAA,MACH;AAGH,UAAIvB,iBAAe;AACjBY,uBAAAA;AACAQ,eAAMI,iBAAkB,UAAUZ,cAAc;AAChDQ,eAAMI,iBAAkB,UAAUZ,gBAAgB,IAAI;AAAA,MAAC;AACxD,aAEM,MAAA;AACLQ,eAAMK,oBAAqB,UAAUb,cAAc;AACnDQ,eAAMK,oBAAqB,UAAUb,gBAAgB,IAAI;AAAA,MAAC;AAAA,IAC3D;AACAD,SAAA,CAACX,iBAAiBC,YAAY;AAACC,WAAAF;AAAAE,WAAAD;AAAAC,WAAAQ;AAAAR,WAAAS;AAAAA,EAAA,OAAA;AAAAD,SAAAR,EAAA,CAAA;AAAAS,SAAAT,EAAA,CAAA;AAAA,EAAA;AAxBlCwB,YAAUhB,IAwBPC,EAA+B;AAAC,MAAAgB;AAAA,MAAAzB,SAAAK,mBAAA;AAE5BoB,SAAA;AAAA,MAAApB;AAAAA,IAAAA;AAAqBL,WAAAK;AAAAL,WAAAyB;AAAAA,EAAA,OAAA;AAAAA,SAAAzB,EAAA,CAAA;AAAA,EAAA;AAAA,SAArByB;AAAqB;"}
|