grailwind 0.7.0 → 0.8.0

package/CHANGELOG.md

@@ -6,6 +6,32 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
 
+## [0.8.0] - 2026-11-12
+
+### Added
+
+- Wavy ordinaries, e.g. `fess-wavy-or` and `three-bars-wavy-argent`.
+- Indented and embattled ordinaries, e.g. `chief-indented-azure` and
+  `cross-embattled-gules`. A fess, bar, bend or chevron embattled has
+  battlements on its upper edge only. The chevron, cross, saltire, pall and
+  pile take them with hand-drawn corners, as do the wavy chevron and pall.
+
+### Changed
+
+- Ordinary proportions move towards Fox-Davies: the chevron is wider (a fifth
+  of the shield), the cross's limbs are equal, the saltire is wider and crosses
+  at the fess point (as does `per-saltire-*`), and the pile is wider. The
+  pall's arms and foot are equal, and its arms meet above the fess point.
+- The engrailed cross and pile are hand-drawn, with clean corners and tips.
+- `@grailwind/eslint-plugin` 0.1.0-beta.4 needs `grailwind` 0.8.x.
+
+### Fixed
+
+- `gyronny-*` crosses at the fess point, as `per-saltire-*` does, so a
+  counterchanged saltire lines up with it.
+- Charges `on` an engrailed or indented ordinary are smaller, and charges
+  `between` a lined bend, pall, or embattled chevron move clear of its edge.
+
 ## [0.7.0] - 2026-11-09
 
 ### Added
@@ -157,7 +183,8 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 Initial release: tinctures, divisions, ordinaries, charges, strict mode and
 custom SVG charges.
 
-[Unreleased]: https://github.com/pafirmin/grailwind/compare/v0.7.0...HEAD
+[Unreleased]: https://github.com/pafirmin/grailwind/compare/v0.8.0...HEAD
+[0.8.0]: https://github.com/pafirmin/grailwind/compare/v0.7.0...v0.8.0
 [0.7.0]: https://github.com/pafirmin/grailwind/compare/v0.6.0...v0.7.0
 [0.6.0]: https://github.com/pafirmin/grailwind/compare/v0.5.0...v0.6.0
 [0.5.0]: https://github.com/pafirmin/grailwind/compare/v0.4.0...v0.5.0

package/README.md

@@ -61,7 +61,7 @@ tinctures replace Tailwind's colours entirely.
   `per-pale`, `per-fess` and `quarterly` for layout.
 - **Ordinaries:** `fess-or`, `chevron-gules`, `cross-argent`, `chief-azure`,
   `two-bars-or` and more, with `fimbriated-*` for a narrow border,
-  `fess-engrailed-or` and the like for an engrailed or invected edge,
+  `fess-engrailed-or` and the like for an engrailed, invected, wavy, indented or embattled edge,
   `cross-voided-argent` and the like to show the field through it,
   `pile-reversed-or` (also the chevron and pall) to turn one upside down,
   `chief-ermine` and the like in a fur, or `chevron-counterchanged` and the like

package/data.js

@@ -80,7 +80,10 @@ export const ROUNDELS = {
 };
 
 // Lines of partition for an ordinary's edge, e.g. `fess-engrailed-or`.
-export const LINES = ["engrailed", "invected"];
+export const LINES = ["engrailed", "invected", "wavy", "indented", "embattled"];
+
+// The ordinaries that take a line: every one, the cornered ones drawn by hand (064).
+export const lineOrdinaries = () => ORDINARIES;
 
 // Ordinaries that can be voided, e.g. `cross-voided-argent`.
 export const VOIDABLE = [
@@ -143,15 +146,18 @@ export const BETWEEN = {
   "bend-sinister": { size: 24, points: [[30, 26], [70, 68]], counts: {
     6: { size: 14, points: [[52, 9], [24, 12], [16, 38], [91, 48], [82, 72], [62, 84]] } } },
   chevron: { size: 22, points: [[24, 22], [76, 22], [50, 70]], counts: {
-    6: { size: 12, points: [[18, 14], [50, 11], [82, 14], [38, 66], [62, 66], [50, 84]] } } },
+    6: { size: 12, points: [[18, 14], [50, 11], [82, 14], [40, 72], [60, 72], [50, 84]] } } },
   cross: { size: 18, points: [[20, 17], [80, 17], [24, 72], [76, 72]] },
-  saltire: { size: 16, points: [[50, 13], [14, 50], [86, 50], [50, 84]], counts: {
-    2: { points: [[14, 50], [86, 50]] } } },
+  saltire: { size: 16, points: [[50, 13], [14, 45], [86, 45], [50, 84]], counts: {
+    2: { points: [[14, 45], [86, 45]] } } },
   pall: { size: 18, points: [[50, 11], [18, 56], [82, 56]], counts: {
     2: { points: [[18, 56], [82, 56]] } } },
   pile: { size: 20, points: [[18, 55], [82, 55]] },
 };
 
+// `on` charges shrink on lines that cut deep into the ordinary, by line.
+export const ON_SCALE = { engrailed: 0.8, indented: 0.9 };
+
 // Where charges go for "on", along the ordinary's centre line, by number of charges.
 // prettier-ignore
 export const ON = {
@@ -159,10 +165,10 @@ export const ON = {
   fess: { size: 22, counts: { 1: [[50, 45]], 2: [[30, 45], [70, 45]], 3: [[20, 45], [50, 45], [80, 45]] } },
   bend: { size: 18, counts: { 1: [[50, 50]], 2: [[33, 33], [67, 67]], 3: [[24, 24], [50, 50], [76, 76]] } },
   "bend-sinister": { size: 18, counts: { 1: [[50, 50]], 2: [[67, 33], [33, 67]], 3: [[76, 24], [50, 50], [24, 76]] } },
-  chevron: { size: 12, counts: { 1: [[50, 36]], 3: [[20, 65], [50, 36], [80, 65]] } },
+  chevron: { size: 15, counts: { 1: [[50, 36]], 3: [[20, 65], [50, 36], [80, 65]] } },
   cross: { size: 15, counts: { 1: [[50, 45]], 5: [[50, 15], [18, 45], [50, 45], [82, 45], [50, 80]] } },
-  saltire: { size: 14, counts: { 1: [[50, 50]], 5: [[22, 22], [78, 22], [50, 50], [22, 78], [78, 78]] } },
-  pall: { size: 14, counts: { 1: [[50, 50]], 3: [[22, 22], [78, 22], [50, 75]] } },
+  saltire: { size: 16, counts: { 1: [[50, 45]], 5: [[22, 19.8], [78, 19.8], [50, 45], [22, 70.2], [78, 70.2]] } },
+  pall: { size: 16, counts: { 1: [[50, 40]], 3: [[26, 20.8], [74, 20.8], [50, 75]] } },
   pile: { size: 14, counts: { 1: [[50, 25]], 3: [[50, 14], [50, 34], [50, 54]] } },
 };
 
@@ -187,6 +193,45 @@ for (const ordinary of REVERSIBLE) {
 // prettier-ignore
 BETWEEN["chevron-reversed"] = {
   ...BETWEEN["chevron-reversed"],
-  points: [[28, 74], [72, 74], [50, 30]],
-  counts: { 6: { size: 12, points: [[26, 78], [50, 89], [74, 78], [38, 34], [62, 34], [50, 16]] } },
+  points: [[26, 76], [74, 76], [50, 30]],
+  counts: { 6: { size: 12, points: [[26, 78], [50, 89], [74, 78], [40, 28], [60, 28], [50, 16]] } },
+};
+
+// `between` overrides where a line's edge hits a charge, by ordinary and line; the rest falls
+// back to the plain ordinary's. The sinister bend and the reversed pall are mirrored from these.
+// prettier-ignore
+export const BETWEEN_LINED = {
+  bend: {
+    engrailed: { points: [[70, 26], [24, 72]] },
+    invected: { points: [[70, 26], [24, 72]] },
+    wavy: { points: [[70, 26], [24, 72]] },
+    indented: { points: [[70, 26], [24, 72]] },
+  },
+  chevron: {
+    embattled: { counts: { 6: { size: 10, points: [[16, 13], [50, 8], [84, 13], [40, 72], [60, 72], [50, 84]] } } },
+  },
+  "chevron-reversed": {
+    embattled: { points: [[26, 76], [74, 76], [50, 24]] },
+  },
+  pall: {
+    invected: { points: [[50, 8], [18, 56], [82, 56]] },
+    wavy: { points: [[50, 8], [18, 56], [82, 56]] },
+    indented: { points: [[50, 8], [18, 56], [82, 56]] },
+    embattled: { points: [[50, 8], [18, 56], [82, 56]] },
+  },
 };
+
+const mirrorX = (points) => points.map(([x, y]) => [100 - x, y]);
+const mirrorLined = (entry, flip) => ({
+  ...entry,
+  ...(entry.points && { points: flip(entry.points) }),
+  ...(entry.counts && {
+    counts: mapValues(entry.counts, (count) => ({ ...count, points: flip(count.points) })),
+  }),
+});
+BETWEEN_LINED["bend-sinister"] = mapValues(BETWEEN_LINED.bend, (entry) =>
+  mirrorLined(entry, mirrorX),
+);
+BETWEEN_LINED["pall-reversed"] = mapValues(BETWEEN_LINED.pall, (entry) =>
+  mirrorLined(entry, mirror),
+);

package/divisions.js

@@ -5,8 +5,12 @@ import plugin from "tailwindcss/plugin";
 import { FURS, TINCTURES } from "./data.js";
 import { furLayers } from "./furs.js";
 
-// Horizontal lines of partition pass through the fess point, as the cross and fess do.
-const FESS_POINT = "45%";
+// The fess point, in % down the shield: horizontal lines of partition pass through it, as the
+// cross and fess do.
+const FESS_POINT = 45;
+
+// The background-position that puts a tile FESS_POINT% high just below the fess point.
+const BASE_TILES = ((100 * FESS_POINT) / (100 - FESS_POINT)).toFixed(2);
 
 // Each division maps (first, second) tincture colours to background rules.
 const layer = (image) => ({ "background-image": image });
@@ -78,7 +82,8 @@ const DIVISIONS = {
   "per-pale": (a, b) => layer(`linear-gradient(to right, ${a} 50%, ${b} 50%)`),
 
   // Horizontal split through the fess point: first in chief.
-  "per-fess": (a, b) => layer(`linear-gradient(to bottom, ${a} ${FESS_POINT}, ${b} ${FESS_POINT})`),
+  "per-fess": (a, b) =>
+    layer(`linear-gradient(to bottom, ${a} ${FESS_POINT}%, ${b} ${FESS_POINT}%)`),
 
   // Line from dexter chief to sinister base: first in the upper half.
   // With a corner-to-corner gradient, the 50% line joins the other two corners.
@@ -106,9 +111,11 @@ const DIVISIONS = {
           ].join(", "),
         },
 
-  // Both diagonals, crossing at the centre like the saltire: first in chief and base.
-  // Gyronny's four tiles, with the top-right and bottom-left swapped. Two strips under them fill
-  // the sub-pixel seam where the tiles meet: the first tincture down, the second across.
+  // Both lines of the saltire, from the top corners through the fess point to the flanks at 90%:
+  // first in chief and base. Four tiles, each half the width and 45% high, with each half-line
+  // as a tile's diagonal, and the base below them in the first tincture, 2px taller so Chromium
+  // leaves no seam where it meets them. Two strips under the tiles fill the sub-pixel seam where
+  // they meet: the first tincture down, the second across.
   "per-saltire": (a, b) => ({
     "background-image": [
       `linear-gradient(to bottom left, ${a} 50%, ${b} 50%)`,
@@ -116,10 +123,24 @@ const DIVISIONS = {
       `linear-gradient(to bottom left, ${b} 50%, ${a} 50%)`,
       `linear-gradient(to bottom right, ${b} 50%, ${a} 50%)`,
       `linear-gradient(${a}, ${a})`,
+      `linear-gradient(${a}, ${a})`,
       `linear-gradient(${b}, ${b})`,
     ].join(", "),
-    "background-size": "50% 50%, 50% 50%, 50% 50%, 50% 50%, 2px 100%, 100% 2px",
-    "background-position": "left top, right top, right bottom, left bottom, center, center",
+    "background-size": [
+      ...Array(4).fill(`50% ${FESS_POINT}%`),
+      `100% calc(${100 - 2 * FESS_POINT}% + 2px)`,
+      "2px 100%",
+      "100% 2px",
+    ].join(", "),
+    "background-position": [
+      "left top",
+      "right top",
+      `right ${BASE_TILES}%`,
+      `left ${BASE_TILES}%`,
+      "bottom",
+      "center",
+      `center ${FESS_POINT}%`,
+    ].join(", "),
     "background-repeat": "no-repeat",
   }),
 
@@ -128,14 +149,15 @@ const DIVISIONS = {
   // With a fur, the bands can't overlap, or the fur's transparent half shows the band below.
   quarterly: (a, b, fur) => ({
     "background-image": `linear-gradient(to right, ${a} 50%, ${b} 50%), linear-gradient(to right, ${b} 50%, ${a} 50%)`,
-    "background-size": `100% ${FESS_POINT}, 100% ${fur ? `calc(100% - ${FESS_POINT})` : "100%"}`,
+    "background-size": `100% ${FESS_POINT}%, 100% ${fur ? `calc(100% - ${FESS_POINT}%)` : "100%"}`,
     "background-position": fur ? "top, bottom" : "top, top",
     "background-repeat": "no-repeat",
   }),
 
-  // Gyronny of eight: each quarter split corner to corner. The first tincture
-  // is in the gyron just dexter of the top line. The background colour fills
-  // any sub-pixel seam between quarters.
+  // Gyronny of eight: quarterly and per saltire, all through the fess point. The first tincture
+  // is in the gyron just dexter of the top line. Per saltire's four tiles, then the base below
+  // them split per pale, 2px taller so no seam shows. The background colour fills any sub-pixel
+  // seam between tiles.
   gyronny: (a, b) => ({
     "background-color": b,
     "background-image": [
@@ -143,9 +165,19 @@ const DIVISIONS = {
       `linear-gradient(to bottom right, ${b} 50%, ${a} 50%)`,
       `linear-gradient(to bottom left, ${b} 50%, ${a} 50%)`,
       `linear-gradient(to bottom right, ${a} 50%, ${b} 50%)`,
+      `linear-gradient(to right, ${b} 50%, ${a} 50%)`,
+    ].join(", "),
+    "background-size": [
+      ...Array(4).fill(`50% ${FESS_POINT}%`),
+      `100% calc(${100 - 2 * FESS_POINT}% + 2px)`,
+    ].join(", "),
+    "background-position": [
+      "left top",
+      "right top",
+      `right ${BASE_TILES}%`,
+      `left ${BASE_TILES}%`,
+      "bottom",
     ].join(", "),
-    "background-size": "50% 50%",
-    "background-position": "left top, right top, right bottom, left bottom",
     "background-repeat": "no-repeat",
   }),