@diagrammo/dgmo 0.18.0 → 0.18.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/README.md +4 -4
  2. package/dist/advanced.cjs +5 -5
  3. package/dist/advanced.js +5 -5
  4. package/dist/auto.cjs +6 -6
  5. package/dist/auto.js +25 -25
  6. package/dist/auto.mjs +6 -6
  7. package/dist/cli.cjs +26 -26
  8. package/dist/index.cjs +5 -5
  9. package/dist/index.js +5 -5
  10. package/dist/internal.cjs +5 -5
  11. package/dist/internal.js +5 -5
  12. package/docs/language-reference.md +672 -42
  13. package/package.json +1 -1
  14. package/src/d3.ts +10 -7
  15. package/src/utils/legend-layout.ts +5 -2
package/dist/index.cjs CHANGED
@@ -3279,7 +3279,7 @@ function capsuleWidth(name, entries, containerWidth, addonWidth = 0) {
3279
3279
  const baseW = LEGEND_CAPSULE_PAD * 2 + pw + 4 + addonWidth;
3280
3280
  const ew = entriesWidth(entries);
3281
3281
  const singleRowW = baseW + ew;
3282
- if (singleRowW <= maxCapsuleW) {
3282
+ if (singleRowW <= maxCapsuleW + 0.5) {
3283
3283
  return {
3284
3284
  width: singleRowW,
3285
3285
  entryRows: 1,
@@ -49721,7 +49721,7 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
49721
49721
  });
49722
49722
  } else {
49723
49723
  const labelY = useReservedRow ? reservedLabelY : 6;
49724
- const diamondY = useReservedRow ? -2 : labelY + 14;
49724
+ const diamondY = useReservedRow ? -(diamondSize + 1) : labelY + 14;
49725
49725
  const lineTop = diamondY + diamondSize;
49726
49726
  let displayLabel = marker.label;
49727
49727
  let truncated = false;
@@ -50706,7 +50706,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50706
50706
  const bandX = -margin.left + 5;
50707
50707
  const bandW = margin.left - 7;
50708
50708
  const bandY = curY;
50709
- const bandH = rowH;
50709
+ const bandH = sBarH;
50710
50710
  const sBandRx = ctx.structural(4);
50711
50711
  const sBandAccentW = ctx.structural(4);
50712
50712
  const clipId = `tl-band-clip-${tlBandClipCounter++}`;
@@ -50714,7 +50714,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50714
50714
  g.append("rect").attr("class", "tl-group-header-bg").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", bandW).attr("height", bandH).attr("rx", sBandRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).style("pointer-events", "none");
50715
50715
  g.append("rect").attr("class", "tl-group-header-accent").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", sBandAccentW).attr("height", bandH).attr("fill", laneColor).attr("clip-path", `url(#${clipId})`).style("pointer-events", "none");
50716
50716
  const headerG = g.append("g").attr("class", "tl-group-header").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
50717
- headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + rowH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
50717
+ headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
50718
50718
  if (lane.events.length > 0) {
50719
50719
  const evDates = lane.events.map((ev) => parseTimelineDate(ev.date));
50720
50720
  const evEndDates = lane.events.filter((ev) => ev.endDate).map((ev) => parseTimelineDate(ev.endDate));
@@ -50724,7 +50724,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50724
50724
  const sx2 = xScale(laneMaxD);
50725
50725
  const groupBarW = Math.max(sx2 - sx1, ctx.structural(20));
50726
50726
  const groupBarG = g.append("g").attr("class", isCollapsed ? "tl-group-summary" : "tl-group-bar").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
50727
- groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", rowH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
50727
+ groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", sBarH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
50728
50728
  }
50729
50729
  if (isCollapsed) {
50730
50730
  curY += rowH + sGroupGap;
package/dist/index.js CHANGED
@@ -3277,7 +3277,7 @@ function capsuleWidth(name, entries, containerWidth, addonWidth = 0) {
3277
3277
  const baseW = LEGEND_CAPSULE_PAD * 2 + pw + 4 + addonWidth;
3278
3278
  const ew = entriesWidth(entries);
3279
3279
  const singleRowW = baseW + ew;
3280
- if (singleRowW <= maxCapsuleW) {
3280
+ if (singleRowW <= maxCapsuleW + 0.5) {
3281
3281
  return {
3282
3282
  width: singleRowW,
3283
3283
  entryRows: 1,
@@ -49742,7 +49742,7 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
49742
49742
  });
49743
49743
  } else {
49744
49744
  const labelY = useReservedRow ? reservedLabelY : 6;
49745
- const diamondY = useReservedRow ? -2 : labelY + 14;
49745
+ const diamondY = useReservedRow ? -(diamondSize + 1) : labelY + 14;
49746
49746
  const lineTop = diamondY + diamondSize;
49747
49747
  let displayLabel = marker.label;
49748
49748
  let truncated = false;
@@ -50727,7 +50727,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50727
50727
  const bandX = -margin.left + 5;
50728
50728
  const bandW = margin.left - 7;
50729
50729
  const bandY = curY;
50730
- const bandH = rowH;
50730
+ const bandH = sBarH;
50731
50731
  const sBandRx = ctx.structural(4);
50732
50732
  const sBandAccentW = ctx.structural(4);
50733
50733
  const clipId = `tl-band-clip-${tlBandClipCounter++}`;
@@ -50735,7 +50735,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50735
50735
  g.append("rect").attr("class", "tl-group-header-bg").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", bandW).attr("height", bandH).attr("rx", sBandRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).style("pointer-events", "none");
50736
50736
  g.append("rect").attr("class", "tl-group-header-accent").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", sBandAccentW).attr("height", bandH).attr("fill", laneColor).attr("clip-path", `url(#${clipId})`).style("pointer-events", "none");
50737
50737
  const headerG = g.append("g").attr("class", "tl-group-header").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
50738
- headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + rowH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
50738
+ headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
50739
50739
  if (lane.events.length > 0) {
50740
50740
  const evDates = lane.events.map((ev) => parseTimelineDate(ev.date));
50741
50741
  const evEndDates = lane.events.filter((ev) => ev.endDate).map((ev) => parseTimelineDate(ev.endDate));
@@ -50745,7 +50745,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50745
50745
  const sx2 = xScale(laneMaxD);
50746
50746
  const groupBarW = Math.max(sx2 - sx1, ctx.structural(20));
50747
50747
  const groupBarG = g.append("g").attr("class", isCollapsed ? "tl-group-summary" : "tl-group-bar").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
50748
- groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", rowH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
50748
+ groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", sBarH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
50749
50749
  }
50750
50750
  if (isCollapsed) {
50751
50751
  curY += rowH + sGroupGap;
package/dist/internal.cjs CHANGED
@@ -3301,7 +3301,7 @@ function capsuleWidth(name, entries, containerWidth, addonWidth = 0) {
3301
3301
  const baseW = LEGEND_CAPSULE_PAD * 2 + pw + 4 + addonWidth;
3302
3302
  const ew = entriesWidth(entries);
3303
3303
  const singleRowW = baseW + ew;
3304
- if (singleRowW <= maxCapsuleW) {
3304
+ if (singleRowW <= maxCapsuleW + 0.5) {
3305
3305
  return {
3306
3306
  width: singleRowW,
3307
3307
  entryRows: 1,
@@ -50008,7 +50008,7 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
50008
50008
  });
50009
50009
  } else {
50010
50010
  const labelY = useReservedRow ? reservedLabelY : 6;
50011
- const diamondY = useReservedRow ? -2 : labelY + 14;
50011
+ const diamondY = useReservedRow ? -(diamondSize + 1) : labelY + 14;
50012
50012
  const lineTop = diamondY + diamondSize;
50013
50013
  let displayLabel = marker.label;
50014
50014
  let truncated = false;
@@ -50993,7 +50993,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
50993
50993
  const bandX = -margin.left + 5;
50994
50994
  const bandW = margin.left - 7;
50995
50995
  const bandY = curY;
50996
- const bandH = rowH;
50996
+ const bandH = sBarH;
50997
50997
  const sBandRx = ctx.structural(4);
50998
50998
  const sBandAccentW = ctx.structural(4);
50999
50999
  const clipId = `tl-band-clip-${tlBandClipCounter++}`;
@@ -51001,7 +51001,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
51001
51001
  g.append("rect").attr("class", "tl-group-header-bg").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", bandW).attr("height", bandH).attr("rx", sBandRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).style("pointer-events", "none");
51002
51002
  g.append("rect").attr("class", "tl-group-header-accent").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", sBandAccentW).attr("height", bandH).attr("fill", laneColor).attr("clip-path", `url(#${clipId})`).style("pointer-events", "none");
51003
51003
  const headerG = g.append("g").attr("class", "tl-group-header").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
51004
- headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + rowH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
51004
+ headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
51005
51005
  if (lane.events.length > 0) {
51006
51006
  const evDates = lane.events.map((ev) => parseTimelineDate(ev.date));
51007
51007
  const evEndDates = lane.events.filter((ev) => ev.endDate).map((ev) => parseTimelineDate(ev.endDate));
@@ -51011,7 +51011,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
51011
51011
  const sx2 = xScale(laneMaxD);
51012
51012
  const groupBarW = Math.max(sx2 - sx1, ctx.structural(20));
51013
51013
  const groupBarG = g.append("g").attr("class", isCollapsed ? "tl-group-summary" : "tl-group-bar").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
51014
- groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", rowH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
51014
+ groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", sBarH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
51015
51015
  }
51016
51016
  if (isCollapsed) {
51017
51017
  curY += rowH + sGroupGap;
package/dist/internal.js CHANGED
@@ -3299,7 +3299,7 @@ function capsuleWidth(name, entries, containerWidth, addonWidth = 0) {
3299
3299
  const baseW = LEGEND_CAPSULE_PAD * 2 + pw + 4 + addonWidth;
3300
3300
  const ew = entriesWidth(entries);
3301
3301
  const singleRowW = baseW + ew;
3302
- if (singleRowW <= maxCapsuleW) {
3302
+ if (singleRowW <= maxCapsuleW + 0.5) {
3303
3303
  return {
3304
3304
  width: singleRowW,
3305
3305
  entryRows: 1,
@@ -50029,7 +50029,7 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
50029
50029
  });
50030
50030
  } else {
50031
50031
  const labelY = useReservedRow ? reservedLabelY : 6;
50032
- const diamondY = useReservedRow ? -2 : labelY + 14;
50032
+ const diamondY = useReservedRow ? -(diamondSize + 1) : labelY + 14;
50033
50033
  const lineTop = diamondY + diamondSize;
50034
50034
  let displayLabel = marker.label;
50035
50035
  let truncated = false;
@@ -51014,7 +51014,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
51014
51014
  const bandX = -margin.left + 5;
51015
51015
  const bandW = margin.left - 7;
51016
51016
  const bandY = curY;
51017
- const bandH = rowH;
51017
+ const bandH = sBarH;
51018
51018
  const sBandRx = ctx.structural(4);
51019
51019
  const sBandAccentW = ctx.structural(4);
51020
51020
  const clipId = `tl-band-clip-${tlBandClipCounter++}`;
@@ -51022,7 +51022,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
51022
51022
  g.append("rect").attr("class", "tl-group-header-bg").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", bandW).attr("height", bandH).attr("rx", sBandRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).style("pointer-events", "none");
51023
51023
  g.append("rect").attr("class", "tl-group-header-accent").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", sBandAccentW).attr("height", bandH).attr("fill", laneColor).attr("clip-path", `url(#${clipId})`).style("pointer-events", "none");
51024
51024
  const headerG = g.append("g").attr("class", "tl-group-header").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
51025
- headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + rowH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
51025
+ headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(`${toggleIcon} ${lane.name}`);
51026
51026
  if (lane.events.length > 0) {
51027
51027
  const evDates = lane.events.map((ev) => parseTimelineDate(ev.date));
51028
51028
  const evEndDates = lane.events.filter((ev) => ev.endDate).map((ev) => parseTimelineDate(ev.endDate));
@@ -51032,7 +51032,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
51032
51032
  const sx2 = xScale(laneMaxD);
51033
51033
  const groupBarW = Math.max(sx2 - sx1, ctx.structural(20));
51034
51034
  const groupBarG = g.append("g").attr("class", isCollapsed ? "tl-group-summary" : "tl-group-bar").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
51035
- groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", rowH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
51035
+ groupBarG.append("rect").attr("x", sx1).attr("y", curY).attr("width", groupBarW).attr("height", sBarH).attr("rx", sBarRx).attr("fill", shapeFill(palette, laneColor, isDark, { solid })).attr("stroke", laneColor).attr("stroke-width", sBarStroke);
51036
51036
  }
51037
51037
  if (isCollapsed) {
51038
51038
  curY += rowH + sGroupGap;