chore(core): Cleaned up renderprops

packages/core/src/attributes.mjs

@@ -60,15 +60,22 @@ Attributes.prototype.asPropsIfPrefixIs = function (prefix = '') {
  * @return {object} attributes - A plain object representing the attributes
  */
 Attributes.prototype.asRenderProps = function () {
-  return {
+  const props = {
     list: this.list,
     forSvg: this.render(),
-    forCss: this.renderAsCss(),
-    circle: this.getAsArray('data-circle'),
-    circleProps: this.asPropsIfPrefixIs('data-circle-'),
-    text: this.getAsArray('data-text'),
-    textProps: this.asPropsIfPrefixIs('data-text-'),
   }
+  const circle = this.getAsArray('data-circle')
+  if (circle) {
+    props.circle = circle
+    props.circleProps = this.asPropsIfPrefixIs('data-circle-')
+  }
+  const text = this.getAsArray('data-text')
+  if (text) {
+    props.text = text
+    props.textProps = this.asPropsIfPrefixIs('data-text-')
+  }
+
+  return props
 }
 
 /**

packages/core/src/path.mjs

@@ -111,6 +111,16 @@ Path.prototype.asPathstring = function () {
   return d
 }
 
+// Quick helper to return a drawing op as renderProps
+const opAsrenderProp = (op) => {
+  const props = { type: op.type }
+  for (const p of ['from', 'to', 'cp1', 'cp2']) {
+    if (op[p]) props[p] = op[p].asRenderProps()
+  }
+
+  return props
+}
+
 /**
  * Returns a path as an object suitable for inclusion in renderprops
  *
@@ -121,7 +131,7 @@ Path.prototype.asRenderProps = function () {
     attributes: this.attributes.asRenderProps(),
     hidden: this.hidden,
     name: this.name,
-    ops: this.ops,
+    ops: this.ops.map((op) => opAsrenderProp(op)),
     topLeft: this.topLeft,
     bottomRight: this.bottomRight,
     width: this.bottomRight.x - this.topLeft.x,

packages/core/src/svg.mjs

@@ -50,7 +50,7 @@ Svg.prototype.asRenderProps = function () {
     layout: this.layout,
     body: this.body,
     style: this.style,
-    defs: this.defs,
+    defs: this.defs.asRenderProps(),
   }
 }