@abpjs/theme-shared 2.9.0 → 3.0.0
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/components/loader-bar/LoaderBar.d.ts +1 -1
- package/dist/enums/index.d.ts +5 -0
- package/dist/enums/route-names.d.ts +15 -0
- package/dist/handlers/error.handler.d.ts +3 -2
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/use-nav-items.d.ts +33 -0
- package/dist/index.d.ts +16 -1
- package/dist/index.js +369 -245
- package/dist/index.mjs +226 -102
- package/dist/models/confirmation.d.ts +3 -7
- package/dist/models/index.d.ts +7 -2
- package/dist/models/nav-item.d.ts +39 -0
- package/dist/models/toaster.d.ts +2 -44
- package/dist/providers/ThemeSharedProvider.d.ts +1 -1
- package/dist/providers/index.d.ts +1 -0
- package/dist/providers/route.provider.d.ts +53 -0
- package/dist/services/index.d.ts +5 -0
- package/dist/services/nav-items.service.d.ts +117 -0
- package/dist/utils/index.d.ts +4 -1
- package/package.json +5 -4
package/dist/index.mjs
CHANGED
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
// src/models/toaster.ts
|
|
2
|
-
var Toaster;
|
|
3
|
-
((Toaster2) => {
|
|
4
|
-
let Status;
|
|
5
|
-
((Status2) => {
|
|
6
|
-
Status2["confirm"] = "confirm";
|
|
7
|
-
Status2["reject"] = "reject";
|
|
8
|
-
Status2["dismiss"] = "dismiss";
|
|
9
|
-
})(Status = Toaster2.Status || (Toaster2.Status = {}));
|
|
10
|
-
})(Toaster || (Toaster = {}));
|
|
11
|
-
|
|
12
1
|
// src/models/confirmation.ts
|
|
13
2
|
var Confirmation;
|
|
14
3
|
((Confirmation2) => {
|
|
@@ -392,7 +381,7 @@ function ConfirmationProvider({ children }) {
|
|
|
392
381
|
useEffect2(() => {
|
|
393
382
|
if (!escapeListenerRef.current) return;
|
|
394
383
|
const handleEscape = (event) => {
|
|
395
|
-
if (event.key === "Escape" && confirmation && confirmation.options?.
|
|
384
|
+
if (event.key === "Escape" && confirmation && confirmation.options?.dismissible !== false) {
|
|
396
385
|
respond(Confirmation.Status.dismiss);
|
|
397
386
|
}
|
|
398
387
|
};
|
|
@@ -652,8 +641,151 @@ function isHttpErrorResponse(error) {
|
|
|
652
641
|
return typeof error === "object" && error !== null && "status" in error && typeof error.status === "number";
|
|
653
642
|
}
|
|
654
643
|
|
|
644
|
+
// src/hooks/use-nav-items.ts
|
|
645
|
+
import { useState as useState5, useEffect as useEffect3 } from "react";
|
|
646
|
+
|
|
647
|
+
// src/services/nav-items.service.ts
|
|
648
|
+
var _NavItemsService = class _NavItemsService {
|
|
649
|
+
constructor() {
|
|
650
|
+
this._items = [];
|
|
651
|
+
this._listeners = /* @__PURE__ */ new Set();
|
|
652
|
+
}
|
|
653
|
+
/**
|
|
654
|
+
* Get singleton instance
|
|
655
|
+
* @since 3.0.0
|
|
656
|
+
*/
|
|
657
|
+
static getInstance() {
|
|
658
|
+
if (!_NavItemsService._instance) {
|
|
659
|
+
_NavItemsService._instance = new _NavItemsService();
|
|
660
|
+
}
|
|
661
|
+
return _NavItemsService._instance;
|
|
662
|
+
}
|
|
663
|
+
/**
|
|
664
|
+
* Reset the singleton instance (useful for testing)
|
|
665
|
+
* @internal
|
|
666
|
+
*/
|
|
667
|
+
static resetInstance() {
|
|
668
|
+
_NavItemsService._instance = null;
|
|
669
|
+
}
|
|
670
|
+
/**
|
|
671
|
+
* Get current items (sorted by order)
|
|
672
|
+
* @since 3.0.0
|
|
673
|
+
*/
|
|
674
|
+
get items() {
|
|
675
|
+
return [...this._items].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
|
|
676
|
+
}
|
|
677
|
+
/**
|
|
678
|
+
* Subscribe to item changes.
|
|
679
|
+
* Returns an unsubscribe function.
|
|
680
|
+
*
|
|
681
|
+
* @param listener - Callback function to receive item updates
|
|
682
|
+
* @returns Unsubscribe function
|
|
683
|
+
* @since 3.0.0
|
|
684
|
+
*/
|
|
685
|
+
subscribe(listener) {
|
|
686
|
+
this._listeners.add(listener);
|
|
687
|
+
listener(this.items);
|
|
688
|
+
return () => {
|
|
689
|
+
this._listeners.delete(listener);
|
|
690
|
+
};
|
|
691
|
+
}
|
|
692
|
+
/**
|
|
693
|
+
* Get items as an observable-like interface.
|
|
694
|
+
* Compatible with Angular's Observable pattern.
|
|
695
|
+
*
|
|
696
|
+
* @returns Object with subscribe method
|
|
697
|
+
* @since 3.0.0
|
|
698
|
+
*/
|
|
699
|
+
get items$() {
|
|
700
|
+
return {
|
|
701
|
+
subscribe: (callback) => {
|
|
702
|
+
const unsubscribe = this.subscribe(callback);
|
|
703
|
+
return { unsubscribe };
|
|
704
|
+
}
|
|
705
|
+
};
|
|
706
|
+
}
|
|
707
|
+
/**
|
|
708
|
+
* Add one or more items.
|
|
709
|
+
* Items are automatically sorted by order.
|
|
710
|
+
*
|
|
711
|
+
* @param items - Array of items to add
|
|
712
|
+
* @since 3.0.0
|
|
713
|
+
*/
|
|
714
|
+
addItems(items) {
|
|
715
|
+
const existingIds = new Set(this._items.map((item) => item.id));
|
|
716
|
+
const newItems = items.filter((item) => !existingIds.has(item.id));
|
|
717
|
+
this._items = [...this._items, ...newItems];
|
|
718
|
+
this.notify();
|
|
719
|
+
}
|
|
720
|
+
/**
|
|
721
|
+
* Remove an item by id.
|
|
722
|
+
*
|
|
723
|
+
* @param id - The id of the item to remove
|
|
724
|
+
* @since 3.0.0
|
|
725
|
+
*/
|
|
726
|
+
removeItem(id) {
|
|
727
|
+
const initialLength = this._items.length;
|
|
728
|
+
this._items = this._items.filter((item) => item.id !== id);
|
|
729
|
+
if (this._items.length !== initialLength) {
|
|
730
|
+
this.notify();
|
|
731
|
+
}
|
|
732
|
+
}
|
|
733
|
+
/**
|
|
734
|
+
* Patch an existing item by id.
|
|
735
|
+
* Updates only the specified properties.
|
|
736
|
+
*
|
|
737
|
+
* @param id - The id of the item to patch
|
|
738
|
+
* @param patch - Partial item data to merge
|
|
739
|
+
* @since 3.0.0
|
|
740
|
+
*/
|
|
741
|
+
patchItem(id, patch) {
|
|
742
|
+
const index = this._items.findIndex((item) => item.id === id);
|
|
743
|
+
if (index !== -1) {
|
|
744
|
+
this._items = [
|
|
745
|
+
...this._items.slice(0, index),
|
|
746
|
+
{ ...this._items[index], ...patch },
|
|
747
|
+
...this._items.slice(index + 1)
|
|
748
|
+
];
|
|
749
|
+
this.notify();
|
|
750
|
+
}
|
|
751
|
+
}
|
|
752
|
+
/**
|
|
753
|
+
* Clear all items.
|
|
754
|
+
* @since 3.0.0
|
|
755
|
+
*/
|
|
756
|
+
clear() {
|
|
757
|
+
if (this._items.length > 0) {
|
|
758
|
+
this._items = [];
|
|
759
|
+
this.notify();
|
|
760
|
+
}
|
|
761
|
+
}
|
|
762
|
+
/**
|
|
763
|
+
* Notify all listeners of changes.
|
|
764
|
+
*/
|
|
765
|
+
notify() {
|
|
766
|
+
const currentItems = this.items;
|
|
767
|
+
this._listeners.forEach((listener) => listener(currentItems));
|
|
768
|
+
}
|
|
769
|
+
};
|
|
770
|
+
_NavItemsService._instance = null;
|
|
771
|
+
var NavItemsService = _NavItemsService;
|
|
772
|
+
function getNavItemsService() {
|
|
773
|
+
return NavItemsService.getInstance();
|
|
774
|
+
}
|
|
775
|
+
|
|
776
|
+
// src/hooks/use-nav-items.ts
|
|
777
|
+
function useNavItems(service) {
|
|
778
|
+
const navItemsService = service || getNavItemsService();
|
|
779
|
+
const [items, setItems] = useState5(navItemsService.items);
|
|
780
|
+
useEffect3(() => {
|
|
781
|
+
const unsubscribe = navItemsService.subscribe(setItems);
|
|
782
|
+
return unsubscribe;
|
|
783
|
+
}, [navItemsService]);
|
|
784
|
+
return items;
|
|
785
|
+
}
|
|
786
|
+
|
|
655
787
|
// src/components/toast/Toast.tsx
|
|
656
|
-
import { useEffect as
|
|
788
|
+
import { useEffect as useEffect4, useRef as useRef4, useMemo as useMemo4 } from "react";
|
|
657
789
|
import {
|
|
658
790
|
Toaster as ChakraToaster,
|
|
659
791
|
Portal,
|
|
@@ -793,7 +925,7 @@ function ToastContainer({ position = "bottom-right", containerKey }) {
|
|
|
793
925
|
if (!containerKey) return toasts;
|
|
794
926
|
return toasts.filter((toast) => toast.options?.containerKey === containerKey);
|
|
795
927
|
}, [toasts, containerKey]);
|
|
796
|
-
|
|
928
|
+
useEffect4(() => {
|
|
797
929
|
const newToasts = filteredToasts.filter((toast) => !displayedToastsRef.current.has(toast.id));
|
|
798
930
|
newToasts.forEach((toast) => {
|
|
799
931
|
displayedToastsRef.current.add(toast.id);
|
|
@@ -939,7 +1071,7 @@ function ConfirmationDialog({ className }) {
|
|
|
939
1071
|
respond(Confirmation.Status.dismiss);
|
|
940
1072
|
};
|
|
941
1073
|
const handleOpenChange = (details) => {
|
|
942
|
-
if (!details.open && options?.
|
|
1074
|
+
if (!details.open && options?.dismissible !== false) {
|
|
943
1075
|
handleDismiss();
|
|
944
1076
|
}
|
|
945
1077
|
};
|
|
@@ -1032,35 +1164,21 @@ function ErrorComponent({
|
|
|
1032
1164
|
}
|
|
1033
1165
|
|
|
1034
1166
|
// src/components/loader-bar/LoaderBar.tsx
|
|
1035
|
-
import { useEffect as
|
|
1167
|
+
import { useCallback as useCallback5, useEffect as useEffect5, useRef as useRef6, useState as useState6 } from "react";
|
|
1036
1168
|
import { useLoader } from "@abpjs/core";
|
|
1037
1169
|
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
1038
1170
|
function LoaderBar({
|
|
1039
1171
|
containerClass = "abp-loader-bar",
|
|
1040
1172
|
progressClass = "abp-progress",
|
|
1041
|
-
filter,
|
|
1173
|
+
filter: _filter,
|
|
1042
1174
|
intervalPeriod = 300,
|
|
1043
1175
|
stopDelay = 400
|
|
1044
1176
|
}) {
|
|
1045
1177
|
const { loading } = useLoader();
|
|
1046
|
-
const [isLoading, setIsLoading] =
|
|
1047
|
-
const [progressLevel, setProgressLevel] =
|
|
1178
|
+
const [isLoading, setIsLoading] = useState6(false);
|
|
1179
|
+
const [progressLevel, setProgressLevel] = useState6(0);
|
|
1048
1180
|
const intervalRef = useRef6(null);
|
|
1049
|
-
|
|
1050
|
-
if (loading) {
|
|
1051
|
-
startLoading();
|
|
1052
|
-
} else {
|
|
1053
|
-
stopLoading();
|
|
1054
|
-
}
|
|
1055
|
-
}, [loading]);
|
|
1056
|
-
useEffect4(() => {
|
|
1057
|
-
return () => {
|
|
1058
|
-
if (intervalRef.current) {
|
|
1059
|
-
clearInterval(intervalRef.current);
|
|
1060
|
-
}
|
|
1061
|
-
};
|
|
1062
|
-
}, []);
|
|
1063
|
-
const startLoading = () => {
|
|
1181
|
+
const startLoading = useCallback5(() => {
|
|
1064
1182
|
setIsLoading(true);
|
|
1065
1183
|
setProgressLevel(0);
|
|
1066
1184
|
if (intervalRef.current) {
|
|
@@ -1078,8 +1196,8 @@ function LoaderBar({
|
|
|
1078
1196
|
return prev + 10;
|
|
1079
1197
|
});
|
|
1080
1198
|
}, intervalPeriod);
|
|
1081
|
-
};
|
|
1082
|
-
const stopLoading = () => {
|
|
1199
|
+
}, [intervalPeriod]);
|
|
1200
|
+
const stopLoading = useCallback5(() => {
|
|
1083
1201
|
setProgressLevel(100);
|
|
1084
1202
|
if (intervalRef.current) {
|
|
1085
1203
|
clearInterval(intervalRef.current);
|
|
@@ -1089,7 +1207,21 @@ function LoaderBar({
|
|
|
1089
1207
|
setIsLoading(false);
|
|
1090
1208
|
setProgressLevel(0);
|
|
1091
1209
|
}, stopDelay);
|
|
1092
|
-
};
|
|
1210
|
+
}, [stopDelay]);
|
|
1211
|
+
useEffect5(() => {
|
|
1212
|
+
if (loading) {
|
|
1213
|
+
startLoading();
|
|
1214
|
+
} else {
|
|
1215
|
+
stopLoading();
|
|
1216
|
+
}
|
|
1217
|
+
}, [loading, startLoading, stopLoading]);
|
|
1218
|
+
useEffect5(() => {
|
|
1219
|
+
return () => {
|
|
1220
|
+
if (intervalRef.current) {
|
|
1221
|
+
clearInterval(intervalRef.current);
|
|
1222
|
+
}
|
|
1223
|
+
};
|
|
1224
|
+
}, []);
|
|
1093
1225
|
if (!isLoading && progressLevel === 0) {
|
|
1094
1226
|
return null;
|
|
1095
1227
|
}
|
|
@@ -1124,7 +1256,7 @@ function LoaderBar({
|
|
|
1124
1256
|
}
|
|
1125
1257
|
|
|
1126
1258
|
// src/components/modal/Modal.tsx
|
|
1127
|
-
import
|
|
1259
|
+
import React6 from "react";
|
|
1128
1260
|
import {
|
|
1129
1261
|
Dialog as Dialog2,
|
|
1130
1262
|
Portal as Portal3,
|
|
@@ -1172,12 +1304,12 @@ function Modal({
|
|
|
1172
1304
|
preventScroll = true,
|
|
1173
1305
|
onInit
|
|
1174
1306
|
}) {
|
|
1175
|
-
const prevVisibleRef =
|
|
1176
|
-
const onInitRef =
|
|
1177
|
-
|
|
1307
|
+
const prevVisibleRef = React6.useRef(false);
|
|
1308
|
+
const onInitRef = React6.useRef(onInit);
|
|
1309
|
+
React6.useEffect(() => {
|
|
1178
1310
|
onInitRef.current = onInit;
|
|
1179
1311
|
}, [onInit]);
|
|
1180
|
-
|
|
1312
|
+
React6.useEffect(() => {
|
|
1181
1313
|
if (visible && !prevVisibleRef.current && onInitRef.current) {
|
|
1182
1314
|
onInitRef.current();
|
|
1183
1315
|
}
|
|
@@ -1393,7 +1525,7 @@ function FormField({
|
|
|
1393
1525
|
}
|
|
1394
1526
|
|
|
1395
1527
|
// src/components/change-password/ChangePassword.tsx
|
|
1396
|
-
import { useEffect as
|
|
1528
|
+
import { useEffect as useEffect6 } from "react";
|
|
1397
1529
|
import {
|
|
1398
1530
|
Button as Button5,
|
|
1399
1531
|
VStack as VStack2,
|
|
@@ -1425,7 +1557,7 @@ function ChangePassword({
|
|
|
1425
1557
|
}
|
|
1426
1558
|
});
|
|
1427
1559
|
const newPassword = watch("newPassword");
|
|
1428
|
-
|
|
1560
|
+
useEffect6(() => {
|
|
1429
1561
|
if (visible) {
|
|
1430
1562
|
reset();
|
|
1431
1563
|
}
|
|
@@ -1545,7 +1677,7 @@ function ChangePassword({
|
|
|
1545
1677
|
}
|
|
1546
1678
|
|
|
1547
1679
|
// src/components/profile/Profile.tsx
|
|
1548
|
-
import { useEffect as
|
|
1680
|
+
import { useEffect as useEffect7 } from "react";
|
|
1549
1681
|
import {
|
|
1550
1682
|
Button as Button6,
|
|
1551
1683
|
VStack as VStack3,
|
|
@@ -1579,13 +1711,13 @@ function Profile({
|
|
|
1579
1711
|
}
|
|
1580
1712
|
});
|
|
1581
1713
|
const modalBusy = isSubmitting || loading;
|
|
1582
|
-
|
|
1714
|
+
useEffect7(() => {
|
|
1583
1715
|
if (visible) {
|
|
1584
1716
|
fetchProfile().then(() => {
|
|
1585
1717
|
});
|
|
1586
1718
|
}
|
|
1587
1719
|
}, [visible, fetchProfile]);
|
|
1588
|
-
|
|
1720
|
+
useEffect7(() => {
|
|
1589
1721
|
if (profile) {
|
|
1590
1722
|
reset({
|
|
1591
1723
|
userName: profile.userName || "",
|
|
@@ -1980,7 +2112,7 @@ var abpSystem = createAbpSystem();
|
|
|
1980
2112
|
// src/components/ui/color-mode.tsx
|
|
1981
2113
|
import { ClientOnly, IconButton, Skeleton, Span } from "@chakra-ui/react";
|
|
1982
2114
|
import { ThemeProvider, useTheme } from "next-themes";
|
|
1983
|
-
import * as
|
|
2115
|
+
import * as React11 from "react";
|
|
1984
2116
|
import { Moon, Sun } from "lucide-react";
|
|
1985
2117
|
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
1986
2118
|
function ColorModeProvider(props) {
|
|
@@ -2002,7 +2134,7 @@ function ColorModeIcon() {
|
|
|
2002
2134
|
const { colorMode } = useColorMode();
|
|
2003
2135
|
return colorMode === "dark" ? /* @__PURE__ */ jsx15(Moon, {}) : /* @__PURE__ */ jsx15(Sun, {});
|
|
2004
2136
|
}
|
|
2005
|
-
var ColorModeButton =
|
|
2137
|
+
var ColorModeButton = React11.forwardRef(function ColorModeButton2(props, ref) {
|
|
2006
2138
|
const { toggleColorMode } = useColorMode();
|
|
2007
2139
|
return /* @__PURE__ */ jsx15(ClientOnly, { fallback: /* @__PURE__ */ jsx15(Skeleton, { boxSize: "9" }), children: /* @__PURE__ */ jsx15(
|
|
2008
2140
|
IconButton,
|
|
@@ -2023,7 +2155,7 @@ var ColorModeButton = React12.forwardRef(function ColorModeButton2(props, ref) {
|
|
|
2023
2155
|
}
|
|
2024
2156
|
) });
|
|
2025
2157
|
});
|
|
2026
|
-
var LightMode =
|
|
2158
|
+
var LightMode = React11.forwardRef(
|
|
2027
2159
|
function LightMode2(props, ref) {
|
|
2028
2160
|
return /* @__PURE__ */ jsx15(
|
|
2029
2161
|
Span,
|
|
@@ -2039,7 +2171,7 @@ var LightMode = React12.forwardRef(
|
|
|
2039
2171
|
);
|
|
2040
2172
|
}
|
|
2041
2173
|
);
|
|
2042
|
-
var DarkMode =
|
|
2174
|
+
var DarkMode = React11.forwardRef(
|
|
2043
2175
|
function DarkMode2(props, ref) {
|
|
2044
2176
|
return /* @__PURE__ */ jsx15(
|
|
2045
2177
|
Span,
|
|
@@ -2064,35 +2196,65 @@ function ThemeSharedProvider({
|
|
|
2064
2196
|
renderToasts = true,
|
|
2065
2197
|
renderConfirmation = true,
|
|
2066
2198
|
themeOverrides,
|
|
2067
|
-
toastPosition = "bottom-right",
|
|
2199
|
+
toastPosition: _toastPosition = "bottom-right",
|
|
2068
2200
|
enableColorMode = false,
|
|
2069
2201
|
defaultColorMode = "light",
|
|
2070
2202
|
locale = "en-US"
|
|
2071
2203
|
}) {
|
|
2072
2204
|
const system = themeOverrides ? createAbpSystem(themeOverrides) : abpSystem;
|
|
2073
2205
|
const { endSide } = useDirection();
|
|
2074
|
-
|
|
2206
|
+
const resolvedToastPosition = endSide === "left" ? "bottom-left" : "bottom-right";
|
|
2075
2207
|
const content = /* @__PURE__ */ jsx16(ToasterProvider, { children: /* @__PURE__ */ jsxs11(ConfirmationProvider, { children: [
|
|
2076
2208
|
children,
|
|
2077
|
-
renderToasts && /* @__PURE__ */ jsx16(ToastContainer, { position:
|
|
2209
|
+
renderToasts && /* @__PURE__ */ jsx16(ToastContainer, { position: resolvedToastPosition }),
|
|
2078
2210
|
renderConfirmation && /* @__PURE__ */ jsx16(ConfirmationDialog, {})
|
|
2079
2211
|
] }) });
|
|
2080
2212
|
const colorModeProps = enableColorMode ? { defaultTheme: defaultColorMode } : { forcedTheme: "light" };
|
|
2081
2213
|
return /* @__PURE__ */ jsx16(ChakraProvider, { value: system, children: /* @__PURE__ */ jsx16(LocaleProvider, { locale, children: /* @__PURE__ */ jsx16(ColorModeProvider, { ...colorModeProps, children: content }) }) });
|
|
2082
2214
|
}
|
|
2083
2215
|
|
|
2216
|
+
// src/providers/route.provider.ts
|
|
2217
|
+
import { getRoutesService } from "@abpjs/core";
|
|
2218
|
+
|
|
2219
|
+
// src/enums/route-names.ts
|
|
2220
|
+
var eThemeSharedRouteNames = /* @__PURE__ */ ((eThemeSharedRouteNames2) => {
|
|
2221
|
+
eThemeSharedRouteNames2["Administration"] = "AbpUiNavigation::Menu:Administration";
|
|
2222
|
+
return eThemeSharedRouteNames2;
|
|
2223
|
+
})(eThemeSharedRouteNames || {});
|
|
2224
|
+
|
|
2225
|
+
// src/providers/route.provider.ts
|
|
2226
|
+
function configureRoutes(routes) {
|
|
2227
|
+
return () => {
|
|
2228
|
+
routes.add([
|
|
2229
|
+
{
|
|
2230
|
+
name: "AbpUiNavigation::Menu:Administration" /* Administration */,
|
|
2231
|
+
path: "",
|
|
2232
|
+
order: 100,
|
|
2233
|
+
iconClass: "fa fa-wrench"
|
|
2234
|
+
}
|
|
2235
|
+
]);
|
|
2236
|
+
};
|
|
2237
|
+
}
|
|
2238
|
+
var THEME_SHARED_ROUTE_PROVIDERS = {
|
|
2239
|
+
configureRoutes
|
|
2240
|
+
};
|
|
2241
|
+
function initializeThemeSharedRoutes() {
|
|
2242
|
+
const routesService = getRoutesService();
|
|
2243
|
+
configureRoutes(routesService)();
|
|
2244
|
+
}
|
|
2245
|
+
|
|
2084
2246
|
// src/handlers/lazy-style.handler.ts
|
|
2085
|
-
import { useEffect as
|
|
2247
|
+
import { useEffect as useEffect8, useRef as useRef7, useState as useState7 } from "react";
|
|
2086
2248
|
import { LazyLoadService } from "@abpjs/core";
|
|
2087
2249
|
function createLazyStyleHref(style, dir) {
|
|
2088
2250
|
return style.replace("{{dir}}", dir);
|
|
2089
2251
|
}
|
|
2090
2252
|
function useLazyStyleHandler(options = {}) {
|
|
2091
2253
|
const { styles = [BOOTSTRAP], initialDirection = "ltr" } = options;
|
|
2092
|
-
const [direction, setDirection] =
|
|
2254
|
+
const [direction, setDirection] = useState7(initialDirection);
|
|
2093
2255
|
const lazyLoadRef = useRef7(new LazyLoadService());
|
|
2094
2256
|
const loadedStylesRef = useRef7(/* @__PURE__ */ new Map());
|
|
2095
|
-
|
|
2257
|
+
useEffect8(() => {
|
|
2096
2258
|
document.body.dir = direction;
|
|
2097
2259
|
const switchCSS = async () => {
|
|
2098
2260
|
const lazyLoad = lazyLoadRef.current;
|
|
@@ -2219,44 +2381,6 @@ function injectThemeSharedStyles() {
|
|
|
2219
2381
|
};
|
|
2220
2382
|
}
|
|
2221
2383
|
|
|
2222
|
-
// src/utils/nav-items.ts
|
|
2223
|
-
var navItems = [];
|
|
2224
|
-
var subscribers = /* @__PURE__ */ new Set();
|
|
2225
|
-
function addNavItem(item) {
|
|
2226
|
-
navItems = [...navItems, item].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
|
|
2227
|
-
notifySubscribers();
|
|
2228
|
-
}
|
|
2229
|
-
function removeNavItem(item) {
|
|
2230
|
-
navItems = navItems.filter((i) => i !== item);
|
|
2231
|
-
notifySubscribers();
|
|
2232
|
-
}
|
|
2233
|
-
function clearNavItems() {
|
|
2234
|
-
navItems = [];
|
|
2235
|
-
notifySubscribers();
|
|
2236
|
-
}
|
|
2237
|
-
function getNavItemsSync() {
|
|
2238
|
-
return [...navItems];
|
|
2239
|
-
}
|
|
2240
|
-
function subscribeToNavItems(callback) {
|
|
2241
|
-
subscribers.add(callback);
|
|
2242
|
-
callback([...navItems]);
|
|
2243
|
-
return () => {
|
|
2244
|
-
subscribers.delete(callback);
|
|
2245
|
-
};
|
|
2246
|
-
}
|
|
2247
|
-
function notifySubscribers() {
|
|
2248
|
-
const currentItems = [...navItems];
|
|
2249
|
-
subscribers.forEach((callback) => callback(currentItems));
|
|
2250
|
-
}
|
|
2251
|
-
function getNavItems() {
|
|
2252
|
-
return {
|
|
2253
|
-
subscribe: (callback) => {
|
|
2254
|
-
const unsubscribe = subscribeToNavItems(callback);
|
|
2255
|
-
return { unsubscribe };
|
|
2256
|
-
}
|
|
2257
|
-
};
|
|
2258
|
-
}
|
|
2259
|
-
|
|
2260
2384
|
// src/utils/validation-utils.ts
|
|
2261
2385
|
var PASSWORD_SETTING_KEYS = {
|
|
2262
2386
|
requiredLength: "Abp.Identity.Password.RequiredLength",
|
|
@@ -2398,26 +2522,26 @@ export {
|
|
|
2398
2522
|
AbpModalFooter as ModalFooter,
|
|
2399
2523
|
AbpModalHeader as ModalHeader,
|
|
2400
2524
|
ModalProvider,
|
|
2525
|
+
NavItemsService,
|
|
2401
2526
|
PASSWORD_SETTING_KEYS,
|
|
2402
2527
|
Profile,
|
|
2403
2528
|
THEME_SHARED_APPEND_CONTENT,
|
|
2529
|
+
THEME_SHARED_ROUTE_PROVIDERS,
|
|
2404
2530
|
THEME_SHARED_STYLES,
|
|
2405
2531
|
ThemeSharedAppendContentContext,
|
|
2406
2532
|
ThemeSharedProvider,
|
|
2407
2533
|
ToastContainer,
|
|
2408
|
-
Toaster,
|
|
2409
2534
|
ToasterProvider,
|
|
2410
2535
|
abpSystem,
|
|
2411
|
-
|
|
2412
|
-
clearNavItems,
|
|
2536
|
+
configureRoutes,
|
|
2413
2537
|
createAbpSystem,
|
|
2414
2538
|
createErrorInterceptor,
|
|
2415
2539
|
createLazyStyleHref,
|
|
2416
2540
|
defaultAbpConfig,
|
|
2417
2541
|
defineConfig,
|
|
2542
|
+
eThemeSharedRouteNames,
|
|
2418
2543
|
getLoadedBootstrapDirection,
|
|
2419
|
-
|
|
2420
|
-
getNavItemsSync,
|
|
2544
|
+
getNavItemsService,
|
|
2421
2545
|
getPasswordSettings,
|
|
2422
2546
|
getPasswordValidationRules,
|
|
2423
2547
|
getPasswordValidators,
|
|
@@ -2426,9 +2550,8 @@ export {
|
|
|
2426
2550
|
getSeverityColorPalette as getSeverityColorScheme,
|
|
2427
2551
|
httpErrorConfigFactory,
|
|
2428
2552
|
initLazyStyleHandler,
|
|
2553
|
+
initializeThemeSharedRoutes,
|
|
2429
2554
|
injectThemeSharedStyles,
|
|
2430
|
-
removeNavItem,
|
|
2431
|
-
subscribeToNavItems,
|
|
2432
2555
|
useConfirmation,
|
|
2433
2556
|
useConfirmationContext,
|
|
2434
2557
|
useConfirmationState,
|
|
@@ -2439,6 +2562,7 @@ export {
|
|
|
2439
2562
|
useModal,
|
|
2440
2563
|
useModalContext,
|
|
2441
2564
|
useModalState,
|
|
2565
|
+
useNavItems,
|
|
2442
2566
|
useToaster,
|
|
2443
2567
|
useToasterContext,
|
|
2444
2568
|
useToasts
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Confirmation namespace containing types for confirmation dialogs.
|
|
3
|
-
* Translated from @abp/ng.theme.shared/lib/models/confirmation.ts
|
|
3
|
+
* Translated from @abp/ng.theme.shared/lib/models/confirmation.ts v3.0.0
|
|
4
4
|
*
|
|
5
5
|
* @since 2.0.0 - Major changes:
|
|
6
6
|
* - Options no longer extends Toaster.Options
|
|
@@ -10,13 +10,14 @@
|
|
|
10
10
|
*
|
|
11
11
|
* @since 2.1.0 - Added Status enum (confirmation-specific, replaces Toaster.Status usage)
|
|
12
12
|
* @since 2.9.0 - Added dismissible property, deprecated closable
|
|
13
|
+
* @since 3.0.0 - Removed closable property (use dismissible instead)
|
|
13
14
|
*/
|
|
14
15
|
import type { Config } from '@abpjs/core';
|
|
15
16
|
export declare namespace Confirmation {
|
|
16
17
|
/**
|
|
17
18
|
* Options for configuring a confirmation dialog.
|
|
18
19
|
* @since 2.0.0 - No longer extends Toaster.Options
|
|
19
|
-
* @since
|
|
20
|
+
* @since 3.0.0 - Removed closable (use dismissible instead)
|
|
20
21
|
*/
|
|
21
22
|
interface Options {
|
|
22
23
|
/** Unique identifier for the confirmation */
|
|
@@ -38,11 +39,6 @@ export declare namespace Confirmation {
|
|
|
38
39
|
cancelText?: Config.LocalizationParam;
|
|
39
40
|
/** Custom text for the yes button */
|
|
40
41
|
yesText?: Config.LocalizationParam;
|
|
41
|
-
/**
|
|
42
|
-
* Whether the confirmation can be closed by clicking outside or pressing escape.
|
|
43
|
-
* @deprecated Use dismissible instead. To be deleted in v3.0.
|
|
44
|
-
*/
|
|
45
|
-
closable?: boolean;
|
|
46
42
|
}
|
|
47
43
|
/**
|
|
48
44
|
* Dialog data structure for confirmation dialogs.
|
package/dist/models/index.d.ts
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Models barrel export
|
|
3
|
+
* @since 3.0.0 - Removed setting-management (now in @abpjs/core SettingTabsService)
|
|
4
|
+
* @since 3.0.0 - Added nav-item model
|
|
5
|
+
*/
|
|
1
6
|
export * from './common';
|
|
2
|
-
export * from './toaster';
|
|
3
7
|
export * from './confirmation';
|
|
4
|
-
export * from './
|
|
8
|
+
export * from './nav-item';
|
|
5
9
|
export * from './statistics';
|
|
10
|
+
export * from './toaster';
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Nav Item Model
|
|
3
|
+
* Translated from @abp/ng.theme.shared/lib/models/nav-item.ts v3.0.0
|
|
4
|
+
*
|
|
5
|
+
* @since 3.0.0 - Added id property, changed permission to requiredPolicy
|
|
6
|
+
*/
|
|
7
|
+
import type { ComponentType } from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* Navigation item configuration.
|
|
10
|
+
* @since 3.0.0 - Added id property, changed permission to requiredPolicy
|
|
11
|
+
*/
|
|
12
|
+
export interface NavItem {
|
|
13
|
+
/**
|
|
14
|
+
* Unique identifier for the nav item.
|
|
15
|
+
* @since 3.0.0
|
|
16
|
+
*/
|
|
17
|
+
id: string | number;
|
|
18
|
+
/**
|
|
19
|
+
* React component to render for this nav item.
|
|
20
|
+
*/
|
|
21
|
+
component?: ComponentType<any>;
|
|
22
|
+
/**
|
|
23
|
+
* Raw HTML string to render (use with caution for XSS).
|
|
24
|
+
*/
|
|
25
|
+
html?: string;
|
|
26
|
+
/**
|
|
27
|
+
* Action to execute when the nav item is clicked.
|
|
28
|
+
*/
|
|
29
|
+
action?: () => void;
|
|
30
|
+
/**
|
|
31
|
+
* Order for sorting nav items. Lower numbers appear first.
|
|
32
|
+
*/
|
|
33
|
+
order?: number;
|
|
34
|
+
/**
|
|
35
|
+
* Required policy to show this nav item.
|
|
36
|
+
* @since 3.0.0 - Renamed from permission
|
|
37
|
+
*/
|
|
38
|
+
requiredPolicy?: string;
|
|
39
|
+
}
|
package/dist/models/toaster.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { Config } from '@abpjs/core';
|
|
2
2
|
/**
|
|
3
3
|
* Toaster namespace containing types and interfaces for toast notifications.
|
|
4
|
-
* Translated from @abp/ng.theme.shared/lib/models/toaster.ts
|
|
4
|
+
* Translated from @abp/ng.theme.shared/lib/models/toaster.ts v3.0.0
|
|
5
5
|
*
|
|
6
6
|
* @since 2.0.0 - Major changes:
|
|
7
7
|
* - `Options` renamed to `ToastOptions`
|
|
@@ -9,7 +9,7 @@ import type { Config } from '@abpjs/core';
|
|
|
9
9
|
* - `Severity` type changed: 'warn' → 'warning', added 'neutral'
|
|
10
10
|
* - ToasterService methods now return number (toast ID) instead of Observable
|
|
11
11
|
*
|
|
12
|
-
* @since
|
|
12
|
+
* @since 3.0.0 - Status enum removed, use Confirmation.Status instead
|
|
13
13
|
*/
|
|
14
14
|
export declare namespace Toaster {
|
|
15
15
|
/**
|
|
@@ -53,46 +53,4 @@ export declare namespace Toaster {
|
|
|
53
53
|
* @since 2.0.0 - Changed 'warn' to 'warning', added 'neutral'
|
|
54
54
|
*/
|
|
55
55
|
type Severity = 'neutral' | 'success' | 'info' | 'warning' | 'error';
|
|
56
|
-
/**
|
|
57
|
-
* Status values for toast/confirmation interactions.
|
|
58
|
-
* @deprecated Status will be removed from toaster model in v3.0. Use Confirmation.Status instead.
|
|
59
|
-
* @since 2.1.0 - Deprecated in favor of Confirmation.Status
|
|
60
|
-
*/
|
|
61
|
-
enum Status {
|
|
62
|
-
confirm = "confirm",
|
|
63
|
-
reject = "reject",
|
|
64
|
-
dismiss = "dismiss"
|
|
65
|
-
}
|
|
66
|
-
/**
|
|
67
|
-
* @deprecated Use ToastOptions instead. Scheduled for removal in v3.0.0
|
|
68
|
-
* Preserved for backward compatibility.
|
|
69
|
-
*/
|
|
70
|
-
interface Options {
|
|
71
|
-
/** Unique identifier for the toast */
|
|
72
|
-
id?: string;
|
|
73
|
-
/** Whether the toast can be manually closed */
|
|
74
|
-
closable?: boolean;
|
|
75
|
-
/** Duration in milliseconds before auto-dismiss (default varies by implementation) */
|
|
76
|
-
life?: number;
|
|
77
|
-
/** If true, toast won't auto-dismiss */
|
|
78
|
-
sticky?: boolean;
|
|
79
|
-
/** Custom data to attach to the toast */
|
|
80
|
-
data?: unknown;
|
|
81
|
-
/** Parameters for localizing the message */
|
|
82
|
-
messageLocalizationParams?: string[];
|
|
83
|
-
/** Parameters for localizing the title */
|
|
84
|
-
titleLocalizationParams?: string[];
|
|
85
|
-
}
|
|
86
|
-
/**
|
|
87
|
-
* @deprecated Use Toast instead. Scheduled for removal in v3.0.0
|
|
88
|
-
* Preserved for backward compatibility.
|
|
89
|
-
*/
|
|
90
|
-
interface Message extends Options {
|
|
91
|
-
/** The message content (can be a localization key) */
|
|
92
|
-
message: string;
|
|
93
|
-
/** The title (can be a localization key) */
|
|
94
|
-
title?: string;
|
|
95
|
-
/** Severity level of the message */
|
|
96
|
-
severity: Severity;
|
|
97
|
-
}
|
|
98
56
|
}
|
|
@@ -131,5 +131,5 @@ export interface ThemeSharedProviderProps {
|
|
|
131
131
|
* }
|
|
132
132
|
* ```
|
|
133
133
|
*/
|
|
134
|
-
export declare function ThemeSharedProvider({ children, renderToasts, renderConfirmation, themeOverrides, toastPosition, enableColorMode, defaultColorMode, locale, }: ThemeSharedProviderProps): React.ReactElement;
|
|
134
|
+
export declare function ThemeSharedProvider({ children, renderToasts, renderConfirmation, themeOverrides, toastPosition: _toastPosition, enableColorMode, defaultColorMode, locale, }: ThemeSharedProviderProps): React.ReactElement;
|
|
135
135
|
export default ThemeSharedProvider;
|