refactor: ♻️ array => toArray

packages/x6-vector/src/element/container/clippath-ext.ts

@@ -1,8 +1,8 @@
 import { Attrs } from '../../types'
 import { Adopter } from '../adopter'
+import { Decorator } from '../decorator'
 import { Vector } from '../vector'
 import { VectorElement } from '../element'
-import { Decorator } from '../decorator'
 import { Container } from './container'
 import { ClipPath } from './clippath'
 

packages/x6-vector/src/element/shape/line.ts

@@ -29,38 +29,44 @@ export class Line extends Shape<SVGLineElement> {
     return h == null ? this.bbox().height : this.size(this.bbox().width, h)
   }
 
-  array() {
-    return new PointArray([
-      [this.attr<number>('x1'), this.attr<number>('y1')],
-      [this.attr<number>('x2'), this.attr<number>('y2')],
-    ])
+  size(width: string | number, height: string | number): this
+  size(width: string | number, height: string | number | null | undefined): this
+  size(width: string | number | null | undefined, height: string | number): this
+  size(width?: string | number | null, height?: string | number | null) {
+    const p = Util.proportionalSize(this, width, height)
+    return this.plot(this.toPointArray().size(p.width, p.height))
   }
 
   move(x: number | string, y: number | string) {
-    return this.attr(this.array().move(x, y).toLine())
+    return this.plot(this.toPointArray().move(x, y))
   }
 
-  plot(): PointArray
-  plot(points: [[number, number], [number, number]]): this
+  plot(): Line.Array
+  plot(points: Line.Array | PointArray): this
   plot(x1: number, y1: number, x2: number, y2: number): this
   plot(
-    x1?: [[number, number], [number, number]] | number,
+    x1?: Line.Array | PointArray | number,
     y1?: number,
     x2?: number,
     y2?: number,
   ): this
   plot(
-    x1?: [[number, number], [number, number]] | number,
+    x1?: Line.Array | PointArray | number,
     y1?: number,
     x2?: number,
     y2?: number,
   ) {
     if (x1 == null) {
-      return this.array()
+      return this.toArray()
     }
 
     const attrs = Array.isArray(x1)
-      ? new PointArray(x1).toLine()
+      ? {
+          x1: x1[0][0],
+          y1: x1[0][1],
+          x2: x1[1][0],
+          y2: x1[1][1],
+        }
       : {
           x1,
           y1,
@@ -71,21 +77,23 @@ export class Line extends Shape<SVGLineElement> {
     return this.attr(attrs)
   }
 
-  size(width: string | number, height: string | number): this
-  size(width: string | number, height: string | number | null | undefined): this
-  size(width: string | number | null | undefined, height: string | number): this
-  size(width?: string | number | null, height?: string | number | null) {
-    const p = Util.proportionalSize(this, width, height)
-    return this.attr(this.array().size(p.width, p.height).toLine())
+  toArray(): Line.Array {
+    return [
+      [this.attr<number>('x1'), this.attr<number>('y1')],
+      [this.attr<number>('x2'), this.attr<number>('y2')],
+    ]
+  }
+
+  toPointArray() {
+    return new PointArray(this.toArray())
   }
 }
 
 export namespace Line {
+  export type Array = [[number, number], [number, number]]
+
   export function create(attrs?: Attrs | null): Line
-  export function create(
-    points: [[number, number], [number, number]],
-    attrs?: Attrs | null,
-  ): Line
+  export function create(points: Array, attrs?: Attrs | null): Line
   export function create(
     x1: number,
     y1: number,
@@ -94,14 +102,14 @@ export namespace Line {
     attrs?: Attrs | null,
   ): Line
   export function create(
-    x1?: [[number, number], [number, number]] | number | Attrs | null,
+    x1?: Array | number | Attrs | null,
     y1?: number | Attrs | null,
     x2?: number,
     y2?: number,
     attrs?: Attrs | null,
   ): Line
   export function create(
-    x1?: [[number, number], [number, number]] | number | Attrs | null,
+    x1?: Array | number | Attrs | null,
     y1?: number | Attrs | null,
     x2?: number,
     y2?: number,

packages/x6-vector/src/element/shape/path.ts

@@ -33,22 +33,15 @@ export class Path extends Shape<SVGPathElement> {
     return h == null ? this.bbox().height : this.size(this.bbox().width, h)
   }
 
-  array() {
-    if (this.arr == null) {
-      this.arr = new PathArray(this.attr('d'))
-    }
-    return this.arr
-  }
-
   move(x: number | string, y: number | string) {
-    return this.attr('d', this.array().move(x, y).toString())
+    return this.attr('d', this.toPathArray().move(x, y).toString())
   }
 
-  plot(): PathArray
+  plot(): Path.Segment[]
   plot(d: string | Path.Segment[] | PathArray): this
   plot(d?: string | Path.Segment[] | PathArray) {
     if (d == null) {
-      return this.array()
+      return this.toArray()
     }
 
     this.arr = null
@@ -68,7 +61,7 @@ export class Path extends Shape<SVGPathElement> {
   size(width: string | number | null | undefined, height: string | number): this
   size(width?: string | number | null, height?: string | number | null) {
     const p = Util.proportionalSize(this, width, height)
-    return this.attr('d', this.array().size(p.width, p.height).toString())
+    return this.attr('d', this.toPathArray().size(p.width, p.height).toString())
   }
 
   length() {
@@ -78,6 +71,17 @@ export class Path extends Shape<SVGPathElement> {
   pointAt(length: number) {
     return new Point(this.node.getPointAtLength(length))
   }
+
+  toArray() {
+    return this.toPathArray().toArray()
+  }
+
+  toPathArray() {
+    if (this.arr == null) {
+      this.arr = new PathArray(this.attr('d'))
+    }
+    return this.arr
+  }
 }
 
 export namespace Path {

packages/x6-vector/src/element/shape/poly.ts

@@ -31,24 +31,17 @@ export class Poly<
     return h == null ? this.bbox().height : this.size(this.bbox().width, h)
   }
 
-  array() {
-    if (this.arr == null) {
-      this.arr = new PointArray(this.attr('points'))
-    }
-    return this.arr
-  }
-
   move(x: number | string, y: number | string) {
-    return this.attr('points', this.array().move(x, y).toString())
+    return this.attr('points', this.toPointArray().move(x, y).toString())
   }
 
-  plot(): PointArray
+  plot(): [number, number][]
   plot(d: string): this
   plot(points: [number, number][]): this
   plot(points: string | [number, number][]): this
   plot(d?: string | [number, number][]) {
     if (d == null) {
-      return this.array()
+      return this.toArray()
     }
 
     this.arr = null
@@ -68,6 +61,20 @@ export class Poly<
   size(width: string | number | null | undefined, height: string | number): this
   size(width?: string | number | null, height?: string | number | null) {
     const s = Util.proportionalSize(this, width, height)
-    return this.attr('points', this.array().size(s.width, s.height).toString())
+    return this.attr(
+      'points',
+      this.toPointArray().size(s.width, s.height).toString(),
+    )
+  }
+
+  toArray() {
+    return this.toPointArray().toArray()
+  }
+
+  toPointArray() {
+    if (this.arr == null) {
+      this.arr = new PointArray(this.attr('points'))
+    }
+    return this.arr
   }
 }

packages/x6-vector/src/element/shape/text.ts

@@ -2,7 +2,7 @@ import { Attrs } from '../../types'
 import { Global } from '../../global'
 import { UNumber } from '../../struct/unumber'
 import { Adopter } from '../adopter'
-import { Tspan } from './tspan'
+import { TSpan } from './tspan'
 import { TextBase } from './text-base'
 
 @Text.register('Text')
@@ -77,7 +77,7 @@ export class Text<
     if (this.rebuilding) {
       let blankLineOffset = 0
       const leading = this.leading()
-      this.eachChild<Tspan>((child, index) => {
+      this.eachChild<TSpan>((child, index) => {
         const fontSize = Global.window
           .getComputedStyle(this.node)
           .getPropertyValue('font-size')
@@ -103,8 +103,8 @@ export class Text<
   }
 
   text(): string
-  text(text: string | ((this: Tspan, tspan: Tspan) => void)): this
-  text(text?: string | ((this: Tspan, tspan: Tspan) => void)) {
+  text(text: string | ((this: TSpan, tspan: TSpan) => void)): this
+  text(text?: string | ((this: TSpan, tspan: TSpan) => void)) {
     // getter
     if (text === undefined) {
       const children = this.node.childNodes
@@ -124,7 +124,7 @@ export class Text<
         if (
           index !== firstLine &&
           children[index].nodeType !== 3 &&
-          Adopter.adopt<Tspan>(children[index]).assets.newLined === true
+          Adopter.adopt<TSpan>(children[index]).assets.newLined === true
         ) {
           content += '\n'
         }

packages/x6-vector/src/element/shape/textpath.ts

@@ -4,11 +4,6 @@ import { Path } from './path'
 
 Text.register('TextPath')
 export class TextPath extends Text<SVGTextPathElement> {
-  array() {
-    const track = this.track()
-    return track ? track.array() : null
-  }
-
   plot(): PathArray
   plot(d: string | Path.Segment[] | PathArray): this
   plot(d?: string | Path.Segment[] | PathArray) {
@@ -26,4 +21,14 @@ export class TextPath extends Text<SVGTextPathElement> {
   track() {
     return this.reference<Path>('href')
   }
+
+  toArray() {
+    const track = this.track()
+    return track ? track.toArray() : null
+  }
+
+  toPathArray() {
+    const track = this.track()
+    return track ? track.toPathArray() : null
+  }
 }

packages/x6-vector/src/element/shape/tspan-ext.ts

@@ -1,12 +1,12 @@
 import { Attrs } from '../../types'
 import { TextBase } from './text-base'
-import { Tspan } from './tspan'
+import { TSpan } from './tspan'
 
 export class TextExtension<
   TSVGTextElement extends SVGTextElement | SVGTSpanElement | SVGTextPathElement
 > extends TextBase<TSVGTextElement> {
   tspan(text = '', attrs?: Attrs | null) {
-    const tspan = Tspan.create(text, attrs)
+    const tspan = TSpan.create(text, attrs)
 
     if (!this.building) {
       this.clear()

packages/x6-vector/src/element/shape/tspan.ts

@@ -3,8 +3,8 @@ import { Global } from '../../global'
 import { TextBase } from './text-base'
 import { Text } from './text'
 
-@Tspan.register('Tspan')
-export class Tspan extends TextBase<SVGTSpanElement> {
+@TSpan.register('Tspan')
+export class TSpan extends TextBase<SVGTSpanElement> {
   public assets: Record<string | number, any> & {
     leading?: number
     newLined?: boolean
@@ -40,8 +40,8 @@ export class Tspan extends TextBase<SVGTSpanElement> {
   }
 
   text(): string
-  text(text: string | ((this: Tspan, tspan: Tspan) => void)): this
-  text(text?: string | ((this: Tspan, tspan: Tspan) => void)) {
+  text(text: string | ((this: TSpan, tspan: TSpan) => void)): this
+  text(text?: string | ((this: TSpan, tspan: TSpan) => void)) {
     if (text == null) {
       return this.node.textContent + (this.assets.newLined ? '\n' : '')
     }
@@ -58,12 +58,12 @@ export class Tspan extends TextBase<SVGTSpanElement> {
   }
 }
 
-export namespace Tspan {
-  export function create(): Tspan
-  export function create(attrs: Attrs | null): Tspan
-  export function create(text: string, attrs?: Attrs | null): Tspan
+export namespace TSpan {
+  export function create(): TSpan
+  export function create(attrs: Attrs | null): TSpan
+  export function create(text: string, attrs?: Attrs | null): TSpan
   export function create(text?: string | Attrs | null, attrs?: Attrs | null) {
-    const tspan = new Tspan()
+    const tspan = new TSpan()
     if (text != null) {
       if (typeof text === 'string') {
         tspan.text(text)

packages/x6-vector/src/struct/point-array.test.ts

@@ -173,11 +173,4 @@ describe('PointArray', () => {
       expect(square.toString()).toEqual(squareString)
     })
   })
-
-  describe('toLine', () => {
-    it('should return an object which can be passed to a line as point attributes', () => {
-      const arr = new PointArray([1, 2, 3, 4])
-      expect(arr.toLine()).toEqual({ x1: 1, y1: 2, x2: 3, y2: 4 })
-    })
-  })
 })

packages/x6-vector/src/struct/point-array.ts

@@ -76,15 +76,6 @@ export class PointArray extends TArray<[number, number]> {
     return this
   }
 
-  toLine() {
-    return {
-      x1: this[0][0],
-      y1: this[0][1],
-      x2: this[1][0],
-      y2: this[1][1],
-    }
-  }
-
   toString() {
     return this.map((item) => item.join(',')).join(' ')
   }