react-bootstrap-table-ng-example 4.19.1 → 4.19.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-bootstrap-table-ng-example",
-  "version": "4.19.1",
+  "version": "4.19.2",
   "description": "Storybook for react-bootstrap-table-ng",
   "homepage": "http://jeff-k-zhou.github.io/react-bootstrap-table-ng",
   "main": "index.js",
@@ -42,7 +42,6 @@
     }
   ],
   "peerDependencies": {
-    "prop-types": ">=15.8.1",
     "react": "^18.0 || ^18.0.0 || ^19.0 || ^19.0.0",
     "react-dom": "^18.0 || ^18.0.0 || ^19.0 || ^19.0.0"
   },
@@ -77,13 +76,12 @@
     "@types/node": "^22.10.5",
     "@types/react": "^19.2.10",
     "@types/react-dom": "^19.2.3",
-    "prop-types": "^15.8.1",
     "react": "^19.2.4",
-    "react-bootstrap-table-ng": "^4.19.1",
+    "react-bootstrap-table-ng": "^4.19.2",
     "react-dom": "^19.2.4",
     "react-scripts": "^5.0.1",
     "typescript": "^5.9.3",
     "web-vitals": "^5.1.0"
   },
-  "gitHead": "24022dc8281117b928db32c4a90bcc9edc402edf"
+  "gitHead": "b1271954a204909d708b6f4f78d12bab5631a489"
 }

package/src/components/common/code-block.tsx

@@ -1,4 +1,4 @@
-import PropTypes from "prop-types";
+
 import React from "react";
 
 interface DefaultComponentProps {
@@ -6,9 +6,7 @@ interface DefaultComponentProps {
 }
 
 export default class DefaultComponent extends React.Component<DefaultComponentProps> {
-  static propTypes = {
-    children: PropTypes.string,
-  };
+
 
   static defaultProps = {
     children: "",

package/src/stories/CellEditing.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+
 import type { Meta, StoryObj } from '@storybook/react-webpack5';
 
 // import bootstrap style by given version
@@ -1216,10 +1216,6 @@ interface QualityRangerState { }
 class QualityRanger extends React.Component<QualityRangerProps, QualityRangerState> {
   range: HTMLInputElement | null = null;
 
-  static propTypes = {
-    value: PropTypes.number,
-    onUpdate: PropTypes.func.isRequired,
-  };
 
   static defaultProps = {
     value: 0,
@@ -1281,11 +1277,15 @@ export const CustomEditor: Story = {
     import BootstrapTable from 'react-bootstrap-table-ng';
     import cellEditFactory from 'react-bootstrap-table-ng-editor';
 
-    class QualityRanger extends React.Component {
-      static propTypes = {
-        value: PropTypes.number,
-        onUpdate: PropTypes.func.isRequired
-      }
+    interface QualityRangerProps {
+      value?: number;
+      onUpdate: (value: number) => void;
+    }
+
+    interface QualityRangerState { }
+
+    class QualityRanger extends React.Component<QualityRangerProps, QualityRangerState> {
+
       static defaultProps = {
         value: 0
       }

package/src/stories/ColumnFilter.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react-webpack5';
-import PropTypes from "prop-types";
+
 import React from "react";
 
 // import bootstrap style by given version
@@ -1568,11 +1568,7 @@ interface PriceFilterProps {
 }
 
 class PriceFilter extends React.Component<PriceFilterProps> {
-  static propTypes = {
-    column: PropTypes.object.isRequired,
-    onFilter: PropTypes.func.isRequired,
-  };
-
+  
   private input: HTMLInputElement | null;
 
   constructor(props: PriceFilterProps) {
@@ -1633,12 +1629,14 @@ export const CustomFilter: Story = {
     import BootstrapTable from 'react-bootstrap-table-ng';
     import filterFactory, { textFilter, customFilter } from 'react-bootstrap-table-ng-filter';
 
-    class PriceFilter extends React.Component {
-      static propTypes = {
-        column: PropTypes.object.isRequired,
-        onFilter: PropTypes.func.isRequired
-      }
-      constructor(props) {
+    interface PriceFilterProps {
+      column: any;
+      onFilter: (value: string) => void;
+    }
+
+    class PriceFilter extends React.Component<PriceFilterProps> {
+      
+      constructor(props: PriceFilterProps) {
         super(props);
         this.filter = this.filter.bind(this);
         this.getValue = this.getValue.bind(this);
@@ -1695,10 +1693,6 @@ interface AdvancePriceFilterProps {
 }
 
 class AdvancePriceFilter extends React.Component<AdvancePriceFilterProps, { value: number }> {
-  static propTypes = {
-    column: PropTypes.object.isRequired,
-    onFilter: PropTypes.func.isRequired,
-  };
 
   private range: HTMLInputElement | null;
   private showValue: HTMLParagraphElement | null;
@@ -1798,12 +1792,14 @@ export const AdvanceCustomFilter: Story = {
     import BootstrapTable from 'react-bootstrap-table-ng';
     import filterFactory, { textFilter, customFilter, Comparator, FILTER_TYPES } from 'react-bootstrap-table-ng-filter';
 
-    class PriceFilter extends React.Component {
-      static propTypes = {
-        column: PropTypes.object.isRequired,
-        onFilter: PropTypes.func.isRequired
-      }
-      constructor(props) {
+    interface PriceFilterProps {
+      column: any;
+      onFilter: (value: string) => void;
+    }
+
+    class PriceFilter extends React.Component<PriceFilterProps> {
+    
+      constructor(props: PriceFilterProps) {
         super(props);
         this.filter = this.filter.bind(this);
         this.getValue = this.getValue.bind(this);

package/src/stories/Remote.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable import/no-anonymous-default-export */
-import PropTypes from "prop-types";
+
 import React from "react";
 
 import BootstrapTable from "../../../react-bootstrap-table-ng";
@@ -121,7 +121,12 @@ class Container extends React.Component {
 }
 `;
 
-const RemoteSort = (props: any) => (
+interface RemoteSortProps {
+  data: any[];
+  onTableChange: (type: any, context: any) => void;
+}
+
+const RemoteSort = (props: RemoteSortProps) => (
   <div>
     <BootstrapTable
       remote={{ sort: true }}
@@ -134,10 +139,6 @@ const RemoteSort = (props: any) => (
   </div>
 );
 
-RemoteSort.propTypes = {
-  data: PropTypes.array.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface RemoteSortState {
   data: any;
@@ -282,7 +283,12 @@ class Container extends React.Component {
 }
 `;
 
-const RemoteFilter = (props: any) => (
+interface RemoteFilterProps {
+  data: any[];
+  onTableChange: (type: any, context: any) => void;
+}
+
+const RemoteFilter = (props: RemoteFilterProps) => (
   <div>
     <BootstrapTable
       remote={{ filter: true }}
@@ -296,10 +302,6 @@ const RemoteFilter = (props: any) => (
   </div>
 );
 
-RemoteFilter.propTypes = {
-  data: PropTypes.array.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface RemoteFilterState {
   data: any;
@@ -403,13 +405,21 @@ class Container extends React.Component {
 }
 `;
 
+interface RemotePaginationProps {
+  data: any[];
+  page: number;
+  totalSize: number;
+  sizePerPage: number;
+  onTableChange: (type: any, context: any) => void;
+}
+
 const RemotePagination = ({
   data,
   page,
   sizePerPage,
   onTableChange,
   totalSize,
-}: any) => (
+}: RemotePaginationProps) => (
   <div>
     <BootstrapTable
       remote
@@ -436,13 +446,6 @@ const RemotePagination = ({
   </div>
 );
 
-RemotePagination.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface RemotePaginationState {
   data: any;
@@ -589,7 +592,12 @@ class Container extends React.Component {
 }
 `;
 
-const RemoteSearch = (props: any) => (
+interface RemoteSearchProps {
+  data: any[];
+  onTableChange: (type: any, context: any) => void;
+}
+
+const RemoteSearch = (props: RemoteSearchProps) => (
   <div>
     <ToolkitProvider
       keyField="id"
@@ -612,10 +620,6 @@ const RemoteSearch = (props: any) => (
   </div>
 );
 
-RemoteSearch.propTypes = {
-  data: PropTypes.array.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface RemoteSearchState {
   data: any;
@@ -733,7 +737,13 @@ class Container extends React.Component {
 }
 `;
 
-const RemoteCellEdit = (props: any) => {
+interface RemoteCellEditProps {
+  data: any[];
+  onTableChange: (type: any, context: any) => void;
+  errorMessage: string;
+}
+
+const RemoteCellEdit = (props: RemoteCellEditProps) => {
   const cellEdit = {
     mode: "click",
     errorMessage: props.errorMessage,
@@ -767,11 +777,6 @@ const RemoteCellEdit = (props: any) => {
   );
 };
 
-RemoteCellEdit.propTypes = {
-  data: PropTypes.array.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-  errorMessage: PropTypes.string.isRequired,
-};
 
 interface RemoteCellEditState {
   data: any;
@@ -876,13 +881,6 @@ const RemoteAll = ({ data, page, sizePerPage, onTableChange, totalSize }) => (
   </div>
 );
 
-RemoteAll.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired
-};
 
 class Container extends React.Component {
   constructor(props) {
@@ -974,13 +972,21 @@ class Container extends React.Component {
 }
 `;
 
+interface RemoteAllProps {
+  data: any[];
+  page: number;
+  totalSize: number;
+  sizePerPage: number;
+  onTableChange: (type: any, context: any) => void;
+}
+
 const RemoteAll = ({
   data,
   page,
   sizePerPage,
   onTableChange,
   totalSize,
-}: any) => (
+}: RemoteAllProps) => (
   <div>
     <h3>
       When <code>remote.pagination</code> is enabled, the filtering, sorting and
@@ -1028,14 +1034,6 @@ const RemoteAll = ({
   </div>
 );
 
-RemoteAll.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
-
 let products = productsGenerator(87);
 
 interface RemoteAllState {
@@ -1286,8 +1284,8 @@ class RemoteAllExportComponent extends React.Component {
     }, 2000);
   };
 
-  handleExport = onExport => e => {
-    onExport(this.state.allData);
+  handleExport = (onExport: any) => (e: any) => {
+    onExport((this.state as any).allData);
   };
 
   render() {
@@ -1397,7 +1395,18 @@ const productColumns = [
 const { ExportCSVButton } = CSVExport;
 
 //leslint-disable-next-line react/proprtypes
-const CustomToggleList = ({ columns, onColumnToggle, toggles }) => (
+interface CustomToggleListProps {
+  columns: any[];
+  onColumnToggle: (dataField: string) => void;
+  toggles: any;
+}
+
+const CustomToggleList = ({
+  columns,
+  onColumnToggle,
+  toggles,
+}: CustomToggleListProps) => (
+
   <div className="btn-group btn-group-toggle" data-toggle="buttons" style={{ marginBottom: '10px' }}>
     {columns
       .filter(column => !(column.toggleHidden === true))

package/src/stories/TableOverlay.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable import/no-anonymous-default-export */
-import PropTypes from "prop-types";
+
 import React from "react";
 
 import BootstrapTable from "../../../react-bootstrap-table-ng";
@@ -93,13 +93,21 @@ class EmptyTableOverlay extends React.Component {
 }
 `;
 
+interface TableProps {
+  data: any[];
+  page: number;
+  totalSize: number;
+  sizePerPage: number;
+  onTableChange: (type: any, context: any) => void;
+}
+
 const Table = ({
   data,
   page,
   sizePerPage,
   onTableChange,
   totalSize,
-}: any) => (
+}: TableProps) => (
   <div>
     <BootstrapTable
       remote
@@ -127,13 +135,6 @@ const Table = ({
   </div>
 );
 
-Table.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface EmptyTableOverlayState {
   data: any;
@@ -201,14 +202,14 @@ const RemotePagination = ({ loading, data, page, sizePerPage, onTableChange, tot
   </div>
 );
 
-RemotePagination.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  loading: PropTypes.bool.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired
-};
+interface RemotePaginationProps {
+  data: any[];
+  page: number;
+  loading: boolean;
+  totalSize: number;
+  sizePerPage: number;
+  onTableChange: (type: any, context: any) => void;
+}
 
 class Container extends React.Component {
   constructor(props) {
@@ -250,6 +251,15 @@ class Container extends React.Component {
 }
 `;
 
+interface RemotePaginationProps {
+  data: any[];
+  page: number;
+  loading: boolean;
+  totalSize: number;
+  sizePerPage: number;
+  onTableChange: (type: any, context: any) => void;
+}
+
 const RemotePagination = ({
   loading,
   data,
@@ -257,7 +267,7 @@ const RemotePagination = ({
   sizePerPage,
   onTableChange,
   totalSize,
-}: any) => (
+}: RemotePaginationProps) => (
   <div>
     <BootstrapTable
       remote
@@ -294,14 +304,6 @@ const RemotePagination = ({
   </div>
 );
 
-RemotePagination.propTypes = {
-  data: PropTypes.array.isRequired,
-  page: PropTypes.number.isRequired,
-  loading: PropTypes.bool.isRequired,
-  totalSize: PropTypes.number.isRequired,
-  sizePerPage: PropTypes.number.isRequired,
-  onTableChange: PropTypes.func.isRequired,
-};
 
 interface TableOverlayState {
   data: any;

package/src/stories/bootstrap-style.tsx

@@ -1,5 +1,5 @@
 /* eslint no-return-assign: 0 */
-import PropTypes from "prop-types";
+
 import React, { Fragment, PureComponent } from "react";
 
 interface WithBootstrapStyleProps {
@@ -17,10 +17,7 @@ export const BOOTSTRAP_VERSION = {
 };
 
 class WithBootstrapStyle extends PureComponent<WithBootstrapStyleProps, WithBootstrapStyleState> {
-  static propTypes = {
-    version: PropTypes.string.isRequired,
-    render: PropTypes.func.isRequired,
-  };
+
 
   style: HTMLLinkElement | null = null;
 

package/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es2021",
+    "target": "ES2023",
     "lib": [
       "dom",
       "dom.iterable",