lkd-web-kit 0.9.1 → 0.10.0

package/dist/components/EmptyState/index.cjs

@@ -8,6 +8,9 @@ var pxBySize = {
 	md: 60,
 	lg: 84
 };
+/**
+* @deprecated Use Mantine's EmptyState from @mantine/core instead.
+*/
 var EmptyState = ({ label, action, icon, size = "md", ...props }) => {
 	const { colors } = (0, _mantine_core.useMantineTheme)();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {

package/dist/components/EmptyState/index.d.ts

@@ -1,5 +1,8 @@
 import { ComponentProps, ReactNode } from 'react';
 import { IconFC } from '../Icon';
+/**
+ * @deprecated Use Mantine's EmptyState from @mantine/core instead.
+ */
 export interface EmptyProps extends ComponentProps<'div'> {
     label: ReactNode;
     action?: ReactNode;
@@ -11,6 +14,9 @@ declare const pxBySize: {
     md: number;
     lg: number;
 };
+/**
+ * @deprecated Use Mantine's EmptyState from @mantine/core instead.
+ */
 export declare const EmptyState: ({ label, action, icon, size, ...props }: EmptyProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/EmptyState/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAQ,MAAM,EAAE,MAAM,SAAS,CAAA;AAEtC,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,KAAK,CAAC;IACvD,KAAK,EAAE,SAAS,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAA;CAC7B;AAED,QAAA,MAAM,QAAQ;;;;CAIb,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,yCAAgD,UAAU,4CAkCpF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAQ,MAAM,EAAE,MAAM,SAAS,CAAA;AAEtC;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,KAAK,CAAC;IACvD,KAAK,EAAE,SAAS,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAA;CAC7B;AAED,QAAA,MAAM,QAAQ;;;;CAIb,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,yCAAgD,UAAU,4CAkCpF,CAAA"}

package/dist/components/EmptyState/index.js

@@ -7,6 +7,9 @@ var pxBySize = {
 	md: 60,
 	lg: 84
 };
+/**
+* @deprecated Use Mantine's EmptyState from @mantine/core instead.
+*/
 var EmptyState = ({ label, action, icon, size = "md", ...props }) => {
 	const { colors } = useMantineTheme();
 	return /* @__PURE__ */ jsxs("div", {

package/dist/contexts/ModalManagerContext/index.cjs

@@ -0,0 +1,73 @@
+"use client";
+require("../../_virtual/_rolldown/runtime.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/contexts/ModalManagerContext/index.tsx
+var ModalManagerContext = (0, react.createContext)(void 0);
+var ModalManagerProvider = ({ children, modals, loadModals = [] }) => {
+	const [statusModal, setStatusModal] = (0, react.useState)([]);
+	(0, react.useEffect)(() => {
+		loadModals.forEach((modalKey) => {
+			Object.keys(modals).filter((key) => key.startsWith(modalKey)).forEach((key) => {
+				const item = modals[key];
+				item.load?.().then((modal) => {
+					item.component = modal.default;
+				});
+			});
+		});
+	}, [loadModals, modals]);
+	const showModal = (key, props, options) => {
+		const { multiple, ...modalProps } = options ?? {};
+		const modalState = {
+			modalKey: key,
+			props,
+			modalProps,
+			opened: true
+		};
+		setStatusModal((prev) => multiple ? [...prev, modalState] : [modalState]);
+	};
+	const closeModal = (key) => {
+		if (key === void 0) {
+			setStatusModal((prev) => prev.map((modal) => ({
+				...modal,
+				opened: false
+			})));
+			return;
+		}
+		setStatusModal((prev) => prev.map((modal) => modal.modalKey === key ? {
+			...modal,
+			opened: false
+		} : modal));
+	};
+	const renderModals = (0, react.useMemo)(() => statusModal.map(({ modalKey, props, opened, modalProps }, i) => {
+		const Component = modals[modalKey]?.component;
+		if (!Component) return null;
+		return /* @__PURE__ */ (0, react.createElement)(Component, {
+			...props,
+			key: `${modalKey}-${i}`,
+			modalProps: {
+				...modalProps,
+				opened,
+				zIndex: 200 + i
+			},
+			removeModal: () => {
+				setStatusModal((prev) => prev.filter((_, index) => index !== i));
+			}
+		});
+	}), [statusModal, modals]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ModalManagerContext.Provider, {
+		value: {
+			showModal,
+			closeModal
+		},
+		children: [renderModals, children]
+	});
+};
+var useModalManager = () => {
+	const context = (0, react.use)(ModalManagerContext);
+	if (context === void 0) throw Error("Out of context: useModalManager");
+	return context;
+};
+//#endregion
+exports.ModalManagerProvider = ModalManagerProvider;
+exports.useModalManager = useModalManager;

package/dist/contexts/ModalManagerContext/index.d.ts

@@ -0,0 +1,35 @@
+import { ModalProps } from '@mantine/core';
+import { ComponentType, ReactNode } from 'react';
+import { ModalManagerWrapperProps } from '../../hocs';
+export interface ModalRegistryItem<Props extends object = object> {
+    component?: ComponentType<ModalManagerWrapperProps<object>>;
+    load?: () => Promise<{
+        default: ComponentType<ModalManagerWrapperProps<object>>;
+    }>;
+    path?: string;
+    readonly __props?: Props;
+}
+export type ModalRegistryRecord = Record<string, ModalRegistryItem>;
+export interface ModalManagerRegistryOverride {
+}
+export type ModalRegistry = ModalManagerRegistryOverride extends {
+    modals: infer Registry extends ModalRegistryRecord;
+} ? Registry : ModalRegistryRecord;
+export type ModalKey = Extract<keyof ModalRegistry, string>;
+export type ShowModalOptions = {
+    multiple?: boolean;
+} & Partial<ModalProps>;
+export interface ModalManagerProviderProps {
+    children: ReactNode;
+    modals: ModalRegistry;
+    loadModals?: (ModalKey | (string & {}))[];
+}
+type PublicModalProps<Key extends ModalKey> = ModalRegistry[Key] extends ModalRegistryItem<infer Props> ? Props : never;
+type ModalManagerValues = {
+    showModal: <Key extends ModalKey>(key: Key, props?: PublicModalProps<Key>, options?: ShowModalOptions) => void;
+    closeModal: (key?: ModalKey) => void;
+};
+export declare const ModalManagerProvider: ({ children, modals, loadModals, }: ModalManagerProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useModalManager: () => ModalManagerValues;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/contexts/ModalManagerContext/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/contexts/ModalManagerContext/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,UAAU,CAAA;AAExD,MAAM,WAAW,iBAAiB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM;IAC9D,SAAS,CAAC,EAAE,aAAa,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC,CAAA;IAC3D,IAAI,CAAC,EAAE,MAAM,OAAO,CAAC;QAAE,OAAO,EAAE,aAAa,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC,CAAA;KAAE,CAAC,CAAA;IAClF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CACzB;AAED,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAA;AAEnE,MAAM,WAAW,4BAA4B;CAAG;AAEhD,MAAM,MAAM,aAAa,GAAG,4BAA4B,SAAS;IAC/D,MAAM,EAAE,MAAM,QAAQ,SAAS,mBAAmB,CAAA;CACnD,GACG,QAAQ,GACR,mBAAmB,CAAA;AAEvB,MAAM,MAAM,QAAQ,GAAG,OAAO,CAAC,MAAM,aAAa,EAAE,MAAM,CAAC,CAAA;AAE3D,MAAM,MAAM,gBAAgB,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,OAAO,CAAC,UAAU,CAAC,CAAA;AAE3E,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,SAAS,CAAA;IACnB,MAAM,EAAE,aAAa,CAAA;IACrB,UAAU,CAAC,EAAE,CAAC,QAAQ,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,EAAE,CAAA;CAC1C;AAED,KAAK,gBAAgB,CAAC,GAAG,SAAS,QAAQ,IACxC,aAAa,CAAC,GAAG,CAAC,SAAS,iBAAiB,CAAC,MAAM,KAAK,CAAC,GAAG,KAAK,GAAG,KAAK,CAAA;AAS3E,KAAK,kBAAkB,GAAG;IACxB,SAAS,EAAE,CAAC,GAAG,SAAS,QAAQ,EAC9B,GAAG,EAAE,GAAG,EACR,KAAK,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,EAC7B,OAAO,CAAC,EAAE,gBAAgB,KACvB,IAAI,CAAA;IACT,UAAU,EAAE,CAAC,GAAG,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAA;CACrC,CAAA;AAID,eAAO,MAAM,oBAAoB,GAAI,mCAIlC,yBAAyB,4CAmE3B,CAAA;AAED,eAAO,MAAM,eAAe,0BAM3B,CAAA"}

package/dist/contexts/ModalManagerContext/index.js

@@ -0,0 +1,71 @@
+"use client";
+import { createContext, createElement, use, useEffect, useMemo, useState } from "react";
+import { jsxs } from "react/jsx-runtime";
+//#region src/contexts/ModalManagerContext/index.tsx
+var ModalManagerContext = createContext(void 0);
+var ModalManagerProvider = ({ children, modals, loadModals = [] }) => {
+	const [statusModal, setStatusModal] = useState([]);
+	useEffect(() => {
+		loadModals.forEach((modalKey) => {
+			Object.keys(modals).filter((key) => key.startsWith(modalKey)).forEach((key) => {
+				const item = modals[key];
+				item.load?.().then((modal) => {
+					item.component = modal.default;
+				});
+			});
+		});
+	}, [loadModals, modals]);
+	const showModal = (key, props, options) => {
+		const { multiple, ...modalProps } = options ?? {};
+		const modalState = {
+			modalKey: key,
+			props,
+			modalProps,
+			opened: true
+		};
+		setStatusModal((prev) => multiple ? [...prev, modalState] : [modalState]);
+	};
+	const closeModal = (key) => {
+		if (key === void 0) {
+			setStatusModal((prev) => prev.map((modal) => ({
+				...modal,
+				opened: false
+			})));
+			return;
+		}
+		setStatusModal((prev) => prev.map((modal) => modal.modalKey === key ? {
+			...modal,
+			opened: false
+		} : modal));
+	};
+	const renderModals = useMemo(() => statusModal.map(({ modalKey, props, opened, modalProps }, i) => {
+		const Component = modals[modalKey]?.component;
+		if (!Component) return null;
+		return /* @__PURE__ */ createElement(Component, {
+			...props,
+			key: `${modalKey}-${i}`,
+			modalProps: {
+				...modalProps,
+				opened,
+				zIndex: 200 + i
+			},
+			removeModal: () => {
+				setStatusModal((prev) => prev.filter((_, index) => index !== i));
+			}
+		});
+	}), [statusModal, modals]);
+	return /* @__PURE__ */ jsxs(ModalManagerContext.Provider, {
+		value: {
+			showModal,
+			closeModal
+		},
+		children: [renderModals, children]
+	});
+};
+var useModalManager = () => {
+	const context = use(ModalManagerContext);
+	if (context === void 0) throw Error("Out of context: useModalManager");
+	return context;
+};
+//#endregion
+export { ModalManagerProvider, useModalManager };

package/dist/contexts/index.d.ts

@@ -1,3 +1,4 @@
+export * from './ModalManagerContext';
 export { NavigationHistoryProvider } from './NavigationHistoryContext';
 export * from './NavigationHistoryContext/hook';
 export * from './PageDataContext';

package/dist/contexts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/contexts/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AACtE,cAAc,iCAAiC,CAAA;AAC/C,cAAc,mBAAmB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/contexts/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AACrC,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AACtE,cAAc,iCAAiC,CAAA;AAC/C,cAAc,mBAAmB,CAAA"}

package/dist/index.cjs

@@ -20,9 +20,10 @@ const require_index$15 = require("./components/MyTimeInput/index.cjs");
 const require_NavItems = require("./components/NavItems.cjs");
 const require_http_status = require("./consts/http-status.cjs");
 const require_revalidate = require("./consts/revalidate.cjs");
-const require_index$16 = require("./contexts/NavigationHistoryContext/index.cjs");
+const require_index$16 = require("./contexts/ModalManagerContext/index.cjs");
+const require_index$17 = require("./contexts/NavigationHistoryContext/index.cjs");
 const require_hook = require("./contexts/NavigationHistoryContext/hook.cjs");
-const require_index$17 = require("./contexts/PageDataContext/index.cjs");
+const require_index$18 = require("./contexts/PageDataContext/index.cjs");
 const require_withController = require("./hocs/withController.cjs");
 const require_withModalManager = require("./hocs/withModalManager.cjs");
 const require_FormCheckbox = require("./form/base/FormCheckbox.cjs");
@@ -81,6 +82,7 @@ exports.HttpStatus = require_http_status.HttpStatus;
 exports.Icon = require_Icon.Icon;
 exports.InfinityLoadMoreButton = require_index$1.InfinityLoadMoreButton;
 exports.InfinitySelect = require_index$2.InfinitySelect;
+exports.ModalManagerProvider = require_index$16.ModalManagerProvider;
 exports.MyCheckboxGroup = require_index$3.MyCheckboxGroup;
 exports.MyDateInput = require_index$4.MyDateInput;
 exports.MyDatePickerInput = require_index$5.MyDatePickerInput;
@@ -95,8 +97,8 @@ exports.MyTextInput = require_index$14.MyTextInput;
 exports.MyTextarea = require_index$13.MyTextarea;
 exports.MyTimeInput = require_index$15.MyTimeInput;
 exports.NavItems = require_NavItems.NavItems;
-exports.NavigationHistoryProvider = require_index$16.NavigationHistoryProvider;
-exports.PageDataProvider = require_index$17.PageDataProvider;
+exports.NavigationHistoryProvider = require_index$17.NavigationHistoryProvider;
+exports.PageDataProvider = require_index$18.PageDataProvider;
 exports.QP_BACK_URL_NAME = require_hook.QP_BACK_URL_NAME;
 exports.Revalidate = require_revalidate.Revalidate;
 exports.addBodyJsonHook = require_addBodyJsonHook.addBodyJsonHook;
@@ -120,9 +122,10 @@ exports.timeInputToNumber = require_FormTimeInput.timeInputToNumber;
 exports.toTailwindColors = require_to_tailwind_colors.toTailwindColors;
 exports.useBreakpoint = require_useBreakpoint.useBreakpoint;
 exports.useFetchNextPageOnScroll = require_useFetchNextPageOnScroll.useFetchNextPageOnScroll;
+exports.useModalManager = require_index$16.useModalManager;
 exports.useNavigationHistory = require_hook.useNavigationHistory;
 exports.useOnScrollProgress = require_useOnScrollProgress.useOnScrollProgress;
-exports.usePageData = require_index$17.usePageData;
+exports.usePageData = require_index$18.usePageData;
 exports.useUpdateSearchParams = require_useUpdateSearchParams.useUpdateSearchParams;
 exports.useZodConfig = require_useZodConfig.useZodConfig;
 exports.withController = require_withController.withController;

package/dist/index.js

@@ -19,6 +19,7 @@ import { MyTimeInput } from "./components/MyTimeInput/index.js";
 import { NavItems } from "./components/NavItems.js";
 import { HttpStatus } from "./consts/http-status.js";
 import { Revalidate } from "./consts/revalidate.js";
+import { ModalManagerProvider, useModalManager } from "./contexts/ModalManagerContext/index.js";
 import { NavigationHistoryProvider } from "./contexts/NavigationHistoryContext/index.js";
 import { QP_BACK_URL_NAME, useNavigationHistory } from "./contexts/NavigationHistoryContext/hook.js";
 import { PageDataProvider, usePageData } from "./contexts/PageDataContext/index.js";
@@ -59,4 +60,4 @@ import { addBodyJsonHook } from "./utils/ky/addBodyJsonHook.js";
 import { parseJSON } from "./utils/ky/parseJson.js";
 import { queryStringify } from "./utils/query-stringify.js";
 import { createNewRoute, newRoute } from "./utils/new-route.js";
-export { EmptyState, Form, FormCheckbox, FormCheckboxGroup, FormDateInput, FormDatePickerInput, FormDateTimePicker, FormInfinitySelect, FormMonthPickerInput, FormMultiSelect, FormNumberInput, FormRadioGroup, FormSelect, FormSubmitButton, FormTextInput, FormTextarea, FormTimeInput, HttpStatus, Icon, InfinityLoadMoreButton, InfinitySelect, MyCheckboxGroup, MyDateInput, MyDatePickerInput, MyDateTimePicker, MyMonthPickerInput, MyMultiSelect, MyNotifications, MyNumberInput, MyRadioGroup, MySelect, MyTextInput, MyTextarea, MyTimeInput, NavItems, NavigationHistoryProvider, PageDataProvider, QP_BACK_URL_NAME, Revalidate, addBodyJsonHook, breakpointsWithPx, createNewRoute, formatBytes, getVirtualContainerProps, getVirtualItemProps, groupBy, indexBy, isInfinityEmpty, myDefaultTheme, newRoute, nullableButRequired, numberToTimeInput, optionalButRequired, parseJSON, queryStringify, shuffleArray, timeInputToNumber, toTailwindColors, useBreakpoint, useFetchNextPageOnScroll, useNavigationHistory, useOnScrollProgress, usePageData, useUpdateSearchParams, useZodConfig, withController, withModalManager, zodValidator };
+export { EmptyState, Form, FormCheckbox, FormCheckboxGroup, FormDateInput, FormDatePickerInput, FormDateTimePicker, FormInfinitySelect, FormMonthPickerInput, FormMultiSelect, FormNumberInput, FormRadioGroup, FormSelect, FormSubmitButton, FormTextInput, FormTextarea, FormTimeInput, HttpStatus, Icon, InfinityLoadMoreButton, InfinitySelect, ModalManagerProvider, MyCheckboxGroup, MyDateInput, MyDatePickerInput, MyDateTimePicker, MyMonthPickerInput, MyMultiSelect, MyNotifications, MyNumberInput, MyRadioGroup, MySelect, MyTextInput, MyTextarea, MyTimeInput, NavItems, NavigationHistoryProvider, PageDataProvider, QP_BACK_URL_NAME, Revalidate, addBodyJsonHook, breakpointsWithPx, createNewRoute, formatBytes, getVirtualContainerProps, getVirtualItemProps, groupBy, indexBy, isInfinityEmpty, myDefaultTheme, newRoute, nullableButRequired, numberToTimeInput, optionalButRequired, parseJSON, queryStringify, shuffleArray, timeInputToNumber, toTailwindColors, useBreakpoint, useFetchNextPageOnScroll, useModalManager, useNavigationHistory, useOnScrollProgress, usePageData, useUpdateSearchParams, useZodConfig, withController, withModalManager, zodValidator };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkd-web-kit",
-  "version": "0.9.1",
+  "version": "0.10.0",
   "description": "A template for creating React component libraries with Vite.",
   "author": "LKD",
   "license": "MIT",
@@ -52,18 +52,18 @@
     "vitest": "^4.1.5"
   },
   "peerDependencies": {
-    "@mantine/core": "^9.3.1",
-    "@mantine/dates": "^9.3.1",
-    "@mantine/hooks": "^9.3.1",
-    "@mantine/notifications": "^9.3.1",
-    "@tanstack/react-query": "^5.101.0",
-    "@tanstack/react-virtual": "^3.14.2",
+    "@mantine/core": "^9.4.1",
+    "@mantine/dates": "^9.4.1",
+    "@mantine/hooks": "^9.4.1",
+    "@mantine/notifications": "^9.4.1",
+    "@tanstack/react-query": "^5.101.2",
+    "@tanstack/react-virtual": "^3.14.4",
     "clsx": "^2.1.1",
     "ky": "^2.0.2",
-    "next": "^16.2.7",
+    "next": "^16.2.9",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
-    "react-hook-form": "^7.78.0",
+    "react-hook-form": "^7.80.0",
     "react-query-kit": "^3.3.4",
     "zod": "^4.4.3"
   },

package/dist/components/InfinitySelect/index.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=index.test.d.ts.map

package/dist/components/InfinitySelect/index.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/components/InfinitySelect/index.test.tsx"],"names":[],"mappings":""}