@compill/admin 1.0.100 → 1.0.102

package/index.esm.js

@@ -1,3662 +0,0 @@
-import { __rest, __awaiter } from 'tslib';
-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 { 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, { useRef, useCallback, useContext as useContext$2, useLayoutEffect, useEffect, createContext } from 'react';
-import { INVALIDATE_API, API, useInvalidatePage } from '@compill/admin-api';
-import { useFormikContext, Formik, Form } from 'formik';
-import { ButtonBarButton as ButtonBarButton$1, ButtonBarSubmitButton as ButtonBarSubmitButton$1, PageSectionTitle as PageSectionTitle$1, ButtonBar as ButtonBar$1, ButtonBarDialogButton as ButtonBarDialogButton$1, Breadcrumbs as Breadcrumbs$1, TableRowActionButton as TableRowActionButton$1, DialogButton as DialogButton$1 } from '@compill/admin';
-import { toast } from 'react-toastify';
-import 'react/jsx-runtime';
-import { FormProvider, FormRenderer, TextArea, mergeInitialFormValues, FieldLabel, SubmitButton } from '@compill/form';
-import { createContext as createContext$1, 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 { useOpenLink, useBoolean } from '@compill/hooks';
-import { AppEnv } from '@compill/env';
-import { useQueryClient } from '@tanstack/react-query';
-import Image from 'next/image';
-import { useSessionUser, useSessionLogout } from '@compill/auth';
-
-function SectionTitle(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("h2", Object.assign({
-    textSize: "xl",
-    fontWeight: "600",
-    textColor: "slate-800"
-  }, props, {
-    children: children
-  }));
-}
-
-// Material Design Icons v7.4.47
-var mdiArrowDownBoldBox = "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M12,17L17,12H14V8H10V12H7L12,17Z";
-var mdiArrowLeft = "M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z";
-var mdiArrowUpBoldBox = "M19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21M12,7L7,12H10V16H14V12H17L12,7Z";
-var mdiCircleSmall = "M12,10A2,2 0 0,0 10,12C10,13.11 10.9,14 12,14C13.11,14 14,13.11 14,12A2,2 0 0,0 12,10Z";
-var mdiCloudUpload = "M11 20H6.5Q4.22 20 2.61 18.43 1 16.85 1 14.58 1 12.63 2.17 11.1 3.35 9.57 5.25 9.15 5.88 6.85 7.75 5.43 9.63 4 12 4 14.93 4 16.96 6.04 19 8.07 19 11 20.73 11.2 21.86 12.5 23 13.78 23 15.5 23 17.38 21.69 18.69 20.38 20 18.5 20H13V12.85L14.6 14.4L16 13L12 9L8 13L9.4 14.4L11 12.85Z";
-var mdiCog = "M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z";
-var mdiDatabaseRefreshOutline = "M6 12.45V9.64C7.47 10.47 9.61 11 12 11S16.53 10.47 18 9.64V12.03C18.17 12 18.33 12 18.5 12C19 12 19.5 12.07 20 12.18V7C20 4.79 16.42 3 12 3S4 4.79 4 7V17C4 19.21 7.59 21 12 21C12.17 21 12.33 21 12.5 21C12.24 20.37 12.09 19.7 12.03 19L12 19C8.13 19 6 17.5 6 17V14.77C7.61 15.55 9.72 16 12 16C12.17 16 12.34 16 12.5 16C12.85 15.18 13.34 14.46 13.95 13.86C13.32 13.95 12.67 14 12 14C9.58 14 7.3 13.4 6 12.45M12 5C15.87 5 18 6.5 18 7S15.87 9 12 9 6 7.5 6 7 8.13 5 12 5M18 18.5L19.77 16.73C19.32 16.28 18.69 16 18 16C16.62 16 15.5 17.12 15.5 18.5S16.62 21 18 21C18.82 21 19.54 20.61 20 20H21.71C21.12 21.47 19.68 22.5 18 22.5C15.79 22.5 14 20.71 14 18.5S15.79 14.5 18 14.5C19.11 14.5 20.11 14.95 20.83 15.67L22 14.5V18.5H18Z";
-var mdiDelete = "M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z";
-var mdiDotsVertical = "M12,16A2,2 0 0,1 14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18A2,2 0 0,1 12,16M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8A2,2 0 0,1 10,6A2,2 0 0,1 12,4Z";
-var mdiEye = "M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z";
-var mdiEyeOff = "M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z";
-var mdiFilter = "M14,12V19.88C14.04,20.18 13.94,20.5 13.71,20.71C13.32,21.1 12.69,21.1 12.3,20.71L10.29,18.7C10.06,18.47 9.96,18.16 10,17.87V12H9.97L4.21,4.62C3.87,4.19 3.95,3.56 4.38,3.22C4.57,3.08 4.78,3 5,3V3H19V3C19.22,3 19.43,3.08 19.62,3.22C20.05,3.56 20.13,4.19 19.79,4.62L14.03,12H14Z";
-var mdiLogout = "M17 7L15.59 8.41L18.17 11H8V13H18.17L15.59 15.58L17 17L22 12M4 5H12V3H4C2.9 3 2 3.9 2 5V19C2 20.1 2.9 21 4 21H12V19H4V5Z";
-var mdiOpenInNew = "M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z";
-var mdiPencil = "M20.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z";
-var mdiPlusThick = "M20 14H14V20H10V14H4V10H10V4H14V10H20V14Z";
-var mdiPost = "M3 3V21H21V3H3M18 18H6V17H18V18M18 16H6V15H18V16M18 12H6V6H18V12Z";
-var mdiPublish = "M5,4V6H19V4H5M5,14H9V20H15V14H19L12,7L5,14Z";
-var mdiPublishOff = "M20.8 22.7L15 16.9V20H9V14H5L8.6 10.4L1.1 3L2.4 1.7L22.1 21.4L20.8 22.7M19 6V4H7.2L9.2 6H19M17.2 14H19L12 7L11.1 7.9L17.2 14Z";
-var mdiRefresh = "M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z";
-
-function eq(value, other) {
-    return value === other || (Number.isNaN(value) && Number.isNaN(other));
-}
-
-function getSymbols(object) {
-    return Object.getOwnPropertySymbols(object).filter(symbol => Object.prototype.propertyIsEnumerable.call(object, symbol));
-}
-
-function getTag(value) {
-    if (value == null) {
-        return value === undefined ? '[object Undefined]' : '[object Null]';
-    }
-    return Object.prototype.toString.call(value);
-}
-
-const regexpTag = '[object RegExp]';
-const stringTag = '[object String]';
-const numberTag = '[object Number]';
-const booleanTag = '[object Boolean]';
-const argumentsTag = '[object Arguments]';
-const symbolTag = '[object Symbol]';
-const dateTag = '[object Date]';
-const mapTag = '[object Map]';
-const setTag = '[object Set]';
-const arrayTag = '[object Array]';
-const functionTag = '[object Function]';
-const arrayBufferTag = '[object ArrayBuffer]';
-const objectTag = '[object Object]';
-const errorTag = '[object Error]';
-const dataViewTag = '[object DataView]';
-const uint8ArrayTag = '[object Uint8Array]';
-const uint8ClampedArrayTag = '[object Uint8ClampedArray]';
-const uint16ArrayTag = '[object Uint16Array]';
-const uint32ArrayTag = '[object Uint32Array]';
-const bigUint64ArrayTag = '[object BigUint64Array]';
-const int8ArrayTag = '[object Int8Array]';
-const int16ArrayTag = '[object Int16Array]';
-const int32ArrayTag = '[object Int32Array]';
-const bigInt64ArrayTag = '[object BigInt64Array]';
-const float32ArrayTag = '[object Float32Array]';
-const float64ArrayTag = '[object Float64Array]';
-
-function isArray(value) {
-    return Array.isArray(value);
-}
-
-function isPlainObject(value) {
-    if (!value || typeof value !== 'object') {
-        return false;
-    }
-    const proto = Object.getPrototypeOf(value);
-    const hasObjectPrototype = proto === null ||
-        proto === Object.prototype ||
-        Object.getPrototypeOf(proto) === null;
-    if (!hasObjectPrototype) {
-        return false;
-    }
-    return Object.prototype.toString.call(value) === '[object Object]';
-}
-
-function isEqualWith(a, b, areValuesEqual) {
-    return isEqualWithImpl(a, b, undefined, undefined, undefined, undefined, areValuesEqual);
-}
-function isEqualWithImpl(a, b, property, aParent, bParent, stack, areValuesEqual) {
-    const result = areValuesEqual(a, b, property, aParent, bParent, stack);
-    if (result !== undefined) {
-        return result;
-    }
-    if (typeof a === typeof b) {
-        switch (typeof a) {
-            case 'bigint':
-            case 'string':
-            case 'boolean':
-            case 'symbol':
-            case 'undefined': {
-                return a === b;
-            }
-            case 'number': {
-                return a === b || Object.is(a, b);
-            }
-            case 'function': {
-                return a === b;
-            }
-            case 'object': {
-                return areObjectsEqual(a, b, stack, areValuesEqual);
-            }
-        }
-    }
-    return areObjectsEqual(a, b, stack, areValuesEqual);
-}
-function areObjectsEqual(a, b, stack, areValuesEqual) {
-    if (Object.is(a, b)) {
-        return true;
-    }
-    let aTag = getTag(a);
-    let bTag = getTag(b);
-    if (aTag === argumentsTag) {
-        aTag = objectTag;
-    }
-    if (bTag === argumentsTag) {
-        bTag = objectTag;
-    }
-    if (aTag !== bTag) {
-        return false;
-    }
-    switch (aTag) {
-        case stringTag:
-            return a.toString() === b.toString();
-        case numberTag: {
-            const x = a.valueOf();
-            const y = b.valueOf();
-            return eq(x, y);
-        }
-        case booleanTag:
-        case dateTag:
-        case symbolTag:
-            return Object.is(a.valueOf(), b.valueOf());
-        case regexpTag: {
-            return a.source === b.source && a.flags === b.flags;
-        }
-        case functionTag: {
-            return a === b;
-        }
-    }
-    stack = stack ?? new Map();
-    const aStack = stack.get(a);
-    const bStack = stack.get(b);
-    if (aStack != null && bStack != null) {
-        return aStack === b;
-    }
-    stack.set(a, b);
-    stack.set(b, a);
-    try {
-        switch (aTag) {
-            case mapTag: {
-                if (a.size !== b.size) {
-                    return false;
-                }
-                for (const [key, value] of a.entries()) {
-                    if (!b.has(key) || !isEqualWithImpl(value, b.get(key), key, a, b, stack, areValuesEqual)) {
-                        return false;
-                    }
-                }
-                return true;
-            }
-            case setTag: {
-                if (a.size !== b.size) {
-                    return false;
-                }
-                const aValues = Array.from(a.values());
-                const bValues = Array.from(b.values());
-                for (let i = 0; i < aValues.length; i++) {
-                    const aValue = aValues[i];
-                    const index = bValues.findIndex(bValue => {
-                        return isEqualWithImpl(aValue, bValue, undefined, a, b, stack, areValuesEqual);
-                    });
-                    if (index === -1) {
-                        return false;
-                    }
-                    bValues.splice(index, 1);
-                }
-                return true;
-            }
-            case arrayTag:
-            case uint8ArrayTag:
-            case uint8ClampedArrayTag:
-            case uint16ArrayTag:
-            case uint32ArrayTag:
-            case bigUint64ArrayTag:
-            case int8ArrayTag:
-            case int16ArrayTag:
-            case int32ArrayTag:
-            case bigInt64ArrayTag:
-            case float32ArrayTag:
-            case float64ArrayTag: {
-                if (typeof Buffer !== 'undefined' && Buffer.isBuffer(a) !== Buffer.isBuffer(b)) {
-                    return false;
-                }
-                if (a.length !== b.length) {
-                    return false;
-                }
-                for (let i = 0; i < a.length; i++) {
-                    if (!isEqualWithImpl(a[i], b[i], i, a, b, stack, areValuesEqual)) {
-                        return false;
-                    }
-                }
-                return true;
-            }
-            case arrayBufferTag: {
-                if (a.byteLength !== b.byteLength) {
-                    return false;
-                }
-                return areObjectsEqual(new Uint8Array(a), new Uint8Array(b), stack, areValuesEqual);
-            }
-            case dataViewTag: {
-                if (a.byteLength !== b.byteLength || a.byteOffset !== b.byteOffset) {
-                    return false;
-                }
-                return areObjectsEqual(new Uint8Array(a), new Uint8Array(b), stack, areValuesEqual);
-            }
-            case errorTag: {
-                return a.name === b.name && a.message === b.message;
-            }
-            case objectTag: {
-                const areEqualInstances = areObjectsEqual(a.constructor, b.constructor, stack, areValuesEqual) ||
-                    (isPlainObject(a) && isPlainObject(b));
-                if (!areEqualInstances) {
-                    return false;
-                }
-                const aKeys = [...Object.keys(a), ...getSymbols(a)];
-                const bKeys = [...Object.keys(b), ...getSymbols(b)];
-                if (aKeys.length !== bKeys.length) {
-                    return false;
-                }
-                for (let i = 0; i < aKeys.length; i++) {
-                    const propKey = aKeys[i];
-                    const aProp = a[propKey];
-                    if (!Object.hasOwn(b, propKey)) {
-                        return false;
-                    }
-                    const bProp = b[propKey];
-                    if (!isEqualWithImpl(aProp, bProp, propKey, a, b, stack, areValuesEqual)) {
-                        return false;
-                    }
-                }
-                return true;
-            }
-            default: {
-                return false;
-            }
-        }
-    }
-    finally {
-        stack.delete(a);
-        stack.delete(b);
-    }
-}
-
-function noop() { }
-
-function isEqual(a, b) {
-    return isEqualWith(a, b, noop);
-}
-
-function capitalize(str) {
-    return (str.charAt(0).toUpperCase() + str.slice(1).toLowerCase());
-}
-
-function Breadcrumbs(_a) {
-  var {
-      breadcrumbs
-    } = _a,
-    props = __rest(_a, ["breadcrumbs"]);
-  if (isArray(breadcrumbs)) {
-    return jsx("div", Object.assign({
-      dflex: true,
-      alignItems: "center",
-      trait: "typo.h5"
-    }, props, {
-      children: breadcrumbs.map((b, index) => jsx(BreadcrumbItem, {
-        breadcrumb: b,
-        showSeparator: index > 0
-      }, index))
-    }));
-  }
-  return jsx(QueryBreadcrumbs, {
-    queryFn: breadcrumbs.queryFn,
-    queryField: breadcrumbs.queryField,
-    generate: breadcrumbs.generate
-  });
-}
-function QueryBreadcrumbs(_a) {
-  var {
-      queryFn,
-      queryField,
-      generate
-    } = _a,
-    props = __rest(_a, ["queryFn", "queryField", "generate"]);
-  const params = useParams();
-  const id = queryField ? params[queryField] : undefined;
-  const {
-    data,
-    isLoading,
-    isError
-  } = useApiQuery([""], queryFn, id);
-  if (isLoading || isError) {
-    return jsxs("div", {
-      dflex: true,
-      alignItems: "center",
-      children: [jsx(Shimmer, {
-        h: "8",
-        w: "24"
-      }), jsx(Icon, {
-        path: mdiCircleSmall,
-        mx: "1"
-      }), jsx(Shimmer, {
-        h: "8",
-        w: "20"
-      })]
-    });
-  }
-  const breadcrumbs = generate(data);
-  return jsx("div", Object.assign({
-    dflex: true,
-    alignItems: "center",
-    trait: "typo.h5"
-  }, props, {
-    children: breadcrumbs.map((b, index) => jsx(BreadcrumbItem, {
-      breadcrumb: b,
-      showSeparator: index > 0
-    }, index))
-  }));
-}
-function BreadcrumbItem({
-  breadcrumb,
-  showSeparator
-}) {
-  return jsxs(Fragment, {
-    children: [showSeparator && jsx(Icon, {
-      path: mdiCircleSmall,
-      mx: "1"
-    }), jsx(Link, {
-      href: `/${breadcrumb.path || "#"}`,
-      children: jsx("span", {
-        // onClick={breadcrumb.path ? handleClick : undefined}
-        hover_textDecoration: breadcrumb.path ? "underline" : undefined,
-        cursor: breadcrumb.path ? "pointer" : undefined,
-        children: breadcrumb.label
-      })
-    })]
-  });
-}
-
-function DialogButton(_a) {
-  var {
-      buildDialog
-    } = _a,
-    props = __rest(_a, ["buildDialog"]);
-  const [showDialog, setShowDialog] = React.useState(false);
-  const onShowDialog = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    setShowDialog(true);
-  }, [setShowDialog]);
-  const onCloseDialog = React.useCallback(() => {
-    setShowDialog(false);
-  }, [setShowDialog]);
-  return jsxs(Fragment, {
-    children: [jsx(Button, Object.assign({
-      onClick: onShowDialog
-    }, props)), showDialog && buildDialog(onCloseDialog)]
-  });
-}
-
-function ButtonBar(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("div", Object.assign({
-    dflex: true,
-    border: "1px",
-    borderColor: "zinc-200",
-    divideX: "1px",
-    divideColor: "zinc-200",
-    rounded: "lg",
-    overflow: "hidden"
-  }, props, {
-    children: children
-  }));
-}
-const ButtonBarButton = /*#__PURE__*/React.forwardRef(function (_a, ref) {
-  var {
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "children"]);
-  return jsxs(Button, Object.assign({
-    scheme: "dark",
-    size: "sm",
-    aspectRatio: icon && !children ? "square" : undefined,
-    variant: "borderless",
-    dflex: true,
-    alignItems: "center",
-    placeContent: "center",
-    corners: "square",
-    gap: "2"
-  }, props, {
-    ref: ref,
-    children: [icon && jsx(Icon, {
-      path: icon
-    }), children]
-  }));
-});
-const ButtonBarSubmitButton = /*#__PURE__*/React.forwardRef(function (_a, ref) {
-  var _b;
-  var {
-      useDirty,
-      disabled,
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["useDirty", "disabled", "icon", "children"]);
-  const {
-    dirty,
-    handleSubmit
-  } = (_b = useFormikContext()) !== null && _b !== void 0 ? _b : {
-    dirty: false,
-    handleSubmit: undefined};
-  const onSubmit = React.useCallback(() => handleSubmit(), [handleSubmit]);
-  return jsxs(Button, Object.assign({
-    scheme: "dark",
-    size: "sm",
-    aspectRatio: icon && !children ? "square" : undefined,
-    variant: "borderless",
-    dflex: true,
-    alignItems: "center",
-    placeContent: "center",
-    corners: "square",
-    gap: "2",
-    disabled: useDirty && !dirty || disabled,
-    onClick: onSubmit
-  }, props, {
-    ref: ref,
-    children: [icon && jsx(Icon, {
-      path: icon
-    }), children]
-  }));
-});
-function ButtonBarDialogButton(_a) {
-  var {
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "children"]);
-  return jsxs(DialogButton, Object.assign({
-    scheme: "dark",
-    size: "sm",
-    aspectRatio: icon && !children ? "square" : undefined,
-    variant: "borderless",
-    dflex: true,
-    alignItems: "center",
-    placeContent: "center",
-    corners: "square",
-    gap: "2"
-  }, props, {
-    children: [icon && jsx(Icon, {
-      path: icon
-    }), children]
-  }));
-}
-
-function InvalidateButton(_a) {
-  var {
-      pathOrPermalink
-    } = _a,
-    props = __rest(_a, ["pathOrPermalink"]);
-  const api = INVALIDATE_API.new(pathOrPermalink);
-  const mutation = useApiMutation(api.invalidate, api.queryKey);
-  const invalidate = useMutate(mutation, {
-    successMsg: "Page successfully invalidated"
-  });
-  return jsx(ButtonBarButton, Object.assign({
-    title: "Regenerate",
-    disabled: mutation.isLoading,
-    onClick: invalidate,
-    icon: mdiDatabaseRefreshOutline
-  }, props));
-}
-
-function NavigateButton(_a) {
-  var {
-      path
-    } = _a,
-    props = __rest(_a, ["path"]);
-  const navigate = useNavigate();
-  const handleClick = React.useCallback(() => {
-    navigate(path);
-  }, [navigate, path]);
-  return jsx(Button, Object.assign({
-    type: "submit",
-    scheme: "dark",
-    variant: "glass",
-    corners: "pill",
-    w: "10",
-    h: "10",
-    onClick: handleClick
-  }, props, {
-    children: jsx(Icon, {
-      path: mdiPost
-    })
-  }));
-}
-
-function PublishButton(_a) {
-  var {
-      status,
-      queryId,
-      api
-    } = _a,
-    props = __rest(_a, ["status", "queryId", "api"]);
-  const isDraft = status == "draft";
-  const mutation = useInvalidateMutation(isDraft ? api.publish : api.unpublish, api.queryKey, queryId, {
-    networkMode: "always"
-  });
-  const publish = React.useCallback(() => {
-    mutation.reset();
-    mutation.mutateAsync(queryId).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch(error => toast.error(`Error: ${error}`));
-  }, [mutation, queryId]);
-  return jsx(ButtonBarButton$1, Object.assign({
-    disabled: mutation.isLoading,
-    onClick: publish,
-    icon: isDraft ? mdiEye : mdiEyeOff
-  }, props, {
-    children: isDraft ? "Publish" : "Switch to draft"
-  }));
-}
-
-const j = ["shift", "alt", "meta", "mod", "ctrl", "control"], Q = {
-  esc: "escape",
-  return: "enter",
-  left: "arrowleft",
-  right: "arrowright",
-  up: "arrowup",
-  down: "arrowdown",
-  ShiftLeft: "shift",
-  ShiftRight: "shift",
-  AltLeft: "alt",
-  AltRight: "alt",
-  MetaLeft: "meta",
-  MetaRight: "meta",
-  OSLeft: "meta",
-  OSRight: "meta",
-  ControlLeft: "ctrl",
-  ControlRight: "ctrl"
-};
-function K(e) {
-  return (Q[e.trim()] || e.trim()).toLowerCase().replace(/key|digit|numpad/, "");
-}
-function D(e) {
-  return j.includes(e);
-}
-function H(e, r = ",") {
-  return e.toLowerCase().split(r);
-}
-function P(e, r = "+", o = ">", i = false, u) {
-  let n = [], c = false;
-  e = e.trim(), e.includes(o) ? (c = true, n = e.toLocaleLowerCase().split(o).map((f) => K(f))) : n = e.toLocaleLowerCase().split(r).map((f) => K(f));
-  const y = {
-    alt: n.includes("alt"),
-    ctrl: n.includes("ctrl") || n.includes("control"),
-    shift: n.includes("shift"),
-    meta: n.includes("meta"),
-    mod: n.includes("mod"),
-    useKey: i
-  }, d = n.filter((f) => !j.includes(f));
-  return {
-    ...y,
-    keys: d,
-    description: u,
-    isSequence: c,
-    hotkey: e
-  };
-}
-typeof document < "u" && (document.addEventListener("keydown", (e) => {
-  e.code !== void 0 && I([K(e.code)]);
-}), document.addEventListener("keyup", (e) => {
-  e.code !== void 0 && _([K(e.code)]);
-})), typeof window < "u" && (window.addEventListener("blur", () => {
-  L.clear();
-}), window.addEventListener("contextmenu", () => {
-  setTimeout(() => {
-    L.clear();
-  }, 0);
-}));
-const L = /* @__PURE__ */ new Set();
-function R(e) {
-  return Array.isArray(e);
-}
-function U(e, r = ",") {
-  return (R(e) ? e : e.split(r)).every((i) => L.has(i.trim().toLowerCase()));
-}
-function I(e) {
-  const r = Array.isArray(e) ? e : [e];
-  L.has("meta") && L.forEach((o) => !D(o) && L.delete(o.toLowerCase())), r.forEach((o) => L.add(o.toLowerCase()));
-}
-function _(e) {
-  const r = Array.isArray(e) ? e : [e];
-  e === "meta" ? L.clear() : r.forEach((o) => L.delete(o.toLowerCase()));
-}
-function V(e, r, o) {
-  (typeof o == "function" && o(e, r) || o === true) && e.preventDefault();
-}
-function X(e, r, o) {
-  return typeof o == "function" ? o(e, r) : o === true || o === void 0;
-}
-const Y = [
-  "input",
-  "textarea",
-  "select",
-  "searchbox",
-  "slider",
-  "spinbutton",
-  "menuitem",
-  "menuitemcheckbox",
-  "menuitemradio",
-  "option",
-  "radio",
-  "textbox"
-];
-function Z(e) {
-  return F(e, Y);
-}
-function F(e, r = false) {
-  const { target: o, composed: i } = e;
-  let u, n;
-  return ee(o) && i ? (u = e.composedPath()[0] && e.composedPath()[0].tagName, n = e.composedPath()[0] && e.composedPath()[0].role) : (u = o && o.tagName, n = o && o.role), R(r) ? !!(u && r && r.some((c) => c.toLowerCase() === u.toLowerCase() || c === n)) : !!(u && r && r);
-}
-function ee(e) {
-  return !!e.tagName && !e.tagName.startsWith("-") && e.tagName.includes("-");
-}
-function te(e, r) {
-  return e.length === 0 && r ? (console.warn(
-    'A hotkey has the "scopes" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'
-  ), true) : r ? e.some((o) => r.includes(o)) || e.includes("*") : true;
-}
-const re = (e, r, o = false) => {
-  const { alt: i, meta: u, mod: n, shift: c, ctrl: y, keys: d, useKey: f } = r, { code: p, key: t, ctrlKey: a, metaKey: l, shiftKey: g, altKey: k } = e, m = K(p);
-  if (f && d?.length === 1 && d.includes(t))
-    return true;
-  if (!d?.includes(m) && !["ctrl", "control", "unknown", "meta", "alt", "shift", "os"].includes(m))
-    return false;
-  if (!o) {
-    if (i !== k && m !== "alt" || c !== g && m !== "shift")
-      return false;
-    if (n) {
-      if (!l && !a)
-        return false;
-    } else if (u !== l && m !== "meta" && m !== "os" || y !== a && m !== "ctrl" && m !== "control")
-      return false;
-  }
-  return d && d.length === 1 && d.includes(m) ? true : d ? U(d) : !d;
-}, $ = createContext(void 0), oe = () => useContext$2($);
-function x(e, r) {
-  return e && r && typeof e == "object" && typeof r == "object" ? Object.keys(e).length === Object.keys(r).length && // @ts-expect-error TS7053
-  Object.keys(e).reduce((o, i) => o && x(e[i], r[i]), true) : e === r;
-}
-const W = createContext({
-  hotkeys: [],
-  activeScopes: [],
-  // This array has to be empty instead of containing '*' as default, to check if the provider is set or not
-  toggleScope: () => {
-  },
-  enableScope: () => {
-  },
-  disableScope: () => {
-  }
-}), se = () => useContext$2(W);
-function ie(e) {
-  const r = useRef(void 0);
-  return x(r.current, e) || (r.current = e), r.current;
-}
-const N = (e) => {
-  e.stopPropagation(), e.preventDefault(), e.stopImmediatePropagation();
-}, ue = typeof window < "u" ? useLayoutEffect : useEffect;
-function fe(e, r, o, i) {
-  const u = useRef(null), n = useRef(false), c = Array.isArray(o) ? Array.isArray(i) ? void 0 : i : o, y = R(e) ? e.join(c?.delimiter) : e, d = Array.isArray(o) ? o : Array.isArray(i) ? i : void 0, f = useCallback(r, d ?? []), p = useRef(f);
-  d ? p.current = f : p.current = r;
-  const t = ie(c), { activeScopes: a } = se(), l = oe();
-  return ue(() => {
-    if (t?.enabled === false || !te(a, t?.scopes))
-      return;
-    let g = [], k;
-    const m = (s, B = false) => {
-      if (!(Z(s) && !F(s, t?.enableOnFormTags))) {
-        if (u.current !== null) {
-          const v = u.current.getRootNode();
-          if ((v instanceof Document || v instanceof ShadowRoot) && v.activeElement !== u.current && !u.current.contains(v.activeElement)) {
-            N(s);
-            return;
-          }
-        }
-        s.target?.isContentEditable && !t?.enableOnContentEditable || H(y, t?.delimiter).forEach((v) => {
-          if (v.includes(t?.splitKey ?? "+") && v.includes(t?.sequenceSplitKey ?? ">")) {
-            console.warn(
-              `Hotkey ${v} contains both ${t?.splitKey ?? "+"} and ${t?.sequenceSplitKey ?? ">"} which is not supported.`
-            );
-            return;
-          }
-          const h = P(
-            v,
-            t?.splitKey,
-            t?.sequenceSplitKey,
-            t?.useKey,
-            t?.description
-          );
-          if (h.isSequence) {
-            k = setTimeout(() => {
-              g = [];
-            }, t?.sequenceTimeoutMs ?? 1e3);
-            const C = h.useKey ? s.key : K(s.code);
-            if (D(C.toLowerCase()))
-              return;
-            g.push(C);
-            const G = h.keys?.[g.length - 1];
-            if (C !== G) {
-              g = [], k && clearTimeout(k);
-              return;
-            }
-            g.length === h.keys?.length && (p.current(s, h), k && clearTimeout(k), g = []);
-          } else if (re(s, h, t?.ignoreModifiers) || h.keys?.includes("*")) {
-            if (t?.ignoreEventWhen?.(s) || B && n.current)
-              return;
-            if (V(s, h, t?.preventDefault), !X(s, h, t?.enabled)) {
-              N(s);
-              return;
-            }
-            p.current(s, h), B || (n.current = true);
-          }
-        });
-      }
-    }, O = (s) => {
-      s.code !== void 0 && (I(K(s.code)), (t?.keydown === void 0 && t?.keyup !== true || t?.keydown) && m(s));
-    }, q = (s) => {
-      s.code !== void 0 && (_(K(s.code)), n.current = false, t?.keyup && m(s, true));
-    }, E = u.current || c?.document || document;
-    return E.addEventListener("keyup", q, c?.eventListenerOptions), E.addEventListener("keydown", O, c?.eventListenerOptions), l && H(y, t?.delimiter).forEach(
-      (s) => l.addHotkey(
-        P(
-          s,
-          t?.splitKey,
-          t?.sequenceSplitKey,
-          t?.useKey,
-          t?.description
-        )
-      )
-    ), () => {
-      E.removeEventListener("keyup", q, c?.eventListenerOptions), E.removeEventListener("keydown", O, c?.eventListenerOptions), l && H(y, t?.delimiter).forEach(
-        (s) => l.removeHotkey(
-          P(
-            s,
-            t?.splitKey,
-            t?.sequenceSplitKey,
-            t?.useKey,
-            t?.description
-          )
-        )
-      ), g = [], k && clearTimeout(k);
-    };
-  }, [y, t, a]), u;
-}
-
-function UpdateButton(_a) {
-  var _b;
-  var props = __rest(_a, []);
-  const {
-    dirty,
-    handleSubmit
-  } = (_b = useFormikContext()) !== null && _b !== void 0 ? _b : {
-    dirty: false,
-    handleSubmit: undefined};
-  fe('ctrl+s', () => {
-    if (dirty && !props.disabled) handleSubmit();
-  }, {
-    preventDefault: true
-  }, [dirty, props, handleSubmit]);
-  return jsx(ButtonBarSubmitButton$1, Object.assign({
-    icon: mdiCloudUpload
-  }, props, {
-    children: "Update"
-  }));
-}
-
-function ViewButton(_a) {
-  var {
-      label,
-      path,
-      icon
-    } = _a,
-    props = __rest(_a, ["label", "path", "icon"]);
-  const openPage = React.useCallback(() => {
-    window.open(path, '_blank');
-  }, [path]);
-  return jsx(ButtonBarButton$1, Object.assign({
-    onClick: openPage,
-    dflex: true,
-    alignItems: "center",
-    gap: "2",
-    icon: icon || mdiOpenInNew
-  }, props, {
-    children: label
-  }));
-  // return (
-  //     <IconButton icon={icon ? icon : mdiOpenInNew} type="submit" scheme="dark" variant="glass" size="md" onClick={openPage} {...props}/>
-  // )
-}
-
-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 => {
-      toast.error(`Error: ${error}`);
-    });
-  }, [mutationDown, postId]);
-  const moveUp = React.useCallback(e => {
-    e.stopPropagation();
-    mutationUp.mutateAsync(postId).catch(error => {
-      toast.error(`Error: ${error}`);
-    });
-  }, [mutationUp, postId]);
-  return jsxs(FlexCenter, {
-    placeContent: "start",
-    numericFontVariant: "tabular-nums",
-    children: [order, jsx(Button, {
-      ms: "3",
-      variant: "borderless",
-      scheme: "dark",
-      onClick: moveUp,
-      children: jsx(Icon, {
-        path: mdiArrowUpBoldBox
-      })
-    }), jsx(Button, {
-      variant: "borderless",
-      scheme: "dark",
-      onClick: moveDown,
-      children: jsx(Icon, {
-        path: mdiArrowDownBoldBox
-      })
-    })]
-  });
-}
-
-function PageContainer(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx(Container, Object.assign({
-    center: true,
-    dflex: true,
-    flexCol: true,
-    gap: "8"
-  }, props, {
-    children: children
-  }));
-}
-
-function PageMain(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx(Tile, Object.assign({
-    scheme: "light",
-    p: "5"
-  }, props, {
-    children: children
-  }));
-}
-
-function PageContentEditor(_a) {
-  var {
-      name
-    } = _a,
-    props = __rest(_a, ["name"]);
-  const extensions = [ImageExtension];
-  return jsx(PageMain, Object.assign({
-    h: "min"
-  }, props, {
-    children: jsx(FormEditor, {
-      minH: "128",
-      minW: "144",
-      maxW: props.maxW,
-      // w={props.w}
-      name: name,
-      placeHolder: "Write here...",
-      extensions: extensions
-    })
-  }));
-}
-
-function PageQueryStateContainerInner(_a) {
-  var {
-      queryId,
-      api,
-      apiFn,
-      loadingStyles,
-      errorStyles,
-      children
-    } = _a,
-    props = __rest(_a, ["queryId", "api", "apiFn", "loadingStyles", "errorStyles", "children"]);
-  // @ts-ignore
-  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 jsx(QueryLoadingState, Object.assign({
-    w: "full",
-    h: "100%"
-  }, loadingStyles));
-  if (isError) return jsx(RetryOnError, Object.assign({
-    p: "0",
-    onClick: invalidate
-  }, errorStyles));
-  return jsx(PageContainer, Object.assign({}, props, {
-    children: apiFn == "get" ? children(data) : children(data)
-  }));
-}
-const PageQueryStateContainer = /*#__PURE__*/React.forwardRef(PageQueryStateContainerInner);
-
-function PageSidebar(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("div", Object.assign({
-    w: "112",
-    minW: "112",
-    minH: "100%",
-    gap: "8",
-    dflex: true,
-    flexCol: true
-  }, props, {
-    children: children
-  }));
-}
-
-function PageSidebarSection(_a) {
-  var {
-      title,
-      children
-    } = _a,
-    props = __rest(_a, ["title", "children"]);
-  return jsxs("div", Object.assign({
-    w: "full"
-  }, props, {
-    children: [title && jsx(PageSectionTitle$1, {
-      children: title
-    }), children]
-  }));
-}
-
-function PageTitle(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("div", Object.assign({
-    trait: "typo.h5"
-  }, props, {
-    children: children
-  }));
-}
-
-function PageTopBar(_a) {
-  var {
-      title,
-      breadcrumbs,
-      children
-    } = _a,
-    props = __rest(_a, ["title", "breadcrumbs", "children"]);
-  return jsxs(FlexCenter, Object.assign({
-    gap: "3",
-    minH: "9"
-  }, props, {
-    children: [title && jsx(PageTitle, {
-      children: title
-    }), breadcrumbs && jsx(Breadcrumbs, {
-      breadcrumbs: breadcrumbs
-    }), jsx("div", {
-      flexGrow: true
-    }), children]
-  }));
-}
-const [CP, usePageTabbedTopBarContext] = createContext$1();
-function PageTabbedTopBarProvider({
-  children
-}) {
-  const [containerEl, setContainerEl] = React.useState(null);
-  return jsx(CP, {
-    value: {
-      containerEl,
-      setContainerEl
-    },
-    children: children
-  });
-}
-function PageTabbedTopBar(_a) {
-  var {
-      title,
-      breadcrumbs,
-      children
-    } = _a,
-    props = __rest(_a, ["title", "breadcrumbs", "children"]);
-  const ref = /*#__PURE__*/React.createRef();
-  const {
-    setContainerEl
-  } = usePageTabbedTopBarContext();
-  const [isSet, setIsSet] = React.useState(false);
-  React.useEffect(() => {
-    if (!isSet && ref.current) {
-      setContainerEl(ref.current);
-      setIsSet(true);
-    }
-    return () => setContainerEl(null);
-  }, []);
-  return jsx(FlexCenter, Object.assign({
-    gap: "3",
-    minH: "9"
-  }, props, {
-    children: jsxs(Fragment, {
-      children: [title && jsx(PageTitle, {
-        children: title
-      }), breadcrumbs && jsx(Breadcrumbs, {
-        breadcrumbs: breadcrumbs
-      }), jsx("div", {
-        flexGrow: true
-      }), jsx("div", {
-        ref: ref,
-        dflex: true,
-        flexRow: true,
-        gap: "3"
-      }), children]
-    })
-  }));
-}
-function PageTopBarToolbar({
-  trackingRef,
-  children
-}) {
-  const {
-    containerEl
-  } = usePageTabbedTopBarContext();
-  const [visible, setVisible] = React.useState(false);
-  const portal = React.useMemo(() => {
-    const node = containerEl; //?.ownerDocument.createElement("div")
-    // if (node) node.className = PORTAL_CLASSNAME
-    return node;
-  }, [containerEl]);
-  const host = containerEl !== null && containerEl !== void 0 ? containerEl : typeof window !== "undefined" ? document.body : undefined;
-  React.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 = React.useCallback(entries => {
-    // @ts-ignore
-    setVisible(entries[0].isVisible);
-  }, [children]);
-  React.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 /*#__PURE__*/createPortal(children, portal);
-  return null;
-}
-
-function ScreenTopBar({
-  tabbed,
-  breadcrumbs,
-  api,
-  item,
-  isLoading,
-  buttonBar,
-  trackingRef
-}) {
-  return jsxs(Fragment, {
-    children: [tabbed && jsx(PageTopBarToolbar, {
-      trackingRef: trackingRef,
-      children: jsx(Buttons$1, {
-        api: api,
-        item: item,
-        isLoading: isLoading,
-        buttonBar: buttonBar
-      })
-    }), !tabbed && jsx(PageTopBar, {
-      breadcrumbs: breadcrumbs,
-      children: jsx(Buttons$1, {
-        api: api,
-        item: item,
-        isLoading: isLoading,
-        buttonBar: buttonBar
-      })
-    })]
-  });
-}
-function Buttons$1({
-  api,
-  item,
-  isLoading,
-  buttonBar
-}) {
-  return jsxs(Fragment, {
-    children: [buttonBar && buttonBar.length > 0 && jsx(ButtonBar$1, {
-      children: buttonBar.map((button, index) => jsxs(React.Fragment, {
-        children: [button.type === "link" && jsx(ViewButton, {
-          label: button.label,
-          path: button.path,
-          icon: button.icon
-        }), button.type === "invalidate" && jsx(InvalidateButton, {
-          pathOrPermalink: button.pathOrPermalink
-        }), button.type == "custom" && button.render(item)]
-      }, index))
-    }), jsxs(ButtonBar$1, {
-      children: [api instanceof API && jsx(PublishButton, {
-        api: api,
-        queryId: item.id,
-        status: item.status,
-        disabled: isLoading
-      }), 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(_a) {
-  var {
-      queryField,
-      api,
-      useNextRouter,
-      processInput,
-      screen,
-      tabbed
-    } = _a,
-    props = __rest(_a, ["queryField", "api", "useNextRouter", "processInput", "screen", "tabbed"]);
-  const id = useQueryField(queryField, useNextRouter);
-  const ref = React.useRef(null);
-  return jsx(PageQueryStateContainer, Object.assign({
-    api: api,
-    apiFn: "get",
-    queryId: id,
-    ref: ref,
-    p: "5"
-  }, props, {
-    children: item => jsx(Internal, {
-      item: item,
-      screen: screen,
-      api: api,
-      tabbed: tabbed,
-      processInput: processInput,
-      containerRef: ref
-    })
-  }));
-}
-function Internal({
-  item,
-  screen,
-  api,
-  processInput,
-  tabbed,
-  containerRef
-}) {
-  var _a, _b, _c;
-  const pScreen = runIfFn(screen, item);
-  const {
-    breadcrumbs,
-    schema,
-    initialValues,
-    header,
-    sections,
-    buttonBar,
-    type,
-    invalidateParentQueryKey,
-    invalidatePage
-  } = pScreen;
-  const mutation = useInvalidateParentMutation(api.update, invalidateParentQueryKey !== null && invalidateParentQueryKey !== void 0 ? invalidateParentQueryKey : api.queryKey, {
-    networkMode: "always"
-  });
-  const invalidatePageFn = useInvalidatePage(invalidatePage || "");
-  const save = useMutate(mutation, {
-    processInput,
-    successMsg: (item, values) => `${item.title || item.name} updated.`,
-    errorMsg: (error, item) => `Error updating ${item.title || item.name}: ${error}`,
-    onSuccess: () => {
-      if (invalidatePage) invalidatePageFn();
-    }
-  });
-  let editorMaxW = undefined;
-  if (!type || type == "post") editorMaxW = "calc(1280px - 28rem)";else if (type == "section") editorMaxW = "calc(1280px - 22rem)";
-  return jsxs(FormProvider, {
-    initialValues: runIfFn(initialValues, item),
-    validationSchema: schema,
-    onSubmit: save,
-    enableReinitialize: true,
-    children: [jsx(ScreenTopBar, {
-      tabbed: tabbed,
-      api: api,
-      breadcrumbs: breadcrumbs,
-      buttonBar: buttonBar,
-      item: item,
-      isLoading: mutation.isLoading,
-      trackingRef: containerRef === null || containerRef === void 0 ? void 0 : containerRef.current
-    }), type == "form" && (sections === null || sections === void 0 ? void 0 : sections.map((section, index) => jsx(Section, {
-      section: section,
-      item: item
-    }, index))), (pScreen.type == "post" || pScreen.type == "section") && jsx("div", {
-      p: "5",
-      bgColor: "slate-100",
-      rounded: "lg",
-      children: jsxs(PageContainer, {
-        w: editorMaxW ? "auto" : "full",
-        size: "x2",
-        id: "pagecontainer",
-        children: [header, jsxs("div", {
-          dflex: true,
-          gap: "5",
-          children: [jsxs("div", {
-            dflex: true,
-            flexCol: true,
-            gap: "8",
-            flexGrow: true,
-            children: [((_a = pScreen.editor) === null || _a === void 0 ? void 0 : _a.type) != "textarea" &&
-            // TODO Find a way to make this editor shrink in width when resizing the window...
-            jsx(PageContentEditor, {
-              name: "content",
-              maxW: editorMaxW,
-              minW: "144",
-              shadow: true,
-              rounded: "lg"
-            }), ((_b = pScreen.editor) === null || _b === void 0 ? void 0 : _b.type) == "textarea" && jsx(TextArea, {
-              name: (_c = pScreen.editor) === null || _c === void 0 ? void 0 : _c.name,
-              maxW: editorMaxW,
-              minW: editorMaxW,
-              w: editorMaxW,
-              minH: "128",
-              rows: 25,
-              bgColor: "white",
-              border: "0",
-              shadow: true,
-              p: "5",
-              textColor: "slate-800"
-            }), pScreen.editorFooter]
-          }), jsx(PageSidebar, {
-            children: sections === null || sections === void 0 ? void 0 : sections.map((section, index) => jsx(Section, {
-              section: section,
-              item: 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 jsx(PageSidebarSection, Object.assign({
-      title: section.title
-    }, style, {
-      children: 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 === undefined) return {
-    id: undefined,
-    api: api
-  };
-  const {
-    [queryField]: id
-  } = params;
-  return {
-    id,
-    api: runIfFn(api, id)
-  };
-}
-function QueryWrapper(_a) {
-  var {
-      api,
-      queryField,
-      fn,
-      transformFn,
-      config,
-      tabbed
-    } = _a,
-    props = __rest(_a, ["api", "queryField", "fn", "transformFn", "config", "tabbed"]);
-  const {
-    id,
-    api: mApi
-  } = useApi(api, queryField);
-  const {
-    data
-  } = useApiQuery(mApi.queryKey, fn === "get" || fn === "getTransformed" ? mApi.get : mApi.getAll, isFunction(api) ? undefined : 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}`);
-      return transformFn === null || transformFn === void 0 ? void 0 : transformFn(data);
-    }
-    return data;
-  }, [data]);
-  // TODO states
-  if (!data) return null;
-  return jsx(ScreenRenderer, Object.assign({
-    config: config(transformedData),
-    tabbed: tabbed
-  }, props));
-}
-
-function TabbedView(_a) {
-  var {
-      queryField,
-      api,
-      screen
-    } = _a;
-    __rest(_a, ["queryField", "api", "screen"]);
-  const {
-    [queryField]: id
-  } = useParams();
-  return jsx(PageQueryStateContainer, {
-    queryId: id,
-    api: api,
-    apiFn: "get",
-    p: "5",
-    children: city => {
-      const {
-        breadcrumbs,
-        tabs
-      } = runIfFn(screen, city);
-      return jsxs(PageTabbedTopBarProvider, {
-        children: [jsx(PageTabbedTopBar, {
-          breadcrumbs: breadcrumbs,
-          mb: "-3"
-        }), jsx(TabContainer, {
-          tabs: tabs.map(tab => tab.label),
-          saveKey: `tab-${id}`,
-          mt: "-3",
-          mb: "3",
-          id: "fff",
-          children: tabs.map((tab, index) => jsx(TabView, {
-            tab: 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 jsx(ScreenRenderer, {
-    config: tab.config,
-    tabbed: true,
-    p: "0"
-  });
-}
-
-const [provider$1, useContext$1] = createContext$1();
-function getColId(column) {
-  var _a;
-  return (_a = column.accessorKey) !== null && _a !== void 0 ? _a : column.id;
-}
-function TableContainerContextProvider({
-  initialVisibleColumns,
-  columns,
-  children
-}) {
-  var _a, _b;
-  const [showFilters, setShowFilters] = React.useState(false);
-  const [showMassActions, setShowMassActions] = React.useState(false);
-  const [visibleColumnIds, setVisibleColumnIds] = React.useState((_a = initialVisibleColumns !== null && initialVisibleColumns !== void 0 ? initialVisibleColumns : columns === null || columns === void 0 ? void 0 : columns.map(col => getColId(col))) !== null && _a !== void 0 ? _a : []);
-  const filteredColumns = (_b = columns === null || columns === void 0 ? void 0 : columns.filter(col => visibleColumnIds.includes(getColId(col)))) !== null && _b !== void 0 ? _b : [];
-  const toggleColumnVisibility = React.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 = React.useCallback(id => {
-    return visibleColumnIds.includes(id);
-  }, [visibleColumnIds]);
-  const Provider = provider$1;
-  const value = {
-    showFilters,
-    setShowFilters,
-    showMassActions,
-    setShowMassActions,
-    columns: columns !== null && columns !== void 0 ? columns : [],
-    filteredColumns,
-    toggleColumnVisibility,
-    isColumnVisible
-  };
-  return jsx(Provider, {
-    value: value,
-    children: children
-  });
-}
-
-function TableContainer(_a) {
-  var {
-      initialPageSize,
-      initialVisibleColumns,
-      columns,
-      filtersMethod = "reactRouter",
-      children
-    } = _a,
-    props = __rest(_a, ["initialPageSize", "initialVisibleColumns", "columns", "filtersMethod", "children"]);
-  return jsx("div", Object.assign({
-    w: "full",
-    dflex: true,
-    flexCol: true
-  }, props, {
-    children: jsx(TableContextProvider, {
-      initialPageSize: initialPageSize,
-      filtersMethod: filtersMethod,
-      children: jsx(TableContainerContextProvider, {
-        columns: columns,
-        initialVisibleColumns: initialVisibleColumns,
-        children: children
-      })
-    })
-  }));
-}
-
-function TableCreateButton(_a) {
-  var {
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "children"]);
-  return jsxs(ButtonBarDialogButton$1, Object.assign({}, props, {
-    children: [jsx(Icon, {
-      path: icon !== null && icon !== void 0 ? icon : mdiPlusThick
-    }), children]
-  }));
-}
-
-function TableFilterButton(_a) {
-  var props = __rest(_a, []);
-  // return <Button scheme="secondary" {...props}><Icon path={mdiFilter} /></Button>
-  return jsxs(Popover, {
-    side: "bottom-end",
-    modal: true,
-    children: [jsx(Button, Object.assign({
-      scheme: "dark",
-      size: "sm",
-      aspectRatio: "square",
-      variant: "borderless",
-      corners: "square"
-    }, props, {
-      children: jsx(Icon, {
-        path: mdiFilter
-      })
-    })), jsxs("div", {
-      bgColor: "white",
-      rounded: true,
-      shadow: true,
-      children: [jsx("div", {
-        py: "3",
-        hover_bgColor: "#ff0000",
-        px: "5",
-        hover_textColor: "white",
-        children: "First Item"
-      }), jsx("div", {
-        py: "3",
-        hover_bgColor: "#ff0000",
-        px: "5",
-        hover_textColor: "white",
-        children: "Second Item"
-      }), jsx("div", {
-        py: "3",
-        hover_bgColor: "#ff0000",
-        px: "5",
-        hover_textColor: "white",
-        children: "Third Item"
-      })]
-    })]
-  });
-}
-
-function TableTopBar(_a) {
-  var {
-      title,
-      breadcrumbs,
-      children
-    } = _a,
-    props = __rest(_a, ["title", "breadcrumbs", "children"]);
-  return jsxs("div", Object.assign({
-    dflex: true,
-    flexRow: true,
-    alignItems: "center",
-    gap: "3",
-    p: "8"
-  }, props, {
-    children: [jsxs("div", {
-      children: [title && jsx("h2", {
-        textSize: "x2",
-        fontWeight: "600",
-        textColor: "#3f4254",
-        textTransform: "capitalize",
-        children: title
-      }), breadcrumbs && jsx(Breadcrumbs$1, {
-        breadcrumbs: breadcrumbs
-      })]
-    }), jsx("div", {
-      flexGrow: true,
-      children: "\u00A0"
-    }), children]
-  }));
-}
-
-function compareValues(a, b, order) {
-    if (a < b) {
-        return order === 'asc' ? -1 : 1;
-    }
-    if (a > b) {
-        return order === 'asc' ? 1 : -1;
-    }
-    return 0;
-}
-
-function orderBy(arr, criteria, orders) {
-    return arr.slice().sort((a, b) => {
-        const ordersLength = orders.length;
-        for (let i = 0; i < criteria.length; i++) {
-            const order = ordersLength > i ? orders[i] : orders[ordersLength - 1];
-            const criterion = criteria[i];
-            const criterionIsFunction = typeof criterion === 'function';
-            const valueA = criterionIsFunction ? criterion(a) : a[criterion];
-            const valueB = criterionIsFunction ? criterion(b) : b[criterion];
-            const result = compareValues(valueA, valueB, order);
-            if (result !== 0) {
-                return result;
-            }
-        }
-        return 0;
-    });
-}
-
-function sortBy(arr, criteria) {
-    return orderBy(arr, criteria, ['asc']);
-}
-
-function TableFilters({
-  form,
-  initialValues,
-  schema,
-  processInput
-}) {
-  const {
-    showFilters
-  } = useContext$1();
-  const {
-    getFilters,
-    setFilters
-  } = useTableContext();
-  const handleSubmit = React.useCallback((values, actions) => {
-    var _a;
-    const params = (_a = processInput === null || processInput === void 0 ? void 0 : processInput(values)) !== null && _a !== void 0 ? _a : values;
-    if (!isEqual(params, getFilters())) setFilters(params);
-    // setFilters(processInput?.(values) ?? values)
-    actions.setSubmitting(false);
-  }, [setFilters, processInput]);
-  const handleReset = React.useCallback(resetForm => {
-    setFilters(initialValues);
-    resetForm();
-  }, [setFilters, initialValues]);
-  React.useEffect(() => setFilters(initialValues), []);
-  return jsx(Collapse, {
-    in: showFilters,
-    style: {
-      overflow: showFilters ? "initial" : "hidden"
-    },
-    children: jsx("div", {
-      p: "8",
-      borderT: "px",
-      borderB: "px",
-      borderColor: "slate-100",
-      children: jsx(FormProvider, {
-        initialValues: mergeInitialFormValues(getFilters(), initialValues),
-        onSubmit: handleSubmit,
-        validationSchema: schema,
-        enableReinitialize: true,
-        children: props => jsxs("div", {
-          dflex: true,
-          gap: "3",
-          placeContent: "start",
-          children: [jsx(FormRenderer, {
-            flexRow: true,
-            w: "auto",
-            form: form
-          }), jsx(Buttons, {
-            handleReset: () => handleReset(props.resetForm)
-          })]
-        })
-      })
-    })
-  });
-}
-function Buttons({
-  handleReset
-}) {
-  return jsxs("div", {
-    dflex: true,
-    gap: "3",
-    children: [jsxs("div", {
-      dflex: true,
-      flexCol: true,
-      children: [jsx(FieldLabel, {
-        name: "",
-        label: "\u00A0"
-      }), jsx(SubmitButton, {
-        children: "Filter"
-      })]
-    }), jsxs("div", {
-      dflex: true,
-      flexCol: true,
-      children: [jsx(FieldLabel, {
-        name: "",
-        label: "\u00A0"
-      }), jsx(Button, {
-        scheme: "neutral",
-        onClick: handleReset,
-        children: "Reset"
-      })]
-    })]
-  });
-}
-
-function ActionButton$1({
-  label,
-  buttonProps,
-  icon,
-  queryKey,
-  queryFn,
-  successMsg,
-  errorMsg,
-  invalidateParent
-}) {
-  const mutation = invalidateParent ? useInvalidateParentMutation(queryFn, queryKey) : useApiMutation(queryFn, queryKey);
-  const mutate = useMutate(mutation, {
-    successMsg,
-    errorMsg
-  });
-  return jsxs(Button, Object.assign({
-    display: "flex",
-    alignItems: "center",
-    gap: "3"
-  }, buttonProps, {
-    onClick: mutate,
-    disabled: mutation.isLoading,
-    children: [icon && jsx(Icon, {
-      path: icon
-    }), label]
-  }));
-}
-
-function TableMassActions({
-  actions
-}) {
-  const {
-    ids
-  } = useTableContext();
-  const showMassActions = ids && ids.length > 0;
-  return jsx(Collapse, {
-    in: showMassActions,
-    style: {
-      overflow: showMassActions ? "initial" : "hidden"
-    },
-    children: jsx("div", {
-      dflex: true,
-      gap: "3",
-      flexWrap: true,
-      alignItems: "center",
-      px: "8",
-      pt: "5",
-      children: actions.map((action, index) => jsx("div", {
-        children: action.type == "button" && !action.showConfirmationDialog && jsx(ActionButton$1, {
-          label: action.label,
-          queryFn: action.queryFn,
-          queryKey: action.queryKey,
-          buttonProps: action.buttonProps
-        })
-      }, index))
-    })
-  });
-}
-
-const defaultErrorMsg$1 = "Oops, something went wrong...";
-function nonNullValues(data) {
-  var _a;
-  if (data) {
-    const nonNullData = Object.assign({}, data);
-    for (const key in data) nonNullData[key] = (_a = nonNullData[key]) !== null && _a !== void 0 ? _a : "";
-    return nonNullData;
-  }
-  return data;
-}
-function ItemEditDialog(_a) {
-  var _b, _c, _d, _e;
-  var {
-      initialValues,
-      itemLabel,
-      queryId = "",
-      api,
-      queryFetchOptions,
-      querySaveOptions,
-      onSuccess,
-      onFetchError,
-      fetchErrorMsg = defaultErrorMsg$1,
-      onSaveError,
-      saveErrorMsg = defaultErrorMsg$1,
-      fetchToFormData,
-      formToQueryData,
-      invalidateQueriesOnSuccess = true,
-      invalidateQueryKey,
-      retryText = "Retry",
-      cancelLabel = "Cancel",
-      saveLabel,
-      size = "lg",
-      title,
-      form,
-      show,
-      onClose,
-      formikProps
-    } = _a,
-    props = __rest(_a, ["initialValues", "itemLabel", "queryId", "api", "queryFetchOptions", "querySaveOptions", "onSuccess", "onFetchError", "fetchErrorMsg", "onSaveError", "saveErrorMsg", "fetchToFormData", "formToQueryData", "invalidateQueriesOnSuccess", "invalidateQueryKey", "retryText", "cancelLabel", "saveLabel", "size", "title", "form", "show", "onClose", "formikProps"]);
-  const {
-    isInitialLoading,
-    isFetching,
-    data,
-    isError,
-    error /*, error*/,
-    refetch
-  } = useApiQuery(api.queryKey, api.get, queryId, Object.assign({
-    enabled: !(/*queryId == 0 || */queryId == "" || queryId == null || queryId == undefined),
-    onError: onFetchError
-  }, queryFetchOptions));
-  // const [activeTab, setActiveTab] = React.useState(form && Array.isArray(form) ? form[0].key : "");
-  // const [showTab, setShowTab] = React.useState(true);
-  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(api.upsert, invalidateQueryKey !== null && invalidateQueryKey !== void 0 ? invalidateQueryKey : api.queryKey, querySaveOptions) : useApiMutation(api.upsert, api.queryKey, queryId, querySaveOptions);
-  const retry = React.useCallback(() => refetch(), [refetch]);
-  const saveItem = React.useCallback((item, actions) => __awaiter(this, void 0, void 0, function* () {
-    // Clear mutation error if any
-    mutation.reset();
-    const formItem = formToQueryData ? formToQueryData(item) : Object.assign({}, item);
-    yield mutation.mutateAsync(formItem).then(response => {
-      var _a;
-      if (onSuccess) onSuccess(formItem, response);else toast.success(`${title ? title(formItem) : (_a = formItem.name) !== null && _a !== void 0 ? _a : formItem.title} ${queryId ? "saved" : "created"}`);
-      // closing delete modal
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-    }).catch(error => {
-      var _a;
-      console.error("on error", error);
-      if (onSaveError) onSaveError(item);else toast.error(`Couldn't save ${title ? title(formItem) : (_a = formItem.name) !== null && _a !== void 0 ? _a : formItem.title}`);
-      actions.setSubmitting(false);
-    });
-  }), [mutation, formToQueryData, onSuccess, onSaveError, onClose]);
-  // const switchTab = React.useCallback((tab: string) =>
-  // {
-  // setActiveTab(tab);
-  // setShowTab(false);
-  // setTimeout(function ()
-  // {
-  //     setActiveTab(tab);
-  //     setShowTab(true);
-  // }, 150);
-  // }, [setActiveTab])
-  return jsxs(Modal, Object.assign({
-    size: size,
-    show: show,
-    onClose: onClose,
-    scheme: "light",
-    transition: true
-  }, props, {
-    children: [jsxs(Modal.Header, {
-      children: [!isInitialLoading && queryId && `Edit ${title ? title(data) : (_d = (_c = (_b = data === null || data === void 0 ? void 0 : data["name"]) !== null && _b !== void 0 ? _b : data === null || data === void 0 ? void 0 : data["title"]) !== null && _c !== void 0 ? _c : data === null || data === void 0 ? void 0 : data["name"]) !== null && _d !== void 0 ? _d : ""}`, !queryId && `Create new ${itemLabel !== null && itemLabel !== void 0 ? itemLabel : "item"}`, Array.isArray(form) && jsx(Fragment, {})
-      // <ul className="nav nav-bold nav-pills">
-      //     {form.map(item =>
-      //         <li key={item.key} className="nav-item cursor-pointer bg-hover-light rounded" onClick={() => switchTab(item.key)}>
-      //             <span className={clsx("nav-link", activeTab === item.key && "active")} data-toggle="tab">{item.label}</span>
-      //         </li>
-      //     )}
-      // </ul>
-      ]
-    }), isInitialLoading && jsx(Modal.Body, {
-      children: jsx(QueryLoadingState, {
-        minW: "72"
-      })
-    }), isError && jsx(Modal.Body, {
-      children: jsx(RetryOnError, {
-        label: `${fetchErrorMsg} ${error}`,
-        onClick: retry
-      })
-    }), !isInitialLoading && !isError && jsx(Fragment, {
-      children: jsx(Formik
-      // initialValues={fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(data) ?? initialValues(data) ?? {}}
-      , Object.assign({
-        // initialValues={fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(data) ?? initialValues(data) ?? {}}
-        initialValues: fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : (_e = nonNullValues(initialValues(data))) !== null && _e !== void 0 ? _e : {},
-        onSubmit: saveItem
-      }, formikProps, {
-        children: ({
-          setFieldValue,
-          dirty,
-          handleSubmit,
-          isValid,
-          values
-        }) => jsxs(Fragment, {
-          children: [jsx(Modal.Body, {
-            pb: "6",
-            children: jsxs(Form, {
-              children: [/*#__PURE__*/React.isValidElement(form) && form, Array.isArray(form) && jsx(FormRenderer, {
-                form: form
-              }), isFunction(form) && jsx(FormRenderer, {
-                form: form(data !== null && data !== void 0 ? data : values)
-              })]
-            })
-          }), jsxs(Modal.Footer, {
-            dflex: true,
-            placeContent: "end",
-            spaceX: "3",
-            children: [jsx(Button, {
-              disabled: mutation.isLoading,
-              onClick: onClose,
-              variant: "borderless",
-              me: "2",
-              children: cancelLabel
-            }), jsx(Button, {
-              type: "submit",
-              disabled: !dirty || mutation.isLoading /* || !isValid*/,
-              onClick: () => handleSubmit(),
-              children: saveLabel ? saveLabel : queryId ? "Update" : "Create"
-            })]
-          })]
-        })
-      }))
-    }), mutation.isLoading && 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, undefined, {
-    retryOnMount: false,
-    refetchOnMount: false,
-    refetchOnWindowFocus: false
-  });
-  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}`);
-      // @ts-ignore
-      return transformFn === null || transformFn === void 0 ? void 0 : transformFn(data);
-    }
-    return data;
-  }, [data, fn, transformFn]);
-  if (isFetching) return null;
-  // @ts-ignore
-  return jsx(ItemEditDialog, Object.assign({}, config(transformedData), {
-    queryId: queryId,
-    invalidateQueryKey: invalidateQueryKey,
-    show: true,
-    onClose: 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 : undefined,
-      staleTime: q.cache === false ? 0 : undefined
-    }
-  })));
-  const transformedData = React.useMemo(() => {
-    return data === null || data === void 0 ? void 0 : data.map((d, index) => {
-      var _a, _b;
-      return queries[index].transformFn ? (_b = (_a = queries[index]) === null || _a === void 0 ? void 0 : _a.transformFn) === null || _b === void 0 ? void 0 : _b.call(_a, d) : d;
-    });
-  }, [data, queries]);
-  // TODO This is not really good
-  // So instead, add a isPreloading and isPreloadingError to ItemEditDialog to handle the cases
-  // if (isFetching)
-  //     return null
-  // @ts-ignore
-  return jsx(ItemEditDialog, Object.assign({
-    isPreloading: isFetching
-  }, config(...transformedData), {
-    queryId: queryId,
-    invalidateQueryKey: invalidateQueryKey,
-    show: true,
-    onClose: onClose
-  }));
-}
-
-function DialogRenderer({
-  config,
-  onClose,
-  invalidateQueryKey,
-  queryId
-}) {
-  const {
-      type
-    } = config,
-    props = __rest(config, ["type"]);
-  if (config.type === "dialog") return jsx(ItemEditDialog, Object.assign({}, props, {
-    queryId: queryId,
-    invalidateQueryKey: invalidateQueryKey,
-    show: true,
-    onClose: onClose
-  }));
-  if (config.type === "query") return jsx(QueryWrapperDialog, Object.assign({}, props, {
-    queryId: queryId,
-    invalidateQueryKey: invalidateQueryKey,
-    onClose: onClose
-  }));
-  if (config.type === "multiQuery") return jsx(MultiQueryWrapperDialog, Object.assign({}, props, {
-    queryId: queryId,
-    invalidateQueryKey: invalidateQueryKey,
-    onClose: onClose
-  }));
-  return null;
-}
-
-function RefreshButton({
-  queryKey
-}) {
-  const invalidate = useInvalidateQuery(queryKey);
-  fe('ctrl+r', () => invalidate(), {
-    preventDefault: true
-  }, [invalidate]);
-  return jsx(ButtonBarButton, {
-    scheme: "dark",
-    size: "sm",
-    aspectRatio: "square",
-    variant: "borderless",
-    onClick: invalidate,
-    children: jsx(Icon, {
-      path: mdiRefresh
-    })
-  });
-}
-
-function ItemDeleteDialog(_a) {
-  var {
-      title,
-      actionButtonLabel,
-      closeActionButtonLabel = "Cancel",
-      itemLabel,
-      queryId = "",
-      api,
-      apiFn,
-      invalidateQueriesOnSuccess = true,
-      invalidateQueryKey,
-      size = "lg",
-      md_boxSizing,
-      msg,
-      show,
-      onClose,
-      onSuccess
-    } = _a,
-    props = __rest(_a, ["title", "actionButtonLabel", "closeActionButtonLabel", "itemLabel", "queryId", "api", "apiFn", "invalidateQueriesOnSuccess", "invalidateQueryKey", "size", "md_boxSizing", "msg", "show", "onClose", "onSuccess"]);
-  const fn = apiFn ? api[apiFn] : api.delete;
-  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(fn, invalidateQueryKey !== null && invalidateQueryKey !== void 0 ? invalidateQueryKey : api.queryKey) : useApiMutation(fn, api.queryKey);
-  const mutate = useMutate(mutation, {
-    onSuccess: () => {
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-      onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess();
-    }
-  });
-  const handleDelete = React.useCallback(() => mutate(queryId), [mutate, queryId]);
-  return jsxs(Modal, Object.assign({
-    size: size,
-    show: show,
-    onClose: onClose,
-    scheme: "danger",
-    variant: "glass",
-    transition: true
-  }, props, {
-    children: [jsx(Modal.Header, {
-      children: title || `Delete ${itemLabel}`
-    }), jsxs(Modal.Body, {
-      pb: "6",
-      children: [!msg && `Do you really want to delete ${itemLabel}?`, msg && runIfFn(msg, itemLabel)]
-    }), jsxs(Modal.Footer, {
-      dflex: true,
-      placeContent: "end",
-      spaceX: "3",
-      children: [jsx(Button, {
-        disabled: mutation.isPending,
-        onClick: onClose,
-        variant: "borderless",
-        scheme: "dark",
-        me: "2",
-        children: closeActionButtonLabel
-      }), jsx(Button, {
-        scheme: "danger",
-        disabled: mutation.isPending,
-        onClick: handleDelete,
-        children: actionButtonLabel || "Delete"
-      })]
-    }), mutation.isPending && jsx(ModalLoadingOverlay, {})]
-  }));
-}
-
-const [provider, useContext] = createContext$1();
-function TableViewProvider({
-  editView,
-  deleteItem,
-  queryKey,
-  children
-}) {
-  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(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(jsx(DialogRenderer, {
-                onClose: onCloseDialog,
-                config: editConfig,
-                queryId: item.id,
-                invalidateQueryKey: queryKey
-              }));
-            }
-          }
-          break;
-        }
-      case "delete":
-        {
-          const deleteConfig = runIfFn(deleteItem, item);
-          setDialog(jsx(ItemDeleteDialog, Object.assign({
-            show: true,
-            onClose: onCloseDialog,
-            queryId: item.id,
-            invalidateQueryKey: queryKey,
-            msg: item.msg
-          }, deleteConfig, {
-            itemLabel: runIfFn(deleteConfig.itemLabel, item)
-          })));
-          // TODO
-          // const { initialValues, ...props } = editItem!!
-          // setDialog(<ItemEditDialog {...props} initialValues={runIfFn(initialValues, item)} show queryId={item?.id} onClose={onCloseDialog} />)
-          break;
-        }
-    }
-  }, [navigate, editView, deleteItem]);
-  const Provider = provider;
-  const value = {
-    dialog,
-    onAction
-  };
-  return jsx(Provider, {
-    value: value,
-    children: children
-  });
-}
-
-/**
-   * table-core
-   *
-   * Copyright (c) TanStack
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE.md file in the root directory of this source tree.
-   *
-   * @license MIT
-   */
-// type Person = {
-//   firstName: string
-//   lastName: string
-//   age: number
-//   visits: number
-//   status: string
-//   progress: number
-//   createdAt: Date
-//   nested: {
-//     foo: [
-//       {
-//         bar: 'bar'
-//       }
-//     ]
-//     bar: { subBar: boolean }[]
-//     baz: {
-//       foo: 'foo'
-//       bar: {
-//         baz: 'baz'
-//       }
-//     }
-//   }
-// }
-
-// const test: DeepKeys<Person> = 'nested.foo.0.bar'
-// const test2: DeepKeys<Person> = 'nested.bar'
-
-// const helper = createColumnHelper<Person>()
-
-// helper.accessor('nested.foo', {
-//   cell: info => info.getValue(),
-// })
-
-// helper.accessor('nested.foo.0.bar', {
-//   cell: info => info.getValue(),
-// })
-
-// helper.accessor('nested.bar', {
-//   cell: info => info.getValue(),
-// })
-
-function createColumnHelper() {
-  return {
-    accessor: (accessor, column) => {
-      return typeof accessor === 'function' ? {
-        ...column,
-        accessorFn: accessor
-      } : {
-        ...column,
-        accessorKey: accessor
-      };
-    },
-    display: column => column,
-    group: column => column
-  };
-}
-
-function TableRowPublishPostButton$1(_a) {
-  var {
-      id,
-      api,
-      status,
-      invalidateQueryKey
-    } = _a,
-    props = __rest(_a, ["id", "api", "status", "invalidateQueryKey"]);
-  const isDraft = status == "draft";
-  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey !== null && invalidateQueryKey !== void 0 ? invalidateQueryKey : api.queryKey, {
-    networkMode: "always"
-  });
-  const publish = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    mutation.reset();
-    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch(error => toast.error(`Error: ${error}`));
-  }, [mutation, id]);
-  return jsx(Button, Object.assign({
-    variant: "borderless",
-    corners: "square",
-    scheme: "dark",
-    onClick: publish
-  }, props, {
-    children: jsx(Icon, {
-      path: isDraft ? mdiPublish : mdiPublishOff,
-      size: "sm"
-    })
-  }));
-}
-
-function TableRowActionsView({
-  row,
-  onAction,
-  rowActions,
-  api,
-  queryKey
-}) {
-  var _a;
-  const item = row.original;
-  return jsx("div", {
-    dflex: true,
-    w: "full",
-    alignItems: "stretch",
-    placeContent: "end",
-    h: "full",
-    children: (_a = runIfFn(rowActions, item)) === null || _a === void 0 ? void 0 : _a.map((action, index) => {
-      var _a;
-      return jsxs(React.Fragment, {
-        children: [action.type === "publish" && jsx(TableRowPublishPostButton$1, {
-          id: item.id,
-          api: (_a = action.api) !== null && _a !== void 0 ? _a : api,
-          status: item.status,
-          invalidateQueryKey: queryKey
-        }), action.type == "custom" && jsx(Fragment, {
-          children: action.component(item, queryKey, action.icon, action.label)
-        }), !["publish", "custom"].includes(action.type) && jsx(ActionButton, {
-          onClick: () => onAction(action, item),
-          scheme: schemes$1[action.type],
-          children: jsx(Icon, {
-            path: icons[action.type],
-            size: "sm"
-          })
-        })]
-      }, index);
-    })
-  });
-}
-function ActionButton(_a) {
-  var {
-      onClick
-    } = _a,
-    props = __rest(_a, ["onClick"]);
-  const handleClick = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    onClick === null || onClick === void 0 ? void 0 : onClick(event);
-  }, [onClick]);
-  return jsx(TableRowActionButton$1, Object.assign({
-    onClick: handleClick
-  }, props));
-}
-const icons = {
-  "link": mdiOpenInNew,
-  "view": mdiEye,
-  "edit": mdiPencil,
-  "delete": mdiDelete,
-  "publish": mdiDelete,
-  "custom": ""
-};
-const schemes$1 = {
-  "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
-  } = useContext();
-  const {
-      onRowClick,
-      columns: c
-    } = table,
-    props = __rest(table, ["onRowClick", "columns"]);
-  const onRowClickHandler = React.useCallback(item => {
-    var _a;
-    const config = runIfFn(onRowClick, item);
-    if (config) {
-      switch (config.type) {
-        case "navigate":
-          {
-            navigate((_a = runIfFn(config.path, item)) !== null && _a !== void 0 ? _a : "");
-            break;
-          }
-        case "nextpush":
-          {
-            nextRouter.push(runIfFn(config.path, item));
-            break;
-          }
-        case "link":
-          {
-            openLink(`${AppEnv.websiteUrl()}/${runIfFn(config.path, item)}`);
-            break;
-          }
-      }
-    }
-  }, [navigate, onRowClick]);
-  const columns = React.useMemo(() => {
-    const columns = table.columns.concat([]);
-    if (rowActions) {
-      columns.push(createColumnHelper().display({
-        id: "actions",
-        header: "Actions",
-        cell: props => jsx(TableRowActionsView, {
-          row: props.row,
-          onAction: onAction,
-          rowActions: rowActions,
-          api: api,
-          queryKey: api.queryKey
-        })
-      }));
-    }
-    return columns;
-  }, [table, onAction, rowActions, api]);
-  const tableProps = Object.assign({}, 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 === undefined) return undefined;
-  const {
-    [queryField]: id
-  } = params;
-  return id;
-}
-function TableView(_a) {
-  var {
-      queryField,
-      title,
-      subtitle,
-      screen
-    } = _a,
-    props = __rest(_a, ["queryField", "title", "subtitle", "screen"]);
-  const id = useId(queryField);
-  const _screen = runIfFn(screen, id);
-  return jsx(PageContainer, Object.assign({
-    bgColor: "white"
-  }, props, {
-    children: jsx(TableContainer, {
-      columns: _screen.table.columns,
-      initialVisibleColumns: _screen.table.initialVisibleColumns,
-      filtersMethod: _screen.table.filtersMethod,
-      children: jsx(TT, {
-        id: id,
-        title: title,
-        subtitle: 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 !== null && id !== void 0 ? id : "");
-  return jsxs(Fragment, {
-    children: [jsx(TableTopBar, {
-      title: title,
-      breadcrumbs: breadcrumbs,
-      children: jsx(TableButtonBar, {
-        buttonBar: buttonBar,
-        createView: createView,
-        editView: editView,
-        api: tableApi,
-        queryKey: tableApi.queryKey,
-        children: filters && jsx(TableFilterButton, {})
-      })
-    }), filters && jsx(TableFilters, {
-      form: filters.form,
-      initialValues: filters.initialValues,
-      schema: filters.schema,
-      processInput: filters.processInput
-    }), massActions && jsx(TableMassActions, {
-      actions: massActions.items
-    }), jsxs(TableViewProvider, {
-      queryKey: tableApi.queryKey,
-      editView: editView,
-      deleteItem: deleteItem,
-      children: [jsx(TableWrapper, {
-        table: Object.assign(Object.assign({}, table), {
-          onSelectionChange: setRowSelection
-        }),
-        rowActions: rowActions,
-        api: tableApi,
-        subtitle: subtitle,
-        queryParams: screen.queryParams
-      }), jsx(TableDialogManager, {})]
-    })]
-  });
-}
-function TableButtonBar({
-  buttonBar,
-  queryKey,
-  createView,
-  editView,
-  api,
-  children
-}) {
-  const createDialogFn = React.useCallback(data => {
-    return onClose => {
-      var _a;
-      const view = (_a = runIfFn(createView, data)) !== null && _a !== void 0 ? _a : runIfFn(editView, null);
-      if (view.type == "customDialog") return view.render({
-        show: true,
-        onClose
-      });else return jsx(DialogRenderer, {
-        config: view,
-        onClose: onClose,
-        invalidateQueryKey: api.queryKey
-      });
-    };
-  }, [createView, editView, api]);
-  return jsxs(ButtonBar, {
-    children: [jsx(RefreshButton, {
-      queryKey: queryKey
-    }), buttonBar && buttonBar.map((button, index) => jsxs(React.Fragment, {
-      children: [button.type === "create" && editView && jsx(TableCreateButton, {
-        buildDialog: createDialogFn(button.data),
-        icon: button.icon,
-        children: button.label
-      }), button.type === "invalidate" && 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 = React.useMemo(() => {
-    if (!subtitle) return undefined;
-    return data => {
-      return jsx("div", {
-        textSize: "lg",
-        textColor: "#475569",
-        fontWeight: "600",
-        children: isFunction(subtitle) ? subtitle(data) : subtitle
-      });
-    };
-  }, [subtitle]);
-  return jsx(Table, Object.assign({}, tableProps, {
-    p: "8",
-    title: _subtitle
-  }));
-}
-function TableDialogManager() {
-  const {
-    dialog
-  } = useContext();
-  return dialog;
-}
-
-function useQueries(queries) {
-  const params = useParams();
-  const {
-    data,
-    isFetching,
-    isError
-  } = useApiQueries(queries.map(q => {
-    if (!q.queryField) {
-      const _api = runIfFn(q.api);
-      return {
-        queryKey: _api.queryKey,
-        queryFn: q.fn == "get" ? _api.get : _api.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) ? undefined : id
-    };
-  }));
-  let transformedData = undefined;
-  if (!isFetching && !isError) {
-    transformedData = data === null || data === void 0 ? void 0 : data.map((d, index) => {
-      var _a, _b;
-      return queries[index].transformFn ? (_b = (_a = queries[index]).transformFn) === null || _b === void 0 ? void 0 : _b.call(_a, d) : d;
-    });
-  }
-  return {
-    data: transformedData,
-    isFetching,
-    isError
-  };
-}
-function useInvalidate(queries) {
-  const queryClient = useQueryClient();
-  const params = useParams();
-  const invalidate = React.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(_a) {
-  var {
-      queries,
-      config,
-      tabbed
-    } = _a,
-    props = __rest(_a, ["queries", "config", "tabbed"]);
-  const {
-    data,
-    isFetching,
-    isError
-  } = useQueries(queries);
-  const invalidate = useInvalidate(queries);
-  if (isFetching) return jsx(QueryLoadingState, {
-    w: "full",
-    h: "100vh"
-  });
-  if (isError || !data) return jsx(RetryOnError, {
-    p: "0",
-    w: "full",
-    h: "100vh",
-    onClick: invalidate
-  });
-  return jsx(ScreenRenderer, Object.assign({
-    config: config(...data),
-    tabbed: tabbed
-  }, props));
-}
-
-function ScreenRenderer(_a) {
-  var {
-      config,
-      tabbed
-    } = _a,
-    props = __rest(_a, ["config", "tabbed"]);
-  if (config.type === "table") return jsx(TableView, Object.assign({}, config, props));
-  if (config.type === "tabbed") return jsx(TabbedView, Object.assign({}, config, props));
-  if (config.type === "details") return jsx(DetailsView, Object.assign({}, config, {
-    tabbed: tabbed
-  }, props));
-  if (config.type === "query") return jsx(QueryWrapper, Object.assign({}, config, {
-    tabbed: tabbed
-  }, props));
-  if (config.type === "multiQuery") return jsx(MultiQueryWrapper, Object.assign({}, config, {
-    tabbed: tabbed
-  }, props));
-  return jsx(Fragment, {});
-}
-
-/**
- *
- *
- */
-function Content(_a) {
-  var props = __rest(_a, []);
-  return jsx("div", Object.assign({
-    w: "100%",
-    h: "100%",
-    overflowY: "auto"
-  }, props, {
-    children: jsx(Outlet, {})
-  }));
-}
-
-function SelectedIndicator({
-  darkMode
-}) {
-  return jsx("div", {
-    position: "absolute",
-    bgColor: darkMode ? "white" : "black",
-    bgOpacity: "90",
-    w: "0.5",
-    h: "6",
-    top: "1.5",
-    start: "-4"
-  });
-}
-
-function MenuButton(_a) {
-  var {
-      depth,
-      darkMode,
-      icon,
-      selected,
-      children
-    } = _a,
-    props = __rest(_a, ["depth", "darkMode", "icon", "selected", "children"]);
-  return jsxs(Button, Object.assign({
-    as: "li",
-    minH: "8",
-    ms: `${(depth !== null && depth !== void 0 ? 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 && jsx(Icon, {
-      path: icon,
-      opacity: selected ? "100" : "60"
-    }), children]
-  }));
-}
-
-function MenuItem$1(_a) {
-  var {
-      icon,
-      path,
-      depth,
-      darkMode,
-      subMenu
-    } = _a,
-    props = __rest(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
-  const location = useLocation();
-  const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-  const match = useMatch("/" + path) != null;
-  // const selected = match != null
-  return jsxs(Fragment, {
-    children: [jsxs(Link$1, {
-      to: path,
-      style: {
-        position: "relative"
-      },
-      children: [jsx(MenuButton, Object.assign({
-        depth: depth,
-        darkMode: darkMode,
-        icon: icon,
-        selected: selected
-      }, props)), match && jsx(SelectedIndicator, {
-        darkMode: darkMode
-      })]
-    }), subMenu === null || subMenu === void 0 ? void 0 : subMenu.map((item, index) => jsx(MenuItem$1, {
-      icon: item.icon,
-      path: item.path,
-      depth: (depth !== null && depth !== void 0 ? depth : 0) + 1,
-      darkMode: darkMode,
-      subMenu: item.children,
-      children: item.label
-    }, index))]
-  });
-}
-
-function NextMenuItem(_a) {
-  var {
-      icon,
-      path,
-      depth,
-      darkMode,
-      subMenu
-    } = _a,
-    props = __rest(_a, ["icon", "path", "depth", "darkMode", "subMenu"]);
-  const {
-    pathname
-  } = useRouter();
-  const selected = path == "/" ? pathname == "/" : pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-  const match = path == "/" ? pathname == "/" : pathname == (path.startsWith("/") ? path : `/${path}`);
-  return jsxs(Fragment, {
-    children: [jsxs(Link, {
-      href: path,
-      style: {
-        position: "relative"
-      },
-      children: [jsx(MenuButton, Object.assign({
-        depth: depth,
-        darkMode: darkMode,
-        icon: icon,
-        selected: selected
-      }, props)), match && jsx(SelectedIndicator, {
-        darkMode: darkMode
-      })]
-    }), subMenu === null || subMenu === void 0 ? void 0 : subMenu.map((item, index) => jsx(NextMenuItem, {
-      icon: item.icon,
-      path: item.path,
-      depth: (depth !== null && depth !== void 0 ? depth : 0) + 1,
-      darkMode: darkMode,
-      subMenu: item.children,
-      children: item.label
-    }, index))]
-  });
-}
-
-/**
- *
- *
- */
-function Menu(_a) {
-  var {
-      darkMode,
-      config,
-      useNextRouter
-    } = _a,
-    props = __rest(_a, ["darkMode", "config", "useNextRouter"]);
-  const Comp = useNextRouter ? NextMenuItem : MenuItem$1;
-  return jsx("ul", Object.assign({}, props, {
-    children: config.map((item, index) => {
-      if (item.type == "divider") return jsx(Divider, {
-        title: item.label
-      }, index);
-      if (item.type == "item") {
-        return jsx(Comp, {
-          icon: item.icon,
-          path: item.path,
-          depth: 0,
-          darkMode: darkMode,
-          subMenu: item.children,
-          children: item.label
-        }, index);
-      }
-    })
-  }));
-}
-function Divider({
-  title
-}) {
-  return 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
-}) {
-  var _a, _b;
-  const {
-    isLoading,
-    user
-  } = useSessionUser();
-  const navigate = useNavigate();
-  const handleClick = React.useCallback(() => navigate(path), [navigate, path]);
-  if (isLoading) return null;
-  return 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: [jsx(Avatar, {
-      size: "sm",
-      src: (_b = (_a = user === null || user === void 0 ? void 0 : user.media) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : "",
-      name: `${user === null || user === void 0 ? void 0 : user.firstname} ${user === null || user === void 0 ? void 0 : user.lastname}`
-    }), jsx("span", {
-      flexGrow: true,
-      ms: "2",
-      children: `${capitalize((user === null || user === void 0 ? void 0 : user.firstname) || (user === null || user === void 0 ? void 0 : user.lastname) || "")}`
-    }), 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
-    }), jsx(OverflowMenu, {
-      color: color,
-      darkMode: darkMode,
-      menuConfig: menuConfig
-    })]
-  });
-}
-function OverflowMenu({
-  color,
-  darkMode,
-  menuConfig
-}) {
-  const [showPopup, setShowPopup] = React.useState(false);
-  const navigate = useNavigate();
-  const logout = useSessionLogout(false);
-  return jsx(Fragment, {
-    children: jsxs(Popup, {
-      show: showPopup,
-      position: "relative",
-      side: "bottom-end",
-      onClick: e => {
-        e.preventDefault();
-        e.stopPropagation();
-        setShowPopup(show => !show);
-      },
-      onHide: () => setShowPopup(false),
-      children: [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"}`
-      }), 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 jsx(MenuItem, {
-              icon: item.icon,
-              onClick: () => navigate(item.path),
-              children: item.label
-            }, index);
-          }
-          return null;
-        }), jsx(MenuItem, {
-          icon: mdiLogout,
-          onClick: logout,
-          children: "Logout"
-        })]
-      })]
-    })
-  });
-}
-function MenuItem(_a) {
-  var {
-      icon,
-      onClick,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "onClick", "children"]);
-  const handleClick = React.useCallback(e => {
-    e.preventDefault();
-    e.stopPropagation();
-    onClick === null || onClick === void 0 ? void 0 : onClick(e);
-  }, []);
-  return jsxs(Button, Object.assign({
-    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 && jsx(Icon, {
-      path: icon,
-      size: "md"
-    }), children]
-  }));
-}
-
-function Sidebar(_a) {
-  var {
-      show,
-      logo,
-      title,
-      menuConfig,
-      userMenuConfig,
-      userSettingsPath,
-      color,
-      darkMode
-    } = _a,
-    props = __rest(_a, ["show", "logo", "title", "menuConfig", "userMenuConfig", "userSettingsPath", "color", "darkMode"]);
-  return jsxs("div", Object.assign({
-    dflex: true,
-    flexCol: true,
-    w: "full",
-    md_w: "64",
-    minH: "screen",
-    p: "0",
-    textColor: darkMode ? "white" : "slate-800"
-  }, props, {
-    children: [jsxs(FlexCenter, {
-      placeContent: "start",
-      p: "4",
-      font: "title",
-      gap: "3",
-      borderB: "px",
-      borderBColor: "slate-900",
-      borderOpacity: "5",
-      children: [logo !== null && logo !== void 0 ? logo : jsx(Logo, {
-        width: 40,
-        height: 40,
-        darkMode: darkMode
-      }), jsx("h1", {
-        textSize: "md",
-        children: title || AppEnv.appName()
-      })]
-    }), jsx(Menu, {
-      overflowY: "auto",
-      flexGrow: "1",
-      p: "4",
-      darkMode: darkMode,
-      config: menuConfig
-    }), jsx("div", {
-      p: "2",
-      children: jsx(UserBlock, {
-        darkMode: darkMode,
-        color: color,
-        menuConfig: userMenuConfig,
-        path: userSettingsPath
-      })
-    })]
-  }));
-}
-function Logo(_a) {
-  var {
-      width,
-      height,
-      darkMode
-    } = _a,
-    props = __rest(_a, ["width", "height", "darkMode"]);
-  return jsx("div", Object.assign({}, props, {
-    children: jsx(Image, {
-      src: `/logo_${darkMode ? "light" : "dark"}.png`,
-      alt: AppEnv.appName(),
-      width: width,
-      height: height,
-      priority: true,
-      unoptimized: true
-    })
-  }));
-}
-
-function AdminLayout(_a) {
-  var {
-      color,
-      darkMode,
-      logo,
-      title,
-      menuConfig,
-      userMenuConfig,
-      userSettingsPath
-    } = _a,
-    props = __rest(_a, ["color", "darkMode", "logo", "title", "menuConfig", "userMenuConfig", "userSettingsPath"]);
-  return jsxs("div", Object.assign({
-    w: "full",
-    h: "screen",
-    dflex: true,
-    flexRow: true,
-    bgColor: `${color}-${darkMode ? "900" : "100"}`
-  }, props, {
-    children: [jsx(LeftPanel, {
-      color: color,
-      darkMode: darkMode,
-      logo: logo,
-      title: title,
-      menuConfig: menuConfig,
-      userMenuConfig: userMenuConfig,
-      userSettingsPath: userSettingsPath
-    }), jsx("div", {
-      w: "screen",
-      py: "2",
-      pe: "2",
-      children: jsx(Content, {
-        bgColor: "white",
-        rounded: "lg",
-        shadow: true
-      })
-    })]
-  }));
-}
-function LeftPanel({
-  color,
-  darkMode,
-  logo,
-  title,
-  menuConfig,
-  userMenuConfig,
-  userSettingsPath
-}) {
-  const [isOpen, __, toggle] = useBoolean(true);
-  fe('ctrl+t', () => toggle(), [toggle]);
-  return jsxs("div", {
-    ms: isOpen ? "0" : "-14.5rem",
-    transition: "all",
-    duration: "500",
-    transform: true,
-    children: [jsx(Sidebar, {
-      flexShrink: "0",
-      color: color,
-      darkMode: darkMode,
-      logo: logo,
-      title: title,
-      menuConfig: menuConfig,
-      userMenuConfig: userMenuConfig,
-      userSettingsPath: userSettingsPath
-    }), 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"
-    })]
-  });
-}
-
-const defaultErrorMsg = "Oops, something went wrong...";
-function AttachDialog(_a) {
-  var {
-      queryId,
-      queryKey,
-      queryFetchFn,
-      queryFetchAllKey,
-      queryFetchAllFn,
-      querySaveFn,
-      matchKey,
-      size = "lg",
-      show,
-      onClose,
-      itemLabel,
-      onSuccess,
-      onFetchError,
-      fetchErrorMsg = defaultErrorMsg,
-      onSaveError,
-      saveErrorMsg = defaultErrorMsg,
-      invalidateQueriesOnSuccess = true,
-      retryText = "Retry",
-      cancelLabel = "Cancel",
-      saveLabel,
-      formikProps,
-      getItemName
-    } = _a,
-    props = __rest(_a, ["queryId", "queryKey", "queryFetchFn", "queryFetchAllKey", "queryFetchAllFn", "querySaveFn", "matchKey", "size", "show", "onClose", "itemLabel", "onSuccess", "onFetchError", "fetchErrorMsg", "onSaveError", "saveErrorMsg", "invalidateQueriesOnSuccess", "retryText", "cancelLabel", "saveLabel", "formikProps", "getItemName"]);
-  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 = useApiMutation(querySaveFn, queryKey, queryId);
-  const handleClick = React.useCallback(event => {
-    var _a;
-    const id = (_a = event === null || event === void 0 ? void 0 : event.currentTarget.dataset.id) !== null && _a !== void 0 ? _a : "";
-    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 = React.useCallback(() => {
-    if (fetchError) refetch();
-    if (fetchAllError) refetchAll();
-  }, [refetch, refetchAll, fetchError, fetchAllError]);
-  const saveItem = React.useCallback(() => {
-    // Clear mutation error if any
-    mutation.reset();
-    mutation.mutateAsync({
-      resources: selectedResources
-    }).then(response => {
-      if (onSuccess) onSuccess(response);else toast.success(`${itemLabel} saved`);
-      if (invalidateQueriesOnSuccess) queryClient.invalidateQueries({
-        queryKey: queryKey
-      });
-      // closing delete modal
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-    }).catch(error => {
-      console.error("on error", error);
-      if (onSaveError) onSaveError();else toast.error(`Error adding ${itemLabel}`);
-    });
-  }, [mutation, queryId, onSuccess, queryClient, onSaveError, onClose]);
-  const resources = React.useMemo(() => {
-    let r = [];
-    if (attached && data) {
-      r = [].concat(data);
-      attached.forEach(attachedItem => r.splice(r.findIndex(item => item.id == attachedItem[matchKey]), 1));
-      // TODO set keyField for name (could be title for example)
-      if (getItemName) r = r.map(item => {
-        return Object.assign(Object.assign({}, item), {
-          name: getItemName(item)
-        });
-      });
-      r = sortBy(r, ["name"]);
-    }
-    return r;
-  }, [attached, data]);
-  return jsxs(Modal, Object.assign({
-    size: size,
-    show: show,
-    onClose: onClose,
-    scheme: "light",
-    transition: true
-  }, props, {
-    children: [jsx(Modal.Header, {
-      children: `Add ${itemLabel}`
-    }), isLoading && jsx(Modal.Body, {
-      children: jsx(QueryLoadingState, {
-        minW: "72"
-      })
-    }), isError && jsx(Modal.Body, {
-      children: jsx(RetryOnError, {
-        label: `${fetchErrorMsg} ${error}`,
-        onClick: retry
-      })
-    }), !isLoading && !isError && jsxs(Fragment, {
-      children: [jsx(Modal.Body, {
-        px: "0",
-        pb: "6",
-        maxH: "750px",
-        overflow: "auto",
-        children: jsx("div", {
-          dflex: true,
-          flexCol: true,
-          overflow: "auto",
-          children: resources.map(item => jsx(ListItem, {
-            label: item.name,
-            value: item.id,
-            "data-id": item.id,
-            checked: selectedResources.includes(`${item.id}`),
-            onClick: handleClick
-          }, item.id))
-        })
-      }), jsxs(Modal.Footer, {
-        dflex: true,
-        placeContent: "end",
-        spaceX: "3",
-        children: [jsx(Button, {
-          disabled: mutation.isLoading,
-          onClick: onClose,
-          variant: "borderless",
-          me: "2",
-          children: cancelLabel
-        }), jsx(Button, {
-          type: "submit",
-          disabled: selectedResources.length == 0 || mutation.isLoading /* || !isValid*/,
-          onClick: saveItem,
-          children: saveLabel ? saveLabel : queryId ? "Update" : "Create"
-        })]
-      })]
-    }), mutation.isLoading && jsx(ModalLoadingOverlay, {})]
-  }));
-}
-function ListItem(_a) {
-  var {
-      label,
-      value,
-      checked
-    } = _a,
-    props = __rest(_a, ["label", "value", "checked"]);
-  return jsxs("div", Object.assign({
-    dflex: true,
-    alignItems: "center",
-    hover_bgColor: "slate-100",
-    px: "5",
-    py: "2",
-    cursor: "pointer"
-  }, props, {
-    children: [jsx("span", {
-      flexGrow: true,
-      children: label
-    }), jsx(Checkbox, {
-      name: `resources.${value}`,
-      value: value,
-      checked: checked
-    })]
-  }));
-}
-
-function FormActionDialog(_a) {
-  var {
-      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
-    } = _a,
-    props = __rest(_a, ["initialValues", "itemLabel", "queryId", "queryKey", "queryFn", "queryOptions", "onSuccess", "successMsg", "showSuccessMsg", "onError", "errorMsg", "showErrorMsg", "processInput", "invalidateQueriesOnSuccess", "cancelLabel", "saveLabel", "size", "title", "form", "show", "onClose", "formikProps"]);
-  const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(queryFn, queryKey, queryOptions) : useApiMutation(queryFn, queryKey, queryId, queryOptions);
-  const mutate = useMutate(mutation, {
-    onSuccess,
-    successMsg,
-    showSuccessMsg,
-    onError,
-    errorMsg,
-    showErrorMsg,
-    processInput
-  });
-  return jsxs(Modal, Object.assign({
-    size: size,
-    show: show,
-    onClose: onClose,
-    scheme: "light",
-    transition: true
-  }, props, {
-    children: [jsx(Modal.Header, {
-      children: title
-    }), jsxs(FormProvider, Object.assign({
-      initialValues: initialValues !== null && initialValues !== void 0 ? initialValues : {},
-      onSubmit: mutate
-    }, formikProps, {
-      children: [jsxs(Modal.Body, {
-        pb: "6",
-        children: [/*#__PURE__*/React.isValidElement(form) && form, Array.isArray(form) && jsx(FormRenderer, {
-          form: form
-        })]
-      }), jsxs(Modal.Footer, {
-        dflex: true,
-        placeContent: "end",
-        spaceX: "3",
-        children: [jsx(Button, {
-          disabled: mutation.isLoading,
-          onClick: onClose,
-          variant: "borderless",
-          me: "2",
-          children: cancelLabel
-        }), jsx(SubmitButton, {
-          disabled: mutation.isLoading,
-          children: saveLabel
-        })]
-      })]
-    })), mutation.isLoading && jsx(ModalLoadingOverlay, {})]
-  }));
-}
-
-function PageSectionTitle(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("div", Object.assign({
-    trait: "typo.h6",
-    mb: "5"
-  }, props, {
-    children: children
-  }));
-}
-
-const PageStateContainer = /*#__PURE__*/React.forwardRef((_a, ref) => {
-  var {
-      loading = false,
-      children
-    } = _a,
-    props = __rest(_a, ["loading", "children"]);
-  return jsxs(Fragment, {
-    children: [loading && jsx(QueryLoadingState, {
-      w: "full",
-      h: "100%"
-    }), !loading && jsx(Container, Object.assign({
-      ref: ref,
-      center: true,
-      size: "x2",
-      dflex: true,
-      flexCol: true,
-      gap: "8"
-    }, props, {
-      children: children
-    }))]
-  });
-});
-
-function PageSubSectionTitle(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx("div", Object.assign({
-    trait: "typo.h6",
-    mb: "3"
-  }, props, {
-    children: children
-  }));
-}
-
-const labels = {
-  draft: "Draft",
-  published: "Published",
-  pending: "Pending",
-  approved: "Approved",
-  partially_approved: "Partially Approved",
-  rejected: "Rejected"
-};
-const schemes = {
-  draft: "warning",
-  published: "success",
-  pending: "secondary",
-  approved: "success",
-  partially_approved: "warning",
-  rejected: "danger"
-};
-function StatusBadge(_a) {
-  var {
-      status
-    } = _a,
-    props = __rest(_a, ["status"]);
-  return jsx(Badge, Object.assign({
-    size: "sm",
-    variant: "glass",
-    whiteSpace: "nowrap",
-    rounded: "full",
-    px: "3",
-    scheme: schemes[status]
-  }, props, {
-    children: labels[status]
-  }));
-}
-
-function TableRowActionButton(_a) {
-  var {
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "children"]);
-  return jsxs(Button, Object.assign({
-    dflex: true,
-    alignContent: "center",
-    placeContent: "center",
-    py: "2.5",
-    px: "3",
-    h: "full",
-    size: "lg",
-    variant: "borderless",
-    corners: "square",
-    gap: "2"
-  }, props, {
-    children: [icon && jsx(Icon, {
-      path: icon,
-      size: "sm"
-    }), children]
-  }));
-}
-
-function TableRowViewButton(_a) {
-  var {
-      path
-    } = _a,
-    props = __rest(_a, ["path"]);
-  const openPage = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    window.open(`${AppEnv.websiteUrl()}/${path}`, '_blank');
-  }, [path]);
-  return jsx(TableRowActionButton, Object.assign({
-    icon: mdiOpenInNew,
-    onClick: openPage
-  }, props));
-}
-
-function TableRowNavigateButton(_a) {
-  var {
-      path
-    } = _a,
-    props = __rest(_a, ["path"]);
-  const navigate = useNavigate();
-  const handleClick = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    navigate(`${path}`);
-  }, [navigate, path]);
-  return jsx(TableRowActionButton, Object.assign({
-    icon: mdiEye,
-    onClick: handleClick
-  }, props));
-}
-
-function TableRowActionDialogButton(_a) {
-  var {
-      icon,
-      children
-    } = _a,
-    props = __rest(_a, ["icon", "children"]);
-  return jsxs(DialogButton$1, Object.assign({
-    dflex: true,
-    alignContent: "center",
-    placeContent: "center",
-    py: "2.5",
-    px: "3",
-    h: "full",
-    size: "lg",
-    variant: "borderless",
-    corners: "square",
-    gap: "2"
-  }, props, {
-    children: [icon && jsx(Icon, {
-      path: icon,
-      size: "sm"
-    }), children]
-  }));
-}
-
-function TableRowEditButton(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx(TableRowActionDialogButton, Object.assign({
-    icon: mdiPencil
-  }, props, {
-    children: children
-  }));
-}
-
-function TableRowDeleteButton(_a) {
-  var {
-      children
-    } = _a,
-    props = __rest(_a, ["children"]);
-  return jsx(TableRowActionDialogButton, Object.assign({
-    icon: mdiDelete
-  }, props, {
-    children: children
-  }));
-}
-
-function TableRowActionBar(_a) {
-  var {
-      publishId,
-      viewPath,
-      navigatePath,
-      editDialog,
-      deleteDialog,
-      children
-    } = _a,
-    props = __rest(_a, ["publishId", "viewPath", "navigatePath", "editDialog", "deleteDialog", "children"]);
-  return jsxs("div", Object.assign({
-    dflex: true,
-    spaceX: "1",
-    placeContent: "end"
-  }, props, {
-    children: [viewPath && jsx(TableRowViewButton, {
-      path: viewPath
-    }), navigatePath && jsx(TableRowNavigateButton, {
-      path: navigatePath
-    }), editDialog && jsx(TableRowEditButton, {
-      buildDialog: editDialog
-    }), deleteDialog && jsx(TableRowDeleteButton, {
-      buildDialog: deleteDialog
-    }), children]
-  }));
-}
-
-function TableRowPublishPostButton(_a) {
-  var {
-      id,
-      api,
-      status,
-      invalidateQueryKey
-    } = _a,
-    props = __rest(_a, ["id", "api", "status", "invalidateQueryKey"]);
-  const isDraft = status == "draft";
-  const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey !== null && invalidateQueryKey !== void 0 ? invalidateQueryKey : api.queryKey, {
-    networkMode: "always"
-  });
-  const publish = React.useCallback(event => {
-    event === null || event === void 0 ? void 0 : event.preventDefault();
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    mutation.reset();
-    mutation.mutateAsync(id).then(() => toast.success(isDraft ? "Published!" : "Unpublished!")).catch(error => toast.error(`Error: ${error}`));
-  }, [mutation, id]);
-  return jsx(TableRowActionButton, Object.assign({
-    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 };