diff --git a/packages/examples/package.json b/packages/examples/package.json index c093dbf0674..36a6af0e1ac 100644 --- a/packages/examples/package.json +++ b/packages/examples/package.json @@ -71,6 +71,7 @@ }, "files": [ "dist/*", + "scr/*", "README.md", "package.json" ], diff --git a/packages/examples/src/path_ops.js b/packages/examples/src/path_ops.js index 1f3bbdcabc9..e9cc61c48df 100644 --- a/packages/examples/src/path_ops.js +++ b/packages/examples/src/path_ops.js @@ -1,9 +1,12 @@ export default part => { - let { Point, points, Path, paths } = part.shorthand(); + let { Point, points, Path, paths, options } = part.shorthand(); + + const textClasses = label => + options.focus === label ? "center text-xs fill-note" : "center text-xs"; points.A = new Point(10, 10) - .attr("data-text", "msg_move") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path.move()") + .attr("data-text-class", textClasses("move")); points.B = new Point(70, 30); points.BCp2 = new Point(40, 10); points.C = new Point(90, -50); @@ -16,32 +19,32 @@ export default part => { paths.line = new Path() .move(points.A) .line(points.B) - .attr("data-text", "msg_line") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path.line()") + .attr("data-text-class", textClasses("line")); paths.curve = new Path() .move(points.B) .curve(points.BCp2, points.CCp1, points.C) - .attr("data-text", "msg_curve") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path.curve()") + .attr("data-text-class", textClasses("curve")); paths._curve = new Path() .move(points.C) ._curve(points.DCp, points.D) - .attr("data-text", "msg__curve") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path._curve()") + .attr("data-text-class", textClasses("_curve")); paths.curve_ = new Path() .move(points.D) .curve_(points.ECp, points.E) - .attr("data-text", "msg_curve_") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path.curve_()") + .attr("data-text-class", textClasses("curve_")); paths.close = new Path() .move(points.E) .line(points.A) - .attr("data-text", "msg_close") - .attr("data-text-class", "center text-xs"); + .attr("data-text", "Path.close()") + .attr("data-text-class", textClasses("close")); paths.example = paths.line .join(paths.curve)