Merge branch 'develop' into bvandercar/segmentedcontrol-value-types

.circleci/config.yml

@@ -137,7 +137,7 @@ jobs:
       - store_test_results: { path: ./reports }
       - store_artifacts: { path: ./reports }
 
-  test-react-16: &test-react
+  test-react-18: &test-react
     docker: *docker-node-browsers-image
     resource_class: xlarge
     environment:
@@ -177,7 +177,7 @@ jobs:
       - store_test_results: { path: ./reports }
       - store_artifacts: { path: ./reports }
 
-  test-iso-react-16: &test-iso
+  test-iso-react-18: &test-iso
     docker: *docker-node-image
     environment:
       JUNIT_REPORT_PATH: reports
@@ -228,14 +228,14 @@ workflows:
           requires: [compile]
       - test-node-libs:
           requires: [compile]
-      - test-react-16:
+      - test-react-18:
           requires: [compile]
-      - test-iso-react-16:
+      - test-iso-react-18:
           requires: [compile]
       - deploy-preview:
           requires: [dist]
       - deploy-npm:
-          requires: [dist, lint, test-node-libs, test-react-16, test-iso-react-16]
+          requires: [dist, lint, test-node-libs, test-react-18, test-iso-react-18]
           filters:
             branches:
               only:

.github/ISSUE_TEMPLATE/Bug_report.md

@@ -7,9 +7,9 @@ about: Something not working as expected?
 
 #### Environment
 
-- __Package version(s)__: <!-- fill this out -->
-- __Operating System__: <!-- fill this out -->
-- __Browser name and version__: <!-- fill this out -->
+-   **Package version(s)**: <!-- fill this out -->
+-   **Operating System**: <!-- fill this out -->
+-   **Browser name and version**: <!-- fill this out -->
 
 #### Code Sandbox
 

.github/ISSUE_TEMPLATE/Feature_request.md

@@ -7,8 +7,8 @@ about: Propose a new feature or suggest an idea
 
 #### Environment
 
-- __Package version(s)__: <!-- fill this out -->
-- __Browser and OS versions__: <!-- fill this out -->
+-   **Package version(s)**: <!-- fill this out -->
+-   **Browser and OS versions**: <!-- fill this out -->
 
 #### Feature request
 

.github/ISSUE_TEMPLATE/Support_question.md

@@ -7,8 +7,8 @@ about: Need help with Blueprint?
 
 #### Environment
 
-- __Package version(s)__: <!-- fill this out -->
-- __Browser and OS versions__: <!-- fill this out -->
+-   **Package version(s)**: <!-- fill this out -->
+-   **Browser and OS versions**: <!-- fill this out -->
 
 #### Question
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -2,8 +2,8 @@
 
 #### Checklist
 
-- [ ] Includes tests
-- [ ] Update documentation
+-   [ ] Includes tests
+-   [ ] Update documentation
 
 <!-- DO NOT enable CircleCI for your fork. Our build will run when you open this PR. -->
 

.stylelintrc

@@ -12,7 +12,7 @@
     "color-function-notation": "legacy",
     "declaration-empty-line-before": null,
     "no-invalid-position-at-import-rule": [true, {
-        "ignoreAtRules": ["use", "forward"]
+        "ignoreAtRules": ["use"]
     }],
     "scss/media-feature-value-dollar-variable": null,
     "selector-max-universal": 1

.yarn/patches/react-day-picker-npm-7.4.9-8853eff118.patch

@@ -0,0 +1,31 @@
+diff --git a/types/Props.d.ts b/types/Props.d.ts
+index f8fcd45ab3048d9b34709eba1797597ac2facdec..3afa05a42f485ff23899f20df2ff9d85bf588eed 100644
+--- a/types/Props.d.ts
++++ b/types/Props.d.ts
+@@ -44,7 +44,7 @@ export interface DayPickerProps {
+   captionElement?:
+     | React.ReactElement<Partial<CaptionElementProps>>
+     | React.ComponentClass<CaptionElementProps>
+-    | React.SFC<CaptionElementProps>;
++    | React.FC<CaptionElementProps>;
+   className?: string;
+   classNames?: ClassNames;
+   containerProps?: React.DetailedHTMLProps<
+@@ -69,7 +69,7 @@ export interface DayPickerProps {
+   navbarElement?:
+     | React.ReactElement<Partial<NavbarElementProps>>
+     | React.ComponentClass<NavbarElementProps>
+-    | React.SFC<NavbarElementProps>;
++    | React.FC<NavbarElementProps>;
+   numberOfMonths?: number;
+   onBlur?: (e: React.FocusEvent<HTMLDivElement>) => void;
+   onCaptionClick?: (month: Date, e: React.MouseEvent<HTMLDivElement>) => void;
+@@ -142,7 +142,7 @@ export interface DayPickerProps {
+   weekdayElement?:
+     | React.ReactElement<Partial<WeekdayElementProps>>
+     | React.ComponentClass<WeekdayElementProps>
+-    | React.SFC<WeekdayElementProps>;
++    | React.FC<WeekdayElementProps>;
+   weekdaysLong?: string[];
+   weekdaysShort?: string[];
+   tabIndex?: number;

CHANGELOG.md

@@ -1,8 +1,7 @@
-Changelog
----------
+# Changelog
 
 Changelogs for `@blueprintjs/*` packages currently live in the project's Github wiki:
 
-- [5.x Changelog](https://github.com/palantir/blueprint/wiki/5.x-Changelog)
-- [4.x Changelog](https://github.com/palantir/blueprint/wiki/4.x-Changelog)
-- [3.x Changelog](https://github.com/palantir/blueprint/wiki/3.x-Changelog)
+-   [5.x Changelog](https://github.com/palantir/blueprint/wiki/5.x-Changelog)
+-   [4.x Changelog](https://github.com/palantir/blueprint/wiki/4.x-Changelog)
+-   [3.x Changelog](https://github.com/palantir/blueprint/wiki/3.x-Changelog)

CONTRIBUTING.md

@@ -36,35 +36,24 @@ A typical contributor workflow looks like this:
 
 1. Create a new feature branch. We like to use a format like `[your-initials]/[short-name]`:
    for example, `bd/refactor-buttons`.
-1. Run development build tasks - follow the ["Developing libraries" steps in the README](https://github.com/palantir/blueprint/blob/develop/README.md#developing-libraries).
-1. Visit http://localhost:9000 in your web browser to see the interactive docs web app.
+2. Run development build tasks - follow the ["Developing libraries" steps in the README](https://github.com/palantir/blueprint/blob/develop/README.md#developing-libraries).
+3. Visit http://localhost:9000 in your web browser to see the interactive docs web app.
 4. Write some code. :hammer: **Refer to the wiki in this repo for detailed instructions on:**
     - [Development practices](https://github.com/palantir/blueprint/wiki/Development-practices)
     - [Coding guidelines](https://github.com/palantir/blueprint/wiki/Coding-guidelines)
     - [Editor integration](https://github.com/palantir/blueprint/wiki/Editor-integration)
 5. Ensure your code **compiles properly** and is **tested**, **linted**, and **formatted**.
     - Run `yarn compile` at the repo root to build all libraries.
     - Run `yarn bundle` at the repo root to build the Blueprint documentation and other bundles.
-    - Add unit tests as necessary when fixing bugs or adding features; run them with `yarn test`
-      in the relevant package directory.
-    - Linting is best handled by your editor for real-time feedback (see
-      [Editor integration](https://github.com/palantir/blueprint/wiki/Editor-integration)). Run
-      `yarn lint` to be 100% safe.
+    - Add unit tests as necessary when fixing bugs or adding features; run them with `yarn test` in the relevant package directory.
+    - Linting is best handled by your editor for real-time feedback (see [Editor integration](https://github.com/palantir/blueprint/wiki/Editor-integration)). Run `yarn lint` to be 100% safe.
     - TypeScript lint errors can often be automatically fixed by ESLint. Run lint fixes with `yarn lint-fix`.
-    - Code formatting is enforced using [Prettier](https://prettier.io/). These errors can be fixed in your editor
-      through the Prettier extension (make sure you have set up the editor integrations linked above).
-      __Formatting checks will not run__ during the `yarn lint` package script.
-      Instead, when using the CLI or in a CI environment, you should run the `yarn format` script to fix all
-      formatting issues across the Blueprint monorepo.
-1. Submit a Pull Request on GitHub and fill out the template.
-    - ⚠️ __DO NOT enable CircleCI for your fork of Blueprint.__ When you open a PR, your branch will be checked out
-      and built in palantir's CI pipeline automatically. There is no need to enable the CI build for your fork's
-      pipeline. If you do, this may cause problems in the CI build.
-      - If you have already opened a PR where CircleCI built the code in your own personal or organization pipeline,
-        you will likely have to disable the project from building at app.circleci.com/settings/project/github/\<your-username\>/website
-        and open a new PR.
-1. Team members will review your code and merge it after approvals.
+    - Code formatting is enforced using [Prettier](https://prettier.io/). These errors can be fixed in your editor through the Prettier extension (make sure you have set up the editor integrations linked above). **Formatting checks will not run** during the `yarn lint` package script. Instead, when using the CLI or in a CI environment you should run the `yarn format` script to fix all formatting issues across the Blueprint monorepo.
+6. Submit a Pull Request on GitHub and fill out the template.
+    - ⚠️ **DO NOT enable CircleCI for your fork of Blueprint.** When you open a PR, your branch will be checked out and built in palantir's CI pipeline automatically. There is no need to enable the CI build for your fork's pipeline. If you do, this may cause problems in the CI build.
+        - If you have already opened a PR where CircleCI built the code in your own personal or organization pipeline, you will likely have to disable the project from building at app.circleci.com/settings/project/github/\<your-username\>/website and open a new PR.
+7. Team members will review your code and merge it after approvals.
     - You may be asked to make modifications to code style or to fix bugs you may have not noticed.
     - Please respond to comments in a timely fashion (even if to tell us you need more time).
     - _Do not_ amend commits and `push --force` as they break the PR history. Please add more commits; we squash each PR to a single commit on merge.
-1. Hooray, you contributed! :tophat:
+8. Hooray, you contributed! :tophat:

README.md

@@ -84,15 +84,15 @@ First, ensure you have `nvm` ([Node Version Manager](https://github.com/nvm-sh/n
 After cloning this repo, run:
 
 1. `nvm use` to use the supported Node version for Blueprint development.
-1. `corepack enable` to activate [Yarn](https://yarnpkg.com/getting-started) as the Node package manager.
-1. `yarn` to install all dependencies for the monorepo.
-   1. If seeing an error like "Error when performing the request ...", you may be using a VPN that needs to be disabled to install the dependencies.
-1. If running on Windows:
+2. `corepack enable` to activate [Yarn](https://yarnpkg.com/getting-started) as the Node package manager.
+3. `yarn` to install all dependencies for the monorepo.
+    1. If seeing an error like "Error when performing the request ...", you may be using a VPN that needs to be disabled to install the dependencies.
+4. If running on Windows:
     1. `npm install -g windows-build-tools` to install build tools globally
-    1. Ensure `bash` is your configured script-shell by running:<br />
+    2. Ensure `bash` is your configured script-shell by running:<br />
        `npm config set script-shell "C:\\Program Files\\git\\bin\\bash.exe"`
-1. `yarn verify` to ensure you have all the build tooling working properly.
-    1. There may currently be some errors when running this step, even though everything is set up properly, see https://github.com/palantir/blueprint/issues/6926 for more info. 
+5. `yarn verify` to ensure you have all the build tooling working properly.
+    1. There may currently be some errors when running this step, even though everything is set up properly, see https://github.com/palantir/blueprint/issues/6926 for more info.
 
 ### Incorporating upstream changes
 
@@ -101,47 +101,33 @@ If you were previously in a working state and have just pulled new code from `de
 -   If there were package dependency changes, run `yarn` at the root.
     -   This command is very quick if there are no new things to install.
 -   Run `yarn compile` to get the latest built versions of the library packages in this repo.
-    -   This command is quicker than `yarn verify` since it doesn't build the application packages (`docs-app`,
-        `landing-app`, etc.) or run tests
+    -   This command is quicker than `yarn verify` since it doesn't build the application packages (`docs-app`,`landing-app`, etc.) or run tests
 
 ### Developing libraries
 
 There are a few ways to run development scripts, here they are listed from simplest to more advanced usage:
 
--   Run `yarn dev` from the root directory to watch changes across all packages and run the docs application with
-    webpack-dev-server.
+-   Run `yarn dev` from the root directory to watch changes across all packages and run the docs application with webpack-dev-server.
 -   Alternately, most libraries have a dev script to run the docs app _and_ watch changes to only that package:
     -   `yarn dev:core`
     -   `yarn dev:docs`
     -   `yarn dev:datetime`
     -   `yarn dev:select`
     -   `yarn dev:table`
--   Lastly, if you want to control exactly which dev scripts are run and view the console output in the cleanest way,
-    we recommend opening separate terminal windows or splits and running local package dev tasks in each one. This is
-    the recommended workflow for frequent contributors and advanced developers. For example, to test changes in the core
-    and icons packages, you would run the following in separate terminals:
+-   Lastly, if you want to control exactly which dev scripts are run and view the console output in the cleanest way, we recommend opening separate terminal windows or splits and running local package dev tasks in each one. This is the recommended workflow for frequent contributors and advanced developers. For example, to test changes in the core and icons packages, you would run the following in separate terminals:
     -   `cd packages/core && yarn dev`
     -   `cd packages/icons && yarn dev`
     -   `cd packages/docs-app && yarn dev`
 
 ### Updating documentation
 
-Much of Blueprint's documentation lives inside source code as JSDoc comments in `.tsx` files and KSS markup in `.scss`
-files. This documentation is extracted and converted into static JSON data using
-[documentalist](https://github.com/palantir/documentalist/).
-
-If you are updating documentation sources (_not_ the docs UI code which lives in `packages/docs-app` or the docs theme
-in `packages/docs-theme`), you'll need to run `yarn compile` from `packages/docs-data` to see changes reflected in the
-application. For simplicity, an alias script `yarn docs-data` exists in the root to minimize directory hopping.
+Much of Blueprint's documentation lives inside source code as JSDoc comments in `.tsx` files and KSS markup in `.scss` files. This documentation is extracted and converted into static JSON data using [documentalist](https://github.com/palantir/documentalist/). If you are updating documentation sources (_not_ the docs UI code which lives in `packages/docs-app` or the docs theme in `packages/docs-theme`), you'll need to run `yarn compile` from `packages/docs-data` to see changes reflected in the application. For simplicity, an alias script `yarn docs-data` exists in the root to minimize directory hopping.
 
 ### Updating icons
 
-The [One-time setup](#one-time-setup) and [Incorporating upstream changes](#incorporating-upstream-changes) steps should
-produce the generated source code in this repo used to build the icons documentation. This is sufficient for most
-development workflows.
+The [One-time setup](#one-time-setup) and [Incorporating upstream changes](#incorporating-upstream-changes) steps should produce the generated source code in this repo used to build the icons documentation. This is sufficient for most development workflows.
 
-If you are updating icons or adding new ones, you'll need to run `yarn compile` in `packages/icons` to see those changes
-reflected before running any of the dev scripts.
+If you are updating icons or adding new ones, you'll need to run `yarn compile` in `packages/icons` to see those changes reflected before running any of the dev scripts.
 
 ## License
 

package.json

@@ -34,15 +34,15 @@
         "verify": "npm-run-all -s compile dist -p test lint format-check"
     },
     "dependencies": {
-        "@lerna-lite/cli": "^3.2.1",
-        "@lerna-lite/version": "^3.2.1",
+        "@lerna-lite/cli": "^3.11.0",
+        "@lerna-lite/version": "^3.11.0",
         "@types/chai": "~4.3.11",
         "@types/enzyme": "~3.10.18",
         "@types/enzyme-adapter-react-16": "~1.0.9",
         "@types/mocha": "~10.0.6",
         "@types/node": "~20.11.6",
-        "@types/react": "~16.14.55",
-        "@types/react-dom": "~16.9.24",
+        "@types/react": "^18.3.12",
+        "@types/react-dom": "^18.3.1",
         "@types/react-transition-group": "~4.4.10",
         "@types/sinon": "~17.0.3",
         "@types/yargs": "~17.0.32",
@@ -65,7 +65,7 @@
         "yarn-deduplicate": "^6.0.2"
     },
     "resolutions": {
-        "@types/react": "16.14.55"
+        "@types/react": "18.3.12"
     },
     "engines": {
         "node": ">=20.11"

packages/core/changelog/@unreleased/pr-7137.v2.yml

@@ -0,0 +1,5 @@
+type: improvement
+improvement:
+  description: Update React version check in Portal component to support React 18 and newer versions.
+  links:
+    - https://github.com/palantir/blueprint/pull/7137

packages/core/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@blueprintjs/core",
-    "version": "5.16.2",
+    "version": "5.16.4",
     "description": "Core styles & components",
     "main": "lib/cjs/index.js",
     "module": "lib/esm/index.js",
@@ -75,16 +75,16 @@
         "@blueprintjs/node-build-scripts": "workspace:^",
         "@blueprintjs/test-commons": "workspace:^",
         "@testing-library/dom": "^10.4.0",
-        "@testing-library/react": "^12.1.5",
+        "@testing-library/react": "^16.1.0",
         "@testing-library/user-event": "^13.5.0",
         "@types/use-sync-external-store": "0.0.6",
         "enzyme": "^3.11.0",
         "karma": "^6.4.2",
         "mocha": "^10.2.0",
         "npm-run-all": "^4.1.5",
-        "react": "^16.14.0",
-        "react-dom": "^16.14.0",
-        "react-test-renderer": "^16.14.0",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
+        "react-test-renderer": "^18.3.1",
         "typescript": "~5.3.3",
         "webpack-cli": "^5.1.4"
     },

packages/core/src/_dark-theme.scss

@@ -1,6 +1,5 @@
 // Copyright 2021 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the Apache License, Version 2.0.
-@use "common/variables" as *;
 
 .#{$ns}-dark {
   // this tells the browser to use a dark theme UI, which is most useful for enabling

packages/core/src/_reset.scss

@@ -1,9 +1,8 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the Apache License, Version 2.0.
 
-@use "common/variables" as *;
-@use "common/color-aliases" as *;
-@use "common/mixins" as *;
+@import "common/variables";
+@import "common/mixins";
 
 // Apply a natural box layout model to all elements, but allow components to change as necessary
 html {

packages/core/src/_typography.scss

@@ -1,14 +1,11 @@
 // Copyright 2015 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the Apache License, Version 2.0.
 
-@use "@blueprintjs/colors/lib/scss/colors" as *;
-@use "common/variables" as *;
-@use "common/variables-extended" as *;
-@use "common/color-aliases" as *;
-@use "common/mixins" as *;
-@use "common/typography-colors" as *;
-@use "components/icon/icon" as *;
-@use "components/html-table/html-table" as *;
+@import "common/variables";
+@import "common/variables-extended";
+@import "common/mixins";
+@import "common/typography-colors";
+@import "components/icon/icon";
 @include pt-typography-colors();
 
 /*

packages/core/src/accessibility/_focus-states.scss

@@ -1,7 +1,5 @@
 // Copyright 2016 Palantir Technologies, Inc. All rights reserved.
 // Licensed under the Apache License, Version 2.0.
-@use "../common/variables" as *;
-@use "../common/mixins" as *;
 
 :focus {
   @include focus-outline();

packages/core/src/blueprint.scss

@@ -6,8 +6,13 @@ Licensed under the Apache License, Version 2.0.
 */
 
 // Import files in the same order that they are documented in the docs
-@forward "reset";
-@forward "typography";
-@forward "accessibility/focus-states";
-@forward "dark-theme";
-@forward "components/index";
+@import "@blueprintjs/colors/lib/scss/colors";
+@import "common/variables";
+@import "common/variables-extended";
+@import "common/mixins";
+
+@import "reset";
+@import "typography";
+@import "accessibility/focus-states";
+@import "dark-theme";
+@import "components/index";