@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/cjs/hooks/useMenuItems.cjs

@@ -0,0 +1,27 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_store_appStore = require('../store/appStore.cjs');
+
+//#region src/hooks/useMenuItems.ts
+function useMenuItems() {
+	const menuItems = require_store_appStore.useAppStore((state) => state.menuItems);
+	return {
+		addMenuItem: require_store_appStore.useAppStore((state) => state.addMenuItem),
+		getMenuItems: () => menuItems,
+		menuItems,
+		removeMenuItem: require_store_appStore.useAppStore((state) => state.removeMenuItem)
+	};
+}
+var init_useMenuItems = require_rolldown_runtime.__esmMin((() => {
+	require_store_appStore.init_appStore();
+}));
+
+//#endregion
+init_useMenuItems();
+Object.defineProperty(exports, 'init_useMenuItems', {
+  enumerable: true,
+  get: function () {
+    return init_useMenuItems;
+  }
+});
+exports.useMenuItems = useMenuItems;
+//# sourceMappingURL=useMenuItems.cjs.map

package/dist/cjs/hooks/useMenuItems.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItems.cjs","names":["useAppStore"],"sources":["../../../src/hooks/useMenuItems.ts"],"sourcesContent":["import { useAppStore } from \"@/store/appStore\";\n\nexport function useMenuItems() {\n  const menuItems = useAppStore((state) => state.menuItems);\n  const addMenuItem = useAppStore((state) => state.addMenuItem);\n  const removeMenuItem = useAppStore((state) => state.removeMenuItem);\n\n  return {\n    addMenuItem,\n    getMenuItems: () => menuItems,\n    menuItems,\n    removeMenuItem,\n  };\n}\n"],"mappings":";;;;AAEA,SAAgB,eAAe;CAC7B,MAAM,YAAYA,oCAAa,UAAU,MAAM,UAAU;AAIzD,QAAO;EACL,aAJkBA,oCAAa,UAAU,MAAM,YAAY;EAK3D,oBAAoB;EACpB;EACA,gBANqBA,oCAAa,UAAU,MAAM,eAAe;EAOlE;;;uCAZ4C"}

package/dist/cjs/hooks/useMenuItems.d.cts

@@ -0,0 +1,10 @@
+//#region src/hooks/useMenuItems.d.ts
+declare function useMenuItems(): {
+  addMenuItem: (item: NavigationItem, parentKey?: string) => void;
+  getMenuItems: () => NavigationItem[];
+  menuItems: NavigationItem[];
+  removeMenuItem: (key: string) => void;
+};
+//#endregion
+export { useMenuItems };
+//# sourceMappingURL=useMenuItems.d.cts.map

package/dist/cjs/hooks/usePluginMeta.cjs

@@ -0,0 +1,22 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_store_portalStore = require('../store/portalStore.cjs');
+let _lumeweb_portal_framework_core = require("@lumeweb/portal-framework-core");
+
+//#region src/hooks/usePluginMeta.ts
+function usePluginMeta(pluginName, key) {
+	return (0, _lumeweb_portal_framework_core.getPluginMeta)(require_store_portalStore.usePortalStore((state) => state.meta), pluginName, key);
+}
+var init_usePluginMeta = require_rolldown_runtime.__esmMin((() => {
+	require_store_portalStore.init_portalStore();
+}));
+
+//#endregion
+init_usePluginMeta();
+Object.defineProperty(exports, 'init_usePluginMeta', {
+  enumerable: true,
+  get: function () {
+    return init_usePluginMeta;
+  }
+});
+exports.usePluginMeta = usePluginMeta;
+//# sourceMappingURL=usePluginMeta.cjs.map

package/dist/cjs/hooks/usePluginMeta.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePluginMeta.cjs","names":["usePortalStore"],"sources":["../../../src/hooks/usePluginMeta.ts"],"sourcesContent":["import { getPluginMeta } from \"@lumeweb/portal-framework-core\";\n\nimport { usePortalStore } from \"../store/portalStore\";\n\nexport function usePluginMeta<T = Record<string, unknown>>(\n  pluginName: string,\n  key?: string,\n): T | undefined {\n  const meta = usePortalStore((state) => state.meta);\n  return getPluginMeta<T>(meta, pluginName, key);\n}\n"],"mappings":";;;;;AAIA,SAAgB,cACd,YACA,KACe;AAEf,0DADaA,0CAAgB,UAAU,MAAM,KAAK,EACpB,YAAY,IAAI;;;6CAPM"}

package/dist/cjs/hooks/usePluginMeta.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/usePluginMeta.d.ts
+declare function usePluginMeta<T = Record<string, unknown>>(pluginName: string, key?: string): T | undefined;
+//#endregion
+export { usePluginMeta };
+//# sourceMappingURL=usePluginMeta.d.cts.map

package/dist/cjs/hooks/usePortalMeta.cjs

@@ -0,0 +1,12 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_store_portalStore = require('../store/portalStore.cjs');
+
+//#region src/hooks/usePortalMeta.ts
+require_store_portalStore.init_portalStore();
+function usePortalMeta() {
+	return require_store_portalStore.usePortalStore((state) => state.meta);
+}
+
+//#endregion
+exports.usePortalMeta = usePortalMeta;
+//# sourceMappingURL=usePortalMeta.cjs.map

package/dist/cjs/hooks/usePortalMeta.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePortalMeta.cjs","names":["usePortalStore"],"sources":["../../../src/hooks/usePortalMeta.ts"],"sourcesContent":["import { usePortalStore } from \"@/store/portalStore\";\n\nexport function usePortalMeta() {\n  // This hook now only reads the meta state from the store.\n  // The fetching logic has been moved to usePortalUrl.\n  return usePortalStore((state) => state.meta);\n}\n"],"mappings":";;;;4CAAqD;AAErD,SAAgB,gBAAgB;AAG9B,QAAOA,0CAAgB,UAAU,MAAM,KAAK"}

package/dist/cjs/hooks/usePortalMeta.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/usePortalMeta.d.ts
+declare function usePortalMeta(): any;
+//#endregion
+export { usePortalMeta };
+//# sourceMappingURL=usePortalMeta.d.cts.map

package/dist/cjs/hooks/usePortalUrl.cjs

@@ -0,0 +1,22 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_store_portalStore = require('../store/portalStore.cjs');
+
+//#region src/hooks/usePortalUrl.ts
+require_store_portalStore.init_portalStore();
+function usePortalUrl() {
+	const portalUrl = require_store_portalStore.usePortalStore((state) => state.portalUrl);
+	return isValidUrl(portalUrl) ? portalUrl : `https://${portalUrl}`;
+}
+function isValidUrl(url) {
+	if (!url) return false;
+	try {
+		new URL(url);
+		return true;
+	} catch {
+		return false;
+	}
+}
+
+//#endregion
+exports.usePortalUrl = usePortalUrl;
+//# sourceMappingURL=usePortalUrl.cjs.map

package/dist/cjs/hooks/usePortalUrl.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePortalUrl.cjs","names":["usePortalStore"],"sources":["../../../src/hooks/usePortalUrl.ts"],"sourcesContent":["import { usePortalStore } from \"@/store/portalStore\";\n\nexport function usePortalUrl(): string {\n  const portalUrl = usePortalStore((state) => state.portalUrl);\n\n  // Ensure valid URL format before returning\n  return isValidUrl(portalUrl) ? portalUrl : `https://${portalUrl}`;\n}\n\n// Helper function to validate URL format\nfunction isValidUrl(url: string): boolean {\n  if (!url) return false;\n  try {\n    new URL(url);\n    return true;\n  } catch {\n    return false;\n  }\n}\n"],"mappings":";;;;4CAAqD;AAErD,SAAgB,eAAuB;CACrC,MAAM,YAAYA,0CAAgB,UAAU,MAAM,UAAU;AAG5D,QAAO,WAAW,UAAU,GAAG,YAAY,WAAW;;AAIxD,SAAS,WAAW,KAAsB;AACxC,KAAI,CAAC,IAAK,QAAO;AACjB,KAAI;AACF,MAAI,IAAI,IAAI;AACZ,SAAO;SACD;AACN,SAAO"}

package/dist/cjs/hooks/usePortalUrl.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/usePortalUrl.d.ts
+declare function usePortalUrl(): string;
+//#endregion
+export { usePortalUrl };
+//# sourceMappingURL=usePortalUrl.d.cts.map

package/dist/cjs/hooks/useProtocolDomain.cjs

@@ -0,0 +1,13 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_hooks_usePortalMeta = require('./usePortalMeta.cjs');
+let _lumeweb_portal_framework_core = require("@lumeweb/portal-framework-core");
+
+//#region src/hooks/useProtocolDomain.ts
+function useProtocolDomain(proto) {
+	require_hooks_usePortalMeta.usePortalMeta()?.domain || (0, _lumeweb_portal_framework_core.getCurrentLocation)().hostname;
+	return (0, _lumeweb_portal_framework_core.getProtocolDomain)(proto, { isRootDomain: _lumeweb_portal_framework_core.env.VITE_PORTAL_DOMAIN_IS_ROOT === "true" });
+}
+
+//#endregion
+exports.useProtocolDomain = useProtocolDomain;
+//# sourceMappingURL=useProtocolDomain.cjs.map

package/dist/cjs/hooks/useProtocolDomain.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useProtocolDomain.cjs","names":["usePortalMeta","env"],"sources":["../../../src/hooks/useProtocolDomain.ts"],"sourcesContent":["import {\n  env,\n  getCurrentLocation,\n  getProtocolDomain,\n} from \"@lumeweb/portal-framework-core\";\n\nimport { usePortalMeta } from \"@/hooks/usePortalMeta\";\n\nexport function useProtocolDomain(proto: string): string {\n  const portalMeta = usePortalMeta();\n  const domain = portalMeta?.domain || getCurrentLocation().hostname;\n\n  return getProtocolDomain(proto, {\n    isRootDomain: env.VITE_PORTAL_DOMAIN_IS_ROOT === \"true\",\n  });\n}\n"],"mappings":";;;;;AAQA,SAAgB,kBAAkB,OAAuB;AAExC,CADIA,2CAAe,EACP,kEAA8B,CAAC;AAE1D,8DAAyB,OAAO,EAC9B,cAAcC,mCAAI,+BAA+B,QAClD,CAAC"}

package/dist/cjs/hooks/useProtocolDomain.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/useProtocolDomain.d.ts
+declare function useProtocolDomain(proto: string): string;
+//#endregion
+export { useProtocolDomain };
+//# sourceMappingURL=useProtocolDomain.d.cts.map

package/dist/cjs/hooks/useRegisterUrl.cjs

@@ -0,0 +1,11 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_hooks_useAccountUrl = require('./useAccountUrl.cjs');
+
+//#region src/hooks/useRegisterUrl.ts
+function useRegisterUrl() {
+	return require_hooks_useAccountUrl.useAccountUrl("/register");
+}
+
+//#endregion
+exports.useRegisterUrl = useRegisterUrl;
+//# sourceMappingURL=useRegisterUrl.cjs.map

package/dist/cjs/hooks/useRegisterUrl.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRegisterUrl.cjs","names":["useAccountUrl"],"sources":["../../../src/hooks/useRegisterUrl.ts"],"sourcesContent":["import { useAccountUrl } from \"@/hooks/useAccountUrl\";\n\nexport function useRegisterUrl() {\n  return useAccountUrl(\"/register\");\n}\n"],"mappings":";;;;AAEA,SAAgB,iBAAiB;AAC/B,QAAOA,0CAAc,YAAY"}

package/dist/cjs/hooks/useRegisterUrl.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/useRegisterUrl.d.ts
+declare function useRegisterUrl(): string;
+//#endregion
+export { useRegisterUrl };
+//# sourceMappingURL=useRegisterUrl.d.cts.map

package/dist/cjs/hooks/useResetPasswordUrl.cjs

@@ -0,0 +1,11 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_hooks_useAccountUrl = require('./useAccountUrl.cjs');
+
+//#region src/hooks/useResetPasswordUrl.ts
+function useResetPasswordUrl() {
+	return require_hooks_useAccountUrl.useAccountUrl("/reset-password");
+}
+
+//#endregion
+exports.useResetPasswordUrl = useResetPasswordUrl;
+//# sourceMappingURL=useResetPasswordUrl.cjs.map

package/dist/cjs/hooks/useResetPasswordUrl.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResetPasswordUrl.cjs","names":["useAccountUrl"],"sources":["../../../src/hooks/useResetPasswordUrl.ts"],"sourcesContent":["import { useAccountUrl } from \"@/hooks/useAccountUrl\";\n\nexport function useResetPasswordUrl() {\n  return useAccountUrl(\"/reset-password\");\n}\n"],"mappings":";;;;AAEA,SAAgB,sBAAsB;AACpC,QAAOA,0CAAc,kBAAkB"}

package/dist/cjs/hooks/useResetPasswordUrl.d.cts

@@ -0,0 +1,5 @@
+//#region src/hooks/useResetPasswordUrl.d.ts
+declare function useResetPasswordUrl(): string;
+//#endregion
+export { useResetPasswordUrl };
+//# sourceMappingURL=useResetPasswordUrl.d.cts.map

package/dist/cjs/hooks/useSdk.cjs

@@ -0,0 +1,36 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_store_portalStore = require('../store/portalStore.cjs');
+const require_hooks_useApiUrl = require('./useApiUrl.cjs');
+let react = require("react");
+let _lumeweb_portal_sdk = require("@lumeweb/portal-sdk");
+
+//#region src/hooks/useSdk.ts
+require_store_portalStore.init_portalStore();
+let isGloballyInitialized = false;
+const resetGloballyInitialized = () => {
+	isGloballyInitialized = false;
+};
+function useSdk() {
+	const apiUrl = require_hooks_useApiUrl.useApiUrl();
+	const { sdk } = require_store_portalStore.usePortalStore((state) => ({ sdk: state.sdk }));
+	const { setSdk } = require_store_portalStore.usePortalActions();
+	const initializationAttempted = (0, react.useRef)(false);
+	(0, react.useEffect)(() => {
+		if (apiUrl && !isGloballyInitialized && !initializationAttempted.current) {
+			initializationAttempted.current = true;
+			const initializeSdk = () => {
+				if (!isGloballyInitialized) {
+					isGloballyInitialized = true;
+					setSdk(new _lumeweb_portal_sdk.Sdk(apiUrl));
+				}
+			};
+			initializeSdk();
+		}
+	}, [apiUrl, setSdk]);
+	return sdk;
+}
+
+//#endregion
+exports.resetGloballyInitialized = resetGloballyInitialized;
+exports.useSdk = useSdk;
+//# sourceMappingURL=useSdk.cjs.map

package/dist/cjs/hooks/useSdk.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSdk.cjs","names":["useApiUrl","usePortalStore","usePortalActions","Sdk"],"sources":["../../../src/hooks/useSdk.ts"],"sourcesContent":["import { Sdk } from \"@lumeweb/portal-sdk\";\nimport { useEffect, useRef } from \"react\";\n\nimport { useApiUrl } from \"@/hooks/useApiUrl\"; // Import the updated useApiUrl hook\nimport { usePortalActions, usePortalStore } from \"@/store/portalStore\";\n\n// Global flag to ensure SDK is initialized only once across all instances\nlet isGloballyInitialized = false;\n\n// For testing purposes only\nexport const resetGloballyInitialized = () => {\n  isGloballyInitialized = false;\n};\n\nexport function useSdk() {\n  // Use the useApiUrl hook to get the API base URL\n  const apiUrl = useApiUrl();\n  const { sdk } = usePortalStore((state) => ({\n    sdk: state.sdk,\n  }));\n  const { setSdk } = usePortalActions();\n  const initializationAttempted = useRef(false);\n\n  useEffect(() => {\n    // Initialize SDK only when apiUrl is available (non-empty string)\n    if (apiUrl && !isGloballyInitialized && !initializationAttempted.current) {\n      initializationAttempted.current = true;\n      const initializeSdk = () => {\n        if (!isGloballyInitialized) {\n          isGloballyInitialized = true;\n          // Pass the determined apiUrl to the Sdk constructor\n          const newSdk = new Sdk(apiUrl);\n          setSdk(newSdk);\n        }\n      };\n\n      initializeSdk();\n    }\n  }, [apiUrl, setSdk]); // Update dependency array to depend on apiUrl\n\n  return sdk;\n}\n"],"mappings":";;;;;;;4CAIuE;AAGvE,IAAI,wBAAwB;AAG5B,MAAa,iCAAiC;AAC5C,yBAAwB;;AAG1B,SAAgB,SAAS;CAEvB,MAAM,SAASA,mCAAW;CAC1B,MAAM,EAAE,QAAQC,0CAAgB,WAAW,EACzC,KAAK,MAAM,KACZ,EAAE;CACH,MAAM,EAAE,WAAWC,4CAAkB;CACrC,MAAM,4CAAiC,MAAM;AAE7C,4BAAgB;AAEd,MAAI,UAAU,CAAC,yBAAyB,CAAC,wBAAwB,SAAS;AACxE,2BAAwB,UAAU;GAClC,MAAM,sBAAsB;AAC1B,QAAI,CAAC,uBAAuB;AAC1B,6BAAwB;AAGxB,YADe,IAAIC,wBAAI,OAAO,CAChB;;;AAIlB,kBAAe;;IAEhB,CAAC,QAAQ,OAAO,CAAC;AAEpB,QAAO"}

package/dist/cjs/hooks/useSdk.d.cts

@@ -0,0 +1,8 @@
+import { Sdk } from "@lumeweb/portal-sdk";
+
+//#region src/hooks/useSdk.d.ts
+declare const resetGloballyInitialized: () => void;
+declare function useSdk(): Sdk | null;
+//#endregion
+export { resetGloballyInitialized, useSdk };
+//# sourceMappingURL=useSdk.d.cts.map

package/dist/cjs/hooks/useTheme.cjs

@@ -0,0 +1,68 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_hooks_usePluginMeta = require('./usePluginMeta.cjs');
+const require_store_uiStore = require('../store/uiStore.cjs');
+const require_utils_theme = require('../utils/theme.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/hooks/useTheme.tsx
+var useThemeIdAndSetter, useTheme, withTheme;
+var init_useTheme = require_rolldown_runtime.__esmMin((() => {
+	require_store_uiStore.init_uiStore();
+	require_utils_theme.init_theme();
+	require_hooks_usePluginMeta.init_usePluginMeta();
+	useThemeIdAndSetter = () => {
+		const theme = require_store_uiStore.useUIStore((state) => state.theme);
+		return {
+			setTheme: require_store_uiStore.useUIStore((state) => state.setTheme),
+			theme
+		};
+	};
+	useTheme = () => {
+		const { theme: selectedThemeId } = useThemeIdAndSetter();
+		const themes = require_hooks_usePluginMeta.usePluginMeta("dashboard", "themes");
+		if (selectedThemeId && Array.isArray(themes) && themes.length > 0) {
+			const persistedTheme = require_utils_theme.getThemeById(themes, selectedThemeId);
+			if (persistedTheme) return persistedTheme;
+		}
+		if (!themes || themes.length === 0) return;
+		let theme = require_utils_theme.getThemeById(themes, selectedThemeId);
+		if (!theme) theme = themes.find((t) => t.default);
+		if (!theme && themes.length > 0) theme = themes[0];
+		return theme;
+	};
+	withTheme = (Component) => {
+		return function WithTheme(props) {
+			const { theme: selectedThemeId } = useThemeIdAndSetter();
+			const themes = require_hooks_usePluginMeta.usePluginMeta("dashboard", "themes");
+			(0, react.useEffect)(() => {
+				if (!themes || !Array.isArray(themes) || themes.length === 0) return;
+				if (selectedThemeId) {
+					const persistedTheme = require_utils_theme.getThemeById(themes, selectedThemeId);
+					if (persistedTheme) {
+						require_utils_theme.applyThemeStyles(persistedTheme);
+						return;
+					}
+				}
+				const themeToApply = require_utils_theme.getThemeById(themes, selectedThemeId) || themes.find((t) => t.default) || themes[0];
+				if (themeToApply) require_utils_theme.applyThemeStyles(themeToApply);
+				else console.warn("No theme found to apply.");
+			}, [selectedThemeId, themes]);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, { ...props });
+		};
+	};
+}));
+
+//#endregion
+init_useTheme();
+Object.defineProperty(exports, 'init_useTheme', {
+  enumerable: true,
+  get: function () {
+    return init_useTheme;
+  }
+});
+exports.useTheme = useTheme;
+exports.useThemeIdAndSetter = useThemeIdAndSetter;
+exports.withTheme = withTheme;
+//# sourceMappingURL=useTheme.cjs.map

package/dist/cjs/hooks/useTheme.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.cjs","names":["useUIStore","usePluginMeta","getThemeById"],"sources":["../../../src/hooks/useTheme.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\n\nimport { useUIStore } from \"@/store/uiStore\";\nimport { getThemeById } from \"@/utils/theme\";\n\n// Import Theme from the new types file\nimport type { Theme } from \"../types/theme\";\n\nimport { applyThemeStyles } from \"../utils/theme\";\nimport { usePluginMeta } from \"./usePluginMeta\";\n/**\n * Higher-Order Component (HoC) for managing theme application at the root level.\n *\n * This HoC is used to control the theme for the Root component, ensuring proper\n * theme management throughout the application. It's an alternative to using\n * React Context, which is the current best practice, but we've chosen a different\n * approach here with global state management.\n *\n * Wrapping a component in this HoC will ensure that the theme is applied to the\n * <html> element of the page, so this HoC should be used for the Root component\n * only.\n *\n * The HoC:\n * 1. Retrieves the current theme ID from the global app store using useThemeIdAndSetter.\n * 2. Retrieves the list of available themes from plugin metadata using usePluginMeta.\n * 3. Uses an effect to find the selected or default theme and apply it using the utility function.\n * 4. Wraps the provided component, passing through all props.\n *\n * @param Component - The React component to be wrapped.\n * @returns A new component with theme management capabilities.\n */\n\n/**\n * Hook to get the currently selected theme ID and the setter function.\n * This hook directly uses the UI store.\n */\nexport const useThemeIdAndSetter = () => {\n  const theme = useUIStore((state) => state.theme);\n  const setTheme = useUIStore((state) => state.setTheme);\n\n  return {\n    setTheme,\n    theme, // This is the theme ID string\n  };\n};\n\n/**\n * Hook to get the full Theme object based on the selected theme ID and available themes from meta.\n */\nexport const useTheme = (): Theme | undefined => {\n  const { theme: selectedThemeId } = useThemeIdAndSetter();\n  const themes = usePluginMeta<Theme[]>(\"dashboard\", \"themes\");\n\n  // First, try to use the persisted theme from the store\n  if (selectedThemeId && Array.isArray(themes) && themes.length > 0) {\n    const persistedTheme = getThemeById(themes, selectedThemeId);\n    if (persistedTheme) {\n      return persistedTheme;\n    }\n  }\n\n  // Fallback to original logic if no persisted theme found or selectedThemeId is not set yet\n  if (!themes || themes.length === 0) {\n    return undefined;\n  }\n\n  let theme = getThemeById(themes, selectedThemeId);\n\n  if (!theme) {\n    theme = themes.find((t) => t.default);\n  }\n\n  if (!theme && themes.length > 0) {\n    theme = themes[0];\n  }\n\n  return theme;\n};\n\nexport const withTheme = <P extends object>(\n  Component: React.ComponentType<P>,\n) => {\n  return function WithTheme(props: P) {\n    const { theme: selectedThemeId } = useThemeIdAndSetter();\n    const themes = usePluginMeta<Theme[]>(\"dashboard\", \"themes\");\n\n    useEffect(() => {\n      if (!themes || !Array.isArray(themes) || themes.length === 0) {\n        return;\n      }\n\n      // First, try to use the persisted theme\n      if (selectedThemeId) {\n        const persistedTheme = getThemeById(themes, selectedThemeId);\n        if (persistedTheme) {\n          applyThemeStyles(persistedTheme);\n          return;\n        }\n      }\n\n      // Fallback to original logic if no persisted theme found\n      const themeToApply =\n        getThemeById(themes, selectedThemeId) ||\n        themes.find((t) => t.default) ||\n        themes[0];\n\n      if (themeToApply) {\n        applyThemeStyles(themeToApply);\n      } else {\n        console.warn(\"No theme found to apply.\");\n      }\n    }, [selectedThemeId, themes]);\n\n    return <Component {...props} />;\n  };\n};\n"],"mappings":";;;;;;;;;;;qCAE6C;iCACA;iDAMG;CA2BnC,4BAA4B;EACvC,MAAM,QAAQA,kCAAY,UAAU,MAAM,MAAM;AAGhD,SAAO;GACL,UAHeA,kCAAY,UAAU,MAAM,SAAS;GAIpD;GACD;;CAMU,iBAAoC;EAC/C,MAAM,EAAE,OAAO,oBAAoB,qBAAqB;EACxD,MAAM,SAASC,0CAAuB,aAAa,SAAS;AAG5D,MAAI,mBAAmB,MAAM,QAAQ,OAAO,IAAI,OAAO,SAAS,GAAG;GACjE,MAAM,iBAAiBC,iCAAa,QAAQ,gBAAgB;AAC5D,OAAI,eACF,QAAO;;AAKX,MAAI,CAAC,UAAU,OAAO,WAAW,EAC/B;EAGF,IAAI,QAAQA,iCAAa,QAAQ,gBAAgB;AAEjD,MAAI,CAAC,MACH,SAAQ,OAAO,MAAM,MAAM,EAAE,QAAQ;AAGvC,MAAI,CAAC,SAAS,OAAO,SAAS,EAC5B,SAAQ,OAAO;AAGjB,SAAO;;CAGI,aACX,cACG;AACH,SAAO,SAAS,UAAU,OAAU;GAClC,MAAM,EAAE,OAAO,oBAAoB,qBAAqB;GACxD,MAAM,SAASD,0CAAuB,aAAa,SAAS;AAE5D,8BAAgB;AACd,QAAI,CAAC,UAAU,CAAC,MAAM,QAAQ,OAAO,IAAI,OAAO,WAAW,EACzD;AAIF,QAAI,iBAAiB;KACnB,MAAM,iBAAiBC,iCAAa,QAAQ,gBAAgB;AAC5D,SAAI,gBAAgB;AAClB,2CAAiB,eAAe;AAChC;;;IAKJ,MAAM,eACJA,iCAAa,QAAQ,gBAAgB,IACrC,OAAO,MAAM,MAAM,EAAE,QAAQ,IAC7B,OAAO;AAET,QAAI,aACF,sCAAiB,aAAa;QAE9B,SAAQ,KAAK,2BAA2B;MAEzC,CAAC,iBAAiB,OAAO,CAAC;AAE7B,UAAO,2CAAC,aAAU,GAAI,QAAS"}

package/dist/cjs/hooks/useTheme.d.cts

@@ -0,0 +1,42 @@
+import { Theme } from "../types/theme.cjs";
+import React from "react";
+
+//#region src/hooks/useTheme.d.ts
+
+/**
+ * Higher-Order Component (HoC) for managing theme application at the root level.
+ *
+ * This HoC is used to control the theme for the Root component, ensuring proper
+ * theme management throughout the application. It's an alternative to using
+ * React Context, which is the current best practice, but we've chosen a different
+ * approach here with global state management.
+ *
+ * Wrapping a component in this HoC will ensure that the theme is applied to the
+ * <html> element of the page, so this HoC should be used for the Root component
+ * only.
+ *
+ * The HoC:
+ * 1. Retrieves the current theme ID from the global app store using useThemeIdAndSetter.
+ * 2. Retrieves the list of available themes from plugin metadata using usePluginMeta.
+ * 3. Uses an effect to find the selected or default theme and apply it using the utility function.
+ * 4. Wraps the provided component, passing through all props.
+ *
+ * @param Component - The React component to be wrapped.
+ * @returns A new component with theme management capabilities.
+ */
+/**
+ * Hook to get the currently selected theme ID and the setter function.
+ * This hook directly uses the UI store.
+ */
+declare const useThemeIdAndSetter: () => {
+  setTheme: (theme: string) => void;
+  theme: string;
+};
+/**
+ * Hook to get the full Theme object based on the selected theme ID and available themes from meta.
+ */
+declare const useTheme: () => Theme | undefined;
+declare const withTheme: <P extends object>(Component: React.ComponentType<P>) => (props: P) => any;
+//#endregion
+export { useTheme, useThemeIdAndSetter, withTheme };
+//# sourceMappingURL=useTheme.d.cts.map

package/dist/cjs/hooks/useTheme.spec.cjs

@@ -0,0 +1,152 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_hooks_usePluginMeta = require('./usePluginMeta.cjs');
+const require_store_uiStore = require('../store/uiStore.cjs');
+const require_utils_theme = require('../utils/theme.cjs');
+const require_hooks_useTheme = require('./useTheme.cjs');
+let _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js = require("/home/runner/work/web/web/node_modules/.pnpm/@testing-library+react@16.3.1_@testing-library+dom@10.4.0_@types+react-dom@19.2.3_@type_dda5dedfc9a50d1db6bb0a214573fe51/node_modules/@testing-library/react/dist/index.js");
+let _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js = require("/home/runner/work/web/web/node_modules/.pnpm/vitest@4.0.16_@types+node@25.0.6_@vitest+browser-playwright@4.0.16_happy-dom@20.1.0_jit_f9bfc6b661e56e62de1f809a028e46f4/node_modules/vitest/dist/index.js");
+
+//#region src/hooks/useTheme.spec.tsx
+require_store_uiStore.init_uiStore();
+require_utils_theme.init_theme();
+require_hooks_usePluginMeta.init_usePluginMeta();
+require_hooks_useTheme.init_useTheme();
+_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.mock("@/store/uiStore", () => {
+	let mockUIStoreState = { theme: "default" };
+	const mockSetTheme = _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.fn((theme) => {
+		mockUIStoreState.theme = theme;
+	});
+	return {
+		__clearMockSetThemeSpy: () => {
+			mockSetTheme.mockClear();
+		},
+		__getMockUIStoreState: () => mockUIStoreState,
+		__mockSetTheme: mockSetTheme,
+		__resetMockUIStoreState: (newState) => {
+			mockUIStoreState = newState;
+		},
+		useUIStore: _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.fn((selector) => {
+			return selector({
+				...mockUIStoreState,
+				setTheme: mockSetTheme
+			});
+		})
+	};
+});
+_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.mock("./usePluginMeta", () => {
+	const mockUsePluginMeta$1 = _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.fn();
+	return {
+		__mockUsePluginMeta: mockUsePluginMeta$1,
+		usePluginMeta: mockUsePluginMeta$1
+	};
+});
+_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.mock("../utils/theme", () => {
+	const mockGetThemeById$1 = _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.fn();
+	return {
+		__mockGetThemeById: mockGetThemeById$1,
+		applyThemeStyles: _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.fn(),
+		getThemeById: mockGetThemeById$1
+	};
+});
+(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.describe)("useThemeIdAndSetter", () => {
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.beforeEach)(() => {
+		_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.clearAllMocks();
+		__resetMockUIStoreState({ theme: "default" });
+		__clearMockSetThemeSpy();
+		_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.mocked(require_store_uiStore.useUIStore).mockClear();
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return the current theme ID from the UI store", () => {
+		__resetMockUIStoreState({ theme: "dark" });
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useThemeIdAndSetter());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current.theme).toBe("dark");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(require_store_uiStore.useUIStore).toHaveBeenCalled();
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return the setTheme function from the UI store", () => {
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useThemeIdAndSetter());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current.setTheme).toBe(__mockSetTheme);
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(require_store_uiStore.useUIStore).toHaveBeenCalled();
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should allow updating the theme via the returned setTheme function", () => {
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useThemeIdAndSetter());
+		result.current.setTheme("custom");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(__mockSetTheme).toHaveBeenCalledWith("custom");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(__getMockUIStoreState().theme).toBe("custom");
+	});
+});
+(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.describe)("useTheme", () => {
+	const mockThemes = [
+		{
+			default: true,
+			id: "default",
+			name: "Default"
+		},
+		{
+			id: "dark",
+			name: "Dark"
+		},
+		{
+			id: "custom",
+			name: "Custom"
+		}
+	];
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.beforeEach)(() => {
+		_home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.vi.clearAllMocks();
+		__resetMockUIStoreState({ theme: "default" });
+		__clearMockSetThemeSpy();
+		mockUsePluginMeta.mockReset();
+		mockGetThemeById.mockReset();
+		mockUsePluginMeta.mockReturnValue(mockThemes);
+		mockGetThemeById.mockImplementation((themes, id) => themes.find((t) => t.id === id));
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return the selected theme based on store state and available themes", () => {
+		__resetMockUIStoreState({ theme: "dark" });
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useTheme());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(require_store_uiStore.useUIStore).toHaveBeenCalled();
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockUsePluginMeta).toHaveBeenCalledWith("dashboard", "themes");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockGetThemeById).toHaveBeenCalledWith(mockThemes, "dark");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current).toEqual({
+			id: "dark",
+			name: "Dark"
+		});
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return the default theme if the selected theme is not found", () => {
+		__resetMockUIStoreState({ theme: "non-existent" });
+		mockGetThemeById.mockReturnValue(void 0);
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useTheme());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockGetThemeById).toHaveBeenCalledWith(mockThemes, "non-existent");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current).toEqual({
+			default: true,
+			id: "default",
+			name: "Default"
+		});
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return the first theme if selected and default themes are not found", () => {
+		__resetMockUIStoreState({ theme: "non-existent" });
+		mockGetThemeById.mockReturnValue(void 0);
+		const themesWithoutDefault = mockThemes.map((t) => ({
+			...t,
+			default: void 0
+		}));
+		mockUsePluginMeta.mockReturnValue(themesWithoutDefault);
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useTheme());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockGetThemeById).toHaveBeenCalledWith(themesWithoutDefault, "non-existent");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current).toEqual(themesWithoutDefault[0]);
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return undefined if no themes are available", () => {
+		mockUsePluginMeta.mockReturnValue(void 0);
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useTheme());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockUsePluginMeta).toHaveBeenCalledWith("dashboard", "themes");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current).toBeUndefined();
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockGetThemeById).not.toHaveBeenCalled();
+	});
+	(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.it)("should return undefined if themes array is empty", () => {
+		mockUsePluginMeta.mockReturnValue([]);
+		const { result } = (0, _home_runner_work_web_web_node_modules__pnpm__testing_library_react_16_3_1__testing_library_dom_10_4_0__types_react_dom_19_2_3__type_dda5dedfc9a50d1db6bb0a214573fe51_node_modules__testing_library_react_dist_index_js.renderHook)(() => require_hooks_useTheme.useTheme());
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockUsePluginMeta).toHaveBeenCalledWith("dashboard", "themes");
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(result.current).toBeUndefined();
+		(0, _home_runner_work_web_web_node_modules__pnpm_vitest_4_0_16__types_node_25_0_6__vitest_browser_playwright_4_0_16_happy_dom_20_1_0_jit_f9bfc6b661e56e62de1f809a028e46f4_node_modules_vitest_dist_index_js.expect)(mockGetThemeById).not.toHaveBeenCalled();
+	});
+});
+
+//#endregion
+//# sourceMappingURL=useTheme.spec.cjs.map

package/dist/cjs/hooks/useTheme.spec.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.spec.cjs","names":["vi","mockUsePluginMeta","mockGetThemeById","mockedUseUIStore","useThemeIdAndSetter","useTheme"],"sources":["../../../src/hooks/useTheme.spec.tsx"],"sourcesContent":["import { renderHook } from \"@testing-library/react\";\nimport { beforeEach, describe, expect, it, vi } from \"vitest\";\n\n// Import the mocked useUIStore hook\n// Import the mocked functions and state helpers *after* the vi.mock call\nimport {\n  __clearMockSetThemeSpy,\n  __getMockUIStoreState,\n  __mockSetTheme,\n  __resetMockUIStoreState,\n  useUIStore as mockedUseUIStore,\n} from \"@/store/uiStore\";\n\n// Import the mocked function reference after the vi.mock call\nimport { __mockGetThemeById as mockGetThemeById } from \"../utils/theme\";\n// Import the mocked function reference after the vi.mock call\nimport { __mockUsePluginMeta as mockUsePluginMeta } from \"./usePluginMeta\";\n// Import the hook we are actually testing from the source file\n// Import useThemeIdAndSetter and useTheme\nimport { useTheme, useThemeIdAndSetter } from \"./useTheme\";\n\n// Mock dependencies\n// Mock the actual store module (@/store/uiStore)\n// The factory function runs during mock resolution, before test execution.\n// It should define the *mocked exports* of the module.\nvi.mock(\"@/store/uiStore\", () => {\n  // Define the mutable state and the mock function *inside* the factory\n  let mockUIStoreState = { theme: \"default\" };\n  const mockSetTheme = vi.fn((theme: string) => {\n    mockUIStoreState.theme = theme; // Update internal state\n  });\n\n  // Inside the factory: Define the mock implementation of the hook.\n  const useUIStoreSpy = vi.fn((selector) => {\n    // This function is called by the hook under test (useThemeIdAndSetter)\n    // It accesses the *current* state from the mockUIStoreState defined *within* the factory\n    // and applies the selector function passed by the hook.\n    // Also include the setter in the state object for the selector\n    return selector({ ...mockUIStoreState, setTheme: mockSetTheme });\n  });\n\n  return {\n    __clearMockSetThemeSpy: () => {\n      mockSetTheme.mockClear();\n    },\n    __getMockUIStoreState: () => mockUIStoreState,\n    __mockSetTheme: mockSetTheme, // Export the spy itself for assertions\n    // Export helper functions for tests to manage the internal state and spies\n    __resetMockUIStoreState: (newState: { theme: string }) => {\n      mockUIStoreState = newState;\n    },\n    // Export the mocked hook with the name it's expected to have\n    useUIStore: useUIStoreSpy,\n  };\n});\n\n// Mock usePluginMeta as it's used by the other hook (useTheme) in the same file\n// This is necessary because Vitest evaluates the entire module when importing.\nvi.mock(\"./usePluginMeta\", () => {\n  // Define the mock function inside the factory\n  const mockUsePluginMeta = vi.fn();\n  return {\n    // Export the mock function reference for assertions\n    __mockUsePluginMeta: mockUsePluginMeta,\n    usePluginMeta: mockUsePluginMeta,\n  };\n});\n\n// Mock the theme utility function\nvi.mock(\"../utils/theme\", () => {\n  // Declare the mock function inside the factory\n  const mockGetThemeById = vi.fn();\n  return {\n    // Export the mock function reference if needed for assertions outside the factory\n    __mockGetThemeById: mockGetThemeById,\n    applyThemeStyles: vi.fn(), // Mock applyThemeStyles as it's used by withTheme (not tested here)\n    getThemeById: mockGetThemeById,\n  };\n});\n\ndescribe(\"useThemeIdAndSetter\", () => {\n  beforeEach(() => {\n    vi.clearAllMocks();\n    // Reset the mock state using the exported helper function\n    __resetMockUIStoreState({ theme: \"default\" });\n    // Reset the spy using the exported helper function\n    __clearMockSetThemeSpy();\n    vi.mocked(mockedUseUIStore).mockClear();\n  });\n\n  it(\"should return the current theme ID from the UI store\", () => {\n    // Arrange: Modify the mock state using the exported helper function\n    __resetMockUIStoreState({ theme: \"dark\" });\n\n    // Call the hook under test\n    const { result } = renderHook(() => useThemeIdAndSetter());\n\n    // result.current will now be { theme: string, setTheme: Function }\n    expect(result.current.theme).toBe(\"dark\");\n    // Verify that the underlying useUIStore hook was called\n    expect(mockedUseUIStore).toHaveBeenCalled();\n  });\n\n  it(\"should return the setTheme function from the UI store\", () => {\n    // Call the hook under test\n    const { result } = renderHook(() => useThemeIdAndSetter());\n\n    // result.current will now be { theme: string, setTheme: Function }\n    // Expect the function returned by the hook to be the mock function we set inside the factory\n    expect(result.current.setTheme).toBe(__mockSetTheme);\n    // Verify that the underlying useUIStore hook was called\n    expect(mockedUseUIStore).toHaveBeenCalled();\n  });\n\n  it(\"should allow updating the theme via the returned setTheme function\", () => {\n    // Call the hook under test\n    const { result } = renderHook(() => useThemeIdAndSetter());\n\n    // result.current will now be { theme: string, setTheme: Function }\n    result.current.setTheme(\"custom\");\n\n    // Verify that the mock setTheme function was called with the correct argument\n    expect(__mockSetTheme).toHaveBeenCalledWith(\"custom\");\n    // Verify the internal state was updated\n    expect(__getMockUIStoreState().theme).toBe(\"custom\");\n  });\n});\n\ndescribe(\"useTheme\", () => {\n  const mockThemes = [\n    { default: true, id: \"default\", name: \"Default\" },\n    { id: \"dark\", name: \"Dark\" },\n    { id: \"custom\", name: \"Custom\" },\n  ];\n\n  beforeEach(() => {\n    vi.clearAllMocks();\n    // Reset mock state and dependencies\n    __resetMockUIStoreState({ theme: \"default\" }); // Reset UI store theme\n    __clearMockSetThemeSpy(); // Clear the spy\n    mockUsePluginMeta.mockReset();\n    mockGetThemeById.mockReset();\n\n    // Default mock implementations\n    mockUsePluginMeta.mockReturnValue(mockThemes);\n    // Default getThemeById to return the theme matching the ID\n    mockGetThemeById.mockImplementation((themes, id) =>\n      themes.find((t) => t.id === id),\n    );\n  });\n\n  it(\"should return the selected theme based on store state and available themes\", () => {\n    __resetMockUIStoreState({ theme: \"dark\" }); // Set selected theme in store\n\n    const { result } = renderHook(() => useTheme());\n\n    expect(mockedUseUIStore).toHaveBeenCalled(); // useThemeIdAndSetter is called internally\n    expect(mockUsePluginMeta).toHaveBeenCalledWith(\"dashboard\", \"themes\");\n    expect(mockGetThemeById).toHaveBeenCalledWith(mockThemes, \"dark\");\n    expect(result.current).toEqual({ id: \"dark\", name: \"Dark\" });\n  });\n\n  it(\"should return the default theme if the selected theme is not found\", () => {\n    __resetMockUIStoreState({ theme: \"non-existent\" }); // Selected theme not in mockThemes\n    mockGetThemeById.mockReturnValue(undefined); // Simulate getThemeById not finding it\n\n    const { result } = renderHook(() => useTheme());\n\n    expect(mockGetThemeById).toHaveBeenCalledWith(mockThemes, \"non-existent\");\n    // It should fallback to finding the default theme\n    expect(result.current).toEqual({\n      default: true,\n      id: \"default\",\n      name: \"Default\",\n    });\n  });\n\n  it(\"should return the first theme if selected and default themes are not found\", () => {\n    __resetMockUIStoreState({ theme: \"non-existent\" });\n    mockGetThemeById.mockReturnValue(undefined);\n    // Remove default flag from mockThemes for this test\n    const themesWithoutDefault = mockThemes.map((t) => ({\n      ...t,\n      default: undefined,\n    }));\n    mockUsePluginMeta.mockReturnValue(themesWithoutDefault);\n\n    const { result } = renderHook(() => useTheme());\n\n    expect(mockGetThemeById).toHaveBeenCalledWith(\n      themesWithoutDefault,\n      \"non-existent\",\n    );\n    // It should fallback to the first theme in the list\n    expect(result.current).toEqual(themesWithoutDefault[0]); // Should be the 'default' theme object without the default flag\n  });\n\n  it(\"should return undefined if no themes are available\", () => {\n    mockUsePluginMeta.mockReturnValue(undefined); // No themes available\n\n    const { result } = renderHook(() => useTheme());\n\n    expect(mockUsePluginMeta).toHaveBeenCalledWith(\"dashboard\", \"themes\");\n    expect(result.current).toBeUndefined();\n    expect(mockGetThemeById).not.toHaveBeenCalled(); // Should not try to find themes if none available\n  });\n\n  it(\"should return undefined if themes array is empty\", () => {\n    mockUsePluginMeta.mockReturnValue([]); // Empty themes array\n\n    const { result } = renderHook(() => useTheme());\n\n    expect(mockUsePluginMeta).toHaveBeenCalledWith(\"dashboard\", \"themes\");\n    expect(result.current).toBeUndefined();\n    expect(mockGetThemeById).not.toHaveBeenCalled(); // Should not try to find themes if array is empty\n  });\n});\n\n// Note: Testing the `withTheme` HoC would require separate tests,\n// potentially using `@testing-library/react`'s `render` and mocking\n// DOM manipulation or testing the CSS output directly.\n"],"mappings":"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"}

package/dist/cjs/hooks/useTheme.spec.d.cts

@@ -0,0 +1 @@
+export { };

package/dist/cjs/image.d.cjs

@@ -0,0 +1 @@
+const require_rolldown_runtime = require('./_virtual/rolldown_runtime.cjs');

package/dist/cjs/image.d.cts

@@ -0,0 +1,6 @@
+//#region src/image.d.ts
+declare module "*.png" {
+  const src: string;
+  export default src;
+}
+//# sourceMappingURL=image.d.cts.map