@_unit/unit 1.0.23 → 1.0.24

package/src/system/platform/component/svg/Object/Component.ts

@@ -0,0 +1,107 @@
+import { namespaceURI } from '../../../../../client/component/namespaceURI'
+import { Element } from '../../../../../client/element'
+import { PropHandler } from '../../../../../client/propHandler'
+import { applyStyle } from '../../../../../client/style'
+import { System } from '../../../../../system'
+import { Style } from '../../../Props'
+
+export interface Props {
+  id?: string
+  className?: string
+  style?: Style
+  d?: string
+  markerStart?: string
+  markerEnd?: string
+  fillRule?: string
+}
+
+export const DEFAULT_STYLE = {
+  strokeWidth: '3px',
+  fill: 'none',
+  stroke: 'currentColor',
+}
+
+export default class SVGObject extends Element<SVGPathElement, Props> {
+  private _path_el: SVGPathElement
+
+  private _prop_handler: PropHandler = {
+    className: (className: string | undefined) => {
+      this._path_el.className.value = className
+    },
+    style: (style: Style | undefined) => {
+      applyStyle(this._path_el, { ...DEFAULT_STYLE, ...style })
+    },
+    d: (d: string | undefined) => {
+      if (d === undefined) {
+        this._path_el.removeAttribute('d')
+      } else {
+        this._path_el.setAttribute('d', d)
+      }
+    },
+    markerStart: (markerStart: string | undefined) => {
+      this._path_el.setAttribute('marker-start', markerStart)
+    },
+    markerEnd: (markerEnd: string | undefined) => {
+      this._path_el.setAttribute('marker-end', markerEnd)
+    },
+    strokeWidth: (strokeWidth: string | undefined) => {
+      if (strokeWidth === undefined) {
+        this._path_el.removeAttribute('stroke-width')
+      } else {
+        this._path_el.setAttribute('stroke-width', `${strokeWidth}`)
+      }
+    },
+    fillRule: (fillRule: string | undefined) => {
+      if (fillRule === undefined) {
+        this._path_el.removeAttribute('fill-rule')
+      } else {
+        this._path_el.setAttribute('fill-rule', fillRule)
+      }
+    },
+  }
+
+  constructor($props: Props, $system: System) {
+    super($props, $system)
+
+    const {
+      id,
+      className,
+      style = {},
+      d = '',
+      markerStart,
+      markerEnd,
+      fillRule,
+    } = $props
+
+    const path_el = this.$system.api.document.createElementNS(
+      namespaceURI,
+      'path'
+    )
+    if (id !== undefined) {
+      path_el.id = id
+    }
+    if (className) {
+      path_el.classList.value = className
+    }
+    applyStyle(path_el, { ...DEFAULT_STYLE, ...style })
+    path_el.setAttribute('d', d)
+    if (markerStart !== undefined) {
+      path_el.setAttribute('marker-start', markerStart)
+    }
+    if (markerEnd !== undefined) {
+      path_el.setAttribute('marker-end', markerEnd)
+    }
+    if (fillRule !== undefined) {
+      path_el.setAttribute('fill-rule', fillRule)
+    }
+    this._path_el = path_el
+
+    this.$element = path_el
+    this.$unbundled = false
+    this.$primitive = true
+  }
+
+  onPropChanged(prop: string, current: any): void {
+    this._prop_handler[prop](current)
+  }
+}

package/src/system/platform/component/svg/Object/index.ts

@@ -0,0 +1,30 @@
+import { Element_ } from '../../../../../Class/Element'
+import { System } from '../../../../../system'
+import { Dict } from '../../../../../types/Dict'
+import { ID_PATH } from '../../../../_ids'
+
+export interface I {
+  style: Dict<string>
+  d: string
+  fillRule: string
+}
+
+export interface O {}
+
+export default class SVGObject extends Element_<I, O> {
+  constructor(system: System) {
+    super(
+      {
+        i: ['style', 'd', 'fillRule'],
+        o: [],
+      },
+      {},
+      system,
+      ID_PATH
+    )
+
+    this._defaultState = {
+      d: '',
+    }
+  }
+}

package/src/system/platform/component/svg/Object/spec.json

@@ -0,0 +1,37 @@
+{
+  "name": "svg object",
+  "inputs": {
+    "style": {
+      "type": "object",
+      "optional": true
+    },
+    "d": {
+      "type": "string",
+      "optional": true,
+      "metadata": {
+        "examples": []
+      }
+    },
+    "fillRule": {
+      "type": "string",
+      "optional": true,
+      "defaultIgnored": true
+    }
+  },
+  "outputs": {},
+  "metadata": {
+    "icon": "square",
+    "description": "SVG path",
+    "complexity": 43,
+    "tags": ["platform", "component", "svg"]
+  },
+  "id": "c90ea697-ba4f-48ca-85e0-d9f26731e33e",
+  "base": true,
+  "component": {
+    "defaultWidth": 200,
+    "defaultHeight": 200
+  },
+  "type": "`U`&`C`&`V`&`J`",
+  "system": true,
+  "render": true
+}

package/src/types/global/IPositionObserver.ts

@@ -20,7 +20,11 @@ export interface IPositionCallback {
     ry: number,
     rz: number,
     px: number,
-    py: number
+    py: number,
+    gpx: number,
+    gpy: number,
+    gbx: number,
+    gby: number
   ): void
 }
 
@@ -34,4 +38,8 @@ export interface IPositionEntry {
   rz: number
   px: number
   py: number
+  gpx: number
+  gpy: number
+  gbx: number
+  gby: number
 }