feat: component type

FliPPeDround · Aug 20, 2024 · d67f67d · d67f67d
1 parent 1c04222
commit d67f67d
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 12 deletions.
diff --git a/examples/vue3/src/App.vue b/examples/vue3/src/App.vue
@@ -22,17 +22,27 @@ function changeWidth() {
         />
       </Leafer>
       <Leafer fill="red">
-        <Rect
-          v-bind="{ x: 100, y: 100, fill: '#32cd79', draggable: true, visible: show }"
-        />
-        <Text
-          v-bind="{ x: 210, y: 100, fill: '#32cd79', draggable: true, text: 'text' }"
-        />
+        <Group :draggable="true">
+          <Rect
+            v-bind="{ x: 100, y: 200, stroke: 'blue' }"
+          />
+          <Star
+            v-bind="{
+              x: 100,
+              y: 200,
+              width: 100,
+              fill: '#32cd79',
+            }"
+          />
+        </Group>
       </Leafer>
       <Leafer type="draw" fill="red" @tap="rightMove">
-        <Rect
-          v-bind="{ x: 200, y: 200, stroke: 'blue', draggable: true }"
-        />
+        <Box>
+          <Rect
+            v-bind="{ x: 0, y: 200, stroke: 'blue', draggable: true }"
+          />
+          <Star />
+        </Box>
       </Leafer>
     </LeaferApp>
     <button @click="changeWidth">

diff --git a/packages/vue3/compiler.ts b/packages/vue3/compiler.ts
@@ -14,7 +14,6 @@ const elementNames = [
   'Pen',
 
   'Image',
-  'SVG',
   'Canvas',
 
   'Text',

diff --git a/packages/vue3/types/index.ts b/packages/vue3/types/index.ts
@@ -1,9 +1,27 @@
-import type { ILeaferConfig, IRectInputData } from '@leafer-ui/interface'
+import type { IAppInputData, IBoxInputData, ICanvasInputData, IEllipseInputData, IFrameInputData, IGroupInputData, IImageInputData, ILeaferInputData, ILineInputData, IPathInputData, IPenInputData, IPolygonInputData, IRectInputData, IStarInputData, ITextInputData } from '@leafer-ui/interface'
 import type { LeaferVueComponent } from './LeaferVueComponent'
 
 interface LeaferVueComponents {
-  LeaferApp: LeaferVueComponent<ILeaferConfig>
+  LeaferApp: LeaferVueComponent<IAppInputData>
+
+  Leafer: LeaferVueComponent<ILeaferInputData>
+  Frame: LeaferVueComponent<IFrameInputData>
+  Box: LeaferVueComponent<IBoxInputData>
+  Group: LeaferVueComponent<IGroupInputData>
+
   Rect: LeaferVueComponent<IRectInputData>
+  Ellipse: LeaferVueComponent<IEllipseInputData>
+  Polygon: LeaferVueComponent<IPolygonInputData>
+  Star: LeaferVueComponent<IStarInputData>
+  Line: LeaferVueComponent<ILineInputData>
+
+  Path: LeaferVueComponent<IPathInputData>
+  Pen: LeaferVueComponent<IPenInputData>
+
+  Image: LeaferVueComponent<IImageInputData>
+  Canvas: LeaferVueComponent<ICanvasInputData>
+
+  Text: LeaferVueComponent<ITextInputData>
 }
 
 declare module 'vue' {
-Original file line number
+Diff line change
@@ Expand Up / @@ -14,7 +14,6 @@ const elementNames = [ @@
       'Pen',
       'Image',
-      'SVG',
       'Canvas',
       'Text',
@@ Expand Down @@