fix(baseline): support ranged dates, use upstream types

build/web-features.ts

@@ -1,14 +1,14 @@
-import webFeatures from "web-features";
+import { features } from "web-features";
 
-export function getWebFeatureStatus(...features: string[]) {
-  if (features.length === 0) {
+export function getWebFeatureStatus(...bcdKeys: string[]) {
+  if (bcdKeys.length === 0) {
     return;
   }
 
-  for (const feature of Object.values(webFeatures)) {
+  for (const feature of Object.values(features)) {
     if (
       feature.status &&
-      feature.compat_features?.some((feature) => features.includes(feature))
+      feature.compat_features?.some((feature) => bcdKeys.includes(feature))
     ) {
       return feature.status;
     }

client/src/document/baseline-indicator.tsx

@@ -7,14 +7,15 @@ import { useLocation } from "react-router";
 
 import "./baseline-indicator.scss";
 
-import type {
-  SupportStatus,
-  browserIdentifier,
-} from "../../../libs/types/web-features";
+// web-features doesn't export these types directly so we need to do a little typescript magic:
+import type { features } from "web-features";
+type SupportStatus = (typeof features)[keyof typeof features]["status"];
+type BrowserIdentifier =
+  keyof (typeof features)[keyof typeof features]["status"]["support"];
 
 interface BrowserGroup {
   name: string;
-  ids: browserIdentifier[];
+  ids: BrowserIdentifier[];
 }
 
 const ENGINES: {
@@ -62,9 +63,11 @@ export function BaselineIndicator({ status }: { status: SupportStatus }) {
     LOCALIZED_BCD_IDS[locale] || LOCALIZED_BCD_IDS[DEFAULT_LOCALE]
   }`;
 
+  const low_date_range = status.baseline_low_date?.match(/^([^0-9])/)?.[0];
   const low_date = status.baseline_low_date
-    ? new Date(status.baseline_low_date)
+    ? new Date(status.baseline_low_date.slice(low_date_range ? 1 : 0))
     : undefined;
+
   const level = status.baseline
     ? status.baseline
     : status.baseline === false

libs/types/document.ts

@@ -1,5 +1,8 @@
 import { type Locale } from "./core.js";
-import type { SupportStatus } from "./web-features.js";
+
+// web-features doesn't export this type directly so we need to do a little typescript magic:
+import type { features } from "web-features";
+type SupportStatus = (typeof features)[keyof typeof features]["status"];
 
 export interface Source {
   folder: string;

package.json

@@ -145,7 +145,7 @@
     "unified": "^11.0.5",
     "unist-builder": "^4.0.0",
     "unist-util-visit": "^5.0.0",
-    "web-features": "^0.9.0",
+    "web-features": "^1.0.0",
     "web-specs": "^3.13.1"
   },
   "devDependencies": {

tsconfig.json

@@ -12,8 +12,7 @@
       "front-matter": ["./type-fixes/front-matter.js"],
       "@mdn/browser-compat-data/types": [
         "./node_modules/@mdn/browser-compat-data/types.d.ts"
-      ],
-      "web-features": ["./type-fixes/web-features.js"]
+      ]
     },
     "preserveWatchOutput": true,
     "resolveJsonModule": true,

yarn.lock

@@ -15835,10 +15835,10 @@ wbuf@^1.1.0, wbuf@^1.7.3:
   dependencies:
     minimalistic-assert "^1.0.0"
 
-web-features@^0.9.0:
-  version "0.9.0"
-  resolved "https://registry.yarnpkg.com/web-features/-/web-features-0.9.0.tgz#f46748e1cffe50e03a3331e44fcd85844cbc47d5"
-  integrity sha512-Y1SZbw8yt762LBfdDgD0Qe2XHpsmjcKnUKNi5HH/Y/uqJYST06ua+VFatwxvS/NIBPPuRwI0KbJl0VG606jNpg==
+web-features@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/web-features/-/web-features-1.0.0.tgz#c40f74bd38a09ef9ba7b7769521a336686b5811b"
+  integrity sha512-U/ppX0h851Fr8LbOVMybiuH3iGWGlPi+DYXoj6VkOvXJc6VgYpSdGDosduYl/4qvW6YNlZ4IaczLgqHqbaU25A==
 
 web-namespaces@^2.0.0:
   version "2.0.1"