@next-bricks/advanced 0.34.0 → 0.34.2

package/dist/chunks/eo-workbench-layout.1b54829b.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"chunks/eo-workbench-layout.1b54829b.js","mappings":"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","sources":["webpack:///./src/workbench-layout/index.tsx","webpack:///./src/workbench-layout/styles.shadow.css","webpack:///../../node_modules/@babel/runtime/helpers/esm/classPrivateGetter.js","webpack:///../../node_modules/@babel/runtime/helpers/esm/classPrivateMethodInitSpec.js"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { EventEmitter, createDecorators } from \"@next-core/element\";\nimport { ReactNextElement, wrapBrick } from \"@next-core/react-element\";\nimport { UseSingleBrickConf } from \"@next-core/types\";\nimport { ReactUseBrick } from \"@next-core/react-runtime\";\nimport {\n  ItemCallback,\n  Layout,\n  Responsive,\n  WidthProvider,\n} from \"react-grid-layout\";\nimport \"@next-core/theme\";\nimport styleText from \"./styles.shadow.css\";\nimport type {\n  GeneralIcon,\n  GeneralIconProps,\n} from \"@next-bricks/icons/general-icon\";\nimport type { Button, ButtonProps } from \"@next-bricks/basic/button\";\nimport type {\n  Checkbox,\n  CheckboxOptionType,\n  CheckboxProps,\n} from \"@next-bricks/form/checkbox\";\n\nconst { defineElement, property, event } = createDecorators();\n\ntype Item = {\n  position: Layout;\n  key: string;\n  title: string;\n  style?: React.CSSProperties;\n  useBrick: UseSingleBrickConf;\n};\n\ninterface CheckboxEvents {\n  change: CustomEvent<CheckboxOptionType[]>;\n}\n\ninterface CheckboxEventsMap {\n  onChange: \"change\";\n}\n\nconst WrappedButton = wrapBrick<Button, ButtonProps>(\"eo-button\");\nconst WrappedIcon = wrapBrick<GeneralIcon, GeneralIconProps>(\"eo-icon\");\nconst WrappedCheckbox = wrapBrick<\n  Checkbox,\n  CheckboxProps,\n  CheckboxEvents,\n  CheckboxEventsMap\n>(\"eo-checkbox\", {\n  onChange: \"change\",\n});\n\n/**\n * 工作台布局\n */\nexport\n@defineElement(\"eo-workbench-layout\", {\n  styleTexts: [styleText],\n})\nclass EoWorkbenchLayout extends ReactNextElement {\n  @property()\n  accessor cardTitle: string | undefined;\n\n  @property({\n    type: Boolean,\n  })\n  accessor isEdit: boolean | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor layouts: Layout[] | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor componentList: Item[] | undefined;\n\n  @event({\n    type: \"save\",\n  })\n  accessor #saveLayoutEvent!: EventEmitter<Layout[]>;\n\n  #handleSaveLayout = (layout: Layout[]) => {\n    this.#saveLayoutEvent.emit(layout);\n  };\n\n  @event({\n    type: \"cancel\",\n  })\n  accessor #cancelEvent!: EventEmitter<void>;\n\n  #handleCancel = () => {\n    this.#cancelEvent.emit();\n  };\n\n  render() {\n    return (\n      <EoWorkbenchLayoutComponent\n        cardTitle={this.cardTitle}\n        layouts={this.layouts}\n        componentList={this.componentList}\n        isEdit={this.isEdit}\n        onSave={this.#handleSaveLayout}\n        onCancel={this.#handleCancel}\n      />\n    );\n  }\n}\n\nexport interface EoWorkbenchLayoutProps {\n  cardTitle?: string;\n  layouts?: Layout[];\n  componentList?: Item[];\n  isEdit?: boolean;\n  onSave?: (layout: Layout[]) => void;\n  onCancel?: () => void;\n}\n\nconst getRealKey = (key: string): string =>\n  key?.includes(\":\") ? key.split(\":\")[0] : key;\n\nexport function EoWorkbenchLayoutComponent({\n  cardTitle = \"卡片列表\",\n  layouts: layoutsProps,\n  componentList = [],\n  isEdit,\n  onSave,\n  onCancel,\n}: EoWorkbenchLayoutProps) {\n  const ResponsiveReactGridLayout = useMemo(\n    () => WidthProvider(Responsive),\n    []\n  );\n  const gridLayoutRef = useRef<HTMLDivElement>(null);\n  const layoutCacheRef = useRef<Layout[]>();\n  const layoutWarpperRef = useRef<HTMLDivElement>(null);\n\n  const [layouts, setLayouts] = useState<Layout[]>(layoutsProps ?? []);\n  const [cols, setCols] = useState<number>(3);\n  const [layoutWrapperStyle, setLayoutWrapperStyle] =\n    useState<React.CSSProperties>();\n\n  const handleDragCallback: ItemCallback = (layout, oldItem, newItem) => {\n    const placeholderDOM = gridLayoutRef.current?.querySelector(\n      \".react-grid-placeholder\"\n    );\n    if (placeholderDOM) {\n      if (newItem.w > 1 && newItem.x > 0) {\n        !placeholderDOM.classList.contains(\"forbidden\") &&\n          placeholderDOM.classList.add(\"forbidden\");\n      } else {\n        placeholderDOM.classList.contains(\"forbidden\") &&\n          placeholderDOM.classList.remove(\"forbidden\");\n      }\n    }\n  };\n\n  const handleLayoutChange = useCallback((currentLayout: Layout[]) => {\n    if (!layoutCacheRef.current) {\n      layoutCacheRef.current = currentLayout;\n    }\n    let isAllowAction = true;\n    for (let t = 0; t < currentLayout.length; t++) {\n      const { x, w, y, h, i, minH } = currentLayout[t];\n      if (w > 1 && x > 0) {\n        isAllowAction = false;\n        break;\n      }\n      if (w === 1 && x < 2) {\n        const matchItem = currentLayout.find(\n          (item) => item.i !== i && item.w === 1 && item.y === y && x < 2\n        );\n        if (matchItem) {\n          currentLayout[t].minH = currentLayout[t].minH ?? h;\n          currentLayout[t].h = Math.max(matchItem.h, h);\n        }\n      } else {\n        currentLayout[t].h = minH ?? h;\n        currentLayout[t].minH = undefined;\n      }\n    }\n    if (!isAllowAction) {\n      setLayouts(\n        (items) =>\n          items?.map((item) => {\n            const matchLayout = layoutCacheRef.current?.find(\n              (layout) => getRealKey(layout.i) === getRealKey(item.i)\n            );\n            // should update key to refresh layout\n            const key = `${getRealKey(item.i)}:${Math.random()}`;\n            return {\n              ...matchLayout,\n              i: key,\n            } as Layout;\n          })\n      );\n      return;\n    }\n\n    layoutCacheRef.current = currentLayout;\n  }, []);\n\n  const handleBreakpointChange = (_newBreakpoint: string, newCols: number) => {\n    setCols(newCols);\n  };\n\n  const handleCheckBoxChange = useCallback(\n    (event: CustomEvent<CheckboxOptionType[]>): void => {\n      const checkedKeys = event.detail.map((item) => item.value);\n      const layoutsKeys = layouts.map((item) => getRealKey(item.i));\n      const addItems = event.detail\n        .filter((item) => !layoutsKeys.includes(item.key))\n        .map((item) => ({\n          ...item.position,\n          x: item.w > 1 ? 0 : (layouts.length * 2) % cols,\n          y: Infinity,\n        }));\n\n      setLayouts((layouts) => {\n        return layouts\n          .filter((layout) => checkedKeys.includes(getRealKey(layout.i)))\n          .concat(addItems);\n      });\n    },\n    [layouts, cols]\n  );\n\n  const handleClearLayout = () => {\n    setLayouts([]);\n  };\n\n  const handleSave = useCallback(() => {\n    onSave?.(\n      (layoutCacheRef.current ?? []).map((item) => ({\n        ...item,\n        i: getRealKey(item.i),\n      }))\n    );\n  }, [onSave]);\n\n  const handleCancel = () => {\n    onCancel?.();\n  };\n\n  const handleDeleteItem = useCallback(\n    (e: React.MouseEvent, deteleItem: Item) => {\n      e.stopPropagation();\n      setLayouts(\n        layoutCacheRef.current?.filter(\n          (item) => getRealKey(item.i) !== deteleItem.key\n        ) ?? []\n      );\n    },\n    []\n  );\n\n  const handleEditMaskClcik = (e: React.MouseEvent) => {\n    e.preventDefault();\n  };\n\n  const renderChild = useMemo(\n    () =>\n      layouts\n        .map((layout) => {\n          const component = componentList.find(\n            (item) => item.key === getRealKey(layout.i)\n          );\n          if (!component) {\n            return null;\n          }\n          return (\n            <div\n              key={layout.i}\n              data-grid={{\n                ...(component.position ?? {}),\n                ...layout,\n              }}\n              style={component.style}\n              className=\"drag-box\"\n            >\n              {isEdit && (\n                <div className=\"edit-mask\" onMouseDown={handleEditMaskClcik} />\n              )}\n              <ReactUseBrick useBrick={component.useBrick} />\n              {isEdit && (\n                <WrappedIcon\n                  icon=\"delete\"\n                  lib=\"antd\"\n                  className=\"delete-icon\"\n                  onClick={(e) => handleDeleteItem(e, component)}\n                />\n              )}\n            </div>\n          );\n        })\n        .filter(Boolean),\n    [componentList, handleDeleteItem, layouts, isEdit]\n  );\n\n  const computedOptions = useMemo(\n    () =>\n      componentList.map((item) => ({\n        ...item,\n        label: item.title,\n        value: item.key,\n      })),\n    [componentList]\n  );\n\n  const computedSelectedComponentKeys = useMemo(\n    () => layouts.map((layout) => getRealKey(layout.i)),\n    [layouts]\n  );\n\n  const handleWatchLayoutSizeChange = useCallback(() => {\n    if (layoutWarpperRef && isEdit) {\n      const { top } =\n        layoutWarpperRef.current?.getClientRects()?.[0] ?? ({} as DOMRect);\n      top !== undefined &&\n        setLayoutWrapperStyle({\n          height: document.body.clientHeight - top,\n          overflow: \"scroll\",\n        });\n    }\n  }, [isEdit]);\n\n  useEffect(() => {\n    if (isEdit) {\n      handleWatchLayoutSizeChange();\n      window.addEventListener(\"resize\", handleWatchLayoutSizeChange);\n\n      return () => {\n        window.removeEventListener(\"resize\", handleWatchLayoutSizeChange);\n      };\n    }\n  }, [isEdit, handleWatchLayoutSizeChange]);\n\n  return (\n    <div className=\"grid-layout-wrapper\" ref={gridLayoutRef}>\n      {isEdit && (\n        <div className=\"component-wrapper\">\n          <div className=\"component-title\">{cardTitle}</div>\n          <div className=\"component-list\">\n            <WrappedCheckbox\n              options={computedOptions}\n              value={computedSelectedComponentKeys}\n              onChange={handleCheckBoxChange as any}\n            />\n            <slot name=\"toolbar\"></slot>\n          </div>\n        </div>\n      )}\n      <div\n        className=\"layout-wrapper\"\n        ref={layoutWarpperRef}\n        style={layoutWrapperStyle}\n      >\n        {isEdit && (\n          <div className=\"actions-wrapper\">\n            <WrappedButton type=\"primary\" onClick={handleSave}>\n              保存\n            </WrappedButton>\n            <WrappedButton danger={true} onClick={handleClearLayout}>\n              清除\n            </WrappedButton>\n            <WrappedButton onClick={handleCancel}>取消</WrappedButton>\n          </div>\n        )}\n        <ResponsiveReactGridLayout\n          className=\"layout\"\n          draggableCancel=\".delete-icon,.edit-actions,.ingore-item\"\n          breakpoints={{ lg: 1300, md: 1024, sm: 768 }}\n          rowHeight={1}\n          cols={{ lg: 3, md: 3, sm: 1 }}\n          isResizable={false}\n          isDraggable={isEdit}\n          onDrag={handleDragCallback}\n          onLayoutChange={handleLayoutChange}\n          onBreakpointChange={handleBreakpointChange}\n        >\n          {renderChild}\n        </ResponsiveReactGridLayout>\n      </div>\n    </div>\n  );\n}\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nimport ___CSS_LOADER_AT_RULE_IMPORT_0___ from \"-!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[0]!../../../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../../../../node_modules/react-grid-layout/css/styles.css\";\nimport ___CSS_LOADER_AT_RULE_IMPORT_1___ from \"-!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[0]!../../../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../../../../node_modules/react-resizable/css/styles.css\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);\n___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_1___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:block}:host([hidden]){display:none}.grid-layout-wrapper{display:flex;height:100%;position:relative}.grid-layout-wrapper .component-wrapper{width:150px;padding:6px 12px;overflow-y:scroll;box-shadow:1px 0 0 0 var(--palette-gray-5);background:var(--color-fill-bg-container-1);z-index:999;position:sticky;top:0}.grid-layout-wrapper .component-wrapper .component-title{font-size:16px;padding:6px 0;font-weight:500}.grid-layout-wrapper .component-wrapper .component-list{margin-top:6px}.grid-layout-wrapper .component-wrapper .component-list eo-checkbox::part(checkbox-wrapper){display:flex;flex-wrap:wrap;gap:8px}.grid-layout-wrapper .component-wrapper .component-list eo-checkbox::part(checkbox-option){margin-left:0;width:100%;background:none}.grid-layout-wrapper .layout-wrapper{flex:1}.grid-layout-wrapper .layout-wrapper .layout{max-width:1300px;margin:0 auto}.grid-layout-wrapper .layout-wrapper .actions-wrapper{position:sticky;top:0;z-index:999;margin-left:1px;display:flex;gap:8px;justify-content:end;background:var(--color-fill-bg-container-1);padding:8px 12px;box-shadow:0 1px 1px 0 var(--palette-gray-5)}.grid-layout-wrapper .layout-wrapper .edit-mask{position:absolute;left:0;right:0;top:45px;bottom:0;z-index:10}.grid-layout-wrapper .layout-wrapper .delete-icon{position:absolute;right:15px;top:15px;cursor:pointer;font-size:16px;width:30px;height:30px;display:flex;justify-content:center;align-items:center;background:var(--color-fill-bg-container-1);color:var(--color-normal-text)}.grid-layout-wrapper .layout-wrapper .delete-icon:hover{color:var(--color-error)}.grid-layout-wrapper .layout-wrapper .delete-icon:active{color:var(--color-error-active)}.react-grid-item.react-grid-placeholder{background-color:#ddd}.react-grid-item.react-draggable-dragging{pointer-events:none}.react-grid-item.react-grid-placeholder.forbidden{background-color:red}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n","import assertClassBrand from \"./assertClassBrand.js\";\nexport default function _classPrivateGetter(s, r, a) {\n  return a(assertClassBrand(s, r));\n}","import checkPrivateRedeclaration from \"./checkPrivateRedeclaration.js\";\nexport default function _classPrivateMethodInitSpec(obj, privateSet) {\n  checkPrivateRedeclaration(obj, privateSet);\n  privateSet.add(obj);\n}"],"names":["defineElement","property","event","createDecorators","WrappedButton","wrapBrick","WrappedIcon","WrappedCheckbox","onChange","_EoWorkbenchLayout","_A","WeakMap","_B","_C","_D","_E","_EoWorkbenchLayout_brand","WeakSet","_handleSaveLayout","_F","_handleCancel","EoWorkbenchLayout","ReactNextElement","constructor","arguments","_classPrivateMethodInitSpec","_classPrivateFieldInitSpec","_init_cardTitle","_init_extra_cardTitle","_init_isEdit","_init_extra_isEdit","_init_layouts","_init_extra_layouts","_init_componentList","_init_extra_componentList","_init_saveLayoutEvent","_init_extra_saveLayoutEvent","layout","_classPrivateGetter","this","_get_saveLayoutEvent","emit","_init_cancelEvent","_init_extra_cancelEvent","_get_cancelEvent","cardTitle","_classPrivateFieldGet","v","_classPrivateFieldSet","isEdit","layouts","componentList","render","React","EoWorkbenchLayoutComponent","onSave","onCancel","_EoWorkbenchLayout2","e","_set_saveLayoutEvent","_set_cancelEvent","c","_initClass","_applyDecs","styleTexts","styleText","type","Boolean","attribute","o","_","has","_checkInRHS","getRealKey","key","includes","split","_ref","layoutsProps","ResponsiveReactGridLayout","useMemo","WidthProvider","Responsive","gridLayoutRef","useRef","layoutCacheRef","layoutWarpperRef","setLayouts","useState","cols","setCols","layoutWrapperStyle","setLayoutWrapperStyle","handleLayoutChange","useCallback","currentLayout","current","isAllowAction","t","length","x","w","y","h","i","minH","matchItem","find","item","Math","max","undefined","items","map","_layoutCacheRef$curre","random","handleCheckBoxChange","checkedKeys","detail","value","layoutsKeys","addItems","filter","position","Infinity","concat","handleSave","handleDeleteItem","deteleItem","_layoutCacheRef$curre2","stopPropagation","handleEditMaskClcik","preventDefault","renderChild","component","style","className","onMouseDown","ReactUseBrick","useBrick","icon","lib","onClick","computedOptions","label","title","computedSelectedComponentKeys","handleWatchLayoutSizeChange","_layoutWarpperRef$cur","top","getClientRects","height","document","body","clientHeight","overflow","useEffect","window","addEventListener","removeEventListener","ref","options","name","danger","handleClearLayout","handleCancel","draggableCancel","breakpoints","lg","md","sm","rowHeight","isResizable","isDraggable","onDrag","handleDragCallback","oldItem","newItem","_gridLayoutRef$curren","placeholderDOM","querySelector","classList","contains","add","remove","onLayoutChange","onBreakpointChange","handleBreakpointChange","_newBreakpoint","newCols","___CSS_LOADER_EXPORT___","push","module","id","toString","s","r","a","obj","privateSet"],"sourceRoot":""}