@plitzi/sdk-elements 0.32.1 → 0.32.2

package/dist/elements/internal/LayoutContainer/index.d.ts

@@ -1,5 +1,5 @@
 declare const LayoutContainer: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./LayoutContainer').LayoutContainerProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./LayoutContainer').LayoutContainerProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/internal/Loading/Loading.d.ts

@@ -3,9 +3,9 @@ export type LoadingProps = {
     ref?: RefObject<HTMLElement>;
     className?: string;
 };
-declare const Loading: ({ ref, className }: LoadingProps) => import("react/jsx-runtime").JSX.Element;
+declare const Loading: ({ ref, className }: LoadingProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<LoadingProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<LoadingProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/internal/Loading/Loading.mjs

@@ -1,15 +1,16 @@
-import e from "../../../Element/RootElement.mjs";
-import t from "../../../Element/hocs/withElement.mjs";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import i from "clsx";
-import a from "@plitzi/sdk-shared/elements/hooks/useElement";
-var o = t(({ ref: t, className: o = "" }) => {
-	let { definition: { label: s } } = a();
-	return /* @__PURE__ */ n(e, {
-		ref: t,
-		className: i("plitzi-component__loading", o),
-		children: /* @__PURE__ */ r("span", { children: [/* @__PURE__ */ n("b", { children: s }), " Loading..."] })
+import e from "../../../Element/hooks/useElement.mjs";
+import { RootElement as t } from "../../../Element/RootElement.mjs";
+import n from "../../../Element/hocs/withElement.mjs";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import a from "clsx";
+//#region src/elements/internal/Loading/Loading.tsx
+var o = ({ ref: n, className: o = "" }) => {
+	let { definition: { label: s } } = e();
+	return /* @__PURE__ */ r(t, {
+		ref: n,
+		className: a("plitzi-component__loading", o),
+		children: /* @__PURE__ */ i("span", { children: [/* @__PURE__ */ r("b", { children: s }), " Loading..."] })
 	});
-});
+}, s = n(o);
 //#endregion
-export { o as default };
+export { o as Loading, s as default };

package/dist/elements/internal/Loading/index.d.ts

@@ -1,5 +1,5 @@
 declare const Loading: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Loading').LoadingProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Loading').LoadingProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/internal/NotFound/NotFound.d.ts

@@ -3,9 +3,9 @@ export type NotFoundProps = {
     ref?: RefObject<HTMLElement | null>;
     className?: string;
 };
-declare const NotFound: ({ ref, className }: NotFoundProps) => import("react/jsx-runtime").JSX.Element | undefined;
+declare const NotFound: ({ ref, className }: NotFoundProps) => import("react").JSX.Element | undefined;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<NotFoundProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<NotFoundProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/internal/NotFound/NotFound.mjs

@@ -1,20 +1,21 @@
-import e from "../../../Element/RootElement.mjs";
-import t from "../../../Element/hocs/withElement.mjs";
-import n from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
-import o from "clsx";
-import s from "@plitzi/sdk-shared/elements/hooks/useElement";
-var c = t(({ ref: t, className: c = "" }) => {
-	let { definition: { label: l } } = s(), { settings: { isHydrating: u, previewMode: d } } = n();
-	if (!(typeof window > "u" || d || u)) return /* @__PURE__ */ i(e, {
-		ref: t,
-		className: o("plitzi-component__not-found", c),
-		children: /* @__PURE__ */ a("span", { children: [l && /* @__PURE__ */ a(r, { children: [
+import e from "../../../Element/hooks/useElement.mjs";
+import { RootElement as t } from "../../../Element/RootElement.mjs";
+import n from "../../../Element/hocs/withElement.mjs";
+import r from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "clsx";
+//#region src/elements/internal/NotFound/NotFound.tsx
+var c = ({ ref: n, className: c = "" }) => {
+	let { definition: { label: l } } = e(), { settings: { isHydrating: u, previewMode: d } } = r();
+	if (!(typeof window > "u" || d || u)) return /* @__PURE__ */ a(t, {
+		ref: n,
+		className: s("plitzi-component__not-found", c),
+		children: /* @__PURE__ */ o("span", { children: [l && /* @__PURE__ */ o(i, { children: [
 			"Component ",
-			/* @__PURE__ */ i("b", { children: l }),
+			/* @__PURE__ */ a("b", { children: l }),
 			" Not Found"
 		] }), !l && "Component Not Found"] })
 	});
-});
+}, l = n(c);
 //#endregion
-export { c as default };
+export { c as NotFound, l as default };

package/dist/elements/internal/NotFound/index.d.ts

@@ -1,5 +1,5 @@
 declare const NotFound: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./NotFound').NotFoundProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./NotFound').NotFoundProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/internal/Page/Page.d.ts

@@ -9,9 +9,9 @@ export type PageProps = {
     layoutContainer?: string;
     children?: ReactNode;
 };
-declare const Page: ({ ref, seoEnabled, seoPageTitle, seoPageDescription, className, layout, layoutContainer, children }: PageProps) => import("react/jsx-runtime").JSX.Element;
+declare const Page: ({ ref, seoEnabled, seoPageTitle, seoPageDescription, className, layout, layoutContainer, children }: PageProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<PageProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<PageProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/internal/Page/Page.mjs

@@ -1,13 +1,14 @@
-import e from "../../../Element/RootElement.mjs";
-import t from "../LayoutContainer/index.mjs";
-import n from "../../../Element/hocs/withElement.mjs";
-import { use as r, useEffect as i, useMemo as a } from "react";
-import o from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import l from "clsx";
-import u from "@plitzi/sdk-shared/elements/hooks/useElement";
-var d = n(({ ref: n, seoEnabled: d = !1, seoPageTitle: f = "Title", seoPageDescription: p = "Description", className: m = "", layout: h = "", layoutContainer: g = "", children: _ }) => {
-	let { id: v } = u(), { settings: { previewMode: y }, contexts: { NavigationContext: b, InteractionsContext: x } } = o(), { interactionsManager: S } = r(x), { Helmet: C, routeParams: w, queryParams: T } = r(b), E = a(() => ({
+import e from "../../../Element/hooks/useElement.mjs";
+import { RootElement as t } from "../../../Element/RootElement.mjs";
+import n from "../LayoutContainer/index.mjs";
+import r from "../../../Element/hocs/withElement.mjs";
+import { use as i, useEffect as a, useMemo as o } from "react";
+import s from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import u from "clsx";
+//#region src/elements/internal/Page/Page.tsx
+var d = ({ ref: r, seoEnabled: d = !1, seoPageTitle: f = "Title", seoPageDescription: p = "Description", className: m = "", layout: h = "", layoutContainer: g = "", children: _ }) => {
+	let { id: v } = e(), { settings: { previewMode: y }, contexts: { NavigationContext: b, InteractionsContext: x } } = s(), { interactionsManager: S } = i(x), { Helmet: C, routeParams: w, queryParams: T } = i(b), E = o(() => ({
 		id: h,
 		rootId: v,
 		plitziElementLayout: {
@@ -22,7 +23,7 @@ var d = n(({ ref: n, seoEnabled: d = !1, seoPageTitle: f = "Title", seoPageDescr
 		h,
 		v,
 		_
-	]), D = a(() => ({ onPageLoad: {
+	]), D = o(() => ({ onPageLoad: {
 		action: "onPageLoad",
 		title: "On Page Load",
 		type: "trigger",
@@ -33,7 +34,7 @@ var d = n(({ ref: n, seoEnabled: d = !1, seoPageTitle: f = "Title", seoPageDescr
 			queryParams: ""
 		}
 	} }), []);
-	return i(() => {
+	return a(() => {
 		S.interactionTrigger(v, "onPageLoad", {
 			pageId: v,
 			routeParams: w,
@@ -44,19 +45,19 @@ var d = n(({ ref: n, seoEnabled: d = !1, seoPageTitle: f = "Title", seoPageDescr
 		S,
 		T,
 		w
-	]), /* @__PURE__ */ c(e, {
-		ref: n,
-		className: l("plitzi-component__page", m),
+	]), /* @__PURE__ */ l(t, {
+		ref: r,
+		className: u("plitzi-component__page", m),
 		interactionTriggers: D,
 		children: [
-			d && y && C && /* @__PURE__ */ c(C, { children: [!!f && /* @__PURE__ */ s("title", { children: f }), !!p && /* @__PURE__ */ s("meta", {
+			d && y && C && /* @__PURE__ */ l(C, { children: [!!f && /* @__PURE__ */ c("title", { children: f }), !!p && /* @__PURE__ */ c("meta", {
 				name: "description",
 				content: p
 			})] }),
-			h && /* @__PURE__ */ s(t, { internalProps: E }),
+			h && /* @__PURE__ */ c(n, { internalProps: E }),
 			!h && _
 		]
 	});
-});
+}, f = r(d);
 //#endregion
-export { d as default };
+export { d as Page, f as default };

package/dist/elements/internal/Page/Settings.d.ts

@@ -14,5 +14,5 @@ type SettingsProps = {
     unauthorizedPageRedirect?: string;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ id, seoEnabled, enabled, name, folder, seoPageTitle, seoPageDescription, slug, layout, layoutContainer, accessLevel, unauthorizedBehaviour, unauthorizedPageRedirect, onUpdate }: SettingsProps) => import("react/jsx-runtime").JSX.Element;
+declare const Settings: ({ id, seoEnabled, enabled, name, folder, seoPageTitle, seoPageDescription, slug, layout, layoutContainer, accessLevel, unauthorizedBehaviour, unauthorizedPageRedirect, onUpdate }: SettingsProps) => import("react").JSX.Element;
 export default Settings;

package/dist/elements/internal/Page/Settings.mjs

@@ -1,6 +1,6 @@
 import { useCallback as e, useMemo as t } from "react";
-import { get as n, pick as r } from "@plitzi/plitzi-ui/helpers";
-import { createStoreHook as i } from "@plitzi/nexus/createStore";
+import { useCommonStore as n } from "@plitzi/sdk-shared/store";
+import { get as r, pick as i } from "@plitzi/plitzi-ui/helpers";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 import { getPageFullPath as c } from "@plitzi/sdk-navigation/NavigationHelper";
 import l from "@plitzi/plitzi-ui/Alert";
@@ -11,15 +11,15 @@ import p from "@plitzi/plitzi-ui/Select";
 import m from "@plitzi/plitzi-ui/Select2";
 //#region src/elements/internal/Page/Settings.tsx
 var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder: y = "", seoPageTitle: b = "Title", seoPageDescription: x = "Description", slug: S = "", layout: C = "", layoutContainer: w = "", accessLevel: T = "", unauthorizedBehaviour: E = "", unauthorizedPageRedirect: D = "", onUpdate: O }) => {
-	let { useStore: k } = i(), [[A, j, M]] = k([
+	let [[k, A, j]] = n([
 		"schema.flat",
 		"schema.pages",
 		"schema.pageFolders"
-	]), N = t(() => Object.values(A).filter((e) => n(e, "definition.type", "") === "layoutContainer"), [A]), P = t(() => C ? Object.values(A).filter((e) => n(e, "definition.type", "") === "container" && n(e, "definition.rootId", "") === C) : [], [A, C]), F = t(() => Object.values(r(A, j.filter((e) => e !== h))), [
-		A,
+	]), M = t(() => Object.values(k).filter((e) => r(e, "definition.type", "") === "layoutContainer"), [k]), N = t(() => C ? Object.values(k).filter((e) => r(e, "definition.type", "") === "container" && r(e, "definition.rootId", "") === C) : [], [k, C]), P = t(() => Object.values(i(k, A.filter((e) => e !== h))), [
+		k,
 		h,
-		j
-	]), I = e((e) => (t) => O?.(e, t), [O]), L = e((e) => {
+		A
+	]), F = e((e) => (t) => O?.(e, t), [O]), I = e((e) => {
 		O?.("name", e);
 		let t = v.replaceAll(" ", "-").toLowerCase().replaceAll(/([^a-z0-9]+)/gi, "");
 		(!S || S === t) && O?.("slug", e.replaceAll(" ", "-").toLowerCase().replaceAll(/([^a-z0-9-]+)/gi, ""));
@@ -27,24 +27,24 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 		O,
 		S,
 		v
-	]), R = e((e) => {
+	]), L = e((e) => {
 		if (/^[a-zA-Z0-9:*/_-]+$/gim.test(e) || !e) {
 			let t = e.replaceAll("//", "/");
 			O?.("slug", t);
 		}
-	}, [O]), z = e((e) => {
+	}, [O]), R = e((e) => {
 		O?.("layout", e), O?.("layoutContainer", "");
-	}, [O]), B = e((e) => {
+	}, [O]), z = e((e) => {
 		O?.("accessLevel", e), O?.("unauthorizedBehaviour", ""), O?.("unauthorizedPageRedirect", "");
-	}, [O]), V = e((e) => O?.("seoEnabled", e.target.checked), [O]), H = e((e) => O?.("enabled", e.target.checked), [O]), U = e((e) => O?.("folder", e?.value ?? ""), [O]), W = t(() => [{
+	}, [O]), B = e((e) => O?.("seoEnabled", e.target.checked), [O]), V = e((e) => O?.("enabled", e.target.checked), [O]), H = e((e) => O?.("folder", e?.value ?? ""), [O]), U = t(() => [{
 		value: "",
 		label: "None"
-	}, ...M.map(({ id: e, name: t }) => ({
+	}, ...j.map(({ id: e, name: t }) => ({
 		value: e,
 		label: t
-	}))], [M]), G = t(() => c(A, M, h, !0), [
-		A,
-		M,
+	}))], [j]), W = t(() => c(k, j, h, !0), [
+		k,
+		j,
 		h
 	]);
 	return /* @__PURE__ */ s("div", {
@@ -62,13 +62,13 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 			/* @__PURE__ */ o(u, {
 				label: " Page Enabled",
 				checked: _,
-				onChange: H,
+				onChange: V,
 				size: "xs"
 			}),
 			/* @__PURE__ */ o(d, {
 				value: v,
 				label: "Page Name",
-				onChange: L,
+				onChange: I,
 				size: "xs"
 			}),
 			/* @__PURE__ */ o(l, {
@@ -84,34 +84,34 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 				className: "flex flex-col",
 				children: [/* @__PURE__ */ o(d, {
 					value: S,
-					onChange: R,
+					onChange: L,
 					label: "Slug / Path",
 					className: { inputContainer: "rounded-none rounded-tl rounded-tr" },
 					size: "xs"
 				}), /* @__PURE__ */ s("div", {
 					className: "truncate rounded-b border-x border-b border-gray-200 px-1 py-0.5 text-xs",
-					title: G,
+					title: W,
 					children: ["Full Path: ", /* @__PURE__ */ o("span", {
 						className: "font-bold",
-						children: G
+						children: W
 					})]
 				})]
 			}),
 			/* @__PURE__ */ o(m, {
 				label: "Folder",
 				value: y,
-				options: W,
+				options: U,
 				placeholder: "None",
-				onChange: U,
+				onChange: H,
 				size: "xs"
 			}),
 			/* @__PURE__ */ o(p, {
 				value: C,
 				placeholder: "None",
 				label: "Layout",
-				onChange: z,
+				onChange: R,
 				size: "xs",
-				children: N.map(({ id: e, definition: { label: t } }) => /* @__PURE__ */ o("option", {
+				children: M.map(({ id: e, definition: { label: t } }) => /* @__PURE__ */ o("option", {
 					value: e,
 					children: t
 				}, e))
@@ -120,9 +120,9 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 				value: w,
 				placeholder: "None",
 				label: "Layout Container Body",
-				onChange: I("layoutContainer"),
+				onChange: F("layoutContainer"),
 				size: "xs",
-				children: P.map(({ id: e, definition: { label: t } }) => /* @__PURE__ */ o("option", {
+				children: N.map(({ id: e, definition: { label: t } }) => /* @__PURE__ */ o("option", {
 					value: e,
 					children: t
 				}, e))
@@ -130,7 +130,7 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 			/* @__PURE__ */ s(p, {
 				value: T,
 				label: "Restrict Access",
-				onChange: B,
+				onChange: z,
 				placeholder: "None",
 				size: "xs",
 				children: [/* @__PURE__ */ o("option", {
@@ -162,7 +162,7 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 			T !== "" && /* @__PURE__ */ o(p, {
 				label: "Unauthorized Behaviour",
 				value: E,
-				onChange: I("unauthorizedBehaviour"),
+				onChange: F("unauthorizedBehaviour"),
 				placeholder: "None",
 				size: "xs",
 				children: /* @__PURE__ */ o("option", {
@@ -173,31 +173,31 @@ var h = ({ id: h = "", seoEnabled: g = !1, enabled: _ = !0, name: v = "", folder
 			E === "redirect" && /* @__PURE__ */ o(p, {
 				value: D,
 				label: "Redirect Page",
-				onChange: I("unauthorizedPageRedirect"),
+				onChange: F("unauthorizedPageRedirect"),
 				placeholder: "None",
 				size: "xs",
-				children: F.map((e) => /* @__PURE__ */ o("option", {
+				children: P.map((e) => /* @__PURE__ */ o("option", {
 					value: e.id,
-					children: n(e, "attributes.name")
+					children: r(e, "attributes.name")
 				}, e.id))
 			}),
 			/* @__PURE__ */ o(u, {
 				label: " SEO Enabled",
 				checked: g,
-				onChange: V,
+				onChange: B,
 				size: "xs"
 			}),
 			g && /* @__PURE__ */ s(a, { children: [
 				/* @__PURE__ */ o(d, {
 					value: b,
 					label: "SEO Title",
-					onChange: I("seoPageTitle"),
+					onChange: F("seoPageTitle"),
 					size: "xs"
 				}),
 				/* @__PURE__ */ o(f, {
 					label: "SEO Description",
 					value: x,
-					onChange: I("seoPageDescription"),
+					onChange: F("seoPageDescription"),
 					rows: 3,
 					size: "xs"
 				}),

package/dist/elements/internal/Page/index.d.ts

@@ -1,5 +1,5 @@
 declare const Page: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Page').PageProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Page').PageProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/media/FontAwesome/FontAwesome.d.ts

@@ -6,9 +6,9 @@ export type FontAwesomeProps = {
     size?: string;
     iconAnimation?: string;
 };
-declare const FontAwesome: ({ ref, className, icon, size, iconAnimation }: FontAwesomeProps) => import("react/jsx-runtime").JSX.Element;
+declare const FontAwesome: ({ ref, className, icon, size, iconAnimation }: FontAwesomeProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<FontAwesomeProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<FontAwesomeProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/FontAwesome/FontAwesome.mjs

@@ -1,9 +1,10 @@
-import e from "../../../Element/RootElement.mjs";
+import { RootElement as e } from "../../../Element/RootElement.mjs";
 import t from "../../../Element/hocs/withElement.mjs";
 import n from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsx as r } from "react/jsx-runtime";
 import i from "clsx";
-var a = t(({ ref: t, className: a = "", icon: o = "fas fa-flag", size: s = "fa-1x", iconAnimation: c = "" }) => {
+//#region src/elements/media/FontAwesome/FontAwesome.tsx
+var a = ({ ref: t, className: a = "", icon: o = "fas fa-flag", size: s = "fa-1x", iconAnimation: c = "" }) => {
 	let { settings: { previewMode: l } } = n();
 	return l ? /* @__PURE__ */ r(e, {
 		ref: t,
@@ -14,6 +15,6 @@ var a = t(({ ref: t, className: a = "", icon: o = "fas fa-flag", size: s = "fa-1
 		className: i("plitzi-component__fontawesome fontawesome--edit-mode", a),
 		children: /* @__PURE__ */ r("i", { className: i(o, s, c) })
 	});
-});
+}, o = t(a);
 //#endregion
-export { a as default };
+export { a as FontAwesome, o as default };

package/dist/elements/media/FontAwesome/Settings.d.ts

@@ -4,5 +4,5 @@ type SettingsProps = {
     iconAnimation?: string;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ icon, size, iconAnimation, onUpdate }: SettingsProps) => import("react/jsx-runtime").JSX.Element;
+declare const Settings: ({ icon, size, iconAnimation, onUpdate }: SettingsProps) => import("react").JSX.Element;
 export default Settings;

package/dist/elements/media/FontAwesome/Settings.mjs

@@ -39,7 +39,9 @@ var l = ({ icon: l = "", size: u = "fa-1x", iconAnimation: d = "", onUpdate: f }
 		h,
 		x
 	]), C = async () => {
-		v(!0), m(await (await fetch("https://raw.githubusercontent.com/FortAwesome/Font-Awesome/6.x/metadata/icons.json")).json()), v(!1);
+		v(!0);
+		let e = await fetch("https://raw.githubusercontent.com/FortAwesome/Font-Awesome/6.x/metadata/icons.json");
+		m(await e.json()), v(!1);
 	};
 	t(() => {
 		C();

package/dist/elements/media/FontAwesome/index.d.ts

@@ -1,5 +1,5 @@
 declare const FontAwesome: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./FontAwesome').FontAwesomeProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./FontAwesome').FontAwesomeProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/media/Image/Image.d.ts

@@ -7,9 +7,9 @@ export type ImageProps = {
     fetchPriority?: 'high' | 'low' | 'auto';
     loadMode?: 'eager' | 'lazy';
 };
-declare const Image: ({ ref, className, src, alt, fetchPriority, loadMode }: ImageProps) => import("react/jsx-runtime").JSX.Element;
+declare const Image: ({ ref, className, src, alt, fetchPriority, loadMode }: ImageProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<ImageProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<ImageProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/Image/Image.mjs

@@ -1,4 +1,4 @@
-import e from "../../../Element/RootElement.mjs";
+import { RootElement as e } from "../../../Element/RootElement.mjs";
 import { getFallbackSVGBase64 as t } from "./ImageHelper.mjs";
 import n from "../../../Element/hocs/withElement.mjs";
 import { useCallback as r } from "react";
@@ -6,7 +6,7 @@ import i from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsx as a } from "react/jsx-runtime";
 import o from "clsx";
 //#region src/elements/media/Image/Image.tsx
-var s = t(), c = n(({ ref: t, className: n = "", src: c = "https://cdn.plitzi.com/resources/img/placeholder-img.svg", alt: l = "", fetchPriority: u = "auto", loadMode: d }) => {
+var s = t(), c = ({ ref: t, className: n = "", src: c = "https://cdn.plitzi.com/resources/img/placeholder-img.svg", alt: l = "", fetchPriority: u = "auto", loadMode: d }) => {
 	let { settings: { previewMode: f } } = i(), p = r((e) => {
 		e.currentTarget.onerror = null, e.currentTarget.src = s;
 	}, []);
@@ -32,6 +32,6 @@ var s = t(), c = n(({ ref: t, className: n = "", src: c = "https://cdn.plitzi.co
 			onError: p
 		})
 	});
-});
+}, l = n(c);
 //#endregion
-export { c as default };
+export { c as Image, l as default };

package/dist/elements/media/Image/Settings.d.ts

@@ -5,5 +5,5 @@ type SettingsProps = {
     variables?: Record<string, string>;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ src, variables, fetchPriority, loadMode, onUpdate }: SettingsProps) => import("react/jsx-runtime").JSX.Element;
+declare const Settings: ({ src, variables, fetchPriority, loadMode, onUpdate }: SettingsProps) => import("react").JSX.Element;
 export default Settings;

package/dist/elements/media/Image/index.d.ts

@@ -1,5 +1,5 @@
 declare const Image: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Image').ImageProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Image').ImageProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/media/Video/Settings.d.ts

@@ -6,5 +6,5 @@ type SettingsProps = {
     muted?: boolean;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ src, autoPlay, playsInline, loop, muted, onUpdate }: SettingsProps) => import("react/jsx-runtime").JSX.Element;
+declare const Settings: ({ src, autoPlay, playsInline, loop, muted, onUpdate }: SettingsProps) => import("react").JSX.Element;
 export default Settings;

package/dist/elements/media/Video/Video.d.ts

@@ -8,9 +8,9 @@ export type VideoProps = {
     muted?: boolean;
     className?: string;
 };
-declare const Video: ({ ref, src, autoPlay, playsInline, loop, muted, className }: VideoProps) => import("react/jsx-runtime").JSX.Element;
+declare const Video: ({ ref, src, autoPlay, playsInline, loop, muted, className }: VideoProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<VideoProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<VideoProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/Video/Video.mjs

@@ -1,9 +1,10 @@
-import e from "../../../Element/RootElement.mjs";
+import { RootElement as e } from "../../../Element/RootElement.mjs";
 import t from "../../../Element/hocs/withElement.mjs";
 import n from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsx as r } from "react/jsx-runtime";
 import i from "clsx";
-var a = t(({ ref: t, src: a, autoPlay: o = !1, playsInline: s = !1, loop: c = !1, muted: l = !0, className: u = "" }) => {
+//#region src/elements/media/Video/Video.tsx
+var a = ({ ref: t, src: a, autoPlay: o = !1, playsInline: s = !1, loop: c = !1, muted: l = !0, className: u = "" }) => {
 	let { settings: { previewMode: d } } = n();
 	return d ? /* @__PURE__ */ r(e, {
 		tag: "video",
@@ -27,6 +28,6 @@ var a = t(({ ref: t, src: a, autoPlay: o = !1, playsInline: s = !1, loop: c = !1
 			children: /* @__PURE__ */ r("track", { kind: "captions" })
 		})
 	});
-});
+}, o = t(a);
 //#endregion
-export { a as default };
+export { a as Video, o as default };

package/dist/elements/media/Video/index.d.ts

@@ -1,5 +1,5 @@
 declare const Video: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Video').VideoProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Video').VideoProps>): import("react").JSX.Element;
     displayName: string;
 } & {
     type: string;

package/dist/elements/provider/ApiContainer/ApiContainer.d.ts

@@ -13,9 +13,9 @@ export type ApiContainerProps = {
     subType?: 'div' | 'header' | 'footer' | 'nav' | 'main' | 'section' | 'article' | 'aside' | 'address' | 'figure';
     credentials?: RequestCredentials;
 };
-declare const ApiContainer: ({ ref, className, children, query, method, accessToken, when, headers, mockData, subType, credentials }: ApiContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const ApiContainer: ({ ref, className, children, query, method, accessToken, when, headers, mockData, subType, credentials }: ApiContainerProps) => import("react").JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<ApiContainerProps>): import("react/jsx-runtime").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<ApiContainerProps>): import("react").JSX.Element;
     displayName: string;
 };
 export default _default;