@thi.ng/hiccup-svg 5.2.36 → 5.3.0

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # Change Log
 
-- **Last updated**: 2024-04-23T07:02:18Z
+- **Last updated**: 2024-06-21T19:34:38Z
 - **Generator**: [thi.ng/monopub](https://thi.ng/monopub)
 
 All notable changes to this project will be documented in this file.
@@ -9,6 +9,17 @@ See [Conventional Commits](https://conventionalcommits.org/) for commit guidelin
 **Note:** Unlisted _patch_ versions only involve non-code or otherwise excluded changes
 and/or version bumps of transitive dependencies.
 
+## [5.3.0](https://github.com/thi-ng/umbrella/tree/@thi.ng/hiccup-svg@5.3.0) (2024-06-21)
+
+#### 🚀 Features
+
+- add fillRule attrib conversion support ([9277417](https://github.com/thi-ng/umbrella/commit/9277417))
+
+#### ♻️ Refactoring
+
+- rename various rest args to be more semantically meaningful ([8088a56](https://github.com/thi-ng/umbrella/commit/8088a56))
+- enforce uniform naming convention of internal functions ([56992b2](https://github.com/thi-ng/umbrella/commit/56992b2))
+
 ### [5.2.34](https://github.com/thi-ng/umbrella/tree/@thi.ng/hiccup-svg@5.2.34) (2024-04-20)
 
 #### ♻️ Refactoring

package/README.md

@@ -7,7 +7,7 @@
 [![Mastodon Follow](https://img.shields.io/mastodon/follow/109331703950160316?domain=https%3A%2F%2Fmastodon.thi.ng&style=social)](https://mastodon.thi.ng/@toxi)
 
 > [!NOTE]
-> This is one of 192 standalone projects, maintained as part
+> This is one of 193 standalone projects, maintained as part
 > of the [@thi.ng/umbrella](https://github.com/thi-ng/umbrella/) monorepo
 > and anti-framework.
 >
@@ -179,7 +179,7 @@ For Node.js REPL:
 const svg = await import("@thi.ng/hiccup-svg");
 ```
 
-Package sizes (brotli'd, pre-treeshake): ESM: 2.46 KB
+Package sizes (brotli'd, pre-treeshake): ESM: 2.47 KB
 
 ## Dependencies
 
@@ -205,6 +205,7 @@ directory are using this package:
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/package-stats.png" width="240"/>                 | CLI util to visualize umbrella pkg stats                                    |                                                          | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/package-stats)      |
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/pointfree-svg.png" width="240"/>                 | Generate SVG using pointfree DSL                                            |                                                          | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/pointfree-svg)      |
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/poly-spline.png" width="240"/>                   | Polygon to cubic curve conversion & visualization                           | [Demo](https://demo.thi.ng/umbrella/poly-spline/)        | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/poly-spline)        |
+| <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/rdom-reactive-svg.jpg" width="240"/>             | Animated SVG elements with reactive attributes                              | [Demo](https://demo.thi.ng/umbrella/rdom-reactive-svg/)  | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/rdom-reactive-svg)  |
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/rdom-svg-nodes.png" width="240"/>                | rdom powered SVG graph with draggable nodes                                 | [Demo](https://demo.thi.ng/umbrella/rdom-svg-nodes/)     | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/rdom-svg-nodes)     |
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/rstream-grid.jpg" width="240"/>                  | Interactive grid generator, SVG generation & export, undo/redo support      | [Demo](https://demo.thi.ng/umbrella/rstream-grid/)       | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/rstream-grid)       |
 | <img src="https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/examples/svg-resample.png" width="240"/>                  | SVG path parsing & dynamic resampling                                       | [Demo](https://demo.thi.ng/umbrella/svg-resample/)       | [Source](https://github.com/thi-ng/umbrella/tree/develop/examples/svg-resample)       |

package/convert.js

@@ -17,6 +17,7 @@ const ATTRIB_ALIASES = {
   alpha: "opacity",
   dash: "stroke-dasharray",
   dashOffset: "stroke-dashoffset",
+  fillRule: "fill-rule",
   lineCap: "stroke-linecap",
   lineJoin: "stroke-linejoin",
   miterLimit: "stroke-miterlimit",
@@ -35,8 +36,7 @@ const BASE_LINE = {
 };
 const precisionStack = [];
 const convertTree = (tree) => {
-  if (tree == null)
-    return null;
+  if (tree == null) return null;
   if (implementsFunction(tree, "toHiccup")) {
     return convertTree(tree.toHiccup());
   }
@@ -44,7 +44,7 @@ const convertTree = (tree) => {
   if (isArray(type)) {
     return tree.map(convertTree);
   }
-  let attribs = convertAttribs(tree[1]);
+  let attribs = __convertAttribs(tree[1]);
   if (attribs.__prec) {
     precisionStack.push(PRECISION);
     setPrecision(attribs.__prec);
@@ -56,8 +56,7 @@ const convertTree = (tree) => {
     case "a":
     case "g":
       result = [type, fattribs(attribs)];
-      if (tree[0] === "g")
-        __groupLayerID(result[1]);
+      if (tree[0] === "g") __groupLayerID(result[1]);
       for (let i = 2, n = tree.length; i < n; i++) {
         const c = convertTree(tree[i]);
         c != null && result.push(c);
@@ -164,22 +163,21 @@ const convertTree = (tree) => {
   }
   return result;
 };
-const convertAttribs = (attribs) => {
+const __convertAttribs = (attribs) => {
   const res = {};
-  if (!attribs)
-    return res;
+  if (!attribs) return res;
   for (let id in attribs) {
     const v = attribs[id];
     const aid = ATTRIB_ALIASES[id];
     if (aid) {
       res[aid] = v;
     } else {
-      convertAttrib(res, id, v);
+      __convertAttrib(res, id, v);
     }
   }
   return res;
 };
-const convertAttrib = (res, id, v) => {
+const __convertAttrib = (res, id, v) => {
   switch (id) {
     case "font": {
       const i = v.indexOf(" ");

package/format.d.ts

@@ -42,7 +42,7 @@ export declare const fpoints: (pts: Vec2Like[], sep?: string) => string;
  *
  * Additional attribute names given (via rest args) will be formatted as numeric
  * values (using configured precision, see {@link setPrecision}). Formatting is
- * done via {@link numericAttribs}.
+ * done via {@link __numericAttribs}.
  *
  * Returns updated attribs or `undefined` if `attribs` itself is null-ish.
  *

package/format.js

@@ -12,7 +12,7 @@ const DEFAULT_NUMERIC_IDS = [
   "stroke-width",
   "stroke-miterlimit"
 ];
-const numericAttribs = (attribs, ids) => {
+const __numericAttribs = (attribs, ids) => {
   let v;
   for (let id of DEFAULT_NUMERIC_IDS.concat(ids)) {
     typeof (v = attribs[id]) === "number" && (attribs[id] = ff(v));
@@ -20,15 +20,14 @@ const numericAttribs = (attribs, ids) => {
   return attribs;
 };
 const fattribs = (attribs, ...numericIDs) => {
-  if (!attribs)
-    return;
-  const res = ftransforms(attribs);
+  if (!attribs) return;
+  const res = __ftransforms(attribs);
   let v;
   (v = attribs.fill) && (res.fill = fcolor(v));
   (v = attribs.stroke) && (res.stroke = fcolor(v));
-  return numericAttribs(attribs, numericIDs);
+  return __numericAttribs(attribs, numericIDs);
 };
-const ftransforms = (attribs) => {
+const __ftransforms = (attribs) => {
   let v;
   if ((v = attribs.transform) || attribs.translate || attribs.scale != null || attribs.rotate) {
     if (v) {
@@ -37,12 +36,12 @@ const ftransforms = (attribs) => {
       delete attribs.rotate;
       delete attribs.scale;
     } else {
-      attribs.transform = buildTransform(attribs);
+      attribs.transform = __buildTransform(attribs);
     }
   }
   return attribs;
 };
-const buildTransform = (attribs) => {
+const __buildTransform = (attribs) => {
   const tx = [];
   let v;
   if (v = attribs.translate) {

package/gradients.js

@@ -1,11 +1,7 @@
 import { fattribs, fcolor, ff } from "./format.js";
 const RE_ALPHA_COLOR = /(rgb|hsl)a\(([a-z0-9.-]+),([0-9.%]+),([0-9.%]+),([0-9.]+)\)/;
-const gradient = (type, attribs, stops) => [
-  type,
-  fattribs(attribs),
-  ...stops.map(gradientStop)
-];
-const gradientStop = ([offset, col]) => {
+const __gradient = (type, attribs, stops) => [type, fattribs(attribs), ...stops.map(__gradientStop)];
+const __gradientStop = ([offset, col]) => {
   col = fcolor(col);
   let opacity;
   const parts = RE_ALPHA_COLOR.exec(col);
@@ -15,7 +11,7 @@ const gradientStop = ([offset, col]) => {
   }
   return ["stop", { offset, "stop-color": col, "stop-opacity": opacity }];
 };
-const linearGradient = (id, from, to, stops, attribs) => gradient(
+const linearGradient = (id, from, to, stops, attribs) => __gradient(
   "linearGradient",
   {
     ...attribs,
@@ -27,7 +23,7 @@ const linearGradient = (id, from, to, stops, attribs) => gradient(
   },
   stops
 );
-const radialGradient = (id, from, to, fr, r, stops, attribs) => gradient(
+const radialGradient = (id, from, to, fr, r, stops, attribs) => __gradient(
   "radialGradient",
   {
     ...attribs,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thi.ng/hiccup-svg",
-  "version": "5.2.36",
+  "version": "5.3.0",
   "description": "SVG element functions for @thi.ng/hiccup & related tooling",
   "type": "module",
   "module": "./index.js",
@@ -10,7 +10,7 @@
     "type": "git",
     "url": "https://github.com/thi-ng/umbrella.git"
   },
-  "homepage": "https://github.com/thi-ng/umbrella/tree/develop/packages/hiccup-svg#readme",
+  "homepage": "https://thi.ng/hiccup-svg",
   "funding": [
     {
       "type": "github",
@@ -36,16 +36,16 @@
     "tool:tangle": "../../node_modules/.bin/tangle src/**/*.ts"
   },
   "dependencies": {
-    "@thi.ng/api": "^8.11.1",
-    "@thi.ng/checks": "^3.6.3",
-    "@thi.ng/color": "^5.6.44",
-    "@thi.ng/prefixes": "^2.3.18"
+    "@thi.ng/api": "^8.11.3",
+    "@thi.ng/checks": "^3.6.5",
+    "@thi.ng/color": "^5.6.46",
+    "@thi.ng/prefixes": "^2.3.20"
   },
   "devDependencies": {
-    "@microsoft/api-extractor": "^7.43.0",
-    "esbuild": "^0.20.2",
-    "typedoc": "^0.25.12",
-    "typescript": "^5.4.3"
+    "@microsoft/api-extractor": "^7.47.0",
+    "esbuild": "^0.21.5",
+    "typedoc": "^0.25.13",
+    "typescript": "^5.5.2"
   },
   "keywords": [
     "arc",
@@ -137,5 +137,5 @@
     "parent": "@thi.ng/hiccup",
     "year": 2016
   },
-  "gitHead": "aed3421c21044c005fbcb7cc37965ccf85a870d2\n"
+  "gitHead": "154c95cf9d6bab32174498ec3b5b5d87e42be7f9\n"
 }

package/points.js

@@ -5,7 +5,7 @@ const points = (pts, shape, size = 1, attribs, ...body) => {
     fattribs(withoutKeys(attribs, /* @__PURE__ */ new Set(["shape", "size"]))),
     ...body
   ];
-  const href = buildSymbol(group, shape, size);
+  const href = __buildSymbol(group, shape, size);
   for (let p of pts) {
     group.push(["use", { "xlink:href": href, x: ff(p[0]), y: ff(p[1]) }]);
   }
@@ -30,7 +30,7 @@ const packedPoints = (pts, shape, size = 1, attribs, ...body) => {
     ),
     ...body
   ];
-  const href = buildSymbol(group, shape, size);
+  const href = __buildSymbol(group, shape, size);
   for (let i = start; num-- > 0; i += estride) {
     group.push([
       "use",
@@ -39,18 +39,18 @@ const packedPoints = (pts, shape, size = 1, attribs, ...body) => {
   }
   return group;
 };
-const buildSymbol = (group, shape, size) => {
+const __buildSymbol = (group, shape, size) => {
   let href;
   if (!shape || shape[0] !== "#") {
     href = "_" + (Math.random() * 1e6 | 0).toString(36);
-    group.push(["g", { opacity: 0 }, buildShape(shape, href, size)]);
+    group.push(["g", { opacity: 0 }, __buildShape(shape, href, size)]);
     href = "#" + href;
   } else {
     href = shape;
   }
   return href;
 };
-const buildShape = (shape, id, r) => {
+const __buildShape = (shape, id, r) => {
   const rf = ff(r);
   if (shape === "circle") {
     return ["circle", { id, cx: 0, cy: 0, r: rf }];

package/text.d.ts

@@ -1,3 +1,3 @@
 import type { Vec2Like } from "./api.js";
-export declare const text: (p: Vec2Like, body: string, attribs?: any, ...xs: any[]) => any[];
+export declare const text: (p: Vec2Like, body: string, attribs?: any, ...children: any[]) => any[];
 //# sourceMappingURL=text.d.ts.map

package/text.js

@@ -1,5 +1,5 @@
 import { fattribs, ff } from "./format.js";
-const text = (p, body, attribs, ...xs) => [
+const text = (p, body, attribs, ...children) => [
   "text",
   fattribs({
     ...attribs,
@@ -7,7 +7,7 @@ const text = (p, body, attribs, ...xs) => [
     y: ff(p[1])
   }),
   body,
-  ...xs
+  ...children
 ];
 export {
   text