@riil-frontend/component-topology 6.0.0-alpha.9 → 6.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/1.js +2 -2
- package/build/2.js +1 -1
- package/build/index.css +1 -1
- package/build/index.js +35 -35
- package/demo/CHANGELOG/CHANGELOG.md +5 -0
- package/es/components/ColorPanel/components/ColorBlock/index.js +37 -0
- package/es/components/ColorPanel/components/ColorBlock/index.module.scss +9 -0
- package/es/components/ColorPanel/components/FontColorRange/index.js +35 -0
- package/es/components/ColorPanel/components/FontColorRange/index.module.scss +25 -0
- package/es/components/ColorPanel/index.js +260 -0
- package/es/components/ColorPanel/index.module.scss +35 -0
- package/es/components/VerticalIconTab/VerticalIconTab.js +11 -1
- package/es/components/VerticalIconTab/VerticalIconTab.module.scss +2 -0
- package/es/components/collapse/Collapse.js +22 -3
- package/es/components/collapse/Collapse.module.scss +24 -0
- package/es/components/collapse/index.js +2 -0
- package/es/core/common/hooks/useHtElements.js +21 -0
- package/es/core/common/icons/icon.js +40 -0
- package/es/core/common/icons/useIcons.js +5 -19
- package/es/core/components/AlarmListPanel/components/AlarmListItem.js +14 -13
- package/es/core/components/AlarmListPanel/components/index.module.scss +5 -5
- package/es/core/components/DisplaySettingDrawer/DisplaySetting.js +2 -1
- package/es/core/components/DisplaySettingDrawer/DisplaySettingDrawer.js +9 -3
- package/es/core/components/DisplaySettingDrawer/EditorDisplaySetting.js +122 -0
- package/es/core/components/DisplaySettingDrawer/LineExpandAllRadioGroup.js +0 -3
- package/es/core/components/DisplaySettingDrawer/hooks/useDisplaySetting.js +84 -22
- package/es/core/components/TopoView/GraphViewPanel.js +22 -0
- package/es/core/components/TopoView/editor.module.scss +1 -0
- package/es/core/components/TopoView/topoView.js +30 -60
- package/es/core/components/titlebar/TitleBar.module.scss +1 -1
- package/es/core/editor/components/EditorPlugin.js +18 -2
- package/es/core/editor/components/Sidebar/Sidebar.js +29 -7
- package/es/core/editor/components/Sidebar/panes.js +10 -5
- package/es/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.js +11 -30
- package/es/core/editor/components/Sidebar/views/CanvasPanel/hooks/useCanvasThemeConfig.js +109 -0
- package/es/core/editor/components/Sidebar/views/CanvasPanel/hooks/useUpdateHtTopoDefaultTagStyle.js +27 -0
- package/es/core/editor/components/Sidebar/views/CanvasPanel/utils/elementThemeUtil.js +0 -0
- package/es/core/editor/components/Sidebar/views/ImagePanel/CiTypeImagePanel.js +3 -3
- package/es/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +12 -1
- package/es/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.js +12 -1
- package/es/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.module.scss +3 -3
- package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +27 -8
- package/es/core/editor/components/Toolbar/buttons.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/AddResourceButton.js +1 -1
- package/es/core/editor/components/Toolbar/widgets/BoxBackgroundButton/BoxBackgroundButton.js +3 -3
- package/es/core/editor/components/Toolbar/widgets/EdgeColorButton/Content.js +46 -2
- package/es/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js +98 -6
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +59 -25
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +3 -5
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/constants.js +77 -0
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +52 -5
- package/es/core/editor/components/Toolbar/widgets/FontColorButton.js +166 -16
- package/es/core/editor/components/Toolbar/widgets/FontColorButton.module.scss +42 -0
- package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +26 -12
- package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js +37 -12
- package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js +92 -39
- package/es/core/editor/components/Toolbar/widgets/IconSelect/index.module.scss +4 -2
- package/es/core/editor/components/Toolbar/widgets/IconSelect/popUpContent.js +1 -2
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutSettings.js +99 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutSettings.module.scss +70 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagImageSelect/index.js +42 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagImageSelect/index.module.scss +7 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagSelect/index.js +75 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagSelect/index.scss +32 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/Icon.js +23 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/index.js +10 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_circular.svg +10 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_hierarchical.svg +10 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_rectangle.svg +12 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_toward.svg +16 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/index.js +31 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/index.module.scss +53 -0
- package/es/core/editor/components/Toolbar/widgets/Layout/index.js +130 -15
- package/es/core/editor/components/Toolbar/widgets/NodeAlignWidget.js +107 -23
- package/es/core/editor/components/Toolbar/widgets/NodeAlignWidget.module.scss +33 -0
- package/es/core/editor/components/Toolbar/widgets/NodeImageButton/BoxBackgroundSetting.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/NodeImageButton/NodeImageButton.js +20 -7
- package/es/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +40 -35
- package/es/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.module.scss +28 -0
- package/es/core/editor/components/Toolbar/widgets/WidgetBox.js +10 -4
- package/es/core/editor/components/Toolbar/widgets/WidgetBox.module.scss +10 -1
- package/es/core/editor/components/Toolbar/widgets/components/ButtonBox.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/components/ButtonBox.module.scss +4 -0
- package/es/core/editor/components/Toolbar/widgets/components/DropdownButton.js +19 -8
- package/es/core/editor/components/Toolbar/widgets/components/DropdownMenu.js +21 -7
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js +52 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/colorUtil.js +67 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/box.js +41 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/edgeTag.js +65 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/groupTitle.js +65 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/index.js +14 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/layerTitle.js +73 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/nodeTag.js +69 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/text.js +37 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js +124 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/GlobalTagStyleSetting.js +31 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/globalTag.js +98 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/textStyleSettingRouter.js +20 -0
- package/es/core/editor/components/plugins/AddElementThemePlugin.js +11 -0
- package/es/core/editor/components/settings/CloseablePanel.js +33 -0
- package/es/core/editor/components/settings/CloseablePanel.module.scss +21 -0
- package/es/core/editor/components/settings/PropertyView.js +50 -11
- package/es/core/editor/components/settings/Settings.js +37 -122
- package/es/core/editor/components/settings/Settings.module.scss +7 -11
- package/es/core/editor/components/settings/common/AlignSetting/AlignSetting.module.scss +3 -3
- package/es/core/editor/components/settings/common/AlignSetting/AlignTypeList.js +80 -0
- package/es/core/editor/components/settings/common/AlignSetting/index.js +20 -72
- package/es/core/editor/components/settings/common/GroupNodeList/ResourceList.module.scss +1 -0
- package/es/core/editor/components/settings/common/LineType/index.js +11 -102
- package/es/core/editor/components/settings/common/NameInput.js +24 -0
- package/es/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +21 -18
- package/es/core/editor/components/settings/common/text/fontStyleUtil.js +21 -19
- package/es/core/editor/components/settings/core/PropertyViewManager.js +81 -0
- package/es/core/editor/components/settings/core/edgePropertyViewAdapter.js +22 -0
- package/es/core/editor/components/settings/core/getPropertyViewType.js +34 -0
- package/es/core/editor/components/settings/core/updateElementProperty.js +21 -0
- package/es/core/editor/components/settings/propertyViews/box/BoxPropertyView.js +6 -13
- package/es/core/editor/components/settings/propertyViews/box/BoxPropertyViewV1.js +58 -0
- package/es/core/editor/components/settings/propertyViews/box/NameInput.js +5 -4
- package/es/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js +12 -3
- package/es/core/editor/components/settings/propertyViews/edge/EdgeGroupPropertyView.js +7 -8
- package/es/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js +9 -23
- package/es/core/editor/components/settings/propertyViews/edge/addEdgeProps.js +10 -0
- package/es/core/editor/components/settings/propertyViews/edge/edgeGroup/EdgeGroupSetting.js +1 -6
- package/es/core/editor/components/settings/propertyViews/group/GroupPropertyView.js +13 -21
- package/es/core/editor/components/settings/propertyViews/group/GroupPropertyView.module.scss +8 -1
- package/es/core/editor/components/settings/propertyViews/group/GroupPropertyViewV1.js +28 -0
- package/es/core/editor/components/settings/propertyViews/group/SettingTab/GroupBasicSetting.js +75 -0
- package/es/core/editor/components/settings/propertyViews/group/SettingTab/GroupExpandSetting.js +9 -15
- package/es/core/editor/components/settings/propertyViews/group/cluster/ClusterGroupRelateData.js +8 -6
- package/es/core/editor/components/settings/propertyViews/index.js +4 -6
- package/es/core/editor/components/settings/propertyViews/layer/BasicSetting.js +57 -0
- package/es/core/editor/components/settings/propertyViews/layer/LayerPropertyView.js +11 -17
- package/es/core/editor/components/settings/propertyViews/layer/LayerPropertyView.module.scss +10 -0
- package/es/core/editor/components/settings/propertyViews/layer/LayerPropertyViewV1.js +27 -0
- package/es/core/editor/components/settings/propertyViews/multipleElements/MultipleElementLineType.js +5 -7
- package/es/core/editor/components/settings/propertyViews/multipleElements/MultipleElementPropertyView.js +2 -15
- package/es/core/editor/components/settings/propertyViews/node/NodePropertyView.js +8 -32
- package/es/core/editor/components/settings/propertyViews/node/NodePropertyViewV1.js +53 -0
- package/es/core/editor/components/settings/propertyViews/node/Setting/BasicSetting.js +49 -0
- package/es/core/editor/components/settings/propertyViews/node/Setting/NameInput.js +5 -4
- package/es/core/editor/components/settings/propertyViews/node/data/Data.js +2 -1
- package/es/core/editor/components/settings/propertyViews/node/data/NodeRelateResourceButton.js +1 -0
- package/es/core/editor/components/settings/propertyViews/text/TextPropertyView.js +5 -20
- package/es/core/editor/components/titlebar/TopoEditorTitleBar.js +8 -4
- package/es/core/editor/config/themes.js +105 -0
- package/es/core/editor/hooks/useKeyboardShortcut.js +39 -0
- package/es/core/editor/hooks/useNewElementTheme.js +46 -0
- package/es/core/editor/store/topoEdit.js +44 -37
- package/es/core/editor/utils/edgeTypeStyleUtil.js +34 -11
- package/es/core/editor/utils/textStyleUtil.js +0 -0
- package/es/core/editor/utils/themeUtil.js +32 -0
- package/es/core/hooks/useCanvasTheme.js +54 -0
- package/es/core/hooks/useManageStatus.js +1 -9
- package/es/core/hooks/usePolling.js +2 -5
- package/es/core/hooks/useTopoEdit.js +15 -8
- package/es/core/models/Alarm.js +2 -2
- package/es/core/models/AttributeMetricDisplay.js +4 -0
- package/es/core/models/HistoryManager.js +13 -8
- package/es/core/models/{SelectionManager.js → SelectionModel.js} +55 -22
- package/es/core/models/TopoApp.js +6 -5
- package/es/core/models/selection/ignoreList.js +1 -0
- package/es/core/models/utils/linkUtils.js +5 -6
- package/es/core/store/models/customIcon.js +1 -3
- package/es/core/store/models/selection.js +2 -1
- package/es/core/store/models/topoBizMod.js +0 -3
- package/es/core/store/models/topoConfig.js +10 -12
- package/es/core/store/models/topoMod.js +26 -28
- package/es/core/utils/edgeUtil.js +6 -0
- package/es/core/utils/showGraphManageStatusUtil.js +7 -1
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +18 -13
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +38 -19
- package/es/core/viewer/components/plugins/ResourceDetail/components/WebConsole/WebConsoleForm/WebConsoleForm.js +13 -29
- package/es/core/viewer/components/plugins/ResourceDetail/components/WebConsole/WebConsoleForm/hooks/useWebConsole.js +6 -5
- package/es/core/viewer/components/plugins/ViewerPlugin.js +10 -4
- package/es/core/viewer/components/titlebar/widgets/SettingButton.js +3 -1
- package/es/core/viewer/components/titlebar/widgets/SettingButtonWidget.js +4 -2
- package/es/networkTopo/components/editor/propertyViews/edge/EdgeGroupPropertyView.js +2 -1
- package/es/networkTopo/components/editor/propertyViews/edge/EdgePropertyView.js +39 -6
- package/es/networkTopo/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyView.js +10 -16
- package/es/networkTopo/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyViewV1.js +37 -0
- package/es/networkTopo/components/editor/propertyViews/edge/link/LinkInfoPreview.module.scss +1 -1
- package/es/networkTopo/components/editor/useEditorProps.js +1 -3
- package/es/networkTopo/createTopo.js +2 -0
- package/es/networkTopo/models/LinkDynamicStyleExecutor.js +2 -2
- package/es/networkTopo/services/link.js +2 -2
- package/es/networkTopo/store/topoTreeMod.js +6 -7
- package/es/style.js +28 -27
- package/es/utils/htElementUtils.js +3 -0
- package/es/utils/topoData.js +1 -0
- package/lib/components/ColorPanel/components/ColorBlock/index.js +47 -0
- package/lib/components/ColorPanel/components/ColorBlock/index.module.scss +9 -0
- package/lib/components/ColorPanel/components/FontColorRange/index.js +49 -0
- package/lib/components/ColorPanel/components/FontColorRange/index.module.scss +25 -0
- package/lib/components/ColorPanel/index.js +279 -0
- package/lib/components/ColorPanel/index.module.scss +35 -0
- package/lib/components/VerticalIconTab/VerticalIconTab.js +14 -1
- package/lib/components/VerticalIconTab/VerticalIconTab.module.scss +2 -0
- package/lib/components/collapse/Collapse.js +28 -3
- package/lib/components/collapse/Collapse.module.scss +24 -0
- package/lib/components/collapse/index.js +11 -0
- package/lib/core/common/hooks/useHtElements.js +27 -0
- package/lib/core/common/icons/icon.js +47 -0
- package/lib/core/common/icons/useIcons.js +7 -18
- package/lib/core/components/AlarmListPanel/components/AlarmListItem.js +14 -13
- package/lib/core/components/AlarmListPanel/components/index.module.scss +5 -5
- package/lib/core/components/DisplaySettingDrawer/DisplaySetting.js +2 -1
- package/lib/core/components/DisplaySettingDrawer/DisplaySettingDrawer.js +10 -3
- package/lib/core/components/DisplaySettingDrawer/EditorDisplaySetting.js +147 -0
- package/lib/core/components/DisplaySettingDrawer/LineExpandAllRadioGroup.js +0 -3
- package/lib/core/components/DisplaySettingDrawer/hooks/useDisplaySetting.js +84 -22
- package/lib/core/components/TopoView/GraphViewPanel.js +32 -0
- package/lib/core/components/TopoView/editor.module.scss +1 -0
- package/lib/core/components/TopoView/topoView.js +36 -67
- package/lib/core/components/titlebar/TitleBar.module.scss +1 -1
- package/lib/core/editor/components/EditorPlugin.js +26 -2
- package/lib/core/editor/components/Sidebar/Sidebar.js +28 -6
- package/lib/core/editor/components/Sidebar/panes.js +10 -5
- package/lib/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.js +12 -31
- package/lib/core/editor/components/Sidebar/views/CanvasPanel/hooks/useCanvasThemeConfig.js +123 -0
- package/lib/core/editor/components/Sidebar/views/CanvasPanel/hooks/useUpdateHtTopoDefaultTagStyle.js +37 -0
- package/lib/core/editor/components/Sidebar/views/CanvasPanel/utils/elementThemeUtil.js +1 -0
- package/lib/core/editor/components/Sidebar/views/ImagePanel/CiTypeImagePanel.js +1 -1
- package/lib/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +13 -1
- package/lib/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.js +13 -1
- package/lib/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.module.scss +3 -3
- package/lib/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +36 -12
- package/lib/core/editor/components/Toolbar/buttons.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/AddResourceButton.js +1 -1
- package/lib/core/editor/components/Toolbar/widgets/BoxBackgroundButton/BoxBackgroundButton.js +3 -3
- package/lib/core/editor/components/Toolbar/widgets/EdgeColorButton/Content.js +48 -2
- package/lib/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js +100 -6
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +58 -24
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +3 -3
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/constants.js +83 -0
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +53 -4
- package/lib/core/editor/components/Toolbar/widgets/FontColorButton.js +172 -16
- package/lib/core/editor/components/Toolbar/widgets/FontColorButton.module.scss +42 -0
- package/lib/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +27 -11
- package/lib/core/editor/components/Toolbar/widgets/FontSizeWidget.js +38 -11
- package/lib/core/editor/components/Toolbar/widgets/FontStyleButton.js +96 -39
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/index.module.scss +4 -2
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/popUpContent.js +1 -2
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutSettings.js +116 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutSettings.module.scss +70 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagImageSelect/index.js +55 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagImageSelect/index.module.scss +7 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagSelect/index.js +93 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTagSelect/index.scss +32 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/Icon.js +32 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/index.js +22 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_circular.svg +10 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_hierarchical.svg +10 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_rectangle.svg +12 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/assets/topo_layout_toward.svg +16 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/index.js +44 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/components/LayoutTemplateButton/index.module.scss +53 -0
- package/lib/core/editor/components/Toolbar/widgets/Layout/index.js +135 -16
- package/lib/core/editor/components/Toolbar/widgets/NodeAlignWidget.js +110 -23
- package/lib/core/editor/components/Toolbar/widgets/NodeAlignWidget.module.scss +33 -0
- package/lib/core/editor/components/Toolbar/widgets/NodeImageButton/BoxBackgroundSetting.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/NodeImageButton/NodeImageButton.js +21 -7
- package/lib/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +40 -34
- package/lib/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.module.scss +28 -0
- package/lib/core/editor/components/Toolbar/widgets/WidgetBox.js +13 -4
- package/lib/core/editor/components/Toolbar/widgets/WidgetBox.module.scss +10 -1
- package/lib/core/editor/components/Toolbar/widgets/components/ButtonBox.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/components/ButtonBox.module.scss +4 -0
- package/lib/core/editor/components/Toolbar/widgets/components/DropdownButton.js +19 -8
- package/lib/core/editor/components/Toolbar/widgets/components/DropdownMenu.js +22 -7
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js +66 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/colorUtil.js +82 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/box.js +58 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/edgeTag.js +86 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/groupTitle.js +88 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/index.js +28 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/layerTitle.js +90 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/nodeTag.js +90 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/text.js +54 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js +141 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/GlobalTagStyleSetting.js +46 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/globalTag.js +111 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/textStyleSettingRouter.js +31 -0
- package/lib/core/editor/components/plugins/AddElementThemePlugin.js +20 -0
- package/lib/core/editor/components/settings/CloseablePanel.js +46 -0
- package/lib/core/editor/components/settings/CloseablePanel.module.scss +21 -0
- package/lib/core/editor/components/settings/PropertyView.js +59 -12
- package/lib/core/editor/components/settings/Settings.js +40 -122
- package/lib/core/editor/components/settings/Settings.module.scss +7 -11
- package/lib/core/editor/components/settings/common/AlignSetting/AlignSetting.module.scss +3 -3
- package/lib/core/editor/components/settings/common/AlignSetting/AlignTypeList.js +97 -0
- package/lib/core/editor/components/settings/common/AlignSetting/index.js +21 -80
- package/lib/core/editor/components/settings/common/GroupNodeList/ResourceList.module.scss +1 -0
- package/lib/core/editor/components/settings/common/LineType/index.js +11 -109
- package/lib/core/editor/components/settings/common/NameInput.js +38 -0
- package/lib/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +21 -19
- package/lib/core/editor/components/settings/common/text/fontStyleUtil.js +25 -20
- package/lib/core/editor/components/settings/core/PropertyViewManager.js +91 -0
- package/lib/core/editor/components/settings/core/edgePropertyViewAdapter.js +33 -0
- package/lib/core/editor/components/settings/core/getPropertyViewType.js +40 -0
- package/lib/core/editor/components/settings/core/updateElementProperty.js +27 -0
- package/lib/core/editor/components/settings/propertyViews/box/BoxPropertyView.js +6 -13
- package/lib/core/editor/components/settings/propertyViews/box/BoxPropertyViewV1.js +76 -0
- package/lib/core/editor/components/settings/propertyViews/box/NameInput.js +6 -5
- package/lib/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js +15 -3
- package/lib/core/editor/components/settings/propertyViews/edge/EdgeGroupPropertyView.js +9 -12
- package/lib/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js +7 -23
- package/lib/core/editor/components/settings/propertyViews/edge/addEdgeProps.js +19 -0
- package/lib/core/editor/components/settings/propertyViews/edge/edgeGroup/EdgeGroupSetting.js +1 -6
- package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyView.js +14 -25
- package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyView.module.scss +8 -1
- package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyViewV1.js +43 -0
- package/lib/core/editor/components/settings/propertyViews/group/SettingTab/GroupBasicSetting.js +98 -0
- package/lib/core/editor/components/settings/propertyViews/group/SettingTab/GroupExpandSetting.js +8 -14
- package/lib/core/editor/components/settings/propertyViews/group/cluster/ClusterGroupRelateData.js +9 -7
- package/lib/core/editor/components/settings/propertyViews/index.js +4 -9
- package/lib/core/editor/components/settings/propertyViews/layer/BasicSetting.js +75 -0
- package/lib/core/editor/components/settings/propertyViews/layer/LayerPropertyView.js +12 -20
- package/lib/core/editor/components/settings/propertyViews/layer/LayerPropertyView.module.scss +10 -0
- package/lib/core/editor/components/settings/propertyViews/layer/LayerPropertyViewV1.js +40 -0
- package/lib/core/editor/components/settings/propertyViews/multipleElements/MultipleElementLineType.js +4 -6
- package/lib/core/editor/components/settings/propertyViews/multipleElements/MultipleElementPropertyView.js +2 -15
- package/lib/core/editor/components/settings/propertyViews/node/NodePropertyView.js +8 -35
- package/lib/core/editor/components/settings/propertyViews/node/NodePropertyViewV1.js +68 -0
- package/lib/core/editor/components/settings/propertyViews/node/Setting/BasicSetting.js +64 -0
- package/lib/core/editor/components/settings/propertyViews/node/Setting/NameInput.js +6 -5
- package/lib/core/editor/components/settings/propertyViews/node/data/Data.js +2 -1
- package/lib/core/editor/components/settings/propertyViews/node/data/NodeRelateResourceButton.js +1 -0
- package/lib/core/editor/components/settings/propertyViews/text/TextPropertyView.js +5 -20
- package/lib/core/editor/components/titlebar/TopoEditorTitleBar.js +9 -1
- package/lib/core/editor/config/themes.js +114 -0
- package/lib/core/editor/hooks/useKeyboardShortcut.js +49 -0
- package/lib/core/editor/hooks/useNewElementTheme.js +57 -0
- package/lib/core/editor/store/topoEdit.js +46 -40
- package/lib/core/editor/utils/edgeTypeStyleUtil.js +38 -11
- package/lib/core/editor/utils/textStyleUtil.js +1 -0
- package/lib/core/editor/utils/themeUtil.js +39 -0
- package/lib/core/hooks/useCanvasTheme.js +68 -0
- package/lib/core/hooks/useManageStatus.js +1 -9
- package/lib/core/hooks/usePolling.js +2 -5
- package/lib/core/hooks/useTopoEdit.js +16 -8
- package/lib/core/models/Alarm.js +2 -2
- package/lib/core/models/AttributeMetricDisplay.js +4 -0
- package/lib/core/models/HistoryManager.js +13 -8
- package/lib/core/models/{SelectionManager.js → SelectionModel.js} +57 -22
- package/lib/core/models/TopoApp.js +7 -5
- package/lib/core/models/selection/ignoreList.js +6 -0
- package/lib/core/models/utils/linkUtils.js +5 -6
- package/lib/core/store/models/customIcon.js +1 -3
- package/lib/core/store/models/selection.js +2 -1
- package/lib/core/store/models/topoBizMod.js +0 -3
- package/lib/core/store/models/topoConfig.js +9 -18
- package/lib/core/store/models/topoMod.js +27 -29
- package/lib/core/utils/edgeUtil.js +6 -0
- package/lib/core/utils/showGraphManageStatusUtil.js +7 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +18 -13
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +38 -19
- package/lib/core/viewer/components/plugins/ResourceDetail/components/WebConsole/WebConsoleForm/WebConsoleForm.js +13 -29
- package/lib/core/viewer/components/plugins/ResourceDetail/components/WebConsole/WebConsoleForm/hooks/useWebConsole.js +6 -5
- package/lib/core/viewer/components/plugins/ViewerPlugin.js +11 -3
- package/lib/core/viewer/components/titlebar/widgets/SettingButton.js +3 -1
- package/lib/core/viewer/components/titlebar/widgets/SettingButtonWidget.js +4 -2
- package/lib/networkTopo/components/editor/propertyViews/edge/EdgeGroupPropertyView.js +1 -0
- package/lib/networkTopo/components/editor/propertyViews/edge/EdgePropertyView.js +45 -7
- package/lib/networkTopo/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyView.js +10 -18
- package/lib/networkTopo/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyViewV1.js +50 -0
- package/lib/networkTopo/components/editor/propertyViews/edge/link/LinkInfoPreview.module.scss +1 -1
- package/lib/networkTopo/components/editor/useEditorProps.js +1 -4
- package/lib/networkTopo/createTopo.js +3 -0
- package/lib/networkTopo/models/LinkDynamicStyleExecutor.js +2 -2
- package/lib/networkTopo/services/link.js +2 -2
- package/lib/networkTopo/store/topoTreeMod.js +6 -8
- package/lib/style.js +28 -27
- package/lib/utils/htElementUtils.js +5 -0
- package/lib/utils/topoData.js +1 -0
- package/package.json +5 -4
@@ -0,0 +1,73 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import fontStyleUtil from "../../../../../../settings/common/text/fontStyleUtil";
|
3
|
+
import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../colorUtil";
|
4
|
+
var defaultStyle = {
|
5
|
+
color: '#4D6277',
|
6
|
+
font: '10px 微软雅黑',
|
7
|
+
background: '#E4E9EE'
|
8
|
+
};
|
9
|
+
|
10
|
+
function getLabelStyle(element) {
|
11
|
+
var background = element.s('layer.label.background');
|
12
|
+
|
13
|
+
if (background === undefined) {
|
14
|
+
background = defaultStyle.background;
|
15
|
+
}
|
16
|
+
|
17
|
+
return {
|
18
|
+
color: element.s('layer.label.color') || defaultStyle.color,
|
19
|
+
font: element.s('layer.label.font') || defaultStyle.font,
|
20
|
+
background: background
|
21
|
+
};
|
22
|
+
}
|
23
|
+
|
24
|
+
function setLabelStyle(element, style) {
|
25
|
+
var map = {};
|
26
|
+
Object.keys(style).forEach(function (name) {
|
27
|
+
map["layer.label." + name] = style[name];
|
28
|
+
});
|
29
|
+
element.s(map);
|
30
|
+
} // 分层标题文字样式
|
31
|
+
|
32
|
+
|
33
|
+
export function getTextStyle(element) {
|
34
|
+
var style = getLabelStyle(element);
|
35
|
+
var underline = null;
|
36
|
+
return _extends({
|
37
|
+
color: parseColor(style.color),
|
38
|
+
underline: underline
|
39
|
+
}, fontStyleUtil.toMap(style.font), parseBackground(style.background));
|
40
|
+
}
|
41
|
+
export function setTextStyle(element, style) {
|
42
|
+
// if ('underline' in style) {
|
43
|
+
// }
|
44
|
+
var labelStyle = {};
|
45
|
+
|
46
|
+
if ('color' in style) {
|
47
|
+
labelStyle.color = style.color.hex;
|
48
|
+
} // 背景颜色
|
49
|
+
|
50
|
+
|
51
|
+
var prevStyle = getTextStyle(element);
|
52
|
+
labelStyle.background = formatBackgroundRgbaColor(prevStyle, style);
|
53
|
+
|
54
|
+
var fontStyle = _extends({}, getTextStyle(element), style);
|
55
|
+
|
56
|
+
var fontStr = fontStyleUtil.build(fontStyle);
|
57
|
+
labelStyle.font = fontStr;
|
58
|
+
setLabelStyle(element, labelStyle);
|
59
|
+
}
|
60
|
+
/**
|
61
|
+
*
|
62
|
+
* @param {*} element
|
63
|
+
* @returns {Array}
|
64
|
+
*/
|
65
|
+
|
66
|
+
export function getEnabledFields(element) {
|
67
|
+
return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
|
68
|
+
}
|
69
|
+
export default {
|
70
|
+
getTextStyle: getTextStyle,
|
71
|
+
setTextStyle: setTextStyle,
|
72
|
+
getEnabledFields: getEnabledFields
|
73
|
+
};
|
@@ -0,0 +1,69 @@
|
|
1
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
3
|
+
var _excluded = ["color", "background", "opacity", "bold", "italic"];
|
4
|
+
import fontStyleUtil from "../../../../../../settings/common/text/fontStyleUtil";
|
5
|
+
import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../colorUtil";
|
6
|
+
export function getTextStyle(element) {
|
7
|
+
var underline = null;
|
8
|
+
return _extends({
|
9
|
+
color: parseColor(element.a('ht.color')),
|
10
|
+
underline: underline
|
11
|
+
}, fontStyleUtil.toMap(element.a('ht.font')), parseBackground(element.a('ht.background')));
|
12
|
+
}
|
13
|
+
export function setTextStyle(element, style, topo) {
|
14
|
+
var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(style),
|
15
|
+
color = _fontStyleUtil$remove.color,
|
16
|
+
background = _fontStyleUtil$remove.background,
|
17
|
+
opacity = _fontStyleUtil$remove.opacity,
|
18
|
+
bold = _fontStyleUtil$remove.bold,
|
19
|
+
italic = _fontStyleUtil$remove.italic,
|
20
|
+
otherStyle = _objectWithoutPropertiesLoose(_fontStyleUtil$remove, _excluded);
|
21
|
+
|
22
|
+
var tagStyle = _extends({}, otherStyle);
|
23
|
+
|
24
|
+
if ('color' in style) {
|
25
|
+
tagStyle.color = color.hex;
|
26
|
+
}
|
27
|
+
|
28
|
+
if ('bold' in style) {
|
29
|
+
tagStyle.fontBold = bold;
|
30
|
+
}
|
31
|
+
|
32
|
+
if ('italic' in style) {
|
33
|
+
tagStyle.fontItalic = italic;
|
34
|
+
}
|
35
|
+
|
36
|
+
if ('background' in style || 'opacity' in style) {
|
37
|
+
// 背景颜色
|
38
|
+
var prevStyle = getTextStyle(element);
|
39
|
+
tagStyle.background = formatBackgroundRgbaColor(prevStyle, style);
|
40
|
+
}
|
41
|
+
|
42
|
+
if (Object.keys(tagStyle).length) {
|
43
|
+
topo.getHtTopo().setNodeLabelStyle(element, tagStyle);
|
44
|
+
}
|
45
|
+
}
|
46
|
+
export function getEnabledFields(element) {
|
47
|
+
return ['fontFamily', 'color', 'background', 'opacity'];
|
48
|
+
}
|
49
|
+
/**
|
50
|
+
* 获得字段是否禁用
|
51
|
+
*
|
52
|
+
* @param {*} element
|
53
|
+
* @returns
|
54
|
+
*/
|
55
|
+
|
56
|
+
export function getFieldDisabled(element) {
|
57
|
+
return {
|
58
|
+
fontSize: true,
|
59
|
+
bold: true,
|
60
|
+
italic: true,
|
61
|
+
underline: true
|
62
|
+
};
|
63
|
+
}
|
64
|
+
export default {
|
65
|
+
getTextStyle: getTextStyle,
|
66
|
+
setTextStyle: setTextStyle,
|
67
|
+
getEnabledFields: getEnabledFields,
|
68
|
+
getFieldDisabled: getFieldDisabled
|
69
|
+
};
|
@@ -0,0 +1,37 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import fontStyleUtil from "../../../../../../settings/common/text/fontStyleUtil";
|
3
|
+
import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../colorUtil";
|
4
|
+
export function getTextStyle(element) {
|
5
|
+
var underline = element.s('text.decoration') === 'underline';
|
6
|
+
return _extends({
|
7
|
+
color: parseColor(element.s('text.color')),
|
8
|
+
underline: underline
|
9
|
+
}, fontStyleUtil.toMap(element.s('text.font')), parseBackground(element.s('textBackground')));
|
10
|
+
}
|
11
|
+
export function setTextStyle(element, style) {
|
12
|
+
if ('underline' in style) {
|
13
|
+
element.s('text.decoration', style.underline ? 'underline' : null);
|
14
|
+
}
|
15
|
+
|
16
|
+
if ('color' in style) {
|
17
|
+
element.s('text.color', style.color.hex);
|
18
|
+
} // 背景颜色
|
19
|
+
|
20
|
+
|
21
|
+
var prevStyle = getTextStyle(element);
|
22
|
+
var background = formatBackgroundRgbaColor(prevStyle, style);
|
23
|
+
element.s('textBackground', background);
|
24
|
+
|
25
|
+
var fontStyle = _extends({}, getTextStyle(element), style);
|
26
|
+
|
27
|
+
var fontStr = fontStyleUtil.build(fontStyle);
|
28
|
+
element.s('text.font', fontStr);
|
29
|
+
}
|
30
|
+
export function getEnabledFields(element) {
|
31
|
+
return ['fontFamily', 'fontSize', 'bold', 'italic', 'underline', 'color', 'background', 'opacity'];
|
32
|
+
}
|
33
|
+
export default {
|
34
|
+
getTextStyle: getTextStyle,
|
35
|
+
setTextStyle: setTextStyle,
|
36
|
+
getEnabledFields: getEnabledFields
|
37
|
+
};
|
@@ -0,0 +1,124 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import { isGroup, isLayer, isNode, isText, isEdge } from "../../../../../../../../utils/htElementUtils";
|
3
|
+
import typeMap from "./elements";
|
4
|
+
|
5
|
+
function getElementType(element) {
|
6
|
+
if (isText(element)) {
|
7
|
+
return 'text';
|
8
|
+
} else if (element.a('type') === 'box') {
|
9
|
+
return 'box';
|
10
|
+
} else if (isGroup(element)) {
|
11
|
+
return 'groupTitle';
|
12
|
+
} else if (isNode(element)) {
|
13
|
+
return 'nodeTag';
|
14
|
+
} else if (isEdge(element)) {
|
15
|
+
return 'edgeTag';
|
16
|
+
} else if (isLayer(element)) {
|
17
|
+
return 'layerTitle';
|
18
|
+
}
|
19
|
+
|
20
|
+
return null;
|
21
|
+
}
|
22
|
+
|
23
|
+
export function getElementTextStyle(element) {
|
24
|
+
var type = getElementType(element);
|
25
|
+
var handler = typeMap[type];
|
26
|
+
|
27
|
+
if (handler) {
|
28
|
+
return handler.getTextStyle(element);
|
29
|
+
}
|
30
|
+
|
31
|
+
return null;
|
32
|
+
}
|
33
|
+
export function getElementTextStyleFieldDisabled(element) {
|
34
|
+
var type = getElementType(element);
|
35
|
+
var handler = typeMap[type];
|
36
|
+
|
37
|
+
if (handler) {
|
38
|
+
if (handler.getFieldDisabled) {
|
39
|
+
return handler.getFieldDisabled(element) || {};
|
40
|
+
}
|
41
|
+
|
42
|
+
return {};
|
43
|
+
}
|
44
|
+
|
45
|
+
return null;
|
46
|
+
}
|
47
|
+
export function getElementTextStyleEnabledFields(element) {
|
48
|
+
var type = getElementType(element);
|
49
|
+
var handler = typeMap[type];
|
50
|
+
|
51
|
+
if (handler && handler.getEnabledFields) {
|
52
|
+
return handler.getEnabledFields(element);
|
53
|
+
}
|
54
|
+
|
55
|
+
return null;
|
56
|
+
}
|
57
|
+
export function getTextStyle(htSelection, styleNames) {
|
58
|
+
var elementValues = [];
|
59
|
+
var elementEnabledFieldsMap = {};
|
60
|
+
var enabledFields = [];
|
61
|
+
htSelection.forEach(function (element) {
|
62
|
+
var id = element.getId();
|
63
|
+
var elementTextStyle = getElementTextStyle(element);
|
64
|
+
elementValues.push({
|
65
|
+
id: id,
|
66
|
+
values: elementTextStyle
|
67
|
+
});
|
68
|
+
var elementEnabledFields = getElementTextStyleEnabledFields(element) || [];
|
69
|
+
elementEnabledFieldsMap[id] = elementEnabledFields;
|
70
|
+
enabledFields.push.apply(enabledFields, elementEnabledFields);
|
71
|
+
}); // 多选时值相同返回,排除元素禁用的字段值
|
72
|
+
|
73
|
+
var value = {};
|
74
|
+
styleNames.forEach(function (styleName) {
|
75
|
+
// 查询该字段多元素的值列表,排除元素禁用的字段值
|
76
|
+
var fieldValueList = elementValues.reduce(function (result, item) {
|
77
|
+
// 元素字段是否禁用
|
78
|
+
var disabled = !elementEnabledFieldsMap[item.id].includes(styleName);
|
79
|
+
|
80
|
+
if (!item.values || disabled) {
|
81
|
+
return result;
|
82
|
+
}
|
83
|
+
|
84
|
+
return [].concat(result, [item.values[styleName]]);
|
85
|
+
}, []); // 对比是否一样,如果一样则使用
|
86
|
+
|
87
|
+
var val = fieldValueList[0];
|
88
|
+
var different = fieldValueList.filter(function (item) {
|
89
|
+
return item !== val;
|
90
|
+
});
|
91
|
+
|
92
|
+
if (!different.length) {
|
93
|
+
value[styleName] = val;
|
94
|
+
}
|
95
|
+
});
|
96
|
+
var disabled = true; // 字段如果没有元素启用则禁用
|
97
|
+
|
98
|
+
var fieldDisabled = styleNames.reduce(function (result, fieldName) {
|
99
|
+
var _extends2;
|
100
|
+
|
101
|
+
if (enabledFields.includes(fieldName)) {
|
102
|
+
disabled = false;
|
103
|
+
}
|
104
|
+
|
105
|
+
return _extends({}, result, (_extends2 = {}, _extends2[fieldName] = !enabledFields.includes(fieldName), _extends2));
|
106
|
+
}, {});
|
107
|
+
return {
|
108
|
+
disabled: disabled,
|
109
|
+
style: value,
|
110
|
+
fieldDisabled: fieldDisabled,
|
111
|
+
debugData: {
|
112
|
+
elementValues: elementValues,
|
113
|
+
elementEnabledFieldsMap: elementEnabledFieldsMap
|
114
|
+
}
|
115
|
+
};
|
116
|
+
}
|
117
|
+
export function setTextStyle(element, style, topo) {
|
118
|
+
var type = getElementType(element);
|
119
|
+
var handler = typeMap[type];
|
120
|
+
|
121
|
+
if (handler) {
|
122
|
+
handler.setTextStyle(element, style, topo);
|
123
|
+
}
|
124
|
+
}
|
@@ -0,0 +1,31 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
3
|
+
var _excluded = ["Component"];
|
4
|
+
import React, { useMemo } from 'react';
|
5
|
+
import { setGlobalTagStyle, useValues } from "./globalTag";
|
6
|
+
var fieldDisabled = {
|
7
|
+
fontSize: true
|
8
|
+
};
|
9
|
+
|
10
|
+
function GlobalTagStyleSetting(props) {
|
11
|
+
var topo = props.topo;
|
12
|
+
|
13
|
+
var Component = props.Component,
|
14
|
+
widgetProps = _objectWithoutPropertiesLoose(props, _excluded);
|
15
|
+
|
16
|
+
var values = useValues(topo); // const values = useMemo(() => ({}), [])
|
17
|
+
|
18
|
+
var setStyle = useMemo(function () {
|
19
|
+
return function (style) {
|
20
|
+
return setGlobalTagStyle(topo, style);
|
21
|
+
};
|
22
|
+
}, []);
|
23
|
+
return /*#__PURE__*/React.createElement(Component, _extends({
|
24
|
+
disabled: true,
|
25
|
+
style: values,
|
26
|
+
setStyle: setStyle,
|
27
|
+
fieldDisabled: fieldDisabled
|
28
|
+
}, widgetProps));
|
29
|
+
}
|
30
|
+
|
31
|
+
export default GlobalTagStyleSetting;
|
@@ -0,0 +1,98 @@
|
|
1
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
3
|
+
var _excluded = ["color", "background", "opacity"],
|
4
|
+
_excluded2 = ["color", "background", "opacity", "bold", "italic"];
|
5
|
+
import fontStyleUtil from "../../../../../settings/common/text/fontStyleUtil";
|
6
|
+
import { formatBackgroundRgbaColor, parseBackground, formatRgbaColor } from "../ElementTextStyleSetting/colorUtil";
|
7
|
+
var defaultStyle = {
|
8
|
+
color: '#AFB9C2',
|
9
|
+
fontFamily: '微软雅黑'
|
10
|
+
};
|
11
|
+
export function useValues(topo) {
|
12
|
+
var displayConfigState = topo.store.useModelState('displayConfig');
|
13
|
+
var nodeLabelStyle = displayConfigState.nodeLabelStyle,
|
14
|
+
defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
|
15
|
+
return _extends({
|
16
|
+
color: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.color) || defaultStyle.color,
|
17
|
+
fontFamily: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontFamily) || defaultStyle.fontFamily,
|
18
|
+
fontSize: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontSize
|
19
|
+
}, parseBackground(nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.background));
|
20
|
+
}
|
21
|
+
export var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
|
22
|
+
var _topo$store$getModel = topo.store.getModel('displayConfig'),
|
23
|
+
displayConfigState = _topo$store$getModel[0],
|
24
|
+
displayConfigDispatchers = _topo$store$getModel[1];
|
25
|
+
|
26
|
+
var nodeLabelStyle = displayConfigState.nodeLabelStyle,
|
27
|
+
defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
|
28
|
+
var style = buildStyle(styleData, nodeLabelStyle);
|
29
|
+
|
30
|
+
var globalNodeLabelStyle = _extends({}, nodeLabelStyle, style);
|
31
|
+
|
32
|
+
var globalEdgeTagStyle = _extends({}, nodeLabelStyle, defaultEdgeLabelStyle, style);
|
33
|
+
|
34
|
+
displayConfigDispatchers.update({
|
35
|
+
nodeLabelStyle: globalNodeLabelStyle,
|
36
|
+
defaultEdgeLabelStyle: globalEdgeTagStyle
|
37
|
+
});
|
38
|
+
var styles = buildGlobalStyle(styleData);
|
39
|
+
topo.getHtTopo().setGlobalNodeLabelStyle(styles);
|
40
|
+
topo.getHtTopo().setGlobalEdgeTagStyle(styles);
|
41
|
+
};
|
42
|
+
|
43
|
+
function buildStyle(styleData, prevTagStyle) {
|
44
|
+
var color = styleData.color,
|
45
|
+
background = styleData.background,
|
46
|
+
opacity = styleData.opacity,
|
47
|
+
otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded);
|
48
|
+
|
49
|
+
var style = _extends({}, prevTagStyle, otherStyle);
|
50
|
+
|
51
|
+
if ('color' in styleData) {
|
52
|
+
style.color = color.hex;
|
53
|
+
}
|
54
|
+
|
55
|
+
if ('background' in styleData || 'opacity' in styleData) {
|
56
|
+
var prevBackgroundStyle = parseBackground(prevTagStyle === null || prevTagStyle === void 0 ? void 0 : prevTagStyle.background);
|
57
|
+
style.background = formatBackgroundRgbaColor(prevBackgroundStyle, styleData);
|
58
|
+
}
|
59
|
+
|
60
|
+
return style;
|
61
|
+
}
|
62
|
+
|
63
|
+
function buildGlobalStyle(styleData) {
|
64
|
+
var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(styleData),
|
65
|
+
color = _fontStyleUtil$remove.color,
|
66
|
+
background = _fontStyleUtil$remove.background,
|
67
|
+
opacity = _fontStyleUtil$remove.opacity,
|
68
|
+
bold = _fontStyleUtil$remove.bold,
|
69
|
+
italic = _fontStyleUtil$remove.italic,
|
70
|
+
otherStyle = _objectWithoutPropertiesLoose(_fontStyleUtil$remove, _excluded2);
|
71
|
+
|
72
|
+
var tagStyle = _extends({}, otherStyle);
|
73
|
+
|
74
|
+
if ('color' in styleData) {
|
75
|
+
tagStyle.color = color.hex;
|
76
|
+
}
|
77
|
+
|
78
|
+
if ('bold' in styleData) {
|
79
|
+
tagStyle.fontBold = bold;
|
80
|
+
}
|
81
|
+
|
82
|
+
if ('italic' in styleData) {
|
83
|
+
tagStyle.fontItalic = italic;
|
84
|
+
}
|
85
|
+
|
86
|
+
if ('background' in styleData) {
|
87
|
+
// 背景颜色
|
88
|
+
tagStyle.background = formatRgbaColor(background);
|
89
|
+
}
|
90
|
+
|
91
|
+
if ('opacity' in styleData) {
|
92
|
+
tagStyle.opacity = opacity;
|
93
|
+
}
|
94
|
+
|
95
|
+
return tagStyle;
|
96
|
+
}
|
97
|
+
|
98
|
+
export function setStyle() {}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import React from 'react';
|
3
|
+
import ElementTextStyleSetting from "./ElementTextStyleSetting/ElementTextStyleSetting";
|
4
|
+
import GlobalTagStyleSetting from "./GlobalTagStyleSetting/GlobalTagStyleSetting";
|
5
|
+
|
6
|
+
function textStyleSettingRouter(Component, options) {
|
7
|
+
var names = (options === null || options === void 0 ? void 0 : options.names) || [];
|
8
|
+
return function TextStyleSettingButton(props) {
|
9
|
+
var topo = props.topo;
|
10
|
+
var selection = topo.selectionModel.useHtSelection();
|
11
|
+
var Widget = !selection.length ? GlobalTagStyleSetting : ElementTextStyleSetting;
|
12
|
+
return /*#__PURE__*/React.createElement(Widget, _extends({
|
13
|
+
Component: Component
|
14
|
+
}, props, {
|
15
|
+
styleNames: names
|
16
|
+
}));
|
17
|
+
};
|
18
|
+
}
|
19
|
+
|
20
|
+
export default textStyleSettingRouter;
|
@@ -0,0 +1,33 @@
|
|
1
|
+
import _ConfigProvider from "@alifd/next/es/config-provider";
|
2
|
+
import _Icon from "@alifd/next/es/icon";
|
3
|
+
import React from 'react';
|
4
|
+
import styles from "./CloseablePanel.module.scss";
|
5
|
+
|
6
|
+
function CloseablePanel(props) {
|
7
|
+
var prefix = props.prefix,
|
8
|
+
title = props.title,
|
9
|
+
onClose = props.onClose,
|
10
|
+
children = props.children;
|
11
|
+
return /*#__PURE__*/React.createElement("div", {
|
12
|
+
className: styles.panel
|
13
|
+
}, /*#__PURE__*/React.createElement("div", {
|
14
|
+
className: prefix + "drawer-header",
|
15
|
+
role: "heading",
|
16
|
+
"aria-level": "1"
|
17
|
+
}, title, /*#__PURE__*/React.createElement("a", {
|
18
|
+
role: "button",
|
19
|
+
"aria-label": "\u5173\u95ED",
|
20
|
+
className: prefix + "drawer-close",
|
21
|
+
onClick: onClose
|
22
|
+
}, /*#__PURE__*/React.createElement(_Icon, {
|
23
|
+
type: "close",
|
24
|
+
className: "next-drawer-close-icon"
|
25
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
26
|
+
className: styles.body
|
27
|
+
}, children));
|
28
|
+
}
|
29
|
+
|
30
|
+
CloseablePanel.defaultProps = {
|
31
|
+
prefix: 'next-'
|
32
|
+
};
|
33
|
+
export default _ConfigProvider.config(CloseablePanel);
|
@@ -0,0 +1,21 @@
|
|
1
|
+
@import '~@alifd/next/variables.scss';
|
2
|
+
|
3
|
+
|
4
|
+
.panel {
|
5
|
+
height: 100%;
|
6
|
+
display: flex;
|
7
|
+
flex-direction: column;
|
8
|
+
background: #FFFFFF;
|
9
|
+
|
10
|
+
|
11
|
+
:global {
|
12
|
+
.#{$css-prefix}drawer-header {
|
13
|
+
padding-left: 16px;
|
14
|
+
padding-right: 16px;
|
15
|
+
}
|
16
|
+
}
|
17
|
+
}
|
18
|
+
.body {
|
19
|
+
flex: 1;
|
20
|
+
overflow: auto;
|
21
|
+
}
|
@@ -1,37 +1,76 @@
|
|
1
|
-
import
|
1
|
+
import classNames from 'classnames';
|
2
|
+
import React, { useEffect, useMemo } from 'react';
|
3
|
+
import CloseablePanel from "./CloseablePanel";
|
4
|
+
import { adapterGetEdgePropertyViewType, addEdgePropertyViews } from "./core/edgePropertyViewAdapter";
|
5
|
+
import PropertyViewManager from "./core/PropertyViewManager";
|
2
6
|
import Settings from "./Settings";
|
3
7
|
import styles from "./Settings.module.scss";
|
4
|
-
export default function
|
8
|
+
export default function PropertyPanel(props) {
|
9
|
+
var _classNames;
|
10
|
+
|
5
11
|
var topo = props.topo,
|
6
12
|
editorProps = props.editorProps;
|
7
13
|
var store = topo.store;
|
8
14
|
var topoState = store.useModelState('topoMod');
|
15
|
+
var topoShowType = topoState.type,
|
16
|
+
graphLoaded = topoState.graphLoaded;
|
9
17
|
|
10
18
|
var _store$useModelState = store.useModelState('selection'),
|
11
19
|
selection = _store$useModelState.selection;
|
12
20
|
|
13
|
-
var
|
14
|
-
|
21
|
+
var _topo$store$useModel = topo.store.useModel('topoEdit'),
|
22
|
+
topoEditState = _topo$store$useModel[0],
|
23
|
+
topoEditDispatchers = _topo$store$useModel[1];
|
24
|
+
|
25
|
+
var propertyPanelVisible = topoEditState.propertyPanelVisible;
|
26
|
+
var propertyViewManager = useMemo(function () {
|
27
|
+
return new PropertyViewManager(topo);
|
28
|
+
}, []); // 临时适配连线属性面板类型,后期组件支持自定义适配
|
29
|
+
|
30
|
+
addEdgePropertyViews(propertyViewManager, editorProps);
|
31
|
+
|
32
|
+
propertyViewManager.customGetViewType = editorProps.getPropertyViewType || function (elements) {
|
33
|
+
return adapterGetEdgePropertyViewType(elements, editorProps);
|
34
|
+
};
|
35
|
+
|
36
|
+
var PropertyView = propertyViewManager.getPropertyView();
|
37
|
+
useEffect(function () {
|
38
|
+
if (graphLoaded) {
|
39
|
+
propertyViewManager.init();
|
40
|
+
}
|
41
|
+
|
42
|
+
return function () {
|
43
|
+
propertyViewManager.destroy();
|
44
|
+
};
|
45
|
+
}, [graphLoaded, propertyViewManager]); // 没有视图关闭属性面板
|
15
46
|
|
16
|
-
|
17
|
-
|
18
|
-
|
47
|
+
useEffect(function () {
|
48
|
+
if (propertyPanelVisible && !PropertyView) {
|
49
|
+
propertyViewManager.close();
|
50
|
+
}
|
51
|
+
}, [propertyPanelVisible, PropertyView, propertyViewManager]);
|
19
52
|
|
20
53
|
var renderContent = function renderContent() {
|
21
|
-
if (!
|
54
|
+
if (!propertyPanelVisible || !PropertyView) {
|
22
55
|
return null;
|
23
56
|
}
|
24
57
|
|
25
58
|
return /*#__PURE__*/React.createElement(Settings, {
|
26
59
|
topo: topo,
|
60
|
+
selection: selection,
|
61
|
+
PropertyView: PropertyView,
|
27
62
|
topoShowType: topoShowType,
|
28
63
|
topoEditApi: topo.topoEdit,
|
29
|
-
selection: selection,
|
30
64
|
editorProps: editorProps
|
31
65
|
});
|
32
66
|
};
|
33
67
|
|
34
68
|
return /*#__PURE__*/React.createElement("div", {
|
35
|
-
className: styles.
|
36
|
-
},
|
69
|
+
className: classNames(styles.propertyPanel, (_classNames = {}, _classNames[styles.hide] = !propertyPanelVisible, _classNames))
|
70
|
+
}, /*#__PURE__*/React.createElement(CloseablePanel, {
|
71
|
+
title: "\u6570\u636E\u5C5E\u6027",
|
72
|
+
onClose: function onClose() {
|
73
|
+
propertyViewManager.close();
|
74
|
+
}
|
75
|
+
}, renderContent()));
|
37
76
|
}
|