@compill/admin 1.0.108 → 1.0.110

package/dist/index.js

@@ -1,67 +1,62 @@
-'use strict';
-
-var jsxRuntime = require('@soperio/jsx-runtime');
-var api = require('@compill/api');
-var components = require('@compill/components');
-var js = require('@mdi/js');
-var ui = require('@valerya/ui');
-var compat = require('es-toolkit/compat');
-var Link = require('next/link');
-var reactRouterDom = require('react-router-dom');
-var React8 = require('react');
-var adminApi = require('@compill/admin-api');
-var formik = require('formik');
-var reactToastify = require('react-toastify');
-var reactHotkeysHook = require('react-hotkeys-hook');
-var form = require('@compill/form');
-var react = require('@soperio/react');
-var formEditor = require('@compill/form-editor');
-var editor = require('@compill/editor');
-var reactDom = require('react-dom');
-var router = require('next/router');
-var table = require('@compill/table');
-var esToolkit = require('es-toolkit');
-var hooks = require('@compill/hooks');
-var env = require('@compill/env');
-var reactTable = require('@tanstack/react-table');
-var reactQuery = require('@tanstack/react-query');
-var Image = require('next/image');
-var auth = require('@compill/auth');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var Link__default = /*#__PURE__*/_interopDefault(Link);
-var React8__default = /*#__PURE__*/_interopDefault(React8);
-var Image__default = /*#__PURE__*/_interopDefault(Image);
-
-// src/lib/SectionTitle.tsx
+import { jsx, jsxs, Fragment } from '@soperio/jsx-runtime';
+import { useApiQuery, useApiMutation, useMutate, useInvalidateMutation, useInvalidateQuery, useInvalidateParentMutation, useApiQueries } from '@compill/api';
+import { Shimmer, FlexCenter, QueryLoadingState, RetryOnError, TabContainer, ModalLoadingOverlay } from '@compill/components';
+import { mdiCircleSmall, mdiDatabaseRefreshOutline, mdiPost, mdiEye, mdiEyeOff, mdiCloudUpload, mdiOpenInNew, mdiArrowUpBoldBox, mdiArrowDownBoldBox, mdiPlusThick, mdiFilter, mdiRefresh, mdiPublish, mdiPublishOff, mdiDelete, mdiPencil, mdiCog, mdiDotsVertical, mdiLogout, mdiArrowLeft } from '@mdi/js';
+import { Icon, Button, Container, Tile, Popover, Collapse, Modal, Avatar, IconButton, Popup, Checkbox, Badge } from '@valerya/ui';
+import Link from 'next/link';
+import { useParams, useNavigate, Outlet, useLocation, useMatch, Link as Link$1 } from 'react-router-dom';
+import React from 'react';
+import { INVALIDATE_API, API, useInvalidatePage } from '@compill/admin-api';
+import { useFormikContext, Formik, Form } from 'formik';
+import { toast } from 'react-toastify';
+import { useHotkeys } from 'react-hotkeys-hook';
+import { FormProvider, TextArea, FormRenderer, mergeInitialFormValues, FieldLabel, SubmitButton } from '@compill/form';
+import { createContext, runIfFn, isFunction } from '@soperio/react';
+import { FormEditor } from '@compill/form-editor';
+import { ImageExtension } from '@compill/editor';
+import { createPortal } from 'react-dom';
+import { useRouter } from 'next/router';
+import { TableContextProvider, useTableContext, Table } from '@compill/table';
+import { isEqual, capitalize, sortBy } from 'es-toolkit';
+import { useOpenLink, useBoolean } from '@compill/hooks';
+import { AppEnv } from '@compill/env';
+import { createColumnHelper } from '@tanstack/react-table';
+import { useQueryClient } from '@tanstack/react-query';
+import Image from 'next/image.js';
+import { useSessionUser, useSessionLogout } from '@compill/auth';
+
 function SectionTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("h2", { textSize: "xl", fontWeight: "600", textColor: "slate-800", ...props, children });
+  return /* @__PURE__ */ jsx("h2", { textSize: "xl", fontWeight: "600", textColor: "slate-800", ...props, children });
+}
+
+function isArray(value) {
+    return Array.isArray(value);
 }
+
 function Breadcrumbs({ breadcrumbs, ...props }) {
-  if (compat.isArray(breadcrumbs)) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, alignItems: "center", trait: "typo.h5", ...props, children: breadcrumbs.map((b, index) => /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { breadcrumb: b, showSeparator: index > 0 }, index)) });
+  if (isArray(breadcrumbs)) {
+    return /* @__PURE__ */ jsx("div", { dflex: true, alignItems: "center", trait: "typo.h5", ...props, children: breadcrumbs.map((b, index) => /* @__PURE__ */ jsx(BreadcrumbItem, { breadcrumb: b, showSeparator: index > 0 }, index)) });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(QueryBreadcrumbs, { queryFn: breadcrumbs.queryFn, queryField: breadcrumbs.queryField, generate: breadcrumbs.generate });
+  return /* @__PURE__ */ jsx(QueryBreadcrumbs, { queryFn: breadcrumbs.queryFn, queryField: breadcrumbs.queryField, generate: breadcrumbs.generate });
 }
 function QueryBreadcrumbs({ queryFn, queryField, generate, ...props }) {
-  const params = reactRouterDom.useParams();
+  const params = useParams();
   const id = queryField ? params[queryField] : void 0;
-  const { data, isLoading, isError } = api.useApiQuery([""], queryFn, id);
+  const { data, isLoading, isError } = useApiQuery([""], queryFn, id);
   if (isLoading || isError) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, alignItems: "center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.Shimmer, { h: "8", w: "24" }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiCircleSmall, mx: "1" }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.Shimmer, { h: "8", w: "20" })
+    return /* @__PURE__ */ jsxs("div", { dflex: true, alignItems: "center", children: [
+      /* @__PURE__ */ jsx(Shimmer, { h: "8", w: "24" }),
+      /* @__PURE__ */ jsx(Icon, { path: mdiCircleSmall, mx: "1" }),
+      /* @__PURE__ */ jsx(Shimmer, { h: "8", w: "20" })
     ] });
   }
   const breadcrumbs = generate(data);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, alignItems: "center", trait: "typo.h5", ...props, children: breadcrumbs.map((b, index) => /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { breadcrumb: b, showSeparator: index > 0 }, index)) });
+  return /* @__PURE__ */ jsx("div", { dflex: true, alignItems: "center", trait: "typo.h5", ...props, children: breadcrumbs.map((b, index) => /* @__PURE__ */ jsx(BreadcrumbItem, { breadcrumb: b, showSeparator: index > 0 }, index)) });
 }
 function BreadcrumbItem({ breadcrumb, showSeparator }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    showSeparator && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiCircleSmall, mx: "1" }),
-    /* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { href: `/${breadcrumb.path || "#"}`, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    showSeparator && /* @__PURE__ */ jsx(Icon, { path: mdiCircleSmall, mx: "1" }),
+    /* @__PURE__ */ jsx(Link, { href: `/${breadcrumb.path || "#"}`, children: /* @__PURE__ */ jsx(
       "span",
       {
         hover_textDecoration: breadcrumb.path ? "underline" : void 0,
@@ -71,28 +66,30 @@ function BreadcrumbItem({ breadcrumb, showSeparator }) {
     ) })
   ] });
 }
+
 function DialogButton({ buildDialog, ...props }) {
-  const [showDialog, setShowDialog] = React8__default.default.useState(false);
-  const onShowDialog = React8__default.default.useCallback((event) => {
+  const [showDialog, setShowDialog] = React.useState(false);
+  const onShowDialog = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
     setShowDialog(true);
   }, [setShowDialog]);
-  const onCloseDialog = React8__default.default.useCallback(() => {
+  const onCloseDialog = React.useCallback(() => {
     setShowDialog(false);
   }, [setShowDialog]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: onShowDialog, ...props }),
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Button, { onClick: onShowDialog, ...props }),
     showDialog && buildDialog(onCloseDialog)
   ] });
 }
+
 function ButtonBar({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, border: "1px", borderColor: "zinc-200", divideX: "1px", divideColor: "zinc-200", rounded: "lg", overflow: "hidden", ...props, children });
+  return /* @__PURE__ */ jsx("div", { dflex: true, border: "1px", borderColor: "zinc-200", divideX: "1px", divideColor: "zinc-200", rounded: "lg", overflow: "hidden", ...props, children });
 }
-var ButtonBarButton = React8__default.default.forwardRef(
+const ButtonBarButton = React.forwardRef(
   function({ icon, children, ...props }, ref) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      ui.Button,
+    return /* @__PURE__ */ jsxs(
+      Button,
       {
         scheme: "dark",
         size: "sm",
@@ -106,19 +103,19 @@ var ButtonBarButton = React8__default.default.forwardRef(
         ...props,
         ref,
         children: [
-          icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon }),
+          icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
           children
         ]
       }
     );
   }
 );
-var ButtonBarSubmitButton = React8__default.default.forwardRef(
+const ButtonBarSubmitButton = React.forwardRef(
   function({ useDirty, disabled, icon, children, ...props }, ref) {
-    const { dirty, handleSubmit } = formik.useFormikContext() ?? { dirty: false, handleSubmit: void 0};
-    const onSubmit = React8__default.default.useCallback(() => handleSubmit(), [handleSubmit]);
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      ui.Button,
+    const { dirty, handleSubmit } = useFormikContext() ?? { dirty: false, handleSubmit: void 0};
+    const onSubmit = React.useCallback(() => handleSubmit(), [handleSubmit]);
+    return /* @__PURE__ */ jsxs(
+      Button,
       {
         scheme: "dark",
         size: "sm",
@@ -134,7 +131,7 @@ var ButtonBarSubmitButton = React8__default.default.forwardRef(
         ...props,
         ref,
         children: [
-          icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon }),
+          icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
           children
         ]
       }
@@ -142,7 +139,7 @@ var ButtonBarSubmitButton = React8__default.default.forwardRef(
   }
 );
 function ButtonBarDialogButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     DialogButton,
     {
       scheme: "dark",
@@ -156,112 +153,121 @@ function ButtonBarDialogButton({ icon, children, ...props }) {
       gap: "2",
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
         children
       ]
     }
   );
 }
+
 function InvalidateButton({ pathOrPermalink, ...props }) {
-  const api$1 = adminApi.INVALIDATE_API.new(pathOrPermalink);
-  const mutation = api.useApiMutation(api$1.invalidate, api$1.queryKey);
-  const invalidate = api.useMutate(mutation, { successMsg: "Page successfully invalidated" });
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  const api = INVALIDATE_API.new(pathOrPermalink);
+  const mutation = useApiMutation(api.invalidate, api.queryKey);
+  const invalidate = useMutate(mutation, { successMsg: "Page successfully invalidated" });
+  return /* @__PURE__ */ jsx(
     ButtonBarButton,
     {
       title: "Regenerate",
       disabled: mutation.isLoading,
       onClick: invalidate,
-      icon: js.mdiDatabaseRefreshOutline,
+      icon: mdiDatabaseRefreshOutline,
       ...props
     }
   );
 }
+
 function NavigateButton({ path, ...props }) {
-  const navigate = reactRouterDom.useNavigate();
-  const handleClick = React8__default.default.useCallback(() => {
+  const navigate = useNavigate();
+  const handleClick = React.useCallback(() => {
     navigate(path);
   }, [navigate, path]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", scheme: "dark", variant: "glass", corners: "pill", w: "10", h: "10", onClick: handleClick, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiPost }) });
+  return /* @__PURE__ */ jsx(Button, { type: "submit", scheme: "dark", variant: "glass", corners: "pill", w: "10", h: "10", onClick: handleClick, ...props, children: /* @__PURE__ */ jsx(Icon, { path: mdiPost }) });
 }
+
 function PublishButton({
   status,
   queryId,
-  api: api$1,
+  api,
   ...props
 }) {
   const isDraft = status == "draft";
-  const mutation = api.useInvalidateMutation(isDraft ? api$1.publish : api$1.unpublish, api$1.queryKey, queryId, { networkMode: "always" });
-  const publish = React8__default.default.useCallback(() => {
+  const mutation = useInvalidateMutation(isDraft ? api.publish : api.unpublish, api.queryKey, queryId, { networkMode: "always" });
+  const publish = React.useCallback(() => {
     mutation.reset();
-    mutation.mutateAsync(queryId).then(() => reactToastify.toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => reactToastify.toast.error(`Error: ${error}`));
+    mutation.mutateAsync(queryId).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
   }, [mutation, queryId]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsx(
     ButtonBarButton,
     {
       disabled: mutation.isLoading,
       onClick: publish,
-      icon: isDraft ? js.mdiEye : js.mdiEyeOff,
+      icon: isDraft ? mdiEye : mdiEyeOff,
       ...props,
       children: isDraft ? "Publish" : "Switch to draft"
     }
   );
 }
+
 function UpdateButton({ ...props }) {
-  const { dirty, handleSubmit } = formik.useFormikContext() ?? { dirty: false, handleSubmit: void 0};
-  reactHotkeysHook.useHotkeys("ctrl+s", () => {
+  const { dirty, handleSubmit } = useFormikContext() ?? { dirty: false, handleSubmit: void 0};
+  useHotkeys("ctrl+s", () => {
     if (dirty && !props.disabled) handleSubmit();
   }, { preventDefault: true }, [dirty, props, handleSubmit]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ButtonBarSubmitButton, { icon: js.mdiCloudUpload, ...props, children: "Update" });
+  return /* @__PURE__ */ jsx(ButtonBarSubmitButton, { icon: mdiCloudUpload, ...props, children: "Update" });
 }
+
 function ViewButton({ label, path, icon, ...props }) {
-  const openPage = React8__default.default.useCallback(() => {
+  const openPage = React.useCallback(() => {
     window.open(path, "_blank");
   }, [path]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsx(
     ButtonBarButton,
     {
       onClick: openPage,
       dflex: true,
       alignItems: "center",
       gap: "2",
-      icon: icon || js.mdiOpenInNew,
+      icon: icon || mdiOpenInNew,
       ...props,
       children: label
     }
   );
 }
-function OrderCell({ api: api$1, postId, order }) {
-  const mutationDown = api.useInvalidateMutation(api$1.moveDown, api$1.queryKey);
-  const mutationUp = api.useInvalidateMutation(api$1.moveUp, api$1.queryKey);
-  const moveDown = React8__default.default.useCallback((e) => {
+
+function OrderCell({ api, postId, order }) {
+  const mutationDown = useInvalidateMutation(api.moveDown, api.queryKey);
+  const mutationUp = useInvalidateMutation(api.moveUp, api.queryKey);
+  const moveDown = React.useCallback((e) => {
     e.stopPropagation();
     mutationDown.mutateAsync(postId).catch((error) => {
-      reactToastify.toast.error(`Error: ${error}`);
+      toast.error(`Error: ${error}`);
     });
   }, [mutationDown, postId]);
-  const moveUp = React8__default.default.useCallback((e) => {
+  const moveUp = React.useCallback((e) => {
     e.stopPropagation();
     mutationUp.mutateAsync(postId).catch((error) => {
-      reactToastify.toast.error(`Error: ${error}`);
+      toast.error(`Error: ${error}`);
     });
   }, [mutationUp, postId]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(components.FlexCenter, { placeContent: "start", numericFontVariant: "tabular-nums", children: [
+  return /* @__PURE__ */ jsxs(FlexCenter, { placeContent: "start", numericFontVariant: "tabular-nums", children: [
     order,
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { ms: "3", variant: "borderless", scheme: "dark", onClick: moveUp, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiArrowUpBoldBox }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "borderless", scheme: "dark", onClick: moveDown, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiArrowDownBoldBox }) })
+    /* @__PURE__ */ jsx(Button, { ms: "3", variant: "borderless", scheme: "dark", onClick: moveUp, children: /* @__PURE__ */ jsx(Icon, { path: mdiArrowUpBoldBox }) }),
+    /* @__PURE__ */ jsx(Button, { variant: "borderless", scheme: "dark", onClick: moveDown, children: /* @__PURE__ */ jsx(Icon, { path: mdiArrowDownBoldBox }) })
   ] });
 }
+
 function PageContainer({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { center: true, dflex: true, flexCol: true, gap: "8", ...props, children });
+  return /* @__PURE__ */ jsx(Container, { center: true, dflex: true, flexCol: true, gap: "8", ...props, children });
 }
+
 function PageMain({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Tile, { scheme: "light", p: "5", ...props, children });
+  return /* @__PURE__ */ jsx(Tile, { scheme: "light", p: "5", ...props, children });
 }
+
 function PageContentEditor({ name, ...props }) {
-  const extensions = [editor.ImageExtension];
-  return /* @__PURE__ */ jsxRuntime.jsx(PageMain, { h: "min", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    formEditor.FormEditor,
+  const extensions = [ImageExtension];
+  return /* @__PURE__ */ jsx(PageMain, { h: "min", ...props, children: /* @__PURE__ */ jsx(
+    FormEditor,
     {
       minH: "128",
       minW: "144",
@@ -272,73 +278,79 @@ function PageContentEditor({ name, ...props }) {
     }
   ) });
 }
-function PageQueryStateContainerInner({ queryId, api: api$1, apiFn, loadingStyles, errorStyles, children, ...props }) {
-  const { data, isLoading, isError } = apiFn == "getAll" ? api.useApiQuery(api$1.queryKey, api$1.getAll, props.apiParams) : api.useApiQuery(api$1.queryKey, api$1.get, queryId);
-  const invalidate = api.useInvalidateQuery(api$1.queryKey, queryId);
+
+function PageQueryStateContainerInner({ queryId, api, apiFn, loadingStyles, errorStyles, children, ...props }) {
+  const { data, isLoading, isError } = apiFn == "getAll" ? useApiQuery(api.queryKey, api.getAll, props.apiParams) : useApiQuery(api.queryKey, api.get, queryId);
+  const invalidate = useInvalidateQuery(api.queryKey, queryId);
   if (isLoading)
-    return /* @__PURE__ */ jsxRuntime.jsx(components.QueryLoadingState, { w: "full", h: "100%", ...loadingStyles });
+    return /* @__PURE__ */ jsx(QueryLoadingState, { w: "full", h: "100%", ...loadingStyles });
   if (isError)
-    return /* @__PURE__ */ jsxRuntime.jsx(components.RetryOnError, { p: "0", onClick: invalidate, ...errorStyles });
-  return /* @__PURE__ */ jsxRuntime.jsx(PageContainer, { ...props, children: apiFn == "get" ? children(data) : children(data) });
+    return /* @__PURE__ */ jsx(RetryOnError, { p: "0", onClick: invalidate, ...errorStyles });
+  return /* @__PURE__ */ jsx(PageContainer, { ...props, children: apiFn == "get" ? children(data) : children(data) });
 }
-var PageQueryStateContainer = React8__default.default.forwardRef(PageQueryStateContainerInner);
+const PageQueryStateContainer = React.forwardRef(PageQueryStateContainerInner);
+
 function PageSidebar({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { w: "112", minW: "112", minH: "100%", gap: "8", dflex: true, flexCol: true, ...props, children });
+  return /* @__PURE__ */ jsx("div", { w: "112", minW: "112", minH: "100%", gap: "8", dflex: true, flexCol: true, ...props, children });
 }
+
 function PageSectionTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { trait: "typo.h6", mb: "5", ...props, children });
+  return /* @__PURE__ */ jsx("div", { trait: "typo.h6", mb: "5", ...props, children });
 }
+
 function PageSidebarSection({ title, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { w: "full", ...props, children: [
-    title && /* @__PURE__ */ jsxRuntime.jsx(PageSectionTitle, { children: title }),
+  return /* @__PURE__ */ jsxs("div", { w: "full", ...props, children: [
+    title && /* @__PURE__ */ jsx(PageSectionTitle, { children: title }),
     children
   ] });
 }
+
 function PageTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { trait: "typo.h5", ...props, children });
+  return /* @__PURE__ */ jsx("div", { trait: "typo.h5", ...props, children });
 }
+
 function PageTopBar({ title, breadcrumbs, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(components.FlexCenter, { gap: "3", minH: "9", ...props, children: [
-    title && /* @__PURE__ */ jsxRuntime.jsx(PageTitle, { children: title }),
-    breadcrumbs && /* @__PURE__ */ jsxRuntime.jsx(Breadcrumbs, { breadcrumbs }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { flexGrow: true }),
+  return /* @__PURE__ */ jsxs(FlexCenter, { gap: "3", minH: "9", ...props, children: [
+    title && /* @__PURE__ */ jsx(PageTitle, { children: title }),
+    breadcrumbs && /* @__PURE__ */ jsx(Breadcrumbs, { breadcrumbs }),
+    /* @__PURE__ */ jsx("div", { flexGrow: true }),
     children
   ] });
 }
-var [CP, usePageTabbedTopBarContext] = react.createContext();
+const [CP, usePageTabbedTopBarContext] = createContext();
 function PageTabbedTopBarProvider({ children }) {
-  const [containerEl, setContainerEl] = React8__default.default.useState(null);
-  React8__default.default.createRef();
-  return /* @__PURE__ */ jsxRuntime.jsx(CP, { value: { containerEl, setContainerEl }, children });
+  const [containerEl, setContainerEl] = React.useState(null);
+  React.createRef();
+  return /* @__PURE__ */ jsx(CP, { value: { containerEl, setContainerEl }, children });
 }
 function PageTabbedTopBar({ title, breadcrumbs, children, ...props }) {
-  const ref = React8__default.default.createRef();
+  const ref = React.createRef();
   const { setContainerEl } = usePageTabbedTopBarContext();
-  const [isSet, setIsSet] = React8__default.default.useState(false);
-  React8__default.default.useEffect(() => {
+  const [isSet, setIsSet] = React.useState(false);
+  React.useEffect(() => {
     if (!isSet && ref.current) {
       setContainerEl(ref.current);
       setIsSet(true);
     }
     return () => setContainerEl(null);
   }, []);
-  return /* @__PURE__ */ jsxRuntime.jsx(components.FlexCenter, { gap: "3", minH: "9", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    title && /* @__PURE__ */ jsxRuntime.jsx(PageTitle, { children: title }),
-    breadcrumbs && /* @__PURE__ */ jsxRuntime.jsx(Breadcrumbs, { breadcrumbs }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { flexGrow: true }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { ref, dflex: true, flexRow: true, gap: "3" }),
+  return /* @__PURE__ */ jsx(FlexCenter, { gap: "3", minH: "9", ...props, children: /* @__PURE__ */ jsxs(Fragment, { children: [
+    title && /* @__PURE__ */ jsx(PageTitle, { children: title }),
+    breadcrumbs && /* @__PURE__ */ jsx(Breadcrumbs, { breadcrumbs }),
+    /* @__PURE__ */ jsx("div", { flexGrow: true }),
+    /* @__PURE__ */ jsx("div", { ref, dflex: true, flexRow: true, gap: "3" }),
     children
   ] }) });
 }
 function PageTopBarToolbar({ trackingRef, children }) {
   const { containerEl } = usePageTabbedTopBarContext();
-  const [visible, setVisible] = React8__default.default.useState(false);
-  const portal = React8__default.default.useMemo(() => {
+  const [visible, setVisible] = React.useState(false);
+  const portal = React.useMemo(() => {
     const node = containerEl;
     return node;
   }, [containerEl]);
   const host = containerEl ?? (typeof window !== "undefined" ? document.body : void 0);
-  React8__default.default.useLayoutEffect(() => {
+  React.useLayoutEffect(() => {
     if (!portal || !host)
       return;
     try {
@@ -355,10 +367,10 @@ function PageTopBarToolbar({ trackingRef, children }) {
       }
     };
   }, [visible, portal, host]);
-  const callback = React8__default.default.useCallback((entries) => {
+  const callback = React.useCallback((entries) => {
     setVisible(entries[0].isVisible);
   }, [children]);
-  React8__default.default.useEffect(() => {
+  React.useEffect(() => {
     const opts = {
       root: null,
       rootMargin: "0px",
@@ -373,47 +385,49 @@ function PageTopBarToolbar({ trackingRef, children }) {
     return () => observerScroll.disconnect();
   }, [trackingRef, callback, children]);
   if (host && portal)
-    return reactDom.createPortal(children, portal);
+    return createPortal(children, portal);
   return null;
 }
+
 function ScreenTopBar({ tabbed, breadcrumbs, api, item, isLoading, buttonBar, trackingRef }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    tabbed && /* @__PURE__ */ jsxRuntime.jsx(PageTopBarToolbar, { trackingRef, children: /* @__PURE__ */ jsxRuntime.jsx(Buttons, { api, item, isLoading, buttonBar }) }),
-    !tabbed && /* @__PURE__ */ jsxRuntime.jsx(PageTopBar, { breadcrumbs, children: /* @__PURE__ */ jsxRuntime.jsx(Buttons, { api, item, isLoading, buttonBar }) })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    tabbed && /* @__PURE__ */ jsx(PageTopBarToolbar, { trackingRef, children: /* @__PURE__ */ jsx(Buttons$1, { api, item, isLoading, buttonBar }) }),
+    !tabbed && /* @__PURE__ */ jsx(PageTopBar, { breadcrumbs, children: /* @__PURE__ */ jsx(Buttons$1, { api, item, isLoading, buttonBar }) })
   ] });
 }
-function Buttons({ api, item, isLoading, buttonBar }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    buttonBar && buttonBar.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(ButtonBar, { children: buttonBar.map((button, index) => /* @__PURE__ */ jsxRuntime.jsxs(React8__default.default.Fragment, { children: [
-      button.type === "link" && /* @__PURE__ */ jsxRuntime.jsx(ViewButton, { label: button.label, path: button.path, icon: button.icon }),
-      button.type === "invalidate" && /* @__PURE__ */ jsxRuntime.jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }),
+function Buttons$1({ api, item, isLoading, buttonBar }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    buttonBar && buttonBar.length > 0 && /* @__PURE__ */ jsx(ButtonBar, { children: buttonBar.map((button, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+      button.type === "link" && /* @__PURE__ */ jsx(ViewButton, { label: button.label, path: button.path, icon: button.icon }),
+      button.type === "invalidate" && /* @__PURE__ */ jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }),
       button.type == "custom" && button.render(item)
     ] }, index)) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(ButtonBar, { children: [
-      api instanceof adminApi.API && /* @__PURE__ */ jsxRuntime.jsx(PublishButton, { api, queryId: item.id, status: item.status, disabled: isLoading }),
-      /* @__PURE__ */ jsxRuntime.jsx(UpdateButton, { disabled: isLoading })
+    /* @__PURE__ */ jsxs(ButtonBar, { children: [
+      api instanceof API && /* @__PURE__ */ jsx(PublishButton, { api, queryId: item.id, status: item.status, disabled: isLoading }),
+      /* @__PURE__ */ jsx(UpdateButton, { disabled: isLoading })
     ] })
   ] });
 }
+
 function useQueryField(queryField, useNextRouter) {
   if (useNextRouter) {
-    const router$1 = router.useRouter();
-    return router$1.query[queryField];
+    const router = useRouter();
+    return router.query[queryField];
   }
-  const { [queryField]: id } = reactRouterDom.useParams();
+  const { [queryField]: id } = useParams();
   return id;
 }
 function DetailsView({ queryField, api, useNextRouter, processInput, screen, tabbed, ...props }) {
   const id = useQueryField(queryField, useNextRouter);
-  const ref = React8__default.default.useRef(null);
-  return /* @__PURE__ */ jsxRuntime.jsx(PageQueryStateContainer, { api, apiFn: "get", queryId: id, ref, p: "5", ...props, children: (item) => /* @__PURE__ */ jsxRuntime.jsx(Internal, { item, screen, api, tabbed, processInput, containerRef: ref }) });
+  const ref = React.useRef(null);
+  return /* @__PURE__ */ jsx(PageQueryStateContainer, { api, apiFn: "get", queryId: id, ref, p: "5", ...props, children: (item) => /* @__PURE__ */ jsx(Internal, { item, screen, api, tabbed, processInput, containerRef: ref }) });
 }
-function Internal({ item, screen, api: api$1, processInput, tabbed, containerRef }) {
-  const pScreen = react.runIfFn(screen, item);
+function Internal({ item, screen, api, processInput, tabbed, containerRef }) {
+  const pScreen = runIfFn(screen, item);
   const { breadcrumbs, schema, initialValues, header, sections, buttonBar, type, invalidateParentQueryKey, invalidatePage } = pScreen;
-  const mutation = api.useInvalidateParentMutation(api$1.update, invalidateParentQueryKey ?? api$1.queryKey, { networkMode: "always" });
-  const invalidatePageFn = adminApi.useInvalidatePage(invalidatePage || "");
-  const save = api.useMutate(mutation, {
+  const mutation = useInvalidateParentMutation(api.update, invalidateParentQueryKey ?? api.queryKey, { networkMode: "always" });
+  const invalidatePageFn = useInvalidatePage(invalidatePage || "");
+  const save = useMutate(mutation, {
     processInput,
     successMsg: (item2, values) => `${item2.title || item2.name} updated.`,
     errorMsg: (error, item2) => `Error updating ${item2.title || item2.name}: ${error}`,
@@ -427,19 +441,19 @@ function Internal({ item, screen, api: api$1, processInput, tabbed, containerRef
     editorMaxW = "calc(1280px - 28rem)";
   else if (type == "section")
     editorMaxW = "calc(1280px - 22rem)";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    form.FormProvider,
+  return /* @__PURE__ */ jsxs(
+    FormProvider,
     {
-      initialValues: react.runIfFn(initialValues, item),
+      initialValues: runIfFn(initialValues, item),
       validationSchema: schema,
       onSubmit: save,
       enableReinitialize: true,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsx(
           ScreenTopBar,
           {
             tabbed,
-            api: api$1,
+            api,
             breadcrumbs,
             buttonBar,
             item,
@@ -447,15 +461,15 @@ function Internal({ item, screen, api: api$1, processInput, tabbed, containerRef
             trackingRef: containerRef?.current
           }
         ),
-        type == "form" && sections?.map((section, index) => /* @__PURE__ */ jsxRuntime.jsx(Section, { section, item }, index)),
-        (pScreen.type == "post" || pScreen.type == "section") && /* @__PURE__ */ jsxRuntime.jsx("div", { p: "5", bgColor: "slate-100", rounded: "lg", children: /* @__PURE__ */ jsxRuntime.jsxs(PageContainer, { w: editorMaxW ? "auto" : "full", size: "x2", id: "pagecontainer", children: [
+        type == "form" && sections?.map((section, index) => /* @__PURE__ */ jsx(Section, { section, item }, index)),
+        (pScreen.type == "post" || pScreen.type == "section") && /* @__PURE__ */ jsx("div", { p: "5", bgColor: "slate-100", rounded: "lg", children: /* @__PURE__ */ jsxs(PageContainer, { w: editorMaxW ? "auto" : "full", size: "x2", id: "pagecontainer", children: [
           header,
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, gap: "5", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, flexCol: true, gap: "8", flexGrow: true, children: [
+          /* @__PURE__ */ jsxs("div", { dflex: true, gap: "5", children: [
+            /* @__PURE__ */ jsxs("div", { dflex: true, flexCol: true, gap: "8", flexGrow: true, children: [
               pScreen.editor?.type != "textarea" && // TODO Find a way to make this editor shrink in width when resizing the window...
-              /* @__PURE__ */ jsxRuntime.jsx(PageContentEditor, { name: "content", maxW: editorMaxW, minW: "144", shadow: true, rounded: "lg" }),
-              pScreen.editor?.type == "textarea" && /* @__PURE__ */ jsxRuntime.jsx(
-                form.TextArea,
+              /* @__PURE__ */ jsx(PageContentEditor, { name: "content", maxW: editorMaxW, minW: "144", shadow: true, rounded: "lg" }),
+              pScreen.editor?.type == "textarea" && /* @__PURE__ */ jsx(
+                TextArea,
                 {
                   name: pScreen.editor?.name,
                   maxW: editorMaxW,
@@ -472,7 +486,7 @@ function Internal({ item, screen, api: api$1, processInput, tabbed, containerRef
               ),
               pScreen.editorFooter
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(PageSidebar, { children: sections?.map((section, index) => /* @__PURE__ */ jsxRuntime.jsx(Section, { section, item, cardStyle: true }, index)) })
+            /* @__PURE__ */ jsx(PageSidebar, { children: sections?.map((section, index) => /* @__PURE__ */ jsx(Section, { section, item, cardStyle: true }, index)) })
           ] })
         ] }) })
       ]
@@ -488,21 +502,22 @@ function Section({ section, item, cardStyle }) {
       textSize: "sm",
       shadow: true
     } : {};
-    return /* @__PURE__ */ jsxRuntime.jsx(PageSidebarSection, { title: section.title, ...style, children: /* @__PURE__ */ jsxRuntime.jsx(form.FormRenderer, { form: react.runIfFn(section.form, item) }) });
+    return /* @__PURE__ */ jsx(PageSidebarSection, { title: section.title, ...style, children: /* @__PURE__ */ jsx(FormRenderer, { form: runIfFn(section.form, item) }) });
   }
   if (section.type === "custom")
-    return react.runIfFn(section.component, item);
+    return runIfFn(section.component, item);
   return null;
 }
+
 function useApi(api, queryField) {
-  const params = reactRouterDom.useParams();
+  const params = useParams();
   if (queryField === void 0)
     return { id: void 0, api };
   const { [queryField]: id } = params;
-  return { id, api: react.runIfFn(api, id) };
+  return { id, api: runIfFn(api, id) };
 }
 function QueryWrapper({
-  api: api$1,
+  api,
   queryField,
   fn,
   transformFn,
@@ -510,9 +525,9 @@ function QueryWrapper({
   tabbed,
   ...props
 }) {
-  const { id, api: mApi } = useApi(api$1, queryField);
-  const { data } = api.useApiQuery(mApi.queryKey, fn === "get" || fn === "getTransformed" ? mApi.get : mApi.getAll, react.isFunction(api$1) ? void 0 : id);
-  const transformedData = React8__default.default.useMemo(() => {
+  const { id, api: mApi } = useApi(api, queryField);
+  const { data } = useApiQuery(mApi.queryKey, fn === "get" || fn === "getTransformed" ? mApi.get : mApi.getAll, isFunction(api) ? void 0 : id);
+  const transformedData = React.useMemo(() => {
     if (data && (fn === "getTransformed" || fn === "getAllTransformed")) {
       if (!transformFn)
         console.warn(`QueryWrapperDialog: you forgot to pass transformFn as parameter for fn ${fn}`);
@@ -522,11 +537,12 @@ function QueryWrapper({
   }, [data]);
   if (!data)
     return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(ScreenRenderer, { config: config(transformedData), tabbed, ...props });
+  return /* @__PURE__ */ jsx(ScreenRenderer, { config: config(transformedData), tabbed, ...props });
 }
+
 function TabbedView({ queryField, api, screen, ...props }) {
-  const { [queryField]: id } = reactRouterDom.useParams();
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  const { [queryField]: id } = useParams();
+  return /* @__PURE__ */ jsx(
     PageQueryStateContainer,
     {
       queryId: id,
@@ -534,18 +550,18 @@ function TabbedView({ queryField, api, screen, ...props }) {
       apiFn: "get",
       p: "5",
       children: (city) => {
-        const { breadcrumbs, tabs } = react.runIfFn(screen, city);
-        return /* @__PURE__ */ jsxRuntime.jsxs(PageTabbedTopBarProvider, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(PageTabbedTopBar, { breadcrumbs, mb: "-3" }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            components.TabContainer,
+        const { breadcrumbs, tabs } = runIfFn(screen, city);
+        return /* @__PURE__ */ jsxs(PageTabbedTopBarProvider, { children: [
+          /* @__PURE__ */ jsx(PageTabbedTopBar, { breadcrumbs, mb: "-3" }),
+          /* @__PURE__ */ jsx(
+            TabContainer,
             {
               tabs: tabs.map((tab) => tab.label),
               saveKey: `tab-${id}`,
               mt: "-3",
               mb: "3",
               id: "fff",
-              children: tabs.map((tab, index) => /* @__PURE__ */ jsxRuntime.jsx(TabView, { tab }, index))
+              children: tabs.map((tab, index) => /* @__PURE__ */ jsx(TabView, { tab }, index))
             }
           )
         ] });
@@ -558,18 +574,19 @@ function TabView({ tab }) {
     throw new Error(`Screen config for tabbed view: one of your tabs does not have a component or config declared: ${tab.label}`);
   if (tab.component)
     return tab.component();
-  return /* @__PURE__ */ jsxRuntime.jsx(ScreenRenderer, { config: tab.config, tabbed: true, p: "0" });
+  return /* @__PURE__ */ jsx(ScreenRenderer, { config: tab.config, tabbed: true, p: "0" });
 }
-var [provider, useContext] = react.createContext();
+
+const [provider$1, useContext$1] = createContext();
 function getColId(column) {
   return column.accessorKey ?? column.id;
 }
 function TableContainerContextProvider({ initialVisibleColumns, columns, children }) {
-  const [showFilters, setShowFilters] = React8__default.default.useState(false);
-  const [showMassActions, setShowMassActions] = React8__default.default.useState(false);
-  const [visibleColumnIds, setVisibleColumnIds] = React8__default.default.useState(initialVisibleColumns ?? columns?.map((col) => getColId(col)) ?? []);
+  const [showFilters, setShowFilters] = React.useState(false);
+  const [showMassActions, setShowMassActions] = React.useState(false);
+  const [visibleColumnIds, setVisibleColumnIds] = React.useState(initialVisibleColumns ?? columns?.map((col) => getColId(col)) ?? []);
   const filteredColumns = columns?.filter((col) => visibleColumnIds.includes(getColId(col))) ?? [];
-  const toggleColumnVisibility = React8__default.default.useCallback((id) => {
+  const toggleColumnVisibility = React.useCallback((id) => {
     const index = visibleColumnIds.indexOf(id);
     if (index > -1) {
       const newIds = visibleColumnIds.concat();
@@ -579,10 +596,10 @@ function TableContainerContextProvider({ initialVisibleColumns, columns, childre
       setVisibleColumnIds(visibleColumnIds.concat(id));
     }
   }, [visibleColumnIds, setVisibleColumnIds]);
-  const isColumnVisible = React8__default.default.useCallback((id) => {
+  const isColumnVisible = React.useCallback((id) => {
     return visibleColumnIds.includes(id);
   }, [visibleColumnIds]);
-  const Provider = provider;
+  const Provider = provider$1;
   const value = {
     showFilters,
     setShowFilters,
@@ -593,29 +610,33 @@ function TableContainerContextProvider({ initialVisibleColumns, columns, childre
     toggleColumnVisibility,
     isColumnVisible
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(Provider, { value, children });
+  return /* @__PURE__ */ jsx(Provider, { value, children });
 }
+
 function TableContainer({ initialPageSize, initialVisibleColumns, columns, filtersMethod = "reactRouter", children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { w: "full", dflex: true, flexCol: true, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(table.TableContextProvider, { initialPageSize, filtersMethod, children: /* @__PURE__ */ jsxRuntime.jsx(TableContainerContextProvider, { columns, initialVisibleColumns, children }) }) });
+  return /* @__PURE__ */ jsx("div", { w: "full", dflex: true, flexCol: true, ...props, children: /* @__PURE__ */ jsx(TableContextProvider, { initialPageSize, filtersMethod, children: /* @__PURE__ */ jsx(TableContainerContextProvider, { columns, initialVisibleColumns, children }) }) });
 }
+
 function TableCreateButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(ButtonBarDialogButton, { ...props, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon ?? js.mdiPlusThick }),
+  return /* @__PURE__ */ jsxs(ButtonBarDialogButton, { ...props, children: [
+    /* @__PURE__ */ jsx(Icon, { path: icon ?? mdiPlusThick }),
     children
   ] });
 }
+
 function TableFilterButton({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Popover, { side: "bottom-end", modal: true, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { scheme: "dark", size: "sm", aspectRatio: "square", variant: "borderless", corners: "square", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiFilter }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { bgColor: "white", rounded: true, shadow: true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "First Item" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "Second Item" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "Third Item" })
+  return /* @__PURE__ */ jsxs(Popover, { side: "bottom-end", modal: true, children: [
+    /* @__PURE__ */ jsx(Button, { scheme: "dark", size: "sm", aspectRatio: "square", variant: "borderless", corners: "square", ...props, children: /* @__PURE__ */ jsx(Icon, { path: mdiFilter }) }),
+    /* @__PURE__ */ jsxs("div", { bgColor: "white", rounded: true, shadow: true, children: [
+      /* @__PURE__ */ jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "First Item" }),
+      /* @__PURE__ */ jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "Second Item" }),
+      /* @__PURE__ */ jsx("div", { py: "3", hover_bgColor: "#ff0000", px: "5", hover_textColor: "white", children: "Third Item" })
     ] })
   ] });
 }
+
 function TableTopBar({ title, breadcrumbs, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       dflex: true,
@@ -625,57 +646,59 @@ function TableTopBar({ title, breadcrumbs, children, ...props }) {
       p: "8",
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("h2", { textSize: "x2", fontWeight: "600", textColor: "#3f4254", textTransform: "capitalize", children: title }),
-          breadcrumbs && /* @__PURE__ */ jsxRuntime.jsx(Breadcrumbs, { breadcrumbs })
+        /* @__PURE__ */ jsxs("div", { children: [
+          title && /* @__PURE__ */ jsx("h2", { textSize: "x2", fontWeight: "600", textColor: "#3f4254", textTransform: "capitalize", children: title }),
+          breadcrumbs && /* @__PURE__ */ jsx(Breadcrumbs, { breadcrumbs })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { flexGrow: true, children: "\xA0" }),
+        /* @__PURE__ */ jsx("div", { flexGrow: true, children: "\xA0" }),
         children
       ]
     }
   );
 }
-function TableFilters({ form: form$1, initialValues, schema, processInput }) {
-  const { showFilters } = useContext();
-  const { getFilters, setFilters } = table.useTableContext();
-  const handleSubmit = React8__default.default.useCallback((values, actions) => {
+
+function TableFilters({ form, initialValues, schema, processInput }) {
+  const { showFilters } = useContext$1();
+  const { getFilters, setFilters } = useTableContext();
+  const handleSubmit = React.useCallback((values, actions) => {
     const params = processInput?.(values) ?? values;
-    if (!esToolkit.isEqual(params, getFilters()))
+    if (!isEqual(params, getFilters()))
       setFilters(params);
     actions.setSubmitting(false);
   }, [setFilters, processInput]);
-  const handleReset = React8__default.default.useCallback((resetForm) => {
+  const handleReset = React.useCallback((resetForm) => {
     setFilters(initialValues);
     resetForm();
   }, [setFilters, initialValues]);
-  React8__default.default.useEffect(() => setFilters(initialValues), []);
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Collapse, { in: showFilters, style: { overflow: showFilters ? "initial" : "hidden" }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { p: "8", borderT: "px", borderB: "px", borderColor: "slate-100", children: /* @__PURE__ */ jsxRuntime.jsx(
-    form.FormProvider,
+  React.useEffect(() => setFilters(initialValues), []);
+  return /* @__PURE__ */ jsx(Collapse, { in: showFilters, style: { overflow: showFilters ? "initial" : "hidden" }, children: /* @__PURE__ */ jsx("div", { p: "8", borderT: "px", borderB: "px", borderColor: "slate-100", children: /* @__PURE__ */ jsx(
+    FormProvider,
     {
-      initialValues: form.mergeInitialFormValues(getFilters(), initialValues),
+      initialValues: mergeInitialFormValues(getFilters(), initialValues),
       onSubmit: handleSubmit,
       validationSchema: schema,
       enableReinitialize: true,
-      children: (props) => /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, gap: "3", placeContent: "start", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(form.FormRenderer, { flexRow: true, w: "auto", form: form$1 }),
-        /* @__PURE__ */ jsxRuntime.jsx(Buttons2, { handleReset: () => handleReset(props.resetForm) })
+      children: (props) => /* @__PURE__ */ jsxs("div", { dflex: true, gap: "3", placeContent: "start", children: [
+        /* @__PURE__ */ jsx(FormRenderer, { flexRow: true, w: "auto", form }),
+        /* @__PURE__ */ jsx(Buttons, { handleReset: () => handleReset(props.resetForm) })
       ] })
     }
   ) }) });
 }
-function Buttons2({ handleReset }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, gap: "3", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, flexCol: true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(form.FieldLabel, { name: "", label: "\xA0" }),
-      /* @__PURE__ */ jsxRuntime.jsx(form.SubmitButton, { children: "Filter" })
+function Buttons({ handleReset }) {
+  return /* @__PURE__ */ jsxs("div", { dflex: true, gap: "3", children: [
+    /* @__PURE__ */ jsxs("div", { dflex: true, flexCol: true, children: [
+      /* @__PURE__ */ jsx(FieldLabel, { name: "", label: "\xA0" }),
+      /* @__PURE__ */ jsx(SubmitButton, { children: "Filter" })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, flexCol: true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(form.FieldLabel, { name: "", label: "\xA0" }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { scheme: "neutral", onClick: handleReset, children: "Reset" })
+    /* @__PURE__ */ jsxs("div", { dflex: true, flexCol: true, children: [
+      /* @__PURE__ */ jsx(FieldLabel, { name: "", label: "\xA0" }),
+      /* @__PURE__ */ jsx(Button, { scheme: "neutral", onClick: handleReset, children: "Reset" })
     ] })
   ] });
 }
-function ActionButton({
+
+function ActionButton$1({
   label,
   buttonProps,
   icon,
@@ -685,16 +708,16 @@ function ActionButton({
   errorMsg,
   invalidateParent
 }) {
-  const mutation = invalidateParent ? api.useInvalidateParentMutation(queryFn, queryKey) : api.useApiMutation(queryFn, queryKey);
-  const mutate = api.useMutate(
+  const mutation = invalidateParent ? useInvalidateParentMutation(queryFn, queryKey) : useApiMutation(queryFn, queryKey);
+  const mutate = useMutate(
     mutation,
     {
       successMsg,
       errorMsg
     }
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Button,
+  return /* @__PURE__ */ jsxs(
+    Button,
     {
       display: "flex",
       alignItems: "center",
@@ -703,18 +726,20 @@ function ActionButton({
       onClick: mutate,
       disabled: mutation.isLoading,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
         label
       ]
     }
   );
 }
+
 function TableMassActions({ actions }) {
-  const { ids } = table.useTableContext();
+  const { ids } = useTableContext();
   const showMassActions = ids && ids.length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Collapse, { in: showMassActions, style: { overflow: showMassActions ? "initial" : "hidden" }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, gap: "3", flexWrap: true, alignItems: "center", px: "8", pt: "5", children: actions.map((action, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: action.type == "button" && !action.showConfirmationDialog && /* @__PURE__ */ jsxRuntime.jsx(ActionButton, { label: action.label, queryFn: action.queryFn, queryKey: action.queryKey, buttonProps: action.buttonProps }) }, index)) }) });
+  return /* @__PURE__ */ jsx(Collapse, { in: showMassActions, style: { overflow: showMassActions ? "initial" : "hidden" }, children: /* @__PURE__ */ jsx("div", { dflex: true, gap: "3", flexWrap: true, alignItems: "center", px: "8", pt: "5", children: actions.map((action, index) => /* @__PURE__ */ jsx("div", { children: action.type == "button" && !action.showConfirmationDialog && /* @__PURE__ */ jsx(ActionButton$1, { label: action.label, queryFn: action.queryFn, queryKey: action.queryKey, buttonProps: action.buttonProps }) }, index)) }) });
 }
-var defaultErrorMsg = "Oops, something went wrong...";
+
+const defaultErrorMsg$1 = "Oops, something went wrong...";
 function nonNullValues(data) {
   if (data) {
     const nonNullData = { ...data };
@@ -728,14 +753,14 @@ function ItemEditDialog({
   initialValues,
   itemLabel,
   queryId = "",
-  api: api$1,
+  api,
   queryFetchOptions,
   querySaveOptions,
   onSuccess,
   onFetchError,
-  fetchErrorMsg = defaultErrorMsg,
+  fetchErrorMsg = defaultErrorMsg$1,
   onSaveError,
-  saveErrorMsg = defaultErrorMsg,
+  saveErrorMsg = defaultErrorMsg$1,
   fetchToFormData,
   formToQueryData,
   invalidateQueriesOnSuccess = true,
@@ -745,41 +770,41 @@ function ItemEditDialog({
   saveLabel,
   size = "lg",
   title,
-  form: form$1,
+  form,
   show,
   onClose,
   formikProps,
   ...props
 }) {
-  const { isInitialLoading, isFetching, data, isError, error, refetch } = api.useApiQuery(api$1.queryKey, api$1.get, queryId, {
+  const { isInitialLoading, isFetching, data, isError, error, refetch } = useApiQuery(api.queryKey, api.get, queryId, {
     enabled: !/*queryId == 0 || */
     (queryId == "" || queryId == null || queryId == void 0),
     // means than this query is only enabled if the id is defined
     onError: onFetchError,
     ...queryFetchOptions
   });
-  const mutation = invalidateQueriesOnSuccess ? api.useInvalidateParentMutation(api$1.upsert, invalidateQueryKey ?? api$1.queryKey, querySaveOptions) : api.useApiMutation(api$1.upsert, api$1.queryKey, queryId, querySaveOptions);
-  const retry = React8__default.default.useCallback(() => refetch(), [refetch]);
-  const saveItem = React8__default.default.useCallback(async (item, actions) => {
+  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(api.upsert, invalidateQueryKey ?? api.queryKey, querySaveOptions) : useApiMutation(api.upsert, api.queryKey, queryId, querySaveOptions);
+  const retry = React.useCallback(() => refetch(), [refetch]);
+  const saveItem = React.useCallback(async (item, actions) => {
     mutation.reset();
     const formItem = formToQueryData ? formToQueryData(item) : { ...item };
     await mutation.mutateAsync(formItem).then((response) => {
       if (onSuccess)
         onSuccess(formItem, response);
       else
-        reactToastify.toast.success(`${title ? title(formItem) : formItem.name ?? formItem.title} ${queryId ? "saved" : "created"}`);
+        toast.success(`${title ? title(formItem) : formItem.name ?? formItem.title} ${queryId ? "saved" : "created"}`);
       onClose?.();
     }).catch((error2) => {
       console.error("on error", error2);
       if (onSaveError)
         onSaveError(item);
       else
-        reactToastify.toast.error(`Couldn't save ${title ? title(formItem) : formItem.name ?? formItem.title}`);
+        toast.error(`Couldn't save ${title ? title(formItem) : formItem.name ?? formItem.title}`);
       actions.setSubmitting(false);
     });
   }, [mutation, formToQueryData, onSuccess, onSaveError, onClose]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Modal,
+  return /* @__PURE__ */ jsxs(
+    Modal,
     {
       size,
       show,
@@ -788,28 +813,28 @@ function ItemEditDialog({
       transition: true,
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Header, { children: [
+        /* @__PURE__ */ jsxs(Modal.Header, { children: [
           !isInitialLoading && queryId && `Edit ${title ? title(data) : data?.["name"] ?? data?.["title"] ?? data?.["name"] ?? ""}`,
           !queryId && `Create new ${itemLabel ?? "item"}`,
-          Array.isArray(form$1) && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {})
+          Array.isArray(form) && /* @__PURE__ */ jsx(Fragment, {})
         ] }),
-        isInitialLoading && /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(components.QueryLoadingState, { minW: "72" }) }),
-        isError && /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(components.RetryOnError, { label: `${fetchErrorMsg} ${error}`, onClick: retry }) }),
-        !isInitialLoading && !isError && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
-          formik.Formik,
+        isInitialLoading && /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx(QueryLoadingState, { minW: "72" }) }),
+        isError && /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx(RetryOnError, { label: `${fetchErrorMsg} ${error}`, onClick: retry }) }),
+        !isInitialLoading && !isError && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+          Formik,
           {
             initialValues: fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(initialValues(data)) ?? {},
             onSubmit: saveItem,
             ...formikProps,
-            children: ({ setFieldValue, dirty, handleSubmit, isValid, values }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { pb: "6", children: /* @__PURE__ */ jsxRuntime.jsxs(formik.Form, { children: [
-                React8__default.default.isValidElement(form$1) && form$1,
-                Array.isArray(form$1) && /* @__PURE__ */ jsxRuntime.jsx(form.FormRenderer, { form: form$1 }),
-                react.isFunction(form$1) && /* @__PURE__ */ jsxRuntime.jsx(form.FormRenderer, { form: form$1(data ?? values) })
+            children: ({ setFieldValue, dirty, handleSubmit, isValid, values }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Modal.Body, { pb: "6", children: /* @__PURE__ */ jsxs(Form, { children: [
+                React.isValidElement(form) && form,
+                Array.isArray(form) && /* @__PURE__ */ jsx(FormRenderer, { form }),
+                isFunction(form) && /* @__PURE__ */ jsx(FormRenderer, { form: form(data ?? values) })
               ] }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.Button,
+              /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
+                /* @__PURE__ */ jsx(
+                  Button,
                   {
                     disabled: mutation.isLoading,
                     onClick: onClose,
@@ -818,8 +843,8 @@ function ItemEditDialog({
                     children: cancelLabel
                   }
                 ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.Button,
+                /* @__PURE__ */ jsx(
+                  Button,
                   {
                     type: "submit",
                     disabled: !dirty || mutation.isLoading,
@@ -831,19 +856,20 @@ function ItemEditDialog({
             ] })
           }
         ) }),
-        mutation.isLoading && /* @__PURE__ */ jsxRuntime.jsx(components.ModalLoadingOverlay, {})
+        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
       ]
     }
   );
 }
-function QueryWrapperDialog({ api: api$1, fn, transformFn, config, onClose, queryId, invalidateQueryKey }) {
-  const { data, isFetching } = api.useApiQuery(
-    api$1.queryKey,
-    fn === "get" || fn === "getTransformed" ? api$1.get : api$1.getAll,
+
+function QueryWrapperDialog({ api, fn, transformFn, config, onClose, queryId, invalidateQueryKey }) {
+  const { data, isFetching } = useApiQuery(
+    api.queryKey,
+    fn === "get" || fn === "getTransformed" ? api.get : api.getAll,
     void 0,
     { retryOnMount: false, refetchOnMount: false, refetchOnWindowFocus: false }
   );
-  const transformedData = React8__default.default.useMemo(() => {
+  const transformedData = React.useMemo(() => {
     if (data && (fn === "getTransformed" || fn === "getAllTransformed")) {
       if (!transformFn)
         console.warn(`QueryWrapperDialog: you forgot to pass transformFn as parameter for fn ${fn}`);
@@ -853,10 +879,11 @@ function QueryWrapperDialog({ api: api$1, fn, transformFn, config, onClose, quer
   }, [data, fn, transformFn]);
   if (isFetching)
     return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(ItemEditDialog, { ...config(transformedData), queryId, invalidateQueryKey, show: true, onClose });
+  return /* @__PURE__ */ jsx(ItemEditDialog, { ...config(transformedData), queryId, invalidateQueryKey, show: true, onClose });
 }
+
 function MultiQueryWrapperDialog({ queries, config, onClose, queryId, invalidateQueryKey }) {
-  const { data, isFetching, isError } = api.useApiQueries(queries.map((q) => ({
+  const { data, isFetching, isError } = useApiQueries(queries.map((q) => ({
     queryKey: q.api.queryKey,
     queryFn: q.fn == "get" ? q.api.get : q.api.getAll,
     queryOptions: {
@@ -864,33 +891,36 @@ function MultiQueryWrapperDialog({ queries, config, onClose, queryId, invalidate
       staleTime: q.cache === false ? 0 : void 0
     }
   })));
-  const transformedData = React8__default.default.useMemo(() => {
+  const transformedData = React.useMemo(() => {
     return data?.map((d, index) => queries[index]?.transformFn ? queries[index]?.transformFn?.(d) : d);
   }, [data, queries]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ItemEditDialog, { isPreloading: isFetching, ...config(...transformedData), queryId, invalidateQueryKey, show: true, onClose });
+  return /* @__PURE__ */ jsx(ItemEditDialog, { isPreloading: isFetching, ...config(...transformedData), queryId, invalidateQueryKey, show: true, onClose });
 }
+
 function DialogRenderer({ config, onClose, invalidateQueryKey, queryId }) {
   const { type, ...props } = config;
   if (config.type === "dialog")
-    return /* @__PURE__ */ jsxRuntime.jsx(ItemEditDialog, { ...props, queryId, invalidateQueryKey, show: true, onClose });
+    return /* @__PURE__ */ jsx(ItemEditDialog, { ...props, queryId, invalidateQueryKey, show: true, onClose });
   if (config.type === "query")
-    return /* @__PURE__ */ jsxRuntime.jsx(QueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
+    return /* @__PURE__ */ jsx(QueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
   if (config.type === "multiQuery")
-    return /* @__PURE__ */ jsxRuntime.jsx(MultiQueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
+    return /* @__PURE__ */ jsx(MultiQueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
   return null;
 }
+
 function RefreshButton({ queryKey }) {
-  const invalidate = api.useInvalidateQuery(queryKey);
-  reactHotkeysHook.useHotkeys("ctrl+r", () => invalidate(), { preventDefault: true }, [invalidate]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ButtonBarButton, { scheme: "dark", size: "sm", aspectRatio: "square", variant: "borderless", onClick: invalidate, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: js.mdiRefresh }) });
+  const invalidate = useInvalidateQuery(queryKey);
+  useHotkeys("ctrl+r", () => invalidate(), { preventDefault: true }, [invalidate]);
+  return /* @__PURE__ */ jsx(ButtonBarButton, { scheme: "dark", size: "sm", aspectRatio: "square", variant: "borderless", onClick: invalidate, children: /* @__PURE__ */ jsx(Icon, { path: mdiRefresh }) });
 }
+
 function ItemDeleteDialog({
   title,
   actionButtonLabel,
   closeActionButtonLabel = "Cancel",
   itemLabel,
   queryId = "",
-  api: api$1,
+  api,
   apiFn,
   invalidateQueriesOnSuccess = true,
   invalidateQueryKey,
@@ -902,15 +932,15 @@ function ItemDeleteDialog({
   onSuccess,
   ...props
 }) {
-  const fn = apiFn ? api$1[apiFn] : api$1.delete;
-  const mutation = invalidateQueriesOnSuccess ? api.useInvalidateParentMutation(fn, invalidateQueryKey ?? api$1.queryKey) : api.useApiMutation(fn, api$1.queryKey);
-  const mutate = api.useMutate(mutation, { onSuccess: () => {
+  const fn = apiFn ? api[apiFn] : api.delete;
+  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(fn, invalidateQueryKey ?? api.queryKey) : useApiMutation(fn, api.queryKey);
+  const mutate = useMutate(mutation, { onSuccess: () => {
     onClose?.();
     onSuccess?.();
   } });
-  const handleDelete = React8__default.default.useCallback(() => mutate(queryId), [mutate, queryId]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Modal,
+  const handleDelete = React.useCallback(() => mutate(queryId), [mutate, queryId]);
+  return /* @__PURE__ */ jsxs(
+    Modal,
     {
       size,
       show,
@@ -920,14 +950,14 @@ function ItemDeleteDialog({
       transition: true,
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Header, { children: title || `Delete ${itemLabel}` }),
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Body, { pb: "6", children: [
+        /* @__PURE__ */ jsx(Modal.Header, { children: title || `Delete ${itemLabel}` }),
+        /* @__PURE__ */ jsxs(Modal.Body, { pb: "6", children: [
           !msg && `Do you really want to delete ${itemLabel}?`,
-          msg && react.runIfFn(msg, itemLabel)
+          msg && runIfFn(msg, itemLabel)
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
+        /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
+          /* @__PURE__ */ jsx(
+            Button,
             {
               disabled: mutation.isPending,
               onClick: onClose,
@@ -937,37 +967,38 @@ function ItemDeleteDialog({
               children: closeActionButtonLabel
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { scheme: "danger", disabled: mutation.isPending, onClick: handleDelete, children: actionButtonLabel || "Delete" })
+          /* @__PURE__ */ jsx(Button, { scheme: "danger", disabled: mutation.isPending, onClick: handleDelete, children: actionButtonLabel || "Delete" })
         ] }),
-        mutation.isPending && /* @__PURE__ */ jsxRuntime.jsx(components.ModalLoadingOverlay, {})
+        mutation.isPending && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
       ]
     }
   );
 }
-var [provider2, useContext2] = react.createContext();
+
+const [provider, useContext] = createContext();
 function TableViewProvider({ editView, deleteItem, queryKey, children }) {
-  const openLink = hooks.useOpenLink();
-  const navigate = reactRouterDom.useNavigate();
-  const [dialog, setDialog] = React8__default.default.useState(null);
-  const onCloseDialog = React8__default.default.useCallback(() => setDialog(null), [setDialog]);
-  const onAction = React8__default.default.useCallback((action, item) => {
+  const openLink = useOpenLink();
+  const navigate = useNavigate();
+  const [dialog, setDialog] = React.useState(null);
+  const onCloseDialog = React.useCallback(() => setDialog(null), [setDialog]);
+  const onAction = React.useCallback((action, item) => {
     switch (action.type) {
       case "view": {
-        navigate(react.runIfFn(action.path, item));
+        navigate(runIfFn(action.path, item));
         break;
       }
       case "link": {
-        openLink(`${env.AppEnv.websiteUrl()}/${react.runIfFn(action.path, item)}`);
+        openLink(`${AppEnv.websiteUrl()}/${runIfFn(action.path, item)}`);
         break;
       }
       case "edit": {
-        const editConfig = react.runIfFn(editView, item);
+        const editConfig = runIfFn(editView, item);
         if (editConfig) {
           if (editConfig.type == "customDialog") {
             setDialog(editConfig.render({ show: true, onClose: onCloseDialog }));
           } else {
             setDialog(
-              /* @__PURE__ */ jsxRuntime.jsx(
+              /* @__PURE__ */ jsx(
                 DialogRenderer,
                 {
                   onClose: onCloseDialog,
@@ -982,9 +1013,9 @@ function TableViewProvider({ editView, deleteItem, queryKey, children }) {
         break;
       }
       case "delete": {
-        const deleteConfig = react.runIfFn(deleteItem, item);
+        const deleteConfig = runIfFn(deleteItem, item);
         setDialog(
-          /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ jsx(
             ItemDeleteDialog,
             {
               show: true,
@@ -993,7 +1024,7 @@ function TableViewProvider({ editView, deleteItem, queryKey, children }) {
               invalidateQueryKey: queryKey,
               msg: item.msg,
               ...deleteConfig,
-              itemLabel: react.runIfFn(deleteConfig.itemLabel, item)
+              itemLabel: runIfFn(deleteConfig.itemLabel, item)
             }
           )
         );
@@ -1001,27 +1032,29 @@ function TableViewProvider({ editView, deleteItem, queryKey, children }) {
       }
     }
   }, [navigate, editView, deleteItem]);
-  const Provider = provider2;
+  const Provider = provider;
   const value = {
     dialog,
     onAction
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(Provider, { value, children });
+  return /* @__PURE__ */ jsx(Provider, { value, children });
 }
-function TableRowPublishPostButton({ id, api: api$1, status, invalidateQueryKey, ...props }) {
+
+function TableRowPublishPostButton$1({ id, api, status, invalidateQueryKey, ...props }) {
   const isDraft = status == "draft";
-  const mutation = api.useInvalidateParentMutation(isDraft ? api$1.publish : api$1.unpublish, invalidateQueryKey ?? api$1.queryKey, { networkMode: "always" });
-  const publish = React8__default.default.useCallback((event) => {
+  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey ?? api.queryKey, { networkMode: "always" });
+  const publish = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
     mutation.reset();
-    mutation.mutateAsync(id).then(() => reactToastify.toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => reactToastify.toast.error(`Error: ${error}`));
+    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
   }, [mutation, id]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "borderless", corners: "square", scheme: "dark", onClick: publish, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: isDraft ? js.mdiPublish : js.mdiPublishOff, size: "sm" }) });
+  return /* @__PURE__ */ jsx(Button, { variant: "borderless", corners: "square", scheme: "dark", onClick: publish, ...props, children: /* @__PURE__ */ jsx(Icon, { path: isDraft ? mdiPublish : mdiPublishOff, size: "sm" }) });
 }
+
 function TableRowActionButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Button,
+  return /* @__PURE__ */ jsxs(
+    Button,
     {
       dflex: true,
       alignContent: "center",
@@ -1035,29 +1068,30 @@ function TableRowActionButton({ icon, children, ...props }) {
       gap: "2",
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon, size: "sm" }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "sm" }),
         children
       ]
     }
   );
 }
+
 function TableRowActionsView({ row, onAction, rowActions, api, queryKey }) {
   const item = row.original;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, w: "full", alignItems: "stretch", placeContent: "end", h: "full", children: react.runIfFn(rowActions, item)?.map(
-    (action, index) => /* @__PURE__ */ jsxRuntime.jsxs(React8__default.default.Fragment, { children: [
-      action.type === "publish" && /* @__PURE__ */ jsxRuntime.jsx(TableRowPublishPostButton, { id: item.id, api: action.api ?? api, status: item.status, invalidateQueryKey: queryKey }),
-      action.type == "custom" && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: action.component(item, queryKey, action.icon, action.label) }),
-      !["publish", "custom"].includes(action.type) && /* @__PURE__ */ jsxRuntime.jsx(ActionButton2, { onClick: () => onAction(action, item), scheme: schemes[action.type], children: /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icons[action.type], size: "sm" }) })
+  return /* @__PURE__ */ jsx("div", { dflex: true, w: "full", alignItems: "stretch", placeContent: "end", h: "full", children: runIfFn(rowActions, item)?.map(
+    (action, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+      action.type === "publish" && /* @__PURE__ */ jsx(TableRowPublishPostButton$1, { id: item.id, api: action.api ?? api, status: item.status, invalidateQueryKey: queryKey }),
+      action.type == "custom" && /* @__PURE__ */ jsx(Fragment, { children: action.component(item, queryKey, action.icon, action.label) }),
+      !["publish", "custom"].includes(action.type) && /* @__PURE__ */ jsx(ActionButton, { onClick: () => onAction(action, item), scheme: schemes$1[action.type], children: /* @__PURE__ */ jsx(Icon, { path: icons[action.type], size: "sm" }) })
     ] }, index)
   ) });
 }
-function ActionButton2({ onClick, ...props }) {
-  const handleClick = React8__default.default.useCallback((event) => {
+function ActionButton({ onClick, ...props }) {
+  const handleClick = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
     onClick?.(event);
   }, [onClick]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsx(
     TableRowActionButton,
     {
       onClick: handleClick,
@@ -1065,15 +1099,15 @@ function ActionButton2({ onClick, ...props }) {
     }
   );
 }
-var icons = {
-  "link": js.mdiOpenInNew,
-  "view": js.mdiEye,
-  "edit": js.mdiPencil,
-  "delete": js.mdiDelete,
-  "publish": js.mdiDelete,
+const icons = {
+  "link": mdiOpenInNew,
+  "view": mdiEye,
+  "edit": mdiPencil,
+  "delete": mdiDelete,
+  "publish": mdiDelete,
   "custom": ""
 };
-var schemes = {
+const schemes$1 = {
   "link": "dark",
   "view": "dark",
   "edit": "dark",
@@ -1081,40 +1115,41 @@ var schemes = {
   "publish": "dark",
   "custom": "dark"
 };
+
 function useTableProps(api, table, rowActions, queryParams) {
-  const navigate = reactRouterDom.useNavigate();
-  const nextRouter = router.useRouter();
-  const openLink = hooks.useOpenLink();
-  const { onAction } = useContext2();
+  const navigate = useNavigate();
+  const nextRouter = useRouter();
+  const openLink = useOpenLink();
+  const { onAction } = useContext();
   const { onRowClick, columns: c, ...props } = table;
-  const onRowClickHandler = React8__default.default.useCallback((item) => {
-    const config = react.runIfFn(onRowClick, item);
+  const onRowClickHandler = React.useCallback((item) => {
+    const config = runIfFn(onRowClick, item);
     if (config) {
       switch (config.type) {
         case "navigate": {
-          navigate(react.runIfFn(config.path, item) ?? "");
+          navigate(runIfFn(config.path, item) ?? "");
           break;
         }
         case "nextpush": {
-          nextRouter.push(react.runIfFn(config.path, item));
+          nextRouter.push(runIfFn(config.path, item));
           break;
         }
         case "link": {
-          openLink(`${env.AppEnv.websiteUrl()}/${react.runIfFn(config.path, item)}`);
+          openLink(`${AppEnv.websiteUrl()}/${runIfFn(config.path, item)}`);
           break;
         }
       }
     }
   }, [navigate, onRowClick]);
-  const columns = React8__default.default.useMemo(() => {
+  const columns = React.useMemo(() => {
     const columns2 = table.columns.concat([]);
     if (rowActions) {
       columns2.push(
-        reactTable.createColumnHelper().display(
+        createColumnHelper().display(
           {
             id: "actions",
             header: "Actions",
-            cell: (props2) => /* @__PURE__ */ jsxRuntime.jsx(TableRowActionsView, { row: props2.row, onAction, rowActions, api, queryKey: api.queryKey })
+            cell: (props2) => /* @__PURE__ */ jsx(TableRowActionsView, { row: props2.row, onAction, rowActions, api, queryKey: api.queryKey })
           }
         )
       );
@@ -1129,8 +1164,9 @@ function useTableProps(api, table, rowActions, queryParams) {
   tableProps.queryFn = api.search;
   return tableProps;
 }
+
 function useId(queryField) {
-  const params = reactRouterDom.useParams();
+  const params = useParams();
   if (queryField === void 0)
     return void 0;
   const { [queryField]: id } = params;
@@ -1138,16 +1174,16 @@ function useId(queryField) {
 }
 function TableView({ queryField, title, subtitle, screen, ...props }) {
   const id = useId(queryField);
-  const _screen = react.runIfFn(screen, id);
-  return /* @__PURE__ */ jsxRuntime.jsx(PageContainer, { bgColor: "white", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(TableContainer, { columns: _screen.table.columns, initialVisibleColumns: _screen.table.initialVisibleColumns, filtersMethod: _screen.table.filtersMethod, children: /* @__PURE__ */ jsxRuntime.jsx(TT, { id, title, subtitle, screen: _screen }) }) });
+  const _screen = runIfFn(screen, id);
+  return /* @__PURE__ */ jsx(PageContainer, { bgColor: "white", ...props, children: /* @__PURE__ */ jsx(TableContainer, { columns: _screen.table.columns, initialVisibleColumns: _screen.table.initialVisibleColumns, filtersMethod: _screen.table.filtersMethod, children: /* @__PURE__ */ jsx(TT, { id, title, subtitle, screen: _screen }) }) });
 }
 function TT({ id, title, subtitle, screen }) {
-  const { setRowSelection } = table.useTableContext();
-  const { api, table: table$1, filters, massActions, buttonBar, rowActions, createView, editView, deleteItem, breadcrumbs } = screen;
-  const tableApi = react.runIfFn(api, id ?? "");
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(TableTopBar, { title, breadcrumbs, children: /* @__PURE__ */ jsxRuntime.jsx(TableButtonBar, { buttonBar, createView, editView, api: tableApi, queryKey: tableApi.queryKey, children: filters && /* @__PURE__ */ jsxRuntime.jsx(TableFilterButton, {}) }) }),
-    filters && /* @__PURE__ */ jsxRuntime.jsx(
+  const { setRowSelection } = useTableContext();
+  const { api, table, filters, massActions, buttonBar, rowActions, createView, editView, deleteItem, breadcrumbs } = screen;
+  const tableApi = runIfFn(api, id ?? "");
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(TableTopBar, { title, breadcrumbs, children: /* @__PURE__ */ jsx(TableButtonBar, { buttonBar, createView, editView, api: tableApi, queryKey: tableApi.queryKey, children: filters && /* @__PURE__ */ jsx(TableFilterButton, {}) }) }),
+    filters && /* @__PURE__ */ jsx(
       TableFilters,
       {
         form: filters.form,
@@ -1156,28 +1192,28 @@ function TT({ id, title, subtitle, screen }) {
         processInput: filters.processInput
       }
     ),
-    massActions && /* @__PURE__ */ jsxRuntime.jsx(TableMassActions, { actions: massActions.items }),
-    /* @__PURE__ */ jsxRuntime.jsxs(TableViewProvider, { queryKey: tableApi.queryKey, editView, deleteItem, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(TableWrapper, { table: { ...table$1, onSelectionChange: setRowSelection }, rowActions, api: tableApi, subtitle, queryParams: screen.queryParams }),
-      /* @__PURE__ */ jsxRuntime.jsx(TableDialogManager, {})
+    massActions && /* @__PURE__ */ jsx(TableMassActions, { actions: massActions.items }),
+    /* @__PURE__ */ jsxs(TableViewProvider, { queryKey: tableApi.queryKey, editView, deleteItem, children: [
+      /* @__PURE__ */ jsx(TableWrapper, { table: { ...table, onSelectionChange: setRowSelection }, rowActions, api: tableApi, subtitle, queryParams: screen.queryParams }),
+      /* @__PURE__ */ jsx(TableDialogManager, {})
     ] })
   ] });
 }
 function TableButtonBar({ buttonBar, queryKey, createView, editView, api, children }) {
-  const createDialogFn = React8__default.default.useCallback((data) => {
+  const createDialogFn = React.useCallback((data) => {
     return (onClose) => {
-      const view = react.runIfFn(createView, data) ?? react.runIfFn(editView, null);
+      const view = runIfFn(createView, data) ?? runIfFn(editView, null);
       if (view.type == "customDialog")
         return view.render({ show: true, onClose });
       else
-        return /* @__PURE__ */ jsxRuntime.jsx(DialogRenderer, { config: view, onClose, invalidateQueryKey: api.queryKey });
+        return /* @__PURE__ */ jsx(DialogRenderer, { config: view, onClose, invalidateQueryKey: api.queryKey });
     };
   }, [createView, editView, api]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(ButtonBar, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(RefreshButton, { queryKey }),
+  return /* @__PURE__ */ jsxs(ButtonBar, { children: [
+    /* @__PURE__ */ jsx(RefreshButton, { queryKey }),
     buttonBar && buttonBar.map(
-      (button, index) => /* @__PURE__ */ jsxRuntime.jsxs(React8__default.default.Fragment, { children: [
-        button.type === "create" && editView && /* @__PURE__ */ jsxRuntime.jsx(
+      (button, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+        button.type === "create" && editView && /* @__PURE__ */ jsx(
           TableCreateButton,
           {
             buildDialog: createDialogFn(button.data),
@@ -1185,33 +1221,34 @@ function TableButtonBar({ buttonBar, queryKey, createView, editView, api, childr
             children: button.label
           }
         ),
-        button.type === "invalidate" && /* @__PURE__ */ jsxRuntime.jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }),
+        button.type === "invalidate" && /* @__PURE__ */ jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }),
         button.type === "custom" && button.render()
       ] }, index)
     ),
     children
   ] });
 }
-function TableWrapper({ table: table$1, subtitle, rowActions, api, queryParams }) {
-  const tableProps = useTableProps(api, table$1, rowActions, queryParams);
-  const _subtitle = React8__default.default.useMemo(() => {
+function TableWrapper({ table, subtitle, rowActions, api, queryParams }) {
+  const tableProps = useTableProps(api, table, rowActions, queryParams);
+  const _subtitle = React.useMemo(() => {
     if (!subtitle)
       return void 0;
     return (data) => {
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { textSize: "lg", textColor: "#475569", fontWeight: "600", children: react.isFunction(subtitle) ? subtitle(data) : subtitle });
+      return /* @__PURE__ */ jsx("div", { textSize: "lg", textColor: "#475569", fontWeight: "600", children: isFunction(subtitle) ? subtitle(data) : subtitle });
     };
   }, [subtitle]);
-  return /* @__PURE__ */ jsxRuntime.jsx(table.Table, { ...tableProps, p: "8", title: _subtitle });
+  return /* @__PURE__ */ jsx(Table, { ...tableProps, p: "8", title: _subtitle });
 }
 function TableDialogManager() {
-  const { dialog } = useContext2();
+  const { dialog } = useContext();
   return dialog;
 }
+
 function useQueries(queries) {
-  const params = reactRouterDom.useParams();
-  const { data, isFetching, isError } = api.useApiQueries(queries.map((q) => {
+  const params = useParams();
+  const { data, isFetching, isError } = useApiQueries(queries.map((q) => {
     if (!q.queryField) {
-      const api2 = react.runIfFn(q.api);
+      const api2 = runIfFn(q.api);
       return {
         queryKey: api2.queryKey,
         queryFn: q.fn == "get" ? api2.get : api2.getAll,
@@ -1219,11 +1256,11 @@ function useQueries(queries) {
       };
     }
     const id = params[q.queryField];
-    const api = react.runIfFn(q.api, id);
+    const api = runIfFn(q.api, id);
     return {
       queryKey: api.queryKey,
       queryFn: q.fn == "get" ? api.get : api.getAll,
-      queryParam: q.fn == "getAll" ? q.params : react.isFunction(q.api) ? void 0 : id
+      queryParam: q.fn == "getAll" ? q.params : isFunction(q.api) ? void 0 : id
     };
   }));
   let transformedData = void 0;
@@ -1233,17 +1270,17 @@ function useQueries(queries) {
   return { data: transformedData, isFetching, isError };
 }
 function useInvalidate(queries) {
-  const queryClient = reactQuery.useQueryClient();
-  const params = reactRouterDom.useParams();
-  const invalidate = React8__default.default.useCallback(
+  const queryClient = useQueryClient();
+  const params = useParams();
+  const invalidate = React.useCallback(
     () => {
       const queryKeys = [];
       queries.forEach((q) => {
-        if (!q.queryField || !react.isFunction(q.api)) {
+        if (!q.queryField || !isFunction(q.api)) {
           queryKeys.push(q.api.queryKey);
         } else {
           const id = params[q.queryField];
-          const api = react.runIfFn(q.api, id);
+          const api = runIfFn(q.api, id);
           queryKeys.push(api.queryKey);
         }
       });
@@ -1262,29 +1299,32 @@ function MultiQueryWrapper({
   const { data, isFetching, isError } = useQueries(queries);
   const invalidate = useInvalidate(queries);
   if (isFetching)
-    return /* @__PURE__ */ jsxRuntime.jsx(components.QueryLoadingState, { w: "full", h: "100vh" });
+    return /* @__PURE__ */ jsx(QueryLoadingState, { w: "full", h: "100vh" });
   if (isError || !data)
-    return /* @__PURE__ */ jsxRuntime.jsx(components.RetryOnError, { p: "0", w: "full", h: "100vh", onClick: invalidate });
-  return /* @__PURE__ */ jsxRuntime.jsx(ScreenRenderer, { config: config(...data), tabbed, ...props });
+    return /* @__PURE__ */ jsx(RetryOnError, { p: "0", w: "full", h: "100vh", onClick: invalidate });
+  return /* @__PURE__ */ jsx(ScreenRenderer, { config: config(...data), tabbed, ...props });
 }
+
 function ScreenRenderer({ config, tabbed, ...props }) {
   if (config.type === "table")
-    return /* @__PURE__ */ jsxRuntime.jsx(TableView, { ...config, ...props });
+    return /* @__PURE__ */ jsx(TableView, { ...config, ...props });
   if (config.type === "tabbed")
-    return /* @__PURE__ */ jsxRuntime.jsx(TabbedView, { ...config, ...props });
+    return /* @__PURE__ */ jsx(TabbedView, { ...config, ...props });
   if (config.type === "details")
-    return /* @__PURE__ */ jsxRuntime.jsx(DetailsView, { ...config, tabbed, ...props });
+    return /* @__PURE__ */ jsx(DetailsView, { ...config, tabbed, ...props });
   if (config.type === "query")
-    return /* @__PURE__ */ jsxRuntime.jsx(QueryWrapper, { ...config, tabbed, ...props });
+    return /* @__PURE__ */ jsx(QueryWrapper, { ...config, tabbed, ...props });
   if (config.type === "multiQuery")
-    return /* @__PURE__ */ jsxRuntime.jsx(MultiQueryWrapper, { ...config, tabbed, ...props });
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
+    return /* @__PURE__ */ jsx(MultiQueryWrapper, { ...config, tabbed, ...props });
+  return /* @__PURE__ */ jsx(Fragment, {});
 }
+
 function Content({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { w: "100%", h: "100%", overflowY: "auto", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {}) });
+  return /* @__PURE__ */ jsx("div", { w: "100%", h: "100%", overflowY: "auto", ...props, children: /* @__PURE__ */ jsx(Outlet, {}) });
 }
+
 function SelectedIndicator({ darkMode }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       position: "absolute",
@@ -1297,9 +1337,10 @@ function SelectedIndicator({ darkMode }) {
     }
   );
 }
+
 function MenuButton({ depth, darkMode, icon, selected, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Button,
+  return /* @__PURE__ */ jsxs(
+    Button,
     {
       as: "li",
       minH: "8",
@@ -1320,19 +1361,20 @@ function MenuButton({ depth, darkMode, icon, selected, children, ...props }) {
       gap: "3",
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon, opacity: selected ? "100" : "60" }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon, opacity: selected ? "100" : "60" }),
         children
       ]
     }
   );
 }
-function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-  const location = reactRouterDom.useLocation();
+
+function MenuItem$1({ icon, path, depth, darkMode, subMenu, ...props }) {
+  const location = useLocation();
   const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-  const match = reactRouterDom.useMatch("/" + path) != null;
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(reactRouterDom.Link, { to: path, style: { position: "relative" }, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
+  const match = useMatch("/" + path) != null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Link$1, { to: path, style: { position: "relative" }, children: [
+      /* @__PURE__ */ jsx(
         MenuButton,
         {
           depth,
@@ -1342,10 +1384,10 @@ function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
           ...props
         }
       ),
-      match && /* @__PURE__ */ jsxRuntime.jsx(SelectedIndicator, { darkMode })
+      match && /* @__PURE__ */ jsx(SelectedIndicator, { darkMode })
     ] }),
-    subMenu?.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
-      MenuItem,
+    subMenu?.map((item, index) => /* @__PURE__ */ jsx(
+      MenuItem$1,
       {
         icon: item.icon,
         path: item.path,
@@ -1358,13 +1400,14 @@ function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
     ))
   ] });
 }
+
 function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-  const { pathname } = router.useRouter();
+  const { pathname } = useRouter();
   const selected = path == "/" ? pathname == "/" : pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
   const match = path == "/" ? pathname == "/" : pathname == (path.startsWith("/") ? path : `/${path}`);
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(Link__default.default, { href: path, style: { position: "relative" }, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Link, { href: path, style: { position: "relative" }, children: [
+      /* @__PURE__ */ jsx(
         MenuButton,
         {
           depth,
@@ -1374,9 +1417,9 @@ function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
           ...props
         }
       ),
-      match && /* @__PURE__ */ jsxRuntime.jsx(SelectedIndicator, { darkMode })
+      match && /* @__PURE__ */ jsx(SelectedIndicator, { darkMode })
     ] }),
-    subMenu?.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    subMenu?.map((item, index) => /* @__PURE__ */ jsx(
       NextMenuItem,
       {
         icon: item.icon,
@@ -1390,13 +1433,14 @@ function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
     ))
   ] });
 }
+
 function Menu({ darkMode, config, useNextRouter, ...props }) {
-  const Comp = useNextRouter ? NextMenuItem : MenuItem;
-  return /* @__PURE__ */ jsxRuntime.jsx("ul", { ...props, children: config.map((item, index) => {
+  const Comp = useNextRouter ? NextMenuItem : MenuItem$1;
+  return /* @__PURE__ */ jsx("ul", { ...props, children: config.map((item, index) => {
     if (item.type == "divider")
-      return /* @__PURE__ */ jsxRuntime.jsx(Divider, { title: item.label }, index);
+      return /* @__PURE__ */ jsx(Divider, { title: item.label }, index);
     if (item.type == "item") {
-      return /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ jsx(
         Comp,
         {
           icon: item.icon,
@@ -1412,7 +1456,7 @@ function Menu({ darkMode, config, useNextRouter, ...props }) {
   }) });
 }
 function Divider({ title }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       px: "2",
@@ -1427,13 +1471,14 @@ function Divider({ title }) {
     }
   );
 }
+
 function UserBlock({ color, darkMode, menuConfig, path }) {
-  const { isLoading, user } = auth.useSessionUser();
-  const navigate = reactRouterDom.useNavigate();
-  const handleClick = React8__default.default.useCallback(() => navigate(path), [navigate, path]);
+  const { isLoading, user } = useSessionUser();
+  const navigate = useNavigate();
+  const handleClick = React.useCallback(() => navigate(path), [navigate, path]);
   if (isLoading)
     return null;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       dflex: true,
@@ -1449,10 +1494,10 @@ function UserBlock({ color, darkMode, menuConfig, path }) {
       textColor: darkMode ? "white" : "slate-800",
       onClick: handleClick,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Avatar, { size: "sm", src: user?.media?.url ?? "", name: `${user?.firstname} ${user?.lastname}` }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { flexGrow: true, ms: "2", children: `${esToolkit.capitalize(user?.firstname || user?.lastname || "")}` }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.IconButton,
+        /* @__PURE__ */ jsx(Avatar, { size: "sm", src: user?.media?.url ?? "", name: `${user?.firstname} ${user?.lastname}` }),
+        /* @__PURE__ */ jsx("span", { flexGrow: true, ms: "2", children: `${capitalize(user?.firstname || user?.lastname || "")}` }),
+        /* @__PURE__ */ jsx(
+          IconButton,
           {
             variant: "borderless",
             corners: "pill",
@@ -1460,21 +1505,21 @@ function UserBlock({ color, darkMode, menuConfig, path }) {
             textColor: darkMode ? "white" : "slate-800",
             hover_textColor: darkMode ? "white" : "slate-800",
             hover_bgColor: `${color}-${darkMode ? "900" : "200"}`,
-            icon: js.mdiCog,
+            icon: mdiCog,
             onClick: handleClick
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(OverflowMenu, { color, darkMode, menuConfig })
+        /* @__PURE__ */ jsx(OverflowMenu, { color, darkMode, menuConfig })
       ]
     }
   );
 }
 function OverflowMenu({ color, darkMode, menuConfig }) {
-  const [showPopup, setShowPopup] = React8__default.default.useState(false);
-  const navigate = reactRouterDom.useNavigate();
-  const logout = auth.useSessionLogout(false);
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Popup,
+  const [showPopup, setShowPopup] = React.useState(false);
+  const navigate = useNavigate();
+  const logout = useSessionLogout(false);
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+    Popup,
     {
       show: showPopup,
       position: "relative",
@@ -1486,10 +1531,10 @@ function OverflowMenu({ color, darkMode, menuConfig }) {
       },
       onHide: () => setShowPopup(false),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.IconButton,
+        /* @__PURE__ */ jsx(
+          IconButton,
           {
-            icon: js.mdiDotsVertical,
+            icon: mdiDotsVertical,
             variant: "borderless",
             corners: "pill",
             scheme: "dark",
@@ -1498,7 +1543,7 @@ function OverflowMenu({ color, darkMode, menuConfig }) {
             hover_bgColor: `${color}-${darkMode ? "900" : "200"}`
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxs(
           "div",
           {
             bgColor: "white",
@@ -1514,11 +1559,11 @@ function OverflowMenu({ color, darkMode, menuConfig }) {
             children: [
               menuConfig && menuConfig.length > 0 && menuConfig.map((item, index) => {
                 if (item.type == "item") {
-                  return /* @__PURE__ */ jsxRuntime.jsx(MenuItem2, { icon: item.icon, onClick: () => navigate(item.path), children: item.label }, index);
+                  return /* @__PURE__ */ jsx(MenuItem, { icon: item.icon, onClick: () => navigate(item.path), children: item.label }, index);
                 }
                 return null;
               }),
-              /* @__PURE__ */ jsxRuntime.jsx(MenuItem2, { icon: js.mdiLogout, onClick: logout, children: "Logout" })
+              /* @__PURE__ */ jsx(MenuItem, { icon: mdiLogout, onClick: logout, children: "Logout" })
             ]
           }
         )
@@ -1526,14 +1571,14 @@ function OverflowMenu({ color, darkMode, menuConfig }) {
     }
   ) });
 }
-function MenuItem2({ icon, onClick, children, ...props }) {
-  const handleClick = React8__default.default.useCallback((e) => {
+function MenuItem({ icon, onClick, children, ...props }) {
+  const handleClick = React.useCallback((e) => {
     e.preventDefault();
     e.stopPropagation();
     onClick?.(e);
   }, []);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Button,
+  return /* @__PURE__ */ jsxs(
+    Button,
     {
       variant: "borderless",
       scheme: "dark",
@@ -1548,14 +1593,15 @@ function MenuItem2({ icon, onClick, children, ...props }) {
       textColor: "slate-700",
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon, size: "md" }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "md" }),
         children
       ]
     }
   );
 }
+
 function Sidebar({ show, logo, title, menuConfig, userMenuConfig, userSettingsPath, color, darkMode, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       dflex: true,
@@ -1567,8 +1613,8 @@ function Sidebar({ show, logo, title, menuConfig, userMenuConfig, userSettingsPa
       textColor: darkMode ? "white" : "slate-800",
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          components.FlexCenter,
+        /* @__PURE__ */ jsxs(
+          FlexCenter,
           {
             placeContent: "start",
             p: "4",
@@ -1578,23 +1624,23 @@ function Sidebar({ show, logo, title, menuConfig, userMenuConfig, userSettingsPa
             borderBColor: "slate-900",
             borderOpacity: "5",
             children: [
-              logo ?? /* @__PURE__ */ jsxRuntime.jsx(Logo, { width: 40, height: 40, darkMode }),
-              /* @__PURE__ */ jsxRuntime.jsx("h1", { textSize: "md", children: title || env.AppEnv.appName() })
+              logo ?? /* @__PURE__ */ jsx(Logo, { width: 40, height: 40, darkMode }),
+              /* @__PURE__ */ jsx("h1", { textSize: "md", children: title || AppEnv.appName() })
             ]
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(Menu, { overflowY: "auto", flexGrow: "1", p: "4", darkMode, config: menuConfig }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { p: "2", children: /* @__PURE__ */ jsxRuntime.jsx(UserBlock, { darkMode, color, menuConfig: userMenuConfig, path: userSettingsPath }) })
+        /* @__PURE__ */ jsx(Menu, { overflowY: "auto", flexGrow: "1", p: "4", darkMode, config: menuConfig }),
+        /* @__PURE__ */ jsx("div", { p: "2", children: /* @__PURE__ */ jsx(UserBlock, { darkMode, color, menuConfig: userMenuConfig, path: userSettingsPath }) })
       ]
     }
   );
 }
 function Logo({ width, height, darkMode, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    Image__default.default,
+  return /* @__PURE__ */ jsx("div", { ...props, children: /* @__PURE__ */ jsx(
+    Image,
     {
       src: `/logo_${darkMode ? "light" : "dark"}.png`,
-      alt: env.AppEnv.appName() || "",
+      alt: AppEnv.appName() || "",
       width,
       height,
       priority: true,
@@ -1602,8 +1648,9 @@ function Logo({ width, height, darkMode, ...props }) {
     }
   ) });
 }
+
 function AdminLayout({ color, darkMode, logo, title, menuConfig, userMenuConfig, userSettingsPath, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       w: "full",
@@ -1613,7 +1660,7 @@ function AdminLayout({ color, darkMode, logo, title, menuConfig, userMenuConfig,
       bgColor: `${color}-${darkMode ? "900" : "100"}`,
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsx(
           LeftPanel,
           {
             color,
@@ -1625,15 +1672,15 @@ function AdminLayout({ color, darkMode, logo, title, menuConfig, userMenuConfig,
             userSettingsPath
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { w: "screen", py: "2", pe: "2", children: /* @__PURE__ */ jsxRuntime.jsx(Content, { bgColor: "white", rounded: "lg", shadow: true }) })
+        /* @__PURE__ */ jsx("div", { w: "screen", py: "2", pe: "2", children: /* @__PURE__ */ jsx(Content, { bgColor: "white", rounded: "lg", shadow: true }) })
       ]
     }
   );
 }
 function LeftPanel({ color, darkMode, logo, title, menuConfig, userMenuConfig, userSettingsPath }) {
-  const [isOpen, __, toggle] = hooks.useBoolean(true);
-  reactHotkeysHook.useHotkeys("ctrl+t", () => toggle(), [toggle]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  const [isOpen, __, toggle] = useBoolean(true);
+  useHotkeys("ctrl+t", () => toggle(), [toggle]);
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       ms: isOpen ? "0" : "-14.5rem",
@@ -1641,7 +1688,7 @@ function LeftPanel({ color, darkMode, logo, title, menuConfig, userMenuConfig, u
       duration: "500",
       transform: true,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsx(
           Sidebar,
           {
             flexShrink: "0",
@@ -1654,10 +1701,10 @@ function LeftPanel({ color, darkMode, logo, title, menuConfig, userMenuConfig, u
             userSettingsPath
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.IconButton,
+        /* @__PURE__ */ jsx(
+          IconButton,
           {
-            icon: js.mdiArrowLeft,
+            icon: mdiArrowLeft,
             transition: "all",
             duration: "500",
             transform: true,
@@ -1675,7 +1722,8 @@ function LeftPanel({ color, darkMode, logo, title, menuConfig, userMenuConfig, u
     }
   );
 }
-var defaultErrorMsg2 = "Oops, something went wrong...";
+
+const defaultErrorMsg = "Oops, something went wrong...";
 function AttachDialog({
   queryId,
   queryKey,
@@ -1690,9 +1738,9 @@ function AttachDialog({
   itemLabel,
   onSuccess,
   onFetchError,
-  fetchErrorMsg = defaultErrorMsg2,
+  fetchErrorMsg = defaultErrorMsg,
   onSaveError,
-  saveErrorMsg = defaultErrorMsg2,
+  saveErrorMsg = defaultErrorMsg,
   invalidateQueriesOnSuccess = true,
   retryText = "Retry",
   cancelLabel = "Cancel",
@@ -1701,14 +1749,14 @@ function AttachDialog({
   getItemName,
   ...props
 }) {
-  const queryClient = reactQuery.useQueryClient();
-  const { data: attached, isInitialLoading: fetchLoading, isError: fetchError, refetch, error } = api.useApiQuery(queryKey, queryFetchFn);
-  const { data, isInitialLoading: fetchAllLoading, isError: fetchAllError, refetch: refetchAll, error: errorAll } = api.useApiQuery(queryFetchAllKey, queryFetchAllFn);
-  const [selectedResources, setSelectedResources] = React8__default.default.useState([]);
+  const queryClient = useQueryClient();
+  const { data: attached, isInitialLoading: fetchLoading, isError: fetchError, refetch, error } = useApiQuery(queryKey, queryFetchFn);
+  const { data, isInitialLoading: fetchAllLoading, isError: fetchAllError, refetch: refetchAll, error: errorAll } = useApiQuery(queryFetchAllKey, queryFetchAllFn);
+  const [selectedResources, setSelectedResources] = React.useState([]);
   const isLoading = fetchLoading || fetchAllLoading;
   const isError = fetchError || fetchAllError;
-  const mutation = api.useApiMutation(querySaveFn, queryKey, queryId);
-  const handleClick = React8__default.default.useCallback((event) => {
+  const mutation = useApiMutation(querySaveFn, queryKey, queryId);
+  const handleClick = React.useCallback((event) => {
     const id = event?.currentTarget.dataset.id ?? "";
     const arr = selectedResources.concat([]);
     const i = selectedResources.indexOf(id);
@@ -1718,19 +1766,19 @@ function AttachDialog({
       arr.push(id);
     setSelectedResources(arr);
   }, [selectedResources, setSelectedResources]);
-  const retry = React8__default.default.useCallback(() => {
+  const retry = React.useCallback(() => {
     if (fetchError)
       refetch();
     if (fetchAllError)
       refetchAll();
   }, [refetch, refetchAll, fetchError, fetchAllError]);
-  const saveItem = React8__default.default.useCallback(() => {
+  const saveItem = React.useCallback(() => {
     mutation.reset();
     mutation.mutateAsync({ resources: selectedResources }).then((response) => {
       if (onSuccess)
         onSuccess(response);
       else
-        reactToastify.toast.success(`${itemLabel} saved`);
+        toast.success(`${itemLabel} saved`);
       if (invalidateQueriesOnSuccess)
         queryClient.invalidateQueries({ queryKey });
       onClose?.();
@@ -1739,10 +1787,10 @@ function AttachDialog({
       if (onSaveError)
         onSaveError();
       else
-        reactToastify.toast.error(`Error adding ${itemLabel}`);
+        toast.error(`Error adding ${itemLabel}`);
     });
   }, [mutation, queryId, onSuccess, queryClient, onSaveError, onClose]);
-  const resources = React8__default.default.useMemo(() => {
+  const resources = React.useMemo(() => {
     let r = [];
     if (attached && data) {
       r = [].concat(data);
@@ -1751,12 +1799,12 @@ function AttachDialog({
         r = r.map((item) => {
           return { ...item, name: getItemName(item) };
         });
-      r = esToolkit.sortBy(r, ["name"]);
+      r = sortBy(r, ["name"]);
     }
     return r;
   }, [attached, data]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Modal,
+  return /* @__PURE__ */ jsxs(
+    Modal,
     {
       size,
       show,
@@ -1765,11 +1813,11 @@ function AttachDialog({
       transition: true,
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Header, { children: `Add ${itemLabel}` }),
-        isLoading && /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(components.QueryLoadingState, { minW: "72" }) }),
-        isError && /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(components.RetryOnError, { label: `${fetchErrorMsg} ${error}`, onClick: retry }) }),
-        !isLoading && !isError && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Body, { px: "0", pb: "6", maxH: "750px", overflow: "auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { dflex: true, flexCol: true, overflow: "auto", children: resources.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsx(Modal.Header, { children: `Add ${itemLabel}` }),
+        isLoading && /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx(QueryLoadingState, { minW: "72" }) }),
+        isError && /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx(RetryOnError, { label: `${fetchErrorMsg} ${error}`, onClick: retry }) }),
+        !isLoading && !isError && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Modal.Body, { px: "0", pb: "6", maxH: "750px", overflow: "auto", children: /* @__PURE__ */ jsx("div", { dflex: true, flexCol: true, overflow: "auto", children: resources.map((item) => /* @__PURE__ */ jsx(
             ListItem,
             {
               label: item.name,
@@ -1780,9 +1828,9 @@ function AttachDialog({
             },
             item.id
           )) }) }),
-          /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Button,
+          /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
+            /* @__PURE__ */ jsx(
+              Button,
               {
                 disabled: mutation.isLoading,
                 onClick: onClose,
@@ -1791,8 +1839,8 @@ function AttachDialog({
                 children: cancelLabel
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Button,
+            /* @__PURE__ */ jsx(
+              Button,
               {
                 type: "submit",
                 disabled: selectedResources.length == 0 || mutation.isLoading,
@@ -1802,13 +1850,13 @@ function AttachDialog({
             )
           ] })
         ] }),
-        mutation.isLoading && /* @__PURE__ */ jsxRuntime.jsx(components.ModalLoadingOverlay, {})
+        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
       ]
     }
   );
 }
 function ListItem({ label, value, checked, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       dflex: true,
@@ -1819,12 +1867,13 @@ function ListItem({ label, value, checked, ...props }) {
       cursor: "pointer",
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { flexGrow: true, children: label }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { name: `resources.${value}`, value, checked })
+        /* @__PURE__ */ jsx("span", { flexGrow: true, children: label }),
+        /* @__PURE__ */ jsx(Checkbox, { name: `resources.${value}`, value, checked })
       ]
     }
   );
 }
+
 function FormActionDialog({
   initialValues,
   itemLabel,
@@ -1844,14 +1893,14 @@ function FormActionDialog({
   saveLabel = "Send",
   size = "lg",
   title,
-  form: form$1,
+  form,
   show,
   onClose,
   formikProps,
   ...props
 }) {
-  const mutation = invalidateQueriesOnSuccess ? api.useInvalidateParentMutation(queryFn, queryKey, queryOptions) : api.useApiMutation(queryFn, queryKey, queryId, queryOptions);
-  const mutate = api.useMutate(mutation, {
+  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(queryFn, queryKey, queryOptions) : useApiMutation(queryFn, queryKey, queryId, queryOptions);
+  const mutate = useMutate(mutation, {
     onSuccess,
     successMsg,
     showSuccessMsg,
@@ -1860,8 +1909,8 @@ function FormActionDialog({
     showErrorMsg,
     processInput
   });
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Modal,
+  return /* @__PURE__ */ jsxs(
+    Modal,
     {
       size,
       show,
@@ -1870,21 +1919,21 @@ function FormActionDialog({
       transition: true,
       ...props,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Modal.Header, { children: title }),
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          form.FormProvider,
+        /* @__PURE__ */ jsx(Modal.Header, { children: title }),
+        /* @__PURE__ */ jsxs(
+          FormProvider,
           {
             initialValues: initialValues ?? {},
             onSubmit: mutate,
             ...formikProps,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Body, { pb: "6", children: [
-                React8__default.default.isValidElement(form$1) && form$1,
-                Array.isArray(form$1) && /* @__PURE__ */ jsxRuntime.jsx(form.FormRenderer, { form: form$1 })
+              /* @__PURE__ */ jsxs(Modal.Body, { pb: "6", children: [
+                React.isValidElement(form) && form,
+                Array.isArray(form) && /* @__PURE__ */ jsx(FormRenderer, { form })
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs(ui.Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.Button,
+              /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
+                /* @__PURE__ */ jsx(
+                  Button,
                   {
                     disabled: mutation.isLoading,
                     onClick: onClose,
@@ -1893,26 +1942,29 @@ function FormActionDialog({
                     children: cancelLabel
                   }
                 ),
-                /* @__PURE__ */ jsxRuntime.jsx(form.SubmitButton, { disabled: mutation.isLoading, children: saveLabel })
+                /* @__PURE__ */ jsx(SubmitButton, { disabled: mutation.isLoading, children: saveLabel })
               ] })
             ]
           }
         ),
-        mutation.isLoading && /* @__PURE__ */ jsxRuntime.jsx(components.ModalLoadingOverlay, {})
+        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
       ]
     }
   );
 }
-var PageStateContainer = React8__default.default.forwardRef(({ loading = false, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    loading && /* @__PURE__ */ jsxRuntime.jsx(components.QueryLoadingState, { w: "full", h: "100%" }),
-    !loading && /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { ref, center: true, size: "x2", dflex: true, flexCol: true, gap: "8", ...props, children })
+
+const PageStateContainer = React.forwardRef(({ loading = false, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    loading && /* @__PURE__ */ jsx(QueryLoadingState, { w: "full", h: "100%" }),
+    !loading && /* @__PURE__ */ jsx(Container, { ref, center: true, size: "x2", dflex: true, flexCol: true, gap: "8", ...props, children })
   ] });
 });
+
 function PageSubSectionTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { trait: "typo.h6", mb: "3", ...props, children });
+  return /* @__PURE__ */ jsx("div", { trait: "typo.h6", mb: "3", ...props, children });
 }
-var labels = {
+
+const labels = {
   draft: "Draft",
   published: "Published",
   pending: "Pending",
@@ -1920,7 +1972,7 @@ var labels = {
   partially_approved: "Partially Approved",
   rejected: "Rejected"
 };
-var schemes2 = {
+const schemes = {
   draft: "warning",
   published: "success",
   pending: "secondary",
@@ -1929,27 +1981,30 @@ var schemes2 = {
   rejected: "danger"
 };
 function StatusBadge({ status, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { size: "sm", variant: "glass", whiteSpace: "nowrap", rounded: "full", px: "3", scheme: schemes2[status], ...props, children: labels[status] });
+  return /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "glass", whiteSpace: "nowrap", rounded: "full", px: "3", scheme: schemes[status], ...props, children: labels[status] });
 }
+
 function TableRowViewButton({ path, ...props }) {
-  const openPage = React8__default.default.useCallback((event) => {
+  const openPage = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
-    window.open(`${env.AppEnv.websiteUrl()}/${path}`, "_blank");
+    window.open(`${AppEnv.websiteUrl()}/${path}`, "_blank");
   }, [path]);
-  return /* @__PURE__ */ jsxRuntime.jsx(TableRowActionButton, { icon: js.mdiOpenInNew, onClick: openPage, ...props });
+  return /* @__PURE__ */ jsx(TableRowActionButton, { icon: mdiOpenInNew, onClick: openPage, ...props });
 }
+
 function TableRowNavigateButton({ path, ...props }) {
-  const navigate = reactRouterDom.useNavigate();
-  const handleClick = React8__default.default.useCallback((event) => {
+  const navigate = useNavigate();
+  const handleClick = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
     navigate(`${path}`);
   }, [navigate, path]);
-  return /* @__PURE__ */ jsxRuntime.jsx(TableRowActionButton, { icon: js.mdiEye, onClick: handleClick, ...props });
+  return /* @__PURE__ */ jsx(TableRowActionButton, { icon: mdiEye, onClick: handleClick, ...props });
 }
+
 function TableRowActionDialogButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxs(
     DialogButton,
     {
       dflex: true,
@@ -1964,18 +2019,21 @@ function TableRowActionDialogButton({ icon, children, ...props }) {
       gap: "2",
       ...props,
       children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { path: icon, size: "sm" }),
+        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "sm" }),
         children
       ]
     }
   );
 }
+
 function TableRowEditButton({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TableRowActionDialogButton, { icon: js.mdiPencil, ...props, children });
+  return /* @__PURE__ */ jsx(TableRowActionDialogButton, { icon: mdiPencil, ...props, children });
 }
+
 function TableRowDeleteButton({ children, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TableRowActionDialogButton, { icon: js.mdiDelete, ...props, children });
+  return /* @__PURE__ */ jsx(TableRowActionDialogButton, { icon: mdiDelete, ...props, children });
 }
+
 function TableRowActionBar({
   publishId,
   viewPath,
@@ -1985,70 +2043,25 @@ function TableRowActionBar({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { dflex: true, spaceX: "1", placeContent: "end", ...props, children: [
-    viewPath && /* @__PURE__ */ jsxRuntime.jsx(TableRowViewButton, { path: viewPath }),
-    navigatePath && /* @__PURE__ */ jsxRuntime.jsx(TableRowNavigateButton, { path: navigatePath }),
-    editDialog && /* @__PURE__ */ jsxRuntime.jsx(TableRowEditButton, { buildDialog: editDialog }),
-    deleteDialog && /* @__PURE__ */ jsxRuntime.jsx(TableRowDeleteButton, { buildDialog: deleteDialog }),
+  return /* @__PURE__ */ jsxs("div", { dflex: true, spaceX: "1", placeContent: "end", ...props, children: [
+    viewPath && /* @__PURE__ */ jsx(TableRowViewButton, { path: viewPath }),
+    navigatePath && /* @__PURE__ */ jsx(TableRowNavigateButton, { path: navigatePath }),
+    editDialog && /* @__PURE__ */ jsx(TableRowEditButton, { buildDialog: editDialog }),
+    deleteDialog && /* @__PURE__ */ jsx(TableRowDeleteButton, { buildDialog: deleteDialog }),
     children
   ] });
 }
-function TableRowPublishPostButton2({ id, api: api$1, status, invalidateQueryKey, ...props }) {
+
+function TableRowPublishPostButton({ id, api, status, invalidateQueryKey, ...props }) {
   const isDraft = status == "draft";
-  const mutation = api.useInvalidateParentMutation(isDraft ? api$1.publish : api$1.unpublish, invalidateQueryKey ?? api$1.queryKey, { networkMode: "always" });
-  const publish = React8__default.default.useCallback((event) => {
+  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey ?? api.queryKey, { networkMode: "always" });
+  const publish = React.useCallback((event) => {
     event?.preventDefault();
     event?.stopPropagation();
     mutation.reset();
-    mutation.mutateAsync(id).then(() => reactToastify.toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => reactToastify.toast.error(`Error: ${error}`));
+    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
   }, [mutation, id]);
-  return /* @__PURE__ */ jsxRuntime.jsx(TableRowActionButton, { icon: isDraft ? js.mdiPublish : js.mdiPublishOff, onClick: publish, ...props });
-}
-
-exports.AdminLayout = AdminLayout;
-exports.AttachDialog = AttachDialog;
-exports.Breadcrumbs = Breadcrumbs;
-exports.ButtonBar = ButtonBar;
-exports.ButtonBarButton = ButtonBarButton;
-exports.ButtonBarDialogButton = ButtonBarDialogButton;
-exports.ButtonBarSubmitButton = ButtonBarSubmitButton;
-exports.DialogButton = DialogButton;
-exports.FormActionDialog = FormActionDialog;
-exports.InvalidateButton = InvalidateButton;
-exports.ItemDeleteDialog = ItemDeleteDialog;
-exports.ItemEditDialog = ItemEditDialog;
-exports.Menu = Menu;
-exports.NavigateButton = NavigateButton;
-exports.OrderCell = OrderCell;
-exports.PageContainer = PageContainer;
-exports.PageContentEditor = PageContentEditor;
-exports.PageMain = PageMain;
-exports.PageQueryStateContainer = PageQueryStateContainer;
-exports.PageSectionTitle = PageSectionTitle;
-exports.PageSidebar = PageSidebar;
-exports.PageSidebarSection = PageSidebarSection;
-exports.PageStateContainer = PageStateContainer;
-exports.PageSubSectionTitle = PageSubSectionTitle;
-exports.PageTabbedTopBar = PageTabbedTopBar;
-exports.PageTabbedTopBarProvider = PageTabbedTopBarProvider;
-exports.PageTitle = PageTitle;
-exports.PageTopBar = PageTopBar;
-exports.PageTopBarToolbar = PageTopBarToolbar;
-exports.PublishButton = PublishButton;
-exports.ScreenRenderer = ScreenRenderer;
-exports.SectionTitle = SectionTitle;
-exports.StatusBadge = StatusBadge;
-exports.TableContainer = TableContainer;
-exports.TableCreateButton = TableCreateButton;
-exports.TableFilterButton = TableFilterButton;
-exports.TableRowActionBar = TableRowActionBar;
-exports.TableRowActionButton = TableRowActionButton;
-exports.TableRowActionDialogButton = TableRowActionDialogButton;
-exports.TableRowDeleteButton = TableRowDeleteButton;
-exports.TableRowEditButton = TableRowEditButton;
-exports.TableRowNavigateButton = TableRowNavigateButton;
-exports.TableRowPublishPostButton = TableRowPublishPostButton2;
-exports.TableRowViewButton = TableRowViewButton;
-exports.TableTopBar = TableTopBar;
-exports.UpdateButton = UpdateButton;
-exports.ViewButton = ViewButton;
+  return /* @__PURE__ */ jsx(TableRowActionButton, { icon: isDraft ? mdiPublish : mdiPublishOff, onClick: publish, ...props });
+}
+
+export { AdminLayout, AttachDialog, Breadcrumbs, ButtonBar, ButtonBarButton, ButtonBarDialogButton, ButtonBarSubmitButton, DialogButton, FormActionDialog, InvalidateButton, ItemDeleteDialog, ItemEditDialog, Menu, NavigateButton, OrderCell, PageContainer, PageContentEditor, PageMain, PageQueryStateContainer, PageSectionTitle, PageSidebar, PageSidebarSection, PageStateContainer, PageSubSectionTitle, PageTabbedTopBar, PageTabbedTopBarProvider, PageTitle, PageTopBar, PageTopBarToolbar, PublishButton, ScreenRenderer, SectionTitle, StatusBadge, TableContainer, TableCreateButton, TableFilterButton, TableRowActionBar, TableRowActionButton, TableRowActionDialogButton, TableRowDeleteButton, TableRowEditButton, TableRowNavigateButton, TableRowPublishPostButton, TableRowViewButton, TableTopBar, UpdateButton, ViewButton };