@fctc/widget-logic 2.3.8 → 2.3.9
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/dist/hooks.d.mts +7 -2
- package/dist/hooks.d.ts +7 -2
- package/dist/hooks.js +85 -110
- package/dist/hooks.mjs +97 -131
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +252 -273
- package/dist/index.mjs +229 -272
- package/dist/utils.d.mts +1 -14
- package/dist/utils.d.ts +1 -14
- package/dist/utils.js +0 -95
- package/dist/utils.mjs +1 -116
- package/dist/widget.d.mts +15 -28
- package/dist/widget.d.ts +15 -28
- package/dist/widget.js +242 -267
- package/dist/widget.mjs +220 -268
- package/package.json +2 -2
package/dist/hooks.d.mts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as _tanstack_react_query from '@tanstack/react-query';
|
|
2
2
|
import * as _tanstack_query_core from '@tanstack/query-core';
|
|
3
3
|
import * as react from 'react';
|
|
4
|
-
import { RefObject } from 'react';
|
|
4
|
+
import react__default, { RefObject } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
6
|
export * from '@fctc/interface-logic/hooks';
|
|
7
7
|
|
|
@@ -966,6 +966,11 @@ declare const useMenuItem: (props: any) => {
|
|
|
966
966
|
queryActionDetail: TActionDetailType;
|
|
967
967
|
};
|
|
968
968
|
|
|
969
|
+
declare const useGetRowIds: (tableRef: react__default.RefObject<HTMLTableElement | null>) => {
|
|
970
|
+
rowIds: string[];
|
|
971
|
+
refresh: () => void;
|
|
972
|
+
};
|
|
973
|
+
|
|
969
974
|
declare const DEFAULT_EVENTS: readonly ["mousedown", "touchstart"];
|
|
970
975
|
type EventType = (typeof DEFAULT_EVENTS)[number];
|
|
971
976
|
interface UseClickOutsideOptions {
|
|
@@ -978,4 +983,4 @@ declare const useClickOutside: ({ handler, events, nodes, refs, }: UseClickOutsi
|
|
|
978
983
|
|
|
979
984
|
declare function useDebounce<T>(value: T, delay: number): [T];
|
|
980
985
|
|
|
981
|
-
export { type ActionResultType, AppProvider, type ContextProfile, type Record, type ViewResponse, useAppProvider, useAuth, type useAuthType, useCallAction, type useCallActionType, useClickOutside, useConfig, type useConfigType, useDebounce, useDetail, useListData, type useListDataType, useMenu, useMenuItem, type useMenuType, useProfile, useUser, type useUserType, useViewV2, type useViewV2Type };
|
|
986
|
+
export { type ActionResultType, AppProvider, type ContextProfile, type Record, type ViewResponse, useAppProvider, useAuth, type useAuthType, useCallAction, type useCallActionType, useClickOutside, useConfig, type useConfigType, useDebounce, useDetail, useGetRowIds, useListData, type useListDataType, useMenu, useMenuItem, type useMenuType, useProfile, useUser, type useUserType, useViewV2, type useViewV2Type };
|
package/dist/hooks.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as _tanstack_react_query from '@tanstack/react-query';
|
|
2
2
|
import * as _tanstack_query_core from '@tanstack/query-core';
|
|
3
3
|
import * as react from 'react';
|
|
4
|
-
import { RefObject } from 'react';
|
|
4
|
+
import react__default, { RefObject } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
6
|
export * from '@fctc/interface-logic/hooks';
|
|
7
7
|
|
|
@@ -966,6 +966,11 @@ declare const useMenuItem: (props: any) => {
|
|
|
966
966
|
queryActionDetail: TActionDetailType;
|
|
967
967
|
};
|
|
968
968
|
|
|
969
|
+
declare const useGetRowIds: (tableRef: react__default.RefObject<HTMLTableElement | null>) => {
|
|
970
|
+
rowIds: string[];
|
|
971
|
+
refresh: () => void;
|
|
972
|
+
};
|
|
973
|
+
|
|
969
974
|
declare const DEFAULT_EVENTS: readonly ["mousedown", "touchstart"];
|
|
970
975
|
type EventType = (typeof DEFAULT_EVENTS)[number];
|
|
971
976
|
interface UseClickOutsideOptions {
|
|
@@ -978,4 +983,4 @@ declare const useClickOutside: ({ handler, events, nodes, refs, }: UseClickOutsi
|
|
|
978
983
|
|
|
979
984
|
declare function useDebounce<T>(value: T, delay: number): [T];
|
|
980
985
|
|
|
981
|
-
export { type ActionResultType, AppProvider, type ContextProfile, type Record, type ViewResponse, useAppProvider, useAuth, type useAuthType, useCallAction, type useCallActionType, useClickOutside, useConfig, type useConfigType, useDebounce, useDetail, useListData, type useListDataType, useMenu, useMenuItem, type useMenuType, useProfile, useUser, type useUserType, useViewV2, type useViewV2Type };
|
|
986
|
+
export { type ActionResultType, AppProvider, type ContextProfile, type Record, type ViewResponse, useAppProvider, useAuth, type useAuthType, useCallAction, type useCallActionType, useClickOutside, useConfig, type useConfigType, useDebounce, useDetail, useGetRowIds, useListData, type useListDataType, useMenu, useMenuItem, type useMenuType, useProfile, useUser, type useUserType, useViewV2, type useViewV2Type };
|
package/dist/hooks.js
CHANGED
|
@@ -29,6 +29,7 @@ __export(hooks_exports, {
|
|
|
29
29
|
useConfig: () => useConfig,
|
|
30
30
|
useDebounce: () => useDebounce,
|
|
31
31
|
useDetail: () => useDetail,
|
|
32
|
+
useGetRowIds: () => useGetRowIds,
|
|
32
33
|
useListData: () => useListData,
|
|
33
34
|
useMenu: () => useMenu,
|
|
34
35
|
useMenuItem: () => useMenuItem,
|
|
@@ -157,12 +158,6 @@ var import_react5 = require("react");
|
|
|
157
158
|
|
|
158
159
|
// src/utils/function.ts
|
|
159
160
|
var import_react4 = require("react");
|
|
160
|
-
|
|
161
|
-
// src/store.ts
|
|
162
|
-
var store_exports = {};
|
|
163
|
-
__reExport(store_exports, require("@fctc/interface-logic/store"));
|
|
164
|
-
|
|
165
|
-
// src/utils/function.ts
|
|
166
161
|
var countSum = (data, field) => {
|
|
167
162
|
if (!data || !field) return 0;
|
|
168
163
|
return data.reduce(
|
|
@@ -181,91 +176,6 @@ function mergeButtons(fields) {
|
|
|
181
176
|
}
|
|
182
177
|
return others;
|
|
183
178
|
}
|
|
184
|
-
function isElementVisible(el) {
|
|
185
|
-
const style = window.getComputedStyle(el);
|
|
186
|
-
return style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
|
|
187
|
-
}
|
|
188
|
-
function arraysAreEqual(a, b) {
|
|
189
|
-
if (a.length !== b.length) return false;
|
|
190
|
-
const setA = new Set(a);
|
|
191
|
-
const setB = new Set(b);
|
|
192
|
-
if (setA.size !== setB.size) return false;
|
|
193
|
-
for (const val of setA) {
|
|
194
|
-
if (!setB.has(val)) return false;
|
|
195
|
-
}
|
|
196
|
-
return true;
|
|
197
|
-
}
|
|
198
|
-
function useGetRowIds(tableRef) {
|
|
199
|
-
const [rowIds, setRowIds] = (0, import_react4.useState)([]);
|
|
200
|
-
const lastRowIdsRef = (0, import_react4.useRef)([]);
|
|
201
|
-
const updateVisibleRowIds = (0, import_react4.useCallback)(() => {
|
|
202
|
-
const table = tableRef?.current;
|
|
203
|
-
if (!table) return;
|
|
204
|
-
const rows = table.querySelectorAll("tr[data-row-id]");
|
|
205
|
-
const ids = [];
|
|
206
|
-
rows.forEach((row) => {
|
|
207
|
-
const el = row;
|
|
208
|
-
if (isElementVisible(el)) {
|
|
209
|
-
const id = el.getAttribute("data-row-id");
|
|
210
|
-
if (id) ids.push(id);
|
|
211
|
-
}
|
|
212
|
-
});
|
|
213
|
-
const uniqueIds = Array.from(new Set(ids));
|
|
214
|
-
if (!arraysAreEqual(lastRowIdsRef.current, uniqueIds)) {
|
|
215
|
-
lastRowIdsRef.current = uniqueIds;
|
|
216
|
-
setRowIds(uniqueIds);
|
|
217
|
-
}
|
|
218
|
-
}, [tableRef]);
|
|
219
|
-
(0, import_react4.useEffect)(() => {
|
|
220
|
-
const table = tableRef?.current;
|
|
221
|
-
if (!table) return;
|
|
222
|
-
const observer = new MutationObserver(() => {
|
|
223
|
-
updateVisibleRowIds();
|
|
224
|
-
});
|
|
225
|
-
observer.observe(table, {
|
|
226
|
-
childList: true,
|
|
227
|
-
subtree: true,
|
|
228
|
-
attributes: true,
|
|
229
|
-
attributeFilter: ["style", "class"]
|
|
230
|
-
});
|
|
231
|
-
updateVisibleRowIds();
|
|
232
|
-
return () => {
|
|
233
|
-
observer.disconnect();
|
|
234
|
-
};
|
|
235
|
-
}, [updateVisibleRowIds, tableRef]);
|
|
236
|
-
return { rowIds, refresh: updateVisibleRowIds };
|
|
237
|
-
}
|
|
238
|
-
var useSelectionState = ({
|
|
239
|
-
typeTable,
|
|
240
|
-
tableRef,
|
|
241
|
-
rows
|
|
242
|
-
}) => {
|
|
243
|
-
const { groupByDomain } = (0, store_exports.useAppSelector)(store_exports.selectSearch);
|
|
244
|
-
const { selectedRowKeys } = (0, store_exports.useAppSelector)(store_exports.selectList);
|
|
245
|
-
const { rowIds: recordIds } = useGetRowIds(tableRef);
|
|
246
|
-
const selectedRowKeysRef = (0, import_react4.useRef)(recordIds);
|
|
247
|
-
const isGroupTable = typeTable === "group";
|
|
248
|
-
const recordsCheckedGroup = (0, import_react4.useMemo)(() => {
|
|
249
|
-
if (!rows || !groupByDomain) return 0;
|
|
250
|
-
const groupBy = typeof groupByDomain === "object" ? groupByDomain?.contexts?.[0]?.group_by : void 0;
|
|
251
|
-
return countSum(rows, groupBy);
|
|
252
|
-
}, [rows, groupByDomain]);
|
|
253
|
-
const isAllGroupChecked = (0, import_react4.useMemo)(() => {
|
|
254
|
-
if (!isGroupTable || !selectedRowKeys?.length) return false;
|
|
255
|
-
const selectedLength = selectedRowKeys.filter((id) => id !== -1).length;
|
|
256
|
-
const allRecordsSelected = recordIds.length === selectedRowKeys.length ? recordIds.length === selectedLength : false;
|
|
257
|
-
const allGroupsSelected = recordsCheckedGroup === selectedRowKeys.length;
|
|
258
|
-
return allGroupsSelected || allRecordsSelected;
|
|
259
|
-
}, [isGroupTable, selectedRowKeys, recordIds, recordsCheckedGroup]);
|
|
260
|
-
const isAllNormalChecked = (0, import_react4.useMemo)(() => {
|
|
261
|
-
if (isGroupTable || !selectedRowKeys?.length || !rows?.length) return false;
|
|
262
|
-
return selectedRowKeys.length === rows.length && selectedRowKeys.every(
|
|
263
|
-
(id) => rows.some((record) => record.id === id)
|
|
264
|
-
);
|
|
265
|
-
}, [isGroupTable, selectedRowKeys, rows]);
|
|
266
|
-
const checkedAll = isAllGroupChecked || isAllNormalChecked;
|
|
267
|
-
return { checkedAll, selectedRowKeysRef };
|
|
268
|
-
};
|
|
269
179
|
var getDateRange = (currentDate, unit) => {
|
|
270
180
|
const date = new Date(currentDate);
|
|
271
181
|
let dateStart, dateEnd;
|
|
@@ -406,19 +316,19 @@ function useStorageState(key) {
|
|
|
406
316
|
|
|
407
317
|
// src/hooks/core/use-list-data.ts
|
|
408
318
|
var import_hooks3 = require("@fctc/interface-logic/hooks");
|
|
409
|
-
var
|
|
319
|
+
var import_store3 = require("@fctc/interface-logic/store");
|
|
410
320
|
var import_utils = require("@fctc/interface-logic/utils");
|
|
411
321
|
var useListData = ({
|
|
412
322
|
action,
|
|
413
323
|
context,
|
|
414
324
|
viewResponse
|
|
415
325
|
}) => {
|
|
416
|
-
const { groupByDomain } = (0,
|
|
326
|
+
const { groupByDomain } = (0, import_store3.useAppSelector)(import_store3.selectSearch);
|
|
417
327
|
const initModel = (0, import_hooks3.useModel)();
|
|
418
328
|
const [type, setType] = (0, import_react5.useState)("list");
|
|
419
329
|
const [mode, setMode] = (0, import_react5.useState)("month");
|
|
420
330
|
const [currentDate, setCurrentDate] = (0, import_react5.useState)(/* @__PURE__ */ new Date());
|
|
421
|
-
const { pageLimit, page, order } = (0,
|
|
331
|
+
const { pageLimit, page, order } = (0, import_store3.useAppSelector)(import_store3.selectList);
|
|
422
332
|
const listDataProps = (0, import_react5.useMemo)(() => {
|
|
423
333
|
const actData = action?.result;
|
|
424
334
|
if (!viewResponse || !actData || !context) {
|
|
@@ -553,10 +463,10 @@ var import_react7 = require("react");
|
|
|
553
463
|
var import_react_i18next = require("react-i18next");
|
|
554
464
|
var import_environment3 = require("@fctc/interface-logic/environment");
|
|
555
465
|
var import_hooks5 = require("@fctc/interface-logic/hooks");
|
|
556
|
-
var
|
|
466
|
+
var import_store4 = require("@fctc/interface-logic/store");
|
|
557
467
|
var useProfile = (accessToken) => {
|
|
558
468
|
const getProfile = (0, import_hooks5.useGetProfile)();
|
|
559
|
-
const dispatch = (0,
|
|
469
|
+
const dispatch = (0, import_store4.useAppDispatch)();
|
|
560
470
|
const { i18n } = (0, import_react_i18next.useTranslation)();
|
|
561
471
|
const fetchUserProfile = async () => {
|
|
562
472
|
return await getProfile.mutateAsync();
|
|
@@ -571,7 +481,7 @@ var useProfile = (accessToken) => {
|
|
|
571
481
|
const userInfo = userInfoQuery.data;
|
|
572
482
|
const env = (0, import_environment3.getEnv)();
|
|
573
483
|
env.setUid(userInfo?.sub);
|
|
574
|
-
dispatch((0,
|
|
484
|
+
dispatch((0, import_store4.setDataUser)(userInfo));
|
|
575
485
|
const userLocale = languages.find((lang) => lang?.id === userInfo?.locale);
|
|
576
486
|
env.setLang(userLocale?.id);
|
|
577
487
|
i18n.changeLanguage(userLocale?.id.split("_")[0]);
|
|
@@ -636,11 +546,11 @@ var useViewV2 = ({
|
|
|
636
546
|
|
|
637
547
|
// src/hooks/core/use-auth.ts
|
|
638
548
|
var import_hooks7 = require("@fctc/interface-logic/hooks");
|
|
639
|
-
var
|
|
549
|
+
var import_store5 = require("@fctc/interface-logic/store");
|
|
640
550
|
var useAuth = () => {
|
|
641
551
|
const [[isLoading, accessToken], setAccessToken] = useStorageState("TOKEN");
|
|
642
552
|
const loginMutate = (0, import_hooks7.useLoginCredential)();
|
|
643
|
-
const dispatch = (0,
|
|
553
|
+
const dispatch = (0, import_store5.useAppDispatch)();
|
|
644
554
|
const signIn = async (email, password) => {
|
|
645
555
|
try {
|
|
646
556
|
loginMutate.mutate(
|
|
@@ -661,9 +571,9 @@ var useAuth = () => {
|
|
|
661
571
|
}
|
|
662
572
|
};
|
|
663
573
|
const signOut = async () => {
|
|
664
|
-
dispatch((0,
|
|
665
|
-
dispatch((0,
|
|
666
|
-
dispatch((0,
|
|
574
|
+
dispatch((0, import_store5.setMenuList)([]));
|
|
575
|
+
dispatch((0, import_store5.setDataUser)({}));
|
|
576
|
+
dispatch((0, import_store5.setProfile)({}));
|
|
667
577
|
setAccessToken(null);
|
|
668
578
|
};
|
|
669
579
|
return {
|
|
@@ -810,8 +720,6 @@ __export(utils_exports, {
|
|
|
810
720
|
languages: () => languages,
|
|
811
721
|
mergeButtons: () => mergeButtons,
|
|
812
722
|
setStorageItemAsync: () => setStorageItemAsync,
|
|
813
|
-
useGetRowIds: () => useGetRowIds,
|
|
814
|
-
useSelectionState: () => useSelectionState,
|
|
815
723
|
useStorageState: () => useStorageState
|
|
816
724
|
});
|
|
817
725
|
__reExport(utils_exports, require("@fctc/interface-logic/utils"));
|
|
@@ -853,8 +761,74 @@ var useMenuItem = (props) => {
|
|
|
853
761
|
return { handleClick, path, queryActionDetail };
|
|
854
762
|
};
|
|
855
763
|
|
|
856
|
-
// src/hooks/
|
|
764
|
+
// src/hooks/core/use-get-rowids.ts
|
|
857
765
|
var import_react12 = require("react");
|
|
766
|
+
var useGetRowIds = (tableRef) => {
|
|
767
|
+
function isElementVisible(el) {
|
|
768
|
+
const style = window.getComputedStyle(el);
|
|
769
|
+
return style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
|
|
770
|
+
}
|
|
771
|
+
function arraysAreEqual(a, b) {
|
|
772
|
+
if (a.length !== b.length) return false;
|
|
773
|
+
if (a.length === 0 && b.length === 0) return true;
|
|
774
|
+
const setA = new Set(a);
|
|
775
|
+
const setB = new Set(b);
|
|
776
|
+
if (setA.size !== setB.size) return false;
|
|
777
|
+
for (const val of setA) {
|
|
778
|
+
if (!setB.has(val)) return false;
|
|
779
|
+
}
|
|
780
|
+
return true;
|
|
781
|
+
}
|
|
782
|
+
const [rowIds, setRowIds] = (0, import_react12.useState)([]);
|
|
783
|
+
const lastRowIdsRef = (0, import_react12.useRef)([]);
|
|
784
|
+
const updateVisibleRowIds = (0, import_react12.useCallback)(() => {
|
|
785
|
+
const table = tableRef.current;
|
|
786
|
+
if (!table) return;
|
|
787
|
+
const rows = table.querySelectorAll("tr[data-row-id]");
|
|
788
|
+
const ids = [];
|
|
789
|
+
rows.forEach((row) => {
|
|
790
|
+
const el = row;
|
|
791
|
+
if (isElementVisible(el)) {
|
|
792
|
+
const id = el.getAttribute("data-row-id");
|
|
793
|
+
if (id) ids.push(id);
|
|
794
|
+
}
|
|
795
|
+
});
|
|
796
|
+
const uniqueIds = Array.from(new Set(ids));
|
|
797
|
+
if (!arraysAreEqual(lastRowIdsRef.current, uniqueIds)) {
|
|
798
|
+
lastRowIdsRef.current = uniqueIds;
|
|
799
|
+
setRowIds(uniqueIds);
|
|
800
|
+
}
|
|
801
|
+
}, [tableRef]);
|
|
802
|
+
(0, import_react12.useEffect)(() => {
|
|
803
|
+
const table = tableRef.current;
|
|
804
|
+
if (!table) return;
|
|
805
|
+
const mutationObserver = new MutationObserver(() => {
|
|
806
|
+
updateVisibleRowIds();
|
|
807
|
+
});
|
|
808
|
+
mutationObserver.observe(table, {
|
|
809
|
+
childList: true,
|
|
810
|
+
subtree: true,
|
|
811
|
+
attributes: true,
|
|
812
|
+
attributeFilter: ["style", "class"]
|
|
813
|
+
});
|
|
814
|
+
const resizeObserver = new ResizeObserver(() => {
|
|
815
|
+
updateVisibleRowIds();
|
|
816
|
+
});
|
|
817
|
+
resizeObserver.observe(table);
|
|
818
|
+
const handleScroll = () => updateVisibleRowIds();
|
|
819
|
+
table.addEventListener("scroll", handleScroll, true);
|
|
820
|
+
updateVisibleRowIds();
|
|
821
|
+
return () => {
|
|
822
|
+
mutationObserver.disconnect();
|
|
823
|
+
resizeObserver.disconnect();
|
|
824
|
+
table.removeEventListener("scroll", handleScroll, true);
|
|
825
|
+
};
|
|
826
|
+
}, [updateVisibleRowIds, tableRef?.current]);
|
|
827
|
+
return { rowIds, refresh: updateVisibleRowIds };
|
|
828
|
+
};
|
|
829
|
+
|
|
830
|
+
// src/hooks/utils/use-click-outside.ts
|
|
831
|
+
var import_react13 = require("react");
|
|
858
832
|
var DEFAULT_EVENTS = ["mousedown", "touchstart"];
|
|
859
833
|
var useClickOutside = ({
|
|
860
834
|
handler,
|
|
@@ -862,8 +836,8 @@ var useClickOutside = ({
|
|
|
862
836
|
nodes = [],
|
|
863
837
|
refs
|
|
864
838
|
}) => {
|
|
865
|
-
const ref = (0,
|
|
866
|
-
(0,
|
|
839
|
+
const ref = (0, import_react13.useRef)(null);
|
|
840
|
+
(0, import_react13.useEffect)(() => {
|
|
867
841
|
const listener = (event) => {
|
|
868
842
|
const { target } = event;
|
|
869
843
|
if (refs && refs?.length > 0 && refs?.some((r) => r.current?.contains(target))) {
|
|
@@ -885,10 +859,10 @@ var useClickOutside = ({
|
|
|
885
859
|
};
|
|
886
860
|
|
|
887
861
|
// src/hooks/utils/use-debounce.ts
|
|
888
|
-
var
|
|
862
|
+
var import_react14 = require("react");
|
|
889
863
|
function useDebounce(value, delay) {
|
|
890
|
-
const [debouncedValue, setDebouncedValue] = (0,
|
|
891
|
-
(0,
|
|
864
|
+
const [debouncedValue, setDebouncedValue] = (0, import_react14.useState)(value);
|
|
865
|
+
(0, import_react14.useEffect)(() => {
|
|
892
866
|
const handler = setTimeout(() => {
|
|
893
867
|
setDebouncedValue(value);
|
|
894
868
|
}, delay);
|
|
@@ -911,6 +885,7 @@ __reExport(hooks_exports, require("@fctc/interface-logic/hooks"), module.exports
|
|
|
911
885
|
useConfig,
|
|
912
886
|
useDebounce,
|
|
913
887
|
useDetail,
|
|
888
|
+
useGetRowIds,
|
|
914
889
|
useListData,
|
|
915
890
|
useMenu,
|
|
916
891
|
useMenuItem,
|