@labelbee/lb-components 1.2.3-alpha.6 → 1.2.3-alpha.7
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var React=require("react"),lbAnnotation=require("@labelbee/lb-annotation"),es=require("antd/es");function _interopDefaultLegacy(r){return r&&typeof r=="object"&&"default"in r?r:{default:r}}var React__default=_interopDefaultLegacy(React),__defProp=Object.defineProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(r,o,e)=>o in r?__defProp(r,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[o]=e,__spreadValues=(r,o)=>{for(var e in o||(o={}))__hasOwnProp.call(o,e)&&__defNormalProp(r,e,o[e]);if(__getOwnPropSymbols)for(var e of __getOwnPropSymbols(o))__propIsEnum.call(o,e)&&__defNormalProp(r,e,o[e]);return r};const DEFAULT_SIZE={width:1280,height:720},AnnotationView=(r,o)=>{const{size:e=DEFAULT_SIZE,src:v,annotations:
|
|
1
|
+
"use strict";var React=require("react"),lbAnnotation=require("@labelbee/lb-annotation"),es=require("antd/es");function _interopDefaultLegacy(r){return r&&typeof r=="object"&&"default"in r?r:{default:r}}var React__default=_interopDefaultLegacy(React),__defProp=Object.defineProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(r,o,e)=>o in r?__defProp(r,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[o]=e,__spreadValues=(r,o)=>{for(var e in o||(o={}))__hasOwnProp.call(o,e)&&__defNormalProp(r,e,o[e]);if(__getOwnPropSymbols)for(var e of __getOwnPropSymbols(o))__propIsEnum.call(o,e)&&__defNormalProp(r,e,o[e]);return r};const DEFAULT_SIZE={width:1280,height:720},AnnotationView=(r,o)=>{const{size:e=DEFAULT_SIZE,src:v,annotations:l=[],style:p={stroke:"blue",thickness:3},zoomChange:s,backgroundStyle:g={},onChange:c,showLoading:_=!1}=r,[m,d]=React.useState(!1),f=React.useRef(null),n=React.useRef();React.useImperativeHandle(o,()=>{const t=n.current;return t?{zoomIn:()=>t.zoomChanged(!0),zoomOut:()=>t.zoomChanged(!1),initImgPos:()=>t.initImgPos(),toolInstance:t}:{}},[n.current]),React.useEffect(()=>(f.current&&(n.current=new lbAnnotation.ViewOperation({container:f.current,size:e,style:p,annotations:l,config:"{}"}),n.current.init()),()=>{var t;(t=n.current)==null||t.destroy()}),[]),React.useEffect(()=>{var t;n.current&&(d(!0),(t=n.current)==null||t.setLoading(!0),lbAnnotation.ImgUtils.load(v).then(i=>{var a,u;(a=n.current)==null||a.setLoading(!1),d(!1),(u=n.current)==null||u.setImgNode(i)}).catch(()=>{var i;(i=n.current)==null||i.setLoading(!1),d(!1)}))},[v]),React.useEffect(()=>{n.current&&n.current.updateData(l)},[l]),React.useEffect(()=>{const t=n.current;(t==null?void 0:t.setSize)&&t.setSize(e)},[e==null?void 0:e.width,e==null?void 0:e.height]),React.useEffect(()=>{var t,i;return n.current&&((t=n.current)==null||t.on("onChange",(...a)=>{c==null||c.apply(null,a)}),(i=n.current)==null||i.on("renderZoom",a=>{s&&s(a)})),()=>{var a,u;(a=n.current)==null||a.unbindAll("onChange"),(u=n.current)==null||u.unbindAll("renderZoom")}},[s,c]);const h=React__default.default.createElement("div",{ref:f,style:__spreadValues(__spreadValues({position:"relative"},e),g)});return React__default.default.createElement(es.Spin,{spinning:_||m,delay:300},h)};var index=React__default.default.forwardRef(AnnotationView);module.exports=index;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import m,{useState as z,useRef as g,useImperativeHandle as S,useEffect as u}from"react";import{ViewOperation as E,ImgUtils as C}from"@labelbee/lb-annotation";import{Spin as L}from"antd/es";var R=Object.defineProperty,_=Object.getOwnPropertySymbols,A=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable,h=(o,t,e)=>t in o?R(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,w=(o,t)=>{for(var e in t||(t={}))A.call(t,e)&&h(o,e,t[e]);if(_)for(var e of _(t))V.call(t,e)&&h(o,e,t[e]);return o};const Z={width:1280,height:720},j=(o,t)=>{const{size:e=Z,src:p,annotations:s=[],style:b={stroke:"blue",thickness:3},zoomChange:c,backgroundStyle:y={},onChange:d,showLoading:I=!1}=o,[O,f]=z(!1),v=g(null),n=g();S(t,()=>{const r=n.current;return r?{zoomIn:()=>r.zoomChanged(!0),zoomOut:()=>r.zoomChanged(!1),initImgPos:()=>r.initImgPos(),toolInstance:r}:{}},[n.current]),u(()=>(v.current&&(n.current=new E({container:v.current,size:e,style:b,annotations:s,config:"{}"}),n.current.init()),()=>{var r;(r=n.current)==null||r.destroy()}),[]),u(()=>{var r;n.current&&(f(!0),(r=n.current)==null||r.setLoading(!0),C.load(p).then(i=>{var a,l;(a=n.current)==null||a.setLoading(!1),f(!1),(l=n.current)==null||l.setImgNode(i)}).catch(()=>{var i;(i=n.current)==null||i.setLoading(!1),f(!1)}))},[p]),u(()=>{n.current&&n.current.updateData(s)},[s]),u(()=>{const r=n.current;(r==null?void 0:r.setSize)&&r.setSize(e)},[e==null?void 0:e.width,e==null?void 0:e.height]),u(()=>{var r,i;return n.current&&((r=n.current)==null||r.on("onChange",(...a)=>{d==null||d.apply(null,a)}),(i=n.current)==null||i.on("renderZoom",a=>{c&&c(a)})),()=>{var a,l;(a=n.current)==null||a.unbindAll("onChange"),(l=n.current)==null||l.unbindAll("renderZoom")}},[c,d]);const P=m.createElement("div",{ref:v,style:w(w({},e),y)});return m.createElement(L,{spinning:I||O,delay:300},P)};var x=m.forwardRef(j);export{x as default};
|
|
1
|
+
import m,{useState as z,useRef as g,useImperativeHandle as S,useEffect as u}from"react";import{ViewOperation as E,ImgUtils as C}from"@labelbee/lb-annotation";import{Spin as L}from"antd/es";var R=Object.defineProperty,_=Object.getOwnPropertySymbols,A=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable,h=(o,t,e)=>t in o?R(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,w=(o,t)=>{for(var e in t||(t={}))A.call(t,e)&&h(o,e,t[e]);if(_)for(var e of _(t))V.call(t,e)&&h(o,e,t[e]);return o};const Z={width:1280,height:720},j=(o,t)=>{const{size:e=Z,src:p,annotations:s=[],style:b={stroke:"blue",thickness:3},zoomChange:c,backgroundStyle:y={},onChange:d,showLoading:I=!1}=o,[O,f]=z(!1),v=g(null),n=g();S(t,()=>{const r=n.current;return r?{zoomIn:()=>r.zoomChanged(!0),zoomOut:()=>r.zoomChanged(!1),initImgPos:()=>r.initImgPos(),toolInstance:r}:{}},[n.current]),u(()=>(v.current&&(n.current=new E({container:v.current,size:e,style:b,annotations:s,config:"{}"}),n.current.init()),()=>{var r;(r=n.current)==null||r.destroy()}),[]),u(()=>{var r;n.current&&(f(!0),(r=n.current)==null||r.setLoading(!0),C.load(p).then(i=>{var a,l;(a=n.current)==null||a.setLoading(!1),f(!1),(l=n.current)==null||l.setImgNode(i)}).catch(()=>{var i;(i=n.current)==null||i.setLoading(!1),f(!1)}))},[p]),u(()=>{n.current&&n.current.updateData(s)},[s]),u(()=>{const r=n.current;(r==null?void 0:r.setSize)&&r.setSize(e)},[e==null?void 0:e.width,e==null?void 0:e.height]),u(()=>{var r,i;return n.current&&((r=n.current)==null||r.on("onChange",(...a)=>{d==null||d.apply(null,a)}),(i=n.current)==null||i.on("renderZoom",a=>{c&&c(a)})),()=>{var a,l;(a=n.current)==null||a.unbindAll("onChange"),(l=n.current)==null||l.unbindAll("renderZoom")}},[c,d]);const P=m.createElement("div",{ref:v,style:w(w({position:"relative"},e),y)});return m.createElement(L,{spinning:I||O,delay:300},P)};var x=m.forwardRef(j);export{x as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/AnnotationView/index.tsx"],"sourcesContent":["/**\n * 用于标注查看模式\n * @author laoluo\n */\n\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react';\nimport { ViewOperation, ImgUtils } from '@labelbee/lb-annotation';\nimport { Spin } from 'antd/es';\n\ninterface IProps {\n src: string; // 图片路径\n size: {\n width: number;\n height: number;\n };\n style: {\n color?: string;\n fill?: string;\n thickness?: number;\n };\n annotations: any[]; // TODO\n zoomChange?: (zoom: number) => void;\n backgroundStyle: React.CSSProperties;\n onChange?: (type: 'hover' | 'selected', ids: string[]) => void;\n\n showLoading?: boolean;\n}\n\nconst DEFAULT_SIZE = {\n width: 1280,\n height: 720,\n};\n\nconst AnnotationView = (props: IProps, ref: any) => {\n const {\n size = DEFAULT_SIZE,\n src,\n annotations = [],\n style = {\n stroke: 'blue',\n thickness: 3,\n },\n zoomChange,\n backgroundStyle = {},\n onChange,\n showLoading = false,\n } = props;\n const [loading, setLoading] = useState(false);\n const annotationRef = useRef<HTMLDivElement>(null);\n const viewOperation = useRef<ViewOperation>();\n\n useImperativeHandle(\n ref,\n () => {\n const toolInstance = viewOperation.current;\n if (!toolInstance) {\n return {};\n }\n\n return {\n zoomIn: () => toolInstance.zoomChanged(true), // 放大\n zoomOut: () => toolInstance.zoomChanged(false), // 缩小\n initImgPos: () => toolInstance.initImgPos(),\n toolInstance,\n };\n },\n [viewOperation.current],\n );\n\n useEffect(() => {\n if (annotationRef.current) {\n viewOperation.current = new ViewOperation({\n container: annotationRef.current,\n size,\n style,\n annotations,\n config: '{}', // TODO,暂时不需要\n });\n\n viewOperation.current.init();\n }\n\n return () => {\n viewOperation.current?.destroy();\n };\n }, []);\n\n useEffect(() => {\n if (viewOperation.current) {\n setLoading(true);\n viewOperation.current?.setLoading(true);\n ImgUtils.load(src)\n .then((imgNode: HTMLImageElement) => {\n viewOperation.current?.setLoading(false);\n setLoading(false);\n\n viewOperation.current?.setImgNode(imgNode);\n })\n .catch(() => {\n viewOperation.current?.setLoading(false);\n setLoading(false);\n });\n }\n }, [src]);\n\n /**\n * 基础数据绘制监听\n */\n useEffect(() => {\n if (viewOperation.current) {\n viewOperation.current.updateData(annotations);\n }\n }, [annotations]);\n\n /** 窗口大小监听 */\n useEffect(() => {\n const toolInstance = viewOperation.current;\n\n if (toolInstance?.setSize) {\n toolInstance.setSize(size);\n }\n }, [size?.width, size?.height]);\n\n useEffect(() => {\n if (viewOperation.current) {\n viewOperation.current?.on('onChange', (...args: any) => {\n onChange?.apply(null, args);\n });\n\n viewOperation.current?.on('renderZoom', (zoom: number) => {\n if (zoomChange) {\n zoomChange(zoom);\n }\n });\n }\n return () => {\n viewOperation.current?.unbindAll('onChange');\n viewOperation.current?.unbindAll('renderZoom');\n };\n }, [zoomChange, onChange]);\n\n const mainRender = <div ref={annotationRef} style={{ ...size, ...backgroundStyle }}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/AnnotationView/index.tsx"],"sourcesContent":["/**\n * 用于标注查看模式\n * @author laoluo\n */\n\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react';\nimport { ViewOperation, ImgUtils } from '@labelbee/lb-annotation';\nimport { Spin } from 'antd/es';\n\ninterface IProps {\n src: string; // 图片路径\n size: {\n width: number;\n height: number;\n };\n style: {\n color?: string;\n fill?: string;\n thickness?: number;\n };\n annotations: any[]; // TODO\n zoomChange?: (zoom: number) => void;\n backgroundStyle: React.CSSProperties;\n onChange?: (type: 'hover' | 'selected', ids: string[]) => void;\n\n showLoading?: boolean;\n}\n\nconst DEFAULT_SIZE = {\n width: 1280,\n height: 720,\n};\n\nconst AnnotationView = (props: IProps, ref: any) => {\n const {\n size = DEFAULT_SIZE,\n src,\n annotations = [],\n style = {\n stroke: 'blue',\n thickness: 3,\n },\n zoomChange,\n backgroundStyle = {},\n onChange,\n showLoading = false,\n } = props;\n const [loading, setLoading] = useState(false);\n const annotationRef = useRef<HTMLDivElement>(null);\n const viewOperation = useRef<ViewOperation>();\n\n useImperativeHandle(\n ref,\n () => {\n const toolInstance = viewOperation.current;\n if (!toolInstance) {\n return {};\n }\n\n return {\n zoomIn: () => toolInstance.zoomChanged(true), // 放大\n zoomOut: () => toolInstance.zoomChanged(false), // 缩小\n initImgPos: () => toolInstance.initImgPos(),\n toolInstance,\n };\n },\n [viewOperation.current],\n );\n\n useEffect(() => {\n if (annotationRef.current) {\n viewOperation.current = new ViewOperation({\n container: annotationRef.current,\n size,\n style,\n annotations,\n config: '{}', // TODO,暂时不需要\n });\n\n viewOperation.current.init();\n }\n\n return () => {\n viewOperation.current?.destroy();\n };\n }, []);\n\n useEffect(() => {\n if (viewOperation.current) {\n setLoading(true);\n viewOperation.current?.setLoading(true);\n ImgUtils.load(src)\n .then((imgNode: HTMLImageElement) => {\n viewOperation.current?.setLoading(false);\n setLoading(false);\n\n viewOperation.current?.setImgNode(imgNode);\n })\n .catch(() => {\n viewOperation.current?.setLoading(false);\n setLoading(false);\n });\n }\n }, [src]);\n\n /**\n * 基础数据绘制监听\n */\n useEffect(() => {\n if (viewOperation.current) {\n viewOperation.current.updateData(annotations);\n }\n }, [annotations]);\n\n /** 窗口大小监听 */\n useEffect(() => {\n const toolInstance = viewOperation.current;\n\n if (toolInstance?.setSize) {\n toolInstance.setSize(size);\n }\n }, [size?.width, size?.height]);\n\n useEffect(() => {\n if (viewOperation.current) {\n viewOperation.current?.on('onChange', (...args: any) => {\n onChange?.apply(null, args);\n });\n\n viewOperation.current?.on('renderZoom', (zoom: number) => {\n if (zoomChange) {\n zoomChange(zoom);\n }\n });\n }\n return () => {\n viewOperation.current?.unbindAll('onChange');\n viewOperation.current?.unbindAll('renderZoom');\n };\n }, [zoomChange, onChange]);\n\n const mainRender = (\n <div ref={annotationRef} style={{ position: 'relative', ...size, ...backgroundStyle }} />\n );\n\n return (\n <Spin spinning={showLoading || loading} delay={300}>\n {mainRender}\n </Spin>\n );\n\n // return mainRender;\n};\n\nexport default React.forwardRef(AnnotationView);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,eAAe;AAAA,EACnB,OAAO;AAAA,EACP,QAAQ;AAAA;AAGV,MAAM,iBAAiB,CAAC,OAAe,QAAa;AAClD,QAAM;AAAA,IACJ,OAAO;AAAA,IACP;AAAA,IACA,cAAc;AAAA,IACd,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,WAAW;AAAA;AAAA,IAEb;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA,cAAc;AAAA,MACZ;AACJ,QAAM,CAAC,SAAS,cAAc,SAAS;AACvC,QAAM,gBAAgB,OAAuB;AAC7C,QAAM,gBAAgB;AAEtB,sBACE,KACA,MAAM;AACJ,UAAM,eAAe,cAAc;AACnC,QAAI,CAAC,cAAc;AACjB,aAAO;AAAA;AAGT,WAAO;AAAA,MACL,QAAQ,MAAM,aAAa,YAAY;AAAA,MACvC,SAAS,MAAM,aAAa,YAAY;AAAA,MACxC,YAAY,MAAM,aAAa;AAAA,MAC/B;AAAA;AAAA,KAGJ,CAAC,cAAc;AAGjB,YAAU,MAAM;AACd,QAAI,cAAc,SAAS;AACzB,oBAAc,UAAU,IAAI,cAAc;AAAA,QACxC,WAAW,cAAc;AAAA,QACzB;AAAA,QACA;AAAA,QACA;AAAA,QACA,QAAQ;AAAA;AAGV,oBAAc,QAAQ;AAAA;AAGxB,WAAO,MAAM;AAlFjB;AAmFM,0BAAc,YAAd,mBAAuB;AAAA;AAAA,KAExB;AAEH,YAAU,MAAM;AAvFlB;AAwFI,QAAI,cAAc,SAAS;AACzB,iBAAW;AACX,0BAAc,YAAd,mBAAuB,WAAW;AAClC,eAAS,KAAK,KACX,KAAK,CAAC,YAA8B;AA5F7C;AA6FU,6BAAc,YAAd,oBAAuB,WAAW;AAClC,mBAAW;AAEX,4BAAc,YAAd,mBAAuB,WAAW;AAAA,SAEnC,MAAM,MAAM;AAlGrB;AAmGU,6BAAc,YAAd,oBAAuB,WAAW;AAClC,mBAAW;AAAA;AAAA;AAAA,KAGhB,CAAC;AAKJ,YAAU,MAAM;AACd,QAAI,cAAc,SAAS;AACzB,oBAAc,QAAQ,WAAW;AAAA;AAAA,KAElC,CAAC;AAGJ,YAAU,MAAM;AACd,UAAM,eAAe,cAAc;AAEnC,QAAI,6CAAc,SAAS;AACzB,mBAAa,QAAQ;AAAA;AAAA,KAEtB,CAAC,6BAAM,OAAO,6BAAM;AAEvB,YAAU,MAAM;AA3HlB;AA4HI,QAAI,cAAc,SAAS;AACzB,0BAAc,YAAd,mBAAuB,GAAG,YAAY,IAAI,SAAc;AACtD,6CAAU,MAAM,MAAM;AAAA;AAGxB,0BAAc,YAAd,mBAAuB,GAAG,cAAc,CAAC,SAAiB;AACxD,YAAI,YAAY;AACd,qBAAW;AAAA;AAAA;AAAA;AAIjB,WAAO,MAAM;AAvIjB;AAwIM,2BAAc,YAAd,oBAAuB,UAAU;AACjC,2BAAc,YAAd,oBAAuB,UAAU;AAAA;AAAA,KAElC,CAAC,YAAY;AAEhB,QAAM,iDACH,OAAD;AAAA,IAAK,KAAK;AAAA,IAAe,OAAO,+BAAE,UAAU,aAAe,OAAS;AAAA;AAGtE,6CACG,MAAD;AAAA,IAAM,UAAU,eAAe;AAAA,IAAS,OAAO;AAAA,KAC5C;AAAA;AAOP,YAAe,MAAM,WAAW;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@labelbee/lb-components",
|
|
3
|
-
"version": "1.2.3-alpha.
|
|
3
|
+
"version": "1.2.3-alpha.7",
|
|
4
4
|
"description": "Provide a complete library of annotation components",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"es": "./es/index.js",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"email": "brady_luo.sz@foxmail.com"
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
|
-
"@labelbee/lb-annotation": "1.5.4-alpha.
|
|
45
|
+
"@labelbee/lb-annotation": "1.5.4-alpha.7",
|
|
46
46
|
"@ant-design/icons": "^4.6.2",
|
|
47
47
|
"classnames": "^2.3.0",
|
|
48
48
|
"@labelbee/lb-utils": "^1.0.4-alpha.0",
|