mtxuilib 0.1.8 → 0.1.9

package/dist/common/{DeleteComfirm.jsx → DeleteComfirm.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createContext, useCallback, useContext, useMemo } from "react";
 import { createStore, useStore } from "zustand";
 import { immer } from "zustand/middleware/immer";
@@ -18,10 +19,7 @@ const formContext = createContext(null);
 export const DeleteConfirmProvider = (props) => {
     const { children, ...etc } = props;
     const mystore = useMemo(() => createDeleteConformStore(etc), [etc]);
-    return (<formContext.Provider value={mystore}>
-      {children}
-      <DeleteConfirmDlg />
-    </formContext.Provider>);
+    return (_jsxs(formContext.Provider, { value: mystore, children: [children, _jsx(DeleteConfirmDlg, {})] }));
 };
 function useDeleteConfirmStore(selector) {
     const store = useContext(formContext);
@@ -44,22 +42,11 @@ export const DeleteConfirmDlg = () => {
     const open = useDeleteConfirmStore((x) => x.open);
     const setOpen = useDeleteConfirmStore((x) => x.setOpen);
     const confirmCallback = useDeleteConfirmStore((x) => x.confirmCallback);
-    return (<Dialog open={open} onOpenChange={setOpen}>
-      <DialogContent>
-        <DialogTitle>delete confirm</DialogTitle>
-        <DialogDescription>will delete item, continue?</DialogDescription>
-        <MtButton variant={"destructive"} onClick={async () => {
-            setOpen(false);
-            confirmCallback && confirmCallback();
-        }}>
-          Continue
-        </MtButton>
-        <MtButton variant={"outline"} onClick={() => {
-            setOpen(false);
-            confirmCallback && confirmCallback();
-        }}>
-          Cancel
-        </MtButton>
-      </DialogContent>
-    </Dialog>);
+    return (_jsx(Dialog, { open: open, onOpenChange: setOpen, children: _jsxs(DialogContent, { children: [_jsx(DialogTitle, { children: "delete confirm" }), _jsx(DialogDescription, { children: "will delete item, continue?" }), _jsx(MtButton, { variant: "destructive", onClick: async () => {
+                        setOpen(false);
+                        confirmCallback && confirmCallback();
+                    }, children: "Continue" }), _jsx(MtButton, { variant: "outline", onClick: () => {
+                        setOpen(false);
+                        confirmCallback && confirmCallback();
+                    }, children: "Cancel" })] }) }));
 };

package/dist/common/FullCenter.js

@@ -0,0 +1,6 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const FullCenter = (props) => {
+    const { children } = props;
+    return (_jsx("div", { className: "flex h-full w-full items-center justify-center", children: _jsx("div", { className: "flex-1", children: children }) }));
+};

package/dist/common/{GlobalSearch.jsx → GlobalSearch.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useContext, useMemo } from "react";
 import { createStore, useStore } from "zustand";
 export const createFormSlice = (set, get) => ({
@@ -14,10 +15,7 @@ const formContext = createContext(null);
 export const GlobalSearchProvider = (props) => {
     const { children, ...etc } = props;
     const mystore = useMemo(() => createDeleteConformStore(etc), [etc]);
-    return (<formContext.Provider value={mystore}>
-      {children}
-      
-    </formContext.Provider>);
+    return (_jsx(formContext.Provider, { value: mystore, children: children }));
 };
 export function useGlobalSearch(selector) {
     const store = useContext(formContext);

package/dist/common/{MtImage.jsx → MtImage.js}

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { isCloudflarePage } from 'mtxlib/utils';
 import Image from 'next/image';
 const normalizeSrc = (src) => {
@@ -23,5 +24,5 @@ function getImageLoader() {
     }
 }
 export const MtImage = (props) => {
-    return <Image {...props} loader={getImageLoader()}/>;
+    return _jsx(Image, { ...props, loader: getImageLoader() });
 };

package/dist/common/MtProgressBar.js

@@ -0,0 +1,6 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AppProgressBar } from "next-nprogress-bar";
+export const MtProgressBar = () => {
+    return _jsx(AppProgressBar, { height: "4px", color: "#4934eb", options: { showSpinner: false }, shallowRouting: true });
+};

package/dist/common/NotFoundGoBack.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRouter } from "next/navigation";
+import { Button } from "../ui/button";
+export const NotFoundGoBack = () => {
+    const router = useRouter();
+    return (_jsxs("div", { className: "container flex flex-col", children: [_jsx("div", { className: "mx-auto p-8", children: "not found" }), _jsx(Button, { className: "mx-auto p-8", onClick: () => {
+                    router.back();
+                }, children: "Go back" })] }));
+};

package/dist/common/SlntTree/{SlntChildrenTabs.jsx → SlntChildrenTabs.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { urlJoinPaths } from "mtxlib/http/url";
 import { usePathname, useSelectedLayoutSegment, useSelectedLayoutSegments, } from "next/navigation";
 import { cn } from "../../lib/utils";
@@ -11,23 +12,15 @@ export const SlntChildrenTabs = () => {
     const segment = useSelectedLayoutSegment();
     const basePath = pathName.slice(0, -segments.join("/").length);
     const basePath3 = "/" + segments.join("/");
-    return (<div className="flex gap-1 ">
-      
-      {parentData?.children?.map((item, i) => {
+    return (_jsx("div", { className: "flex gap-1 ", children: parentData?.children?.map((item, i) => {
             let href = `${urlJoinPaths(basePath, item.routeName || "")}`;
             if (!segments?.length) {
                 href = urlJoinPaths(pathName, item.routeName || "");
             }
-            return (<TabItem key={i} activate={segment == item.routeName}>
-            <MtLink key={i} variant={"ghost"} href={href}>
-              {item.label}
-            </MtLink>
-            
-          </TabItem>);
-        })}
-    </div>);
+            return (_jsx(TabItem, { activate: segment == item.routeName, children: _jsx(MtLink, { variant: "ghost", href: href, children: item.label }, i) }, i));
+        }) }));
 };
 const TabItem = (props) => {
     const { activate, ...etc } = props;
-    return (<div data-state={activate && "active"} className={cn("ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow")} {...etc}/>);
+    return (_jsx("div", { "data-state": activate && "active", className: cn("ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow"), ...etc }));
 };

package/dist/common/SlntTree/{SlntTreeNode.jsx → SlntTreeNode.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useSelectedLayoutSegment, useSelectedLayoutSegments, } from "next/navigation";
 import { createContext, useContext, useMemo } from "react";
 import { useStore } from "zustand";
@@ -14,7 +15,7 @@ export const slntContext = createContext(null);
 export const MenuTreeProvider = (props) => {
     const { children, ...etc } = props;
     const mystore = useMemo(() => createModalStore(etc), [etc]);
-    return (<slntContext.Provider value={mystore}>{children}</slntContext.Provider>);
+    return (_jsx(slntContext.Provider, { value: mystore, children: children }));
 };
 export const DEFAULT_USE_SHALLOW = true;
 export function useMenuTreeStore(selector) {
@@ -40,8 +41,5 @@ export const SlntTreeNode = (props) => {
         console.log({ message: `(SlntTreeNode)${segment}`, fined, parent });
         return fined;
     }, [parent, segment]);
-    return (<MenuTreeProvider menuNode={currNode}>
-      
-      {children}
-    </MenuTreeProvider>);
+    return (_jsx(MenuTreeProvider, { menuNode: currNode, children: children }));
 };

package/dist/common/devtools/DebugValue.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MtButton } from "../../ui-mt/Button";
+import { Dialog, DialogContent, DialogTrigger } from "../../ui/dialog";
+export const DebugValue = (props) => {
+    const { title, data, className } = props;
+    return (_jsxs(Dialog, { children: [_jsx(DialogTrigger, { asChild: true, children: _jsx(MtButton, { variant: "outline", className: className, children: title || "debug" }) }), _jsx(DialogContent, { className: "max-h-lvh w-full overflow-scroll bg-red-100", children: _jsx("pre", { className: " text-xs", children: JSON.stringify(data, null, 2) }) })] }));
+};

package/dist/common/devtools/{DevTools.jsx → DevTools.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import dynamic from "next/dynamic";
 import { useHotkeys } from "react-hotkeys-hook";
 import { useMtapp } from "../../mtapp/MtAppProvider";
@@ -19,8 +20,5 @@ export const DevTools = () => {
     if (!debug) {
         return null;
     }
-    return (<>
-      <ReactQueryDevtoolsProduction buttonPosition="bottom-right"/>
-      <TailwindIndicator />
-    </>);
+    return (_jsxs(_Fragment, { children: [_jsx(ReactQueryDevtoolsProduction, { buttonPosition: "bottom-right" }), _jsx(TailwindIndicator, {})] }));
 };

package/dist/common/{mtlink.jsx → mtlink.js}

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 import Link from "next/link";
 import React from "react";
@@ -6,11 +7,9 @@ import { cn } from "../lib/utils";
 import { buttonVariants } from "../ui/button";
 export const MtLink = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : Link;
-    return (<Comp className={cn(((variant) && buttonVariants({ variant: variant, className })))} ref={ref} {...props}/>);
+    return (_jsx(Comp, { className: cn(((variant) && buttonVariants({ variant: variant, className }))), ref: ref, ...props }));
 });
 MtLink.displayName = "MtLink";
 export function MtExternalLink({ children, className, ...props }) {
-    return (<a className={cn(className, "hover:text-brandtext-500 hover:underline hover:brightness-150")} rel="noopener noreferrer" {...props}>
-      {children}
-    </a>);
+    return (_jsx("a", { className: cn(className, "hover:text-brandtext-500 hover:underline hover:brightness-150"), rel: "noopener noreferrer", ...props, children: children }));
 }

package/dist/common/pip/PipExamplePage.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import ReactDocumentPictureInPicture from "mtxuilib/common/pip/ReactDocumentPictureInPicture";
+import { MtButton } from "mtxuilib/ui-mt/Button";
+import { useRef, useState } from "react";
+export default function PipExamplePage() {
+    const pipWindowRef = useRef(null);
+    return (_jsx(_Fragment, { children: _jsx(ReactDocumentPictureInPicture, { ref: pipWindowRef, width: "50%", height: "100%", buttonRenderer: ({ open, close, toggle, isOpen }) => (_jsxs("div", { className: "flex gap-2", children: [_jsxs("b", { children: ["Is ", isOpen ? "Open" : "Closed", " "] }), _jsx(MtButton, { onClick: open, children: "Open" }), _jsx(MtButton, { onClick: close, children: "Close" }), _jsx(MtButton, { onClick: toggle, children: "Toggle" })] })), children: _jsx(Comp, { pipWindowRef: pipWindowRef }) }) }));
+}
+const Comp = (props) => {
+    const { pipWindowRef } = props;
+    const [text, setText] = useState("tet1");
+    return (_jsxs("div", { className: "prose", children: [_jsx("h1", { children: "\u753B\u4E2D\u753B\u663E\u793A\uFF08\u8303\u4F8B\uFF09" }), _jsxs("div", { children: [_jsx("button", { onClick: () => {
+                            console.log("关闭");
+                            setText("ssssssssssssssss");
+                        }, children: "sssss" }), _jsxs(MtButton, { onClick: () => {
+                            console.log("关闭");
+                            setText("ssssssssssssssss");
+                        }, children: ["\u5173\u95ED333 ", text] })] }), _jsx("i", { children: "This text should be displayed in a Document Picture in Picture filling the maximum allow height and 50% of the width of the original window" })] }));
+};

package/dist/common/pip/{ReactDocumentPictureInPicture.jsx → ReactDocumentPictureInPicture.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from "react";
 export var FeatureUnavailableReasonEnum;
 (function (FeatureUnavailableReasonEnum) {
@@ -106,17 +107,11 @@ const ReactDocumentPictureInPicture = forwardRef((props, ref) => {
         return featureUnavailableRenderer;
     }
     const buttonRenderer = typeof props.buttonRenderer === "function" ? props.buttonRenderer({ open, close, toggle, isOpen }) : props.buttonRenderer;
-    return (<div>
-      {buttonRenderer}
-      
-      <div ref={contentRef} style={{
-            display: isOpen ? 'block' : 'none',
-            width: '100%',
-            height: '100%',
-        }}>
-        {props.children}
-      </div>
-    </div>);
+    return (_jsxs("div", { children: [buttonRenderer, _jsx("div", { ref: contentRef, style: {
+                    display: isOpen ? 'block' : 'none',
+                    width: '100%',
+                    height: '100%',
+                }, children: props.children })] }));
 });
 ReactDocumentPictureInPicture.displayName = "ReactDocumentPictureInPicture";
 export default ReactDocumentPictureInPicture;

package/dist/common/react-markdown/Code.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
+import { materialOceanic } from 'react-syntax-highlighter/dist/cjs/styles/prism';
+export const CodeBlock = ({ ...props }) => {
+    return (_jsx(SyntaxHighlighter, { language: props.className?.replace(/(?:lang(?:uage)?-)/, ''), style: materialOceanic, wrapLines: true, className: 'not-prose rounded-md', children: props.children }));
+};
+export const Pre = ({ ...props }) => {
+    return (_jsx("div", { className: 'not-prose', children: props.children }));
+};

package/dist/common/react-markdown/{MarkdownToolbar.jsx → MarkdownToolbar.js}

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from "../../ui/button";
 const MarkdownToolbar = ({ feedElement }) => {
     const btns = [
@@ -6,10 +7,6 @@ const MarkdownToolbar = ({ feedElement }) => {
         { name: 'S', syntax: '~Strikethrough~' },
         { name: 'H1', syntax: '# ' },
     ];
-    return (<header className=" flex gap-1 bg-[#253237]">
-      {btns.map(btn => (<Button key={btn.syntax} className="flex rounded-md" onClick={() => feedElement(btn.syntax)}>
-          {btn.name}
-        </Button>))}
-    </header>);
+    return (_jsx("header", { className: " flex gap-1 bg-[#253237]", children: btns.map(btn => (_jsx(Button, { className: "flex rounded-md", onClick: () => feedElement(btn.syntax), children: btn.name }, btn.syntax))) }));
 };
 export default MarkdownToolbar;

package/dist/common/react-markdown/ReactMarkdownExample.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import Markdown from 'react-markdown';
+import rehypeExternalLinks from 'rehype-external-links';
+import rehypeSanitize from 'rehype-sanitize';
+import remarkGfm from 'remark-gfm';
+import { CodeBlock, Pre } from "./Code";
+export const ReactMarkdownExample = () => {
+    const options = {
+        code: CodeBlock,
+        pre: Pre,
+    };
+    return (_jsx("div", { className: 'bg-slate-500', children: _jsx("div", { className: 'flex h-screen justify-between', children: _jsx("article", { className: 'w-full pl-6 pt-5', children: _jsx(Markdown, { className: 'prose prose-invert min-w-full', remarkPlugins: [remarkGfm], rehypePlugins: [
+                        rehypeSanitize,
+                        [rehypeExternalLinks,
+                            { content: { type: 'text', value: '🔗' } }
+                        ],
+                    ], components: options }) }) }) }));
+};

package/dist/common/schema-form/SchemaFormFieldsRender.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "mtxuilib/ui/form";
+import { Input } from "mtxuilib/ui/input";
+import { useFormContext } from "react-hook-form";
+export const SchemaFormFieldsRender = (props) => {
+    const { schema } = props;
+    const form = useFormContext();
+    return (_jsx(_Fragment, { children: schema.fields?.map((formField, i) => {
+            return (_jsx(FormField, { control: form.control, name: formField.name, defaultValue: formField.defaultValue || "", render: ({ field }) => (_jsxs(FormItem, { children: [formField.label && _jsx(FormLabel, { children: formField.label }), _jsx(FormControl, { children: _jsx(_Fragment, { children: _jsx(Input, { placeholder: formField.placeholder, ...field }) }) }), formField.description && _jsx(FormDescription, { children: formField.description }), _jsx(FormMessage, {})] })) }, i));
+        }) }));
+};

package/dist/common/schema-form/{SchemaFormView.jsx → SchemaFormView.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from "react";
 import { FormProvider, useForm } from "react-hook-form";
 import { EditFormToolbar } from "mtxuilib/form/EditFormToolbar";
@@ -12,20 +13,7 @@ export const SchemaFormView = (props) => {
         defaultValues: defaultValues,
     });
     if (!formSchema) {
-        return <div className="border p-8">missing formSchema params</div>;
+        return _jsx("div", { className: "border p-8", children: "missing formSchema params" });
     }
-    return (<>
-      <FormProvider {...form}>
-        <Card className="p-2">
-          <CardContent>
-            <form onSubmit={form.handleSubmit(onSubmit)}>
-              <SchemaFormFieldsRender schema={formSchema}/>
-              <DialogFooter>
-                <EditFormToolbar onCancel={() => onCancel && onCancel()}/>
-              </DialogFooter>
-            </form>
-          </CardContent>
-        </Card>
-      </FormProvider>
-    </>);
+    return (_jsx(_Fragment, { children: _jsx(FormProvider, { ...form, children: _jsx(Card, { className: "p-2", children: _jsx(CardContent, { children: _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsx(SchemaFormFieldsRender, { schema: formSchema }), _jsx(DialogFooter, { children: _jsx(EditFormToolbar, { onCancel: () => onCancel && onCancel() }) })] }) }) }) }) }));
 };

package/dist/common/table/SimpleTable.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { flexRender } from "@tanstack/react-table";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../ui/table";
+export function SimpleTable(props) {
+    const { table } = props;
+    return (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
+                            return (_jsx(TableHead, { children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
+                        }) }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => (_jsx(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) : (_jsx(TableRow, {})) })] }) }));
+}

package/dist/common/table/cells/ExpenderCell.js

@@ -0,0 +1,7 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ChevronRight } from 'lucide-react';
+import { cn } from "../../../lib/utils";
+export const ExpenderCell = (info) => {
+    return info.row.getCanExpand() ? (_jsx("button", { className: "pointer", onClick: info.row.getToggleExpandedHandler(), children: _jsx(ChevronRight, { className: cn(info.row.getIsExpanded() && "rotate-90") }) })) : ('🔵');
+};

package/dist/common/table/cells/SelectCell.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "../../../ui/select";
+export const SelectCell = (info) => {
+    const [value, setValue] = React.useState(info.cell.getValue());
+    const onBlur = () => {
+        const numValue = parseInt(value);
+    };
+    return _jsx("div", { className: "flex w-full", children: _jsx("input", { type: "number", value: value, onChange: e => setValue(e.target.value), onBlur: onBlur, className: "grow" }) });
+};
+export const NewSelectCell = ({ placeholder, items }) => {
+    const component = (_info) => {
+        return _jsx(_Fragment, { children: _jsxs(Select, { children: [_jsx(SelectTrigger, { className: "w-[180px]", children: _jsx(SelectValue, { placeholder: placeholder || "--" }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: items?.map((item, i) => {
+                                return _jsx(SelectItem, { value: item.value, children: item.label }, i);
+                            }) }) })] }) });
+    };
+    return component;
+};

package/dist/common/table/cells/{Text.jsx → Text.js}

@@ -1,4 +1,5 @@
 'use client';
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 export const NewTextCell = ({ enableEdit, placeholder, popup }) => (info) => {
     const initialValue = info.cell.getValue();
@@ -8,8 +9,5 @@ export const NewTextCell = ({ enableEdit, placeholder, popup }) => (info) => {
     }, [initialValue]);
     const onBlur = () => {
     };
-    return <>
-    
-    {value}
-  </>;
+    return _jsx(_Fragment, { children: value });
 };

package/dist/common/table/cells/ViewLink.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import React from "react";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "../../../ui/select";
+export const ViewLinkCell = (info) => {
+    const [value, setValue] = React.useState(info.cell.getValue());
+    const onBlur = () => {
+        const numValue = parseInt(value);
+    };
+    return _jsx(_Fragment, { children: _jsx(Link, { href: "#", children: "res link" }) });
+};
+export const NewSelectCell = ({ placeholder, items }) => {
+    return (info) => {
+        return _jsx(_Fragment, { children: _jsxs(Select, { children: [_jsx(SelectTrigger, { className: "w-[180px]", children: _jsx(SelectValue, { placeholder: placeholder || "--" }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: items?.map((item, i) => {
+                                return _jsx(SelectItem, { value: item.value, children: item.label }, i);
+                            }) }) })] }) });
+    };
+};

package/dist/common/table/cells/container/cellWrapper.js

@@ -0,0 +1,5 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const CellWrapper = ({ children }) => {
+    return (_jsx("div", { children: children }));
+};

package/dist/common/table/cells/number.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+export const NumberCell = (info) => {
+    const [value, setValue] = React.useState(info.cell.getValue());
+    const onBlur = () => {
+        const numValue = parseInt(value);
+    };
+    return _jsx("div", { className: "flex w-full", children: _jsx("input", { type: "number", value: value, onChange: e => setValue(e.target.value), onBlur: onBlur, className: "grow" }) });
+};

package/dist/common/table/cells/{string.jsx → string.js}

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import { CellWrapper } from "./container/cellWrapper";
 export const StringCell = (info) => {
@@ -10,9 +11,5 @@ export const StringCell = (info) => {
     React.useEffect(() => {
         setValue(initialValue);
     }, [initialValue]);
-    return <CellWrapper>
-    {value}
-    
-    
-  </CellWrapper>;
+    return _jsx(CellWrapper, { children: value });
 };

package/dist/common/table/data-table-pagination.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { ChevronLeftIcon, ChevronRightIcon, DoubleArrowLeftIcon, DoubleArrowRightIcon } from "@radix-ui/react-icons";
+import { MtButton } from "../../ui-mt/Button";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../ui/select";
+export function DataTablePagination({ table }) {
+    return (_jsxs("div", { className: "flex items-center justify-between px-2", children: [_jsxs("div", { className: "text-muted-foreground flex-1 text-sm", children: [table.getFilteredSelectedRowModel().rows.length, " of ", table.getFilteredRowModel().rows.length, " row(s) selected."] }), _jsxs("div", { className: "flex items-center space-x-6 lg:space-x-8", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Rows per page" }), _jsxs(Select, { value: `${table.getState().pagination.pageSize}`, onValueChange: (value) => {
+                                    table.setPageSize(Number(value));
+                                }, children: [_jsx(SelectTrigger, { className: "h-8 w-[70px]", children: _jsx(SelectValue, { placeholder: table.getState().pagination.pageSize }) }), _jsx(SelectContent, { side: "top", children: [10, 20, 30, 40, 50].map((pageSize) => (_jsx(SelectItem, { value: `${pageSize}`, children: pageSize }, pageSize))) })] })] }), _jsxs("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: ["Page ", table.getState().pagination.pageIndex + 1, " of ", table.getPageCount()] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsxs(MtButton, { variant: "outline", className: "hidden h-8 w-8 p-0 lg:flex", onClick: () => table.setPageIndex(0), disabled: !table.getCanPreviousPage(), children: [_jsx("span", { className: "sr-only", children: "Go to first page" }), _jsx(DoubleArrowLeftIcon, { className: "h-4 w-4" })] }), _jsxs(MtButton, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: [_jsx("span", { className: "sr-only", children: "Go to previous page" }), _jsx(ChevronLeftIcon, { className: "h-4 w-4" })] }), _jsxs(MtButton, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: [_jsx("span", { className: "sr-only", children: "Go to next page" }), _jsx(ChevronRightIcon, { className: "h-4 w-4" })] }), _jsxs(MtButton, { variant: "outline", className: "hidden h-8 w-8 p-0 lg:flex", onClick: () => table.setPageIndex(table.getPageCount() - 1), disabled: !table.getCanNextPage(), children: [_jsx("span", { className: "sr-only", children: "Go to last page" }), _jsx(DoubleArrowRightIcon, { className: "h-4 w-4" })] })] })] })] }));
+}

package/dist/common/table/data-table-view-options.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MixerHorizontalIcon } from "@radix-ui/react-icons";
+import { MtButton } from "../../ui-mt/Button";
+import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "../../ui/dropdown-menu";
+export function DataTableViewOptions({ table }) {
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(MtButton, { variant: "outline", size: "sm", className: "ml-auto hidden h-8 lg:flex", children: [_jsx(MixerHorizontalIcon, { className: "mr-2 h-4 w-4" }), "View"] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-[150px]", children: [_jsx(DropdownMenuLabel, { children: "Toggle columns" }), _jsx(DropdownMenuSeparator, {}), table
+                        .getAllColumns()
+                        .filter((column) => typeof column.accessorFn !== "undefined" && column.getCanHide())
+                        .map((column) => {
+                        return (_jsx(DropdownMenuCheckboxItem, { className: "capitalize", checked: column.getIsVisible(), onCheckedChange: (value) => column.toggleVisibility(!!value), children: column.id }, column.id));
+                    })] })] }));
+}

package/dist/common/table/example/{ExampleTable.jsx → ExampleTable.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createColumnHelper, flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../../ui/table";
 const columnHelper = createColumnHelper();
@@ -17,7 +18,7 @@ const defaultColumns = [
             columnHelper.accessor((row) => row.lastName, {
                 id: "lastName",
                 cell: (info) => info.getValue(),
-                header: () => <span>Last Name</span>,
+                header: () => _jsx("span", { children: "Last Name" }),
                 footer: (props) => props.column.id,
             }),
         ],
@@ -34,7 +35,7 @@ const defaultColumns = [
                 header: "More Info",
                 columns: [
                     columnHelper.accessor("visits", {
-                        header: () => <span>Visits</span>,
+                        header: () => _jsx("span", { children: "Visits" }),
                         footer: (props) => props.column.id,
                     }),
                     columnHelper.accessor("status", {
@@ -74,29 +75,10 @@ function DataTableDemo1Inner({ columns, data }) {
         columns,
         getCoreRowModel: getCoreRowModel(),
     });
-    return (<div className="rounded-md border">
-      <Table>
-        <TableHeader>
-          {table.getHeaderGroups().map((headerGroup) => (<TableRow key={headerGroup.id}>
-              {headerGroup.headers.map((header) => {
-                return (<TableHead key={header.id}>
-                    {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
-                  </TableHead>);
-            })}
-            </TableRow>))}
-        </TableHeader>
-        <TableBody>
-          {table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => (<TableRow key={row.id} data-state={row.getIsSelected() && "selected"}>
-                {row.getVisibleCells().map((cell) => (<TableCell key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCell>))}
-              </TableRow>))) : (<TableRow>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
-                No results.
-              </TableCell>
-            </TableRow>)}
-        </TableBody>
-      </Table>
-    </div>);
+    return (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
+                            return (_jsx(TableHead, { children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
+                        }) }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => (_jsx(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) : (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) })) })] }) }));
 }
 export function DataTableDemo1() {
-    return <DataTableDemo1Inner columns={defaultColumns} data={demoData}/>;
+    return _jsx(DataTableDemo1Inner, { columns: defaultColumns, data: demoData });
 }

package/dist/common/table/header/SimpleHeader.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../../lib/utils";
+import { ArrowDownIcon, ArrowUpIcon, CaretSortIcon, EyeNoneIcon } from "@radix-ui/react-icons";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "mtxuilib/ui/dropdown-menu";
+import { Button } from "../../../ui/button";
+export function SimpleHeader(props) {
+    const { column } = props;
+    return _jsx(SimpleHeaderRender, { column: column, title: "Status" });
+}
+export function SimpleHeaderRender({ column, title, className, }) {
+    if (!column.getCanSort()) {
+        return _jsx("div", { className: cn(className), children: title });
+    }
+    return (_jsx("div", { className: cn("flex items-center space-x-2", className), children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "data-[state=open]:bg-accent -ml-3 h-8", children: [_jsx("span", { children: title }), column.getIsSorted() === "desc" ? (_jsx(ArrowDownIcon, { className: "ml-2 h-4 w-4" })) : column.getIsSorted() === "asc" ? (_jsx(ArrowUpIcon, { className: "ml-2 h-4 w-4" })) : (_jsx(CaretSortIcon, { className: "ml-2 h-4 w-4" }))] }) }), _jsxs(DropdownMenuContent, { align: "start", children: [_jsxs(DropdownMenuItem, { onClick: () => column.toggleSorting(false), children: [_jsx(ArrowUpIcon, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Asc"] }), _jsxs(DropdownMenuItem, { onClick: () => column.toggleSorting(true), children: [_jsx(ArrowDownIcon, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Desc"] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: () => column.toggleVisibility(false), children: [_jsx(EyeNoneIcon, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Hide"] })] })] }) }));
+}

package/dist/common/table/header/header.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Checkbox } from "../../../ui/checkbox";
+import { SimpleHeaderRender } from "./SimpleHeader";
+export const TableHeader = (props) => {
+    const { table, column, columnConfig } = props;
+    if (!columnConfig.header) {
+        return _jsx("div", {});
+    }
+    const headerType = columnConfig.header.type;
+    switch (headerType) {
+        case "checkbox":
+            return (_jsx(Checkbox, { checked: table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && "indeterminate"), onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value), "aria-label": "Select all", className: "translate-y-[2px]" }));
+        default:
+            return _jsx(SimpleHeaderRender, { column: column, title: columnConfig.header.label });
+    }
+};

package/dist/common/tailwind-indicator.js

@@ -0,0 +1,7 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const TailwindIndicator = () => {
+    if (process.env.NODE_ENV === 'production')
+        return null;
+    return (_jsxs("div", { className: "fixed bottom-1 left-1 z-50 flex h-6 w-6 items-center justify-center rounded-full bg-gray-800 p-3 font-mono text-xs text-white", children: [_jsx("div", { className: "block sm:hidden", children: "xs" }), _jsx("div", { className: "hidden sm:block md:hidden", children: "sm" }), _jsx("div", { className: "hidden md:block lg:hidden", children: "md" }), _jsx("div", { className: "hidden lg:block xl:hidden", children: "lg" }), _jsx("div", { className: "hidden xl:block 2xl:hidden", children: "xl" }), _jsx("div", { className: "hidden 2xl:block", children: "2xl" })] }));
+};