@addev-be/ui 0.20.5 → 0.20.8

package/dist/helpers/styled/space.js

@@ -0,0 +1,56 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.space = exports.paddings = exports.margins = void 0;
+var styled_components_1 = require("styled-components");
+exports.margins = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"])), function (_a) {
+    var m = _a.m;
+    return m && "margin: var(--space-".concat(m, ");");
+}, function (_a) {
+    var mx = _a.mx;
+    return mx && "margin-left: var(--space-".concat(mx, "); margin-right: var(--space-").concat(mx, ");");
+}, function (_a) {
+    var my = _a.my;
+    return my && "margin-top: var(--space-".concat(my, "); margin-bottom: var(--space-").concat(my, ");");
+}, function (_a) {
+    var mt = _a.mt;
+    return mt && "margin-top: var(--space-".concat(mt, ");");
+}, function (_a) {
+    var mr = _a.mr;
+    return mr && "margin-right: var(--space-".concat(mr, ");");
+}, function (_a) {
+    var mb = _a.mb;
+    return mb && "margin-bottom: var(--space-".concat(mb, ");");
+}, function (_a) {
+    var ml = _a.ml;
+    return ml && "margin-left: var(--space-".concat(ml, ");");
+});
+exports.paddings = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"])), function (_a) {
+    var p = _a.p;
+    return p && "padding: var(--space-".concat(p, ");");
+}, function (_a) {
+    var px = _a.px;
+    return px &&
+        "padding-left: var(--space-".concat(px, "); padding-right: var(--space-").concat(px, ");");
+}, function (_a) {
+    var py = _a.py;
+    return py &&
+        "padding-top: var(--space-".concat(py, "); padding-bottom: var(--space-").concat(py, ");");
+}, function (_a) {
+    var pt = _a.pt;
+    return pt && "padding-top: var(--space-".concat(pt, ");");
+}, function (_a) {
+    var pr = _a.pr;
+    return pr && "padding-right: var(--space-".concat(pr, ");");
+}, function (_a) {
+    var pb = _a.pb;
+    return pb && "padding-bottom: var(--space-".concat(pb, ");");
+}, function (_a) {
+    var pl = _a.pl;
+    return pl && "padding-left: var(--space-".concat(pl, ");");
+});
+exports.space = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n"])), exports.margins, exports.paddings);
+var templateObject_1, templateObject_2, templateObject_3;

package/dist/hooks/index.d.ts

@@ -1,2 +1,7 @@
 export * from './useElementSize';
+export * from './useShowArchived';
 export * from './useWindowSize';
+export * from './useMediaQuery';
+export * from './useContainerMediaQuery';
+export * from './useMediaQueryForWidth';
+export * from './useMutableState';

package/dist/hooks/index.js

@@ -15,4 +15,9 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./useElementSize"), exports);
+__exportStar(require("./useShowArchived"), exports);
 __exportStar(require("./useWindowSize"), exports);
+__exportStar(require("./useMediaQuery"), exports);
+__exportStar(require("./useContainerMediaQuery"), exports);
+__exportStar(require("./useMediaQueryForWidth"), exports);
+__exportStar(require("./useMutableState"), exports);

package/dist/hooks/useContainerMediaQuery.d.ts

@@ -0,0 +1,17 @@
+export declare const useContainerMediaQuery: (element: HTMLElement) => {
+    breakpoint: "xs" | "sm" | "lg" | "xl" | "md" | "xxl";
+    isXs: boolean;
+    isSm: boolean;
+    isMd: boolean;
+    isLg: boolean;
+    isXl: boolean;
+    isXxl: boolean;
+    isSmDown: boolean;
+    isMdDown: boolean;
+    isLgDown: boolean;
+    isXlDown: boolean;
+    isSmUp: boolean;
+    isMdUp: boolean;
+    isLgUp: boolean;
+    isXlUp: boolean;
+};

package/dist/hooks/useContainerMediaQuery.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useContainerMediaQuery = void 0;
+var useElementSize_1 = require("./useElementSize");
+var useMediaQueryForWidth_1 = require("./useMediaQueryForWidth");
+var useContainerMediaQuery = function (element) {
+    var width = (0, useElementSize_1.useElementSize)(element).width;
+    return (0, useMediaQueryForWidth_1.useMediaQueryForWidth)(width);
+};
+exports.useContainerMediaQuery = useContainerMediaQuery;

package/dist/hooks/useMediaQuery.d.ts

@@ -0,0 +1,17 @@
+export declare const useMediaQuery: () => {
+    breakpoint: "xs" | "sm" | "lg" | "xl" | "md" | "xxl";
+    isXs: boolean;
+    isSm: boolean;
+    isMd: boolean;
+    isLg: boolean;
+    isXl: boolean;
+    isXxl: boolean;
+    isSmDown: boolean;
+    isMdDown: boolean;
+    isLgDown: boolean;
+    isXlDown: boolean;
+    isSmUp: boolean;
+    isMdUp: boolean;
+    isLgUp: boolean;
+    isXlUp: boolean;
+};

package/dist/hooks/useMediaQuery.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMediaQuery = void 0;
+var useMediaQueryForWidth_1 = require("./useMediaQueryForWidth");
+var useWindowSize_1 = require("./useWindowSize");
+var useMediaQuery = function () {
+    var width = (0, useWindowSize_1.useWindowSize)().width;
+    var realWidth = width !== null && width !== void 0 ? width : 0;
+    return (0, useMediaQueryForWidth_1.useMediaQueryForWidth)(realWidth);
+};
+exports.useMediaQuery = useMediaQuery;

package/dist/hooks/useMediaQueryForWidth.d.ts

@@ -0,0 +1,17 @@
+export declare const useMediaQueryForWidth: (width: number) => {
+    breakpoint: "xs" | "sm" | "lg" | "xl" | "md" | "xxl";
+    isXs: boolean;
+    isSm: boolean;
+    isMd: boolean;
+    isLg: boolean;
+    isXl: boolean;
+    isXxl: boolean;
+    isSmDown: boolean;
+    isMdDown: boolean;
+    isLgDown: boolean;
+    isXlDown: boolean;
+    isSmUp: boolean;
+    isMdUp: boolean;
+    isLgUp: boolean;
+    isXlUp: boolean;
+};

package/dist/hooks/useMediaQueryForWidth.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMediaQueryForWidth = void 0;
+var responsive_1 = require("../helpers/responsive");
+var react_1 = require("react");
+var useMediaQueryForWidth = function (width) {
+    var breakpoint = (0, responsive_1.findBreakpoint)(width);
+    return (0, react_1.useMemo)(function () { return ({
+        breakpoint: breakpoint,
+        isXs: breakpoint === 'xs',
+        isSm: breakpoint === 'sm',
+        isMd: breakpoint === 'md',
+        isLg: breakpoint === 'lg',
+        isXl: breakpoint === 'xl',
+        isXxl: breakpoint === 'xxl',
+        isSmDown: (0, responsive_1.isSmallerThanOrEqual)('sm', breakpoint),
+        isMdDown: (0, responsive_1.isSmallerThanOrEqual)('md', breakpoint),
+        isLgDown: (0, responsive_1.isSmallerThanOrEqual)('lg', breakpoint),
+        isXlDown: (0, responsive_1.isSmallerThanOrEqual)('xl', breakpoint),
+        isSmUp: (0, responsive_1.isGreaterThanOrEqual)('sm', breakpoint),
+        isMdUp: (0, responsive_1.isGreaterThanOrEqual)('md', breakpoint),
+        isLgUp: (0, responsive_1.isGreaterThanOrEqual)('lg', breakpoint),
+        isXlUp: (0, responsive_1.isGreaterThanOrEqual)('xl', breakpoint),
+    }); }, [breakpoint]);
+};
+exports.useMediaQueryForWidth = useMediaQueryForWidth;

package/dist/hooks/useMutableState.d.ts

@@ -0,0 +1,2 @@
+import { DeepPartial } from '../typings';
+export declare const useMutableState: <T>(initialValue?: T | (() => T)) => readonly [T, import("react").Dispatch<import("react").SetStateAction<T>>, (partialValue: DeepPartial<T>) => void];

package/dist/hooks/useMutableState.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMutableState = void 0;
+var lodash_1 = require("lodash");
+var react_1 = require("react");
+var useMutableState = function (initialValue) {
+    if (initialValue === void 0) { initialValue = {}; }
+    var _a = (0, react_1.useState)(initialValue), value = _a[0], setValue = _a[1];
+    var setPartialValue = (0, react_1.useCallback)(function (partialValue) {
+        var oldValue = (0, lodash_1.cloneDeep)(value);
+        var newValue = (0, lodash_1.merge)(oldValue, partialValue);
+        setValue(function () { return newValue; });
+    }, [value]);
+    return [value, setValue, setPartialValue];
+};
+exports.useMutableState = useMutableState;

package/dist/hooks/useShowArchived.d.ts

@@ -0,0 +1,6 @@
+import { ConditionDTO } from '../services/sqlRequests';
+export declare const useShowArchived: (initialValue?: boolean) => {
+    archivedConditions: ConditionDTO[];
+    showArchived: boolean;
+    toggleShowArchived: (value?: boolean) => void;
+};

package/dist/hooks/useShowArchived.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useShowArchived = void 0;
+var react_1 = require("react");
+var useShowArchived = function (initialValue) {
+    var _a = (0, react_1.useState)(initialValue !== null && initialValue !== void 0 ? initialValue : false), showArchived = _a[0], setShowArchived = _a[1];
+    var toggleShowArchived = (0, react_1.useCallback)(function (value) {
+        setShowArchived(function (prev) { return (value === undefined ? !prev : value); });
+    }, []);
+    var archivedConditions = (0, react_1.useMemo)(function () {
+        return showArchived
+            ? []
+            : [{ field: 'Archived', operator: 'notEquals', value: 1 }];
+    }, [showArchived]);
+    return (0, react_1.useMemo)(function () { return ({
+        archivedConditions: archivedConditions,
+        showArchived: showArchived,
+        toggleShowArchived: toggleShowArchived,
+    }); }, [archivedConditions, showArchived, toggleShowArchived]);
+};
+exports.useShowArchived = useShowArchived;

package/dist/index.d.ts

@@ -3,4 +3,5 @@ export * from './providers';
 export * from './Icons';
 export * from './config';
 export * from './helpers';
+export * from './hooks';
 export * from './services';

package/dist/index.js

@@ -19,4 +19,5 @@ __exportStar(require("./providers"), exports);
 __exportStar(require("./Icons"), exports);
 __exportStar(require("./config"), exports);
 __exportStar(require("./helpers"), exports);
+__exportStar(require("./hooks"), exports);
 __exportStar(require("./services"), exports);

package/dist/providers/AuthenticationProvider/index.d.ts

@@ -1,6 +1,7 @@
 import { FC, PropsWithChildren } from 'react';
 import { UserDTO } from '../../services';
 export type AuthenticationContextProps = {
+    status?: number;
     token?: string;
     user?: UserDTO;
     isAuthenticated: boolean;

package/dist/providers/AuthenticationProvider/index.js

@@ -53,6 +53,7 @@ var react_1 = require("react");
 var services_1 = require("../../services");
 var helpers_1 = require("./helpers");
 exports.AuthenticationContext = (0, react_1.createContext)({
+    status: undefined,
     authenticate: function () { },
     isAuthenticated: false,
     login: function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
@@ -78,18 +79,24 @@ var AuthenticationProvider = function (_a) {
     var _b, _c;
     var permissions = _a.permissions, LoginComponent = _a.loginComponent, children = _a.children, requestHandlerName = _a.requestHandlerName;
     var allPermissions = (0, react_1.useMemo)(function () { return (__assign(__assign({}, helpers_1.basePermissions), permissions)); }, [permissions]);
-    var _d = (0, react_1.useState)(false), setWebSocketStatus = _d[1];
-    var _e = (0, react_1.useState)(sessionStorage.getItem('authToken') || undefined), token = _e[0], setToken = _e[1];
-    var _f = (0, react_1.useState)(undefined), user = _f[0], setUser = _f[1];
+    var _d = (0, react_1.useState)(false), isLoading = _d[0], setIsLoading = _d[1];
+    var _e = (0, react_1.useState)(false), setWebSocketStatus = _e[1];
+    var _f = (0, react_1.useState)(sessionStorage.getItem('authToken') || undefined), token = _f[0], setToken = _f[1];
+    var _g = (0, react_1.useState)(undefined), user = _g[0], setUser = _g[1];
+    var _h = (0, react_1.useState)(undefined), status = _h[0], setStatus = _h[1];
     var sendAuthenticateRequest = (0, services_1.useAuthenticateRequestHandler)(requestHandlerName);
     var sendLoginRequest = (0, services_1.useLoginRequestHandler)();
     var sendLogoutRequest = (0, services_1.useLogoutRequestHandler)();
     var sendSendRecoveryKeyRequest = (0, services_1.useSendRecoveryKeyRequestHandler)();
     var sendCheckRecoveryKeyRequest = (0, services_1.useCheckRecoveryKeyRequestHandler)();
     var sendResetPasswordRequest = (0, services_1.useResetPasswordRequestHandler)();
-    var authenticate = (0, react_1.useCallback)(function () {
-        if (token && !user) {
+    var authenticate = (0, react_1.useCallback)(function (force) {
+        if (force === void 0) { force = false; }
+        if (token && (!user || force) && !isLoading) {
+            setIsLoading(true);
             sendAuthenticateRequest({ token: token }).then(function (response) {
+                setIsLoading(false);
+                setStatus(response.status);
                 if (response.status === 0 && response.user) {
                     setUser(response.user);
                 }
@@ -98,11 +105,12 @@ var AuthenticationProvider = function (_a) {
                     setUser(undefined);
                 }
             }, function () {
+                setIsLoading(false);
                 setToken(undefined);
                 setUser(undefined);
             });
         }
-    }, [sendAuthenticateRequest, token, user]);
+    }, [isLoading, sendAuthenticateRequest, token, user]);
     (0, react_1.useEffect)(function () {
         if (token) {
             sessionStorage.setItem('authToken', token);
@@ -112,10 +120,16 @@ var AuthenticationProvider = function (_a) {
             sessionStorage.removeItem('authToken');
         }
     }, [authenticate, token]);
+    var _j = (0, react_1.useState)(false), networkStatus = _j[0], setNetworkStatus = _j[1];
     var login = (0, react_1.useCallback)(function (username, password) { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
+            if (isLoading) {
+                throw new Error('Already loading');
+            }
+            setIsLoading(true);
             return [2 /*return*/, sendLoginRequest({ username: username, password: password })
                     .then(function (response) {
+                    setIsLoading(false);
                     if (response.status === 0 && response.user) {
                         setToken(response.token);
                         setUser(response.user);
@@ -124,12 +138,13 @@ var AuthenticationProvider = function (_a) {
                     throw new Error("Login failed with status ".concat(response.status));
                 })
                     .catch(function () {
+                    setIsLoading(false);
                     setToken(undefined);
                     setUser(undefined);
                     return false;
                 })];
         });
-    }); }, [sendLoginRequest]);
+    }); }, [isLoading, sendLoginRequest]);
     var logout = (0, react_1.useCallback)(function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             return [2 /*return*/, sendLogoutRequest({})
@@ -139,6 +154,7 @@ var AuthenticationProvider = function (_a) {
                     .finally(function () {
                     setToken(undefined);
                     setUser(undefined);
+                    setStatus(undefined);
                 })];
         });
     }); }, [sendLogoutRequest]);
@@ -178,7 +194,33 @@ var AuthenticationProvider = function (_a) {
         (_b = user === null || user === void 0 ? void 0 : user.profile) === null || _b === void 0 ? void 0 : _b.isAdmin,
         (_c = user === null || user === void 0 ? void 0 : user.profile) === null || _c === void 0 ? void 0 : _c.permissions,
     ]);
+    var webSocketStatusChanged = (0, react_1.useCallback)(function (status) {
+        if (!networkStatus && status) {
+            authenticate(true);
+        }
+        setNetworkStatus(status);
+    }, [authenticate, networkStatus]);
+    var webSocketErrorReceived = (0, react_1.useCallback)(function (_a) {
+        var status = _a.status;
+        // Handle logout when NotAuthenticated error is received
+        if (status === -4) {
+            logout();
+        }
+    }, [logout]);
+    (0, react_1.useEffect)(function () {
+        var subscription = services_1.WebSocketService.getInstance().status$.subscribe(webSocketStatusChanged);
+        return function () {
+            subscription.unsubscribe();
+        };
+    }, [webSocketStatusChanged]);
+    (0, react_1.useEffect)(function () {
+        var subscription = services_1.WebSocketService.getInstance().error$.subscribe(webSocketErrorReceived);
+        return function () {
+            subscription.unsubscribe();
+        };
+    }, [webSocketErrorReceived]);
     var contextValue = (0, react_1.useMemo)(function () { return ({
+        status: status,
         token: token,
         user: user,
         isAuthenticated: !!user,
@@ -192,24 +234,24 @@ var AuthenticationProvider = function (_a) {
         hasPermission: hasPermission,
         setToken: setToken,
     }); }, [
-        allPermissions,
+        status,
+        token,
+        user,
         authenticate,
-        checkRecoveryKey,
-        hasPermission,
         login,
         logout,
-        resetPassword,
         sendRecoveryKey,
-        token,
-        user,
-        setToken,
+        checkRecoveryKey,
+        resetPassword,
+        allPermissions,
+        hasPermission,
     ]);
     (0, react_1.useEffect)(function () {
         var _a;
         var subscription = (_a = services_1.WebSocketService.getInstance()) === null || _a === void 0 ? void 0 : _a.status$.subscribe(function (newStatus) {
             setWebSocketStatus(function (previousStatus) {
                 if (!previousStatus && newStatus) {
-                    authenticate();
+                    authenticate(true);
                 }
                 return newStatus;
             });

package/dist/providers/PortalsProvider/styles.js

@@ -17,5 +17,5 @@ exports.PortalsWrapper = styled_components_1.default.div.attrs({
 })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 0;\n  height: 0;\n"], ["\n  width: 0;\n  height: 0;\n"])));
 exports.PortalContainer = styled_components_1.default.div.attrs({
     className: 'PortalContainer',
-})(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  z-index: 9999;\n  position: fixed;\n  inset: 0;\n"], ["\n  z-index: 9999;\n  position: fixed;\n  inset: 0;\n"])));
 var templateObject_1, templateObject_2, templateObject_3;

package/dist/providers/ThemeProvider/defaultTheme.js

@@ -376,6 +376,12 @@ exports.defaultTheme = {
         '32': '8rem',
         '40': '10rem',
         '48': '12rem',
+        '56': '14rem',
+        '64': '16rem',
+        '72': '18rem',
+        '80': '20rem',
+        '96': '24rem',
+        '128': '32rem',
     },
     sizes: {
         '0': '0',
@@ -390,12 +396,19 @@ exports.defaultTheme = {
         '8': '2rem',
         '10': '2.5rem',
         '12': '3rem',
+        '14': '3.5rem',
         '16': '4rem',
         '20': '5rem',
         '24': '6rem',
         '32': '8rem',
         '40': '10rem',
         '48': '12rem',
+        '56': '14rem',
+        '64': '16rem',
+        '72': '18rem',
+        '80': '20rem',
+        '96': '24rem',
+        '128': '32rem',
     },
     rounded: {
         none: '0',

package/dist/providers/ThemeProvider/helpers.d.ts

@@ -0,0 +1,8 @@
+import { ThemeColor, ThemeColorIntensity, ThemeColorWithIntensity } from './types';
+export declare const getColor: (colorWithIntensity: ThemeColorWithIntensity) => ThemeColor;
+export declare const getIntensity: (colorWithIntensity: ThemeColorWithIntensity) => ThemeColorIntensity;
+export declare const isThemeColorWithIntensity: (color: ThemeColor | ThemeColorWithIntensity) => color is ThemeColorWithIntensity;
+export declare const getColorWithIntensity: (color: ThemeColor | ThemeColorWithIntensity, defaultIntensity?: ThemeColorIntensity) => ThemeColorWithIntensity;
+export declare const extractColorAndIntensity: (color: ThemeColor | ThemeColorWithIntensity, defaultIntensity?: ThemeColorIntensity) => [ThemeColor, ThemeColorIntensity];
+export declare const darkenColor: (color: ThemeColor | ThemeColorWithIntensity, amount?: number) => ThemeColorWithIntensity;
+export declare const lightenColor: (color: ThemeColor | ThemeColorWithIntensity, amount?: number) => ThemeColorWithIntensity;

package/dist/providers/ThemeProvider/helpers.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.lightenColor = exports.darkenColor = exports.extractColorAndIntensity = exports.getColorWithIntensity = exports.isThemeColorWithIntensity = exports.getIntensity = exports.getColor = void 0;
+var getColor = function (colorWithIntensity) {
+    var colorName = colorWithIntensity.split('-')[0];
+    return colorName;
+};
+exports.getColor = getColor;
+var getIntensity = function (colorWithIntensity) {
+    var _a = colorWithIntensity.split('-'), intensity = _a[1];
+    return Number(intensity);
+};
+exports.getIntensity = getIntensity;
+var isThemeColorWithIntensity = function (color) {
+    return color.indexOf('-') >= 0;
+};
+exports.isThemeColorWithIntensity = isThemeColorWithIntensity;
+var getColorWithIntensity = function (color, defaultIntensity) {
+    if (defaultIntensity === void 0) { defaultIntensity = 300; }
+    if ((0, exports.isThemeColorWithIntensity)(color)) {
+        return color;
+    }
+    return "".concat(color, "-").concat(defaultIntensity);
+};
+exports.getColorWithIntensity = getColorWithIntensity;
+var extractColorAndIntensity = function (color, defaultIntensity) {
+    if (defaultIntensity === void 0) { defaultIntensity = 300; }
+    if ((0, exports.isThemeColorWithIntensity)(color)) {
+        var _a = color.split('-'), colorName = _a[0], intensity = _a[1];
+        return [
+            colorName,
+            intensity ? Number(intensity) : defaultIntensity,
+        ];
+    }
+    return [color, defaultIntensity];
+};
+exports.extractColorAndIntensity = extractColorAndIntensity;
+var darkenColor = function (color, amount) {
+    if (amount === void 0) { amount = 100; }
+    var _a = (0, exports.extractColorAndIntensity)(color), colorName = _a[0], intensity = _a[1];
+    var newIntensity = (Math.floor(Math.min(intensity + amount, 950) / 100) *
+        100);
+    return "".concat(colorName, "-").concat(newIntensity);
+};
+exports.darkenColor = darkenColor;
+var lightenColor = function (color, amount) {
+    if (amount === void 0) { amount = 100; }
+    var _a = (0, exports.extractColorAndIntensity)(color), colorName = _a[0], intensity = _a[1];
+    var newIntensity = (Math.floor(Math.max(intensity - amount, 0) / 100) *
+        100);
+    return "".concat(colorName, "-").concat(newIntensity);
+};
+exports.lightenColor = lightenColor;

package/dist/providers/ThemeProvider/types.d.ts

@@ -5,10 +5,11 @@ export type ThemeRawColor = 'slate' | 'gray' | 'zinc' | 'neutral' | 'stone' | 'r
 export type ThemePredefinedColor = 'primary' | 'secondary' | 'neutral' | 'success' | 'warning' | 'danger' | 'info';
 export type ThemeColor = ThemeRawColor | ThemePredefinedColor;
 export type ThemeColorReference = ThemeColor | ThemeColorDefinition;
+export type ThemeColorWithIntensity = `${ThemeColor}-${ThemeColorIntensity}`;
 export type ThemeTextSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
 export type ThemeFontFamily = 'sans' | 'serif' | 'mono';
 export type ThemeFontWeight = 'light' | 'normal' | 'bold';
-export type ThemeSpace = '0' | '0_5' | '1' | '1_5' | '2' | '3' | '4' | '5' | '6' | '8' | '10' | '12' | '16' | '20' | '24' | '32' | '40' | '48';
+export type ThemeSpace = '0' | '0_5' | '1' | '1_5' | '2' | '3' | '4' | '5' | '6' | '8' | '10' | '12' | '14' | '16' | '20' | '24' | '32' | '40' | '48' | '56' | '64' | '72' | '80' | '96' | '128';
 export type ThemeSize = '0' | '0_5' | '1' | '1_5' | '2' | '3' | '4' | '5' | '6' | '8' | '10' | '12' | '16' | '20' | '24' | '32' | '40' | '48';
 export type ThemeRounded = 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full';
 export type ThemeShadow = 'sm' | 'md' | 'lg' | 'xl' | '2xl';

package/dist/providers/TrackingProvider/hooks.d.ts

@@ -0,0 +1 @@
+export declare const useLocationTracking: () => void;

package/dist/providers/TrackingProvider/hooks.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLocationTracking = void 0;
+var react_1 = require("react");
+var _1 = require(".");
+var react_router_dom_1 = require("react-router-dom");
+var useLocationTracking = function () {
+    var sendEvent = (0, react_1.useContext)(_1.TrackingContext).sendEvent;
+    var _a = (0, react_router_dom_1.useLocation)(), pathname = _a.pathname, search = _a.search;
+    var pathWithSearch = "".concat(pathname).concat(search);
+    (0, react_1.useEffect)(function () {
+        sendEvent('PageView', { path: pathWithSearch });
+    }, [pathWithSearch, sendEvent]);
+};
+exports.useLocationTracking = useLocationTracking;

package/dist/providers/TrackingProvider/index.d.ts

@@ -0,0 +1,8 @@
+import { FC, PropsWithChildren } from 'react';
+export type TrackingContextType = {
+    sendEvent: (name: string, details?: Record<string, string | number | boolean | null>) => void;
+    enableTracking: () => void;
+    disableTracking: () => void;
+};
+export declare const TrackingContext: import("react").Context<TrackingContextType>;
+export declare const TrackingProvider: FC<PropsWithChildren>;

package/dist/providers/TrackingProvider/index.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TrackingProvider = exports.TrackingContext = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var services_1 = require("../../services");
+exports.TrackingContext = (0, react_1.createContext)({
+    sendEvent: function () { },
+    enableTracking: function () { },
+    disableTracking: function () { },
+});
+var TrackingProvider = function (_a) {
+    var children = _a.children;
+    var _b = (0, react_1.useState)(true), trackingEnabled = _b[0], setTrackingEnabled = _b[1];
+    var sendTrackingEvent = (0, services_1.useSendTrackingEventRequestHandler)();
+    var sendEvent = (0, react_1.useCallback)(function (name, details) {
+        if (details === void 0) { details = {}; }
+        if (trackingEnabled) {
+            sendTrackingEvent({
+                data: {
+                    id: '',
+                    name: name,
+                    details: details,
+                },
+            });
+        }
+    }, [sendTrackingEvent, trackingEnabled]);
+    var enableTracking = (0, react_1.useCallback)(function () {
+        setTrackingEnabled(true);
+    }, []);
+    var disableTracking = (0, react_1.useCallback)(function () {
+        setTrackingEnabled(false);
+    }, []);
+    var value = (0, react_1.useMemo)(function () { return ({
+        sendEvent: sendEvent,
+        enableTracking: enableTracking,
+        disableTracking: disableTracking,
+    }); }, [disableTracking, enableTracking, sendEvent]);
+    return ((0, jsx_runtime_1.jsx)(exports.TrackingContext.Provider, { value: value, children: children }));
+};
+exports.TrackingProvider = TrackingProvider;

package/dist/providers/UiProviders/index.js

@@ -32,6 +32,7 @@ var react_1 = require("react");
 var PortalsProvider_1 = require("../PortalsProvider");
 var SettingsProvider_1 = require("../SettingsProvider");
 var ThemeProvider_1 = require("../ThemeProvider/ThemeProvider");
+var TrackingProvider_1 = require("../TrackingProvider");
 var defaultTheme_1 = require("../ThemeProvider/defaultTheme");
 exports.UiContext = (0, react_1.createContext)({
     rootRect: new DOMRect(),
@@ -57,6 +58,6 @@ var UiProviders = function (_a) {
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [rootRef.current]);
-    return ((0, jsx_runtime_1.jsx)(ThemeProvider_1.ThemeProvider, { "$theme": defaultTheme_1.defaultTheme, "$darkMode": $darkMode, children: (0, jsx_runtime_1.jsx)(exports.UiContext.Provider, { value: value, children: (0, jsx_runtime_1.jsx)(styles.Root, { ref: rootRef, children: (0, jsx_runtime_1.jsx)(SettingsProvider_1.SettingsProvider, { children: (0, jsx_runtime_1.jsx)(PortalsProvider_1.PortalsProvider, { children: children }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(ThemeProvider_1.ThemeProvider, { "$theme": defaultTheme_1.defaultTheme, "$darkMode": $darkMode, children: (0, jsx_runtime_1.jsx)(exports.UiContext.Provider, { value: value, children: (0, jsx_runtime_1.jsx)(styles.Root, { ref: rootRef, children: (0, jsx_runtime_1.jsx)(SettingsProvider_1.SettingsProvider, { children: (0, jsx_runtime_1.jsx)(TrackingProvider_1.TrackingProvider, { children: (0, jsx_runtime_1.jsx)(PortalsProvider_1.PortalsProvider, { children: children }) }) }) }) }) }));
 };
 exports.UiProviders = UiProviders;

package/dist/providers/index.d.ts

@@ -1,5 +1,7 @@
 export * from './AuthenticationProvider';
 export * from './PortalsProvider';
 export * from './ThemeProvider';
+export * from './TrackingProvider';
 export * from './UiProviders';
+export * from './TrackingProvider/hooks';
 export * from './hooks';