@compill/admin 1.0.107 → 1.0.109

package/dist/index.mjs

@@ -1,2000 +0,0 @@
-import { jsxs, jsx, Fragment } from '@soperio/jsx-runtime';
-import { useApiQuery, useInvalidateQuery, useApiMutation, useMutate, useInvalidateMutation, useInvalidateParentMutation, useApiQueries } from '@compill/api';
-import { QueryLoadingState, RetryOnError, Shimmer, FlexCenter, ModalLoadingOverlay, TabContainer } from '@compill/components';
-import { mdiCircleSmall, mdiDatabaseRefreshOutline, mdiPost, mdiEye, mdiEyeOff, mdiCloudUpload, mdiOpenInNew, mdiArrowUpBoldBox, mdiArrowDownBoldBox, mdiPlusThick, mdiFilter, mdiArrowLeft, mdiPencil, mdiDelete, mdiPublish, mdiPublishOff, mdiCog, mdiDotsVertical, mdiLogout, mdiRefresh } from '@mdi/js';
-import { Button, Icon, Container, Tile, Popover, Modal, IconButton, Checkbox, Badge, Avatar, Collapse, Popup } from '@valerya/ui';
-import { isArray } from 'es-toolkit/compat';
-import Link from 'next/link';
-import { useParams, useNavigate, useLocation, useMatch, Link as Link$1, Outlet } from 'react-router-dom';
-import React8 from 'react';
-import { INVALIDATE_API, useInvalidatePage, API } from '@compill/admin-api';
-import { useFormikContext, Formik, Form } from 'formik';
-import { toast } from 'react-toastify';
-import { useHotkeys } from 'react-hotkeys-hook';
-import { FormRenderer, FormProvider, SubmitButton, TextArea, mergeInitialFormValues, FieldLabel } from '@compill/form';
-import { createContext, isFunction, runIfFn } 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 { sortBy, capitalize, isEqual } from 'es-toolkit';
-import { useBoolean, useOpenLink } 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';
-import { useSessionUser, useSessionLogout } from '@compill/auth';
-
-// src/lib/SectionTitle.tsx
-function SectionTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsx("h2", { textSize: "xl", fontWeight: "600", textColor: "slate-800", ...props, children });
-}
-function Breadcrumbs({ breadcrumbs, ...props }) {
-  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__ */ jsx(QueryBreadcrumbs, { queryFn: breadcrumbs.queryFn, queryField: breadcrumbs.queryField, generate: breadcrumbs.generate });
-}
-function QueryBreadcrumbs({ queryFn, queryField, generate, ...props }) {
-  const params = useParams();
-  const id = queryField ? params[queryField] : void 0;
-  const { data, isLoading, isError } = useApiQuery([""], queryFn, id);
-  if (isLoading || isError) {
-    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__ */ 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__ */ 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,
-        cursor: breadcrumb.path ? "pointer" : void 0,
-        children: breadcrumb.label
-      }
-    ) })
-  ] });
-}
-function DialogButton({ buildDialog, ...props }) {
-  const [showDialog, setShowDialog] = React8.useState(false);
-  const onShowDialog = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    setShowDialog(true);
-  }, [setShowDialog]);
-  const onCloseDialog = React8.useCallback(() => {
-    setShowDialog(false);
-  }, [setShowDialog]);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Button, { onClick: onShowDialog, ...props }),
-    showDialog && buildDialog(onCloseDialog)
-  ] });
-}
-function ButtonBar({ children, ...props }) {
-  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.forwardRef(
-  function({ icon, children, ...props }, ref) {
-    return /* @__PURE__ */ jsxs(
-      Button,
-      {
-        scheme: "dark",
-        size: "sm",
-        aspectRatio: icon && !children ? "square" : void 0,
-        variant: "borderless",
-        dflex: true,
-        alignItems: "center",
-        placeContent: "center",
-        corners: "square",
-        gap: "2",
-        ...props,
-        ref,
-        children: [
-          icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
-          children
-        ]
-      }
-    );
-  }
-);
-var ButtonBarSubmitButton = React8.forwardRef(
-  function({ useDirty, disabled, icon, children, ...props }, ref) {
-    const { dirty, handleSubmit } = useFormikContext() ?? { dirty: false, handleSubmit: void 0};
-    const onSubmit = React8.useCallback(() => handleSubmit(), [handleSubmit]);
-    return /* @__PURE__ */ jsxs(
-      Button,
-      {
-        scheme: "dark",
-        size: "sm",
-        aspectRatio: icon && !children ? "square" : void 0,
-        variant: "borderless",
-        dflex: true,
-        alignItems: "center",
-        placeContent: "center",
-        corners: "square",
-        gap: "2",
-        disabled: useDirty && !dirty || disabled,
-        onClick: onSubmit,
-        ...props,
-        ref,
-        children: [
-          icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
-          children
-        ]
-      }
-    );
-  }
-);
-function ButtonBarDialogButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    DialogButton,
-    {
-      scheme: "dark",
-      size: "sm",
-      aspectRatio: icon && !children ? "square" : void 0,
-      variant: "borderless",
-      dflex: true,
-      alignItems: "center",
-      placeContent: "center",
-      corners: "square",
-      gap: "2",
-      ...props,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
-        children
-      ]
-    }
-  );
-}
-function InvalidateButton({ pathOrPermalink, ...props }) {
-  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: mdiDatabaseRefreshOutline,
-      ...props
-    }
-  );
-}
-function NavigateButton({ path, ...props }) {
-  const navigate = useNavigate();
-  const handleClick = React8.useCallback(() => {
-    navigate(path);
-  }, [navigate, path]);
-  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,
-  ...props
-}) {
-  const isDraft = status == "draft";
-  const mutation = useInvalidateMutation(isDraft ? api.publish : api.unpublish, api.queryKey, queryId, { networkMode: "always" });
-  const publish = React8.useCallback(() => {
-    mutation.reset();
-    mutation.mutateAsync(queryId).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
-  }, [mutation, queryId]);
-  return /* @__PURE__ */ jsx(
-    ButtonBarButton,
-    {
-      disabled: mutation.isLoading,
-      onClick: publish,
-      icon: isDraft ? mdiEye : mdiEyeOff,
-      ...props,
-      children: isDraft ? "Publish" : "Switch to draft"
-    }
-  );
-}
-function UpdateButton({ ...props }) {
-  const { dirty, handleSubmit } = useFormikContext() ?? { dirty: false, handleSubmit: void 0};
-  useHotkeys("ctrl+s", () => {
-    if (dirty && !props.disabled) handleSubmit();
-  }, { preventDefault: true }, [dirty, props, handleSubmit]);
-  return /* @__PURE__ */ jsx(ButtonBarSubmitButton, { icon: mdiCloudUpload, ...props, children: "Update" });
-}
-function ViewButton({ label, path, icon, ...props }) {
-  const openPage = React8.useCallback(() => {
-    window.open(path, "_blank");
-  }, [path]);
-  return /* @__PURE__ */ jsx(
-    ButtonBarButton,
-    {
-      onClick: openPage,
-      dflex: true,
-      alignItems: "center",
-      gap: "2",
-      icon: icon || mdiOpenInNew,
-      ...props,
-      children: label
-    }
-  );
-}
-function OrderCell({ api, postId, order }) {
-  const mutationDown = useInvalidateMutation(api.moveDown, api.queryKey);
-  const mutationUp = useInvalidateMutation(api.moveUp, api.queryKey);
-  const moveDown = React8.useCallback((e) => {
-    e.stopPropagation();
-    mutationDown.mutateAsync(postId).catch((error) => {
-      toast.error(`Error: ${error}`);
-    });
-  }, [mutationDown, postId]);
-  const moveUp = React8.useCallback((e) => {
-    e.stopPropagation();
-    mutationUp.mutateAsync(postId).catch((error) => {
-      toast.error(`Error: ${error}`);
-    });
-  }, [mutationUp, postId]);
-  return /* @__PURE__ */ jsxs(FlexCenter, { placeContent: "start", numericFontVariant: "tabular-nums", children: [
-    order,
-    /* @__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__ */ jsx(Container, { center: true, dflex: true, flexCol: true, gap: "8", ...props, children });
-}
-function PageMain({ children, ...props }) {
-  return /* @__PURE__ */ jsx(Tile, { scheme: "light", p: "5", ...props, children });
-}
-function PageContentEditor({ name, ...props }) {
-  const extensions = [ImageExtension];
-  return /* @__PURE__ */ jsx(PageMain, { h: "min", ...props, children: /* @__PURE__ */ jsx(
-    FormEditor,
-    {
-      minH: "128",
-      minW: "144",
-      maxW: props.maxW,
-      name,
-      placeHolder: "Write here...",
-      extensions
-    }
-  ) });
-}
-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__ */ jsx(QueryLoadingState, { w: "full", h: "100%", ...loadingStyles });
-  if (isError)
-    return /* @__PURE__ */ jsx(RetryOnError, { p: "0", onClick: invalidate, ...errorStyles });
-  return /* @__PURE__ */ jsx(PageContainer, { ...props, children: apiFn == "get" ? children(data) : children(data) });
-}
-var PageQueryStateContainer = React8.forwardRef(PageQueryStateContainerInner);
-function PageSidebar({ children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { w: "112", minW: "112", minH: "100%", gap: "8", dflex: true, flexCol: true, ...props, children });
-}
-function PageSectionTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { trait: "typo.h6", mb: "5", ...props, children });
-}
-function PageSidebarSection({ title, children, ...props }) {
-  return /* @__PURE__ */ jsxs("div", { w: "full", ...props, children: [
-    title && /* @__PURE__ */ jsx(PageSectionTitle, { children: title }),
-    children
-  ] });
-}
-function PageTitle({ children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { trait: "typo.h5", ...props, children });
-}
-function PageTopBar({ title, breadcrumbs, children, ...props }) {
-  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] = createContext();
-function PageTabbedTopBarProvider({ children }) {
-  const [containerEl, setContainerEl] = React8.useState(null);
-  React8.createRef();
-  return /* @__PURE__ */ jsx(CP, { value: { containerEl, setContainerEl }, children });
-}
-function PageTabbedTopBar({ title, breadcrumbs, children, ...props }) {
-  const ref = React8.createRef();
-  const { setContainerEl } = usePageTabbedTopBarContext();
-  const [isSet, setIsSet] = React8.useState(false);
-  React8.useEffect(() => {
-    if (!isSet && ref.current) {
-      setContainerEl(ref.current);
-      setIsSet(true);
-    }
-    return () => setContainerEl(null);
-  }, []);
-  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.useState(false);
-  const portal = React8.useMemo(() => {
-    const node = containerEl;
-    return node;
-  }, [containerEl]);
-  const host = containerEl ?? (typeof window !== "undefined" ? document.body : void 0);
-  React8.useLayoutEffect(() => {
-    if (!portal || !host)
-      return;
-    try {
-      if (visible)
-        host.appendChild(portal);
-      else
-        host.removeChild(portal);
-    } catch (e) {
-    }
-    return () => {
-      try {
-        host.removeChild(portal);
-      } catch (e) {
-      }
-    };
-  }, [visible, portal, host]);
-  const callback = React8.useCallback((entries) => {
-    setVisible(entries[0].isVisible);
-  }, [children]);
-  React8.useEffect(() => {
-    const opts = {
-      root: null,
-      rootMargin: "0px",
-      threshold: 0,
-      /* required options*/
-      trackVisibility: true,
-      delay: 100
-    };
-    const observerScroll = new IntersectionObserver(callback, opts);
-    if (trackingRef)
-      observerScroll.observe(trackingRef);
-    return () => observerScroll.disconnect();
-  }, [trackingRef, callback, children]);
-  if (host && portal)
-    return createPortal(children, portal);
-  return null;
-}
-function ScreenTopBar({ tabbed, breadcrumbs, api, item, isLoading, buttonBar, trackingRef }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    tabbed && /* @__PURE__ */ jsx(PageTopBarToolbar, { trackingRef, children: /* @__PURE__ */ jsx(Buttons, { api, item, isLoading, buttonBar }) }),
-    !tabbed && /* @__PURE__ */ jsx(PageTopBar, { breadcrumbs, children: /* @__PURE__ */ jsx(Buttons, { api, item, isLoading, buttonBar }) })
-  ] });
-}
-function Buttons({ api, item, isLoading, buttonBar }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    buttonBar && buttonBar.length > 0 && /* @__PURE__ */ jsx(ButtonBar, { children: buttonBar.map((button, index) => /* @__PURE__ */ jsxs(React8.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__ */ 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 = useRouter();
-    return router.query[queryField];
-  }
-  const { [queryField]: id } = useParams();
-  return id;
-}
-function DetailsView({ queryField, api, useNextRouter, processInput, screen, tabbed, ...props }) {
-  const id = useQueryField(queryField, useNextRouter);
-  const ref = React8.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, processInput, tabbed, containerRef }) {
-  const pScreen = runIfFn(screen, item);
-  const { breadcrumbs, schema, initialValues, header, sections, buttonBar, type, invalidateParentQueryKey, invalidatePage } = pScreen;
-  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}`,
-    onSuccess: () => {
-      if (invalidatePage)
-        invalidatePageFn();
-    }
-  });
-  let editorMaxW = void 0;
-  if (!type || type == "post")
-    editorMaxW = "calc(1280px - 28rem)";
-  else if (type == "section")
-    editorMaxW = "calc(1280px - 22rem)";
-  return /* @__PURE__ */ jsxs(
-    FormProvider,
-    {
-      initialValues: runIfFn(initialValues, item),
-      validationSchema: schema,
-      onSubmit: save,
-      enableReinitialize: true,
-      children: [
-        /* @__PURE__ */ jsx(
-          ScreenTopBar,
-          {
-            tabbed,
-            api,
-            breadcrumbs,
-            buttonBar,
-            item,
-            isLoading: mutation.isLoading,
-            trackingRef: containerRef?.current
-          }
-        ),
-        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__ */ 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__ */ 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,
-                  minW: editorMaxW,
-                  w: editorMaxW,
-                  minH: "128",
-                  rows: 25,
-                  bgColor: "white",
-                  border: "0",
-                  shadow: true,
-                  p: "5",
-                  textColor: "slate-800"
-                }
-              ),
-              pScreen.editorFooter
-            ] }),
-            /* @__PURE__ */ jsx(PageSidebar, { children: sections?.map((section, index) => /* @__PURE__ */ jsx(Section, { section, item, cardStyle: true }, index)) })
-          ] })
-        ] }) })
-      ]
-    }
-  );
-}
-function Section({ section, item, cardStyle }) {
-  if (section.type === "section") {
-    const style = cardStyle ? {
-      bgColor: "white",
-      rounded: "lg",
-      p: "5",
-      textSize: "sm",
-      shadow: true
-    } : {};
-    return /* @__PURE__ */ jsx(PageSidebarSection, { title: section.title, ...style, children: /* @__PURE__ */ jsx(FormRenderer, { form: runIfFn(section.form, item) }) });
-  }
-  if (section.type === "custom")
-    return runIfFn(section.component, item);
-  return null;
-}
-function useApi(api, queryField) {
-  const params = useParams();
-  if (queryField === void 0)
-    return { id: void 0, api };
-  const { [queryField]: id } = params;
-  return { id, api: runIfFn(api, id) };
-}
-function QueryWrapper({
-  api,
-  queryField,
-  fn,
-  transformFn,
-  config,
-  tabbed,
-  ...props
-}) {
-  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 = React8.useMemo(() => {
-    if (data && (fn === "getTransformed" || fn === "getAllTransformed")) {
-      if (!transformFn)
-        console.warn(`QueryWrapperDialog: you forgot to pass transformFn as parameter for fn ${fn}`);
-      return transformFn?.(data);
-    }
-    return data;
-  }, [data]);
-  if (!data)
-    return null;
-  return /* @__PURE__ */ jsx(ScreenRenderer, { config: config(transformedData), tabbed, ...props });
-}
-function TabbedView({ queryField, api, screen, ...props }) {
-  const { [queryField]: id } = useParams();
-  return /* @__PURE__ */ jsx(
-    PageQueryStateContainer,
-    {
-      queryId: id,
-      api,
-      apiFn: "get",
-      p: "5",
-      children: (city) => {
-        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__ */ jsx(TabView, { tab }, index))
-            }
-          )
-        ] });
-      }
-    }
-  );
-}
-function TabView({ tab }) {
-  if (!tab.component && !tab.config)
-    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__ */ jsx(ScreenRenderer, { config: tab.config, tabbed: true, p: "0" });
-}
-var [provider, useContext] = createContext();
-function getColId(column) {
-  return column.accessorKey ?? column.id;
-}
-function TableContainerContextProvider({ initialVisibleColumns, columns, children }) {
-  const [showFilters, setShowFilters] = React8.useState(false);
-  const [showMassActions, setShowMassActions] = React8.useState(false);
-  const [visibleColumnIds, setVisibleColumnIds] = React8.useState(initialVisibleColumns ?? columns?.map((col) => getColId(col)) ?? []);
-  const filteredColumns = columns?.filter((col) => visibleColumnIds.includes(getColId(col))) ?? [];
-  const toggleColumnVisibility = React8.useCallback((id) => {
-    const index = visibleColumnIds.indexOf(id);
-    if (index > -1) {
-      const newIds = visibleColumnIds.concat();
-      newIds.splice(index, 1);
-      setVisibleColumnIds(newIds);
-    } else {
-      setVisibleColumnIds(visibleColumnIds.concat(id));
-    }
-  }, [visibleColumnIds, setVisibleColumnIds]);
-  const isColumnVisible = React8.useCallback((id) => {
-    return visibleColumnIds.includes(id);
-  }, [visibleColumnIds]);
-  const Provider = provider;
-  const value = {
-    showFilters,
-    setShowFilters,
-    showMassActions,
-    setShowMassActions,
-    columns: columns ?? [],
-    filteredColumns,
-    toggleColumnVisibility,
-    isColumnVisible
-  };
-  return /* @__PURE__ */ jsx(Provider, { value, children });
-}
-function TableContainer({ initialPageSize, initialVisibleColumns, columns, filtersMethod = "reactRouter", children, ...props }) {
-  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__ */ jsxs(ButtonBarDialogButton, { ...props, children: [
-    /* @__PURE__ */ jsx(Icon, { path: icon ?? mdiPlusThick }),
-    children
-  ] });
-}
-function TableFilterButton({ ...props }) {
-  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__ */ jsxs(
-    "div",
-    {
-      dflex: true,
-      flexRow: true,
-      alignItems: "center",
-      gap: "3",
-      p: "8",
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs("div", { children: [
-          title && /* @__PURE__ */ jsx("h2", { textSize: "x2", fontWeight: "600", textColor: "#3f4254", textTransform: "capitalize", children: title }),
-          breadcrumbs && /* @__PURE__ */ jsx(Breadcrumbs, { breadcrumbs })
-        ] }),
-        /* @__PURE__ */ jsx("div", { flexGrow: true, children: "\xA0" }),
-        children
-      ]
-    }
-  );
-}
-function TableFilters({ form, initialValues, schema, processInput }) {
-  const { showFilters } = useContext();
-  const { getFilters, setFilters } = useTableContext();
-  const handleSubmit = React8.useCallback((values, actions) => {
-    const params = processInput?.(values) ?? values;
-    if (!isEqual(params, getFilters()))
-      setFilters(params);
-    actions.setSubmitting(false);
-  }, [setFilters, processInput]);
-  const handleReset = React8.useCallback((resetForm) => {
-    setFilters(initialValues);
-    resetForm();
-  }, [setFilters, initialValues]);
-  React8.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: mergeInitialFormValues(getFilters(), initialValues),
-      onSubmit: handleSubmit,
-      validationSchema: schema,
-      enableReinitialize: true,
-      children: (props) => /* @__PURE__ */ jsxs("div", { dflex: true, gap: "3", placeContent: "start", children: [
-        /* @__PURE__ */ jsx(FormRenderer, { flexRow: true, w: "auto", form }),
-        /* @__PURE__ */ jsx(Buttons2, { handleReset: () => handleReset(props.resetForm) })
-      ] })
-    }
-  ) }) });
-}
-function Buttons2({ 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__ */ jsxs("div", { dflex: true, flexCol: true, children: [
-      /* @__PURE__ */ jsx(FieldLabel, { name: "", label: "\xA0" }),
-      /* @__PURE__ */ jsx(Button, { scheme: "neutral", onClick: handleReset, children: "Reset" })
-    ] })
-  ] });
-}
-function ActionButton({
-  label,
-  buttonProps,
-  icon,
-  queryKey,
-  queryFn,
-  successMsg,
-  errorMsg,
-  invalidateParent
-}) {
-  const mutation = invalidateParent ? useInvalidateParentMutation(queryFn, queryKey) : useApiMutation(queryFn, queryKey);
-  const mutate = useMutate(
-    mutation,
-    {
-      successMsg,
-      errorMsg
-    }
-  );
-  return /* @__PURE__ */ jsxs(
-    Button,
-    {
-      display: "flex",
-      alignItems: "center",
-      gap: "3",
-      ...buttonProps,
-      onClick: mutate,
-      disabled: mutation.isLoading,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon }),
-        label
-      ]
-    }
-  );
-}
-function TableMassActions({ actions }) {
-  const { ids } = useTableContext();
-  const showMassActions = ids && ids.length > 0;
-  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, { label: action.label, queryFn: action.queryFn, queryKey: action.queryKey, buttonProps: action.buttonProps }) }, index)) }) });
-}
-var defaultErrorMsg = "Oops, something went wrong...";
-function nonNullValues(data) {
-  if (data) {
-    const nonNullData = { ...data };
-    for (const key in data)
-      nonNullData[key] = nonNullData[key] ?? "";
-    return nonNullData;
-  }
-  return data;
-}
-function ItemEditDialog({
-  initialValues,
-  itemLabel,
-  queryId = "",
-  api,
-  queryFetchOptions,
-  querySaveOptions,
-  onSuccess,
-  onFetchError,
-  fetchErrorMsg = defaultErrorMsg,
-  onSaveError,
-  saveErrorMsg = defaultErrorMsg,
-  fetchToFormData,
-  formToQueryData,
-  invalidateQueriesOnSuccess = true,
-  invalidateQueryKey,
-  retryText = "Retry",
-  cancelLabel = "Cancel",
-  saveLabel,
-  size = "lg",
-  title,
-  form,
-  show,
-  onClose,
-  formikProps,
-  ...props
-}) {
-  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 ? useInvalidateParentMutation(api.upsert, invalidateQueryKey ?? api.queryKey, querySaveOptions) : useApiMutation(api.upsert, api.queryKey, queryId, querySaveOptions);
-  const retry = React8.useCallback(() => refetch(), [refetch]);
-  const saveItem = React8.useCallback(async (item, actions) => {
-    mutation.reset();
-    const formItem = formToQueryData ? formToQueryData(item) : { ...item };
-    await mutation.mutateAsync(formItem).then((response) => {
-      if (onSuccess)
-        onSuccess(formItem, response);
-      else
-        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
-        toast.error(`Couldn't save ${title ? title(formItem) : formItem.name ?? formItem.title}`);
-      actions.setSubmitting(false);
-    });
-  }, [mutation, formToQueryData, onSuccess, onSaveError, onClose]);
-  return /* @__PURE__ */ jsxs(
-    Modal,
-    {
-      size,
-      show,
-      onClose,
-      scheme: "light",
-      transition: true,
-      ...props,
-      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) && /* @__PURE__ */ jsx(Fragment, {})
-        ] }),
-        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__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(Modal.Body, { pb: "6", children: /* @__PURE__ */ jsxs(Form, { children: [
-                React8.isValidElement(form) && form,
-                Array.isArray(form) && /* @__PURE__ */ jsx(FormRenderer, { form }),
-                isFunction(form) && /* @__PURE__ */ jsx(FormRenderer, { form: form(data ?? values) })
-              ] }) }),
-              /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-                /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    disabled: mutation.isLoading,
-                    onClick: onClose,
-                    variant: "borderless",
-                    me: "2",
-                    children: cancelLabel
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    type: "submit",
-                    disabled: !dirty || mutation.isLoading,
-                    onClick: () => handleSubmit(),
-                    children: saveLabel ? saveLabel : queryId ? "Update" : "Create"
-                  }
-                )
-              ] })
-            ] })
-          }
-        ) }),
-        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
-      ]
-    }
-  );
-}
-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.useMemo(() => {
-    if (data && (fn === "getTransformed" || fn === "getAllTransformed")) {
-      if (!transformFn)
-        console.warn(`QueryWrapperDialog: you forgot to pass transformFn as parameter for fn ${fn}`);
-      return transformFn?.(data);
-    }
-    return data;
-  }, [data, fn, transformFn]);
-  if (isFetching)
-    return null;
-  return /* @__PURE__ */ jsx(ItemEditDialog, { ...config(transformedData), queryId, invalidateQueryKey, show: true, onClose });
-}
-function MultiQueryWrapperDialog({ queries, config, onClose, queryId, invalidateQueryKey }) {
-  const { data, isFetching, isError } = useApiQueries(queries.map((q) => ({
-    queryKey: q.api.queryKey,
-    queryFn: q.fn == "get" ? q.api.get : q.api.getAll,
-    queryOptions: {
-      cacheTime: q.cache === false ? 0 : void 0,
-      staleTime: q.cache === false ? 0 : void 0
-    }
-  })));
-  const transformedData = React8.useMemo(() => {
-    return data?.map((d, index) => queries[index]?.transformFn ? queries[index]?.transformFn?.(d) : d);
-  }, [data, queries]);
-  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__ */ jsx(ItemEditDialog, { ...props, queryId, invalidateQueryKey, show: true, onClose });
-  if (config.type === "query")
-    return /* @__PURE__ */ jsx(QueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
-  if (config.type === "multiQuery")
-    return /* @__PURE__ */ jsx(MultiQueryWrapperDialog, { ...props, queryId, invalidateQueryKey, onClose });
-  return null;
-}
-function RefreshButton({ queryKey }) {
-  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,
-  apiFn,
-  invalidateQueriesOnSuccess = true,
-  invalidateQueryKey,
-  size = "lg",
-  md_boxSizing,
-  msg,
-  show,
-  onClose,
-  onSuccess,
-  ...props
-}) {
-  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.useCallback(() => mutate(queryId), [mutate, queryId]);
-  return /* @__PURE__ */ jsxs(
-    Modal,
-    {
-      size,
-      show,
-      onClose,
-      scheme: "danger",
-      variant: "glass",
-      transition: true,
-      ...props,
-      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 && runIfFn(msg, itemLabel)
-        ] }),
-        /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              disabled: mutation.isPending,
-              onClick: onClose,
-              variant: "borderless",
-              scheme: "dark",
-              me: "2",
-              children: closeActionButtonLabel
-            }
-          ),
-          /* @__PURE__ */ jsx(Button, { scheme: "danger", disabled: mutation.isPending, onClick: handleDelete, children: actionButtonLabel || "Delete" })
-        ] }),
-        mutation.isPending && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
-      ]
-    }
-  );
-}
-var [provider2, useContext2] = createContext();
-function TableViewProvider({ editView, deleteItem, queryKey, children }) {
-  const openLink = useOpenLink();
-  const navigate = useNavigate();
-  const [dialog, setDialog] = React8.useState(null);
-  const onCloseDialog = React8.useCallback(() => setDialog(null), [setDialog]);
-  const onAction = React8.useCallback((action, item) => {
-    switch (action.type) {
-      case "view": {
-        navigate(runIfFn(action.path, item));
-        break;
-      }
-      case "link": {
-        openLink(`${AppEnv.websiteUrl()}/${runIfFn(action.path, item)}`);
-        break;
-      }
-      case "edit": {
-        const editConfig = runIfFn(editView, item);
-        if (editConfig) {
-          if (editConfig.type == "customDialog") {
-            setDialog(editConfig.render({ show: true, onClose: onCloseDialog }));
-          } else {
-            setDialog(
-              /* @__PURE__ */ jsx(
-                DialogRenderer,
-                {
-                  onClose: onCloseDialog,
-                  config: editConfig,
-                  queryId: item.id,
-                  invalidateQueryKey: queryKey
-                }
-              )
-            );
-          }
-        }
-        break;
-      }
-      case "delete": {
-        const deleteConfig = runIfFn(deleteItem, item);
-        setDialog(
-          /* @__PURE__ */ jsx(
-            ItemDeleteDialog,
-            {
-              show: true,
-              onClose: onCloseDialog,
-              queryId: item.id,
-              invalidateQueryKey: queryKey,
-              msg: item.msg,
-              ...deleteConfig,
-              itemLabel: runIfFn(deleteConfig.itemLabel, item)
-            }
-          )
-        );
-        break;
-      }
-    }
-  }, [navigate, editView, deleteItem]);
-  const Provider = provider2;
-  const value = {
-    dialog,
-    onAction
-  };
-  return /* @__PURE__ */ jsx(Provider, { value, children });
-}
-function TableRowPublishPostButton({ id, api, status, invalidateQueryKey, ...props }) {
-  const isDraft = status == "draft";
-  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey ?? api.queryKey, { networkMode: "always" });
-  const publish = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    mutation.reset();
-    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
-  }, [mutation, id]);
-  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__ */ jsxs(
-    Button,
-    {
-      dflex: true,
-      alignContent: "center",
-      placeContent: "center",
-      py: "2.5",
-      px: "3",
-      h: "full",
-      size: "lg",
-      variant: "borderless",
-      corners: "square",
-      gap: "2",
-      ...props,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "sm" }),
-        children
-      ]
-    }
-  );
-}
-function TableRowActionsView({ row, onAction, rowActions, api, queryKey }) {
-  const item = row.original;
-  return /* @__PURE__ */ jsx("div", { dflex: true, w: "full", alignItems: "stretch", placeContent: "end", h: "full", children: runIfFn(rowActions, item)?.map(
-    (action, index) => /* @__PURE__ */ jsxs(React8.Fragment, { children: [
-      action.type === "publish" && /* @__PURE__ */ jsx(TableRowPublishPostButton, { 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(ActionButton2, { onClick: () => onAction(action, item), scheme: schemes[action.type], children: /* @__PURE__ */ jsx(Icon, { path: icons[action.type], size: "sm" }) })
-    ] }, index)
-  ) });
-}
-function ActionButton2({ onClick, ...props }) {
-  const handleClick = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    onClick?.(event);
-  }, [onClick]);
-  return /* @__PURE__ */ jsx(
-    TableRowActionButton,
-    {
-      onClick: handleClick,
-      ...props
-    }
-  );
-}
-var icons = {
-  "link": mdiOpenInNew,
-  "view": mdiEye,
-  "edit": mdiPencil,
-  "delete": mdiDelete,
-  "publish": mdiDelete,
-  "custom": ""
-};
-var schemes = {
-  "link": "dark",
-  "view": "dark",
-  "edit": "dark",
-  "delete": "dark",
-  "publish": "dark",
-  "custom": "dark"
-};
-function useTableProps(api, table, rowActions, queryParams) {
-  const navigate = useNavigate();
-  const nextRouter = useRouter();
-  const openLink = useOpenLink();
-  const { onAction } = useContext2();
-  const { onRowClick, columns: c, ...props } = table;
-  const onRowClickHandler = React8.useCallback((item) => {
-    const config = runIfFn(onRowClick, item);
-    if (config) {
-      switch (config.type) {
-        case "navigate": {
-          navigate(runIfFn(config.path, item) ?? "");
-          break;
-        }
-        case "nextpush": {
-          nextRouter.push(runIfFn(config.path, item));
-          break;
-        }
-        case "link": {
-          openLink(`${AppEnv.websiteUrl()}/${runIfFn(config.path, item)}`);
-          break;
-        }
-      }
-    }
-  }, [navigate, onRowClick]);
-  const columns = React8.useMemo(() => {
-    const columns2 = table.columns.concat([]);
-    if (rowActions) {
-      columns2.push(
-        createColumnHelper().display(
-          {
-            id: "actions",
-            header: "Actions",
-            cell: (props2) => /* @__PURE__ */ jsx(TableRowActionsView, { row: props2.row, onAction, rowActions, api, queryKey: api.queryKey })
-          }
-        )
-      );
-    }
-    return columns2;
-  }, [table, onAction, rowActions, api]);
-  const tableProps = { ...props };
-  tableProps.columns = columns;
-  tableProps.onRowClick = onRowClickHandler;
-  tableProps.queryKey = api.queryKey;
-  tableProps.queryFilters = queryParams;
-  tableProps.queryFn = api.search;
-  return tableProps;
-}
-function useId(queryField) {
-  const params = useParams();
-  if (queryField === void 0)
-    return void 0;
-  const { [queryField]: id } = params;
-  return id;
-}
-function TableView({ queryField, title, subtitle, screen, ...props }) {
-  const id = useId(queryField);
-  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 } = 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,
-        initialValues: filters.initialValues,
-        schema: filters.schema,
-        processInput: filters.processInput
-      }
-    ),
-    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.useCallback((data) => {
-    return (onClose) => {
-      const view = runIfFn(createView, data) ?? runIfFn(editView, null);
-      if (view.type == "customDialog")
-        return view.render({ show: true, onClose });
-      else
-        return /* @__PURE__ */ jsx(DialogRenderer, { config: view, onClose, invalidateQueryKey: api.queryKey });
-    };
-  }, [createView, editView, api]);
-  return /* @__PURE__ */ jsxs(ButtonBar, { children: [
-    /* @__PURE__ */ jsx(RefreshButton, { queryKey }),
-    buttonBar && buttonBar.map(
-      (button, index) => /* @__PURE__ */ jsxs(React8.Fragment, { children: [
-        button.type === "create" && editView && /* @__PURE__ */ jsx(
-          TableCreateButton,
-          {
-            buildDialog: createDialogFn(button.data),
-            icon: button.icon,
-            children: button.label
-          }
-        ),
-        button.type === "invalidate" && /* @__PURE__ */ jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }),
-        button.type === "custom" && button.render()
-      ] }, index)
-    ),
-    children
-  ] });
-}
-function TableWrapper({ table, subtitle, rowActions, api, queryParams }) {
-  const tableProps = useTableProps(api, table, rowActions, queryParams);
-  const _subtitle = React8.useMemo(() => {
-    if (!subtitle)
-      return void 0;
-    return (data) => {
-      return /* @__PURE__ */ jsx("div", { textSize: "lg", textColor: "#475569", fontWeight: "600", children: isFunction(subtitle) ? subtitle(data) : subtitle });
-    };
-  }, [subtitle]);
-  return /* @__PURE__ */ jsx(Table, { ...tableProps, p: "8", title: _subtitle });
-}
-function TableDialogManager() {
-  const { dialog } = useContext2();
-  return dialog;
-}
-function useQueries(queries) {
-  const params = useParams();
-  const { data, isFetching, isError } = useApiQueries(queries.map((q) => {
-    if (!q.queryField) {
-      const api2 = runIfFn(q.api);
-      return {
-        queryKey: api2.queryKey,
-        queryFn: q.fn == "get" ? api2.get : api2.getAll,
-        queryParam: q.params
-      };
-    }
-    const id = params[q.queryField];
-    const api = runIfFn(q.api, id);
-    return {
-      queryKey: api.queryKey,
-      queryFn: q.fn == "get" ? api.get : api.getAll,
-      queryParam: q.fn == "getAll" ? q.params : isFunction(q.api) ? void 0 : id
-    };
-  }));
-  let transformedData = void 0;
-  if (!isFetching && !isError) {
-    transformedData = data?.map((d, index) => queries[index].transformFn ? queries[index].transformFn?.(d) : d);
-  }
-  return { data: transformedData, isFetching, isError };
-}
-function useInvalidate(queries) {
-  const queryClient = useQueryClient();
-  const params = useParams();
-  const invalidate = React8.useCallback(
-    () => {
-      const queryKeys = [];
-      queries.forEach((q) => {
-        if (!q.queryField || !isFunction(q.api)) {
-          queryKeys.push(q.api.queryKey);
-        } else {
-          const id = params[q.queryField];
-          const api = runIfFn(q.api, id);
-          queryKeys.push(api.queryKey);
-        }
-      });
-      queryClient.invalidateQueries({ predicate: (query) => queryKeys.includes(query.queryKey) });
-    },
-    [queries, queryClient, params]
-  );
-  return invalidate;
-}
-function MultiQueryWrapper({
-  queries,
-  config,
-  tabbed,
-  ...props
-}) {
-  const { data, isFetching, isError } = useQueries(queries);
-  const invalidate = useInvalidate(queries);
-  if (isFetching)
-    return /* @__PURE__ */ jsx(QueryLoadingState, { w: "full", h: "100vh" });
-  if (isError || !data)
-    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__ */ jsx(TableView, { ...config, ...props });
-  if (config.type === "tabbed")
-    return /* @__PURE__ */ jsx(TabbedView, { ...config, ...props });
-  if (config.type === "details")
-    return /* @__PURE__ */ jsx(DetailsView, { ...config, tabbed, ...props });
-  if (config.type === "query")
-    return /* @__PURE__ */ jsx(QueryWrapper, { ...config, tabbed, ...props });
-  if (config.type === "multiQuery")
-    return /* @__PURE__ */ jsx(MultiQueryWrapper, { ...config, tabbed, ...props });
-  return /* @__PURE__ */ jsx(Fragment, {});
-}
-function Content({ ...props }) {
-  return /* @__PURE__ */ jsx("div", { w: "100%", h: "100%", overflowY: "auto", ...props, children: /* @__PURE__ */ jsx(Outlet, {}) });
-}
-function SelectedIndicator({ darkMode }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      position: "absolute",
-      bgColor: darkMode ? "white" : "black",
-      bgOpacity: "90",
-      w: "0.5",
-      h: "6",
-      top: "1.5",
-      start: "-4"
-    }
-  );
-}
-function MenuButton({ depth, darkMode, icon, selected, children, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    Button,
-    {
-      as: "li",
-      minH: "8",
-      ms: `${(depth ?? 0) * 2}`,
-      p: "2",
-      font: "title",
-      textColor: darkMode ? "white" : "black",
-      fontWeight: "600",
-      rounded: "lg",
-      textSize: "sm",
-      variant: "borderless",
-      hover_bgColor: darkMode ? "white" : "black",
-      hover_bgOpacity: "10",
-      hover_textColor: darkMode ? "white" : "zinc-800",
-      cursor: "pointer",
-      dflex: true,
-      alignItems: "center",
-      gap: "3",
-      ...props,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon, opacity: selected ? "100" : "60" }),
-        children
-      ]
-    }
-  );
-}
-function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-  const location = useLocation();
-  const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-  const match = useMatch("/" + path) != null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Link$1, { to: path, style: { position: "relative" }, children: [
-      /* @__PURE__ */ jsx(
-        MenuButton,
-        {
-          depth,
-          darkMode,
-          icon,
-          selected,
-          ...props
-        }
-      ),
-      match && /* @__PURE__ */ jsx(SelectedIndicator, { darkMode })
-    ] }),
-    subMenu?.map((item, index) => /* @__PURE__ */ jsx(
-      MenuItem,
-      {
-        icon: item.icon,
-        path: item.path,
-        depth: (depth ?? 0) + 1,
-        darkMode,
-        subMenu: item.children,
-        children: item.label
-      },
-      index
-    ))
-  ] });
-}
-function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-  const { pathname } = useRouter();
-  const selected = path == "/" ? pathname == "/" : pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-  const match = path == "/" ? pathname == "/" : pathname == (path.startsWith("/") ? path : `/${path}`);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Link, { href: path, style: { position: "relative" }, children: [
-      /* @__PURE__ */ jsx(
-        MenuButton,
-        {
-          depth,
-          darkMode,
-          icon,
-          selected,
-          ...props
-        }
-      ),
-      match && /* @__PURE__ */ jsx(SelectedIndicator, { darkMode })
-    ] }),
-    subMenu?.map((item, index) => /* @__PURE__ */ jsx(
-      NextMenuItem,
-      {
-        icon: item.icon,
-        path: item.path,
-        depth: (depth ?? 0) + 1,
-        darkMode,
-        subMenu: item.children,
-        children: item.label
-      },
-      index
-    ))
-  ] });
-}
-function Menu({ darkMode, config, useNextRouter, ...props }) {
-  const Comp = useNextRouter ? NextMenuItem : MenuItem;
-  return /* @__PURE__ */ jsx("ul", { ...props, children: config.map((item, index) => {
-    if (item.type == "divider")
-      return /* @__PURE__ */ jsx(Divider, { title: item.label }, index);
-    if (item.type == "item") {
-      return /* @__PURE__ */ jsx(
-        Comp,
-        {
-          icon: item.icon,
-          path: item.path,
-          depth: 0,
-          darkMode,
-          subMenu: item.children,
-          children: item.label
-        },
-        index
-      );
-    }
-  }) });
-}
-function Divider({ title }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      px: "2",
-      mt: "5",
-      mb: "2",
-      opacity: "75",
-      textTransform: "capitalize",
-      letterSpacing: "widest",
-      fontWeight: "700",
-      textSize: "xs",
-      children: title
-    }
-  );
-}
-function UserBlock({ color, darkMode, menuConfig, path }) {
-  const { isLoading, user } = useSessionUser();
-  const navigate = useNavigate();
-  const handleClick = React8.useCallback(() => navigate(path), [navigate, path]);
-  if (isLoading)
-    return null;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      dflex: true,
-      alignItems: "center",
-      border: "0.5",
-      borderColor: `${color}-${darkMode ? "800" : "200"}`,
-      ps: "3",
-      py: "1.5",
-      textSize: "md",
-      rounded: "lg",
-      hover_bgColor: `${color}-${darkMode ? "800" : "200"}`,
-      cursor: "pointer",
-      textColor: darkMode ? "white" : "slate-800",
-      onClick: handleClick,
-      children: [
-        /* @__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",
-            scheme: "dark",
-            textColor: darkMode ? "white" : "slate-800",
-            hover_textColor: darkMode ? "white" : "slate-800",
-            hover_bgColor: `${color}-${darkMode ? "900" : "200"}`,
-            icon: mdiCog,
-            onClick: handleClick
-          }
-        ),
-        /* @__PURE__ */ jsx(OverflowMenu, { color, darkMode, menuConfig })
-      ]
-    }
-  );
-}
-function OverflowMenu({ color, darkMode, menuConfig }) {
-  const [showPopup, setShowPopup] = React8.useState(false);
-  const navigate = useNavigate();
-  const logout = useSessionLogout(false);
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
-    Popup,
-    {
-      show: showPopup,
-      position: "relative",
-      side: "bottom-end",
-      onClick: (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        setShowPopup((show) => !show);
-      },
-      onHide: () => setShowPopup(false),
-      children: [
-        /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            icon: mdiDotsVertical,
-            variant: "borderless",
-            corners: "pill",
-            scheme: "dark",
-            textColor: darkMode ? "white" : "slate-800",
-            hover_textColor: darkMode ? "white" : "slate-800",
-            hover_bgColor: `${color}-${darkMode ? "900" : "200"}`
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            bgColor: "white",
-            rounded: "sm",
-            overflow: "hidden",
-            shadow: true,
-            mt: "1",
-            border: "px",
-            borderColor: "gray-200",
-            divideColor: "gray-200",
-            divideY: "px",
-            minW: "40",
-            children: [
-              menuConfig && menuConfig.length > 0 && menuConfig.map((item, index) => {
-                if (item.type == "item") {
-                  return /* @__PURE__ */ jsx(MenuItem2, { icon: item.icon, onClick: () => navigate(item.path), children: item.label }, index);
-                }
-                return null;
-              }),
-              /* @__PURE__ */ jsx(MenuItem2, { icon: mdiLogout, onClick: logout, children: "Logout" })
-            ]
-          }
-        )
-      ]
-    }
-  ) });
-}
-function MenuItem2({ icon, onClick, children, ...props }) {
-  const handleClick = React8.useCallback((e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    onClick?.(e);
-  }, []);
-  return /* @__PURE__ */ jsxs(
-    Button,
-    {
-      variant: "borderless",
-      scheme: "dark",
-      size: "sm",
-      alignItems: "center",
-      dflex: true,
-      gap: "2",
-      px: "2",
-      py: "1.5",
-      w: "full",
-      onClick: handleClick,
-      textColor: "slate-700",
-      ...props,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "md" }),
-        children
-      ]
-    }
-  );
-}
-function Sidebar({ show, logo, title, menuConfig, userMenuConfig, userSettingsPath, color, darkMode, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      dflex: true,
-      flexCol: true,
-      w: "full",
-      md_w: "64",
-      minH: "screen",
-      p: "0",
-      textColor: darkMode ? "white" : "slate-800",
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs(
-          FlexCenter,
-          {
-            placeContent: "start",
-            p: "4",
-            font: "title",
-            gap: "3",
-            borderB: "px",
-            borderBColor: "slate-900",
-            borderOpacity: "5",
-            children: [
-              logo ?? /* @__PURE__ */ jsx(Logo, { width: 40, height: 40, darkMode }),
-              /* @__PURE__ */ jsx("h1", { textSize: "md", children: title || AppEnv.appName() })
-            ]
-          }
-        ),
-        /* @__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__ */ jsx("div", { ...props, children: /* @__PURE__ */ jsx(
-    Image,
-    {
-      src: `/logo_${darkMode ? "light" : "dark"}.png`,
-      alt: AppEnv.appName() || "",
-      width,
-      height,
-      priority: true,
-      unoptimized: true
-    }
-  ) });
-}
-function AdminLayout({ color, darkMode, logo, title, menuConfig, userMenuConfig, userSettingsPath, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      w: "full",
-      h: "screen",
-      dflex: true,
-      flexRow: true,
-      bgColor: `${color}-${darkMode ? "900" : "100"}`,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(
-          LeftPanel,
-          {
-            color,
-            darkMode,
-            logo,
-            title,
-            menuConfig,
-            userMenuConfig,
-            userSettingsPath
-          }
-        ),
-        /* @__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] = useBoolean(true);
-  useHotkeys("ctrl+t", () => toggle(), [toggle]);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ms: isOpen ? "0" : "-14.5rem",
-      transition: "all",
-      duration: "500",
-      transform: true,
-      children: [
-        /* @__PURE__ */ jsx(
-          Sidebar,
-          {
-            flexShrink: "0",
-            color,
-            darkMode,
-            logo,
-            title,
-            menuConfig,
-            userMenuConfig,
-            userSettingsPath
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            icon: mdiArrowLeft,
-            transition: "all",
-            duration: "500",
-            transform: true,
-            rotate: isOpen ? "0" : "180",
-            position: "absolute",
-            bottom: "14",
-            end: "-5",
-            size: "lg",
-            corners: "pill",
-            onClick: toggle,
-            z: "100"
-          }
-        )
-      ]
-    }
-  );
-}
-var defaultErrorMsg2 = "Oops, something went wrong...";
-function AttachDialog({
-  queryId,
-  queryKey,
-  queryFetchFn,
-  queryFetchAllKey,
-  queryFetchAllFn,
-  querySaveFn,
-  matchKey,
-  size = "lg",
-  show,
-  onClose,
-  itemLabel,
-  onSuccess,
-  onFetchError,
-  fetchErrorMsg = defaultErrorMsg2,
-  onSaveError,
-  saveErrorMsg = defaultErrorMsg2,
-  invalidateQueriesOnSuccess = true,
-  retryText = "Retry",
-  cancelLabel = "Cancel",
-  saveLabel,
-  formikProps,
-  getItemName,
-  ...props
-}) {
-  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] = React8.useState([]);
-  const isLoading = fetchLoading || fetchAllLoading;
-  const isError = fetchError || fetchAllError;
-  const mutation = useApiMutation(querySaveFn, queryKey, queryId);
-  const handleClick = React8.useCallback((event) => {
-    const id = event?.currentTarget.dataset.id ?? "";
-    const arr = selectedResources.concat([]);
-    const i = selectedResources.indexOf(id);
-    if (i != -1)
-      arr.splice(i, 1);
-    else
-      arr.push(id);
-    setSelectedResources(arr);
-  }, [selectedResources, setSelectedResources]);
-  const retry = React8.useCallback(() => {
-    if (fetchError)
-      refetch();
-    if (fetchAllError)
-      refetchAll();
-  }, [refetch, refetchAll, fetchError, fetchAllError]);
-  const saveItem = React8.useCallback(() => {
-    mutation.reset();
-    mutation.mutateAsync({ resources: selectedResources }).then((response) => {
-      if (onSuccess)
-        onSuccess(response);
-      else
-        toast.success(`${itemLabel} saved`);
-      if (invalidateQueriesOnSuccess)
-        queryClient.invalidateQueries({ queryKey });
-      onClose?.();
-    }).catch((error2) => {
-      console.error("on error", error2);
-      if (onSaveError)
-        onSaveError();
-      else
-        toast.error(`Error adding ${itemLabel}`);
-    });
-  }, [mutation, queryId, onSuccess, queryClient, onSaveError, onClose]);
-  const resources = React8.useMemo(() => {
-    let r = [];
-    if (attached && data) {
-      r = [].concat(data);
-      attached.forEach((attachedItem) => r.splice(r.findIndex((item) => item.id == attachedItem[matchKey]), 1));
-      if (getItemName)
-        r = r.map((item) => {
-          return { ...item, name: getItemName(item) };
-        });
-      r = sortBy(r, ["name"]);
-    }
-    return r;
-  }, [attached, data]);
-  return /* @__PURE__ */ jsxs(
-    Modal,
-    {
-      size,
-      show,
-      onClose,
-      scheme: "light",
-      transition: true,
-      ...props,
-      children: [
-        /* @__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,
-              value: item.id,
-              "data-id": item.id,
-              checked: selectedResources.includes(`${item.id}`),
-              onClick: handleClick
-            },
-            item.id
-          )) }) }),
-          /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                disabled: mutation.isLoading,
-                onClick: onClose,
-                variant: "borderless",
-                me: "2",
-                children: cancelLabel
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                type: "submit",
-                disabled: selectedResources.length == 0 || mutation.isLoading,
-                onClick: saveItem,
-                children: saveLabel ? saveLabel : queryId ? "Update" : "Create"
-              }
-            )
-          ] })
-        ] }),
-        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
-      ]
-    }
-  );
-}
-function ListItem({ label, value, checked, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      dflex: true,
-      alignItems: "center",
-      hover_bgColor: "slate-100",
-      px: "5",
-      py: "2",
-      cursor: "pointer",
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx("span", { flexGrow: true, children: label }),
-        /* @__PURE__ */ jsx(Checkbox, { name: `resources.${value}`, value, checked })
-      ]
-    }
-  );
-}
-function FormActionDialog({
-  initialValues,
-  itemLabel,
-  queryId = "",
-  queryKey,
-  queryFn,
-  queryOptions,
-  onSuccess,
-  successMsg,
-  showSuccessMsg,
-  onError,
-  errorMsg,
-  showErrorMsg,
-  processInput,
-  invalidateQueriesOnSuccess = true,
-  cancelLabel = "Cancel",
-  saveLabel = "Send",
-  size = "lg",
-  title,
-  form,
-  show,
-  onClose,
-  formikProps,
-  ...props
-}) {
-  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(queryFn, queryKey, queryOptions) : useApiMutation(queryFn, queryKey, queryId, queryOptions);
-  const mutate = useMutate(mutation, {
-    onSuccess,
-    successMsg,
-    showSuccessMsg,
-    onError,
-    errorMsg,
-    showErrorMsg,
-    processInput
-  });
-  return /* @__PURE__ */ jsxs(
-    Modal,
-    {
-      size,
-      show,
-      onClose,
-      scheme: "light",
-      transition: true,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(Modal.Header, { children: title }),
-        /* @__PURE__ */ jsxs(
-          FormProvider,
-          {
-            initialValues: initialValues ?? {},
-            onSubmit: mutate,
-            ...formikProps,
-            children: [
-              /* @__PURE__ */ jsxs(Modal.Body, { pb: "6", children: [
-                React8.isValidElement(form) && form,
-                Array.isArray(form) && /* @__PURE__ */ jsx(FormRenderer, { form })
-              ] }),
-              /* @__PURE__ */ jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [
-                /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    disabled: mutation.isLoading,
-                    onClick: onClose,
-                    variant: "borderless",
-                    me: "2",
-                    children: cancelLabel
-                  }
-                ),
-                /* @__PURE__ */ jsx(SubmitButton, { disabled: mutation.isLoading, children: saveLabel })
-              ] })
-            ]
-          }
-        ),
-        mutation.isLoading && /* @__PURE__ */ jsx(ModalLoadingOverlay, {})
-      ]
-    }
-  );
-}
-var PageStateContainer = React8.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__ */ jsx("div", { trait: "typo.h6", mb: "3", ...props, children });
-}
-var labels = {
-  draft: "Draft",
-  published: "Published",
-  pending: "Pending",
-  approved: "Approved",
-  partially_approved: "Partially Approved",
-  rejected: "Rejected"
-};
-var schemes2 = {
-  draft: "warning",
-  published: "success",
-  pending: "secondary",
-  approved: "success",
-  partially_approved: "warning",
-  rejected: "danger"
-};
-function StatusBadge({ status, ...props }) {
-  return /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "glass", whiteSpace: "nowrap", rounded: "full", px: "3", scheme: schemes2[status], ...props, children: labels[status] });
-}
-function TableRowViewButton({ path, ...props }) {
-  const openPage = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    window.open(`${AppEnv.websiteUrl()}/${path}`, "_blank");
-  }, [path]);
-  return /* @__PURE__ */ jsx(TableRowActionButton, { icon: mdiOpenInNew, onClick: openPage, ...props });
-}
-function TableRowNavigateButton({ path, ...props }) {
-  const navigate = useNavigate();
-  const handleClick = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    navigate(`${path}`);
-  }, [navigate, path]);
-  return /* @__PURE__ */ jsx(TableRowActionButton, { icon: mdiEye, onClick: handleClick, ...props });
-}
-function TableRowActionDialogButton({ icon, children, ...props }) {
-  return /* @__PURE__ */ jsxs(
-    DialogButton,
-    {
-      dflex: true,
-      alignContent: "center",
-      placeContent: "center",
-      py: "2.5",
-      px: "3",
-      h: "full",
-      size: "lg",
-      variant: "borderless",
-      corners: "square",
-      gap: "2",
-      ...props,
-      children: [
-        icon && /* @__PURE__ */ jsx(Icon, { path: icon, size: "sm" }),
-        children
-      ]
-    }
-  );
-}
-function TableRowEditButton({ children, ...props }) {
-  return /* @__PURE__ */ jsx(TableRowActionDialogButton, { icon: mdiPencil, ...props, children });
-}
-function TableRowDeleteButton({ children, ...props }) {
-  return /* @__PURE__ */ jsx(TableRowActionDialogButton, { icon: mdiDelete, ...props, children });
-}
-function TableRowActionBar({
-  publishId,
-  viewPath,
-  navigatePath,
-  editDialog,
-  deleteDialog,
-  children,
-  ...props
-}) {
-  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, status, invalidateQueryKey, ...props }) {
-  const isDraft = status == "draft";
-  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey ?? api.queryKey, { networkMode: "always" });
-  const publish = React8.useCallback((event) => {
-    event?.preventDefault();
-    event?.stopPropagation();
-    mutation.reset();
-    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch((error) => toast.error(`Error: ${error}`));
-  }, [mutation, id]);
-  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, TableRowPublishPostButton2 as TableRowPublishPostButton, TableRowViewButton, TableTopBar, UpdateButton, ViewButton };