@labelbee/lb-components 1.10.0-alpha.2 → 1.10.0-alpha.4

package/dist/views/MainView/sidebar/TextToolSidebar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/views/MainView/sidebar/TextToolSidebar/index.tsx"],"sourcesContent":["import React, { useEffect, useState, useRef, FocusEvent } from 'react';\nimport { connect } from 'react-redux';\nimport { AppState } from '@/store';\nimport { cloneDeep } from 'lodash';\nimport { classnames } from '@/utils';\nimport { Input } from 'antd/es';\nimport { cKeyCode } from '@labelbee/lb-annotation';\nimport { PageForward } from '@/store/annotation/actionCreators';\nimport { ConfigUtils } from '@/utils/ConfigUtils';\nimport { IStepInfo } from '@/types/step';\nimport TextToolOperation from '@labelbee/lb-annotation/dist/types/core/toolOperation/TextToolOperation';\nimport { useTranslation } from 'react-i18next';\nimport { LabelBeeContext } from '@/store/ctx';\n\nconst EKeyCode = cKeyCode.default;\n\nconst syntheticEventStopPagination = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n  e.stopPropagation();\n  e.nativeEvent.stopPropagation();\n  e.nativeEvent.stopImmediatePropagation();\n};\n\ninterface ITextareaWithFooterProps {\n  textareaProps?: any;\n  footer?: any;\n}\n\nexport const TextareaWithFooter = (props: ITextareaWithFooterProps) => {\n  const { textareaProps, footer } = props;\n\n  return (\n    <>\n      <Input.TextArea\n        bordered={false}\n        rows={6}\n        onKeyDown={syntheticEventStopPagination}\n        onKeyUp={syntheticEventStopPagination}\n        {...textareaProps}\n      />\n      <div\n        className={classnames({\n          textAreaLength: true,\n        })}\n      >\n        {footer}\n      </div>\n    </>\n  );\n};\n\ninterface IProps {\n  dispatch: Function;\n  toolInstance: TextToolOperation;\n  imgIndex: number;\n  triggerEventAfterIndexChanged: boolean;\n  step: number;\n  stepList: IStepInfo[];\n  basicResultList: any[];\n}\n\ninterface IConfigListItem {\n  label: string;\n  key: string;\n  required: boolean;\n  default: string;\n  maxLength: number;\n}\n\nexport const SingleTextInput = (props: any) => {\n  const ref = useRef(null);\n  const [textAreaFocus, setTextAreaFocus] = useState(false);\n  const [invalid, setInvalid] = useState(false);\n  const { t } = useTranslation();\n\n  const { disabled, config, result, updateText, index, switchToNextTextarea, hasMultiple, onNext } =\n    props;\n  const { maxLength } = config;\n\n  const value = result ? result[config.key] : '';\n  const textLength = value?.length ?? 0;\n\n  const updateTextWithKey = (newVal: string) => {\n    if (updateText) {\n      updateText(newVal, config.key);\n      if (config.required) {\n        setInvalid(!newVal);\n      }\n    }\n  };\n\n  const tabToSwitchEnabled = hasMultiple && switchToNextTextarea;\n\n  const textareaProps = {\n    id: `textInput-${index}`,\n    ref,\n    disabled,\n    value,\n    maxLength,\n    autoSize: { minRows: 2, maxRows: 6 },\n    onChange: (e: FocusEvent<HTMLTextAreaElement>) => {\n      const value = e.target.value;\n      updateTextWithKey(value);\n    },\n    onFocus: () => {\n      setTextAreaFocus(true);\n    },\n    onBlur: (e: FocusEvent<HTMLTextAreaElement>) => {\n      setTextAreaFocus(false);\n      if (config.required) {\n        setInvalid(!e.target.value);\n      }\n    },\n    style: {\n      resize: 'none',\n      wordBreak: 'break-all',\n    },\n    onKeyDownCapture: (e: React.KeyboardEvent) => {\n      if (e.ctrlKey && e.keyCode === EKeyCode.Enter) {\n        if (onNext) {\n          onNext();\n        }\n        e.preventDefault();\n      }\n\n      if (e.keyCode === EKeyCode.Tab && tabToSwitchEnabled) {\n        e.preventDefault();\n        e.nativeEvent.stopImmediatePropagation();\n        switchToNextTextarea(index);\n      }\n\n      e.nativeEvent.stopPropagation();\n    },\n  };\n\n  const TextareaFooter = (\n    <div className='textAreaFooter'>\n      <div className='hotkeyTip'>\n        {tabToSwitchEnabled && <span>{`[${t('Switch')}]Tab`}</span>}\n        <span>{`[${t('TurnPage')}]Ctrl+Enter`}</span>\n      </div>\n      <div className='wordCount'>\n        <span className={textLength >= maxLength ? 'warning' : ''}>{textLength}</span>/\n        <span>{maxLength}</span>\n      </div>\n    </div>\n  );\n\n  useEffect(() => {\n    if (disabled) {\n      setTextAreaFocus(false);\n    }\n  }, [disabled]);\n\n  return (\n    <div className='textField'>\n      <div className='label'>\n        <span className={classnames({ required: config.required })}>{config.label}</span>\n        <i\n          className={classnames({ clearText: true, disabled: disabled })}\n          onClick={() => {\n            if (disabled) {\n              return;\n            }\n            updateTextWithKey('');\n          }}\n        />\n      </div>\n      <div\n        className={classnames({\n          disabled,\n          'textarea-outline': true,\n          'ant-input-focused': textAreaFocus,\n          textareaContainer: true,\n          focus: textAreaFocus,\n          invalid: invalid,\n        })}\n      >\n        <TextareaWithFooter footer={TextareaFooter} textareaProps={textareaProps} />\n      </div>\n    </div>\n  );\n};\n\nconst TextToolSidebar: React.FC<IProps> = ({\n  toolInstance,\n  imgIndex,\n  dispatch,\n  triggerEventAfterIndexChanged,\n  step,\n  stepList,\n  basicResultList,\n}) => {\n  const [configList, setConfigList] = useState<IConfigListItem[]>([]);\n  const [focusIndex, setFocusIndex] = useState(0);\n  const [, forceRender] = useState(0);\n\n  const switchToNextTextarea = (currentIndex: number) => {\n    const nextIndex = (currentIndex + 1) % configList.length;\n    textareaFocus(nextIndex);\n  };\n\n  const textareaFocus = (index: number) => {\n    setTimeout(() => {\n      const textarea = document.getElementById(`textInput-${index}`) as HTMLTextAreaElement;\n      if (textarea) {\n        setFocusIndex(index);\n        textarea.focus();\n        textarea.select();\n        textarea.scrollIntoView({ behavior: 'smooth', block: 'center' });\n      }\n    });\n  };\n\n  useEffect(() => {\n    if (toolInstance) {\n      setConfigList(cloneDeep(toolInstance.config.configList));\n      toolInstance.singleOn('valueUpdated', () => {\n        forceRender((s) => s + 1);\n      });\n    }\n  }, [toolInstance]);\n\n  const updateText = (v: string, k: string) => {\n    toolInstance.updateTextValue(k, v);\n  };\n\n  useEffect(() => {\n    if (imgIndex > -1 && triggerEventAfterIndexChanged) {\n      textareaFocus(0);\n    }\n  }, [imgIndex]);\n\n  const result = toolInstance.textList[0]?.value ?? {};\n\n  const onNext = () => {\n    dispatch(PageForward(true));\n  };\n\n  const stepConfig = ConfigUtils.getStepConfig(stepList, step);\n  const disabled = stepConfig.dataSourceStep > 0 && basicResultList.length === 0;\n\n  return (\n    <div className='textToolOperationMenu'>\n      {configList.map((i, index) => (\n        <SingleTextInput\n          config={i}\n          key={i.key}\n          index={index}\n          result={result}\n          updateText={updateText}\n          switchToNextTextarea={switchToNextTextarea}\n          hasMultiple={configList.length > 1}\n          focus={focusIndex === index}\n          onNext={onNext}\n          disabled={disabled}\n        />\n      ))}\n    </div>\n  );\n};\n\nfunction mapStateToProps(state: AppState) {\n  return {\n    toolInstance: state.annotation.toolInstance,\n    imgIndex: state.annotation.imgIndex,\n    step: state.annotation.step,\n    basicResultList: state.annotation.basicResultList,\n    stepList: state.annotation.stepList,\n    triggerEventAfterIndexChanged: state.annotation.triggerEventAfterIndexChanged,\n  };\n}\n\nexport default connect(mapStateToProps, null, null, { context: LabelBeeContext })(TextToolSidebar);\n"],"names":["cKeyCode","React","Input","classnames","useRef","useState","useTranslation","index","useEffect","cloneDeep","PageForward","ConfigUtils","connect","LabelBeeContext"],"mappings":"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"}

package/dist/views/MainView/sidebar/ToolIcons.js

@@ -1 +1,87 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var ToolType=require("../../../data/enums/ToolType.js"),React=require("react"),index=require("./index.js"),icon_line=require("../../../assets/annotation/lineTool/icon_line.svg.js"),icon_line_a=require("../../../assets/annotation/lineTool/icon_line_a.svg.js"),icon_point=require("../../../assets/annotation/pointTool/icon_point.svg.js"),icon_point_a=require("../../../assets/annotation/pointTool/icon_point_a.svg.js"),icon_polygon_a=require("../../../assets/annotation/polygonTool/icon_polygon_a.svg.js"),icon_polygon=require("../../../assets/annotation/polygonTool/icon_polygon.svg.js"),icon_rect=require("../../../assets/annotation/rectTool/icon_rect.svg.js"),icon_rect_a=require("../../../assets/annotation/rectTool/icon_rect_a.svg.js"),lbAnnotation=require("@labelbee/lb-annotation"),classNames=require("classnames"),reactI18next=require("react-i18next");function _interopDefaultLegacy(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var React__default=_interopDefaultLegacy(React),classNames__default=_interopDefaultLegacy(classNames);const{EPointCloudName,TOOL_NAME,TOOL_NAME_EN}=lbAnnotation.cTool,toolList=[{toolName:ToolType.EToolName.Rect,commonSvg:icon_rect,selectedSvg:icon_rect_a},{toolName:ToolType.EToolName.Polygon,commonSvg:icon_polygon,selectedSvg:icon_polygon_a},{toolName:ToolType.EToolName.Line,commonSvg:icon_line,selectedSvg:icon_line_a},{toolName:ToolType.EToolName.Point,commonSvg:icon_point,selectedSvg:icon_point_a}],getToolNameVersion=o=>o==="en"?TOOL_NAME_EN:TOOL_NAME,ToolIcons=({toolName:o,selectedToolName:l,onChange:n})=>{const{i18n:s}=reactI18next.useTranslation(),a=toolList==null?void 0:toolList.filter(e=>o===EPointCloudName.PointCloud?[ToolType.EToolName.Polygon,ToolType.EToolName.Rect,ToolType.EToolName.Point,ToolType.EToolName.Line].includes(e==null?void 0:e.toolName):(e==null?void 0:e.toolName)===o),i=a.length>1;return React__default.default.createElement("div",{className:`${index.sidebarCls}__level`},a.map(e=>{const t=i&&l===e.toolName;return React__default.default.createElement("span",{className:`${index.sidebarCls}__toolOption`,key:e.toolName,onClick:()=>n==null?void 0:n(e.toolName)},React__default.default.createElement("img",{className:`${index.sidebarCls}__singleTool`,src:t?e==null?void 0:e.selectedSvg:e==null?void 0:e.commonSvg}),React__default.default.createElement("span",{className:classNames__default.default({[`${index.sidebarCls}__toolOption__selected`]:t})},getToolNameVersion(s.language)[e.toolName]))}))};exports.ToolIcons=ToolIcons;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ToolType = require('../../../data/enums/ToolType.js');
+var React = require('react');
+var index = require('./index.js');
+var icon_line = require('../../../assets/annotation/lineTool/icon_line.svg.js');
+var icon_line_a = require('../../../assets/annotation/lineTool/icon_line_a.svg.js');
+var icon_point = require('../../../assets/annotation/pointTool/icon_point.svg.js');
+var icon_point_a = require('../../../assets/annotation/pointTool/icon_point_a.svg.js');
+var icon_polygon_a = require('../../../assets/annotation/polygonTool/icon_polygon_a.svg.js');
+var icon_polygon = require('../../../assets/annotation/polygonTool/icon_polygon.svg.js');
+var icon_rect = require('../../../assets/annotation/rectTool/icon_rect.svg.js');
+var icon_rect_a = require('../../../assets/annotation/rectTool/icon_rect_a.svg.js');
+var lbAnnotation = require('@labelbee/lb-annotation');
+var classNames = require('classnames');
+var reactI18next = require('react-i18next');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
+
+const {EPointCloudName, TOOL_NAME, TOOL_NAME_EN} = lbAnnotation.cTool;
+const toolList = [
+  {
+    toolName: ToolType.EToolName.Rect,
+    commonSvg: icon_rect,
+    selectedSvg: icon_rect_a
+  },
+  {
+    toolName: ToolType.EToolName.Polygon,
+    commonSvg: icon_polygon,
+    selectedSvg: icon_polygon_a
+  },
+  {
+    toolName: ToolType.EToolName.Line,
+    commonSvg: icon_line,
+    selectedSvg: icon_line_a
+  },
+  {
+    toolName: ToolType.EToolName.Point,
+    commonSvg: icon_point,
+    selectedSvg: icon_point_a
+  }
+];
+const getToolNameVersion = (lang) => {
+  if (lang === "en") {
+    return TOOL_NAME_EN;
+  }
+  return TOOL_NAME;
+};
+const ToolIcons = ({
+  toolName,
+  selectedToolName,
+  onChange
+}) => {
+  const {i18n} = reactI18next.useTranslation();
+  const renderTools = toolList == null ? void 0 : toolList.filter((item) => {
+    if (toolName === EPointCloudName.PointCloud) {
+      return [ToolType.EToolName.Polygon, ToolType.EToolName.Rect, ToolType.EToolName.Point, ToolType.EToolName.Line].includes(item == null ? void 0 : item.toolName);
+    }
+    return (item == null ? void 0 : item.toolName) === toolName;
+  });
+  const hasMultiTools = renderTools.length > 1;
+  return /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: `${index.sidebarCls}__level`
+  }, renderTools.map((tool) => {
+    const isSelected = hasMultiTools && selectedToolName === tool.toolName;
+    return /* @__PURE__ */ React__default["default"].createElement("span", {
+      className: `${index.sidebarCls}__toolOption`,
+      key: tool.toolName,
+      onClick: () => onChange == null ? void 0 : onChange(tool.toolName)
+    }, /* @__PURE__ */ React__default["default"].createElement("img", {
+      className: `${index.sidebarCls}__singleTool`,
+      src: isSelected ? tool == null ? void 0 : tool.selectedSvg : tool == null ? void 0 : tool.commonSvg
+    }), /* @__PURE__ */ React__default["default"].createElement("span", {
+      className: classNames__default["default"]({
+        [`${index.sidebarCls}__toolOption__selected`]: isSelected
+      })
+    }, getToolNameVersion(i18n.language)[tool.toolName]));
+  }));
+};
+
+exports.ToolIcons = ToolIcons;
+//# sourceMappingURL=ToolIcons.js.map

package/dist/views/MainView/sidebar/ToolIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolIcons.js","sources":["../../../../src/views/MainView/sidebar/ToolIcons.tsx"],"sourcesContent":["/**\n * @file Tool options on tool's sidebar\n * @author Glenfiddish <edwinlee0927@hotmail.com>\n * @createdate 2022-07-14\n */\n\nimport { EToolName } from '@/data/enums/ToolType';\nimport React from 'react';\nimport { sidebarCls } from './index';\nimport lineSvg from '@/assets/annotation/lineTool/icon_line.svg';\nimport lineASvg from '@/assets/annotation/lineTool/icon_line_a.svg';\nimport pointSvg from '@/assets/annotation/pointTool/icon_point.svg';\nimport pointASvg from '@/assets/annotation/pointTool/icon_point_a.svg';\nimport PolygonASvg from '@/assets/annotation/polygonTool/icon_polygon_a.svg';\nimport PolygonSvg from '@/assets/annotation/polygonTool/icon_polygon.svg';\nimport rectSvg from '@/assets/annotation/rectTool/icon_rect.svg';\nimport rectASvg from '@/assets/annotation/rectTool/icon_rect_a.svg';\nimport { cTool } from '@labelbee/lb-annotation';\nimport classnames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nconst { EPointCloudName, TOOL_NAME, TOOL_NAME_EN } = cTool;\n\nconst toolList = [\n  {\n    toolName: EToolName.Rect,\n    commonSvg: rectSvg,\n    selectedSvg: rectASvg,\n  },\n  {\n    toolName: EToolName.Polygon,\n    commonSvg: PolygonSvg,\n    selectedSvg: PolygonASvg,\n  },\n  {\n    toolName: EToolName.Line,\n    commonSvg: lineSvg,\n    selectedSvg: lineASvg,\n  },\n  {\n    toolName: EToolName.Point,\n    commonSvg: pointSvg,\n    selectedSvg: pointASvg,\n  },\n];\n\nconst getToolNameVersion = (lang: string) => {\n  if (lang === 'en') {\n    return TOOL_NAME_EN;\n  }\n  return TOOL_NAME;\n};\n\nexport const ToolIcons = ({\n  toolName,\n  selectedToolName,\n  onChange,\n}: {\n  toolName: string;\n  selectedToolName?: string;\n  onChange: (toolName: EToolName) => void;\n}) => {\n  const { i18n } = useTranslation();\n  const renderTools = toolList?.filter((item) => {\n    if (toolName === (EPointCloudName.PointCloud as unknown as EToolName)) {\n      return [EToolName.Polygon, EToolName.Rect, EToolName.Point, EToolName.Line].includes(\n        item?.toolName,\n      );\n    }\n\n    return item?.toolName === toolName;\n  });\n\n  const hasMultiTools = renderTools.length > 1;\n\n  return (\n    <div className={`${sidebarCls}__level`}>\n      {renderTools.map((tool) => {\n        const isSelected = hasMultiTools && selectedToolName === tool.toolName;\n        return (\n          <span\n            className={`${sidebarCls}__toolOption`}\n            key={tool.toolName}\n            onClick={() => onChange?.(tool.toolName)}\n          >\n            <img\n              className={`${sidebarCls}__singleTool`}\n              src={isSelected ? tool?.selectedSvg : tool?.commonSvg}\n            />\n            <span\n              className={classnames({\n                [`${sidebarCls}__toolOption__selected`]: isSelected,\n              })}\n            >\n              {getToolNameVersion(i18n.language)[tool.toolName]}\n            </span>\n          </span>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["cTool","EToolName","rectSvg","rectASvg","PolygonSvg","PolygonASvg","lineSvg","lineASvg","pointSvg","pointASvg","useTranslation","sidebarCls","classnames"],"mappings":"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"}

package/dist/views/MainView/sidebar/ToolStyle/index.js

@@ -1 +1,162 @@
-"use strict";var es=require("antd/es"),React=require("react"),icon_border=require("../../../../assets/toolStyle/icon_border.svg.js"),icon_borderColor=require("../../../../assets/toolStyle/icon_borderColor.svg.js"),icon_opacityStroke=require("../../../../assets/toolStyle/icon_opacityStroke.svg.js"),icon_opacityFill=require("../../../../assets/toolStyle/icon_opacityFill.svg.js"),reactRedux=require("react-redux"),actionCreators=require("../../../../store/toolStyle/actionCreators.js"),index=require("../../../../index.js"),ctx=require("../../../../store/ctx.js"),reactI18next=require("react-i18next");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const getMarks=(e,a)=>{const o=[{step:1,value:"1"},{step:2,value:"2"},{step:3,value:"3"},{step:4,value:"4"},{step:5,value:"5"}],c=[{step:1,value:"Blue"},{step:3,value:"Cyan"},{step:5,value:"Green"},{step:7,value:"Yellow"},{step:9,value:"Pink"}],n=[{step:1,value:"0.2"},{step:3,value:"0.4"},{step:5,value:"0.6"},{step:7,value:"0.8"},{step:9,value:"1.0"}],i=[{step:1,value:"0"},{step:3,value:"0.2"},{step:5,value:"0.4"},{step:7,value:"0.6"},{step:9,value:"0.8"}];let r=[];const l={};switch(e){case"width":r=o;break;case"color":r=c;break;case"borderOpacity":r=n;break;case"fillOpacity":r=i;break}return r.forEach(({step:s,value:u})=>{l[s]={style:{color:"#999999",fontSize:"12px"},label:React__default.default.createElement("span",null,a(u))}}),l},getTitle=e=>{switch(e){case"width":return"BorderThickness";case"color":return"Color";case"borderOpacity":return"BorderOpacity";case"fillOpacity":return"FillOpacity";default:return""}},getImage=e=>{switch(e){case"width":return icon_border;case"color":return icon_borderColor;case"borderOpacity":return icon_opacityStroke;case"fillOpacity":return icon_opacityFill}},getDefaultValue=e=>{switch(e){case"width":return 2;case"color":return 1;case"borderOpacity":return 9;case"fillOpacity":return 9}},getStyleType=e=>["width"].includes(e),ToolStyle=e=>{const{toolStyle:a}=e,{width:o,color:c,borderOpacity:n,fillOpacity:i}=a,r={width:o,color:c,borderOpacity:n,fillOpacity:i},{t:l}=reactI18next.useTranslation(),s=e.config,u=p=>{index.store.dispatch(actionCreators.UpdateToolStyleConfig(p))};return React__default.default.createElement("div",{className:"toolStyle"},Object.entries(r).map(p=>{var d;const t=p[0];return(s==null?void 0:s.attributeConfigurable)===!0&&t==="color"?null:React__default.default.createElement("div",{id:`style-${t}`,className:"styleSlider",key:t},React__default.default.createElement("span",{className:"title"},React__default.default.createElement("img",{src:getImage(t),className:"icon"}),l(getTitle(t))),React__default.default.createElement("span",{className:"slider"},React__default.default.createElement(es.Slider,{tipFormatter:null,max:getStyleType(t)?5:10,min:getStyleType(t)?1:0,step:getStyleType(t)?1:null,value:(d=a[t])!=null?d:getDefaultValue(t),marks:getMarks(t,l),onChange:v=>u({[t]:v})})))}))},mapStateToProps=({toolStyle:e,annotation:a})=>({toolStyle:e,config:a.toolInstance.config});var ToolStyle$1=reactRedux.connect(mapStateToProps,null,null,{context:ctx.LabelBeeContext})(ToolStyle);module.exports=ToolStyle$1;
+'use strict';
+
+var es = require('antd/es');
+var React = require('react');
+var icon_border = require('../../../../assets/toolStyle/icon_border.svg.js');
+var icon_borderColor = require('../../../../assets/toolStyle/icon_borderColor.svg.js');
+var icon_opacityStroke = require('../../../../assets/toolStyle/icon_opacityStroke.svg.js');
+var icon_opacityFill = require('../../../../assets/toolStyle/icon_opacityFill.svg.js');
+var reactRedux = require('react-redux');
+var actionCreators = require('../../../../store/toolStyle/actionCreators.js');
+var index = require('../../../../index.js');
+var ctx = require('../../../../store/ctx.js');
+var reactI18next = require('react-i18next');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const getMarks = (type, t) => {
+  const lineMarks = [
+    {step: 1, value: "1"},
+    {step: 2, value: "2"},
+    {step: 3, value: "3"},
+    {step: 4, value: "4"},
+    {step: 5, value: "5"}
+  ];
+  const colorMarks = [
+    {step: 1, value: "Blue"},
+    {step: 3, value: "Cyan"},
+    {step: 5, value: "Green"},
+    {step: 7, value: "Yellow"},
+    {step: 9, value: "Pink"}
+  ];
+  const borderOpacityMarks = [
+    {step: 1, value: "0.2"},
+    {step: 3, value: "0.4"},
+    {step: 5, value: "0.6"},
+    {step: 7, value: "0.8"},
+    {step: 9, value: "1.0"}
+  ];
+  const fillOpacityMarks = [
+    {step: 1, value: "0"},
+    {step: 3, value: "0.2"},
+    {step: 5, value: "0.4"},
+    {step: 7, value: "0.6"},
+    {step: 9, value: "0.8"}
+  ];
+  let list = [];
+  const marks = {};
+  switch (type) {
+    case "width":
+      list = lineMarks;
+      break;
+    case "color":
+      list = colorMarks;
+      break;
+    case "borderOpacity":
+      list = borderOpacityMarks;
+      break;
+    case "fillOpacity":
+      list = fillOpacityMarks;
+      break;
+  }
+  list.forEach(({step, value}) => {
+    marks[step] = {
+      style: {color: "#999999", fontSize: "12px"},
+      label: /* @__PURE__ */ React__default["default"].createElement("span", null, t(value))
+    };
+  });
+  return marks;
+};
+const getTitle = (title) => {
+  switch (title) {
+    case "width":
+      return "BorderThickness";
+    case "color":
+      return "Color";
+    case "borderOpacity":
+      return "BorderOpacity";
+    case "fillOpacity":
+      return "FillOpacity";
+    default:
+      return "";
+  }
+};
+const getImage = (title) => {
+  switch (title) {
+    case "width":
+      return icon_border;
+    case "color":
+      return icon_borderColor;
+    case "borderOpacity":
+      return icon_opacityStroke;
+    case "fillOpacity":
+      return icon_opacityFill;
+  }
+};
+const getDefaultValue = (value) => {
+  switch (value) {
+    case "width":
+      return 2;
+    case "color":
+      return 1;
+    case "borderOpacity":
+      return 9;
+    case "fillOpacity":
+      return 9;
+  }
+};
+const getStyleType = (info) => ["width"].includes(info);
+const ToolStyle = (props) => {
+  const {toolStyle} = props;
+  const {width, color, borderOpacity, fillOpacity} = toolStyle;
+  const styleConfig = {
+    width,
+    color,
+    borderOpacity,
+    fillOpacity
+  };
+  const {t} = reactI18next.useTranslation();
+  const annotationConfig = props.config;
+  const changeToolStyle = (obj) => {
+    index.store.dispatch(actionCreators.UpdateToolStyleConfig(obj));
+  };
+  return /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: "toolStyle"
+  }, Object.entries(styleConfig).map((item) => {
+    var _a;
+    const key = item[0];
+    if ((annotationConfig == null ? void 0 : annotationConfig.attributeConfigurable) === true && key === "color") {
+      return null;
+    }
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      id: `style-${key}`,
+      className: "styleSlider",
+      key
+    }, /* @__PURE__ */ React__default["default"].createElement("span", {
+      className: "title"
+    }, /* @__PURE__ */ React__default["default"].createElement("img", {
+      src: getImage(key),
+      className: "icon"
+    }), t(getTitle(key))), /* @__PURE__ */ React__default["default"].createElement("span", {
+      className: "slider"
+    }, /* @__PURE__ */ React__default["default"].createElement(es.Slider, {
+      tipFormatter: null,
+      max: getStyleType(key) ? 5 : 10,
+      min: getStyleType(key) ? 1 : 0,
+      step: getStyleType(key) ? 1 : null,
+      value: (_a = toolStyle[key]) != null ? _a : getDefaultValue(key),
+      marks: getMarks(key, t),
+      onChange: (e) => changeToolStyle({[key]: e})
+    })));
+  }));
+};
+const mapStateToProps = ({toolStyle, annotation}) => ({
+  toolStyle,
+  config: annotation.toolInstance.config
+});
+var ToolStyle$1 = reactRedux.connect(mapStateToProps, null, null, {context: ctx.LabelBeeContext})(ToolStyle);
+
+module.exports = ToolStyle$1;
+//# sourceMappingURL=index.js.map

package/dist/views/MainView/sidebar/ToolStyle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/views/MainView/sidebar/ToolStyle/index.tsx"],"sourcesContent":["import { Slider } from 'antd/es';\nimport React from 'react';\nimport widthSvg from '@/assets/toolStyle/icon_border.svg';\nimport colorSvg from '@/assets/toolStyle/icon_borderColor.svg';\nimport borderOpacitySvg from '@/assets/toolStyle/icon_opacityStroke.svg';\nimport fillOpacitySvg from '@/assets/toolStyle/icon_opacityFill.svg';\n\nimport { connect } from 'react-redux';\nimport { UpdateToolStyleConfig } from '@/store/toolStyle/actionCreators';\nimport { store } from '@/index';\nimport { LabelBeeContext } from '@/store/ctx';\nimport { AppState } from '@/store';\nimport { ToolStyleState } from '@/store/toolStyle/types';\nimport { useTranslation } from 'react-i18next';\n\ninterface IProps {\n  toolStyle: ToolStyleState;\n  config: string;\n}\ntype ToolStyleKey = keyof ToolStyleState;\n\nconst getMarks = (type: string, t: any) => {\n  const lineMarks = [\n    { step: 1, value: '1' },\n    { step: 2, value: '2' },\n    { step: 3, value: '3' },\n    { step: 4, value: '4' },\n    { step: 5, value: '5' },\n  ];\n  const colorMarks = [\n    { step: 1, value: 'Blue' },\n    { step: 3, value: 'Cyan' },\n    { step: 5, value: 'Green' },\n    { step: 7, value: 'Yellow' },\n    { step: 9, value: 'Pink' },\n  ];\n  const borderOpacityMarks = [\n    { step: 1, value: '0.2' },\n    { step: 3, value: '0.4' },\n    { step: 5, value: '0.6' },\n    { step: 7, value: '0.8' },\n    { step: 9, value: '1.0' },\n  ];\n\n  const fillOpacityMarks = [\n    { step: 1, value: '0' },\n    { step: 3, value: '0.2' },\n    { step: 5, value: '0.4' },\n    { step: 7, value: '0.6' },\n    { step: 9, value: '0.8' },\n  ];\n  let list: Array<{ step: number; value: string }> = [];\n  const marks: {\n    [a: number]: {\n      style: {};\n      label: any;\n    };\n  } = {};\n  switch (type) {\n    case 'width':\n      list = lineMarks;\n      break;\n    case 'color':\n      list = colorMarks;\n      break;\n    case 'borderOpacity':\n      list = borderOpacityMarks;\n      break;\n    case 'fillOpacity':\n      list = fillOpacityMarks;\n      break;\n  }\n  list.forEach(({ step, value }) => {\n    marks[step] = {\n      style: { color: '#999999', fontSize: '12px' },\n      label: <span>{t(value)}</span>,\n    };\n  });\n  return marks;\n};\n\nconst getTitle = (title: string) => {\n  switch (title) {\n    case 'width':\n      return 'BorderThickness';\n    case 'color':\n      return 'Color';\n    case 'borderOpacity':\n      return 'BorderOpacity';\n    case 'fillOpacity':\n      return 'FillOpacity';\n    default:\n      return '';\n  }\n};\nconst getImage = (title: string) => {\n  switch (title) {\n    case 'width':\n      return widthSvg;\n    case 'color':\n      return colorSvg;\n    case 'borderOpacity':\n      return borderOpacitySvg;\n    case 'fillOpacity':\n      return fillOpacitySvg;\n  }\n};\nconst getDefaultValue = (value: string) => {\n  switch (value) {\n    case 'width':\n      return 2;\n    case 'color':\n      return 1;\n    case 'borderOpacity':\n      return 9;\n    case 'fillOpacity':\n      return 9;\n  }\n};\n\n/**\n * 判断使用那种样式 (slider的step中间为选中和step为选中)\n * @param info TToolStyleConfig\n */\nconst getStyleType = (info: string): boolean => ['width'].includes(info);\n\nconst ToolStyle = (props: IProps) => {\n  const { toolStyle } = props;\n  const { width, color, borderOpacity, fillOpacity } = toolStyle;\n  const styleConfig = {\n    width,\n    color,\n    borderOpacity,\n    fillOpacity,\n  };\n  const { t } = useTranslation();\n\n  // TODO - 样式标准的定义\n  const annotationConfig: any = props.config;\n\n  const changeToolStyle = (obj: { [key: string]: number }) => {\n    store.dispatch(UpdateToolStyleConfig(obj));\n  };\n\n  return (\n    <div className='toolStyle'>\n      {Object.entries(styleConfig).map((item: any[]) => {\n        const key: ToolStyleKey = item[0];\n        // 判断是否需要 color 的使用，现在暂时默认不需要\n        if (annotationConfig?.attributeConfigurable === true && key === 'color') {\n          return null;\n        }\n        return (\n          <div id={`style-${key}`} className='styleSlider' key={key}>\n            <span className='title'>\n              <img src={getImage(key)} className='icon' />\n              {t(getTitle(key))}\n            </span>\n            <span className='slider'>\n              <Slider\n                tipFormatter={null}\n                max={getStyleType(key) ? 5 : 10}\n                min={getStyleType(key) ? 1 : 0}\n                step={getStyleType(key) ? 1 : null}\n                value={(toolStyle[key] ?? getDefaultValue(key)) as number}\n                marks={getMarks(key, t)}\n                onChange={(e: any) => changeToolStyle({ [key]: e })}\n              />\n            </span>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nconst mapStateToProps = ({ toolStyle, annotation }: AppState) => ({\n  toolStyle,\n  config: annotation.toolInstance.config,\n});\nexport default connect(mapStateToProps, null, null, { context: LabelBeeContext })(ToolStyle);\n"],"names":["React","widthSvg","colorSvg","borderOpacitySvg","fillOpacitySvg","useTranslation","store","UpdateToolStyleConfig","Slider","connect","LabelBeeContext"],"mappings":"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"}

package/dist/views/MainView/sidebar/index.js

@@ -1 +1,156 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var index=require("../../../constant/index.js"),ToolType=require("../../../data/enums/ToolType.js"),StepUtils=require("../../../utils/StepUtils.js"),es=require("antd/es"),React=require("react"),reactI18next=require("react-i18next"),index$8=require("./AnnotationText/index.js"),index$2=require("./ClearIcon/index.js"),index$6=require("./GeneralOperation/index.js"),index$3=require("./ImgAttributeInfo/index.js"),index$7=require("./SwitchAttributeList/index.js"),index$1=require("./TagSidebar/index.js"),index$4=require("./TextToolSidebar/index.js"),index$5=require("./PointCloudToolSidebar/index.js"),index$a=require("./ToolStyle/index.js"),lbAnnotation=require("@labelbee/lb-annotation"),index$9=require("./ScribbleSidebar/index.js"),ToolIcons=require("./ToolIcons.js"),ctx=require("../../../store/ctx.js");function _interopDefaultLegacy(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var React__default=_interopDefaultLegacy(React);const{EVideoToolName,EPointCloudName}=lbAnnotation.cTool,{Panel}=es.Collapse,sidebarCls=`${index.prefix}-sidebar`,Sidebar=({sider:e})=>{const r=ctx.useSelector(a=>StepUtils.getCurrentStepInfo(a.annotation.step,a.annotation.stepList)),t=r==null?void 0:r.tool,{t:i}=reactI18next.useTranslation();if(!t)return null;const E=a=>{const f=React__default.default.createElement(index$a,null);return React__default.default.createElement(Panel,{header:i("Style"),className:"panel",key:a},f)},u=React__default.default.createElement(ToolIcons.ToolIcons,{toolName:t,onChange:()=>{}}),n=React__default.default.createElement(index$7,null),d=React__default.default.createElement(index$8,null),c=React__default.default.createElement(es.Collapse,{defaultActiveKey:["1","imgAttribute"],bordered:!1,expandIconPosition:"right",className:`${sidebarCls}__content`,expandIcon:index$1.expandIconFuc},E("1")),s=React__default.default.createElement(es.Collapse,{defaultActiveKey:["1","imgAttribute"],bordered:!1,expandIconPosition:"right",className:`${sidebarCls}__content`,expandIcon:index$1.expandIconFuc},React__default.default.createElement(Panel,{header:React__default.default.createElement("div",null,i("Adjust"),React__default.default.createElement(index$2,null)),className:"panel",key:"imgAttribute"},React__default.default.createElement(index$3,null))),l=React__default.default.createElement(index$6.default,null),x=React__default.default.createElement(index$1.default,null),v=React__default.default.createElement(index$4.default,null),m=React__default.default.createElement(index$9,{onChange:(a,f)=>{}}),o=React__default.default.createElement("div",{className:`${sidebarCls}__horizontal`}),p=React__default.default.createElement(index$5,null),T=React__default.default.createElement(index$6.PointCloudOperation,null);return e?typeof e=="function"?React__default.default.createElement("div",{className:`${sidebarCls}`},e({toolIcon:u,attributeList:n,annotationText:d,toolStyle:c,imageAttributeInfo:s,operation:l,tagToolSideBar:x,textToolSideBar:v,horizontal:o,pointCloudToolSidebar:p,pointCloudOperation:T,scribbleSidebar:m})):e:[ToolType.EToolName.Rect,ToolType.EToolName.Point,ToolType.EToolName.Line,ToolType.EToolName.Rect,ToolType.EToolName.Polygon,ToolType.EToolName.Cuboid].includes(t)?React__default.default.createElement("div",{className:`${sidebarCls}`},u,o,n,d,o,React__default.default.createElement("div",{className:`${sidebarCls}__content`},c,s),l):t===ToolType.EToolName.Tag?React__default.default.createElement("div",{className:`${sidebarCls}`},React__default.default.createElement(index$1.default,null)):t===EVideoToolName.VideoTagTool?React__default.default.createElement("div",{className:`${sidebarCls}`},React__default.default.createElement("div",{className:`${sidebarCls}__content`},React__default.default.createElement(index$1.default,null)),l):t===ToolType.EToolName.Text?React__default.default.createElement("div",{className:`${sidebarCls}`},React__default.default.createElement(index$4.default,null)):t===EPointCloudName.PointCloud?React__default.default.createElement("div",{className:`${sidebarCls}`},React__default.default.createElement("div",{className:`${sidebarCls}__content`},React__default.default.createElement(index$5,null)),React__default.default.createElement(index$6.PointCloudOperation,null)):t===ToolType.EToolName.ScribbleTool?React__default.default.createElement("div",{className:`${sidebarCls}`},React__default.default.createElement("div",{className:`${sidebarCls}__content`},m,n),l):null};exports.default=Sidebar,exports.sidebarCls=sidebarCls;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../../../constant/index.js');
+var ToolType = require('../../../data/enums/ToolType.js');
+var StepUtils = require('../../../utils/StepUtils.js');
+var es = require('antd/es');
+var React = require('react');
+var reactI18next = require('react-i18next');
+var index$8 = require('./AnnotationText/index.js');
+var index$2 = require('./ClearIcon/index.js');
+var index$6 = require('./GeneralOperation/index.js');
+var index$3 = require('./ImgAttributeInfo/index.js');
+var index$7 = require('./SwitchAttributeList/index.js');
+var index$1 = require('./TagSidebar/index.js');
+var index$4 = require('./TextToolSidebar/index.js');
+var index$5 = require('./PointCloudToolSidebar/index.js');
+var index$a = require('./ToolStyle/index.js');
+var lbAnnotation = require('@labelbee/lb-annotation');
+var index$9 = require('./ScribbleSidebar/index.js');
+var ToolIcons = require('./ToolIcons.js');
+var ctx = require('../../../store/ctx.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const {EVideoToolName, EPointCloudName} = lbAnnotation.cTool;
+const {Panel} = es.Collapse;
+const sidebarCls = `${index.prefix}-sidebar`;
+const Sidebar = ({sider}) => {
+  const stepInfo = ctx.useSelector((state) => StepUtils.getCurrentStepInfo(state.annotation.step, state.annotation.stepList));
+  const toolName = stepInfo == null ? void 0 : stepInfo.tool;
+  const {t} = reactI18next.useTranslation();
+  if (!toolName) {
+    return null;
+  }
+  const renderStylePanel = (key) => {
+    const ToolStyleComponent = /* @__PURE__ */ React__default["default"].createElement(index$a, null);
+    return /* @__PURE__ */ React__default["default"].createElement(Panel, {
+      header: t("Style"),
+      className: "panel",
+      key
+    }, ToolStyleComponent);
+  };
+  const toolIcon = /* @__PURE__ */ React__default["default"].createElement(ToolIcons.ToolIcons, {
+    toolName,
+    onChange: () => {
+    }
+  });
+  const attributeList = /* @__PURE__ */ React__default["default"].createElement(index$7, null);
+  const annotationText = /* @__PURE__ */ React__default["default"].createElement(index$8, null);
+  const toolStyle = /* @__PURE__ */ React__default["default"].createElement(es.Collapse, {
+    defaultActiveKey: ["1", "imgAttribute"],
+    bordered: false,
+    expandIconPosition: "right",
+    className: `${sidebarCls}__content`,
+    expandIcon: index$1.expandIconFuc
+  }, renderStylePanel("1"));
+  const imageAttributeInfo = /* @__PURE__ */ React__default["default"].createElement(es.Collapse, {
+    defaultActiveKey: ["1", "imgAttribute"],
+    bordered: false,
+    expandIconPosition: "right",
+    className: `${sidebarCls}__content`,
+    expandIcon: index$1.expandIconFuc
+  }, /* @__PURE__ */ React__default["default"].createElement(Panel, {
+    header: /* @__PURE__ */ React__default["default"].createElement("div", null, t("Adjust"), /* @__PURE__ */ React__default["default"].createElement(index$2, null)),
+    className: "panel",
+    key: "imgAttribute"
+  }, /* @__PURE__ */ React__default["default"].createElement(index$3, null)));
+  const operation = /* @__PURE__ */ React__default["default"].createElement(index$6["default"], null);
+  const tagToolSideBar = /* @__PURE__ */ React__default["default"].createElement(index$1["default"], null);
+  const textToolSideBar = /* @__PURE__ */ React__default["default"].createElement(index$4["default"], null);
+  const scribbleSidebar = /* @__PURE__ */ React__default["default"].createElement(index$9, {
+    onChange: (t2, i) => {
+    }
+  });
+  const horizontal = /* @__PURE__ */ React__default["default"].createElement("div", {
+    className: `${sidebarCls}__horizontal`
+  });
+  const pointCloudToolSidebar = /* @__PURE__ */ React__default["default"].createElement(index$5, null);
+  const pointCloudOperation = /* @__PURE__ */ React__default["default"].createElement(index$6.PointCloudOperation, null);
+  if (sider) {
+    if (typeof sider === "function") {
+      return /* @__PURE__ */ React__default["default"].createElement("div", {
+        className: `${sidebarCls}`
+      }, sider({
+        toolIcon,
+        attributeList,
+        annotationText,
+        toolStyle,
+        imageAttributeInfo,
+        operation,
+        tagToolSideBar,
+        textToolSideBar,
+        horizontal,
+        pointCloudToolSidebar,
+        pointCloudOperation,
+        scribbleSidebar
+      }));
+    } else {
+      return sider;
+    }
+  }
+  if ([
+    ToolType.EToolName.Rect,
+    ToolType.EToolName.Point,
+    ToolType.EToolName.Line,
+    ToolType.EToolName.Rect,
+    ToolType.EToolName.Polygon,
+    ToolType.EToolName.Cuboid
+  ].includes(toolName)) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, toolIcon, horizontal, attributeList, annotationText, horizontal, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}__content`
+    }, toolStyle, imageAttributeInfo), operation);
+  }
+  if (toolName === ToolType.EToolName.Tag) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, /* @__PURE__ */ React__default["default"].createElement(index$1["default"], null));
+  }
+  if (toolName === EVideoToolName.VideoTagTool) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}__content`
+    }, /* @__PURE__ */ React__default["default"].createElement(index$1["default"], null)), operation);
+  }
+  if (toolName === ToolType.EToolName.Text) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, /* @__PURE__ */ React__default["default"].createElement(index$4["default"], null));
+  }
+  if (toolName === EPointCloudName.PointCloud) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}__content`
+    }, /* @__PURE__ */ React__default["default"].createElement(index$5, null)), /* @__PURE__ */ React__default["default"].createElement(index$6.PointCloudOperation, null));
+  }
+  if (toolName === ToolType.EToolName.ScribbleTool) {
+    return /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}`
+    }, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: `${sidebarCls}__content`
+    }, scribbleSidebar, attributeList), operation);
+  }
+  return null;
+};
+
+exports["default"] = Sidebar;
+exports.sidebarCls = sidebarCls;
+//# sourceMappingURL=index.js.map

package/dist/views/MainView/sidebar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/views/MainView/sidebar/index.tsx"],"sourcesContent":["import { prefix } from '@/constant';\nimport { EToolName } from '@/data/enums/ToolType';\nimport { AppState } from '@/store';\nimport { Sider } from '@/types/main';\nimport StepUtils from '@/utils/StepUtils';\nimport { Collapse } from 'antd/es';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport AnnotationText from './AnnotationText';\nimport ClearIcon from './ClearIcon';\nimport GeneralOperation, { PointCloudOperation } from './GeneralOperation';\nimport ImgAttributeInfo from './ImgAttributeInfo';\nimport SwitchAttributeList from './SwitchAttributeList';\nimport TagSidebar, { expandIconFuc } from './TagSidebar';\nimport TextToolSidebar from './TextToolSidebar';\nimport PointCloudToolSidebar from './PointCloudToolSidebar';\nimport ToolStyle from './ToolStyle';\nimport { cTool } from '@labelbee/lb-annotation';\nimport ScribbleSidebar from './ScribbleSidebar';\nimport { ToolIcons } from './ToolIcons';\nimport { useSelector } from '@/store/ctx';\n\nconst { EVideoToolName, EPointCloudName } = cTool;\n\nconst { Panel } = Collapse;\n\ninterface IProps {\n  toolName?: EToolName;\n  sider?: Sider;\n}\n\nexport const sidebarCls = `${prefix}-sidebar`;\nconst Sidebar: React.FC<IProps> = ({ sider }) => {\n  const stepInfo = useSelector((state: AppState) =>\n    StepUtils.getCurrentStepInfo(state.annotation.step, state.annotation.stepList),\n  );\n  const toolName = stepInfo?.tool;\n  const { t } = useTranslation();\n\n  if (!toolName) {\n    return null;\n  }\n\n  /**\n   * 样式面板, 包含透明度、线框、颜色\n   * @param key 虚拟dom的key\n   */\n  const renderStylePanel = (key: string) => {\n    const ToolStyleComponent = <ToolStyle />;\n    return (\n      <Panel header={t('Style')} className='panel' key={key}>\n        {ToolStyleComponent}\n      </Panel>\n    );\n  };\n\n  // onChange is empty by default.\n  const toolIcon = <ToolIcons toolName={toolName} onChange={() => {}} />;\n  const attributeList = <SwitchAttributeList />;\n\n  const annotationText = <AnnotationText />;\n\n  const toolStyle = (\n    <Collapse\n      defaultActiveKey={['1', 'imgAttribute']}\n      bordered={false}\n      expandIconPosition='right'\n      className={`${sidebarCls}__content`}\n      expandIcon={expandIconFuc}\n    >\n      {renderStylePanel('1')}\n    </Collapse>\n  );\n\n  const imageAttributeInfo = (\n    <Collapse\n      defaultActiveKey={['1', 'imgAttribute']}\n      bordered={false}\n      expandIconPosition='right'\n      className={`${sidebarCls}__content`}\n      expandIcon={expandIconFuc}\n    >\n      <Panel\n        header={\n          <div>\n            {t('Adjust')}\n\n            <ClearIcon />\n          </div>\n        }\n        className='panel'\n        key='imgAttribute'\n      >\n        <ImgAttributeInfo />\n      </Panel>\n    </Collapse>\n  );\n\n  const operation = <GeneralOperation />;\n\n  const tagToolSideBar = <TagSidebar />;\n\n  const textToolSideBar = <TextToolSidebar />;\n\n  const scribbleSidebar = (\n    <ScribbleSidebar\n      onChange={(t, i) => {\n        // 接收\n      }}\n    />\n  );\n\n  const horizontal = <div className={`${sidebarCls}__horizontal`} />;\n\n  const pointCloudToolSidebar = <PointCloudToolSidebar />;\n\n  const pointCloudOperation = <PointCloudOperation />;\n\n  if (sider) {\n    if (typeof sider === 'function') {\n      return (\n        <div className={`${sidebarCls}`}>\n          {sider({\n            toolIcon,\n            attributeList,\n            annotationText,\n            toolStyle,\n            imageAttributeInfo,\n            operation,\n            tagToolSideBar,\n            textToolSideBar,\n            horizontal,\n\n            pointCloudToolSidebar,\n            pointCloudOperation,\n            scribbleSidebar,\n          })}\n        </div>\n      );\n    } else {\n      return sider;\n    }\n  }\n\n  if (\n    (\n      [\n        EToolName.Rect,\n        EToolName.Point,\n        EToolName.Line,\n        EToolName.Rect,\n        EToolName.Polygon,\n        EToolName.Cuboid,\n      ] as string[]\n    ).includes(toolName)\n  ) {\n    return (\n      <div className={`${sidebarCls}`}>\n        {toolIcon}\n        {horizontal}\n        {attributeList}\n        {annotationText}\n        {horizontal}\n        <div className={`${sidebarCls}__content`}>\n          {toolStyle}\n          {imageAttributeInfo}\n        </div>\n        {operation}\n      </div>\n    );\n  }\n\n  if (toolName === EToolName.Tag) {\n    return (\n      <div className={`${sidebarCls}`}>\n        <TagSidebar />\n      </div>\n    );\n  }\n\n  if (toolName === EVideoToolName.VideoTagTool) {\n    return (\n      <div className={`${sidebarCls}`}>\n        <div className={`${sidebarCls}__content`}>\n          <TagSidebar />\n        </div>\n        {operation}\n      </div>\n    );\n  }\n\n  if (toolName === EToolName.Text) {\n    return (\n      <div className={`${sidebarCls}`}>\n        <TextToolSidebar />\n      </div>\n    );\n  }\n\n  if (toolName === EPointCloudName.PointCloud) {\n    return (\n      <div className={`${sidebarCls}`}>\n        <div className={`${sidebarCls}__content`}>\n          <PointCloudToolSidebar />\n        </div>\n        <PointCloudOperation />\n      </div>\n    );\n  }\n\n  if (toolName === EToolName.ScribbleTool) {\n    return (\n      <div className={`${sidebarCls}`}>\n        <div className={`${sidebarCls}__content`}>\n          {scribbleSidebar}\n          {attributeList}\n        </div>\n        {operation}\n      </div>\n    );\n  }\n\n  return null;\n};\n\nexport default Sidebar;\n"],"names":["cTool","Collapse","prefix","useSelector","useTranslation","ToolStyle","ToolIcons","SwitchAttributeList","AnnotationText","expandIconFuc","React","ClearIcon","ImgAttributeInfo","GeneralOperation","TagSidebar","TextToolSidebar","ScribbleSidebar","PointCloudToolSidebar","PointCloudOperation","EToolName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,CAAE,gBAAgB,eAAoB,CAAA,GAAAA,kBAAA,CAAA;AAE5C,MAAM,CAAE,KAAU,CAAA,GAAAC,WAAA,CAAA;AAOX,MAAM,aAAa,CAAG,EAAAC,YAAA,CAAA,QAAA,EAAA;AACvB,MAAA,OAAA,GAA4B,CAAC,CAAE,KAAY,CAAA,KAAA;AAC/C,EAAM,MAAA,QAAA,GAAWC,eAAY,CAAA,CAAC,KAC5B,KAAA,SAAA,CAAU,mBAAmB,KAAM,CAAA,UAAA,CAAW,IAAM,EAAA,KAAA,CAAM,UAAW,CAAA,QAAA,CAAA,CAAA,CAAA;AAEvE,EAAA,MAAM,WAAW,QAAU,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,IAAA,CAAA;AAC3B,EAAA,MAAM,CAAE,CAAM,CAAA,GAAAC,2BAAA,EAAA,CAAA;AAEd,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAO,OAAA,IAAA,CAAA;AAAA,GAAA;AAOT,EAAM,MAAA,gBAAA,GAAmB,CAAC,GAAgB,KAAA;AACxC,IAAM,MAAA,kBAAA,2DAAsBC,OAAD,EAAA,IAAA,CAAA,CAAA;AAC3B,IAAA,+DACG,KAAD,EAAA;AAAA,MAAO,QAAQ,CAAE,CAAA,OAAA,CAAA;AAAA,MAAU,SAAU,EAAA,OAAA;AAAA,MAAQ,GAAA;AAAA,KAC1C,EAAA,kBAAA,CAAA,CAAA;AAAA,GAAA,CAAA;AAMP,EAAM,MAAA,QAAA,2DAAYC,mBAAD,EAAA;AAAA,IAAW,QAAA;AAAA,IAAoB,UAAU,MAAM;AAAA,KAAA;AAAA,GAAA,CAAA,CAAA;AAChE,EAAM,MAAA,aAAA,2DAAiBC,OAAD,EAAA,IAAA,CAAA,CAAA;AAEtB,EAAM,MAAA,cAAA,2DAAkBC,OAAD,EAAA,IAAA,CAAA,CAAA;AAEvB,EAAM,MAAA,SAAA,2DACHP,WAAD,EAAA;AAAA,IACE,gBAAA,EAAkB,CAAC,GAAK,EAAA,cAAA,CAAA;AAAA,IACxB,QAAU,EAAA,KAAA;AAAA,IACV,kBAAmB,EAAA,OAAA;AAAA,IACnB,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,IACd,UAAY,EAAAQ,qBAAA;AAAA,GAAA,EAEX,gBAAiB,CAAA,GAAA,CAAA,CAAA,CAAA;AAItB,EAAM,MAAA,kBAAA,2DACHR,WAAD,EAAA;AAAA,IACE,gBAAA,EAAkB,CAAC,GAAK,EAAA,cAAA,CAAA;AAAA,IACxB,QAAU,EAAA,KAAA;AAAA,IACV,kBAAmB,EAAA,OAAA;AAAA,IACnB,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,IACd,UAAY,EAAAQ,qBAAA;AAAA,GAAA,0DAEX,KAAD,EAAA;AAAA,IACE,wBACGC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAD,MACG,CAAE,CAAA,QAAA,CAAA,0DAEFC,OAAD,EAAA,IAAA,CAAA,CAAA;AAAA,IAGJ,SAAU,EAAA,OAAA;AAAA,IACV,GAAI,EAAA,cAAA;AAAA,GAAA,0DAEHC,OAAD,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA;AAKN,EAAM,MAAA,SAAA,2DAAaC,kBAAD,EAAA,IAAA,CAAA,CAAA;AAElB,EAAM,MAAA,cAAA,2DAAkBC,kBAAD,EAAA,IAAA,CAAA,CAAA;AAEvB,EAAM,MAAA,eAAA,2DAAmBC,kBAAD,EAAA,IAAA,CAAA,CAAA;AAExB,EAAM,MAAA,eAAA,2DACHC,OAAD,EAAA;AAAA,IACE,QAAA,EAAU,CAAC,EAAA,EAAG,CAAM,KAAA;AAAA,KAAA;AAAA,GAAA,CAAA,CAAA;AAMxB,EAAM,MAAA,UAAA,2DAAc,KAAD,EAAA;AAAA,IAAK,WAAW,CAAG,EAAA,UAAA,CAAA,YAAA,CAAA;AAAA,GAAA,CAAA,CAAA;AAEtC,EAAM,MAAA,qBAAA,2DAAyBC,OAAD,EAAA,IAAA,CAAA,CAAA;AAE9B,EAAM,MAAA,mBAAA,2DAAuBC,2BAAD,EAAA,IAAA,CAAA,CAAA;AAE5B,EAAA,IAAI,KAAO,EAAA;AACT,IAAI,IAAA,OAAO,UAAU,UAAY,EAAA;AAC/B,MAAA,+DACG,KAAD,EAAA;AAAA,QAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,OAAA,EAChB,KAAM,CAAA;AAAA,QACL,QAAA;AAAA,QACA,aAAA;AAAA,QACA,cAAA;AAAA,QACA,SAAA;AAAA,QACA,kBAAA;AAAA,QACA,SAAA;AAAA,QACA,cAAA;AAAA,QACA,eAAA;AAAA,QACA,UAAA;AAAA,QAEA,qBAAA;AAAA,QACA,mBAAA;AAAA,QACA,eAAA;AAAA,OAAA,CAAA,CAAA,CAAA;AAAA,KAID,MAAA;AACL,MAAO,OAAA,KAAA,CAAA;AAAA,KAAA;AAAA,GAAA;AAIX,EAEI,IAAA;AAAA,IACEC,kBAAU,CAAA,IAAA;AAAA,IACVA,kBAAU,CAAA,KAAA;AAAA,IACVA,kBAAU,CAAA,IAAA;AAAA,IACVA,kBAAU,CAAA,IAAA;AAAA,IACVA,kBAAU,CAAA,OAAA;AAAA,IACVA,kBAAU,CAAA,MAAA;AAAA,GAAA,CAEZ,SAAS,QACX,CAAA,EAAA;AACA,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,EAChB,UACA,UACA,EAAA,aAAA,EACA,cACA,EAAA,UAAA,0DACA,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,KAAA,EAChB,WACA,kBAEF,CAAA,EAAA,SAAA,CAAA,CAAA;AAAA,GAAA;AAKP,EAAI,IAAA,QAAA,KAAaA,mBAAU,GAAK,EAAA;AAC9B,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,0DAChBL,kBAAD,EAAA,IAAA,CAAA,CAAA,CAAA;AAAA,GAAA;AAKN,EAAI,IAAA,QAAA,KAAa,eAAe,YAAc,EAAA;AAC5C,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,0DAChB,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,KACjB,kBAAAJ,yBAAA,CAAA,aAAA,CAACI,oBAAD,IAED,CAAA,CAAA,EAAA,SAAA,CAAA,CAAA;AAAA,GAAA;AAKP,EAAI,IAAA,QAAA,KAAaK,mBAAU,IAAM,EAAA;AAC/B,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,0DAChBJ,kBAAD,EAAA,IAAA,CAAA,CAAA,CAAA;AAAA,GAAA;AAKN,EAAI,IAAA,QAAA,KAAa,gBAAgB,UAAY,EAAA;AAC3C,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,0DAChB,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,KAAA,kBAChBL,yBAAA,CAAA,aAAA,CAAAO,OAAA,EAAD,IAEF,CAAA,CAAA,kBAAAP,yBAAA,CAAA,aAAA,CAACQ,2BAAD,EAAA,IAAA,CAAA,CAAA,CAAA;AAAA,GAAA;AAKN,EAAI,IAAA,QAAA,KAAaC,mBAAU,YAAc,EAAA;AACvC,IAAA,+DACG,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,CAAA;AAAA,KAAA,0DAChB,KAAD,EAAA;AAAA,MAAK,WAAW,CAAG,EAAA,UAAA,CAAA,SAAA,CAAA;AAAA,KAAA,EAChB,iBACA,aAEF,CAAA,EAAA,SAAA,CAAA,CAAA;AAAA,GAAA;AAKP,EAAO,OAAA,IAAA,CAAA;AAAA;;;;;"}