@povio/ui 3.4.0-rc.15 → 3.4.0-rc.17

package/dist/config/router.context.d.ts

@@ -1,14 +1,16 @@
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren } from "react";
+//#region src/config/router.context.d.ts
 interface UIRouterProviderProps {
-    push: (path: string, params?: Record<string, unknown>) => Promise<boolean>;
-    replace: (path: string, params?: Record<string, unknown>) => Promise<boolean>;
-    searchString: string;
+  push: (path: string, params?: Record<string, unknown>) => Promise<boolean>;
+  replace: (path: string, params?: Record<string, unknown>) => Promise<boolean>;
+  searchString: string;
 }
 interface UIRouterContextValue extends UIRouterProviderProps {
-    searchParams: URLSearchParams;
+  searchParams: URLSearchParams;
 }
-export declare namespace UIRouter {
-    const UIRouterProvider: ({ children, push, replace, searchString, }: PropsWithChildren<UIRouterProviderProps>) => import("react/jsx-runtime").JSX.Element;
-    const useUIRouter: () => UIRouterContextValue;
+declare namespace UIRouter {
+  const UIRouterProvider: ({ children, push, replace, searchString }: PropsWithChildren<UIRouterProviderProps>) => import("react/jsx-runtime").JSX.Element;
+  const useUIRouter: () => UIRouterContextValue;
 }
-export {};
+//#endregion
+export { UIRouter };

package/dist/config/router.context.js

@@ -1,9 +1,9 @@
-import { createContext, use } from "react";
 import { c } from "react/compiler-runtime";
+import { createContext, use } from "react";
 import { jsx } from "react/jsx-runtime";
 import { RouterProvider } from "react-aria";
 //#region src/config/router.context.tsx
-var UIRouter;
+let UIRouter;
 (function(_UIRouter) {
 	const UIRouterContext = createContext(null);
 	_UIRouter.UIRouterProvider = (t0) => {

package/dist/config/theme.context.d.ts

@@ -1,17 +1,20 @@
-import { PropsWithChildren } from 'react';
-import { z } from 'zod';
-export declare namespace ThemeContext {
-    const ThemeSchema: z.ZodLiteral<"dark" | "light" | "system">;
-    export type Theme = z.infer<typeof ThemeSchema>;
-    interface ThemeContextValue {
-        theme: Theme;
-        systemTheme?: Exclude<Theme, "system">;
-        updateTheme: (theme: Theme) => void;
-    }
-    interface ThemeContextProviderProps {
-        storageKey?: string;
-    }
-    export const ThemeContextProvider: ({ children, storageKey, }: PropsWithChildren<ThemeContextProviderProps>) => import("react/jsx-runtime").JSX.Element;
-    export const useTheme: () => ThemeContextValue;
-    export {};
+import { PropsWithChildren } from "react";
+import { z } from "zod";
+//#region src/config/theme.context.d.ts
+declare namespace ThemeContext {
+  const ThemeSchema: z.ZodLiteral<"dark" | "light" | "system">;
+  export type Theme = z.infer<typeof ThemeSchema>;
+  interface ThemeContextValue {
+    theme: Theme;
+    systemTheme?: Exclude<Theme, "system">;
+    updateTheme: (theme: Theme) => void;
+  }
+  interface ThemeContextProviderProps {
+    storageKey?: string;
+  }
+  export const ThemeContextProvider: ({ children, storageKey }: PropsWithChildren<ThemeContextProviderProps>) => import("react/jsx-runtime").JSX.Element;
+  export const useTheme: () => ThemeContextValue;
+  export {};
 }
+//#endregion
+export { ThemeContext };

package/dist/config/theme.context.js

@@ -1,9 +1,10 @@
 import { useLocalStorage } from "../hooks/useLocalStorage.js";
-import { createContext, use, useCallback, useEffect, useMemo, useState } from "react";
+import { c } from "react/compiler-runtime";
+import { createContext, use, useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { z } from "zod";
 //#region src/config/theme.context.tsx
-var ThemeContext;
+let ThemeContext;
 (function(_ThemeContext) {
 	const DEFAULT_STORAGE_KEY = "theme";
 	const ThemeSchema = z.literal([
@@ -12,56 +13,108 @@ var ThemeContext;
 		"system"
 	]);
 	const ThemeContext = createContext(null);
-	_ThemeContext.ThemeContextProvider = ({ children, storageKey = DEFAULT_STORAGE_KEY }) => {
-		const [systemTheme, setSystemTheme] = useState(() => {
-			if (typeof window === "undefined") return;
-			return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-		});
-		const { value: theme, set } = useLocalStorage({
-			key: storageKey,
-			schema: ThemeSchema
-		});
-		const updateTheme = useCallback((theme_0) => {
-			set(theme_0);
-		}, [set]);
-		useEffect(() => {
-			if (typeof window === "undefined") return;
-			const onChange = (event) => {
-				setSystemTheme(event.matches ? "dark" : "light");
+	_ThemeContext.ThemeContextProvider = (t0) => {
+		const $ = c(17);
+		const { children, storageKey: t1 } = t0;
+		const storageKey = t1 === void 0 ? DEFAULT_STORAGE_KEY : t1;
+		const [systemTheme, setSystemTheme] = useState(_temp);
+		let t2;
+		if ($[0] !== storageKey) {
+			t2 = {
+				key: storageKey,
+				schema: ThemeSchema
 			};
-			const media_0 = window.matchMedia("(prefers-color-scheme: dark)");
-			media_0.addEventListener("change", onChange);
-			return () => {
-				media_0.removeEventListener("change", onChange);
+			$[0] = storageKey;
+			$[1] = t2;
+		} else t2 = $[1];
+		const { value: theme, set } = useLocalStorage(t2);
+		let t3;
+		if ($[2] !== set) {
+			t3 = (theme_0) => {
+				set(theme_0);
 			};
-		}, []);
-		useEffect(() => {
-			document.documentElement.classList.remove("dark");
-			if ((!theme || theme === "system") && systemTheme === "dark" || theme === "dark") {
-				document.documentElement.classList.add("dark");
-				document.documentElement.style.colorScheme = "dark";
-			} else if (theme === "light") {
-				document.documentElement.classList.add("light");
-				document.documentElement.style.colorScheme = "light";
-			} else document.documentElement.style.colorScheme = "light";
-		}, [theme, systemTheme]);
-		const contextValue = useMemo(() => ({
-			theme: theme ?? "system",
-			systemTheme,
-			updateTheme
-		}), [
-			theme,
-			systemTheme,
-			updateTheme
-		]);
-		return /* @__PURE__ */ jsx(ThemeContext.Provider, {
-			value: contextValue,
-			children
-		});
+			$[2] = set;
+			$[3] = t3;
+		} else t3 = $[3];
+		const updateTheme = t3;
+		let t4;
+		let t5;
+		if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+			t4 = () => {
+				if (typeof window === "undefined") return;
+				const onChange = (event) => {
+					setSystemTheme(event.matches ? "dark" : "light");
+				};
+				const media_0 = window.matchMedia("(prefers-color-scheme: dark)");
+				media_0.addEventListener("change", onChange);
+				return () => {
+					media_0.removeEventListener("change", onChange);
+				};
+			};
+			t5 = [];
+			$[4] = t4;
+			$[5] = t5;
+		} else {
+			t4 = $[4];
+			t5 = $[5];
+		}
+		useEffect(t4, t5);
+		let t6;
+		let t7;
+		if ($[6] !== systemTheme || $[7] !== theme) {
+			t6 = () => {
+				document.documentElement.classList.remove("dark");
+				if ((!theme || theme === "system") && systemTheme === "dark" || theme === "dark") {
+					document.documentElement.classList.add("dark");
+					document.documentElement.style.colorScheme = "dark";
+				} else if (theme === "light") {
+					document.documentElement.classList.add("light");
+					document.documentElement.style.colorScheme = "light";
+				} else document.documentElement.style.colorScheme = "light";
+			};
+			t7 = [theme, systemTheme];
+			$[6] = systemTheme;
+			$[7] = theme;
+			$[8] = t6;
+			$[9] = t7;
+		} else {
+			t6 = $[8];
+			t7 = $[9];
+		}
+		useEffect(t6, t7);
+		const t8 = theme ?? "system";
+		let t9;
+		if ($[10] !== systemTheme || $[11] !== t8 || $[12] !== updateTheme) {
+			t9 = {
+				theme: t8,
+				systemTheme,
+				updateTheme
+			};
+			$[10] = systemTheme;
+			$[11] = t8;
+			$[12] = updateTheme;
+			$[13] = t9;
+		} else t9 = $[13];
+		const contextValue = t9;
+		let t10;
+		if ($[14] !== children || $[15] !== contextValue) {
+			t10 = /* @__PURE__ */ jsx(ThemeContext.Provider, {
+				value: contextValue,
+				children
+			});
+			$[14] = children;
+			$[15] = contextValue;
+			$[16] = t10;
+		} else t10 = $[16];
+		return t10;
 	};
 	_ThemeContext.useTheme = () => {
 		return use(ThemeContext);
 	};
 })(ThemeContext || (ThemeContext = {}));
+function _temp() {
+	if (typeof window === "undefined") return;
+	return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
 //#endregion
 export { ThemeContext };

package/dist/config/uiConfig.context.d.ts

@@ -1,77 +1,82 @@
-import { PropsWithChildren, ReactElement } from 'react';
-import { ButtonProps } from '../components/buttons/Button/Button';
-import { CheckboxProps } from '../components/inputs/Checkbox/Checkbox';
-import { DatePickerProps } from '../components/inputs/DateTime/DatePicker/DatePicker';
-import { NumberInputProps } from '../components/inputs/Input/NumberInput/NumberInput';
-import { TextInputProps } from '../components/inputs/Input/TextInput/TextInput';
-import { RadioGroupProps } from '../components/inputs/RadioGroup/RadioGroup';
-import { SelectBaseProps } from '../components/inputs/Selection/shared/SelectBase';
-import { SliderProps } from '../components/inputs/Slider/Slider';
-import { ToggleProps } from '../components/inputs/Toggle/Toggle';
-import { ActionModalProps } from '../components/overlays/ActionModal/ActionModal';
-import { BottomSheetProps } from '../components/overlays/BottomSheet/BottomSheet';
-import { ToastProps } from '../components/status/Toast/Toast';
-import { ToastPosition } from 'react-toastify';
-import { CellTextProps } from '../components/table/CellText';
-import { HeaderTextProps } from '../components/table/HeaderText';
-import { TagProps } from '../components/text/Tag/Tag';
-export declare namespace UIConfig {
-    type DeepRequired<T> = {
-        [P in keyof T]-?: T[P] extends object ? DeepRequired<T[P]> : Exclude<T[P], null | undefined>;
+import { BottomSheetProps } from "../components/bottom-sheet.js";
+import { ButtonProps } from "../components/buttons/Button/Button.js";
+import { CheckboxProps } from "../components/checkbox.js";
+import { TextInputProps } from "../components/text-input.js";
+import { NumberInputProps } from "../components/number-input.js";
+import { RadioGroupProps } from "../components/radio-group.js";
+import { SelectBaseProps } from "../components/inputs/Selection/shared/SelectBase.js";
+import { SliderProps } from "../components/slider.js";
+import { ToggleProps } from "../components/toggle.js";
+import { ActionModalProps } from "../components/action-modal.js";
+import { ToastProps } from "../components/toast.js";
+import { TagProps } from "../components/tag.js";
+import { DatePickerProps } from "../components/inputs/DateTime/DatePicker/DatePicker.js";
+import { CellTextProps } from "../components/table/CellText.js";
+import { HeaderTextProps } from "../components/table/HeaderText.js";
+import { Breakpoint } from "../hooks/useBreakpoint.js";
+import { PropsWithChildren, ReactElement } from "react";
+import { ToastPosition } from "react-toastify";
+//#region src/config/uiConfig.context.d.ts
+declare namespace UIConfig {
+  type DeepRequired<T> = { [P in keyof T]-?: T[P] extends object ? DeepRequired<T[P]> : Exclude<T[P], null | undefined>; };
+  export interface Options {
+    renderStaticInput: boolean;
+    responsive: {
+      ssrMatches: Partial<Record<Breakpoint, boolean>>;
     };
-    export interface Options {
-        renderStaticInput: boolean;
-        input: Pick<TextInputProps, "variant" | "isClearable" | "hideLabel" | "as" | "size"> & {
-            alwaysShowClear?: boolean;
-        };
-        button: Pick<ButtonProps, "variant" | "size">;
-        numberInput: Pick<NumberInputProps, "formatOptions">;
-        radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel"> & {
-            fireBlurOnChange?: boolean;
-        };
-        checkbox: Pick<CheckboxProps, "variant"> & {
-            fireBlurOnChange?: boolean;
-        };
-        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon" | "multiSelectAutoConfirm"> & {
-            fireBlurOnChange?: boolean;
-        };
-        queryAutocomplete: {
-            isInitialQueryDisabled?: boolean;
-            resolveSelectedItemsWithIds?: boolean;
-            searchDebounceDelay?: number;
-        };
-        querySelect: {
-            isInitialQueryDisabled?: boolean;
-            resolveSelectedItemsWithIds?: boolean;
-            searchDebounceDelay?: number;
-        };
-        toggle: Pick<ToggleProps, "variant"> & {
-            fireBlurOnChange?: boolean;
-        };
-        slider: Pick<SliderProps, "minValue" | "maxValue">;
-        dateInput: Pick<DatePickerProps, "todayIcon" | "todayIconButtonSize" | "todayIconPlacement" | "shouldForceLeadingZeros" | "disableManualEntry" | "shouldUpdateDateOnMonthYearChange" | "granularity" | "autoFixYear"> & {
-            calendarIcon?: ReactElement;
-            dateTimeIcon?: ReactElement;
-            timeIcon?: ReactElement;
-            setDateValueOnDateSelection?: boolean;
-            timeZone?: string;
-            todayIconButtonComponent?: DatePickerProps["todayIconButtonComponent"];
-            allowPartialRange?: boolean;
-            fireBlurOnChange?: boolean;
-        };
-        actionModal: Pick<ActionModalProps, "titleTypography" | "descriptionTypography">;
-        bottomSheet: Pick<BottomSheetProps, "closeDragThreshold" | "closeVelocityThreshold" | "hideThumb" | "headerTypography">;
-        tableHeaderText: Pick<HeaderTextProps, "variant" | "size">;
-        tableCellText: Pick<CellTextProps, "variant" | "size">;
-        tag: Pick<TagProps, "textVariant" | "textSize">;
-        toast: Pick<ToastProps, "variant"> & {
-            position: ToastPosition;
-        };
-    }
-    interface ProviderProps {
-        config?: Partial<Options>;
-    }
-    export const Provider: ({ config, children }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
-    export const useConfig: () => DeepRequired<Options>;
-    export {};
+    input: Pick<TextInputProps, "variant" | "isClearable" | "hideLabel" | "as" | "size"> & {
+      alwaysShowClear?: boolean;
+    };
+    button: Pick<ButtonProps, "variant" | "size">;
+    numberInput: Pick<NumberInputProps, "formatOptions">;
+    radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel"> & {
+      fireBlurOnChange?: boolean;
+    };
+    checkbox: Pick<CheckboxProps, "variant"> & {
+      fireBlurOnChange?: boolean;
+    };
+    select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon" | "multiSelectAutoConfirm"> & {
+      fireBlurOnChange?: boolean;
+    };
+    queryAutocomplete: {
+      isInitialQueryDisabled?: boolean;
+      resolveSelectedItemsWithIds?: boolean;
+      searchDebounceDelay?: number;
+    };
+    querySelect: {
+      isInitialQueryDisabled?: boolean;
+      resolveSelectedItemsWithIds?: boolean;
+      searchDebounceDelay?: number;
+    };
+    toggle: Pick<ToggleProps, "variant"> & {
+      fireBlurOnChange?: boolean;
+    };
+    slider: Pick<SliderProps, "minValue" | "maxValue">;
+    dateInput: Pick<DatePickerProps, "todayIcon" | "todayIconButtonSize" | "todayIconPlacement" | "shouldForceLeadingZeros" | "disableManualEntry" | "shouldUpdateDateOnMonthYearChange" | "granularity" | "autoFixYear"> & {
+      calendarIcon?: ReactElement;
+      dateTimeIcon?: ReactElement;
+      timeIcon?: ReactElement;
+      setDateValueOnDateSelection?: boolean;
+      timeZone?: string;
+      todayIconButtonComponent?: DatePickerProps["todayIconButtonComponent"];
+      allowPartialRange?: boolean;
+      fireBlurOnChange?: boolean;
+    };
+    actionModal: Pick<ActionModalProps, "titleTypography" | "descriptionTypography">;
+    bottomSheet: Pick<BottomSheetProps, "closeDragThreshold" | "closeVelocityThreshold" | "hideThumb" | "headerTypography">;
+    tableHeaderText: Pick<HeaderTextProps, "variant" | "size">;
+    tableCellText: Pick<CellTextProps, "variant" | "size">;
+    tag: Pick<TagProps, "textVariant" | "textSize">;
+    toast: Pick<ToastProps, "variant"> & {
+      position: ToastPosition;
+    };
+  }
+  interface ProviderProps {
+    config?: Partial<Options>;
+  }
+  export const Provider: ({ config, children }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
+  export const useConfig: () => DeepRequired<Options>;
+  export {};
 }
+//#endregion
+export { UIConfig };

package/dist/config/uiConfig.context.js

@@ -1,13 +1,20 @@
 import { ObjectUtils } from "../utils/object.utils.js";
 import { useDeepCompareMemo } from "../hooks/useDeepCompare.js";
 import { Calendar, CalendarClock, Clock } from "lucide-react";
+import { c } from "react/compiler-runtime";
 import { createContext, use } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/config/uiConfig.context.tsx
-var UIConfig;
+let UIConfig;
 (function(_UIConfig) {
 	const DEFAULT_CONFIG = {
 		renderStaticInput: true,
+		responsive: { ssrMatches: {
+			sm: false,
+			md: false,
+			lg: false,
+			xl: false
+		} },
 		input: {
 			variant: "outlined",
 			as: "default",
@@ -112,15 +119,42 @@ var UIConfig;
 		}
 	};
 	const Context = createContext(DEFAULT_CONFIG);
-	_UIConfig.Provider = ({ config = {}, children }) => {
+	_UIConfig.Provider = (t0) => {
+		const $ = c(9);
+		const { config: t1, children } = t0;
+		let t2;
+		if ($[0] !== t1) {
+			t2 = t1 === void 0 ? {} : t1;
+			$[0] = t1;
+			$[1] = t2;
+		} else t2 = $[1];
+		const config = t2;
 		const parentConfig = use(Context) || DEFAULT_CONFIG;
-		const value = useDeepCompareMemo(() => {
-			return ObjectUtils.deepConditionalMerge(parentConfig, config, (val) => val !== null && val !== void 0);
-		}, [config, parentConfig]);
-		return /* @__PURE__ */ jsx(Context.Provider, {
-			value,
-			children
-		});
+		let t3;
+		let t4;
+		if ($[2] !== config || $[3] !== parentConfig) {
+			t3 = () => ObjectUtils.deepConditionalMerge(parentConfig, config, _temp);
+			t4 = [config, parentConfig];
+			$[2] = config;
+			$[3] = parentConfig;
+			$[4] = t3;
+			$[5] = t4;
+		} else {
+			t3 = $[4];
+			t4 = $[5];
+		}
+		const value = useDeepCompareMemo(t3, t4);
+		let t5;
+		if ($[6] !== children || $[7] !== value) {
+			t5 = /* @__PURE__ */ jsx(Context.Provider, {
+				value,
+				children
+			});
+			$[6] = children;
+			$[7] = value;
+			$[8] = t5;
+		} else t5 = $[8];
+		return t5;
 	};
 	_UIConfig.useConfig = () => {
 		const context = use(Context);
@@ -128,5 +162,8 @@ var UIConfig;
 		return context;
 	};
 })(UIConfig || (UIConfig = {}));
+function _temp(val) {
+	return val !== null && val !== void 0;
+}
 //#endregion
 export { UIConfig };