From 6d55d3e6b16c6d8997429cbad4fd09d60d04ccb8 Mon Sep 17 00:00:00 2001
From: John Factotum <50942278+johnfactotum@users.noreply.github.com>
Date: Tue, 24 Oct 2023 13:29:36 +0800
Subject: [PATCH] Convert `break-*: page` to `break-*: column`

`break-*` is the newer standard that replaced the legacy `page-break-*`
properties.

Note that setting it to `always` or `all` does not work. There seems to
be no way of telling browsers to break in both paged media and multicol.
---
 epub.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/epub.js b/epub.js
index 6275abd..c43783a 100644
--- a/epub.js
+++ b/epub.js
@@ -735,8 +735,10 @@ class Loader {
             .replace(/(\d*\.?\d+)vw/gi, (_, d) => parseFloat(d) * w / 100 + 'px')
             .replace(/(\d*\.?\d+)vh/gi, (_, d) => parseFloat(d) * h / 100 + 'px')
             // `page-break-*` unsupported in columns; replace with `column-break-*`
-            .replace(/page-break-(after|before|inside)/gi, (_, x) =>
-                `-webkit-column-break-${x}`)
+            .replace(/page-break-(after|before|inside)\s*:/gi, (_, x) =>
+                `-webkit-column-break-${x}:`)
+            .replace(/break-(after|before|inside)\s*:\s*(avoid-)?page/gi, (_, x, y) =>
+                `break-${x}: ${y ?? ''}column`)
     }
     // find & replace all possible relative paths for all assets without parsing
     replaceString(str, href, parents = []) {