@jomae/catalog 0.4.0 → 0.6.0

package/dist/rules/container-queries.js

@@ -1,6 +1,7 @@
 export const containerQueries = {
     id: "container-queries",
     title: "Element size queries",
+    category: "layout",
     replaces: [
         "react-resize-detector",
         "react-use-measure",
@@ -51,5 +52,6 @@ export const containerQueries = {
   .card { grid-template-columns: 8rem 1fr; }
 }`,
     },
+    guides: ["size-aware-styling"],
 };
 //# sourceMappingURL=container-queries.js.map

package/dist/rules/container-queries.js.map

@@ -1 +1 @@
-{"version":3,"file":"container-queries.js","sourceRoot":"","sources":["../../src/rules/container-queries.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAS;IACpC,EAAE,EAAE,mBAAmB;IACvB,KAAK,EAAE,sBAAsB;IAC7B,QAAQ,EAAE;QACR,uBAAuB;QACvB,mBAAmB;QACnB,cAAc;QACd,uBAAuB;QACvB,yBAAyB;QACzB,YAAY;KACb;IACD,UAAU,EAAE,CAAC,mBAAmB,CAAC;IACjC,MAAM,EAAE,mBAAmB;IAC3B,KAAK,EAAE;QACL,SAAS,EACP,6YAA6Y;QAC/Y,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EACJ,oFAAoF;KACvF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,oFAAoF;QAC1F,MAAM,EAAE;YACN,qIAAqI;YACrI,yKAAyK;YACzK,4HAA4H;YAC5H,mIAAmI;SACpI;QACD,OAAO,EAAE;;;EAGX;KACC;CACF,CAAC"}
+{"version":3,"file":"container-queries.js","sourceRoot":"","sources":["../../src/rules/container-queries.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAS;IACpC,EAAE,EAAE,mBAAmB;IACvB,KAAK,EAAE,sBAAsB;IAC7B,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE;QACR,uBAAuB;QACvB,mBAAmB;QACnB,cAAc;QACd,uBAAuB;QACvB,yBAAyB;QACzB,YAAY;KACb;IACD,UAAU,EAAE,CAAC,mBAAmB,CAAC;IACjC,MAAM,EAAE,mBAAmB;IAC3B,KAAK,EAAE;QACL,SAAS,EACP,6YAA6Y;QAC/Y,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EACJ,oFAAoF;KACvF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,oFAAoF;QAC1F,MAAM,EAAE;YACN,qIAAqI;YACrI,yKAAyK;YACzK,4HAA4H;YAC5H,mIAAmI;SACpI;QACD,OAAO,EAAE;;;EAGX;KACC;IACD,MAAM,EAAE,CAAC,oBAAoB,CAAC;CAC/B,CAAC"}

package/dist/rules/content-visibility.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"content-visibility.d.ts","sourceRoot":"","sources":["../../src/rules/content-visibility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,iBAAiB,EAAE,IAkC/B,CAAC"}
+{"version":3,"file":"content-visibility.d.ts","sourceRoot":"","sources":["../../src/rules/content-visibility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,iBAAiB,EAAE,IAoC/B,CAAC"}

package/dist/rules/content-visibility.js

@@ -1,6 +1,7 @@
 export const contentVisibility = {
     id: "content-visibility",
     title: "Off-screen rendering",
+    category: "layout",
     replaces: [
         "react-window",
         "react-virtualized",
@@ -25,9 +26,10 @@ export const contentVisibility = {
             "You need the DOM node count itself reduced for a very large list. content-visibility still keeps every row in the DOM; it only skips the layout and paint work for the ones off-screen.",
             "You need data fetched in pages as the user scrolls. That is application logic a virtualization library's scroll callback gives you; content-visibility does not fetch anything.",
             "Your rows vary a lot in height and you cannot estimate contain-intrinsic-size well. A wrong estimate makes the scrollbar and scroll position jump when the real size is measured.",
-            "You support Safari below version 18 or Firefox below 125. Both shipped content-visibility: auto only recently.",
+            "You support Safari below version {{safari:css.properties.content-visibility.auto}} or Firefox below {{firefox:css.properties.content-visibility.auto}}. content-visibility: auto landed there long after Chrome {{chrome:css.properties.content-visibility.auto}}, so on an older target the property is ignored and the long list costs exactly what it did before.",
         ],
         snippet: ".row { content-visibility: auto; contain-intrinsic-size: auto 48px; }",
     },
+    guides: ["defer-rendering-heavy-content"],
 };
 //# sourceMappingURL=content-visibility.js.map

package/dist/rules/content-visibility.js.map

@@ -1 +1 @@
-{"version":3,"file":"content-visibility.js","sourceRoot":"","sources":["../../src/rules/content-visibility.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,iBAAiB,GAAS;IACrC,EAAE,EAAE,oBAAoB;IACxB,KAAK,EAAE,sBAAsB;IAC7B,QAAQ,EAAE;QACR,cAAc;QACd,mBAAmB;QACnB,sBAAsB;QACtB,yBAAyB;QACzB,sBAAsB;QACtB,qBAAqB;KACtB;IACD,UAAU,EAAE,CAAC,oBAAoB,CAAC;IAClC,MAAM,EAAE,0BAA0B;IAClC,KAAK,EAAE;QACL,SAAS,EACP,ocAAoc;QACtc,OAAO,EAAE;;;EAGX;QACE,MAAM,EACJ,qEAAqE;KACxE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,mFAAmF;QACzF,MAAM,EAAE;YACN,yLAAyL;YACzL,iLAAiL;YACjL,mLAAmL;YACnL,gHAAgH;SACjH;QACD,OAAO,EACL,uEAAuE;KAC1E;CACF,CAAC"}
+{"version":3,"file":"content-visibility.js","sourceRoot":"","sources":["../../src/rules/content-visibility.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,iBAAiB,GAAS;IACrC,EAAE,EAAE,oBAAoB;IACxB,KAAK,EAAE,sBAAsB;IAC7B,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE;QACR,cAAc;QACd,mBAAmB;QACnB,sBAAsB;QACtB,yBAAyB;QACzB,sBAAsB;QACtB,qBAAqB;KACtB;IACD,UAAU,EAAE,CAAC,oBAAoB,CAAC;IAClC,MAAM,EAAE,0BAA0B;IAClC,KAAK,EAAE;QACL,SAAS,EACP,ocAAoc;QACtc,OAAO,EAAE;;;EAGX;QACE,MAAM,EACJ,qEAAqE;KACxE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,mFAAmF;QACzF,MAAM,EAAE;YACN,yLAAyL;YACzL,iLAAiL;YACjL,mLAAmL;YACnL,sWAAsW;SACvW;QACD,OAAO,EACL,uEAAuE;KAC1E;IACD,MAAM,EAAE,CAAC,+BAA+B,CAAC;CAC1C,CAAC"}

package/dist/rules/custom-highlight.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "../schema.ts";
+export declare const customHighlight: Rule;
+//# sourceMappingURL=custom-highlight.d.ts.map

package/dist/rules/custom-highlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-highlight.d.ts","sourceRoot":"","sources":["../../src/rules/custom-highlight.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,eAAe,EAAE,IAuC7B,CAAC"}

package/dist/rules/custom-highlight.js

@@ -0,0 +1,39 @@
+export const customHighlight = {
+    id: "custom-highlight",
+    title: "Highlighting search matches",
+    category: "typography",
+    replaces: ["mark.js", "react-highlight-words", "react-highlighter"],
+    featureIds: ["highlight"],
+    native: "the CSS Custom Highlight API",
+    human: {
+        explainer: "These libraries find the matches and then wrap each one in a <mark> or a <span>, editing the document the user is reading. Splitting text nodes that way invalidates cached offsets, drops the user's selection, and re-runs on every keystroke in a search field. The Custom Highlight API registers Range objects with the browser instead, and ::highlight() styles them at paint time, so the text stays exactly one node and nothing in the DOM moves.",
+        snippet: `const ranges = [];
+for (const node of textNodes) {
+  const index = node.textContent.toLowerCase().indexOf(query);
+  if (index === -1) continue;
+  const range = new Range();
+  range.setStart(node, index);
+  range.setEnd(node, index + query.length);
+  ranges.push(range);
+}
+
+CSS.highlights.set("search", new Highlight(...ranges));`,
+        mdnUrl: "https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API",
+    },
+    agent: {
+        when: "highlighting search matches or ranges of text without changing the markup",
+        unless: [
+            "A highlight has to be interactive, for example a click target, a tooltip anchor, or something you scroll into view. Highlight ranges are paint-only and are not elements, so there is nothing to attach a listener or an anchor name to.",
+            "You style highlights with more than colour, background-color, text-decoration and text-shadow. ::highlight() ignores everything else, so a rounded background or a border still needs real elements.",
+            "Finding the matches is what you are buying: diacritic folding, stemming, or matching across element boundaries. The API takes Ranges you have already computed and does not help you compute them.",
+            "Your support target reaches below Safari {{safari:highlight}} or Firefox {{firefox:highlight}}. Custom highlights only became Baseline newly available in March 2026, so those browsers need the wrapping approach as a fallback.",
+            "The highlighting has to survive being copied out of the page or serialised back to HTML, where a paint-time highlight leaves no trace.",
+        ],
+        snippet: `CSS.highlights.set("search", new Highlight(...ranges));
+
+/* CSS */
+::highlight(search) { background-color: #fde68a; color: #111; }`,
+    },
+    guides: ["highlight-text-ranges"],
+};
+//# sourceMappingURL=custom-highlight.js.map

package/dist/rules/custom-highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-highlight.js","sourceRoot":"","sources":["../../src/rules/custom-highlight.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAS;IACnC,EAAE,EAAE,kBAAkB;IACtB,KAAK,EAAE,6BAA6B;IACpC,QAAQ,EAAE,YAAY;IACtB,QAAQ,EAAE,CAAC,SAAS,EAAE,uBAAuB,EAAE,mBAAmB,CAAC;IACnE,UAAU,EAAE,CAAC,WAAW,CAAC;IACzB,MAAM,EAAE,8BAA8B;IACtC,KAAK,EAAE;QACL,SAAS,EACP,6bAA6b;QAC/b,OAAO,EAAE;;;;;;;;;;wDAU2C;QACpD,MAAM,EACJ,2EAA2E;KAC9E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,2EAA2E;QACjF,MAAM,EAAE;YACN,0OAA0O;YAC1O,sMAAsM;YACtM,oMAAoM;YACpM,mOAAmO;YACnO,wIAAwI;SACzI;QACD,OAAO,EAAE;;;gEAGmD;KAC7D;IACD,MAAM,EAAE,CAAC,uBAAuB,CAAC;CAClC,CAAC"}

package/dist/rules/date-time-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-time-input.d.ts","sourceRoot":"","sources":["../../src/rules/date-time-input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,aAAa,EAAE,IAiC3B,CAAC"}
+{"version":3,"file":"date-time-input.d.ts","sourceRoot":"","sources":["../../src/rules/date-time-input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,aAAa,EAAE,IAmC3B,CAAC"}

package/dist/rules/date-time-input.js

@@ -1,6 +1,7 @@
 export const dateTimeInput = {
     id: "date-time-input",
     title: "Date and time pickers",
+    category: "forms",
     replaces: [
         "react-datepicker",
         "flatpickr",
@@ -22,6 +23,7 @@ export const dateTimeInput = {
     agent: {
         when: "collecting a single date or time value from a form",
         unless: [
+            "The displayed format has to be yours. The control renders in the user's own locale and there is no way to force dd/mm/yyyy, which is one of the most common reasons teams keep a date picker.",
             "You need a date range, picking a start and end date in one control. The native input only holds one value.",
             "You need the calendar's own appearance to match your design. Its popup is rendered by the browser or OS and cannot be restyled.",
             "You need to disable specific dates, such as holidays or already-booked days, rather than a single continuous min/max range.",

package/dist/rules/date-time-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-time-input.js","sourceRoot":"","sources":["../../src/rules/date-time-input.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAS;IACjC,EAAE,EAAE,iBAAiB;IACrB,KAAK,EAAE,uBAAuB;IAC9B,QAAQ,EAAE;QACR,kBAAkB;QAClB,WAAW;QACX,iBAAiB;QACjB,kBAAkB;QAClB,qBAAqB;QACrB,iBAAiB;KAClB;IACD,UAAU,EAAE,CAAC,iBAAiB,CAAC;IAC/B,MAAM,EAAE,6CAA6C;IACrD,KAAK,EAAE;QACL,SAAS,EACP,8YAA8Y;QAChZ,OAAO,EAAE;;;SAGJ;QACL,MAAM,EACJ,iFAAiF;KACpF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,oDAAoD;QAC1D,MAAM,EAAE;YACN,4GAA4G;YAC5G,iIAAiI;YACjI,6HAA6H;YAC7H,+GAA+G;SAChH;QACD,OAAO,EAAE,+CAA+C;KACzD;CACF,CAAC"}
+{"version":3,"file":"date-time-input.js","sourceRoot":"","sources":["../../src/rules/date-time-input.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAS;IACjC,EAAE,EAAE,iBAAiB;IACrB,KAAK,EAAE,uBAAuB;IAC9B,QAAQ,EAAE,OAAO;IACjB,QAAQ,EAAE;QACR,kBAAkB;QAClB,WAAW;QACX,iBAAiB;QACjB,kBAAkB;QAClB,qBAAqB;QACrB,iBAAiB;KAClB;IACD,UAAU,EAAE,CAAC,iBAAiB,CAAC;IAC/B,MAAM,EAAE,6CAA6C;IACrD,KAAK,EAAE;QACL,SAAS,EACP,8YAA8Y;QAChZ,OAAO,EAAE;;;SAGJ;QACL,MAAM,EACJ,iFAAiF;KACpF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,oDAAoD;QAC1D,MAAM,EAAE;YACN,+LAA+L;YAC/L,4GAA4G;YAC5G,iIAAiI;YACjI,6HAA6H;YAC7H,+GAA+G;SAChH;QACD,OAAO,EAAE,+CAA+C;KACzD;CACF,CAAC"}

package/dist/rules/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/rules/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,MAAM,EAAE,IAuDpB,CAAC"}
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/rules/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,MAAM,EAAE,IA+DpB,CAAC"}

package/dist/rules/dialog.js

@@ -1,6 +1,7 @@
 export const dialog = {
     id: "dialog-element",
     title: "Modal dialogs",
+    category: "forms",
     replaces: [
         "react-modal",
         "react-responsive-modal",
@@ -11,6 +12,7 @@ export const dialog = {
         "vue-js-modal",
         "vue-final-modal",
         "svelte-modals",
+        "dialog-polyfill",
     ],
     featureIds: ["dialog"],
     native: "<dialog> with showModal()",
@@ -51,5 +53,11 @@ export const dialog = {
 <script>document.querySelector("#d").showModal();</script>
 <style>dialog::backdrop { background: rgb(0 0 0 / 0.5); }</style>`,
     },
+    guides: [
+        "light-dismiss-a-dialog",
+        "declarative-dialog-popover-control",
+        "platform-controls-dismiss-dialog",
+        "animate-to-from-top-layer",
+    ],
 };
 //# sourceMappingURL=dialog.js.map

package/dist/rules/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/rules/dialog.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,MAAM,GAAS;IAC1B,EAAE,EAAE,gBAAgB;IACpB,KAAK,EAAE,eAAe;IACtB,QAAQ,EAAE;QACR,aAAa;QACb,wBAAwB;QACxB,kBAAkB;QAClB,eAAe;QACf,YAAY;QACZ,aAAa;QACb,cAAc;QACd,iBAAiB;QACjB,eAAe;KAChB;IACD,UAAU,EAAE,CAAC,QAAQ,CAAC;IACtB,MAAM,EAAE,2BAA2B;IACnC,KAAK,EAAE;QACL,SAAS,EACP,6XAA6X;QAC/X,OAAO,EAAE;;;;;;;;;;;;;;;;;SAiBJ;QACL,MAAM,EACJ,8EAA8E;KACjF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,uDAAuD;QAC7D,MAAM,EAAE;YACN,8IAA8I;YAC9I,gIAAgI;YAChI,oGAAoG;YACpG,yKAAyK;YACzK,6IAA6I;SAC9I;QACD,OAAO,EAAE;;;;kEAIqD;KAC/D;CACF,CAAC"}
+{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/rules/dialog.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,MAAM,GAAS;IAC1B,EAAE,EAAE,gBAAgB;IACpB,KAAK,EAAE,eAAe;IACtB,QAAQ,EAAE,OAAO;IACjB,QAAQ,EAAE;QACR,aAAa;QACb,wBAAwB;QACxB,kBAAkB;QAClB,eAAe;QACf,YAAY;QACZ,aAAa;QACb,cAAc;QACd,iBAAiB;QACjB,eAAe;QACf,iBAAiB;KAClB;IACD,UAAU,EAAE,CAAC,QAAQ,CAAC;IACtB,MAAM,EAAE,2BAA2B;IACnC,KAAK,EAAE;QACL,SAAS,EACP,6XAA6X;QAC/X,OAAO,EAAE;;;;;;;;;;;;;;;;;SAiBJ;QACL,MAAM,EACJ,8EAA8E;KACjF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,uDAAuD;QAC7D,MAAM,EAAE;YACN,8IAA8I;YAC9I,gIAAgI;YAChI,oGAAoG;YACpG,yKAAyK;YACzK,6IAA6I;SAC9I;QACD,OAAO,EAAE;;;;kEAIqD;KAC/D;IACD,MAAM,EAAE;QACN,wBAAwB;QACxB,oCAAoC;QACpC,kCAAkC;QAClC,2BAA2B;KAC5B;CACF,CAAC"}

package/dist/rules/discrete-transitions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"discrete-transitions.d.ts","sourceRoot":"","sources":["../../src/rules/discrete-transitions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,mBAAmB,EAAE,IAyDjC,CAAC"}
+{"version":3,"file":"discrete-transitions.d.ts","sourceRoot":"","sources":["../../src/rules/discrete-transitions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,mBAAmB,EAAE,IA+DjC,CAAC"}

package/dist/rules/discrete-transitions.js

@@ -1,6 +1,7 @@
 export const discreteTransitions = {
     id: "discrete-transitions",
     title: "Enter and exit transitions",
+    category: "animation",
     replaces: [
         "framer-motion",
         "motion",
@@ -54,5 +55,10 @@ export const discreteTransitions = {
 @starting-style { .el { opacity: 0; } }
 .el[hidden] { display: none; opacity: 0; }`,
     },
+    guides: [
+        "animate-element-entry-exit",
+        "physics-based-easing",
+        "dynamic-sibling-animations",
+    ],
 };
 //# sourceMappingURL=discrete-transitions.js.map

package/dist/rules/discrete-transitions.js.map

@@ -1 +1 @@
-{"version":3,"file":"discrete-transitions.js","sourceRoot":"","sources":["../../src/rules/discrete-transitions.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,mBAAmB,GAAS;IACvC,EAAE,EAAE,sBAAsB;IAC1B,KAAK,EAAE,4BAA4B;IACnC,QAAQ,EAAE;QACR,eAAe;QACf,QAAQ;QACR,wBAAwB;QACxB,cAAc;KACf;IACD,UAAU,EAAE,CAAC,gBAAgB,EAAE,qBAAqB,CAAC;IACrD,MAAM,EAAE,0DAA0D;IAClE,KAAK,EAAE;QACL,SAAS,EACP,6hBAA6hB;QAC/hB,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EAAE,kEAAkE;KAC3E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,mFAAmF;QACzF,MAAM,EAAE;YACN,gOAAgO;YAChO,0KAA0K;YAC1K,0DAA0D;YAC1D,qHAAqH;YACrH,qHAAqH;YACrH,gHAAgH;YAChH,oKAAoK;SACrK;QACD,OAAO,EAAE;;;;;2CAK8B;KACxC;CACF,CAAC"}
+{"version":3,"file":"discrete-transitions.js","sourceRoot":"","sources":["../../src/rules/discrete-transitions.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,mBAAmB,GAAS;IACvC,EAAE,EAAE,sBAAsB;IAC1B,KAAK,EAAE,4BAA4B;IACnC,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE;QACR,eAAe;QACf,QAAQ;QACR,wBAAwB;QACxB,cAAc;KACf;IACD,UAAU,EAAE,CAAC,gBAAgB,EAAE,qBAAqB,CAAC;IACrD,MAAM,EAAE,0DAA0D;IAClE,KAAK,EAAE;QACL,SAAS,EACP,6hBAA6hB;QAC/hB,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EAAE,kEAAkE;KAC3E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,mFAAmF;QACzF,MAAM,EAAE;YACN,gOAAgO;YAChO,0KAA0K;YAC1K,0DAA0D;YAC1D,qHAAqH;YACrH,qHAAqH;YACrH,gHAAgH;YAChH,oKAAoK;SACrK;QACD,OAAO,EAAE;;;;;2CAK8B;KACxC;IACD,MAAM,EAAE;QACN,4BAA4B;QAC5B,sBAAsB;QACtB,4BAA4B;KAC7B;CACF,CAAC"}

package/dist/rules/drag-and-drop.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drag-and-drop.d.ts","sourceRoot":"","sources":["../../src/rules/drag-and-drop.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,WAAW,EAAE,IA8BzB,CAAC"}
+{"version":3,"file":"drag-and-drop.d.ts","sourceRoot":"","sources":["../../src/rules/drag-and-drop.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,WAAW,EAAE,IA+CzB,CAAC"}

package/dist/rules/drag-and-drop.js

@@ -1,18 +1,32 @@
 export const dragAndDrop = {
     id: "drag-and-drop",
     title: "Reordering a list by dragging",
+    category: "forms",
     replaces: ["sortablejs", "react-sortablejs"],
     featureIds: ["draganddrop"],
     native: "draggable and the drag events",
     human: {
         explainer: "Sortable.js tracks pointer position, computes where a dragged item would land, and reorders the DOM to match, all in its own event handling. The native drag-and-drop API does the same core job: mark an element draggable, listen for dragstart, dragover, and drop, and move it yourself in the drop handler. It gives you the events and the ghost image; the reordering logic is still yours to write.",
-        snippet: `el.addEventListener("dragstart", (e) => {
-  e.dataTransfer.setData("text/plain", el.dataset.id);
-});
-list.addEventListener("drop", (e) => {
-  const id = e.dataTransfer.getData("text/plain");
-  // move the item with this id to the drop position
-});`,
+        snippet: `<!-- Without draggable, dragstart never fires. -->
+<li draggable="true" data-id="a1">Item</li>
+
+<script>
+  el.addEventListener("dragstart", (e) => {
+    e.dataTransfer.setData("text/plain", el.dataset.id);
+  });
+
+  // Without preventDefault here, the element is not a drop target and the
+  // drop event below never fires at all. This is the step people miss.
+  list.addEventListener("dragover", (e) => {
+    e.preventDefault();
+  });
+
+  list.addEventListener("drop", (e) => {
+    e.preventDefault();
+    const id = e.dataTransfer.getData("text/plain");
+    // move the item with this id to the drop position
+  });
+</script>`,
         mdnUrl: "https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API",
     },
     agent: {
@@ -23,7 +37,11 @@ list.addEventListener("drop", (e) => {
             "You want the dataTransfer API's plain-text-and-files model to also carry rich in-memory objects between drag and drop without round-tripping through a serialized string.",
             "You need accessible, keyboard-operable reordering. The native drag events are pointer-only; keyboard support is separate work either way.",
         ],
-        snippet: 'el.addEventListener("dragstart", (e) => e.dataTransfer.setData("text/plain", id));',
+        snippet: `<li draggable="true">Item</li>
+el.addEventListener("dragstart", (e) => e.dataTransfer.setData("text/plain", id));
+// dragover must preventDefault or drop never fires.
+list.addEventListener("dragover", (e) => e.preventDefault());
+list.addEventListener("drop", (e) => { e.preventDefault(); /* reorder */ });`,
     },
 };
 //# sourceMappingURL=drag-and-drop.js.map

package/dist/rules/drag-and-drop.js.map

@@ -1 +1 @@
-{"version":3,"file":"drag-and-drop.js","sourceRoot":"","sources":["../../src/rules/drag-and-drop.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,EAAE,EAAE,eAAe;IACnB,KAAK,EAAE,+BAA+B;IACtC,QAAQ,EAAE,CAAC,YAAY,EAAE,kBAAkB,CAAC;IAC5C,UAAU,EAAE,CAAC,aAAa,CAAC;IAC3B,MAAM,EAAE,+BAA+B;IACvC,KAAK,EAAE;QACL,SAAS,EACP,6YAA6Y;QAC/Y,OAAO,EAAE;;;;;;IAMT;QACA,MAAM,EACJ,yEAAyE;KAC5E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,iEAAiE;QACvE,MAAM,EAAE;YACN,0IAA0I;YAC1I,iMAAiM;YACjM,2KAA2K;YAC3K,2IAA2I;SAC5I;QACD,OAAO,EACL,oFAAoF;KACvF;CACF,CAAC"}
+{"version":3,"file":"drag-and-drop.js","sourceRoot":"","sources":["../../src/rules/drag-and-drop.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,EAAE,EAAE,eAAe;IACnB,KAAK,EAAE,+BAA+B;IACtC,QAAQ,EAAE,OAAO;IACjB,QAAQ,EAAE,CAAC,YAAY,EAAE,kBAAkB,CAAC;IAC5C,UAAU,EAAE,CAAC,aAAa,CAAC;IAC3B,MAAM,EAAE,+BAA+B;IACvC,KAAK,EAAE;QACL,SAAS,EACP,6YAA6Y;QAC/Y,OAAO,EAAE;;;;;;;;;;;;;;;;;;;UAmBH;QACN,MAAM,EACJ,yEAAyE;KAC5E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,iEAAiE;QACvE,MAAM,EAAE;YACN,0IAA0I;YAC1I,iMAAiM;YACjM,2KAA2K;YAC3K,2IAA2I;SAC5I;QACD,OAAO,EAAE;;;;6EAIgE;KAC1E;CACF,CAAC"}

package/dist/rules/duration-format.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "../schema.ts";
+export declare const durationFormat: Rule;
+//# sourceMappingURL=duration-format.d.ts.map

package/dist/rules/duration-format.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"duration-format.d.ts","sourceRoot":"","sources":["../../src/rules/duration-format.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,cAAc,EAAE,IAqC5B,CAAC"}

package/dist/rules/duration-format.js

@@ -0,0 +1,37 @@
+export const durationFormat = {
+    id: "duration-format",
+    title: "Human-readable durations",
+    category: "formatting",
+    replaces: ["humanize-duration", "pretty-ms"],
+    featureIds: ["intl-duration-format"],
+    native: "Intl.DurationFormat",
+    human: {
+        explainer: 'These libraries carry their own unit names and plural rules for every language they support, which is where most of their weight goes. Intl.DurationFormat takes a plain object of years, hours, minutes and seconds and renders it in the requested locale using the data the browser already holds. The three styles, long, short and narrow, cover the usual range from "1 hour, 30 minutes" down to "1h 30m".',
+        snippet: `const fmt = new Intl.DurationFormat("en", { style: "long" });
+fmt.format({ hours: 1, minutes: 30 });
+// "1 hour, 30 minutes"
+
+new Intl.DurationFormat("de", { style: "narrow" }).format({
+  minutes: 45,
+  seconds: 10,
+});
+// "45 Min. 10 Sek."`,
+        mdnUrl: "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DurationFormat",
+    },
+    agent: {
+        when: 'rendering a length of time as text, such as "1 hour, 30 minutes"',
+        unless: [
+            "You pass milliseconds and expect the library to split them into units. Intl.DurationFormat formats a duration object you have already broken down, so the arithmetic stays yours until Temporal.Duration is available.",
+            "You need the exact output shape of the current library. humanize-duration and pretty-ms have their own conventions for rounding, unit selection and separators, and changing them is a visible change to every screen.",
+            "Your support target predates Intl.DurationFormat becoming Baseline newly available, in which case the library is the fallback.",
+            "You need a compact form the standard does not model, such as a stopwatch reading of 01:30:05, which is padding and string joining rather than locale formatting.",
+            "You rely on the library's largest and smallest unit options to drop units automatically, which Intl expects you to decide before you call it.",
+        ],
+        snippet: `new Intl.DurationFormat("en", { style: "long" }).format({
+  hours: 1,
+  minutes: 30,
+});`,
+    },
+    guides: ["format-human-readable-durations"],
+};
+//# sourceMappingURL=duration-format.js.map

package/dist/rules/duration-format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"duration-format.js","sourceRoot":"","sources":["../../src/rules/duration-format.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,cAAc,GAAS;IAClC,EAAE,EAAE,iBAAiB;IACrB,KAAK,EAAE,0BAA0B;IACjC,QAAQ,EAAE,YAAY;IACtB,QAAQ,EAAE,CAAC,mBAAmB,EAAE,WAAW,CAAC;IAC5C,UAAU,EAAE,CAAC,sBAAsB,CAAC;IACpC,MAAM,EAAE,qBAAqB;IAC7B,KAAK,EAAE;QACL,SAAS,EACP,mZAAmZ;QACrZ,OAAO,EAAE;;;;;;;;qBAQQ;QACjB,MAAM,EACJ,sGAAsG;KACzG;IACD,KAAK,EAAE;QACL,IAAI,EAAE,kEAAkE;QACxE,MAAM,EAAE;YACN,wNAAwN;YACxN,wNAAwN;YACxN,gIAAgI;YAChI,kKAAkK;YAClK,+IAA+I;SAChJ;QACD,OAAO,EAAE;;;IAGT;KACD;IACD,MAAM,EAAE,CAAC,iCAAiC,CAAC;CAC5C,CAAC"}

package/dist/rules/event-target.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "../schema.ts";
+export declare const eventTarget: Rule;
+//# sourceMappingURL=event-target.d.ts.map

package/dist/rules/event-target.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-target.d.ts","sourceRoot":"","sources":["../../src/rules/event-target.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,WAAW,EAAE,IAkDzB,CAAC"}

package/dist/rules/event-target.js

@@ -0,0 +1,51 @@
+export const eventTarget = {
+    id: "event-target",
+    title: "Event emitters",
+    category: "async-data",
+    replaces: [
+        "mitt",
+        "tiny-emitter",
+        "nanoevents",
+        "eventemitter3",
+        "event-emitter",
+    ],
+    featureIds: [],
+    manualBaseline: {
+        status: "widely",
+        verifiedOn: "2026-09-06",
+        note: "web-features tracks addEventListener and CustomEvent under 'events', which reports Safari {{safari:events}} because the event model itself is that old. What this rule needs is newer: constructing a bare EventTarget is Safari {{safari:api.EventTarget.EventTarget}}, and the AbortSignal option on addEventListener is Safari {{safari:api.EventTarget.addEventListener.options_parameter.options_signal_parameter}}. Deriving from 'events' would publish a floor a decade below what the snippet requires. Widely available on the newer of those dates, Safari {{safari:api.EventTarget.addEventListener.options_parameter.options_signal_parameter}} in September 2021.",
+    },
+    native: "EventTarget with CustomEvent",
+    human: {
+        explainer: "An application event bus is usually a small class with on, off and emit. EventTarget is that class, already in the platform: make a bare new EventTarget(), or extend it, then dispatch a CustomEvent and listen with addEventListener. Passing an AbortSignal to addEventListener takes a whole group of listeners off in one abort() call, which is the part hand-rolled emitters usually leave to the caller.",
+        snippet: `const bus = new EventTarget();
+
+const controller = new AbortController();
+bus.addEventListener(
+  "cart:add",
+  (event) => render(event.detail.sku),
+  { signal: controller.signal },
+);
+
+bus.dispatchEvent(new CustomEvent("cart:add", { detail: { sku: "A1" } }));
+
+// Removes every listener registered with this signal.
+controller.abort();`,
+        mdnUrl: "https://developer.mozilla.org/en-US/docs/Web/API/EventTarget",
+    },
+    agent: {
+        when: "passing messages between parts of an app through a small event bus",
+        unless: [
+            "Your emit calls pass several arguments. A CustomEvent carries one detail property, so each emit has to become an object and each handler reads event.detail.",
+            "You use wildcard listeners or read the registered listener list, as mitt's all map allows. EventTarget exposes neither.",
+            "You need the bus in Node below {{nodejs:api.EventTarget}}, where EventTarget is not a global. Node's own EventEmitter covers that without a dependency.",
+            "You depend on the library's dispatch ordering or on re-entrant emits behaving a particular way, which DOM event dispatch does not promise to match.",
+            "Your support target reaches below Safari {{safari:api.EventTarget.EventTarget}}, where new EventTarget() cannot be constructed, or below Safari {{safari:api.EventTarget.addEventListener.options_parameter.options_signal_parameter}}, where addEventListener ignores the signal option and listeners never come off.",
+            "The package is also pulled in transitively by something else, so dropping your direct dependency does not remove the bytes from the bundle.",
+        ],
+        snippet: `const bus = new EventTarget();
+bus.addEventListener("ping", (e) => handle(e.detail), { signal });
+bus.dispatchEvent(new CustomEvent("ping", { detail: payload }));`,
+    },
+};
+//# sourceMappingURL=event-target.js.map

package/dist/rules/event-target.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-target.js","sourceRoot":"","sources":["../../src/rules/event-target.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,EAAE,EAAE,cAAc;IAClB,KAAK,EAAE,gBAAgB;IACvB,QAAQ,EAAE,YAAY;IACtB,QAAQ,EAAE;QACR,MAAM;QACN,cAAc;QACd,YAAY;QACZ,eAAe;QACf,eAAe;KAChB;IACD,UAAU,EAAE,EAAE;IACd,cAAc,EAAE;QACd,MAAM,EAAE,QAAQ;QAChB,UAAU,EAAE,YAAY;QACxB,IAAI,EAAE,ipBAAipB;KACxpB;IACD,MAAM,EAAE,8BAA8B;IACtC,KAAK,EAAE;QACL,SAAS,EACP,kZAAkZ;QACpZ,OAAO,EAAE;;;;;;;;;;;;oBAYO;QAChB,MAAM,EAAE,8DAA8D;KACvE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,oEAAoE;QAC1E,MAAM,EAAE;YACN,8JAA8J;YAC9J,yHAAyH;YACzH,yJAAyJ;YACzJ,qJAAqJ;YACrJ,wTAAwT;YACxT,6IAA6I;SAC9I;QACD,OAAO,EAAE;;iEAEoD;KAC9D;CACF,CAAC"}

package/dist/rules/fetch.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from "../schema.ts";
+export declare const fetchRule: Rule;
+//# sourceMappingURL=fetch.d.ts.map

package/dist/rules/fetch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fetch.d.ts","sourceRoot":"","sources":["../../src/rules/fetch.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,SAAS,EAAE,IA6CvB,CAAC"}

package/dist/rules/fetch.js

@@ -0,0 +1,46 @@
+export const fetchRule = {
+    id: "fetch",
+    title: "HTTP requests",
+    category: "async-data",
+    replaces: [
+        "axios",
+        "superagent",
+        "redaxios",
+        "whatwg-fetch",
+        "unfetch",
+        "isomorphic-fetch",
+        "cross-fetch",
+    ],
+    featureIds: ["fetch"],
+    native: "fetch()",
+    human: {
+        explainer: "axios was written when fetch was not everywhere and XMLHttpRequest was the floor. Most of what it adds is now a few lines at the call site: fetch resolves for any response the server sent, so you check response.ok yourself, and it hands back a stream, so you call response.json(). Cancellation is an AbortController, and a timeout is AbortSignal.timeout() passed as the signal. Interceptors and upload progress are what is genuinely missing, and they are the reasons to keep the library.",
+        snippet: `const res = await fetch("/api/items", {
+  method: "POST",
+  headers: { "Content-Type": "application/json" },
+  body: JSON.stringify(payload),
+  // Aborts and rejects after five seconds.
+  signal: AbortSignal.timeout(5000),
+});
+
+// fetch only rejects on a network error, so check the status yourself.
+if (!res.ok) throw new Error(\`\${res.status} \${res.statusText}\`);
+const items = await res.json();`,
+        mdnUrl: "https://developer.mozilla.org/en-US/docs/Web/API/Window/fetch",
+    },
+    agent: {
+        when: "making HTTP requests from the browser or from Node {{nodejs:api.fetch}} and up",
+        unless: [
+            "You use interceptors to attach auth headers or refresh a token on 401 across every call. fetch has no hook for that, so it becomes a wrapper every request has to route through.",
+            "You rely on a 4xx or 5xx rejecting. fetch resolves for any response the server sent, so every call site needs an explicit response.ok check and existing catch blocks quietly stop firing.",
+            "You need upload progress. Download progress can come off the response stream, but tracking bytes sent still needs XMLHttpRequest, which is what axios uses underneath.",
+            "You share one client with Node below {{nodejs:api.fetch}}, where there is no global fetch, or you depend on axios features with no equivalent: XSRF cookie handling, automatic transforms, or the adapter system.",
+            "Your tests mock axios directly. Moving to fetch means rewriting those mocks, which is real work for no behaviour change.",
+            "You need a request timeout below Chrome {{chrome:abortsignal-timeout}}, Safari {{safari:abortsignal-timeout}} or Firefox {{firefox:abortsignal-timeout}}. fetch itself is far older than all three, but AbortSignal.timeout() is not, so an older target needs a setTimeout calling controller.abort().",
+        ],
+        snippet: `const res = await fetch(url, { signal: AbortSignal.timeout(5000) });
+if (!res.ok) throw new Error(String(res.status));
+const data = await res.json();`,
+    },
+};
+//# sourceMappingURL=fetch.js.map

package/dist/rules/fetch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fetch.js","sourceRoot":"","sources":["../../src/rules/fetch.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAS;IAC7B,EAAE,EAAE,OAAO;IACX,KAAK,EAAE,eAAe;IACtB,QAAQ,EAAE,YAAY;IACtB,QAAQ,EAAE;QACR,OAAO;QACP,YAAY;QACZ,UAAU;QACV,cAAc;QACd,SAAS;QACT,kBAAkB;QAClB,aAAa;KACd;IACD,UAAU,EAAE,CAAC,OAAO,CAAC;IACrB,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE;QACL,SAAS,EACP,yeAAye;QAC3e,OAAO,EAAE;;;;;;;;;;gCAUmB;QAC5B,MAAM,EAAE,+DAA+D;KACxE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,gFAAgF;QACtF,MAAM,EAAE;YACN,kLAAkL;YAClL,4LAA4L;YAC5L,wKAAwK;YACxK,mNAAmN;YACnN,0HAA0H;YAC1H,ySAAyS;SAC1S;QACD,OAAO,EAAE;;+BAEkB;KAC5B;CACF,CAAC"}

package/dist/rules/field-sizing.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field-sizing.d.ts","sourceRoot":"","sources":["../../src/rules/field-sizing.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,WAAW,EAAE,IA2CzB,CAAC"}
+{"version":3,"file":"field-sizing.d.ts","sourceRoot":"","sources":["../../src/rules/field-sizing.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,WAAW,EAAE,IA6CzB,CAAC"}

package/dist/rules/field-sizing.js

@@ -1,6 +1,7 @@
 export const fieldSizing = {
     id: "field-sizing",
     title: "Auto-growing textareas",
+    category: "forms",
     replaces: [
         "react-textarea-autosize",
         "autosize",
@@ -30,7 +31,7 @@ input[type="text"] {
     agent: {
         when: "a textarea or input should grow to fit what the user has typed",
         unless: [
-            "You need Safari or Firefox support today. field-sizing reached Baseline newly available only in mid-2026, so verify against your support target and keep a fallback if you cannot afford a fixed-height textarea.",
+            "Your support target reaches below Chrome {{chrome:field-sizing}}, Firefox {{firefox:field-sizing}} or Safari {{safari:field-sizing}}. Every engine ships field-sizing now, but Safari only at the end of 2025 and Firefox in 2026, so an older target still needs the fallback.",
             "You need the measured height in JavaScript, for example to sync a neighbouring element.",
             "You need to animate the height change. field-sizing resizes without a transition.",
         ],
@@ -40,5 +41,6 @@ input[type="text"] {
   max-height: 12lh;
 }`,
     },
+    guides: ["form-fields-automatically-fit-contents"],
 };
 //# sourceMappingURL=field-sizing.js.map

package/dist/rules/field-sizing.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-sizing.js","sourceRoot":"","sources":["../../src/rules/field-sizing.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,EAAE,EAAE,cAAc;IAClB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE;QACR,yBAAyB;QACzB,UAAU;QACV,yBAAyB;QACzB,uBAAuB;QACvB,cAAc;KACf;IACD,UAAU,EAAE,CAAC,cAAc,CAAC;IAC5B,MAAM,EAAE,uBAAuB;IAC/B,KAAK,EAAE;QACL,SAAS,EACP,oYAAoY;QACtY,OAAO,EAAE;;;;;;;;;;;;EAYX;QACE,MAAM,EAAE,+DAA+D;KACxE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,gEAAgE;QACtE,MAAM,EAAE;YACN,mNAAmN;YACnN,yFAAyF;YACzF,mFAAmF;SACpF;QACD,OAAO,EAAE;;;;EAIX;KACC;CACF,CAAC"}
+{"version":3,"file":"field-sizing.js","sourceRoot":"","sources":["../../src/rules/field-sizing.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,EAAE,EAAE,cAAc;IAClB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE,OAAO;IACjB,QAAQ,EAAE;QACR,yBAAyB;QACzB,UAAU;QACV,yBAAyB;QACzB,uBAAuB;QACvB,cAAc;KACf;IACD,UAAU,EAAE,CAAC,cAAc,CAAC;IAC5B,MAAM,EAAE,uBAAuB;IAC/B,KAAK,EAAE;QACL,SAAS,EACP,oYAAoY;QACtY,OAAO,EAAE;;;;;;;;;;;;EAYX;QACE,MAAM,EAAE,+DAA+D;KACxE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,gEAAgE;QACtE,MAAM,EAAE;YACN,iRAAiR;YACjR,yFAAyF;YACzF,mFAAmF;SACpF;QACD,OAAO,EAAE;;;;EAIX;KACC;IACD,MAAM,EAAE,CAAC,wCAAwC,CAAC;CACnD,CAAC"}

package/dist/rules/fluid-type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fluid-type.d.ts","sourceRoot":"","sources":["../../src/rules/fluid-type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,SAAS,EAAE,IA8BvB,CAAC"}
+{"version":3,"file":"fluid-type.d.ts","sourceRoot":"","sources":["../../src/rules/fluid-type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,SAAS,EAAE,IAgCvB,CAAC"}

package/dist/rules/fluid-type.js

@@ -1,7 +1,8 @@
 export const fluidType = {
     id: "fluid-type-clamp",
     title: "Fluid type scales",
-    replaces: ["fitty", "fittext.js", "textfit", "react-textfit"],
+    category: "typography",
+    replaces: ["fittext.js"],
     featureIds: ["min-max-clamp"],
     native: "clamp() with a viewport-relative middle value",
     human: {
@@ -27,5 +28,6 @@ export const fluidType = {
         snippet: `h1 { font-size: clamp(2rem, 1.5rem + 2.5vw, 4rem); }
 .card h2 { font-size: clamp(1.25rem, 0.9rem + 2cqi, 2rem); }`,
     },
+    guides: ["fluid-scaling"],
 };
 //# sourceMappingURL=fluid-type.js.map

package/dist/rules/fluid-type.js.map

@@ -1 +1 @@
-{"version":3,"file":"fluid-type.js","sourceRoot":"","sources":["../../src/rules/fluid-type.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAS;IAC7B,EAAE,EAAE,kBAAkB;IACtB,KAAK,EAAE,mBAAmB;IAC1B,QAAQ,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,eAAe,CAAC;IAC7D,UAAU,EAAE,CAAC,eAAe,CAAC;IAC7B,MAAM,EAAE,+CAA+C;IACvD,KAAK,EAAE;QACL,SAAS,EACP,uaAAua;QACza,OAAO,EAAE;;;;;;;;EAQX;QACE,MAAM,EAAE,wDAAwD;KACjE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,6FAA6F;QACnG,MAAM,EAAE;YACN,oMAAoM;YACpM,gGAAgG;YAChG,kDAAkD;SACnD;QACD,OAAO,EAAE;6DACgD;KAC1D;CACF,CAAC"}
+{"version":3,"file":"fluid-type.js","sourceRoot":"","sources":["../../src/rules/fluid-type.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAS;IAC7B,EAAE,EAAE,kBAAkB;IACtB,KAAK,EAAE,mBAAmB;IAC1B,QAAQ,EAAE,YAAY;IACtB,QAAQ,EAAE,CAAC,YAAY,CAAC;IACxB,UAAU,EAAE,CAAC,eAAe,CAAC;IAC7B,MAAM,EAAE,+CAA+C;IACvD,KAAK,EAAE;QACL,SAAS,EACP,uaAAua;QACza,OAAO,EAAE;;;;;;;;EAQX;QACE,MAAM,EAAE,wDAAwD;KACjE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,6FAA6F;QACnG,MAAM,EAAE;YACN,oMAAoM;YACpM,gGAAgG;YAChG,kDAAkD;SACnD;QACD,OAAO,EAAE;6DACgD;KAC1D;IACD,MAAM,EAAE,CAAC,eAAe,CAAC;CAC1B,CAAC"}

package/dist/rules/focus-visible.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"focus-visible.d.ts","sourceRoot":"","sources":["../../src/rules/focus-visible.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,YAAY,EAAE,IAyB1B,CAAC"}
+{"version":3,"file":"focus-visible.d.ts","sourceRoot":"","sources":["../../src/rules/focus-visible.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,YAAY,EAAE,IA0B1B,CAAC"}

package/dist/rules/focus-visible.js

@@ -1,6 +1,7 @@
 export const focusVisible = {
     id: "focus-visible",
     title: "Keyboard-only focus styling",
+    category: "forms",
     replaces: ["focus-visible"],
     featureIds: ["focus-visible"],
     native: ":focus-visible",

package/dist/rules/focus-visible.js.map

@@ -1 +1 @@
-{"version":3,"file":"focus-visible.js","sourceRoot":"","sources":["../../src/rules/focus-visible.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,YAAY,GAAS;IAChC,EAAE,EAAE,eAAe;IACnB,KAAK,EAAE,6BAA6B;IACpC,QAAQ,EAAE,CAAC,eAAe,CAAC;IAC3B,UAAU,EAAE,CAAC,eAAe,CAAC;IAC7B,MAAM,EAAE,gBAAgB;IACxB,KAAK,EAAE;QACL,SAAS,EACP,8XAA8X;QAChY,OAAO,EAAE;;;;;EAKX;QACE,MAAM,EAAE,iEAAiE;KAC1E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,0FAA0F;QAChG,MAAM,EAAE;YACN,gJAAgJ;YAChJ,8LAA8L;SAC/L;QACD,OAAO,EAAE,4DAA4D;KACtE;CACF,CAAC"}
+{"version":3,"file":"focus-visible.js","sourceRoot":"","sources":["../../src/rules/focus-visible.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,YAAY,GAAS;IAChC,EAAE,EAAE,eAAe;IACnB,KAAK,EAAE,6BAA6B;IACpC,QAAQ,EAAE,OAAO;IACjB,QAAQ,EAAE,CAAC,eAAe,CAAC;IAC3B,UAAU,EAAE,CAAC,eAAe,CAAC;IAC7B,MAAM,EAAE,gBAAgB;IACxB,KAAK,EAAE;QACL,SAAS,EACP,8XAA8X;QAChY,OAAO,EAAE;;;;;EAKX;QACE,MAAM,EAAE,iEAAiE;KAC1E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,0FAA0F;QAChG,MAAM,EAAE;YACN,gJAAgJ;YAChJ,8LAA8L;SAC/L;QACD,OAAO,EAAE,4DAA4D;KACtE;CACF,CAAC"}

package/dist/rules/fullscreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fullscreen.d.ts","sourceRoot":"","sources":["../../src/rules/fullscreen.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,UAAU,EAAE,IA6BxB,CAAC"}
+{"version":3,"file":"fullscreen.d.ts","sourceRoot":"","sources":["../../src/rules/fullscreen.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,UAAU,EAAE,IA8BxB,CAAC"}

package/dist/rules/fullscreen.js

@@ -1,6 +1,7 @@
 export const fullscreen = {
     id: "fullscreen",
     title: "Fullscreen toggling",
+    category: "device-apis",
     replaces: ["screenfull", "react-full-screen", "vue-fullscreen"],
     featureIds: ["fullscreen"],
     native: "Element.requestFullscreen()",
@@ -18,7 +19,7 @@ export const fullscreen = {
     agent: {
         when: "toggling an element, such as a video player or image viewer, into and out of fullscreen",
         unless: [
-            "You support Safari before version 16.4, where the unprefixed API only recently landed.",
+            "You support Safari below {{safari:api.Element.requestFullscreen}}, where the unprefixed API only recently landed.",
             "You're targeting iOS Safari specifically. It still doesn't support fullscreen on arbitrary elements, only on the built-in video player.",
             "You need the older vendor-prefixed fallback chain screenfull still maintains for browsers this old.",
         ],

package/dist/rules/fullscreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"fullscreen.js","sourceRoot":"","sources":["../../src/rules/fullscreen.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,UAAU,GAAS;IAC9B,EAAE,EAAE,YAAY;IAChB,KAAK,EAAE,qBAAqB;IAC5B,QAAQ,EAAE,CAAC,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,CAAC;IAC/D,UAAU,EAAE,CAAC,YAAY,CAAC;IAC1B,MAAM,EAAE,6BAA6B;IACrC,KAAK,EAAE;QACL,SAAS,EACP,gQAAgQ;QAClQ,OAAO,EAAE;;;;;;EAMX;QACE,MAAM,EACJ,4EAA4E;KAC/E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,yFAAyF;QAC/F,MAAM,EAAE;YACN,wFAAwF;YACxF,yIAAyI;YACzI,qGAAqG;SACtG;QACD,OAAO,EACL,kFAAkF;KACrF;CACF,CAAC"}
+{"version":3,"file":"fullscreen.js","sourceRoot":"","sources":["../../src/rules/fullscreen.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,UAAU,GAAS;IAC9B,EAAE,EAAE,YAAY;IAChB,KAAK,EAAE,qBAAqB;IAC5B,QAAQ,EAAE,aAAa;IACvB,QAAQ,EAAE,CAAC,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,CAAC;IAC/D,UAAU,EAAE,CAAC,YAAY,CAAC;IAC1B,MAAM,EAAE,6BAA6B;IACrC,KAAK,EAAE;QACL,SAAS,EACP,gQAAgQ;QAClQ,OAAO,EAAE;;;;;;EAMX;QACE,MAAM,EACJ,4EAA4E;KAC/E;IACD,KAAK,EAAE;QACL,IAAI,EAAE,yFAAyF;QAC/F,MAAM,EAAE;YACN,mHAAmH;YACnH,yIAAyI;YACzI,qGAAqG;SACtG;QACD,OAAO,EACL,kFAAkF;KACrF;CACF,CAAC"}

package/dist/rules/height-animation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"height-animation.d.ts","sourceRoot":"","sources":["../../src/rules/height-animation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,eAAe,EAAE,IA8C7B,CAAC"}
+{"version":3,"file":"height-animation.d.ts","sourceRoot":"","sources":["../../src/rules/height-animation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAO,MAAM,eAAe,EAAE,IAgD7B,CAAC"}

package/dist/rules/height-animation.js

@@ -1,6 +1,7 @@
 export const heightAnimation = {
     id: "height-auto-animation",
     title: "Animating to height auto",
+    category: "animation",
     replaces: ["react-collapse", "react-animate-height", "react-smooth-collapse"],
     featureIds: ["interpolate-size", "calc-size"],
     native: "interpolate-size: allow-keywords, or calc-size()",
@@ -43,5 +44,6 @@ export const heightAnimation = {
 .panel { height: 0; overflow: hidden; transition: height 0.3s; }
 .panel[data-open] { height: auto; }`,
     },
+    guides: ["animate-to-intrinsic-sizes"],
 };
 //# sourceMappingURL=height-animation.js.map

package/dist/rules/height-animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"height-animation.js","sourceRoot":"","sources":["../../src/rules/height-animation.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAS;IACnC,EAAE,EAAE,uBAAuB;IAC3B,KAAK,EAAE,0BAA0B;IACjC,QAAQ,EAAE,CAAC,gBAAgB,EAAE,sBAAsB,EAAE,uBAAuB,CAAC;IAC7E,UAAU,EAAE,CAAC,kBAAkB,EAAE,WAAW,CAAC;IAC7C,MAAM,EAAE,kDAAkD;IAC1D,KAAK,EAAE;QACL,SAAS,EACP,ybAAyb;QAC3b,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EAAE,4DAA4D;KACrE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,qEAAqE;QAC3E,MAAM,EAAE;YACN,4NAA4N;YAC5N,6IAA6I;YAC7I,gGAAgG;YAChG,8GAA8G;SAC/G;QACD,OAAO,EAAE;;oCAEuB;KACjC;CACF,CAAC"}
+{"version":3,"file":"height-animation.js","sourceRoot":"","sources":["../../src/rules/height-animation.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAS;IACnC,EAAE,EAAE,uBAAuB;IAC3B,KAAK,EAAE,0BAA0B;IACjC,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE,CAAC,gBAAgB,EAAE,sBAAsB,EAAE,uBAAuB,CAAC;IAC7E,UAAU,EAAE,CAAC,kBAAkB,EAAE,WAAW,CAAC;IAC7C,MAAM,EAAE,kDAAkD;IAC1D,KAAK,EAAE;QACL,SAAS,EACP,ybAAyb;QAC3b,OAAO,EAAE;;;;;;;;;;;;;;;;;;;;;;EAsBX;QACE,MAAM,EAAE,4DAA4D;KACrE;IACD,KAAK,EAAE;QACL,IAAI,EAAE,qEAAqE;QAC3E,MAAM,EAAE;YACN,4NAA4N;YAC5N,6IAA6I;YAC7I,gGAAgG;YAChG,8GAA8G;SAC/G;QACD,OAAO,EAAE;;oCAEuB;KACjC;IACD,MAAM,EAAE,CAAC,4BAA4B,CAAC;CACvC,CAAC"}