Skip to content

Commit 96ab861

Browse files
RichDom2185RichDom2185
authored
Bump BlueprintJS to v5 (#275)
* Explicitly state externalized Blueprint packages * Bump BlueprintJS to v5 * Remove references of deprecated package Replaces usage of components from @blueprintjs/popover2 with their corresponding components from @blueprintjs/core. * Remove obsolete `@blueprintjs/popover2` package * Deduplicate dependencies * Fix type error * Fix more type errors * Fix types in devserver
1 parent c1c9183 commit 96ab861

File tree

16 files changed

+144
-513
lines changed

16 files changed

+144
-513
lines changed

‎devserver/src/components/Playground.tsx‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,23 @@
1-
import { Classes, Intent, OverlayToaster, type ToastProps, type Toaster } from "@blueprintjs/core";
1+
import { Classes, Intent, OverlayToaster, type ToastProps } from "@blueprintjs/core";
22
import classNames from "classnames";
3+
import { SourceDocumentation, getNames, runInContext, type Context } from "js-slang";
34
import { Chapter, Variant } from "js-slang/dist/types";
45
import { stringify } from "js-slang/dist/utils/stringify";
56
import React, { useCallback } from "react";
67
import { HotKeys } from "react-hotkeys";
7-
8+
import mockModuleContext from "../mockModuleContext";
9+
import type { InterpreterOutput } from "../types";
810
import Workspace, { type WorkspaceProps } from "./Workspace";
11+
import { ControlBarClearButton } from "./controlBar/ControlBarClearButton";
12+
import { ControlBarRefreshButton } from "./controlBar/ControlBarRefreshButton";
913
import { ControlBarRunButton } from "./controlBar/ControlBarRunButton";
10-
import { type Context, runInContext, getNames, SourceDocumentation } from "js-slang";
14+
import testTabContent from "./sideContent/TestTab";
15+
import type { SideContentTab } from "./sideContent/types";
16+
import { getDynamicTabs } from "./sideContent/utils";
1117

1218
// Importing this straight from js-slang doesn't work for whatever reason
1319
import createContext from "js-slang/dist/createContext";
1420

15-
import { getDynamicTabs } from "./sideContent/utils";
16-
import type { SideContentTab } from "./sideContent/types";
17-
import testTabContent from "./sideContent/TestTab";
18-
import { ControlBarClearButton } from "./controlBar/ControlBarClearButton";
19-
import { ControlBarRefreshButton } from "./controlBar/ControlBarRefreshButton";
20-
import type { InterpreterOutput } from "../types";
21-
import mockModuleContext from "../mockModuleContext";
22-
2321
const refreshSuccessToast: ToastProps = {
2422
intent: Intent.SUCCESS,
2523
message: "Refresh Successful!"
@@ -48,7 +46,7 @@ const Playground: React.FC<{}> = () => {
4846
const [replOutput, setReplOutput] = React.useState<InterpreterOutput | null>(null);
4947
const [alerts, setAlerts] = React.useState<string[]>([]);
5048

51-
const toaster = React.useRef<Toaster | null>(null);
49+
const toaster = React.useRef<OverlayToaster>(null);
5250

5351
const showToast = (props: ToastProps) => {
5452
if (toaster.current) {

‎devserver/src/components/controlBar/ControlBarClearButton.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
import { Tooltip2 } from "@blueprintjs/popover2";
1+
import { Tooltip } from "@blueprintjs/core";
22
import ControlButton from "../ControlButton";
33
import { IconNames } from "@blueprintjs/icons";
44

55
type Props = {
66
onClick: () => void
77
}
88

9-
export const ControlBarClearButton = (props: Props) => <Tooltip2 content="Clear the editor and context">
9+
export const ControlBarClearButton = (props: Props) => <Tooltip content="Clear the editor and context">
1010
<ControlButton
1111
label="Clear"
1212
icon={IconNames.Trash}
1313
onClick={props.onClick}
1414
/>
15-
</Tooltip2>;
15+
</Tooltip>;

‎devserver/src/components/controlBar/ControlBarRefreshButton.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
import { Tooltip2 } from "@blueprintjs/popover2";
1+
import { Tooltip } from "@blueprintjs/core";
22
import ControlButton from "../ControlButton";
33
import { IconNames } from "@blueprintjs/icons";
44

55
type Props = {
66
onClick: () => void
77
}
88

9-
export const ControlBarRefreshButton = (props: Props) => <Tooltip2 content="Manually refresh the side content">
9+
export const ControlBarRefreshButton = (props: Props) => <Tooltip content="Manually refresh the side content">
1010
<ControlButton
1111
onClick={props.onClick}
1212
icon={IconNames.Refresh}
1313
label="Refresh"
1414
/>
15-
</Tooltip2>;
15+
</Tooltip>;

‎devserver/src/components/controlBar/ControlBarRunButton.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { Position } from "@blueprintjs/core";
1+
import { Position, Tooltip } from "@blueprintjs/core";
22
import { IconNames } from "@blueprintjs/icons";
3-
import { Tooltip2 } from "@blueprintjs/popover2";
43
import React from "react";
54

65
import ControlButton from "../ControlButton";
@@ -20,7 +19,7 @@ type ControlButtonRunButtonProps = DispatchProps & StateProps;
2019
export const ControlBarRunButton: React.FC<ControlButtonRunButtonProps> = (props) => {
2120
const tooltipContent = "Evaluate the program";
2221
return (
23-
<Tooltip2 content={tooltipContent} placement={Position.TOP}>
22+
<Tooltip content={tooltipContent} placement={Position.TOP}>
2423
<ControlButton
2524
label="Run"
2625
icon={IconNames.PLAY}
@@ -30,6 +29,6 @@ export const ControlBarRunButton: React.FC<ControlButtonRunButtonProps> = (props
3029
className: props.className
3130
}}
3231
/>
33-
</Tooltip2>
32+
</Tooltip>
3433
);
3534
};

‎devserver/src/components/sideContent/SideContent.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { Card, Icon, Tab, type TabProps, Tabs } from "@blueprintjs/core";
2-
import { Tooltip2 } from "@blueprintjs/popover2";
1+
import { Card, Icon, Tab, type TabProps, Tabs, Tooltip } from "@blueprintjs/core";
32
import React from "react";
43
import type { SideContentTab } from "./types";
54

@@ -37,11 +36,11 @@ const renderTab = (
3736
) => {
3837
const iconSize = 20;
3938
const tabTitle = (
40-
<Tooltip2 content={tab.label}>
39+
<Tooltip content={tab.label}>
4140
<div className={!shouldAlert ? "side-content-tooltip" : "side-content-tooltip side-content-tab-alert"}>
4241
<Icon icon={tab.iconName} iconSize={iconSize} />
4342
</div>
44-
</Tooltip2>
43+
</Tooltip>
4544
);
4645
const tabProps: TabProps = {
4746
id: tab.id,

‎devserver/src/styles/index.scss‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
@use 'sass:math';
22

33
@import '@blueprintjs/core/lib/css/blueprint.css';
4-
@import '@blueprintjs/popover2/lib/css/blueprint-popover2.css';
54
@import '@blueprintjs/core/lib/scss/variables';
65

76
// CSS styles for react-mde Markdown editor

‎package.json‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -96,9 +96,8 @@
9696
"yarnhook": "^0.5.1"
9797
},
9898
"dependencies": {
99-
"@blueprintjs/core": "^4.20.2",
100-
"@blueprintjs/icons": "^4.4.0",
101-
"@blueprintjs/popover2": "^1.4.3",
99+
"@blueprintjs/core": "^5.9.1",
100+
"@blueprintjs/icons": "^5.7.1",
102101
"@box2d/core": "^0.10.0",
103102
"@box2d/debug-draw": "^0.10.0",
104103
"@jscad/modeling": "2.9.6",

‎scripts/src/build/modules/tab.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,8 @@ export const getTabOptions = (tabs: string[], { srcDir, outDir }: Record<'srcDir
9696
'react-ace',
9797
'react-dom',
9898
'react/jsx-runtime',
99-
'@blueprintjs/*',
99+
'@blueprintjs/core',
100+
'@blueprintjs/icons',
100101
// 'phaser',
101102
],
102103
jsx: 'automatic',

‎src/tabs/Csg/hover_control_hint.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
/* [Imports] */
2-
import { Icon } from '@blueprintjs/core';
3-
import { Tooltip2 } from '@blueprintjs/popover2';
2+
import { Icon, Tooltip } from '@blueprintjs/core';
43
import React from 'react';
54
import { BP_ICON_COLOR, SA_TAB_BUTTON_WIDTH, SA_TAB_ICON_SIZE } from '../common/css_constants';
65
import type { HintProps } from './types';
@@ -18,7 +17,7 @@ export default class HoverControlHint extends React.Component<HintProps> {
1817
height: SA_TAB_BUTTON_WIDTH,
1918
}}
2019
>
21-
<Tooltip2
20+
<Tooltip
2221
content={this.props.tooltipText}
2322
placement="left"
2423
>
@@ -27,7 +26,7 @@ export default class HoverControlHint extends React.Component<HintProps> {
2726
size={SA_TAB_ICON_SIZE}
2827
color={BP_ICON_COLOR}
2928
/>
30-
</Tooltip2>
29+
</Tooltip>
3130
</div>;
3231
}
3332
}

‎src/tabs/Curve/animation_canvas_3d_curve.tsx‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { Icon, Slider } from '@blueprintjs/core';
1+
import { Icon, Slider, Tooltip } from '@blueprintjs/core';
22
import { IconNames } from '@blueprintjs/icons';
3-
import { Tooltip2 } from '@blueprintjs/popover2';
43
import React from 'react';
54
import { type AnimatedCurve } from '../../bundles/curve/types';
65
import AutoLoopSwitch from '../common/AutoLoopSwitch';
@@ -292,7 +291,7 @@ State
292291
disabled={Boolean(this.state.errored)}
293292
onClick={ this.onPlayButtonClick }
294293
/>
295-
<Tooltip2
294+
<Tooltip
296295
content="Reset"
297296
placement="top"
298297
>
@@ -302,7 +301,7 @@ State
302301
>
303302
<Icon icon={ IconNames.RESET } />
304303
</ButtonComponent>
305-
</Tooltip2>
304+
</Tooltip>
306305
<div
307306
style={{
308307
display: 'flex',
@@ -324,7 +323,7 @@ State
324323
onChange={ this.onTimeSliderChange }
325324
onRelease={ this.onTimeSliderRelease }
326325
/>
327-
<Tooltip2
326+
<Tooltip
328327
content="Display Angle"
329328
placement="top"
330329
>
@@ -339,7 +338,7 @@ State
339338

340339
onChange={ this.onAngleSliderChange }
341340
/>
342-
</Tooltip2>
341+
</Tooltip>
343342
</div>
344343
<AutoLoopSwitch
345344
isAutoLooping={ this.state.isAutoLooping }

0 commit comments

Comments
 (0)