@compill/admin 1.0.102 → 1.0.104

package/dist/lib/json/table/TableRowActionsView.jsx

@@ -1,45 +0,0 @@
-import { mdiDelete, mdiEye, mdiOpenInNew, mdiPencil } from "@mdi/js";
-import { Icon } from "@valerya/ui";
-import { TableRowPublishPostButton } from "./TableRowPublishPostButton";
-import React from "react";
-import { TableRowActionButton } from "@compill/admin";
-import { runIfFn } from "@soperio/react";
-export function TableRowActionsView({ row, onAction, rowActions, api, queryKey }) {
-    const item = row.original;
-    return (<div dflex w="full" alignItems="stretch" placeContent="end" h="full">
-            {runIfFn(rowActions, item)?.map((action, index) => (<React.Fragment key={index}>
-                            {action.type === "publish" && <TableRowPublishPostButton id={item.id} api={action.api ?? api} status={item.status} invalidateQueryKey={queryKey}/>}
-
-                            {action.type == "custom" && <>{action.component(item, queryKey, action.icon, action.label)}</>}
-
-                            {!["publish", "custom"].includes(action.type) &&
-                (<ActionButton onClick={() => onAction(action, item)} scheme={schemes[action.type]}>
-                                        <Icon path={icons[action.type]} size="sm"/>
-                                    </ActionButton>)}
-                        </React.Fragment>))}
-        </div>);
-}
-function ActionButton({ onClick, ...props }) {
-    const handleClick = React.useCallback((event) => {
-        event?.preventDefault();
-        event?.stopPropagation();
-        onClick?.(event);
-    }, [onClick]);
-    return (<TableRowActionButton onClick={handleClick} {...props}/>);
-}
-const icons = {
-    "link": mdiOpenInNew,
-    "view": mdiEye,
-    "edit": mdiPencil,
-    "delete": mdiDelete,
-    "publish": mdiDelete,
-    "custom": ""
-};
-const schemes = {
-    "link": "dark",
-    "view": "dark",
-    "edit": "dark",
-    "delete": "dark",
-    "publish": "dark",
-    "custom": "dark"
-};

package/dist/lib/json/table/TableView.jsx

@@ -1,100 +0,0 @@
-import { Table, useTableContext } from "@compill/table";
-import { isFunction, runIfFn } from "@soperio/react";
-import React from "react";
-import { useParams } from "react-router-dom";
-import { InvalidateButton } from "../../buttons/InvalidateButton";
-import { PageContainer } from "../../page/PageContainer";
-import { TableContainer } from "../../table/TableContainer";
-import { TableCreateButton } from "../../table/TableCreateButton";
-import { TableFilterButton } from "../../table/TableFilterButton";
-import { TableTopBar } from "../../table/TableTopBar";
-import { ButtonBar } from "../../layout/ButtonBar";
-import { TableFilters } from "../../table/TableFilters";
-import { TableMassActions } from "../../table/TableMassActions";
-import { DialogRenderer } from "../dialog/DialogRenderer";
-import { RefreshButton } from "./RefreshButton";
-import { TableViewProvider, useTableViewContext } from "./TableViewContext";
-import { useTableProps } from "./useTableProps";
-function useId(queryField) {
-    const params = useParams();
-    if (queryField === undefined)
-        return undefined;
-    const { [queryField]: id } = params;
-    return id;
-}
-export function TableView({ queryField, title, subtitle, screen, ...props }) {
-    const id = useId(queryField);
-    const _screen = runIfFn(screen, id);
-    return (<PageContainer bgColor="white" {...props}>
-            <TableContainer columns={_screen.table.columns} initialVisibleColumns={_screen.table.initialVisibleColumns} filtersMethod={_screen.table.filtersMethod}>
-                <TT id={id} title={title} subtitle={subtitle} screen={_screen}/>
-            </TableContainer>
-        </PageContainer>);
-}
-function TT({ id, title, subtitle, screen }) {
-    const { setRowSelection } = useTableContext();
-    const { api, table, filters, massActions, buttonBar, rowActions, createView, editView, deleteItem, breadcrumbs } = screen;
-    const tableApi = runIfFn(api, id ?? "");
-    return (<>
-            {/* {breadcrumbs && <PageTopBar breadcrumbs={breadcrumbs} />} */}
-            <TableTopBar title={title} breadcrumbs={breadcrumbs}>
-                <TableButtonBar buttonBar={buttonBar} createView={createView} editView={editView} api={tableApi} queryKey={tableApi.queryKey}>
-                    {filters && <TableFilterButton />}
-                </TableButtonBar>
-                {/* <TableColumnButton /> */}
-            </TableTopBar>
-
-            {filters &&
-            (<TableFilters form={filters.form} initialValues={filters.initialValues} schema={filters.schema} processInput={filters.processInput}/>)}
-            {massActions && <TableMassActions actions={massActions.items}/>}
-
-            <TableViewProvider queryKey={tableApi.queryKey} editView={editView} deleteItem={deleteItem}>
-                <TableWrapper table={{ ...table, onSelectionChange: setRowSelection }} rowActions={rowActions} api={tableApi} subtitle={subtitle} queryParams={screen.queryParams}/>
-                <TableDialogManager />
-            </TableViewProvider>
-        </>);
-}
-function TableButtonBar({ buttonBar, queryKey, createView, editView, api, children }) {
-    const createDialogFn = React.useCallback((data) => {
-        return (onClose) => {
-            const view = runIfFn(createView, data) ?? runIfFn(editView, null);
-            if (view.type == "customDialog")
-                return view.render({ show: true, onClose });
-            else
-                return <DialogRenderer config={view} onClose={onClose} invalidateQueryKey={api.queryKey}/>;
-        };
-    }, [createView, editView, api]);
-    return (<ButtonBar>
-            <RefreshButton queryKey={queryKey}/>
-
-            {buttonBar && buttonBar.map((button, index) => <React.Fragment key={index}>
-                        {button.type === "create" && editView &&
-                (<TableCreateButton buildDialog={createDialogFn(button.data)} icon={button.icon}>
-                                    {button.label}
-                                </TableCreateButton>)}
-
-                        {button.type === "invalidate" && <InvalidateButton pathOrPermalink={button.pathOrPermalink}/>}
-
-                        {button.type === "custom" && button.render()}
-                    </React.Fragment>)}
-
-            {children}
-        </ButtonBar>);
-}
-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 (<div textSize="lg" textColor="#475569" fontWeight="600">
-                    {isFunction(subtitle) ? subtitle(data) : subtitle}
-                </div>);
-        };
-    }, [subtitle]);
-    return <Table {...tableProps} p="8" title={_subtitle}/>;
-}
-function TableDialogManager() {
-    const { dialog } = useTableViewContext();
-    return dialog;
-}

package/dist/lib/layout/AdminLayout.jsx

@@ -1,24 +0,0 @@
-import { useBoolean } from "@compill/hooks";
-import { mdiArrowLeft } from "@mdi/js";
-import { IconButton } from "@valerya/ui";
-import { useHotkeys } from "react-hotkeys-hook";
-import Content from "./Content";
-import { Sidebar } from "./Sidebar";
-export function AdminLayout({ color, darkMode, logo, title, menuConfig, userMenuConfig, userSettingsPath, ...props }) {
-    return (<div w="full" h="screen" dflex flexRow bgColor={`${color}-${darkMode ? "900" : "100"}`} {...props}>
-            <LeftPanel color={color} darkMode={darkMode} logo={logo} title={title} menuConfig={menuConfig} userMenuConfig={userMenuConfig} userSettingsPath={userSettingsPath}/>
-
-            <div w="screen" py="2" pe="2">
-                <Content bgColor="white" rounded="lg" shadow/>
-            </div>
-        </div>);
-}
-function LeftPanel({ color, darkMode, logo, title, menuConfig, userMenuConfig, userSettingsPath }) {
-    const [isOpen, __, toggle] = useBoolean(true);
-    useHotkeys('ctrl+t', () => toggle(), [toggle]);
-    return (<div ms={isOpen ? "0" : "-14.5rem"} transition="all" duration="500" transform>
-            <Sidebar flexShrink="0" color={color} darkMode={darkMode} logo={logo} title={title} menuConfig={menuConfig} userMenuConfig={userMenuConfig} userSettingsPath={userSettingsPath}/>
-
-            <IconButton icon={mdiArrowLeft} transition="all" duration="500" transform rotate={isOpen ? "0" : "180"} position="absolute" bottom="14" end="-5" size="lg" corners="pill" onClick={toggle} z="100"/>
-        </div>);
-}

package/dist/lib/layout/ButtonBar.jsx

@@ -1,29 +0,0 @@
-import { DialogButton } from "../buttons/DialogButton";
-import { Button, Icon } from "@valerya/ui";
-import { useFormikContext } from "formik";
-import React from "react";
-export function ButtonBar({ children, ...props }) {
-    return (<div dflex border="1px" borderColor="zinc-200" divideX="1px" divideColor="zinc-200" rounded="lg" overflow="hidden" {...props}>
-            {children}
-        </div>);
-}
-export const ButtonBarButton = React.forwardRef(function ({ icon, children, ...props }, ref) {
-    return (<Button scheme="dark" size="sm" aspectRatio={icon && !children ? "square" : undefined} variant="borderless" dflex alignItems="center" placeContent="center" corners="square" gap="2" {...props} ref={ref}>
-                {icon && <Icon path={icon}/>}
-                {children}
-            </Button>);
-});
-export const ButtonBarSubmitButton = React.forwardRef(function ({ useDirty, disabled, icon, children, ...props }, ref) {
-    const { dirty, handleSubmit } = useFormikContext() ?? { dirty: false, handleSubmit: undefined, values: {} };
-    const onSubmit = React.useCallback(() => handleSubmit(), [handleSubmit]);
-    return (<Button scheme="dark" size="sm" aspectRatio={icon && !children ? "square" : undefined} variant="borderless" dflex alignItems="center" placeContent="center" corners="square" gap="2" disabled={(useDirty && !dirty) || disabled} onClick={onSubmit} {...props} ref={ref}>
-                {icon && <Icon path={icon}/>}
-                {children}
-            </Button>);
-});
-export function ButtonBarDialogButton({ icon, children, ...props }) {
-    return (<DialogButton scheme="dark" size="sm" aspectRatio={icon && !children ? "square" : undefined} variant="borderless" dflex alignItems="center" placeContent="center" corners="square" gap="2" {...props}>
-            {icon && <Icon path={icon}/>}
-            {children}
-        </DialogButton>);
-}

package/dist/lib/layout/Content.jsx

@@ -1,10 +0,0 @@
-import { Outlet } from "react-router-dom";
-/**
- *
- *
- */
-export default function Content({ ...props }) {
-    return (<div w="100%" h="100%" overflowY="auto" {...props}>
-            <Outlet />
-        </div>);
-}

package/dist/lib/layout/PageTitleBar.jsx

@@ -1,12 +0,0 @@
-export function PageTitleBar({ title, children, ...props }) {
-    return (<div dflex flexRow alignItems="center" gap="3" p="8" 
-    // borderB="0.5"
-    // borderBColor="--bg-2"
-    {...props}>
-            {title && <h2 textSize="x2" fontWeight="600" textColor="#3f4254" textTransform="capitalize">{title}</h2>}
-
-            <div flexGrow>&nbsp;</div>
-
-            {children}
-        </div>);
-}

package/dist/lib/layout/Sidebar.jsx

@@ -1,24 +0,0 @@
-import { FlexCenter } from "@compill/components";
-import { Menu } from "./menu/Menu";
-import { AppEnv } from "@compill/env";
-import Image from "next/image";
-import { UserBlock } from "./menu/UserBlock";
-export function Sidebar({ show, logo, title, menuConfig, userMenuConfig, userSettingsPath, color, darkMode, ...props }) {
-    return (<div dflex flexCol w="full" md_w="64" minH="screen" p="0" textColor={darkMode ? "white" : "slate-800"} {...props}>
-            <FlexCenter placeContent="start" p="4" font="title" gap="3" borderB="px" borderBColor="slate-900" borderOpacity="5">
-                {logo ?? <Logo width={40} height={40} darkMode={darkMode}/>}
-                <h1 textSize="md">{title || AppEnv.appName()}</h1>
-            </FlexCenter>
-
-            <Menu overflowY="auto" flexGrow="1" p="4" darkMode={darkMode} config={menuConfig}/>
-
-            <div p="2">
-                <UserBlock darkMode={darkMode} color={color} menuConfig={userMenuConfig} path={userSettingsPath}/>
-            </div>
-        </div>);
-}
-export default function Logo({ width, height, darkMode, ...props }) {
-    return (<div {...props}>
-            <Image src={`/logo_${darkMode ? "light" : "dark"}.png`} alt={AppEnv.appName() || ""} width={width} height={height} priority unoptimized/>
-        </div>);
-}

package/dist/lib/layout/menu/Menu.jsx

@@ -1,30 +0,0 @@
-import { MenuItem } from "./MenuItem";
-import { NextMenuItem } from "./NextMenuItem";
-/**
- *
- *
- */
-export function Menu({ darkMode, config, useNextRouter, ...props }) {
-    const Comp = useNextRouter ? NextMenuItem : MenuItem;
-    return (<ul {...props}>
-            {config.map((item, index) => {
-            if (item.type == "divider")
-                return <Divider key={index} title={item.label}/>;
-            if (item.type == "item") {
-                return (<Comp key={index} icon={item.icon} path={item.path} depth={0} darkMode={darkMode} subMenu={item.children}>
-                                {item.label}
-                            </Comp>);
-            }
-        })}
-        </ul>);
-}
-function Divider({ title }) {
-    return (<div px="2" mt="5" mb="2" opacity="75" textTransform="capitalize" letterSpacing="widest" fontWeight="700" textSize="xs">
-            {title}
-        </div>);
-}
-function CategoryItem({ children, ...props }) {
-    return (<li ps="5" py="2" mt="5" textSize="sm" textColor="white" textOpacity="80" fontWeight="600" textTransform="uppercase">
-            {children}
-        </li>);
-}

package/dist/lib/layout/menu/MenuButton.jsx

@@ -1,7 +0,0 @@
-import { Button, Icon } from "@valerya/ui";
-export function MenuButton({ depth, darkMode, icon, selected, children, ...props }) {
-    return (<Button as="li" minH="8" ms={`${(depth ?? 0) * 2}`} p="2" font="title" textColor={darkMode ? "white" : "black"} fontWeight="600" rounded="lg" textSize="sm" variant="borderless" hover_bgColor={darkMode ? "white" : "black"} hover_bgOpacity="10" hover_textColor={darkMode ? "white" : "zinc-800"} cursor="pointer" dflex alignItems="center" gap="3" {...props}>
-            {icon && <Icon path={icon} opacity={selected ? "100" : "60"}/>}
-            {children}
-        </Button>);
-}

package/dist/lib/layout/menu/MenuItem.jsx

@@ -1,20 +0,0 @@
-import { SelectedIndicator } from "./SelectedIndicator";
-import { Link, useLocation, useMatch } from "react-router-dom";
-import { MenuButton } from "./MenuButton";
-export function MenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-    const location = useLocation();
-    const selected = path == "/" ? location.pathname == "/" : location.pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-    const match = useMatch("/" + path) != null;
-    // const selected = match != null
-    return (<>
-            <Link to={path} style={{ position: "relative" }}>
-                <MenuButton depth={depth} darkMode={darkMode} icon={icon} selected={selected} {...props}/>
-
-                {match && <SelectedIndicator darkMode={darkMode}/>}
-            </Link>
-
-            {subMenu?.map((item, index) => (<MenuItem key={index} icon={item.icon} path={item.path} depth={(depth ?? 0) + 1} darkMode={darkMode} subMenu={item.children}>
-                        {item.label}
-                    </MenuItem>))}
-        </>);
-}

package/dist/lib/layout/menu/NextMenuItem.jsx

@@ -1,20 +0,0 @@
-import { MenuButton } from "./MenuButton";
-import { SelectedIndicator } from "./SelectedIndicator";
-import Link from "next/link";
-import { useRouter } from "next/router";
-export function NextMenuItem({ icon, path, depth, darkMode, subMenu, ...props }) {
-    const { pathname } = useRouter();
-    const selected = path == "/" ? pathname == "/" : pathname.startsWith(path.startsWith("/") ? path : `/${path}`);
-    const match = path == "/" ? pathname == "/" : pathname == (path.startsWith("/") ? path : `/${path}`);
-    return (<>
-            <Link href={path} style={{ position: "relative" }}>
-                <MenuButton depth={depth} darkMode={darkMode} icon={icon} selected={selected} {...props}/>
-
-                {match && <SelectedIndicator darkMode={darkMode}/>}
-            </Link>
-
-            {subMenu?.map((item, index) => (<NextMenuItem key={index} icon={item.icon} path={item.path} depth={(depth ?? 0) + 1} darkMode={darkMode} subMenu={item.children}>
-                        {item.label}
-                    </NextMenuItem>))}
-        </>);
-}

package/dist/lib/layout/menu/SelectedIndicator.jsx

@@ -1,3 +0,0 @@
-export function SelectedIndicator({ darkMode }) {
-    return (<div position="absolute" bgColor={darkMode ? "white" : "black"} bgOpacity="90" w="0.5" h="6" top="1.5" start="-4"/>);
-}

package/dist/lib/layout/menu/UserBlock.jsx

@@ -1,55 +0,0 @@
-import { useSessionLogout, useSessionUser } from "@compill/auth";
-import { mdiCog, mdiDotsVertical, mdiLogout } from "@mdi/js";
-import { Avatar, Button, Icon, IconButton, Popup } from "@valerya/ui";
-import { capitalize } from "es-toolkit";
-import React from "react";
-import { useNavigate } from "react-router-dom";
-export function UserBlock({ color, darkMode, menuConfig, path }) {
-    const { isLoading, user } = useSessionUser();
-    const navigate = useNavigate();
-    const handleClick = React.useCallback(() => navigate(path), [navigate, path]);
-    if (isLoading)
-        return null;
-    return (<div dflex 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}>
-            <Avatar size="sm" src={user?.media?.url ?? ""} name={`${user?.firstname} ${user?.lastname}`}/>
-
-            <span flexGrow ms="2">{`${capitalize(user?.firstname || user?.lastname || "")}`}</span>
-
-            <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}/>
-
-            <OverflowMenu color={color} darkMode={darkMode} menuConfig={menuConfig}/>
-        </div>);
-}
-function OverflowMenu({ color, darkMode, menuConfig }) {
-    const [showPopup, setShowPopup] = React.useState(false);
-    const navigate = useNavigate();
-    const logout = useSessionLogout(false);
-    return (<>
-            <Popup show={showPopup} position="relative" side="bottom-end" onClick={(e) => { e.preventDefault(); e.stopPropagation(); setShowPopup((show) => !show); }} onHide={() => setShowPopup(false)}>
-                <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"}`}/>
-
-                <div bgColor="white" rounded="sm" overflow="hidden" shadow mt="1" border="px" borderColor="gray-200" divideColor="gray-200" divideY="px" minW="40">
-                    {menuConfig && menuConfig.length > 0 && menuConfig.map((item, index) => {
-            if (item.type == "item") {
-                return (<MenuItem key={index} icon={item.icon} onClick={() => navigate(item.path)}>
-                                        {item.label}
-                                    </MenuItem>);
-            }
-            return null;
-        })}
-                    <MenuItem icon={mdiLogout} onClick={logout}>Logout</MenuItem>
-                </div>
-            </Popup>
-        </>);
-}
-function MenuItem({ icon, onClick, children, ...props }) {
-    const handleClick = React.useCallback((e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        onClick?.(e);
-    }, []);
-    return (<Button variant="borderless" scheme="dark" size="sm" alignItems="center" dflex gap="2" px="2" py="1.5" w="full" onClick={handleClick} textColor="slate-700" {...props}>
-            {icon && <Icon path={icon} size="md"/>}
-            {children}
-        </Button>);
-}

package/dist/lib/modal/FormActionDialog.jsx

@@ -1,46 +0,0 @@
-import { useMutate } from "@compill/api";
-import { ModalLoadingOverlay } from "@compill/components";
-import { SubmitButton, FormRenderer, FormProvider } from "@compill/form";
-import { useApiMutation, useInvalidateParentMutation } from "@compill/api";
-import { Button, Modal } from "@valerya/ui";
-import React from "react";
-export function FormActionDialog({ initialValues, itemLabel, queryId = "", queryKey, queryFn, queryOptions, onSuccess, successMsg, showSuccessMsg, onError, errorMsg, showErrorMsg, processInput, invalidateQueriesOnSuccess = true, cancelLabel = "Cancel", saveLabel = "Send", size = "lg", title, form, show, onClose, formikProps, ...props }) {
-    const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(queryFn, queryKey, queryOptions) : useApiMutation(queryFn, queryKey, queryId, queryOptions);
-    const mutate = useMutate(mutation, {
-        onSuccess,
-        successMsg,
-        showSuccessMsg,
-        onError,
-        errorMsg,
-        showErrorMsg,
-        processInput,
-    });
-    return (<Modal size={size} show={show} onClose={onClose} scheme="light" transition 
-    // closeOnMaskClick={false}
-    {...props}>
-            <Modal.Header>
-                {title}
-            </Modal.Header>
-
-            {/* @ts-ignore */}
-            <FormProvider initialValues={initialValues ?? {}} onSubmit={mutate} {...formikProps}>
-                <Modal.Body pb="6">
-                    {React.isValidElement(form) && form}
-
-                    {Array.isArray(form) && <FormRenderer form={form}/>}
-                </Modal.Body>
-
-                <Modal.Footer dflex placeContent="end" spaceX="3">
-                    <Button disabled={mutation.isLoading} onClick={onClose} variant="borderless" me="2">
-                        {cancelLabel}
-                    </Button>
-
-                    <SubmitButton disabled={mutation.isLoading}>
-                        {saveLabel}
-                    </SubmitButton>
-                </Modal.Footer>
-            </FormProvider>
-
-            {mutation.isLoading && <ModalLoadingOverlay />}
-        </Modal>);
-}

package/dist/lib/page/PageContainer.jsx

@@ -1,4 +0,0 @@
-import { Container } from "@valerya/ui";
-export function PageContainer({ children, ...props }) {
-    return <Container center dflex flexCol gap="8" {...props}>{children}</Container>;
-}

package/dist/lib/page/PageContentEditor.jsx

@@ -1,11 +0,0 @@
-import { FormEditor } from "@compill/form-editor";
-import { PageMain } from "./PageMain";
-import { ImageExtension } from "@compill/editor";
-export function PageContentEditor({ name, ...props }) {
-    const extensions = [ImageExtension];
-    return (<PageMain h="min" {...props}>
-            <FormEditor minH="128" minW="144" maxW={props.maxW} 
-    // w={props.w}
-    name={name} placeHolder="Write here..." extensions={extensions}/>
-        </PageMain>);
-}

package/dist/lib/page/PageMain.jsx

@@ -1,4 +0,0 @@
-import { Tile } from "@valerya/ui";
-export function PageMain({ children, ...props }) {
-    return <Tile scheme="light" p="5" {...props}>{children}</Tile>;
-}

package/dist/lib/page/PageSectionTitle.jsx

@@ -1,3 +0,0 @@
-export function PageSectionTitle({ children, ...props }) {
-    return <div trait="typo.h6" mb="5" {...props}>{children}</div>;
-}

package/dist/lib/page/PageSidebar.jsx

@@ -1,3 +0,0 @@
-export function PageSidebar({ children, ...props }) {
-    return <div w="112" minW="112" minH="100%" gap="8" dflex flexCol {...props}>{children}</div>;
-}

package/dist/lib/page/PageSidebarSection.jsx

@@ -1,7 +0,0 @@
-import { PageSectionTitle } from "./PageSectionTitle";
-export function PageSidebarSection({ title, children, ...props }) {
-    return (<div w="full" {...props}>
-            {title && <PageSectionTitle>{title}</PageSectionTitle>}
-            {children}
-        </div>);
-}

package/dist/lib/page/PageStateContainer.jsx

@@ -1,9 +0,0 @@
-import { QueryLoadingState } from "@compill/components";
-import { Container } from "@valerya/ui";
-import React from "react";
-export const PageStateContainer = React.forwardRef(({ loading = false, children, ...props }, ref) => {
-    return (<>
-            {loading && <QueryLoadingState w="full" h="100%"/>}
-            {!loading && <Container ref={ref} center size="x2" dflex flexCol gap="8" {...props}>{children}</Container>}
-        </>);
-});

package/dist/lib/page/PageSubSectionTitle.jsx

@@ -1,3 +0,0 @@
-export function PageSubSectionTitle({ children, ...props }) {
-    return <div trait="typo.h6" mb="3" {...props}>{children}</div>;
-}

package/dist/lib/page/PageTitle.jsx

@@ -1,3 +0,0 @@
-export function PageTitle({ children, ...props }) {
-    return <div trait="typo.h5" {...props}>{children}</div>;
-}

package/dist/lib/table/TableContainer.jsx

@@ -1,11 +0,0 @@
-import { TableContextProvider } from "@compill/table";
-import { TableContainerContextProvider } from "./TableContainerContext";
-export function TableContainer({ initialPageSize, initialVisibleColumns, columns, filtersMethod = "reactRouter", children, ...props }) {
-    return (<div w="full" dflex flexCol {...props}>
-            <TableContextProvider initialPageSize={initialPageSize} filtersMethod={filtersMethod}>
-                <TableContainerContextProvider columns={columns} initialVisibleColumns={initialVisibleColumns}>
-                    {children}
-                </TableContainerContextProvider>
-            </TableContextProvider>
-        </div>);
-}

package/dist/lib/table/TableCreateButton.jsx

@@ -1,9 +0,0 @@
-import { mdiPlusThick } from "@mdi/js";
-import { Icon } from "@valerya/ui";
-import { ButtonBarDialogButton } from "../layout/ButtonBar";
-export function TableCreateButton({ icon, children, ...props }) {
-    return (<ButtonBarDialogButton {...props}>
-            <Icon path={icon ?? mdiPlusThick}/>
-            {children}
-        </ButtonBarDialogButton>);
-}

package/dist/lib/table/TableFilterButton.jsx

@@ -1,16 +0,0 @@
-import { Icon } from "@valerya/ui";
-import { Button, Popover } from "@valerya/ui";
-import { mdiFilter } from "@mdi/js";
-export function TableFilterButton({ ...props }) {
-    // return <Button scheme="secondary" {...props}><Icon path={mdiFilter} /></Button>
-    return (<Popover side="bottom-end" modal>
-            <Button scheme="dark" size="sm" aspectRatio="square" variant="borderless" corners="square" {...props}>
-                <Icon path={mdiFilter}/>
-            </Button>
-            <div bgColor="white" rounded shadow>
-                <div py="3" hover_bgColor="#ff0000" px="5" hover_textColor="white">First Item</div>
-                <div py="3" hover_bgColor="#ff0000" px="5" hover_textColor="white">Second Item</div>
-                <div py="3" hover_bgColor="#ff0000" px="5" hover_textColor="white">Third Item</div>
-            </div>
-        </Popover>);
-}

package/dist/lib/table/TableMassActions.jsx

@@ -1,15 +0,0 @@
-import { useTableContext } from "@compill/table";
-import { Collapse } from "@valerya/ui";
-import { ActionButton } from "../json/buttons/ActionButton";
-export function TableMassActions({ actions }) {
-    const { ids } = useTableContext();
-    const showMassActions = ids && ids.length > 0;
-    return (<Collapse in={showMassActions} style={{ overflow: showMassActions ? "initial" : "hidden" }}>
-            <div dflex gap="3" flexWrap alignItems="center" px="8" pt="5">
-                {actions.map((action, index) => (<div key={index}>
-                            {/* {action.type == "custom" && action.render(rows)} */}
-                            {action.type == "button" && !action.showConfirmationDialog && (<ActionButton label={action.label} queryFn={action.queryFn} queryKey={action.queryKey} buttonProps={action.buttonProps}/>)}
-                        </div>))}
-            </div>
-        </Collapse>);
-}

package/dist/lib/table/TableRowActionBar.jsx

@@ -1,14 +0,0 @@
-import { TableRowViewButton } from "./TableRowViewButton";
-import { TableRowNavigateButton } from "./TableRowNavigateButton";
-import { TableRowEditButton } from "./TableRowEditButton";
-import { TableRowDeleteButton } from "./TableRowDeleteButton";
-export function TableRowActionBar({ publishId, viewPath, navigatePath, editDialog, deleteDialog, children, ...props }) {
-    return (<div dflex spaceX="1" placeContent="end" {...props}>
-            {viewPath && <TableRowViewButton path={viewPath}/>}
-            {navigatePath && <TableRowNavigateButton path={navigatePath}/>}
-            {editDialog && <TableRowEditButton buildDialog={editDialog}/>}
-            {deleteDialog && <TableRowDeleteButton buildDialog={deleteDialog}/>}
-
-            {children}
-        </div>);
-}

package/dist/lib/table/TableRowActionButton.jsx

@@ -1,7 +0,0 @@
-import { Button, Icon } from "@valerya/ui";
-export function TableRowActionButton({ icon, children, ...props }) {
-    return (<Button dflex alignContent="center" placeContent="center" py="2.5" px="3" h="full" size="lg" variant="borderless" corners="square" gap="2" {...props}>
-            {icon && <Icon path={icon} size="sm"/>}
-            {children}
-        </Button>);
-}

package/dist/lib/table/TableRowActionDialogButton.jsx

@@ -1,8 +0,0 @@
-import { Icon } from "@valerya/ui";
-import { DialogButton } from "../buttons/DialogButton";
-export function TableRowActionDialogButton({ icon, children, ...props }) {
-    return (<DialogButton dflex alignContent="center" placeContent="center" py="2.5" px="3" h="full" size="lg" variant="borderless" corners="square" gap="2" {...props}>
-            {icon && <Icon path={icon} size="sm"/>}
-            {children}
-        </DialogButton>);
-}

package/dist/lib/table/TableTopBar.jsx

@@ -1,17 +0,0 @@
-import { Breadcrumbs } from "../breadcrumbs/BreadCrumbs";
-export function TableTopBar({ title, breadcrumbs, children, ...props }) {
-    return (<div dflex flexRow alignItems="center" gap="3" p="8" 
-    // borderB="0.5"
-    // borderBColor="--bg-2"
-    {...props}>
-            <div>
-
-            {title && <h2 textSize="x2" fontWeight="600" textColor="#3f4254" textTransform="capitalize">{title}</h2>}
-                {breadcrumbs && <Breadcrumbs breadcrumbs={breadcrumbs}/>}
-            </div>
-
-            <div flexGrow>&nbsp;</div>
-
-            {children}
-        </div>);
-}