@lumeweb/portal-framework-ui 0.1.0 → 0.1.2

package/dist/esm/components/sizing/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/sizing/index.ts"],"sourcesContent":["/**\n * Generic size system for UI components\n * Provides consistent sizing across dialogs, wizards, and other components\n */\n\n/**\n * Standard size options using Tailwind CSS conventions\n */\nexport enum ComponentSize {\n  TWO_XL = \"2xl\", // max-w-2xl (42rem / 672px)\n  THREE_XL = \"3xl\", // max-w-3xl (48rem / 768px)\n  FOUR_XL = \"4xl\", // max-w-4xl (56rem / 896px)\n  FIVE_XL = \"5xl\", // max-w-5xl (64rem / 1024px)\n  SIX_XL = \"6xl\", // max-w-6xl (72rem / 1152px)\n  SEVEN_XL = \"7xl\", // max-w-7xl (80rem / 1280px)\n  AUTO = \"auto\", // Responsive auto width\n  FULL = \"full\", // 100%\n  LG = \"lg\", // max-w-lg (32rem / 512px)\n  MD = \"md\", // max-w-md (28rem / 448px)\n  SM = \"sm\", // max-w-sm (24rem / 384px)\n  XL = \"xl\", // max-w-xl (36rem / 576px)\n  XS = \"xs\", // max-w-xs (20rem / 320px)\n}\n\n/**\n * Width categories for components\n */\nexport enum WidthCategory {\n  EXTRA_NARROW = \"extra-narrow\", // xs, sm\n  NARROW = \"narrow\", // md, lg\n  MEDIUM = \"medium\", // xl\n  WIDE = \"wide\", // 2xl, 3xl\n  EXTRA_WIDE = \"extra-wide\", // 4xl, 5xl, 6xl, 7xl\n  RESPONSIVE = \"responsive\", // auto, full\n}\n\n/**\n * Generic size classes mapping that can be used by different components\n * Each component can use the sizes that make sense for its context\n */\nexport const COMPONENT_SIZE_CLASSES = {\n  [ComponentSize.TWO_XL]: \"max-w-2xl\", // 42rem (672px)\n  [ComponentSize.THREE_XL]: \"max-w-3xl\", // 48rem (768px)\n  [ComponentSize.FOUR_XL]: \"max-w-4xl\", // 56rem (896px)\n  [ComponentSize.FIVE_XL]: \"max-w-5xl\", // 64rem (1024px)\n  [ComponentSize.SIX_XL]: \"max-w-6xl\", // 72rem (1152px)\n  [ComponentSize.SEVEN_XL]: \"max-w-7xl\", // 80rem (1280px)\n  [ComponentSize.AUTO]: \"max-w-[calc(100vw-2rem)] sm:max-w-md\", // Responsive auto\n  [ComponentSize.FULL]: \"max-w-full\", // 100%\n  [ComponentSize.LG]: \"max-w-lg\", // 32rem (512px)\n  [ComponentSize.MD]: \"max-w-md\", // 28rem (448px)\n  [ComponentSize.SM]: \"max-w-sm\", // 24rem (384px)\n  [ComponentSize.XL]: \"max-w-xl\", // 36rem (576px)\n  [ComponentSize.XS]: \"max-w-xs\", // 20rem (320px)\n} as const;\n\n/**\n * Helper function to create size-specific props for components\n */\nexport interface SizeConfig {\n  /**\n   * Custom size class that overrides the size prop\n   * Useful when you need a specific size not covered by the standard sizes\n   */\n  customSizeClass?: string;\n  size?: ComponentSize;\n}\n\n/**\n * Get the CSS class for a given component size\n * Returns undefined if the size is not valid\n */\nexport function getComponentSizeClass(size: ComponentSize): string {\n  return COMPONENT_SIZE_CLASSES[size];\n}\n\n/**\n * Get the final size class considering both size prop and customSizeClass\n */\nexport function getSizeClass(config: SizeConfig): string | undefined {\n  if (config.customSizeClass) {\n    return config.customSizeClass;\n  }\n  if (config.size) {\n    return getComponentSizeClass(config.size);\n  }\n  return undefined;\n}\n\n/**\n * Type guard to check if a string is a valid ComponentSize\n */\nexport function isComponentSize(size: string): size is ComponentSize {\n  return Object.values(ComponentSize).includes(size as ComponentSize);\n}\n"],"mappings":";;;;;;;AAwEA,SAAgB,sBAAsB,MAA6B;AACjE,QAAO,uBAAuB;;;;;AAMhC,SAAgB,aAAa,QAAwC;AACnE,KAAI,OAAO,gBACT,QAAO,OAAO;AAEhB,KAAI,OAAO,KACT,QAAO,sBAAsB,OAAO,KAAK;;;;;AAQ7C,SAAgB,gBAAgB,MAAqC;AACnE,QAAO,OAAO,OAAO,cAAc,CAAC,SAAS,KAAsB;;;;CArFzD,0DAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;CAMU,0DAAL;AACL;AACA;AACA;AACA;AACA;AACA;;;CAOW,yBAAyB;GACnC,cAAc,SAAS;GACvB,cAAc,WAAW;GACzB,cAAc,UAAU;GACxB,cAAc,UAAU;GACxB,cAAc,SAAS;GACvB,cAAc,WAAW;GACzB,cAAc,OAAO;GACrB,cAAc,OAAO;GACrB,cAAc,KAAK;GACnB,cAAc,KAAK;GACnB,cAAc,KAAK;GACnB,cAAc,KAAK;GACnB,cAAc,KAAK;EACrB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/sizing/index.ts"],"sourcesContent":["/**\n * Generic size system for UI components\n * Provides consistent sizing across dialogs, wizards, and other components\n */\n\n/**\n * Standard size options using Tailwind CSS conventions\n */\nexport enum ComponentSize {\n  TWO_XL = \"2xl\", // max-w-2xl (42rem / 672px)\n  THREE_XL = \"3xl\", // max-w-3xl (48rem / 768px)\n  FOUR_XL = \"4xl\", // max-w-4xl (56rem / 896px)\n  FIVE_XL = \"5xl\", // max-w-5xl (64rem / 1024px)\n  SIX_XL = \"6xl\", // max-w-6xl (72rem / 1152px)\n  SEVEN_XL = \"7xl\", // max-w-7xl (80rem / 1280px)\n  AUTO = \"auto\", // Responsive auto width\n  FULL = \"full\", // 100%\n  LG = \"lg\", // max-w-lg (32rem / 512px)\n  MD = \"md\", // max-w-md (28rem / 448px)\n  SM = \"sm\", // max-w-sm (24rem / 384px)\n  XL = \"xl\", // max-w-xl (36rem / 576px)\n  XS = \"xs\", // max-w-xs (20rem / 320px)\n}\n\n/**\n * Width categories for components\n */\nexport enum WidthCategory {\n  EXTRA_NARROW = \"extra-narrow\", // xs, sm\n  NARROW = \"narrow\", // md, lg\n  MEDIUM = \"medium\", // xl\n  WIDE = \"wide\", // 2xl, 3xl\n  EXTRA_WIDE = \"extra-wide\", // 4xl, 5xl, 6xl, 7xl\n  RESPONSIVE = \"responsive\", // auto, full\n}\n\n/**\n * Generic size classes mapping that can be used by different components\n * Each component can use the sizes that make sense for its context\n */\nexport const COMPONENT_SIZE_CLASSES = {\n  [ComponentSize.TWO_XL]: \"max-w-2xl\", // 42rem (672px)\n  [ComponentSize.THREE_XL]: \"max-w-3xl\", // 48rem (768px)\n  [ComponentSize.FOUR_XL]: \"max-w-4xl\", // 56rem (896px)\n  [ComponentSize.FIVE_XL]: \"max-w-5xl\", // 64rem (1024px)\n  [ComponentSize.SIX_XL]: \"max-w-6xl\", // 72rem (1152px)\n  [ComponentSize.SEVEN_XL]: \"max-w-7xl\", // 80rem (1280px)\n  [ComponentSize.AUTO]: \"max-w-[calc(100vw-2rem)] sm:max-w-md\", // Responsive auto\n  [ComponentSize.FULL]: \"max-w-full\", // 100%\n  [ComponentSize.LG]: \"max-w-lg\", // 32rem (512px)\n  [ComponentSize.MD]: \"max-w-md\", // 28rem (448px)\n  [ComponentSize.SM]: \"max-w-sm\", // 24rem (384px)\n  [ComponentSize.XL]: \"max-w-xl\", // 36rem (576px)\n  [ComponentSize.XS]: \"max-w-xs\", // 20rem (320px)\n} as const;\n\n/**\n * Helper function to create size-specific props for components\n */\nexport interface SizeConfig {\n  /**\n   * Custom size class that overrides the size prop\n   * Useful when you need a specific size not covered by the standard sizes\n   */\n  customSizeClass?: string;\n  size?: ComponentSize;\n}\n\n/**\n * Get the CSS class for a given component size\n * Returns undefined if the size is not valid\n */\nexport function getComponentSizeClass(size: ComponentSize): string {\n  return COMPONENT_SIZE_CLASSES[size];\n}\n\n/**\n * Get the final size class considering both size prop and customSizeClass\n */\nexport function getSizeClass(config: SizeConfig): string | undefined {\n  if (config.customSizeClass) {\n    return config.customSizeClass;\n  }\n  if (config.size) {\n    return getComponentSizeClass(config.size);\n  }\n  return undefined;\n}\n\n/**\n * Type guard to check if a string is a valid ComponentSize\n */\nexport function isComponentSize(size: string): size is ComponentSize {\n  return Object.values(ComponentSize).includes(size as ComponentSize);\n}\n"],"mappings":";;;;;;;;AAQA,IAAY,gBAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;KACD;;;;AAKD,IAAY,gBAAL;AACL;AACA;AACA;AACA;AACA;AACA;;KACD;;;;;AAMD,MAAa,yBAAyB;UACZ;UACE;UACD;UACA;UACD;UACE;WACJ;WACA;SACF;SACA;SACA;SACA;SACA;CACrB;;;;;AAkBD,SAAgB,sBAAsB,MAA6B;AACjE,QAAO,uBAAuB;;;;;AAMhC,SAAgB,aAAa,QAAwC;AACnE,KAAI,OAAO,gBACT,QAAO,OAAO;AAEhB,KAAI,OAAO,KACT,QAAO,sBAAsB,OAAO,KAAK;;;;;AAQ7C,SAAgB,gBAAgB,MAAqC;AACnE,QAAO,OAAO,OAAO,cAAc,CAAC,SAAS,KAAsB"}

package/dist/esm/hooks/index.js

@@ -1,7 +1,7 @@
-import { init_useAvatar, useAvatar } from "./useAvatar.js";
-import { init_useMenuItems, useMenuItems } from "./useMenuItems.js";
-import { init_usePluginMeta, usePluginMeta } from "./usePluginMeta.js";
-import { init_useTheme, useTheme, useThemeIdAndSetter, withTheme } from "./useTheme.js";
+import { useAvatar } from "./useAvatar.js";
+import { useMenuItems } from "./useMenuItems.js";
+import { usePluginMeta } from "./usePluginMeta.js";
+import { useTheme, useThemeIdAndSetter, withTheme } from "./useTheme.js";
 import { useAccountSubdomain } from "./useAccountSubdomain.js";
 import { useApiUrl } from "./useApiUrl.js";
 import { useAccountUrl } from "./useAccountUrl.js";
@@ -14,12 +14,4 @@ import { usePortalUrl } from "./usePortalUrl.js";
 import { useProtocolDomain } from "./useProtocolDomain.js";
 import { resetGloballyInitialized, useSdk } from "./useSdk.js";
 
-//#region src/hooks/index.ts
-init_useAvatar();
-init_useMenuItems();
-init_usePluginMeta();
-init_useTheme();
-
-//#endregion
-export { resetGloballyInitialized, useAccountSubdomain, useAccountUrl, useApiUrl, useAvatar, useFeatureFlag, useLoginUrl, useMenuItems, usePluginMeta, usePortalMeta, usePortalUrl, useProtocolDomain, useRegisterUrl, useResetPasswordUrl, useSdk, useTheme, useThemeIdAndSetter, withTheme };
-//# sourceMappingURL=index.js.map
+export { resetGloballyInitialized, useAccountSubdomain, useAccountUrl, useApiUrl, useAvatar, useFeatureFlag, useLoginUrl, useMenuItems, usePluginMeta, usePortalMeta, usePortalUrl, useProtocolDomain, useRegisterUrl, useResetPasswordUrl, useSdk, useTheme, useThemeIdAndSetter, withTheme };

package/dist/esm/hooks/useAccountSubdomain.js

@@ -1,8 +1,7 @@
-import { init_usePluginMeta, usePluginMeta } from "./usePluginMeta.js";
+import { usePluginMeta } from "./usePluginMeta.js";
 import { getAccountSubdomain } from "@lumeweb/portal-framework-core";
 
 //#region src/hooks/useAccountSubdomain.ts
-init_usePluginMeta();
 function useAccountSubdomain() {
 	return getAccountSubdomain(usePluginMeta("dashboard", "subdomain"));
 }

package/dist/esm/hooks/useAccountSubdomain.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAccountSubdomain.js","names":[],"sources":["../../../src/hooks/useAccountSubdomain.ts"],"sourcesContent":["import { getAccountSubdomain } from \"@lumeweb/portal-framework-core\";\n\nimport { usePluginMeta } from \"@/hooks/usePluginMeta\";\n\nexport function useAccountSubdomain(): string {\n  const dashboardSubdomain = usePluginMeta<string>(\"dashboard\", \"subdomain\");\n\n  return getAccountSubdomain(dashboardSubdomain);\n}\n"],"mappings":";;;;oBAEsD;AAEtD,SAAgB,sBAA8B;AAG5C,QAAO,oBAFoB,cAAsB,aAAa,YAAY,CAE5B"}
+{"version":3,"file":"useAccountSubdomain.js","names":[],"sources":["../../../src/hooks/useAccountSubdomain.ts"],"sourcesContent":["import { getAccountSubdomain } from \"@lumeweb/portal-framework-core\";\n\nimport { usePluginMeta } from \"@/hooks/usePluginMeta\";\n\nexport function useAccountSubdomain(): string {\n  const dashboardSubdomain = usePluginMeta<string>(\"dashboard\", \"subdomain\");\n\n  return getAccountSubdomain(dashboardSubdomain);\n}\n"],"mappings":";;;;AAIA,SAAgB,sBAA8B;AAG5C,QAAO,oBAFoB,cAAsB,aAAa,YAEjB,CAAC"}

package/dist/esm/hooks/useApiUrl.d.ts

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

package/dist/esm/hooks/useAvatar.js

@@ -1,25 +1,20 @@
-import { __esmMin } from "../_virtual/rolldown_runtime.js";
 import { useGetIdentity } from "@refinedev/core";
 
 //#region src/hooks/useAvatar.ts
-var useAvatar;
-var init_useAvatar = __esmMin(() => {
-	useAvatar = () => {
-		const { data: identity, isLoading } = useGetIdentity();
-		if (isLoading) return {
-			avatarUrl: "/placeholder.svg",
-			displayName: "",
-			isLoading: true
-		};
-		return {
-			avatarUrl: identity?.avatar ? `${identity.avatar}?t=${Date.now()}` : "/placeholder.svg",
-			displayName: `${identity?.firstName || ""} ${identity?.lastName || ""}`.trim(),
-			isLoading: false
-		};
+const useAvatar = () => {
+	const { data: identity, isLoading } = useGetIdentity();
+	if (isLoading) return {
+		avatarUrl: "/placeholder.svg",
+		displayName: "",
+		isLoading: true
 	};
-});
+	return {
+		avatarUrl: identity?.avatar ? `${identity.avatar}?t=${Date.now()}` : "/placeholder.svg",
+		displayName: `${identity?.firstName || ""} ${identity?.lastName || ""}`.trim(),
+		isLoading: false
+	};
+};
 
 //#endregion
-init_useAvatar();
-export { init_useAvatar, useAvatar };
+export { useAvatar };
 //# sourceMappingURL=useAvatar.js.map

package/dist/esm/hooks/useAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAvatar.js","names":[],"sources":["../../../src/hooks/useAvatar.ts"],"sourcesContent":["import type { Identity } from \"@lumeweb/portal-framework-core\";\n\nimport { useGetIdentity } from \"@refinedev/core\";\n\ninterface UseAvatarReturn {\n  avatarUrl: string;\n  displayName: string;\n  isLoading: boolean;\n}\n\nexport const useAvatar = (): UseAvatarReturn => {\n  const { data: identity, isLoading } = useGetIdentity<Identity>();\n\n  if (isLoading) {\n    return {\n      avatarUrl: \"/placeholder.svg\",\n      displayName: \"\",\n      isLoading: true,\n    };\n  }\n\n  const avatarUrl = identity?.avatar\n    ? `${identity.avatar}?t=${Date.now()}`\n    : \"/placeholder.svg\";\n  const displayName =\n    `${identity?.firstName || \"\"} ${identity?.lastName || \"\"}`.trim();\n\n  return {\n    avatarUrl,\n    displayName,\n    isLoading: false,\n  };\n};\n"],"mappings":";;;;;;CAUa,kBAAmC;EAC9C,MAAM,EAAE,MAAM,UAAU,cAAc,gBAA0B;AAEhE,MAAI,UACF,QAAO;GACL,WAAW;GACX,aAAa;GACb,WAAW;GACZ;AASH,SAAO;GACL,WAPgB,UAAU,SACxB,GAAG,SAAS,OAAO,KAAK,KAAK,KAAK,KAClC;GAMF,aAJA,GAAG,UAAU,aAAa,GAAG,GAAG,UAAU,YAAY,KAAK,MAAM;GAKjE,WAAW;GACZ"}
+{"version":3,"file":"useAvatar.js","names":[],"sources":["../../../src/hooks/useAvatar.ts"],"sourcesContent":["import type { Identity } from \"@lumeweb/portal-framework-core\";\n\nimport { useGetIdentity } from \"@refinedev/core\";\n\ninterface UseAvatarReturn {\n  avatarUrl: string;\n  displayName: string;\n  isLoading: boolean;\n}\n\nexport const useAvatar = (): UseAvatarReturn => {\n  const { data: identity, isLoading } = useGetIdentity<Identity>();\n\n  if (isLoading) {\n    return {\n      avatarUrl: \"/placeholder.svg\",\n      displayName: \"\",\n      isLoading: true,\n    };\n  }\n\n  const avatarUrl = identity?.avatar\n    ? `${identity.avatar}?t=${Date.now()}`\n    : \"/placeholder.svg\";\n  const displayName =\n    `${identity?.firstName || \"\"} ${identity?.lastName || \"\"}`.trim();\n\n  return {\n    avatarUrl,\n    displayName,\n    isLoading: false,\n  };\n};\n"],"mappings":";;;AAUA,MAAa,kBAAmC;CAC9C,MAAM,EAAE,MAAM,UAAU,cAAc,gBAA0B;AAEhE,KAAI,UACF,QAAO;EACL,WAAW;EACX,aAAa;EACb,WAAW;EACZ;AASH,QAAO;EACL,WAPgB,UAAU,SACxB,GAAG,SAAS,OAAO,KAAK,KAAK,KAAK,KAClC;EAMF,aAJA,GAAG,UAAU,aAAa,GAAG,GAAG,UAAU,YAAY,KAAK,MAIhD;EACX,WAAW;EACZ"}

package/dist/esm/hooks/useFeatureFlag.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFeatureFlag.js","names":[],"sources":["../../../src/hooks/useFeatureFlag.ts"],"sourcesContent":["import { usePortalMeta } from \"@/hooks/usePortalMeta\";\n\nexport function useFeatureFlag(featureName: string): boolean {\n  const portalMeta = usePortalMeta();\n  const flagValue = portalMeta?.feature_flags?.[featureName.toUpperCase()];\n  // Convert the value to a boolean: truthy values become true, falsy values become false\n  return !!flagValue;\n}\n"],"mappings":";;;AAEA,SAAgB,eAAe,aAA8B;AAI3D,QAAO,CAAC,CAHW,eAAe,EACJ,gBAAgB,YAAY,aAAa"}
+{"version":3,"file":"useFeatureFlag.js","names":[],"sources":["../../../src/hooks/useFeatureFlag.ts"],"sourcesContent":["import { usePortalMeta } from \"@/hooks/usePortalMeta\";\n\nexport function useFeatureFlag(featureName: string): boolean {\n  const portalMeta = usePortalMeta();\n  const flagValue = portalMeta?.feature_flags?.[featureName.toUpperCase()];\n  // Convert the value to a boolean: truthy values become true, falsy values become false\n  return !!flagValue;\n}\n"],"mappings":";;;AAEA,SAAgB,eAAe,aAA8B;AAI3D,QAAO,CAAC,CAHW,eACS,EAAE,gBAAgB,YAAY,aAAa"}

package/dist/esm/hooks/useMenuItems.d.ts

@@ -1,8 +1,10 @@
+import * as _$_lumeweb_portal_framework_core0 from "@lumeweb/portal-framework-core";
+
 //#region src/hooks/useMenuItems.d.ts
 declare function useMenuItems(): {
-  addMenuItem: (item: NavigationItem, parentKey?: string) => void;
-  getMenuItems: () => NavigationItem[];
-  menuItems: NavigationItem[];
+  addMenuItem: (item: _$_lumeweb_portal_framework_core0.NavigationItem, parentKey?: string) => void;
+  getMenuItems: () => _$_lumeweb_portal_framework_core0.NavigationItem[];
+  menuItems: _$_lumeweb_portal_framework_core0.NavigationItem[];
   removeMenuItem: (key: string) => void;
 };
 //#endregion

package/dist/esm/hooks/useMenuItems.js

@@ -1,5 +1,4 @@
-import { __esmMin } from "../_virtual/rolldown_runtime.js";
-import { init_appStore, useAppStore } from "../store/appStore.js";
+import { useAppStore } from "../store/appStore.js";
 
 //#region src/hooks/useMenuItems.ts
 function useMenuItems() {
@@ -11,11 +10,7 @@ function useMenuItems() {
 		removeMenuItem: useAppStore((state) => state.removeMenuItem)
 	};
 }
-var init_useMenuItems = __esmMin(() => {
-	init_appStore();
-});
 
 //#endregion
-init_useMenuItems();
-export { init_useMenuItems, useMenuItems };
+export { useMenuItems };
 //# sourceMappingURL=useMenuItems.js.map

package/dist/esm/hooks/useMenuItems.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuItems.js","names":[],"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,YAAY,aAAa,UAAU,MAAM,UAAU;AAIzD,QAAO;EACL,aAJkB,aAAa,UAAU,MAAM,YAAY;EAK3D,oBAAoB;EACpB;EACA,gBANqB,aAAa,UAAU,MAAM,eAAe;EAOlE;;;gBAZ4C"}
+{"version":3,"file":"useMenuItems.js","names":[],"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,YAAY,aAAa,UAAU,MAAM,UAAU;AAIzD,QAAO;EACL,aAJkB,aAAa,UAAU,MAAM,YAIpC;EACX,oBAAoB;EACpB;EACA,gBANqB,aAAa,UAAU,MAAM,eAMpC;EACf"}

package/dist/esm/hooks/usePluginMeta.js

@@ -1,16 +1,11 @@
-import { __esmMin } from "../_virtual/rolldown_runtime.js";
-import { init_portalStore, usePortalStore } from "../store/portalStore.js";
+import { usePortalStore } from "../store/portalStore.js";
 import { getPluginMeta } from "@lumeweb/portal-framework-core";
 
 //#region src/hooks/usePluginMeta.ts
 function usePluginMeta(pluginName, key) {
 	return getPluginMeta(usePortalStore((state) => state.meta), pluginName, key);
 }
-var init_usePluginMeta = __esmMin(() => {
-	init_portalStore();
-});
 
 //#endregion
-init_usePluginMeta();
-export { init_usePluginMeta, usePluginMeta };
+export { usePluginMeta };
 //# sourceMappingURL=usePluginMeta.js.map

package/dist/esm/hooks/usePluginMeta.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePluginMeta.js","names":[],"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,QAAO,cADM,gBAAgB,UAAU,MAAM,KAAK,EACpB,YAAY,IAAI;;;mBAPM"}
+{"version":3,"file":"usePluginMeta.js","names":[],"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,QAAO,cADM,gBAAgB,UAAU,MAAM,KACjB,EAAE,YAAY,IAAI"}

package/dist/esm/hooks/usePortalMeta.d.ts

@@ -1,5 +1,7 @@
+import * as _$_lumeweb_portal_framework_core0 from "@lumeweb/portal-framework-core";
+
 //#region src/hooks/usePortalMeta.d.ts
-declare function usePortalMeta(): any;
+declare function usePortalMeta(): _$_lumeweb_portal_framework_core0.PortalMeta | undefined;
 //#endregion
 export { usePortalMeta };
 //# sourceMappingURL=usePortalMeta.d.ts.map

package/dist/esm/hooks/usePortalMeta.js

@@ -1,7 +1,6 @@
-import { init_portalStore, usePortalStore } from "../store/portalStore.js";
+import { usePortalStore } from "../store/portalStore.js";
 
 //#region src/hooks/usePortalMeta.ts
-init_portalStore();
 function usePortalMeta() {
 	return usePortalStore((state) => state.meta);
 }

package/dist/esm/hooks/usePortalMeta.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePortalMeta.js","names":[],"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":";;;kBAAqD;AAErD,SAAgB,gBAAgB;AAG9B,QAAO,gBAAgB,UAAU,MAAM,KAAK"}
+{"version":3,"file":"usePortalMeta.js","names":[],"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":";;;AAEA,SAAgB,gBAAgB;AAG9B,QAAO,gBAAgB,UAAU,MAAM,KAAK"}

package/dist/esm/hooks/usePortalUrl.js

@@ -1,7 +1,6 @@
-import { init_portalStore, usePortalStore } from "../store/portalStore.js";
+import { usePortalStore } from "../store/portalStore.js";
 
 //#region src/hooks/usePortalUrl.ts
-init_portalStore();
 function usePortalUrl() {
 	const portalUrl = usePortalStore((state) => state.portalUrl);
 	return isValidUrl(portalUrl) ? portalUrl : `https://${portalUrl}`;

package/dist/esm/hooks/usePortalUrl.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePortalUrl.js","names":[],"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":";;;kBAAqD;AAErD,SAAgB,eAAuB;CACrC,MAAM,YAAY,gBAAgB,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"}
+{"version":3,"file":"usePortalUrl.js","names":[],"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":";;;AAEA,SAAgB,eAAuB;CACrC,MAAM,YAAY,gBAAgB,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/esm/hooks/useProtocolDomain.js.map

@@ -1 +1 @@
-{"version":3,"file":"useProtocolDomain.js","names":[],"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,CADI,eAAe,EACP,UAAU,oBAAoB,CAAC;AAE1D,QAAO,kBAAkB,OAAO,EAC9B,cAAc,IAAI,+BAA+B,QAClD,CAAC"}
+{"version":3,"file":"useProtocolDomain.js","names":[],"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,CADI,eACM,EAAE,UAAU,oBAAoB,CAAC;AAE1D,QAAO,kBAAkB,OAAO,EAC9B,cAAc,IAAI,+BAA+B,QAClD,CAAC"}

package/dist/esm/hooks/useSdk.js

@@ -1,10 +1,9 @@
-import { init_portalStore, usePortalActions, usePortalStore } from "../store/portalStore.js";
+import { usePortalActions, usePortalStore } from "../store/portalStore.js";
 import { useApiUrl } from "./useApiUrl.js";
 import { useEffect, useRef } from "react";
 import { Sdk } from "@lumeweb/portal-sdk";
 
 //#region src/hooks/useSdk.ts
-init_portalStore();
 let isGloballyInitialized = false;
 const resetGloballyInitialized = () => {
 	isGloballyInitialized = false;

package/dist/esm/hooks/useSdk.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSdk.js","names":[],"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":";;;;;;kBAIuE;AAGvE,IAAI,wBAAwB;AAG5B,MAAa,iCAAiC;AAC5C,yBAAwB;;AAG1B,SAAgB,SAAS;CAEvB,MAAM,SAAS,WAAW;CAC1B,MAAM,EAAE,QAAQ,gBAAgB,WAAW,EACzC,KAAK,MAAM,KACZ,EAAE;CACH,MAAM,EAAE,WAAW,kBAAkB;CACrC,MAAM,0BAA0B,OAAO,MAAM;AAE7C,iBAAgB;AAEd,MAAI,UAAU,CAAC,yBAAyB,CAAC,wBAAwB,SAAS;AACxE,2BAAwB,UAAU;GAClC,MAAM,sBAAsB;AAC1B,QAAI,CAAC,uBAAuB;AAC1B,6BAAwB;AAGxB,YADe,IAAI,IAAI,OAAO,CAChB;;;AAIlB,kBAAe;;IAEhB,CAAC,QAAQ,OAAO,CAAC;AAEpB,QAAO"}
+{"version":3,"file":"useSdk.js","names":[],"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":";;;;;;AAOA,IAAI,wBAAwB;AAG5B,MAAa,iCAAiC;AAC5C,yBAAwB;;AAG1B,SAAgB,SAAS;CAEvB,MAAM,SAAS,WAAW;CAC1B,MAAM,EAAE,QAAQ,gBAAgB,WAAW,EACzC,KAAK,MAAM,KACZ,EAAE;CACH,MAAM,EAAE,WAAW,kBAAkB;CACrC,MAAM,0BAA0B,OAAO,MAAM;AAE7C,iBAAgB;AAEd,MAAI,UAAU,CAAC,yBAAyB,CAAC,wBAAwB,SAAS;AACxE,2BAAwB,UAAU;GAClC,MAAM,sBAAsB;AAC1B,QAAI,CAAC,uBAAuB;AAC1B,6BAAwB;AAGxB,YAAO,IADY,IAAI,OACV,CAAC;;;AAIlB,kBAAe;;IAEhB,CAAC,QAAQ,OAAO,CAAC;AAEpB,QAAO"}

package/dist/esm/hooks/useTheme.d.ts

@@ -2,7 +2,6 @@ import { Theme } from "../types/theme.js";
 import React from "react";
 
 //#region src/hooks/useTheme.d.ts
-
 /**
  * Higher-Order Component (HoC) for managing theme application at the root level.
  *

package/dist/esm/hooks/useTheme.js

@@ -1,59 +1,79 @@
-import { __esmMin } from "../_virtual/rolldown_runtime.js";
-import { init_usePluginMeta, usePluginMeta } from "./usePluginMeta.js";
-import { init_uiStore, useUIStore } from "../store/uiStore.js";
-import { applyThemeStyles, getThemeById, init_theme } from "../utils/theme.js";
+import { usePluginMeta } from "./usePluginMeta.js";
+import { useUIStore } from "../store/uiStore.js";
+import { applyThemeStyles, getThemeById } from "../utils/theme.js";
 import React, { useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/hooks/useTheme.tsx
-var useThemeIdAndSetter, useTheme, withTheme;
-var init_useTheme = __esmMin(() => {
-	init_uiStore();
-	init_theme();
-	init_usePluginMeta();
-	useThemeIdAndSetter = () => {
-		const theme = useUIStore((state) => state.theme);
-		return {
-			setTheme: useUIStore((state) => state.setTheme),
-			theme
-		};
+/**
+* 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.
+*/
+const useThemeIdAndSetter = () => {
+	const theme = useUIStore((state) => state.theme);
+	return {
+		setTheme: useUIStore((state) => state.setTheme),
+		theme
 	};
-	useTheme = () => {
+};
+/**
+* Hook to get the full Theme object based on the selected theme ID and available themes from meta.
+*/
+const useTheme = () => {
+	const { theme: selectedThemeId } = useThemeIdAndSetter();
+	const themes = usePluginMeta("dashboard", "themes");
+	if (selectedThemeId && Array.isArray(themes) && themes.length > 0) {
+		const persistedTheme = getThemeById(themes, selectedThemeId);
+		if (persistedTheme) return persistedTheme;
+	}
+	if (!themes || themes.length === 0) return;
+	let theme = getThemeById(themes, selectedThemeId);
+	if (!theme) theme = themes.find((t) => t.default);
+	if (!theme && themes.length > 0) theme = themes[0];
+	return theme;
+};
+const withTheme = (Component) => {
+	return function WithTheme(props) {
 		const { theme: selectedThemeId } = useThemeIdAndSetter();
 		const themes = usePluginMeta("dashboard", "themes");
-		if (selectedThemeId && Array.isArray(themes) && themes.length > 0) {
-			const persistedTheme = getThemeById(themes, selectedThemeId);
-			if (persistedTheme) return persistedTheme;
-		}
-		if (!themes || themes.length === 0) return;
-		let 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 = usePluginMeta("dashboard", "themes");
-			useEffect(() => {
-				if (!themes || !Array.isArray(themes) || themes.length === 0) return;
-				if (selectedThemeId) {
-					const persistedTheme = getThemeById(themes, selectedThemeId);
-					if (persistedTheme) {
-						applyThemeStyles(persistedTheme);
-						return;
-					}
+		useEffect(() => {
+			if (!themes || !Array.isArray(themes) || themes.length === 0) return;
+			if (selectedThemeId) {
+				const persistedTheme = getThemeById(themes, selectedThemeId);
+				if (persistedTheme) {
+					applyThemeStyles(persistedTheme);
+					return;
 				}
-				const themeToApply = getThemeById(themes, selectedThemeId) || themes.find((t) => t.default) || themes[0];
-				if (themeToApply) applyThemeStyles(themeToApply);
-				else console.warn("No theme found to apply.");
-			}, [selectedThemeId, themes]);
-			return /* @__PURE__ */ jsx(Component, { ...props });
-		};
+			}
+			const themeToApply = getThemeById(themes, selectedThemeId) || themes.find((t) => t.default) || themes[0];
+			if (themeToApply) applyThemeStyles(themeToApply);
+			else console.warn("No theme found to apply.");
+		}, [selectedThemeId, themes]);
+		return /* @__PURE__ */ jsx(Component, { ...props });
 	};
-});
+};
 
 //#endregion
-init_useTheme();
-export { init_useTheme, useTheme, useThemeIdAndSetter, withTheme };
+export { useTheme, useThemeIdAndSetter, withTheme };
 //# sourceMappingURL=useTheme.js.map

package/dist/esm/hooks/useTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTheme.js","names":[],"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":";;;;;;;;;;eAE6C;aACA;qBAMG;CA2BnC,4BAA4B;EACvC,MAAM,QAAQ,YAAY,UAAU,MAAM,MAAM;AAGhD,SAAO;GACL,UAHe,YAAY,UAAU,MAAM,SAAS;GAIpD;GACD;;CAMU,iBAAoC;EAC/C,MAAM,EAAE,OAAO,oBAAoB,qBAAqB;EACxD,MAAM,SAAS,cAAuB,aAAa,SAAS;AAG5D,MAAI,mBAAmB,MAAM,QAAQ,OAAO,IAAI,OAAO,SAAS,GAAG;GACjE,MAAM,iBAAiB,aAAa,QAAQ,gBAAgB;AAC5D,OAAI,eACF,QAAO;;AAKX,MAAI,CAAC,UAAU,OAAO,WAAW,EAC/B;EAGF,IAAI,QAAQ,aAAa,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,SAAS,cAAuB,aAAa,SAAS;AAE5D,mBAAgB;AACd,QAAI,CAAC,UAAU,CAAC,MAAM,QAAQ,OAAO,IAAI,OAAO,WAAW,EACzD;AAIF,QAAI,iBAAiB;KACnB,MAAM,iBAAiB,aAAa,QAAQ,gBAAgB;AAC5D,SAAI,gBAAgB;AAClB,uBAAiB,eAAe;AAChC;;;IAKJ,MAAM,eACJ,aAAa,QAAQ,gBAAgB,IACrC,OAAO,MAAM,MAAM,EAAE,QAAQ,IAC7B,OAAO;AAET,QAAI,aACF,kBAAiB,aAAa;QAE9B,SAAQ,KAAK,2BAA2B;MAEzC,CAAC,iBAAiB,OAAO,CAAC;AAE7B,UAAO,oBAAC,aAAU,GAAI,QAAS"}
+{"version":3,"file":"useTheme.js","names":[],"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAa,4BAA4B;CACvC,MAAM,QAAQ,YAAY,UAAU,MAAM,MAAM;AAGhD,QAAO;EACL,UAHe,YAAY,UAAU,MAAM,SAGnC;EACR;EACD;;;;;AAMH,MAAa,iBAAoC;CAC/C,MAAM,EAAE,OAAO,oBAAoB,qBAAqB;CACxD,MAAM,SAAS,cAAuB,aAAa,SAAS;AAG5D,KAAI,mBAAmB,MAAM,QAAQ,OAAO,IAAI,OAAO,SAAS,GAAG;EACjE,MAAM,iBAAiB,aAAa,QAAQ,gBAAgB;AAC5D,MAAI,eACF,QAAO;;AAKX,KAAI,CAAC,UAAU,OAAO,WAAW,EAC/B;CAGF,IAAI,QAAQ,aAAa,QAAQ,gBAAgB;AAEjD,KAAI,CAAC,MACH,SAAQ,OAAO,MAAM,MAAM,EAAE,QAAQ;AAGvC,KAAI,CAAC,SAAS,OAAO,SAAS,EAC5B,SAAQ,OAAO;AAGjB,QAAO;;AAGT,MAAa,aACX,cACG;AACH,QAAO,SAAS,UAAU,OAAU;EAClC,MAAM,EAAE,OAAO,oBAAoB,qBAAqB;EACxD,MAAM,SAAS,cAAuB,aAAa,SAAS;AAE5D,kBAAgB;AACd,OAAI,CAAC,UAAU,CAAC,MAAM,QAAQ,OAAO,IAAI,OAAO,WAAW,EACzD;AAIF,OAAI,iBAAiB;IACnB,MAAM,iBAAiB,aAAa,QAAQ,gBAAgB;AAC5D,QAAI,gBAAgB;AAClB,sBAAiB,eAAe;AAChC;;;GAKJ,MAAM,eACJ,aAAa,QAAQ,gBAAgB,IACrC,OAAO,MAAM,MAAM,EAAE,QAAQ,IAC7B,OAAO;AAET,OAAI,aACF,kBAAiB,aAAa;OAE9B,SAAQ,KAAK,2BAA2B;KAEzC,CAAC,iBAAiB,OAAO,CAAC;AAE7B,SAAO,oBAAC,WAAD,EAAW,GAAI,OAAS"}