Fixes for typescript 5 and fiberplane deps

CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+# [0.5.1]
+
+- add TypeScript plugin fixes for v5
+- fix `@fiberplane/*` scoped packages
+
 ## [0.5.0]
 - Remove dependency on provider runtime and query prometheus directly
 - Add support for relative time ranges

package.json

@@ -157,11 +157,11 @@
     "vitest": "^0.32.0"
   },
   "dependencies": {
-    "@autometrics/typescript-plugin": "^0.5.4",
+    "@autometrics/typescript-plugin": "beta",
+    "@fiberplane/fiberplane-charts": "^0.2.0",
+    "@fiberplane/prometheus-query": "^0.1.1",
     "@floating-ui/core": "^1.2.6",
     "@floating-ui/react": "^0.24.2",
-    "fiberplane-charts": "git+https://[email protected]/fiberplane/fiberplane.git#workspace=fiberplane-charts",
-    "fiberplane-prometheus-query": "https://[email protected]/fiberplane/fiberplane.git#workspace=fiberplane-prometheus-query",
     "framer-motion": "^10.12.16",
     "node-fetch": "^2.0.0",
     "parse-duration": "^1.1.0",

src/charts/components/ChartThemeSelector/ChartThemeSelector.tsx

@@ -1,4 +1,4 @@
-import type { ChartTheme } from "fiberplane-charts";
+import type { ChartTheme } from "@fiberplane/fiberplane-charts";
 import { DefaultTheme, ThemeProvider } from "styled-components";
 
 import * as defaultTheme from "../../themeValues";

src/charts/components/DatePicker/DatePicker.tsx

@@ -1,4 +1,4 @@
-import { TimeRange } from "fiberplane-charts";
+import { TimeRange } from "@fiberplane/fiberplane-charts";
 import { Button } from "../Button";
 import styled from "styled-components";
 import { useEffect, useState } from "react";

src/charts/components/DatePicker/DatePickerForm.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { TimeRange, Timestamp } from "fiberplane-charts";
+import { TimeRange, Timestamp } from "@fiberplane/fiberplane-charts";
 import styled, { css } from "styled-components";
 
 import { pxToEm, validateTimeRange } from "../../utils";

src/charts/components/DatePicker/MonthTable.tsx

@@ -2,7 +2,7 @@ import { memo, useMemo, useState } from "react";
 import styled, { css } from "styled-components";
 
 import { Day, StyledDay } from "./Day";
-import { Timestamp } from "fiberplane-charts";
+import { Timestamp } from "@fiberplane/fiberplane-charts";
 import { pxToEm } from "../../utils";
 import { Button } from "../Button";
 import { CaretLeft } from "./CaretLeft";

src/charts/components/FunctionCharts/FunctionChart.tsx

@@ -6,7 +6,7 @@ import {
   TimeRange,
   Timeseries,
   TooltipAnchor,
-} from "fiberplane-charts";
+} from "@fiberplane/fiberplane-charts";
 import styled from "styled-components";
 import { CodeBlock } from "../CodeBlock";
 import { colors, pxToEm } from "../../utils";

src/charts/components/GraphContainer/GraphContainer.tsx

@@ -5,7 +5,7 @@ import { Toggle } from "../Toggle";
 import { useContext } from "react";
 import { GlobalLoadingContext, GraphContext } from "../../state";
 import { useSnapshot } from "valtio";
-import { TimeRange } from "fiberplane-charts";
+import { TimeRange } from "@fiberplane/fiberplane-charts";
 import { useHandler } from "../../hooks";
 import { DatePicker } from "../DatePicker";
 import { Refresh } from "./Refresh";

src/charts/components/SingleChart/SingleChart.tsx

@@ -6,7 +6,7 @@ import {
   TimeRange,
   Timeseries,
   TooltipAnchor,
-} from "fiberplane-charts";
+} from "@fiberplane/fiberplane-charts";
 
 import { PanelOptions, SingleChartOptions } from "../../../chartPanel";
 import {

src/charts/components/Tooltip/Tooltip.tsx

@@ -1,4 +1,4 @@
-import { TooltipAnchor } from "fiberplane-charts";
+import { TooltipAnchor } from "@fiberplane/fiberplane-charts";
 import {
   useFloating,
   offset as offsetMiddleware,

src/charts/state/index.tsx

@@ -1,4 +1,4 @@
-import { TimeRange, Timeseries } from "fiberplane-charts";
+import { TimeRange, Timeseries } from "@fiberplane/fiberplane-charts";
 import { ReactNode, createContext, useEffect, useRef } from "react";
 import { proxy, useSnapshot } from "valtio";
 import { derive } from "valtio/utils";

src/charts/types.ts

@@ -1,4 +1,4 @@
-import type { TimeRange, Timeseries } from "fiberplane-charts";
+import type { TimeRange, Timeseries } from "@fiberplane/fiberplane-charts";
 
 import type {
   PanelOptions,

src/charts/utils/loadingGraph.ts

@@ -1,4 +1,4 @@
-import type { Timeseries } from "fiberplane-charts";
+import type { Timeseries } from "@fiberplane/fiberplane-charts";
 import { getNonce } from "../../utils";
 import { vscode } from "../chart";
 import { FlexibleTimeRange } from "../../types";

src/charts/utils/validation.ts

@@ -1,4 +1,4 @@
-import type { TimeRange } from "fiberplane-charts";
+import type { TimeRange } from "@fiberplane/fiberplane-charts";
 import {
   getNowDuration,
   secondsToTimestamp,

src/prometheus.ts

@@ -3,8 +3,8 @@ import {
   getStepFromTimeRange,
   roundToGrid,
   metricEntryToTimeseries,
-} from "fiberplane-prometheus-query";
-import type { TimeRange, Timeseries } from "fiberplane-prometheus-query";
+} from "@fiberplane/prometheus-query";
+import type { TimeRange, Timeseries } from "@fiberplane/prometheus-query";
 import fetch from "node-fetch";
 
 import { uniqBy } from "./utils";

src/styled-components.d.ts

@@ -1,4 +1,4 @@
-import { ChartTheme } from "fiberplane-charts";
+import { ChartTheme } from "@fiberplane/fiberplane-charts";
 
 export interface AdditionalThemeValues extends ChartTheme {
   fontStudioHeadingsH5FontSize: string;

src/types.ts

@@ -1,4 +1,4 @@
-import { TimeRange } from "fiberplane-charts";
+import { TimeRange } from "@fiberplane/fiberplane-charts";
 
 export type AbsoluteTimeRange = {
   type: "absolute";

src/utils/date.ts

@@ -1,5 +1,5 @@
 import parseDuration from "parse-duration";
-import type { Timestamp } from "fiberplane-charts";
+import type { Timestamp } from "@fiberplane/fiberplane-charts";
 import {
   AbsoluteTimeRange,
   FlexibleTimeRange,

src/utils/timeRanges.ts

@@ -1,4 +1,4 @@
-import type { TimeRange } from "fiberplane-charts";
+import type { TimeRange } from "@fiberplane/fiberplane-charts";
 
 import { timestampToMs } from "./timestamps";
 

src/utils/timestamps.ts

@@ -1,4 +1,4 @@
-import type { Timestamp } from "fiberplane-charts";
+import type { Timestamp } from "@fiberplane/fiberplane-charts";
 
 export const timestampToMs = (value: Timestamp) => {
   const date = new Date(value);