@solidxai/core-ui 0.1.7-beta.0 → 0.1.7-beta.10

package/dist/components/core/kanban/SolidKanbanViewConfigure.tsx

@@ -1,152 +1,269 @@
+import { permissionExpression } from "../../../helpers/permissions";
 import { usePathname } from "../../../hooks/usePathname";
 import { useRouter } from "../../../hooks/useRouter";
-import { Accordion, AccordionTab } from 'primereact/accordion';
-import { Button } from 'primereact/button';
-import { Divider } from 'primereact/divider';
-import { OverlayPanel } from 'primereact/overlaypanel';
-import { RadioButton } from 'primereact/radiobutton';
-import { useEffect, useRef, useState } from 'react'
-
-export const SolidKanbanViewConfigure = ({ solidKanbanViewMetaData, actionsAllowed, setLayoutDialogVisible, viewModes, setShowSaveFilterPopup }: any) => {
-    const op = useRef(null);
-    const customizeLayout = useRef<OverlayPanel | null>(null);
+import { useSearchParams } from "../../../hooks/useSearchParams";
+import { useEffect, useState } from "react";
+import { SolidExport } from "../../../components/common/SolidExport";
+import { SolidGenericImport } from "../common/SolidGenericImport/SolidGenericImport";
+import {
+    SolidDropdownMenu,
+    SolidDropdownMenuContent,
+    SolidDropdownMenuItem,
+    SolidDropdownMenuLabel,
+    SolidDropdownMenuRadioGroup,
+    SolidDropdownMenuRadioItem,
+    SolidDropdownMenuSeparator,
+    SolidDropdownMenuSub,
+    SolidDropdownMenuSubContent,
+    SolidDropdownMenuSubTrigger,
+    SolidDropdownMenuTrigger,
+    SolidDialog,
+    SolidDialogBody,
+    SolidDialogClose,
+    SolidDialogDescription,
+    SolidDialogHeader,
+    SolidDialogSeparator,
+    SolidDialogTitle,
+    SolidIcon,
+} from "../../shad-cn-ui";
+
+const normalizeViewModes = (viewModes: any[] = []) => {
+    return viewModes
+        .map((option: any) => {
+            if (!option) return null;
+
+            if (typeof option === "string") {
+                return {
+                    type: option,
+                    label: option.charAt(0).toUpperCase() + option.slice(1),
+                };
+            }
+
+            const type = option.type || option.value;
+            if (!type) return null;
+
+            return {
+                ...option,
+                type,
+                label: option.label || (type.charAt(0).toUpperCase() + type.slice(1)),
+            };
+        })
+        .filter(Boolean);
+};
+
+export const SolidKanbanViewConfigure = ({
+    solidKanbanViewMetaData,
+    modelName,
+    actionsAllowed,
+    setLayoutDialogVisible,
+    viewModes,
+    setShowSaveFilterPopup,
+    filters,
+    handleRefreshView,
+}: any) => {
     const pathname = usePathname();
     const router = useRouter();
+    const searchParams = useSearchParams();
     const [view, setView] = useState<string>("");
+    const [isCogMenuOpen, setIsCogMenuOpen] = useState(false);
+    const [openImportDialog, setOpenImportDialog] = useState(false);
+    const [exportView, setExportView] = useState(false);
 
-    const handleViewChange = (newView: string) => {
-        if (view === newView) return; // Prevent unnecessary updates
-        const pathSegments = pathname.split('/').filter(Boolean);
-        pathSegments[pathSegments.length - 1] = newView; // Replace the last part with new view
-        const newPath = '/' + pathSegments.join('/');
-        router.push(newPath);
-    };
+    const visibleViewModes = normalizeViewModes(Array.isArray(viewModes) ? viewModes : []);
+    const showSwitchType = visibleViewModes.length > 1;
+    const layoutAttrs = solidKanbanViewMetaData?.data?.solidView?.layout?.attrs ?? {};
 
     useEffect(() => {
-        if (typeof pathname === 'string') {
-            const pathSegments = pathname.split('/').filter(Boolean);
+        if (typeof pathname === "string") {
+            const pathSegments = pathname.split("/").filter(Boolean);
             if (pathSegments.length > 0) {
                 setView(pathSegments[pathSegments.length - 1]);
             }
         }
-    }, [])
+    }, [pathname]);
 
+    const handleViewChange = (newViewType: string) => {
+        if (view === newViewType) return;
 
-    const [isOverlayOpen, setIsOverlayOpen] = useState(false);
-    useEffect(() => {
-        const handleClickOutside = (event: MouseEvent) => {
-            if (
-                customizeLayout.current &&
-                !customizeLayout.current.getElement()?.contains(event.target as Node)
-            ) {
-                setIsOverlayOpen(false);
-            }
+        const nextView = visibleViewModes.find((option: any) => option.type === newViewType);
+        const pathSegments = pathname.split("/").filter(Boolean);
+        pathSegments[pathSegments.length - 1] = newViewType;
+        const nextSearchParams = new URLSearchParams(searchParams.toString());
+        const currentQuery = {
+            menuItemId: searchParams.get("menuItemId"),
+            menuItemName: searchParams.get("menuItemName"),
+            actionId: searchParams.get("actionId"),
+            actionName: searchParams.get("actionName"),
         };
 
-        if (isOverlayOpen) {
-            document.addEventListener("click", handleClickOutside);
-        } else {
-            document.removeEventListener("click", handleClickOutside);
-        }
-
-        return () => document.removeEventListener("click", handleClickOutside);
-    }, [isOverlayOpen])
+        const queryFields = {
+            menuItemId: nextView?.menuItemId ?? currentQuery.menuItemId,
+            menuItemName: nextView?.menuItemName ?? currentQuery.menuItemName,
+            actionId: nextView?.actionId ?? currentQuery.actionId,
+            actionName: nextView?.actionName ?? currentQuery.actionName,
+        };
 
+        Object.entries(queryFields).forEach(([key, value]) => {
+            if (value) {
+                nextSearchParams.set(key, value);
+            } else {
+                nextSearchParams.delete(key);
+            }
+        });
 
+        const newPath = "/" + pathSegments.join("/");
+        const nextQueryString = nextSearchParams.toString();
+        router.push(nextQueryString ? `${newPath}?${nextQueryString}` : newPath);
+    };
 
+    const clearLocalstorageCache = () => {
+        const currentPageUrl = window.location.pathname;
+        localStorage.removeItem(currentPageUrl);
+        window.location.reload();
+    };
 
+    const canImport =
+        Boolean(modelName) &&
+        actionsAllowed.includes(`${permissionExpression(modelName, "create")}`) &&
+        actionsAllowed.includes(`${permissionExpression("importTransaction", "create")}`);
 
+    const canExport =
+        Boolean(modelName) &&
+        actionsAllowed.includes(`${permissionExpression(modelName, "findMany")}`) &&
+        actionsAllowed.includes(`${permissionExpression("exportTransaction", "create")}`);
 
+    const canCustomizeLayout = actionsAllowed.includes(`${permissionExpression("userViewMetadata", "create")}`);
+    const canSaveCustomFilter = actionsAllowed.includes(`${permissionExpression("savedFilters", "create")}`);
 
     return (
         <div className="position-relative">
-            <Button
-                type="button"
-                size="small"
-                icon="pi pi-cog"
-                severity="secondary"
-                outlined
-                className='solid-icon-button'
-                // @ts-ignore
-                onClick={(e) => op.current.toggle(e)}
-            />
-            <OverlayPanel ref={op}>
-                <div className="p-2">
-                    <div className="flex flex-column">
-                        <Button text icon='pi pi-download' label="Import" size="small" severity="secondary" className="text-left gap-2 text-base" />
-                        <Button text icon='pi pi-upload' label="Export" size="small" severity="secondary" className="text-left gap-2 text-base" />
-                        <Button
-                            text
-                            type="button"
-                            className="w-8rem text-left text-base gap-2 purple-200"
-                            label="Layout"
-                            size="small"
-                            iconPos="left"
-                            severity="contrast"
-                            icon={'pi pi-objects-column'}
-                            onClick={() => setLayoutDialogVisible(true)}
-                        />
-                    </div>
-                </div>
-                <Divider className="m-0" />
-                <div className="p-2 relative flex flex-column gap-1">
-                    <Button
-                        icon='pi pi-sliders-h'
-                        label="Customize Layout"
-                        severity={isOverlayOpen ? undefined : "secondary"}
-                        size="small"
-                        text={isOverlayOpen ? false : true}
-                        className="text-left gap-2 w-full text-base"
-                        // @ts-ignore
-                        onClick={(e) => {
-                            customizeLayout.current?.toggle(e);
-                            setIsOverlayOpen((prev) => !prev); // ✅ Ensure state updates when toggled
-                        }}
+            <SolidDropdownMenu open={isCogMenuOpen} onOpenChange={setIsCogMenuOpen}>
+                <SolidDropdownMenuTrigger asChild>
+                    <button
+                        type="button"
+                        className="solid-icon-button solid-header-cog-trigger"
+                        aria-label="Open kanban options"
                     >
-                        <i className="pi pi-chevron-right text-sm"></i>
-                    </Button>
-                    <Button text icon='pi pi-save' label="Save Custom Filter" size="small" severity="secondary" className="text-left gap-2 text-base" onClick={() => setShowSaveFilterPopup(true)} />
-                    <OverlayPanel ref={customizeLayout} className="customize-layout-panel" style={{ minWidth: 250 }}
-                        onShow={() => setIsOverlayOpen(true)}
-                        onHide={() => {
-                            setTimeout(() => setIsOverlayOpen(false), 50); // ✅ Ensure state updates
+                        <SolidIcon name="si-cog" aria-hidden />
+                    </button>
+                </SolidDropdownMenuTrigger>
+                <SolidDropdownMenuContent className="listview-cogwheel-panel">
+                    {canImport && (
+                        <SolidDropdownMenuItem
+                            className="solid-header-dropdown-item"
+                            onSelect={() => {
+                                setOpenImportDialog(true);
+                                setIsCogMenuOpen(false);
+                            }}
+                        >
+                            <SolidIcon name="si-download" className="solid-header-action-button-icon" aria-hidden />
+                            <span className="solid-header-action-button-label">Import</span>
+                        </SolidDropdownMenuItem>
+                    )}
+
+                    {canExport && (
+                        <SolidDropdownMenuItem
+                            className="solid-header-dropdown-item"
+                            onSelect={() => {
+                                setExportView(true);
+                                setIsCogMenuOpen(false);
+                            }}
+                        >
+                            <SolidIcon name="si-upload" className="solid-header-action-button-icon" aria-hidden />
+                            <span className="solid-header-action-button-label">Export</span>
+                        </SolidDropdownMenuItem>
+                    )}
+
+                    {(canCustomizeLayout || canSaveCustomFilter) && <SolidDropdownMenuSeparator />}
+
+                    {canCustomizeLayout && (
+                        <SolidDropdownMenuSub>
+                            <SolidDropdownMenuSubTrigger className="solid-header-dropdown-item">
+                                <SolidIcon name="si-sliders-h" className="solid-header-action-button-icon" aria-hidden />
+                                <span className="solid-header-action-button-label">Customize Layout</span>
+                            </SolidDropdownMenuSubTrigger>
+                            <SolidDropdownMenuSubContent className="customize-layout-panel">
+                                {showSwitchType && (
+                                    <>
+                                        <SolidDropdownMenuLabel>Switch Type</SolidDropdownMenuLabel>
+                                        <SolidDropdownMenuRadioGroup value={view} onValueChange={handleViewChange}>
+                                            {visibleViewModes.map((option: any) => (
+                                                <SolidDropdownMenuRadioItem key={option.type} value={option.type}>
+                                                    {option.label}
+                                                </SolidDropdownMenuRadioItem>
+                                            ))}
+                                        </SolidDropdownMenuRadioGroup>
+                                        <SolidDropdownMenuSeparator />
+                                    </>
+                                )}
+                                <SolidDropdownMenuItem
+                                    onSelect={() => {
+                                        setLayoutDialogVisible(true);
+                                        setIsCogMenuOpen(false);
+                                    }}
+                                >
+                                    <SolidIcon name="si-code" className="solid-header-action-button-icon" aria-hidden />
+                                    <span className="solid-header-action-button-label">Layout Editor</span>
+                                </SolidDropdownMenuItem>
+                            </SolidDropdownMenuSubContent>
+                        </SolidDropdownMenuSub>
+                    )}
+
+                    {canSaveCustomFilter && (
+                        <SolidDropdownMenuItem
+                            className="solid-header-dropdown-item"
+                            onSelect={() => {
+                                setShowSaveFilterPopup(true);
+                                setIsCogMenuOpen(false);
+                            }}
+                        >
+                            <SolidIcon name="si-save" className="solid-header-action-button-icon" aria-hidden />
+                            <span className="solid-header-action-button-label">Save Custom Filter</span>
+                        </SolidDropdownMenuItem>
+                    )}
+
+                    <SolidDropdownMenuItem
+                        className="solid-header-dropdown-item"
+                        onSelect={() => {
+                            clearLocalstorageCache();
+                            setIsCogMenuOpen(false);
                         }}
                     >
+                        <SolidIcon name="si-trash" className="solid-header-action-button-icon" aria-hidden />
+                        <span className="solid-header-action-button-label">Clear cache</span>
+                    </SolidDropdownMenuItem>
+                </SolidDropdownMenuContent>
+            </SolidDropdownMenu>
 
-                        <div className="solid-layout-accordion">
-                            <Accordion expandIcon="pi pi-chevron-down" collapseIcon="pi pi-chevron-up" activeIndex={[0]}>
-                                {viewModes && viewModes.length > 0 &&
-                                    <AccordionTab header="Switch Type">
-                                        <div className="flex flex-column gap-1 p-1">
-                                            {viewModes.map((option: any) => (
-                                                <div key={option.value} className={`flex align-items-center ${option.value === view ? 'solid-active-view' : 'solid-view'}`}>
-                                                    <RadioButton
-                                                        inputId={option.value}
-                                                        name="views"
-                                                        value={option.value}
-                                                        // onChange={(e) => router}
-                                                        onChange={() => handleViewChange(option.value)}
-                                                        checked={option.value === view}
-                                                    />
-                                                    <label htmlFor={option.value} className="ml-2 flex align-items-center justify-content-between w-full">
-                                                        {option.label}
-                                                        {/* <Image
-                                                        src={option.image}
-                                                        alt={option.value}
-                                                        fill
-                                                        className='relative row-spacing-img'
-                                                    /> */}
-                                                    </label>
-                                                </div>
-                                            ))}
-                                        </div>
-                                    </AccordionTab>
-                                }
-                            </Accordion>
-                        </div>
-                    </OverlayPanel>
-                </div>
-            </OverlayPanel>
+            <SolidDialog
+                open={exportView}
+                onOpenChange={setExportView}
+                className="solid-kanban-export-dialog"
+                style={{ width: "min(960px, calc(100vw - 32px))" }}
+            >
+                <SolidDialogHeader className="solid-export-dialog-header">
+                    <div>
+                        <SolidDialogTitle>Export</SolidDialogTitle>
+                        <SolidDialogDescription className="solid-filter-dialog-subtitle m-0">
+                            Choose the file format, refine the field set, and save reusable export templates.
+                        </SolidDialogDescription>
+                    </div>
+                    <SolidDialogClose />
+                </SolidDialogHeader>
+                <SolidDialogSeparator />
+                <SolidDialogBody className="solid-kanban-export-dialog-body">
+                    <SolidExport listViewMetaData={solidKanbanViewMetaData} filters={filters} />
+                </SolidDialogBody>
+            </SolidDialog>
+
+            {openImportDialog && (
+                <SolidGenericImport
+                    openImportDialog={openImportDialog}
+                    setOpenImportDialog={setOpenImportDialog}
+                    listViewMetaData={solidKanbanViewMetaData}
+                    handleFetchUpdatedRecords={handleRefreshView}
+                />
+            )}
         </div>
-    )
-}
+    );
+};

package/dist/components/core/kanban/SolidManyToOneFilterElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidManyToOneFilterElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,2BAA2B,kDAAmD,GAAG,4CAmD7F,CAAA"}
+{"version":3,"file":"SolidManyToOneFilterElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,2BAA2B,kDAAmD,GAAG,4CAmD7F,CAAA"}

package/dist/components/core/kanban/SolidManyToOneFilterElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidManyToOneFilterElement.js","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AAEzE,OAAO,EAAE,YAAY,EAA6B,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,IAAI,CAAC;AAGpB,MAAM,CAAC,IAAM,2BAA2B,GAAG,UAAC,EAAkD;QAAhD,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAEnF,IAAM,SAAS,GAAG,oBAAoB,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC1E,IAAA,4BAA4B,GAAK,SAAS,6BAAd,CAAe;IAC5C,IAAA,uBAAuB,GAAI,4BAA4B,EAAE,GAAlC,CAAmC;IAE3D,IAAA,KAA4C,QAAQ,CAAC,EAAE,CAAC,EAAvD,iBAAiB,QAAA,EAAE,oBAAoB,QAAgB,CAAC;IAC/D,IAAM,kBAAkB,GAAG,UAAO,KAAgC;;;;;;;oBAGxD,SAAS,GAAG;wBACd,MAAM,EAAE,CAAC;wBACT,KAAK,EAAE,EAAE;wBACT,OAAO;4BACH,GAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,IAAG;gCAChD,UAAU,EAAE,KAAK,CAAC,KAAK;6BAC1B;+BACJ;qBACJ,CAAC;oBAEI,cAAc,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,EAAE;wBAC3C,gBAAgB,EAAE,IAAI;qBACzB,CAAC,CAAC;oBAG0B,qBAAM,uBAAuB,CAAC,cAAc,CAAC,EAAA;;oBAApE,oBAAoB,GAAG,SAA6C;oBAGpE,gBAAgB,GAAG,oBAAoB,CAAC,IAAI,CAAC;oBAEnD,IAAI,gBAAgB,EAAE;wBACZ,sBAAoB,gBAAgB,CAAC,OAAO,CAAC,GAAG,CAAC,UAAC,IAAS;;4BAC7D,OAAO;gCACH,KAAK,EAAE,IAAI,CAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,CAAC;gCAC7D,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC;6BACpB,CAAA;wBACL,CAAC,CAAC,CAAC;wBACH,oBAAoB,CAAC,mBAAiB,CAAC,CAAC;qBAC3C;;;;SACJ,CAAA;IAED,OAAO,CACH,KAAC,YAAY,IACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,iBAAiB,EAC9B,cAAc,EAAE,kBAAkB,EAClC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,EAA5B,CAA4B,EAC7C,SAAS,EAAC,6BAA6B,GACzC,CACL,CAAA;AACL,CAAC,CAAA","sourcesContent":["import { createSolidEntityApi } from \"../../../redux/api/solidEntityApi\";\nimport { InputTypes } from \"./SolidVarInputsFilterElement\"\nimport { AutoComplete, AutoCompleteCompleteEvent } from \"primereact/autocomplete\";\nimport { useState } from \"react\";\nimport qs from \"qs\";\n\n\nexport const SolidManyToOneFilterElement = ({ value, updateInputs, index, fieldMetadata }: any) => {\n\n    const entityApi = createSolidEntityApi(fieldMetadata.relationCoModelSingularName);\n    const { useLazyGetSolidEntitiesQuery } = entityApi;\n    const [triggerGetSolidEntities] = useLazyGetSolidEntitiesQuery();\n\n    const [autoCompleteItems, setAutoCompleteItems] = useState([]);\n    const autoCompleteSearch = async (event: AutoCompleteCompleteEvent) => {\n\n        // Get the list view layout & metadata first. \n        const queryData = {\n            offset: 0,\n            limit: 10,\n            filters: {\n                [fieldMetadata?.relationModel?.userKeyField?.name]: {\n                    $containsi: event.query\n                }\n            }\n        };\n\n        const autocompleteQs = qs.stringify(queryData, {\n            encodeValuesOnly: true,\n        });\n\n        // TODO: do error handling here, possible errors like modelname is incorrect etc...\n        const autocompleteResponse = await triggerGetSolidEntities(autocompleteQs);\n\n        // TODO: if no data found then can we show no matching \"entities\", where entities can be replaced with the model plural name,\n        const autocompleteData = autocompleteResponse.data;\n\n        if (autocompleteData) {\n            const autoCompleteItems = autocompleteData.records.map((item: any) => {\n                return {\n                    label: item[fieldMetadata?.relationModel?.userKeyField?.name],\n                    value: item['id']\n                }\n            });\n            setAutoCompleteItems(autoCompleteItems);\n        }\n    }\n\n    return (\n        <AutoComplete\n            field=\"label\"\n            value={value}\n            suggestions={autoCompleteItems}\n            completeMethod={autoCompleteSearch}\n            onChange={(e) => updateInputs(index, e.value)}\n            className=\"solid-standard-autocomplete\"\n        />\n    )\n}"]}
+{"version":3,"file":"SolidManyToOneFilterElement.js","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,YAAY,EAA6B,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,IAAI,CAAC;AAGpB,MAAM,CAAC,IAAM,2BAA2B,GAAG,UAAC,EAAkD;QAAhD,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAEnF,IAAM,SAAS,GAAG,oBAAoB,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC1E,IAAA,4BAA4B,GAAK,SAAS,6BAAd,CAAe;IAC5C,IAAA,uBAAuB,GAAI,4BAA4B,EAAE,GAAlC,CAAmC;IAE3D,IAAA,KAA4C,QAAQ,CAAC,EAAE,CAAC,EAAvD,iBAAiB,QAAA,EAAE,oBAAoB,QAAgB,CAAC;IAC/D,IAAM,kBAAkB,GAAG,UAAO,KAAgC;;;;;;;oBAGxD,SAAS,GAAG;wBACd,MAAM,EAAE,CAAC;wBACT,KAAK,EAAE,EAAE;wBACT,OAAO;4BACH,GAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,IAAG;gCAChD,UAAU,EAAE,KAAK,CAAC,KAAK;6BAC1B;+BACJ;qBACJ,CAAC;oBAEI,cAAc,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,EAAE;wBAC3C,gBAAgB,EAAE,IAAI;qBACzB,CAAC,CAAC;oBAG0B,qBAAM,uBAAuB,CAAC,cAAc,CAAC,EAAA;;oBAApE,oBAAoB,GAAG,SAA6C;oBAGpE,gBAAgB,GAAG,oBAAoB,CAAC,IAAI,CAAC;oBAEnD,IAAI,gBAAgB,EAAE;wBACZ,sBAAoB,gBAAgB,CAAC,OAAO,CAAC,GAAG,CAAC,UAAC,IAAS;;4BAC7D,OAAO;gCACH,KAAK,EAAE,IAAI,CAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,CAAC;gCAC7D,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC;6BACpB,CAAA;wBACL,CAAC,CAAC,CAAC;wBACH,oBAAoB,CAAC,mBAAiB,CAAC,CAAC;qBAC3C;;;;SACJ,CAAA;IAED,OAAO,CACH,KAAC,YAAY,IACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,iBAAiB,EAC9B,cAAc,EAAE,kBAAkB,EAClC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,EAA5B,CAA4B,EAC7C,SAAS,EAAC,6BAA6B,GACzC,CACL,CAAA;AACL,CAAC,CAAA","sourcesContent":["import { createSolidEntityApi } from \"../../../redux/api/solidEntityApi\";\nimport { AutoComplete, AutoCompleteCompleteEvent } from \"primereact/autocomplete\";\nimport { useState } from \"react\";\nimport qs from \"qs\";\n\n\nexport const SolidManyToOneFilterElement = ({ value, updateInputs, index, fieldMetadata }: any) => {\n\n    const entityApi = createSolidEntityApi(fieldMetadata.relationCoModelSingularName);\n    const { useLazyGetSolidEntitiesQuery } = entityApi;\n    const [triggerGetSolidEntities] = useLazyGetSolidEntitiesQuery();\n\n    const [autoCompleteItems, setAutoCompleteItems] = useState([]);\n    const autoCompleteSearch = async (event: AutoCompleteCompleteEvent) => {\n\n        // Get the list view layout & metadata first. \n        const queryData = {\n            offset: 0,\n            limit: 10,\n            filters: {\n                [fieldMetadata?.relationModel?.userKeyField?.name]: {\n                    $containsi: event.query\n                }\n            }\n        };\n\n        const autocompleteQs = qs.stringify(queryData, {\n            encodeValuesOnly: true,\n        });\n\n        // TODO: do error handling here, possible errors like modelname is incorrect etc...\n        const autocompleteResponse = await triggerGetSolidEntities(autocompleteQs);\n\n        // TODO: if no data found then can we show no matching \"entities\", where entities can be replaced with the model plural name,\n        const autocompleteData = autocompleteResponse.data;\n\n        if (autocompleteData) {\n            const autoCompleteItems = autocompleteData.records.map((item: any) => {\n                return {\n                    label: item[fieldMetadata?.relationModel?.userKeyField?.name],\n                    value: item['id']\n                }\n            });\n            setAutoCompleteItems(autoCompleteItems);\n        }\n    }\n\n    return (\n        <AutoComplete\n            field=\"label\"\n            value={value}\n            suggestions={autoCompleteItems}\n            completeMethod={autoCompleteSearch}\n            onChange={(e) => updateInputs(index, e.value)}\n            className=\"solid-standard-autocomplete\"\n        />\n    )\n}\n"]}

package/dist/components/core/kanban/SolidManyToOneFilterElement.tsx

@@ -1,5 +1,4 @@
 import { createSolidEntityApi } from "../../../redux/api/solidEntityApi";
-import { InputTypes } from "./SolidVarInputsFilterElement"
 import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
 import { useState } from "react";
 import qs from "qs";
@@ -56,4 +55,4 @@ export const SolidManyToOneFilterElement = ({ value, updateInputs, index, fieldM
             className="solid-standard-autocomplete"
         />
     )
-}
+}

package/dist/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaMultipleKanbanField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAOvE,QAAA,MAAM,6BAA6B,oGAAqG,2BAA2B,4CA+HlK,CAAC;AAEF,eAAe,6BAA6B,CAAC"}
+{"version":3,"file":"SolidMediaMultipleKanbanField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAavE,QAAA,MAAM,6BAA6B,oGAAqG,2BAA2B,4CAqIlK,CAAC;AAEF,eAAe,6BAA6B,CAAC"}

package/dist/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-import { Dialog } from 'primereact/dialog';
 import { Document, Page, pdfjs } from "react-pdf";
+import { SolidDialog, SolidDialogBody, SolidDialogClose, SolidDialogHeader, SolidDialogTitle, } from "../../../shad-cn-ui";
 pdfjs.GlobalWorkerOptions.workerSrc = "//unpkg.com/pdfjs-dist@".concat(pdfjs.version, "/build/pdf.worker.min.mjs");
 var SolidMediaMultipleKanbanField = function (_a) {
     var _b, _c, _d, _e, _f;
@@ -50,7 +50,7 @@ var SolidMediaMultipleKanbanField = function (_a) {
                 }
                 // **Render Other Files**
                 return (_jsxs("div", { className: 'flex align-items-end gap-2 my-2', children: [_jsx("a", { href: url, download: true, target: "_blank", rel: "noopener noreferrer", children: _jsxs("svg", { width: "36px", height: "36px", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", fill: "#722ED1", stroke: "#722ED1", strokeWidth: "0.00024000000000000003", children: [_jsx("g", { id: "SVGRepo_bgCarrier", strokeWidth: "0" }), _jsx("g", { id: "SVGRepo_tracerCarrier", strokeLinecap: "round", strokeLinejoin: "round" }), _jsxs("g", { id: "SVGRepo_iconCarrier", children: [_jsx("path", { d: "M3 23h18V6.709L15.29 1H3zM15 2h.2L20 6.8V7h-5zM4 2h10v6h6v14H4z" }), _jsx("path", { fill: "none", d: "M0 0h24v24H0z" })] })] }) }), _jsxs("a", { href: url, download: true, target: "_blank", rel: "noopener noreferrer", className: 'text-color flex align-items-start gap-2', style: { textDecoration: 'none' }, children: [_jsx("p", { className: "text-sm mb-1", style: { wordWrap: 'break-word', overflowWrap: 'break-word' }, children: fileName }), _jsx("span", { className: 'pi pi-cloud-download' })] })] }, index));
-            }), _jsx(Dialog, { header: "PDF Preview", visible: visible, style: { width: "" }, onHide: function () { return setVisible(false); }, modal: true, children: selectedPdf && (_jsx(Document, { file: selectedPdf, children: _jsx(Page, { pageNumber: 1 }) })) })] }));
+            }), _jsxs(SolidDialog, { open: visible, onOpenChange: setVisible, className: "solid-kanban-preview-dialog", children: [_jsxs(SolidDialogHeader, { className: "solid-kanban-preview-dialog-header", children: [_jsx(SolidDialogTitle, { children: "PDF Preview" }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogBody, { className: "solid-kanban-preview-dialog-body", children: selectedPdf && (_jsx(Document, { file: selectedPdf, children: _jsx(Page, { pageNumber: 1 }) })) })] })] }));
 };
 export default SolidMediaMultipleKanbanField;
 //# sourceMappingURL=SolidMediaMultipleKanbanField.js.map

package/dist/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaMultipleKanbanField.js","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { Column } from \"primereact/column\";\nimport { SolidKanbanViewFieldsParams } from '../SolidKanbanViewFields';\nimport { Dialog } from 'primereact/dialog';\nimport { Document, Page, pdfjs } from \"react-pdf\";\n\npdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;\n\n\nconst SolidMediaMultipleKanbanField = ({ solidKanbanViewMetaData, fieldMetadata, fieldLayout, data, setLightboxUrls, setOpenLightbox }: SolidKanbanViewFieldsParams) => {\n    // const filterable = column.attrs.filterable;\n    const [visible, setVisible] = useState(false);\n    const header = fieldMetadata.displayName;\n    // const fileData = data && data._media[fieldMetadata.name].length > 0 && data._media[fieldMetadata.name].map((i: any) => {\n    //     const fileData = { mimeType: i.mimeType, url: i._full_url }\n    //     return fileData\n    // }\n    // );\n    const [selectedPdf, setSelectedPdf] = useState(null);\n    const mediaFiles = data?._media?.[fieldMetadata.name] || [];\n\n    const firstImage = mediaFiles.find((file: any) => file.mimeType.includes(\"image/\"));\n\n    // **Get all image URLs for the lightbox**\n    const allImageUrls = mediaFiles\n        .filter((file: any) => file.mimeType.includes(\"image/\"))\n        .map((file: any) => ({ src: file._full_url }));\n\n\n    return (\n        <div className={`${fieldLayout?.attrs?.className ? ` ${fieldLayout.attrs.className}` : \"\"}`}>\n            {firstImage && (\n                <div className='my-2'>\n                    <img\n                        className={fieldLayout?.attrs?.kanbanImagePreviewClassname ? fieldLayout?.attrs?.kanbanImagePreviewClassname : 'kanban-image-preview'}\n                        src={firstImage._full_url}\n                        onClick={(event) => {\n                            event.stopPropagation();\n                            setLightboxUrls(allImageUrls);\n                            setOpenLightbox(true);\n                        }}\n                        alt={firstImage.originalFileName}\n                    />\n                    {fieldLayout?.attrs?.showLabel !== false &&\n\n                        <p className=\"text-sm\"\n                            style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}\n                            onClick={(event) => {\n                                event.stopPropagation();\n                                setLightboxUrls(allImageUrls);\n                                setOpenLightbox(true);\n                            }}\n                        >\n                            {firstImage.originalFileName}\n                        </p>\n                    }\n                </div>\n            )}\n\n            {mediaFiles.map((file: any, index: number) => {\n                const { _full_url: url, mimeType, originalFileName: fileName } = file;\n                if (mimeType.includes(\"image/\")) return null;\n\n                // **Render PDFs**\n                if (mimeType.includes(\"pdf\")) {\n                    return (\n                        <div key={index} className='flex align-items-end gap-2 my-2'>\n                            <div\n                                onClick={() => {\n                                    setSelectedPdf(url);\n                                    setVisible(true);\n                                }}\n                                style={{ cursor: 'pointer' }}\n                            >\n                                <svg width=\"36px\" height=\"36px\" viewBox=\"-4 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#000000\" strokeWidth=\"0.0004\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"> <path d=\"M25.6686 26.0962C25.1812 26.2401 24.4656 26.2563 23.6984 26.145C22.875 26.0256 22.0351 25.7739 21.2096 25.403C22.6817 25.1888 23.8237 25.2548 24.8005 25.6009C25.0319 25.6829 25.412 25.9021 25.6686 26.0962ZM17.4552 24.7459C17.3953 24.7622 17.3363 24.7776 17.2776 24.7939C16.8815 24.9017 16.4961 25.0069 16.1247 25.1005L15.6239 25.2275C14.6165 25.4824 13.5865 25.7428 12.5692 26.0529C12.9558 25.1206 13.315 24.178 13.6667 23.2564C13.9271 22.5742 14.193 21.8773 14.468 21.1894C14.6075 21.4198 14.7531 21.6503 14.9046 21.8814C15.5948 22.9326 16.4624 23.9045 17.4552 24.7459ZM14.8927 14.2326C14.958 15.383 14.7098 16.4897 14.3457 17.5514C13.8972 16.2386 13.6882 14.7889 14.2489 13.6185C14.3927 13.3185 14.5105 13.1581 14.5869 13.0744C14.7049 13.2566 14.8601 13.6642 14.8927 14.2326ZM9.63347 28.8054C9.38148 29.2562 9.12426 29.6782 8.86063 30.0767C8.22442 31.0355 7.18393 32.0621 6.64941 32.0621C6.59681 32.0621 6.53316 32.0536 6.44015 31.9554C6.38028 31.8926 6.37069 31.8476 6.37359 31.7862C6.39161 31.4337 6.85867 30.8059 7.53527 30.2238C8.14939 29.6957 8.84352 29.2262 9.63347 28.8054ZM27.3706 26.1461C27.2889 24.9719 25.3123 24.2186 25.2928 24.2116C24.5287 23.9407 23.6986 23.8091 22.7552 23.8091C21.7453 23.8091 20.6565 23.9552 19.2582 24.2819C18.014 23.3999 16.9392 22.2957 16.1362 21.0733C15.7816 20.5332 15.4628 19.9941 15.1849 19.4675C15.8633 17.8454 16.4742 16.1013 16.3632 14.1479C16.2737 12.5816 15.5674 11.5295 14.6069 11.5295C13.948 11.5295 13.3807 12.0175 12.9194 12.9813C12.0965 14.6987 12.3128 16.8962 13.562 19.5184C13.1121 20.5751 12.6941 21.6706 12.2895 22.7311C11.7861 24.0498 11.2674 25.4103 10.6828 26.7045C9.04334 27.3532 7.69648 28.1399 6.57402 29.1057C5.8387 29.7373 4.95223 30.7028 4.90163 31.7107C4.87693 32.1854 5.03969 32.6207 5.37044 32.9695C5.72183 33.3398 6.16329 33.5348 6.6487 33.5354C8.25189 33.5354 9.79489 31.3327 10.0876 30.8909C10.6767 30.0029 11.2281 29.0124 11.7684 27.8699C13.1292 27.3781 14.5794 27.011 15.985 26.6562L16.4884 26.5283C16.8668 26.4321 17.2601 26.3257 17.6635 26.2153C18.0904 26.0999 18.5296 25.9802 18.976 25.8665C20.4193 26.7844 21.9714 27.3831 23.4851 27.6028C24.7601 27.7883 25.8924 27.6807 26.6589 27.2811C27.3486 26.9219 27.3866 26.3676 27.3706 26.1461ZM30.4755 36.2428C30.4755 38.3932 28.5802 38.5258 28.1978 38.5301H3.74486C1.60224 38.5301 1.47322 36.6218 1.46913 36.2428L1.46884 3.75642C1.46884 1.6039 3.36763 1.4734 3.74457 1.46908H20.263L20.2718 1.4778V7.92396C20.2718 9.21763 21.0539 11.6669 24.0158 11.6669H30.4203L30.4753 11.7218L30.4755 36.2428ZM28.9572 10.1976H24.0169C21.8749 10.1976 21.7453 8.29969 21.7424 7.92417V2.95307L28.9572 10.1976ZM31.9447 36.2428V11.1157L21.7424 0.871022V0.823357H21.6936L20.8742 0H3.74491C2.44954 0 0 0.785336 0 3.75711V36.2435C0 37.5427 0.782956 40 3.74491 40H28.2001C29.4952 39.9997 31.9447 39.2143 31.9447 36.2428Z\" fill=\"#EB5757\"></path> </g></svg>\n                            </div>\n                            <p className=\"text-sm\"\n                                style={{ maxWidth: '70%', wordWrap: 'break-word', overflowWrap: 'break-word' }}\n                                onClick={() => {\n                                    setSelectedPdf(url);\n                                    setVisible(true);\n                                }}\n                            >\n                                {fileName}\n                            </p>\n                        </div>\n                    );\n                }\n\n                // **Render Excel Files**\n                if (mimeType.includes(\"excel\") || mimeType.includes(\"spreadsheet\")) {\n                    return (\n                        <div key={index} className='flex align-items-end gap-2 my-2'>\n                            <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\">\n                                <svg fill=\"#45B058\" height=\"36px\" width=\"36px\" version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"> <g> <g> <g> <path d=\"M447.168,134.56c-0.535-1.288-1.318-2.459-2.304-3.445l-128-128c-2.003-1.988-4.709-3.107-7.531-3.115H74.667 C68.776,0,64,4.776,64,10.667v490.667C64,507.224,68.776,512,74.667,512h362.667c5.891,0,10.667-4.776,10.667-10.667V138.667 C447.997,137.256,447.714,135.86,447.168,134.56z M320,36.416L411.584,128H320V36.416z M426.667,490.667H85.333V21.333h213.333 v117.333c0,5.891,4.776,10.667,10.667,10.667h117.333V490.667z\"></path> <path d=\"M128,181.333v256c0,5.891,4.776,10.667,10.667,10.667h234.667c5.891,0,10.667-4.776,10.667-10.667v-256 c0-5.891-4.776-10.667-10.667-10.667H138.667C132.776,170.667,128,175.442,128,181.333z M320,192h42.667v42.667H320V192z M320,256h42.667v42.667H320V256z M320,320h42.667v42.667H320V320z M320,384h42.667v42.667H320V384z M213.333,192h85.333v42.667 h-85.333V192z M213.333,256h85.333v42.667h-85.333V256z M213.333,320h85.333v42.667h-85.333V320z M213.333,384h85.333v42.667 h-85.333V384z M149.333,192H192v42.667h-42.667V192z M149.333,256H192v42.667h-42.667V256z M149.333,320H192v42.667h-42.667V320z M149.333,384H192v42.667h-42.667V384z\"></path> </g> </g> </g> </g></svg>\n                            </a>\n                            <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\"\n                                className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>\n                                <p className=\"text-sm mb-1\" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>\n                                    {fileName}\n                                </p>\n                                <span className='pi pi-cloud-download'></span>\n                            </a>\n                        </div>\n                    );\n                }\n\n                // **Render Other Files**\n                return (\n                    <div key={index} className='flex align-items-end gap-2 my-2'>\n                        <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\">\n                            <svg width=\"36px\" height=\"36px\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"#722ED1\" stroke=\"#722ED1\" strokeWidth=\"0.00024000000000000003\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"><path d=\"M3 23h18V6.709L15.29 1H3zM15 2h.2L20 6.8V7h-5zM4 2h10v6h6v14H4z\"></path><path fill=\"none\" d=\"M0 0h24v24H0z\"></path></g></svg>\n                        </a>\n                        <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\"\n                            className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>\n                            <p className=\"text-sm mb-1\" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>\n                                {fileName}\n                            </p>\n                            <span className='pi pi-cloud-download'></span>\n                        </a>\n                    </div>\n                );\n\n            })}\n\n            {/* PDF Dialog */}\n            <Dialog header=\"PDF Preview\" visible={visible} style={{ width: \"\" }} onHide={() => setVisible(false)} modal>\n                {selectedPdf && (\n                    <Document file={selectedPdf}>\n                        <Page pageNumber={1} />\n                    </Document>\n                )}\n            </Dialog>\n        </div>\n    );\n\n};\n\nexport default SolidMediaMultipleKanbanField;"]}
+{"version":3,"file":"SolidMediaMultipleKanbanField.js","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { SolidKanbanViewFieldsParams } from '../SolidKanbanViewFields';\nimport { Document, Page, pdfjs } from \"react-pdf\";\nimport {\n    SolidDialog,\n    SolidDialogBody,\n    SolidDialogClose,\n    SolidDialogHeader,\n    SolidDialogTitle,\n} from \"../../../shad-cn-ui\";\n\npdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;\n\n\nconst SolidMediaMultipleKanbanField = ({ solidKanbanViewMetaData, fieldMetadata, fieldLayout, data, setLightboxUrls, setOpenLightbox }: SolidKanbanViewFieldsParams) => {\n    // const filterable = column.attrs.filterable;\n    const [visible, setVisible] = useState(false);\n    const header = fieldMetadata.displayName;\n    // const fileData = data && data._media[fieldMetadata.name].length > 0 && data._media[fieldMetadata.name].map((i: any) => {\n    //     const fileData = { mimeType: i.mimeType, url: i._full_url }\n    //     return fileData\n    // }\n    // );\n    const [selectedPdf, setSelectedPdf] = useState(null);\n    const mediaFiles = data?._media?.[fieldMetadata.name] || [];\n\n    const firstImage = mediaFiles.find((file: any) => file.mimeType.includes(\"image/\"));\n\n    // **Get all image URLs for the lightbox**\n    const allImageUrls = mediaFiles\n        .filter((file: any) => file.mimeType.includes(\"image/\"))\n        .map((file: any) => ({ src: file._full_url }));\n\n\n    return (\n        <div className={`${fieldLayout?.attrs?.className ? ` ${fieldLayout.attrs.className}` : \"\"}`}>\n            {firstImage && (\n                <div className='my-2'>\n                    <img\n                        className={fieldLayout?.attrs?.kanbanImagePreviewClassname ? fieldLayout?.attrs?.kanbanImagePreviewClassname : 'kanban-image-preview'}\n                        src={firstImage._full_url}\n                        onClick={(event) => {\n                            event.stopPropagation();\n                            setLightboxUrls(allImageUrls);\n                            setOpenLightbox(true);\n                        }}\n                        alt={firstImage.originalFileName}\n                    />\n                    {fieldLayout?.attrs?.showLabel !== false &&\n\n                        <p className=\"text-sm\"\n                            style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}\n                            onClick={(event) => {\n                                event.stopPropagation();\n                                setLightboxUrls(allImageUrls);\n                                setOpenLightbox(true);\n                            }}\n                        >\n                            {firstImage.originalFileName}\n                        </p>\n                    }\n                </div>\n            )}\n\n            {mediaFiles.map((file: any, index: number) => {\n                const { _full_url: url, mimeType, originalFileName: fileName } = file;\n                if (mimeType.includes(\"image/\")) return null;\n\n                // **Render PDFs**\n                if (mimeType.includes(\"pdf\")) {\n                    return (\n                        <div key={index} className='flex align-items-end gap-2 my-2'>\n                            <div\n                                onClick={() => {\n                                    setSelectedPdf(url);\n                                    setVisible(true);\n                                }}\n                                style={{ cursor: 'pointer' }}\n                            >\n                                <svg width=\"36px\" height=\"36px\" viewBox=\"-4 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#000000\" strokeWidth=\"0.0004\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"> <path d=\"M25.6686 26.0962C25.1812 26.2401 24.4656 26.2563 23.6984 26.145C22.875 26.0256 22.0351 25.7739 21.2096 25.403C22.6817 25.1888 23.8237 25.2548 24.8005 25.6009C25.0319 25.6829 25.412 25.9021 25.6686 26.0962ZM17.4552 24.7459C17.3953 24.7622 17.3363 24.7776 17.2776 24.7939C16.8815 24.9017 16.4961 25.0069 16.1247 25.1005L15.6239 25.2275C14.6165 25.4824 13.5865 25.7428 12.5692 26.0529C12.9558 25.1206 13.315 24.178 13.6667 23.2564C13.9271 22.5742 14.193 21.8773 14.468 21.1894C14.6075 21.4198 14.7531 21.6503 14.9046 21.8814C15.5948 22.9326 16.4624 23.9045 17.4552 24.7459ZM14.8927 14.2326C14.958 15.383 14.7098 16.4897 14.3457 17.5514C13.8972 16.2386 13.6882 14.7889 14.2489 13.6185C14.3927 13.3185 14.5105 13.1581 14.5869 13.0744C14.7049 13.2566 14.8601 13.6642 14.8927 14.2326ZM9.63347 28.8054C9.38148 29.2562 9.12426 29.6782 8.86063 30.0767C8.22442 31.0355 7.18393 32.0621 6.64941 32.0621C6.59681 32.0621 6.53316 32.0536 6.44015 31.9554C6.38028 31.8926 6.37069 31.8476 6.37359 31.7862C6.39161 31.4337 6.85867 30.8059 7.53527 30.2238C8.14939 29.6957 8.84352 29.2262 9.63347 28.8054ZM27.3706 26.1461C27.2889 24.9719 25.3123 24.2186 25.2928 24.2116C24.5287 23.9407 23.6986 23.8091 22.7552 23.8091C21.7453 23.8091 20.6565 23.9552 19.2582 24.2819C18.014 23.3999 16.9392 22.2957 16.1362 21.0733C15.7816 20.5332 15.4628 19.9941 15.1849 19.4675C15.8633 17.8454 16.4742 16.1013 16.3632 14.1479C16.2737 12.5816 15.5674 11.5295 14.6069 11.5295C13.948 11.5295 13.3807 12.0175 12.9194 12.9813C12.0965 14.6987 12.3128 16.8962 13.562 19.5184C13.1121 20.5751 12.6941 21.6706 12.2895 22.7311C11.7861 24.0498 11.2674 25.4103 10.6828 26.7045C9.04334 27.3532 7.69648 28.1399 6.57402 29.1057C5.8387 29.7373 4.95223 30.7028 4.90163 31.7107C4.87693 32.1854 5.03969 32.6207 5.37044 32.9695C5.72183 33.3398 6.16329 33.5348 6.6487 33.5354C8.25189 33.5354 9.79489 31.3327 10.0876 30.8909C10.6767 30.0029 11.2281 29.0124 11.7684 27.8699C13.1292 27.3781 14.5794 27.011 15.985 26.6562L16.4884 26.5283C16.8668 26.4321 17.2601 26.3257 17.6635 26.2153C18.0904 26.0999 18.5296 25.9802 18.976 25.8665C20.4193 26.7844 21.9714 27.3831 23.4851 27.6028C24.7601 27.7883 25.8924 27.6807 26.6589 27.2811C27.3486 26.9219 27.3866 26.3676 27.3706 26.1461ZM30.4755 36.2428C30.4755 38.3932 28.5802 38.5258 28.1978 38.5301H3.74486C1.60224 38.5301 1.47322 36.6218 1.46913 36.2428L1.46884 3.75642C1.46884 1.6039 3.36763 1.4734 3.74457 1.46908H20.263L20.2718 1.4778V7.92396C20.2718 9.21763 21.0539 11.6669 24.0158 11.6669H30.4203L30.4753 11.7218L30.4755 36.2428ZM28.9572 10.1976H24.0169C21.8749 10.1976 21.7453 8.29969 21.7424 7.92417V2.95307L28.9572 10.1976ZM31.9447 36.2428V11.1157L21.7424 0.871022V0.823357H21.6936L20.8742 0H3.74491C2.44954 0 0 0.785336 0 3.75711V36.2435C0 37.5427 0.782956 40 3.74491 40H28.2001C29.4952 39.9997 31.9447 39.2143 31.9447 36.2428Z\" fill=\"#EB5757\"></path> </g></svg>\n                            </div>\n                            <p className=\"text-sm\"\n                                style={{ maxWidth: '70%', wordWrap: 'break-word', overflowWrap: 'break-word' }}\n                                onClick={() => {\n                                    setSelectedPdf(url);\n                                    setVisible(true);\n                                }}\n                            >\n                                {fileName}\n                            </p>\n                        </div>\n                    );\n                }\n\n                // **Render Excel Files**\n                if (mimeType.includes(\"excel\") || mimeType.includes(\"spreadsheet\")) {\n                    return (\n                        <div key={index} className='flex align-items-end gap-2 my-2'>\n                            <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\">\n                                <svg fill=\"#45B058\" height=\"36px\" width=\"36px\" version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"> <g> <g> <g> <path d=\"M447.168,134.56c-0.535-1.288-1.318-2.459-2.304-3.445l-128-128c-2.003-1.988-4.709-3.107-7.531-3.115H74.667 C68.776,0,64,4.776,64,10.667v490.667C64,507.224,68.776,512,74.667,512h362.667c5.891,0,10.667-4.776,10.667-10.667V138.667 C447.997,137.256,447.714,135.86,447.168,134.56z M320,36.416L411.584,128H320V36.416z M426.667,490.667H85.333V21.333h213.333 v117.333c0,5.891,4.776,10.667,10.667,10.667h117.333V490.667z\"></path> <path d=\"M128,181.333v256c0,5.891,4.776,10.667,10.667,10.667h234.667c5.891,0,10.667-4.776,10.667-10.667v-256 c0-5.891-4.776-10.667-10.667-10.667H138.667C132.776,170.667,128,175.442,128,181.333z M320,192h42.667v42.667H320V192z M320,256h42.667v42.667H320V256z M320,320h42.667v42.667H320V320z M320,384h42.667v42.667H320V384z M213.333,192h85.333v42.667 h-85.333V192z M213.333,256h85.333v42.667h-85.333V256z M213.333,320h85.333v42.667h-85.333V320z M213.333,384h85.333v42.667 h-85.333V384z M149.333,192H192v42.667h-42.667V192z M149.333,256H192v42.667h-42.667V256z M149.333,320H192v42.667h-42.667V320z M149.333,384H192v42.667h-42.667V384z\"></path> </g> </g> </g> </g></svg>\n                            </a>\n                            <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\"\n                                className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>\n                                <p className=\"text-sm mb-1\" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>\n                                    {fileName}\n                                </p>\n                                <span className='pi pi-cloud-download'></span>\n                            </a>\n                        </div>\n                    );\n                }\n\n                // **Render Other Files**\n                return (\n                    <div key={index} className='flex align-items-end gap-2 my-2'>\n                        <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\">\n                            <svg width=\"36px\" height=\"36px\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"#722ED1\" stroke=\"#722ED1\" strokeWidth=\"0.00024000000000000003\"><g id=\"SVGRepo_bgCarrier\" strokeWidth=\"0\"></g><g id=\"SVGRepo_tracerCarrier\" strokeLinecap=\"round\" strokeLinejoin=\"round\"></g><g id=\"SVGRepo_iconCarrier\"><path d=\"M3 23h18V6.709L15.29 1H3zM15 2h.2L20 6.8V7h-5zM4 2h10v6h6v14H4z\"></path><path fill=\"none\" d=\"M0 0h24v24H0z\"></path></g></svg>\n                        </a>\n                        <a href={url} download target=\"_blank\" rel=\"noopener noreferrer\"\n                            className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>\n                            <p className=\"text-sm mb-1\" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>\n                                {fileName}\n                            </p>\n                            <span className='pi pi-cloud-download'></span>\n                        </a>\n                    </div>\n                );\n\n            })}\n\n            {/* PDF Dialog */}\n            <SolidDialog open={visible} onOpenChange={setVisible} className=\"solid-kanban-preview-dialog\">\n                <SolidDialogHeader className=\"solid-kanban-preview-dialog-header\">\n                    <SolidDialogTitle>PDF Preview</SolidDialogTitle>\n                    <SolidDialogClose />\n                </SolidDialogHeader>\n                <SolidDialogBody className=\"solid-kanban-preview-dialog-body\">\n                    {selectedPdf && (\n                        <Document file={selectedPdf}>\n                            <Page pageNumber={1} />\n                        </Document>\n                    )}\n                </SolidDialogBody>\n            </SolidDialog>\n        </div>\n    );\n\n};\n\nexport default SolidMediaMultipleKanbanField;\n"]}

package/dist/components/core/kanban/kanban-fields/SolidMediaMultipleKanbanField.tsx

@@ -1,9 +1,14 @@
 
 import React, { useState } from 'react';
-import { Column } from "primereact/column";
 import { SolidKanbanViewFieldsParams } from '../SolidKanbanViewFields';
-import { Dialog } from 'primereact/dialog';
 import { Document, Page, pdfjs } from "react-pdf";
+import {
+    SolidDialog,
+    SolidDialogBody,
+    SolidDialogClose,
+    SolidDialogHeader,
+    SolidDialogTitle,
+} from "../../../shad-cn-ui";
 
 pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
 
@@ -125,16 +130,22 @@ const SolidMediaMultipleKanbanField = ({ solidKanbanViewMetaData, fieldMetadata,
             })}
 
             {/* PDF Dialog */}
-            <Dialog header="PDF Preview" visible={visible} style={{ width: "" }} onHide={() => setVisible(false)} modal>
-                {selectedPdf && (
-                    <Document file={selectedPdf}>
-                        <Page pageNumber={1} />
-                    </Document>
-                )}
-            </Dialog>
+            <SolidDialog open={visible} onOpenChange={setVisible} className="solid-kanban-preview-dialog">
+                <SolidDialogHeader className="solid-kanban-preview-dialog-header">
+                    <SolidDialogTitle>PDF Preview</SolidDialogTitle>
+                    <SolidDialogClose />
+                </SolidDialogHeader>
+                <SolidDialogBody className="solid-kanban-preview-dialog-body">
+                    {selectedPdf && (
+                        <Document file={selectedPdf}>
+                            <Page pageNumber={1} />
+                        </Document>
+                    )}
+                </SolidDialogBody>
+            </SolidDialog>
         </div>
     );
 
 };
 
-export default SolidMediaMultipleKanbanField;
+export default SolidMediaMultipleKanbanField;

package/dist/components/core/kanban/kanban-fields/SolidMediaSingleKanbanField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaSingleKanbanField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaSingleKanbanField.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAevE,QAAA,MAAM,2BAA2B,oGAAqG,2BAA2B,4CA8IhK,CAAC;AAEF,eAAe,2BAA2B,CAAC"}
+{"version":3,"file":"SolidMediaSingleKanbanField.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/kanban/kanban-fields/SolidMediaSingleKanbanField.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAmBvE,QAAA,MAAM,2BAA2B,oGAAqG,2BAA2B,4CAoJhK,CAAC;AAEF,eAAe,2BAA2B,CAAC"}