{"version":3,"file":"DashboardCardGrid.mjs","names":["v4","uuid","React","useCallback","useRef","useState","useEffect","Responsive","ResponsiveGridLayout","makeStyles","useTheme","useMeasure","useDragLayer","getWidgetLayout","useShellStore","useStyle","theme","root","display","flexDirection","width","flexGrow","marginBottom","props","disableMargin","spacing","autoHeightContainer","height","flexWrap","gap","position","top","left","transform","name","DASHBOARD_WIDGET","Symbol","breakpoints","xs","xl","breakpointCols","DashboardCardGrid","classes","children","onCreateCard","gridProperties","autoHeight","other","getWidget","rglRef","ref","droppingWidgetType","monitor","getItemType","id","wigetType","getItem","droppingItemLayout","setDroppingItemLayout","isMounted","resolveLayout","widgetDefPromise","module","widgetDef","default","layout","i","e","console","error","fallbackLayout","res","then","drag","oldLayoutItem","layoutItem","placeholder","resize","w","drop","item","x","y","h","breakpoint","current","state","widgetType","params","isDroppable","isDraggable","applyWidgetTransformStyling"],"sources":["../../src/dashboard/DashboardCardGrid.jsx"],"sourcesContent":["import { v4 as uuid } from 'uuid';\nimport React, { useCallback, useRef, useState, useEffect } from 'react';\nimport { Responsive as ResponsiveGridLayout } from 'react-grid-layout';\nimport { makeStyles, useTheme } from '@material-ui/core';\nimport { useMeasure } from 'react-use';\nimport 'react-grid-layout/css/styles.css';\nimport 'react-resizable/css/styles.css';\nimport { useDragLayer } from 'react-dnd';\nimport getWidgetLayout from './getWidgetLayout.ts';\nimport { useShellStore } from '../stores/shellStore';\n\nconst useStyle = makeStyles(\n  (theme) => ({\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      width: '100%',\n      flexGrow: 1,\n      marginBottom: (props) => (props?.disableMargin ? '' : theme.spacing(3))\n    },\n    autoHeightContainer: {\n      height: 'auto !important',\n      display: 'flex',\n      flexWrap: 'wrap',\n      gap: `${theme.spacing(3)}px ${theme.spacing(3)}px`,\n      '& > .react-grid-item': {\n        position: 'relative !important',\n        top: 'auto !important',\n        left: 'auto !important',\n        transform: 'none !important',\n        height: 'auto !important'\n      }\n    }\n  }),\n  { name: 'DashboardCardGrid' }\n);\n\nconst DASHBOARD_WIDGET = Symbol('DASHBOARD_WIDGET');\n\nconst breakpoints = {\n  xs: 0,\n  xl: 1150\n};\n\nconst breakpointCols = {\n  xs: 4,\n  xl: 4\n};\n\n/**\n * Grid layout for dashboard cards\n */\nconst DashboardCardGrid = (props) => {\n  const classes = useStyle(props);\n  const { children, onCreateCard, gridProperties, autoHeight, ...other } =\n    props;\n  const { getWidget } = useShellStore();\n  const rglRef = useRef();\n  const [ref, { width }] = useMeasure();\n  const theme = useTheme();\n  const { droppingWidgetType } = useDragLayer((monitor) => {\n    if (monitor.getItemType() === DASHBOARD_WIDGET) {\n      const { id: wigetType } = monitor.getItem();\n      return { droppingWidgetType: wigetType };\n    }\n\n    return { droppingWidgetType: null };\n  });\n\n  const [droppingItemLayout, setDroppingItemLayout] = useState(null);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    // Asynchronously resolve the widget definition to get its layout properties\n    const resolveLayout = async (widgetDefPromise) => {\n      try {\n        const module = await widgetDefPromise;\n        // Handle ES modules with default exports\n        const widgetDef = module?.default || module;\n        // Use the external layout getter, assuming it can handle the resolved definition\n        const layout = getWidgetLayout(widgetDef);\n        if (isMounted) {\n          setDroppingItemLayout({ i: uuid(), ...layout });\n        }\n      } catch (e) {\n        console.error(\n          `Error resolving layout for widget type \"${droppingWidgetType}\"`,\n          e\n        );\n        // Fallback to a default layout on error\n        const fallbackLayout = getWidgetLayout(null);\n        if (isMounted) {\n          setDroppingItemLayout({ i: uuid(), ...fallbackLayout });\n        }\n      }\n    };\n\n    if (droppingWidgetType) {\n      const res = getWidget(droppingWidgetType);\n      // Check if the result is a promise (for async widgets)\n      if (res?.then) {\n        setDroppingItemLayout(null); // Clear previous layout while loading\n        resolveLayout(res);\n      } else {\n        // Handle synchronously available widget definitions\n        const layout = getWidgetLayout(res);\n        setDroppingItemLayout({ i: uuid(), ...layout });\n      }\n    } else {\n      setDroppingItemLayout(null);\n    }\n\n    return () => {\n      isMounted = false;\n    };\n  }, [droppingWidgetType, getWidget]);\n\n  const drag = useCallback((layout, oldLayoutItem, layoutItem, placeholder) => {\n    // Cards larger than 1 should snap to columns that are a multiple of 2\n    // if (layoutItem.w > 1) {\n    //   // @fixme This affects the visual placeholder, but doesn't actually fix the layout item when its dropped\n    //   placeholder.x = layoutItem.x = Math.floor(layoutItem.x / 2) * 2;\n    // }\n  }, []);\n\n  const resize = useCallback(\n    (layout, oldLayoutItem, layoutItem, placeholder) => {\n      // Widths larger than 1 should be a multiple of 2\n      // The small size of columns is just so we can have small 1x1 tiles that are 1/2 the size of normal cards\n      // if (layoutItem.w > 1) {\n      //   const w = Math.floor(layoutItem.w / 2) * 3;\n      //   layoutItem.w = w;\n      //   placeholder.w = w;\n      // }\n\n      // There is no 3 (i.e. 6) column layout so don't allow cards to be that size either\n      if (layoutItem.w >= 6 && layoutItem.w < 8) {\n        layoutItem.w = 4;\n        placeholder.w = 4;\n      }\n    },\n    []\n  );\n\n  const drop = useCallback(\n    (layout, item) => {\n      if (droppingWidgetType) {\n        const { x, y, w, h } = item;\n        const { breakpoint } = rglRef.current.state;\n        if (onCreateCard)\n          onCreateCard({\n            widgetType: droppingWidgetType,\n            id: uuid(),\n            layout: {\n              [breakpoint]: {\n                x,\n                y,\n                w,\n                h\n              }\n            },\n            params: []\n          });\n      }\n    },\n    [droppingWidgetType, onCreateCard]\n  );\n\n  return (\n    <div ref={ref} className={classes.root}>\n      {width ? (\n        <ResponsiveGridLayout\n          ref={rglRef}\n          {...other}\n          width={width}\n          breakpoints={breakpoints}\n          cols={breakpointCols}\n          rowHeight={128}\n          margin={[theme.spacing(3), theme.spacing(3)]}\n          containerPadding={[0, 0]}\n          draggableHandle='[data-handle]'\n          onDrag={drag}\n          onResize={resize}\n          onDrop={drop}\n          isDroppable={gridProperties?.isDroppable || false}\n          isDraggable={gridProperties?.isDraggable || false}\n          droppingItem={droppingItemLayout}\n          className={autoHeight ? classes.autoHeightContainer : ''}\n          style={\n            autoHeight\n              ? {}\n              : {\n                  height: '100%'\n                }\n          }\n          useCSSTransforms={children[0]?.props?.params?.applyWidgetTransformStyling ?? true}\n        >\n          {children}\n        </ResponsiveGridLayout>\n      ) : null}\n    </div>\n  );\n};\n\nexport default DashboardCardGrid;\n"],"mappings":"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"}