@gohanfromgoku/ui-kit 0.1.3 → 1.0.0

package/dist/components/Button/index.js

@@ -1,13 +1,13 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { memo, forwardRef } from "preact/compat";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { checkProps } from "../../helpers/index";
+import { forwardRef, memo } from "react";
 const defaultProps = {
     onClick: () => { },
     disabled: false,
     className: "",
     type: "button",
 };
-const Button = forwardRef((props, ref) => {
+const Button = memo(forwardRef((props, ref) => {
     const { children, className, onClick, disabled, type, ...rest } = { ...defaultProps, ...props };
     return (_jsx("button", { ref: ref, className: className, disabled: disabled, type: type, onClick: (event) => {
             if (type === "button" || !type) {
@@ -17,5 +17,6 @@ const Button = forwardRef((props, ref) => {
                 onClick(event);
             }
         }, ...rest, children: children }));
-});
-export default memo(Button, checkProps);
+}), checkProps);
+Button.displayName = "Button";
+export default Button;

package/dist/components/Image/index.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { forwardRef, memo } from "preact/compat";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, memo } from "react";
 import { checkProps } from "../../helpers/index";
 const defaultProps = {
     altImage: null,
@@ -8,12 +8,13 @@ const defaultProps = {
     priority: true,
     onClick: () => { }
 };
-const Image = forwardRef((props, ref) => {
+const Image = memo(forwardRef((props, ref) => {
     const { altImage, className, src, priority, onClick, alt, ...rest } = { ...defaultProps, ...props };
     return (_jsx("img", { src: src, ref: ref, width: "100%", height: "100%", onClick: (event) => { event.preventDefault(); onClick(event); }, draggable: false, onError: async () => {
             if (ref && 'current' in ref && ref.current) {
                 ref.current.src = altImage || "";
             }
         }, alt: alt, className: className, fetchPriority: priority ? "high" : "auto", loading: priority ? "eager" : "lazy", ...rest }));
-});
-export default memo(Image, checkProps);
+}), checkProps);
+Image.displayName = "Image";
+export default Image;

package/dist/components/Input/index.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { memo } from "preact/compat";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, memo } from "react";
 import { checkProps } from "../../helpers/index";
-import { translate } from "../../translations/index";
+import { useTranslations } from "../../translations/index";
 const defaultProps = {
     onChange: () => { },
     className: "",
@@ -9,8 +9,10 @@ const defaultProps = {
     type: "text",
     name: ""
 };
-const Input = (props) => {
+const Input = memo(forwardRef((props, ref) => {
+    const { translate } = useTranslations();
     const { onChange, className, placeholder, type, name, ...rest } = { ...defaultProps, ...props };
-    return _jsx("input", { className: className, placeholder: translate(placeholder), type: type, name: name, onChange: event => onChange(event.currentTarget.value, event), ...rest });
-};
-export default memo(Input, checkProps);
+    return _jsx("input", { className: className, placeholder: translate(placeholder), type: type, ref: ref, name: name, onChange: event => onChange(event.currentTarget.value, event), ...rest });
+}), checkProps);
+Input.displayName = "Input";
+export default Input;

package/dist/components/Text/index.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { checkProps } from "../../helpers/index";
-import { translate } from "../../translations/index";
-import { forwardRef, memo, useMemo } from "preact/compat";
+import { useTranslations } from "../../translations/index";
+import { forwardRef, memo } from "react";
 const defaultProps = {
     text: "",
     data: {},
@@ -10,12 +10,14 @@ const defaultProps = {
     tag: "span",
     onClick: () => { },
 };
-const Text = forwardRef((props, ref) => {
+const Text = memo(forwardRef((props, ref) => {
+    const { translate } = useTranslations();
     const { text, data, html, className, tag: Tag, onClick, ...rest } = { ...defaultProps, ...props };
-    const translated = useMemo(() => translate(text, data), [text, JSON.stringify(data)]);
+    const translated = translate(text, data);
     if (html) {
         return (_jsx(Tag, { ...rest, ref: ref, dangerouslySetInnerHTML: { __html: translated }, className: className, onClick: (event) => { event.preventDefault(); onClick(event); } }));
     }
     return (_jsx(Tag, { ...rest, ref: ref, className: className, onClick: (event) => { event.preventDefault(); onClick(event); }, children: translated }));
-});
-export default memo(Text, checkProps);
+}), checkProps);
+Text.displayName = "Text";
+export default Text;

package/dist/components/Tooltip/index.js

@@ -1,14 +1,15 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { useEffect, useRef } from "preact/hooks";
-import { memo } from "preact/compat";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { memo } from "react";
 import { checkProps, toast } from "../../helpers/index";
-import { translate } from "../../translations/index";
+import { useTranslations } from "../../translations/index";
 const isTouchDevice = () => typeof window !== "undefined" && "ontouchstart" in window;
 const styles = {
     width: "fit-content",
     height: "fit-content"
 };
-const Tooltip = ({ message, children, className }) => {
+const Tooltip = memo(({ message, children, className }) => {
+    const { translate } = useTranslations();
     const ref = useRef(null);
     const toastRef = useRef(null);
     useEffect(() => {
@@ -48,5 +49,6 @@ const Tooltip = ({ message, children, className }) => {
             else
                 toastRef.current = toast(translate(message), ref.current, 2000);
         }, children: children }));
-};
-export default memo(Tooltip, checkProps);
+}, checkProps);
+Tooltip.displayName = "Tooltip";
+export default Tooltip;

package/dist/hooks/useHandleClickOutside.js

@@ -1,4 +1,4 @@
-import { useEffect } from "preact/compat";
+import { useEffect } from "react";
 const useHandleClickOutside = (ref, cb) => {
     useEffect(() => {
         const handlePointerDown = (event) => {

package/dist/hooks/useQueryParams.js

@@ -1,5 +1,5 @@
-import { signal } from "@preact/signals";
-const queryParamsSignal = signal({});
+import createStore from "../storage/index";
+const { queryParamsSignal } = createStore("queryParamsSignal", { value: {} });
 const getParams = () => {
     const search = window.location.search.slice(1);
     const params = new URLSearchParams(search);
@@ -8,10 +8,8 @@ const getParams = () => {
         obj[key] = value;
     return obj;
 };
-queryParamsSignal.value = getParams();
-window.addEventListener("popstate", () => {
-    queryParamsSignal.value = getParams();
-});
+queryParamsSignal.setState({ value: getParams() });
+window.addEventListener("popstate", () => { queryParamsSignal.setState({ value: getParams() }); });
 export const setQueryParams = (updates, { replace = false, pathname } = {}) => {
     const params = new URLSearchParams();
     Object.entries(updates).forEach(([key, value]) => {
@@ -26,6 +24,6 @@ export const setQueryParams = (updates, { replace = false, pathname } = {}) => {
         window.history.replaceState({}, "", newUrl);
     else
         window.history.pushState({}, "", newUrl);
-    queryParamsSignal.value = getParams();
+    queryParamsSignal.setState({ value: getParams() });
 };
 export { queryParamsSignal as queryParams };

package/dist/hooks/useWindowSize.js

@@ -1,4 +1,4 @@
-import { useLayoutEffect, useMemo, useState } from "preact/hooks";
+import { useLayoutEffect, useMemo, useState } from "react";
 const useWindowSize = () => {
     const [size, setSize] = useState({ height: window.innerHeight, width: window.innerWidth });
     useLayoutEffect(() => {

package/dist/navigation/createBrowserRouter.js

@@ -1,52 +1,71 @@
-import { Fragment as _Fragment, jsx as _jsx } from "preact/jsx-runtime";
-import { useEffect } from "preact/compat";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
 import createStore from "../storage/index";
 import { generateURLToNavigate, isRouteMatching } from "./support/url.support";
 import { extractParamsFromURL } from "./support/params.support";
 import { extractQueryParamsFromURL } from "./support/query-params.support";
-import { computed } from "@preact/signals";
-const locationDetails = createStore("location-details", { value: { params: {}, queryParams: {}, ...window.location } });
-const activeRoute = createStore("active-route", { value: {} });
+// Initialize stores
+const { locationDetails } = createStore("locationDetails", {
+    value: { params: {}, queryParams: {}, ...window.location }
+});
+const { activeRoute } = createStore("activeRoute", {
+    value: {}
+});
 const createBrowserRouter = (routes, { page404 } = { page404: () => _jsx(_Fragment, { children: "Page Not Found" }) }) => {
+    // Navigate function
     const navigate = (to, { queryParams, replace } = {}) => {
         if (typeof to === "number") {
             window.history.go(to);
             return;
         }
         const url = generateURLToNavigate(to, queryParams || {});
-        if (window.location.href === url) {
+        if (window.location.href === url)
             return;
-        }
         if (replace) {
             window.history.replaceState({}, "", url);
         }
         else {
             window.history.pushState({}, "", url);
         }
+        // Trigger update
         window.dispatchEvent(new Event("popstate"));
     };
+    // Hook to get current location details
     const useLocationDetails = () => {
         if (routes.length === 0) {
-            throw "useLocationDetails cannot be used without initializing routes, use createRoutes initialize routes";
+            throw new Error("useLocationDetails cannot be used without initializing routes. Use createBrowserRouter with routes.");
         }
-        ;
-        const values = computed(() => locationDetails.value);
-        return values.value;
+        const [state, setState] = useState(locationDetails.value);
+        useEffect(() => {
+            const update = () => setState(locationDetails.value);
+            window.addEventListener("popstate", update);
+            return () => window.removeEventListener("popstate", update);
+        }, []);
+        return state;
     };
+    // Outlet component
     const Outlet = () => {
-        const component = computed(() => activeRoute.value?.component ?? page404);
+        const [, setRender] = useState(0);
         useEffect(() => {
             const updateLocation = () => {
-                const active = routes.find(r => isRouteMatching(r.pathname)) || { pathname: window.location.href, component: page404 };
+                // Find active route
+                const active = routes.find(r => isRouteMatching(r.pathname)) ||
+                    { pathname: window.location.pathname, component: page404 };
                 activeRoute.setState({ value: active });
+                // Update location details
                 const params = extractParamsFromURL(window.location.pathname, active.pathname);
                 const queryParams = extractQueryParamsFromURL(window.location.href);
                 locationDetails.setState({ value: { params, queryParams, ...window.location } });
+                // Force re-render
+                setRender(r => r + 1);
             };
+            // Initial update
+            updateLocation();
             window.addEventListener("popstate", updateLocation);
             return () => window.removeEventListener("popstate", updateLocation);
         }, []);
-        return _jsx(component.value, {});
+        const Component = activeRoute.value?.component ?? page404;
+        return _jsx(Component, {});
     };
     return {
         navigate,

package/dist/navigation/createMemoryRouter.js

@@ -1,5 +1,5 @@
-import { Fragment as _Fragment, jsx as _jsx } from "preact/jsx-runtime";
-import {} from "preact/compat";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import {} from "react";
 import createStore from "../storage/index";
 import { generateURLToNavigate, isRouteMatching } from "./support/url.support";
 import { extractParamsFromURL } from "./support/params.support";
@@ -9,10 +9,10 @@ const createMemoryRouter = (routes, { page404 } = { page404: () => _jsx(_Fragmen
         throw "Atleast one route should present";
     }
     ;
-    const activeRoute = createStore("active-route", { value: routes.find(() => isRouteMatching("/")) || { pathname: "/", component: page404 } });
-    const locationDetails = createStore("location-details", { value: { params: {}, queryParams: {}, ...window.location, pathname: activeRoute.value.pathname } });
-    const entries = createStore("entries", { value: ["/"] });
-    const currentIndex = createStore("current-index", { value: 0 });
+    const { activeRoute } = createStore("activeRoute", routes.find(() => isRouteMatching("/")) || { pathname: "/", component: page404 });
+    const { locationDetails } = createStore("locationDetails", { params: {}, queryParams: {}, ...window.location, pathname: activeRoute.pathname });
+    const { entries } = createStore("entries", { value: ["/"] });
+    const { currentIndex } = createStore("currentIndex", { value: 0 });
     const navigate = (to, { queryParams } = {}) => {
         if (typeof to === "number") {
             const targetIndex = currentIndex.value + to;
@@ -22,28 +22,28 @@ const createMemoryRouter = (routes, { page404 } = { page404: () => _jsx(_Fragmen
             const url = raw.startsWith("http") ? new URL(raw).pathname + new URL(raw).search : raw;
             currentIndex.setState({ value: targetIndex });
             const active = routes.find(r => isRouteMatching(r.pathname, url)) || { pathname: url, component: page404 };
-            activeRoute.setState({ value: active });
+            activeRoute.setState(active);
             const params = extractParamsFromURL(url, active.pathname);
             const allQueryParams = extractQueryParamsFromURL(url);
-            locationDetails.setState({ value: { params, queryParams: allQueryParams, ...window.location, pathname: active.pathname } });
+            locationDetails.setState({ params, queryParams: allQueryParams, ...window.location, pathname: active.pathname });
             return;
         }
         const url = generateURLToNavigate(to, queryParams || {});
-        if (activeRoute.value.pathname === url)
+        if (activeRoute.pathname === url)
             return;
         entries.setState({ value: [...entries.value, url] });
         const active = routes.find(r => isRouteMatching(r.pathname, to)) || { pathname: to, component: page404 };
-        activeRoute.setState({ value: active });
-        const params = extractParamsFromURL(to, activeRoute.value.pathname);
+        activeRoute.setState(active);
+        const params = extractParamsFromURL(to, activeRoute.pathname);
         const allQueryParams = extractQueryParamsFromURL(url);
-        locationDetails.setState({ value: { params, queryParams: allQueryParams, ...window.location, pathname: active.pathname } });
+        locationDetails.setState({ params, queryParams: allQueryParams, ...window.location, pathname: active.pathname });
         currentIndex.setState({ value: currentIndex.value + 1 });
     };
     const useLocationDetails = () => {
-        return locationDetails.value;
+        return locationDetails;
     };
     const Outlet = () => {
-        const Component = activeRoute.value.component;
+        const Component = activeRoute.component;
         return _jsx(Component, {});
     };
     return {

package/dist/prototypes/copyToClipboard.js

@@ -1,5 +1,6 @@
 import toast from "../helpers/toast";
-const copyToClipboard = async (text = "", message = "Copied") => {
+const copyToClipboard = async function (message = "Copied") {
+    const text = this;
     try {
         if (navigator.clipboard && window.isSecureContext) {
             await navigator.clipboard.writeText(text);

package/dist/prototypes/index.js

@@ -1,6 +1,8 @@
 import copyToClipboard from "./copyToClipboard";
 import maskString from "./maskString";
+import capitalize from "./stringCapitalize";
 if (!String.prototype.copy) {
     String.prototype.copy = copyToClipboard;
     String.prototype.mask = maskString;
+    String.prototype.capitalize = capitalize;
 }

package/dist/prototypes/stringCapitalize.js

@@ -0,0 +1,4 @@
+const capitalize = function () {
+    return (this.charAt(0).toUpperCase() + this.slice(1));
+};
+export default capitalize;

package/dist/storage/index.js

@@ -1,51 +1,36 @@
-import { signal } from "@preact/signals";
-const createStore = (name, initialState, persist = []) => {
-    const state = signal({ ...initialState });
-    try {
-        const stored = localStorage.getItem(name);
-        if (stored) {
-            state.value = { ...state.value, ...JSON.parse(stored) };
-        }
-    }
-    catch {
-        // Catch any Errors
-    }
-    const setState = (values) => {
-        state.value = { ...state.value, ...values };
-        if (persist.length) {
-            const toStore = persist.reduce((acc, key) => {
-                acc[key] = state.value[key];
-                return acc;
-            }, {});
-            localStorage.setItem(name, JSON.stringify(toStore));
-        }
+import "../prototypes";
+import { useSyncExternalStore } from "react";
+export default function createStore(name, initialState) {
+    let state = initialState;
+    const listeners = new Set();
+    const subscribe = (listener) => {
+        listeners.add(listener);
+        return () => listeners.delete(listener);
+    };
+    const getSnapshot = () => state;
+    const setState = (partial) => {
+        state = { ...state, ...partial };
+        listeners.forEach(l => l());
     };
     const resetState = () => {
-        state.value = initialState;
-        localStorage.removeItem(name);
+        state = initialState;
+        listeners.forEach(l => l());
     };
-    return Object.assign(new Proxy(initialState, {
-        get(_, prop) {
-            switch (prop) {
-                case "setState":
-                    return setState;
-                case "resetState":
-                    return resetState;
-                default:
-                    return state.value[prop];
-            }
-        },
-        set(_, prop, value) {
-            state.value = { ...state.value, [prop]: value };
-            if (persist.includes(prop)) {
-                const toStore = persist.reduce((acc, key) => {
-                    acc[key] = state.value[key];
-                    return acc;
-                }, {});
-                localStorage.setItem(name, JSON.stringify(toStore));
-            }
-            return true;
+    const useStore = () => useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+    const capName = name.capitalize();
+    const exposedState = {};
+    Object.keys(initialState).forEach(key => {
+        Object.defineProperty(exposedState, key, {
+            enumerable: true,
+            get: () => state[key],
+        });
+    });
+    return {
+        [name]: {
+            ...exposedState,
+            setState,
+            resetState
         },
-    }), { __signal: state });
-};
-export default createStore;
+        [`use${capName}State`]: useStore
+    };
+}

package/dist/translations/index.js

@@ -1,34 +1,39 @@
-import { signal, computed } from "@preact/signals";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { objectPath } from "../helpers/index";
-export const languages = signal({});
-export const language = signal(window.localStorage.getItem("language") || "en");
-const translations = computed(() => objectPath(languages.value[language.value]));
-const interpolate = (str, data) => {
-    if (typeof str === "string") {
-        return str.replace(/{{\s*(\w+)\s*}}/g, (_, key) => key in data ? String(data[key]) : `{{${key}}}`);
-    }
-    ;
-    return JSON.stringify(str);
+import { createContext, useContext, useState, useEffect, } from "react";
+const TranslationsContext = createContext(null);
+const isBrowser = typeof window !== "undefined";
+const interpolate = (str, data) => str.replace(/{{\s*(\w+)\s*}}/g, (_, key) => key in data ? String(data[key]) : `{{${key}}}`);
+export const TranslationsProvider = ({ children, languages, }) => {
+    const [language, setLanguage] = useState(() => {
+        if (!isBrowser)
+            return "en";
+        return localStorage.getItem("language") ?? "en";
+    });
+    useEffect(() => { if (isBrowser) {
+        localStorage.setItem("language", language);
+        return () => { localStorage.removeItem("language"); };
+    } }, [language]);
+    return (_jsx(TranslationsContext.Provider, { value: { languages, changeLanguage: setLanguage, language }, children: children }));
 };
-export const initTranslations = async (langs) => {
-    try {
-        languages.value = langs;
-        return true;
-    }
-    catch (e) {
-        console.error(e);
-        return false;
+export const useTranslations = () => {
+    const context = useContext(TranslationsContext);
+    if (!context) {
+        throw new Error("useTranslations must be used inside TranslationsProvider");
     }
-};
-export const translate = (key, data = {}) => {
-    const dictionary = translations.value;
-    if (!dictionary.has(key))
-        return key;
-    const value = dictionary.get(key);
-    return Object.keys(data).length ? interpolate(value, data) : value;
-};
-export const changeLanguage = (lang) => {
-    language.value = lang;
-    window.localStorage.setItem("language", lang);
-    return true;
+    const { languages, language, changeLanguage } = context;
+    const translations = objectPath(languages[language]);
+    const translate = (key, data = {}) => {
+        if (!translations?.has?.(key))
+            return key;
+        const value = translations.get(key);
+        if (typeof value !== "string")
+            return String(value);
+        return Object.keys(data).length ? interpolate(value, data) : value;
+    };
+    return {
+        translate,
+        changeLanguage,
+        language,
+    };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gohanfromgoku/ui-kit",
-  "version": "0.1.3",
+  "version": "1.0.0",
   "description": "ui-kit is a TypeScript based UI component library designed for building modern web applications with ease and efficiency.",
   "sideEffects": false,
   "scripts": {
@@ -26,12 +26,11 @@
   "author": "GohanfromGoku",
   "license": "MIT",
   "peerDependencies": {
-    "@preact/signals": "^2.5.1",
-    "preact": "^10.28.0"
+    "react": "^19.2.3"
   },
   "devDependencies": {
-    "@preact/signals": "^2.5.1",
-    "preact": "^10.28.1",
+    "@types/react": "^19.2.8",
+    "react": "^19.2.3",
     "tsc-alias": "^1.8.16",
     "typescript": "^5.9.3"
   },

package/types/components/Button/index.d.ts

@@ -1,6 +1,6 @@
-import type { ButtonHTMLAttributes } from "preact";
-import { type ReactNode, type Ref } from "preact/compat";
-type ClickEvent = MouseEvent | TouchEvent;
+import type { ButtonHTMLAttributes, MouseEvent, TouchEvent } from "react";
+import { type ReactNode } from "react";
+type ClickEvent = MouseEvent<HTMLButtonElement> | TouchEvent<HTMLButtonElement>;
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: ReactNode;
     className?: string;
@@ -8,7 +8,5 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     onClick?: (event: ClickEvent) => void;
     type?: "button" | "submit" | "reset";
 }
-declare const _default: import("preact").FunctionComponent<import("preact/compat").PropsWithoutRef<ButtonProps> & {
-    ref?: Ref<HTMLButtonElement> | undefined;
-}>;
-export default _default;
+declare const Button: import("react").NamedExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export default Button;

package/types/components/Image/index.d.ts

@@ -1,5 +1,5 @@
-import type { ImgHTMLAttributes } from "preact";
-type ClickEvent = MouseEvent | TouchEvent;
+import type { ImgHTMLAttributes, MouseEvent, TouchEvent } from "react";
+type ClickEvent = MouseEvent<HTMLImageElement> | TouchEvent<HTMLImageElement>;
 export interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
     src: string;
     className?: string;
@@ -8,7 +8,5 @@ export interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
     priority?: true | false;
     onClick?: (event: ClickEvent) => void;
 }
-declare const _default: import("preact").FunctionComponent<import("preact/compat").PropsWithoutRef<ImageProps> & {
-    ref?: import("preact").Ref<HTMLImageElement> | undefined;
-}>;
-export default _default;
+declare const Image: import("react").NamedExoticComponent<ImageProps & import("react").RefAttributes<HTMLImageElement>>;
+export default Image;

package/types/components/Input/index.d.ts

@@ -1,10 +1,10 @@
-import type { InputHTMLAttributes, TargetedEvent } from "preact";
+import type { ChangeEvent, InputHTMLAttributes } from "react";
 interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "onChange"> {
     placeholder?: string;
     className?: string;
     type?: string;
-    onChange?: (value: string, event: TargetedEvent<HTMLInputElement, Event>) => void;
+    onChange?: (value: string, event: ChangeEvent<HTMLInputElement>) => void;
     name?: string;
 }
-declare const _default: (props: InputProps) => import("preact").JSX.Element;
-export default _default;
+declare const Input: import("react").NamedExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
+export default Input;

package/types/components/Text/index.d.ts

@@ -6,7 +6,5 @@ interface TextProps {
     tag?: any;
     onClick?: (event: any) => void;
 }
-declare const _default: import("preact").FunctionComponent<import("preact/compat").PropsWithoutRef<TextProps> & {
-    ref?: import("preact").Ref<HTMLSpanElement> | undefined;
-}>;
-export default _default;
+declare const Text: import("react").NamedExoticComponent<TextProps & import("react").RefAttributes<HTMLElement>>;
+export default Text;

package/types/components/Tooltip/index.d.ts

@@ -1,7 +1,7 @@
-import { type ReactNode } from "preact/compat";
-declare const _default: ({ message, children, className }: {
+import { type ReactNode } from "react";
+declare const Tooltip: import("react").MemoExoticComponent<({ message, children, className }: {
     message: string;
     children: ReactNode;
     className?: string;
-}) => import("preact").JSX.Element;
-export default _default;
+}) => import("react/jsx-runtime").JSX.Element>;
+export default Tooltip;

package/types/hooks/useHandleClickOutside.d.ts

@@ -1,3 +1,3 @@
-import { type MutableRefObject } from "preact/compat";
-declare const useHandleClickOutside: (ref: MutableRefObject<HTMLElement | null>, cb: () => void) => void;
+import { type RefObject } from "react";
+declare const useHandleClickOutside: (ref: RefObject<HTMLElement>, cb: () => void) => void;
 export default useHandleClickOutside;

package/types/hooks/useQueryParams.d.ts

@@ -3,6 +3,13 @@ type SetQueryParams = (updates: Record<string, any>, options?: {
     replace?: boolean;
     pathname?: string;
 }) => void;
-declare const queryParamsSignal: import("@preact/signals").Signal<QueryParams>;
+declare const queryParamsSignal: {
+    value: QueryParams;
+} & {
+    setState: (partial: Partial<{
+        value: QueryParams;
+    }>) => void;
+    resetState: () => void;
+};
 export declare const setQueryParams: SetQueryParams;
 export { queryParamsSignal as queryParams };

package/types/navigation/createBrowserRouter.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentType } from "preact/compat";
+import { type ComponentType } from "react";
 interface Route {
     pathname: string;
     component: ComponentType;
@@ -28,6 +28,6 @@ declare const createBrowserRouter: (routes: Route[], { page404 }?: {
         params: {};
         queryParams: {};
     };
-    Outlet: () => import("preact").JSX.Element;
+    Outlet: () => import("react/jsx-runtime").JSX.Element;
 };
 export default createBrowserRouter;

package/types/navigation/createMemoryRouter.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentType } from "preact/compat";
+import { type ComponentType } from "react";
 interface Route {
     pathname: string;
     component: ComponentType;
@@ -26,7 +26,27 @@ declare const createMemoryRouter: (routes: Route[], { page404 }?: {
         replace(url: string | URL): void;
         params: {};
         queryParams: {};
+    } & {
+        setState: (partial: Partial<{
+            pathname: string;
+            ancestorOrigins: DOMStringList;
+            hash: string;
+            host: string;
+            hostname: string;
+            href: string;
+            toString(): string;
+            origin: string;
+            port: string;
+            protocol: string;
+            search: string;
+            assign(url: string | URL): void;
+            reload(): void;
+            replace(url: string | URL): void;
+            params: {};
+            queryParams: {};
+        }>) => void;
+        resetState: () => void;
     };
-    Outlet: () => import("preact").JSX.Element;
+    Outlet: () => import("react/jsx-runtime").JSX.Element;
 };
 export default createMemoryRouter;

package/types/prototypes/copyToClipboard.d.ts

@@ -1,2 +1,2 @@
-declare const copyToClipboard: (text?: string, message?: string) => Promise<true | undefined>;
+declare const copyToClipboard: (this: string, message?: string) => Promise<true | undefined>;
 export default copyToClipboard;

package/types/prototypes/index.d.ts

@@ -1,7 +1,8 @@
 declare global {
     interface String {
-        copy(text: string, message?: string): void;
+        copy(message?: string): void;
         mask(visibleCharacters?: number, maskWith?: string): string;
+        capitalize(): Capitalize<string>;
     }
 }
 export {};

package/types/prototypes/stringCapitalize.d.ts

@@ -0,0 +1,2 @@
+declare const capitalize: <T extends string>(this: T) => Capitalize<T>;
+export default capitalize;

package/types/storage/index.d.ts

@@ -1,8 +1,5 @@
-type PersistKeys<T> = (keyof T)[];
-declare const createStore: <T extends Record<string, any>>(name: string, initialState: T, persist?: PersistKeys<T>) => T & {
-    setState: (values: Partial<T>) => void;
+import "../prototypes";
+export default function createStore<Name extends string, T extends Record<string, any>>(name: Name, initialState: T): { [K in Name]: T & {
+    setState: (partial: Partial<T>) => void;
     resetState: () => void;
-} & {
-    __signal: import("@preact/signals").Signal<T>;
-};
-export default createStore;
+}; } & { [K in `use${Capitalize<Name>}State`]: () => T; };

package/types/translations/index.d.ts

@@ -1,5 +1,12 @@
-export declare const languages: import("@preact/signals").Signal<Record<string, Record<string, any>>>;
-export declare const language: import("@preact/signals").Signal<string>;
-export declare const initTranslations: (langs: Record<string, Record<string, any>>) => Promise<boolean>;
-export declare const translate: (key: string, data?: Record<string, string | number>) => string;
-export declare const changeLanguage: (lang: string) => boolean;
+import { type ReactNode } from "react";
+type Languages = Record<string, Record<string, any>>;
+export declare const TranslationsProvider: ({ children, languages, }: {
+    children: ReactNode;
+    languages: Languages;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useTranslations: () => {
+    translate: (key: string, data?: Record<string, string | number>) => string;
+    changeLanguage: (lang: any) => void;
+    language: any;
+};
+export {};