fix

comps/form/Form.tsx

@@ -1,14 +1,13 @@
+import { getPathname } from "lib/utils/pathname";
+import { sofDeleteField as softDeleteField } from "lib/utils/soft-del-rel";
 import { useLocal } from "lib/utils/use-local";
 import { FC, useEffect, useRef } from "react";
 import { createPortal } from "react-dom";
-import { Toaster } from "sonner";
+import { Toaster } from "../ui/toast";
 import { FMInternal, FMProps } from "./typings";
 import { editorFormData } from "./utils/ed-data";
 import { formInit } from "./utils/init";
 import { formReload } from "./utils/reload";
-import { getPathname } from "lib/utils/pathname";
-import { sofDeleteField as softDeleteField } from "lib/utils/soft-del-rel";
-import { toast } from "../ui/toast";
 
 export const editorFormWidth = {} as Record<string, { w: number; f: any }>;
 
@@ -86,7 +85,7 @@ export const Form: FC<FMProps> = (props) => {
   const ref = useRef({
     el: null as null | HTMLFormElement,
     rob: new ResizeObserver(([e]) => {
-      if (e.contentRect.width > 0) {
+      if (e.contentRect.width > 0 && fm.size && fm.props) {
         fm.size.height = e.contentRect.height;
         fm.size.width = e.contentRect.width;
 
@@ -188,8 +187,7 @@ export const Form: FC<FMProps> = (props) => {
         "form c-flex-1 c-w-full c-h-full c-relative c-overflow-auto"
       )}
     >
-      {toaster_el &&
+      {toaster_el && createPortal(<Toaster />, toaster_el)}
-        createPortal(<Toaster position={toast.position} cn={cx} />, toaster_el)}
       <div
         ref={form_inner_ref}
         className={cx(
@@ -211,7 +209,7 @@ export const Form: FC<FMProps> = (props) => {
         )}
       >
         <>
-          {fm.status !== "init" && fm.size.width > 0 && (
+          {fm.status !== "init" && (fm.size?.width || 0) > 0 && (
             <PassProp fm={fm} submit={fm.submit}>
               {!fm.data ? <>NO DATA</> : body}
             </PassProp>

comps/form/base/BaseForm.tsx

@@ -1,10 +1,10 @@
 import { ReactNode, useEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
-import { Toaster } from "sonner";
 import { editorFormWidth } from "../Form";
 import { FMLocal } from "../typings";
 import { createFm } from "./utils/create-fm";
 import { DivForm } from "./utils/DivForm";
+import { Toaster } from "lib/exports";
 
 export type BaseFormProps<T> = {
   name: string;
@@ -93,7 +93,7 @@ export const BaseForm = <T extends Record<string, any>>({
         className
       )}
     >
-      {toaster_el && createPortal(<Toaster cn={cx} />, toaster_el)}
+      {toaster_el && createPortal(<Toaster />, toaster_el)}
 
       <div
         className={cx(

comps/list/TableList.tsx

@@ -24,16 +24,15 @@ import DataGrid, {
   ColumnOrColumnGroup,
   RenderCellProps,
   Row,
-  SortColumn
+  SortColumn,
 } from "react-data-grid";
 import "react-data-grid/lib/styles.css";
 import { createPortal } from "react-dom";
-import { Toaster } from "sonner";
 import { filterWhere } from "../filter/parser/filter-where";
 import { getFilter } from "../filter/utils/get-filter";
 import { MDLocal } from "../md/utils/typings";
 import { Skeleton } from "../ui/skeleton";
-import { toast } from "../ui/toast";
+import { toast, Toaster } from "../ui/toast";
 import { TLList } from "./TLList";
 import { TLSlider } from "./TLSlider";
 import { sortTree } from "./utils/sort-tree";
@@ -225,7 +224,10 @@ export const TableList: FC<TableListProp> = ({
                   }
                 }, 10);
               });
-              if (Array.isArray(md?.params?.links) && md?.params?.links?.length) {
+              if (
+                Array.isArray(md?.params?.links) &&
+                md?.params?.links?.length
+              ) {
                 const last = md.params.links[md.params.links.length - 1];
 
                 if (last && last.where) {
@@ -238,7 +240,10 @@ export const TableList: FC<TableListProp> = ({
               }
             }
 
-          call_prasi_events("tablelist", "where", [__props?.gen__table, where]);
+            call_prasi_events("tablelist", "where", [
+              __props?.gen__table,
+              where,
+            ]);
 
             const load_args: any = {
               async reload() {},
@@ -309,7 +314,6 @@ export const TableList: FC<TableListProp> = ({
               })();
             } else callback(result);
           }
-
         });
 
         return local.reloading;
@@ -853,11 +857,7 @@ export const TableList: FC<TableListProp> = ({
               if (e) local.height = e.offsetHeight;
             }}
           >
-            {toaster_el &&
+            {toaster_el && createPortal(<Toaster />, toaster_el)}
-              createPortal(
-                <Toaster position={toast.position} cn={cn} />,
-                toaster_el
-              )}
             {local.status === "init" ? (
               <DataGrid
                 style={{ opacity: 0 }}
@@ -980,11 +980,7 @@ export const TableList: FC<TableListProp> = ({
   } else if (mode === "list") {
     return (
       <>
-        {toaster_el &&
+        {toaster_el && createPortal(<Toaster />, toaster_el)}
-          createPortal(
-            <Toaster position={toast.position} cn={cn} />,
-            toaster_el
-          )}
         {list.type !== "slider" && list.type !== "grid" && (
           <TLList
             row_click={row_click}

comps/ui/sonner.tsx

@@ -1,29 +0,0 @@
-import { useTheme } from "next-themes"
-import { Toaster as Sonner } from "sonner"
-
-type ToasterProps = React.ComponentProps<typeof Sonner>
-
-const Toaster = ({ ...props }: ToasterProps) => {
-  const { theme = "system" } = useTheme()
-
-  return (
-    <Sonner
-      theme={theme as ToasterProps["theme"]}
-      className="c-toaster c-group"
-      toastOptions={{
-        classNames: {
-          toast:
-            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
-          description: "group-[.toast]:text-muted-foreground",
-          actionButton:
-            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
-          cancelButton:
-            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
-        },
-      }}
-      {...props}
-    />
-  )
-}
-
-export { Toaster }