feat: rework react-bootstrap

fork/react-bootstrap/CONTRIBUTING.md

@@ -69,9 +69,9 @@ propTypes: {
 There are a few caveats to this format that differ from conventional JSDoc comments.
 
 - Only specific doclets (the @ things) should be used, and only when the data cannot be parsed from the component itself
-    - `@type`: Override the "type", use the same names as the default React PropTypes: string, func, bool, number, object. You can express enum and oneOfType types, Like `{("optionA"|"optionB")}`.
-    - `@required`: to mark a prop as required (use the normal React isRequired if possible)
-    - `@private`: Will hide the prop in the documentation
+  - `@type`: Override the "type", use the same names as the default React PropTypes: string, func, bool, number, object. You can express enum and oneOfType types, Like `{("optionA"|"optionB")}`.
+  - `@required`: to mark a prop as required (use the normal React isRequired if possible)
+  - `@private`: Will hide the prop in the documentation
 - All description text should be above the doclets.
 
 ## Implement additional components and features
@@ -99,9 +99,7 @@ Please see the [Maintaining](./MAINTAINING.md) documentation.
 
 [huboard-badge]: https://img.shields.io/badge/Hu-Board-7965cc.svg
 [huboard]: https://huboard.com/react-bootstrap/react-bootstrap
-
 [issues]: https://github.com/react-bootstrap/react-bootstrap/issues
-
 [editorconfig]: http://editorconfig.org
 [eslint]: http://eslint.org
 [commit-message]: http://robots.thoughtbot.com/5-useful-tips-for-a-better-commit-message

fork/react-bootstrap/MAINTAINING.md

@@ -55,15 +55,15 @@ less active when you don't. If you get a new job and get busy, that's alright.
 
 Releases should include documentation, git tag, bower package preparation and
 finally the actual npm module publish. We have all of this automated by running
-`npm run release`. __PLEASE DO NOT RUN `npm
-publish` BY ITSELF__. The `release-script` will do that. We want to prevent issues
+`npm run release`. **PLEASE DO NOT RUN `npm
+publish` BY ITSELF**. The `release-script` will do that. We want to prevent issues
 like [#325](https://github.com/react-bootstrap/react-bootstrap/issues/325) and
 [#218](https://github.com/react-bootstrap/react-bootstrap/issues/218) from ever
 happening again. In order to run the `release-script` you will need permission to
 publish the package to npm. Those with this permission are in the [publishers
 team](https://github.com/orgs/react-bootstrap/teams/publishers)
 
-*Note: The publishers team does exist. If you see 404 that means you just have no permissions to publish.*
+_Note: The publishers team does exist. If you see 404 that means you just have no permissions to publish._
 
 Example usages of the `release-script`:
 
@@ -76,13 +76,16 @@ $ npm run release minor -- --preid beta --run  Use both bump and preid for first
 $ npm run release -- --preid beta --run        For follow on prereleases of the next version just use this
 ```
 
-*Note additional `--` double-dash. It is important.*
+_Note additional `--` double-dash. It is important._
 
 Or if you have this line
+
 ```sh
 export PATH="./node_modules/.bin:$PATH"
 ```
+
 in your shell config, then you can run it just as:
+
 ```bash
 $ release patch // without "--run" it will run in "dry run" mode
 $ release patch --run
@@ -115,36 +118,41 @@ that you start from that tag.
 To live patch the documentation in between release follow these steps
 
 0. Find the latest documentation release.
-  - Check the latest release tag (lets say `v0.22.1`).
-  - Look for a docs-release tag for that version ex: `v0.22.1-docs.X`
-  - If one exists, check-it-out. If not checkout the latest release tag.
-  - *Note: Checkout the tag and not master directly because some live
-   documentation changes on master that could related to new components
-   or updates for the upcoming release*
+
+- Check the latest release tag (lets say `v0.22.1`).
+- Look for a docs-release tag for that version ex: `v0.22.1-docs.X`
+- If one exists, check-it-out. If not checkout the latest release tag.
+- _Note: Checkout the tag and not master directly because some live
+  documentation changes on master that could related to new components
+  or updates for the upcoming release_
+
 0. Create a new branch from there (for example `git checkout -b docs/v0.22.1`)
-0. Cherry-pick the commits you want to include in the live update
-`git cherry-pick <commit-ish>...`
-0. Use the
+1. Cherry-pick the commits you want to include in the live update
+   `git cherry-pick <commit-ish>...`
+2. Use the
+
 ```bash
 $ npm run release -- --only-docs --run
 // or
 $ release --only-docs --run
 ```
+
 to push and tag to the documentation repository.
 
-*Note: The branch name you checkout to cherry-picked the commit is not enforced.
+_Note: The branch name you checkout to cherry-picked the commit is not enforced.
 Though keeping similar names ex: `docs/<version>` helps finding the branch
-easily.*
-
+easily._
 
 ### Check everything is OK before releasing
 
 Release tools are run in "dry run" mode by default.
 It prevents `danger` steps (`git push`, `npm publish` etc) from accidental running.
 
 You can use it
+
 - to learn how releasing tools are working.
 - to ensure there are no side issues before you release anything.
+
 ```bash
 $ npm run release -- --only-docs
 $ npm run release major

fork/react-bootstrap/README.md

@@ -6,7 +6,7 @@
 [![Discord][discord-badge]][discord]
 [![Netlify][netlify-badge]][netlify]
 
-__Under active development - APIs will change.__ Check out the [1.0.0 roadmap](https://github.com/react-bootstrap/react-bootstrap/wiki#100-roadmap) and [contributing guidelines][contributing] to see where you can help out. Prior to the 1.0.0 release, deprecations or breaking changes will result in a minor version bump.
+**Under active development - APIs will change.** Check out the [1.0.0 roadmap](https://github.com/react-bootstrap/react-bootstrap/wiki#100-roadmap) and [contributing guidelines][contributing] to see where you can help out. Prior to the 1.0.0 release, deprecations or breaking changes will result in a minor version bump.
 
 ## Docs
 
@@ -36,26 +36,19 @@ Yes please! See the [contributing guidelines][contributing] for details.
 
 [bootstrap]: https://getbootstrap.com/docs/3.3/
 [react]: http://facebook.github.io/react/
-
 [documentation]: http://react-bootstrap.github.io
 [contributing]: CONTRIBUTING.md
-
 [build-badge]: https://travis-ci.org/react-bootstrap/react-bootstrap.svg?branch=master
 [build]: https://travis-ci.org/react-bootstrap/react-bootstrap
-
 [npm-badge]: https://badge.fury.io/js/react-bootstrap.svg
 [npm]: http://badge.fury.io/js/react-bootstrap
-
 [react-router-bootstrap]: https://github.com/react-bootstrap/react-router-bootstrap
 [react-router]: https://github.com/reactjs/react-router
 [react-bootstrap-extended]: https://github.com/rbalicki2/react-bootstrap-extended
 [awesome-react-bootstrap-components]: https://github.com/Hermanya/awesome-react-bootstrap-components
-
 [codecov-badge]: https://img.shields.io/codecov/c/github/react-bootstrap/react-bootstrap/master.svg
 [codecov]: https://codecov.io/gh/react-bootstrap/react-bootstrap
-
 [discord-badge]: https://img.shields.io/badge/Discord-Join%20chat%20%E2%86%92-738bd7.svg
 [discord]: https://discord.gg/0ZcbPKXt5bXLs9XK
-
 [netlify-badge]: https://api.netlify.com/api/v1/badges/a74fbeb8-f950-4c97-854d-7c8363bef45e/deploy-status
 [netlify]: https://app.netlify.com/sites/react-bootstrap-v3/deploys

fork/react-bootstrap/package.json

@@ -20,7 +20,11 @@
     "build:lib:esm": "talend-scripts build --esm",
     "build:lib": "talend-scripts build",
     "lint": "talend-scripts lint",
-    "test": "talend-scripts test",
+    "lint:fix": "talend-scripts lint --fix",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:ui": "vitest --ui",
+    "test:coverage": "vitest run --coverage",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook"
   },
@@ -46,22 +50,26 @@
   "devDependencies": {
     "@talend/eslint-config": "^13.5.0",
     "@talend/eslint-plugin": "^1.6.0",
-    "@talend/scripts-config-typescript": "^11.4.0",
-    "@talend/scripts-core": "^16.8.0",
     "@talend/scripts-config-babel": "^13.8.0",
     "@talend/scripts-config-react-webpack": "^16.11.0",
+    "@talend/scripts-config-typescript": "^11.4.0",
+    "@talend/scripts-core": "^16.8.0",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^14.3.1",
     "@testing-library/user-event": "^14.6.1",
+    "@vitejs/plugin-react": "^5.1.2",
+    "@vitest/ui": "^4.0.17",
     "chai": "^4.5.0",
     "chalk": "^2.4.2",
     "create-react-class": "^15.7.0",
     "cross-env": "^7.0.3",
+    "jsdom": "^27.4.0",
     "lodash": "^4.17.21",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-test-renderer": "^18.3.1",
-    "sinon": "^11.1.2"
+    "sinon": "^11.1.2",
+    "vitest": "^4.0.17"
   },
   "dependencies": {
     "classnames": "^2.5.1",

fork/react-bootstrap/server/ModalSpec.js

@@ -6,15 +6,15 @@ import ReactDOMServer from 'react-dom/server';
 import Modal from '../src/Modal';
 
 describe('Modal', () => {
-  it('Should be rendered on the server side', () => {
-    const noOp = () => {};
+	it('Should be rendered on the server side', () => {
+		const noOp = () => {};
 
-    assert.doesNotThrow(() =>
-      ReactDOMServer.renderToString(
-        <Modal onHide={noOp}>
-          <strong>Message</strong>
-        </Modal>,
-      ),
-    );
-  });
+		assert.doesNotThrow(() =>
+			ReactDOMServer.renderToString(
+				<Modal onHide={noOp}>
+					<strong>Message</strong>
+				</Modal>,
+			),
+		);
+	});
 });

fork/react-bootstrap/src/Accordion.js → fork/react-bootstrap/src/Accordion.jsx

@@ -3,13 +3,13 @@ import React from 'react';
 import PanelGroup from './PanelGroup';
 
 class Accordion extends React.Component {
-  render() {
-    return (
-      <PanelGroup {...this.props} accordion>
-        {this.props.children}
-      </PanelGroup>
-    );
-  }
+	render() {
+		return (
+			<PanelGroup {...this.props} accordion>
+				{this.props.children}
+			</PanelGroup>
+		);
+	}
 }
 
 export default Accordion;

fork/react-bootstrap/src/Alert.jsx

@@ -0,0 +1,41 @@
+import classNames from 'classnames';
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { bsClass, bsStyles, getClassSet, prefix, splitBsProps } from './utils/bootstrapUtils';
+import { State } from './utils/StyleConfig';
+import CloseButton from './CloseButton';
+
+const propTypes = {
+	onDismiss: PropTypes.func,
+	closeLabel: PropTypes.string,
+};
+
+const defaultProps = {
+	closeLabel: 'Close alert',
+};
+
+class Alert extends React.Component {
+	render() {
+		const { onDismiss, closeLabel, className, children, ...props } = this.props;
+		const [bsProps, elementProps] = splitBsProps(props);
+
+		const dismissable = !!onDismiss;
+		const classes = {
+			...getClassSet(bsProps),
+			[prefix(bsProps, 'dismissable')]: dismissable,
+		};
+
+		return (
+			<div {...elementProps} role="alert" className={classNames(className, classes)}>
+				{dismissable && <CloseButton onClick={onDismiss} label={closeLabel} />}
+				{children}
+			</div>
+		);
+	}
+}
+
+Alert.propTypes = propTypes;
+Alert.defaultProps = defaultProps;
+
+export default bsStyles(Object.values(State), State.INFO, bsClass('alert', Alert));