baseui 10.10.0 → 10.11.0

package/table-semantic/table-builder.js.flow

@@ -23,14 +23,14 @@ import {
   StyledSortDescIcon,
   StyledSortNoneIcon,
 } from './styled-components.js';
-import {getOverrides} from '../helpers/overrides.js';
-import {isFocusVisible, forkFocus, forkBlur} from '../utils/focusVisible.js';
+import { getOverrides } from '../helpers/overrides.js';
+import { isFocusVisible, forkFocus, forkBlur } from '../utils/focusVisible.js';
 
-import type {TableBuilderPropsT} from './types.js';
+import type { TableBuilderPropsT } from './types.js';
 
 export default class TableBuilder<T> extends React.Component<
   TableBuilderPropsT<T>,
-  {isFocusVisible: boolean},
+  { isFocusVisible: boolean }
 > {
   static defaultProps = {
     data: [],
@@ -43,13 +43,13 @@ export default class TableBuilder<T> extends React.Component<
 
   handleFocus = (event: SyntheticEvent<>) => {
     if (isFocusVisible(event)) {
-      this.setState({isFocusVisible: true});
+      this.setState({ isFocusVisible: true });
     }
   };
 
   handleBlur = (event: SyntheticEvent<>) => {
     if (this.state.isFocusVisible !== false) {
-      this.setState({isFocusVisible: false});
+      this.setState({ isFocusVisible: false });
     }
   };
 
@@ -74,69 +74,60 @@ export default class TableBuilder<T> extends React.Component<
 
     const [Table, tableProps] = getOverrides(overrides.Table, StyledTable);
 
-    const [TableHead, tableHeadProps] = getOverrides(
-      overrides.TableHead,
-      StyledTableHead,
-    );
+    const [TableHead, tableHeadProps] = getOverrides(overrides.TableHead, StyledTableHead);
 
     const [TableHeadRow, tableHeadRowProps] = getOverrides(
       overrides.TableHeadRow,
-      StyledTableHeadRow,
+      StyledTableHeadRow
     );
 
     const [TableHeadCell, tableHeadCellProps] = getOverrides(
       overrides.TableHeadCell,
-      StyledTableHeadCell,
+      StyledTableHeadCell
     );
 
     const [TableHeadCellSortable, tableHeadCellSortableProps] = getOverrides(
       overrides.TableHeadCellSortable,
-      StyledTableHeadCellSortable,
+      StyledTableHeadCellSortable
     );
 
-    const [TableBody, tableBodyProps] = getOverrides(
-      overrides.TableBody,
-      StyledTableBody,
-    );
+    const [TableBody, tableBodyProps] = getOverrides(overrides.TableBody, StyledTableBody);
 
     const [TableBodyRow, tableBodyRowProps] = getOverrides(
       overrides.TableBodyRow,
-      StyledTableBodyRow,
+      StyledTableBodyRow
     );
 
     const [TableBodyCell, tableBodyCellProps] = getOverrides(
       overrides.TableBodyCell,
-      StyledTableBodyCell,
+      StyledTableBodyCell
     );
 
     const [TableLoadingMessage, tableLoadingMessageProps] = getOverrides(
       overrides.TableLoadingMessage,
-      StyledTableLoadingMessage,
+      StyledTableLoadingMessage
     );
 
     const [TableEmptyMessage, tableEmptyMessageProps] = getOverrides(
       overrides.TableEmptyMessage,
-      StyledTableEmptyMessage,
+      StyledTableEmptyMessage
     );
 
-    const [SortAscIcon, sortAscIconProps] = getOverrides(
-      overrides.SortAscIcon,
-      StyledSortAscIcon,
-    );
+    const [SortAscIcon, sortAscIconProps] = getOverrides(overrides.SortAscIcon, StyledSortAscIcon);
 
     const [SortDescIcon, sortDescIconProps] = getOverrides(
       overrides.SortDescIcon,
-      StyledSortDescIcon,
+      StyledSortDescIcon
     );
 
     const [SortNoneIcon, sortNoneIconProps] = getOverrides(
       overrides.SortNoneIcon,
-      StyledSortNoneIcon,
+      StyledSortNoneIcon
     );
 
     const columns = React.Children.toArray(children)
       .filter(Boolean)
-      .map(child => child.props);
+      .map((child) => child.props);
 
     function renderHeader(col, colIndex, isFocusVisible) {
       const colOverrides = col.overrides || {};
@@ -144,7 +135,7 @@ export default class TableBuilder<T> extends React.Component<
       if (!col.sortable) {
         const [ColTableHeadCell, colTableHeadCellProps] = getOverrides(
           colOverrides.TableHeadCell,
-          TableHeadCell,
+          TableHeadCell
         );
 
         return (
@@ -163,12 +154,9 @@ export default class TableBuilder<T> extends React.Component<
         );
       }
 
-      const [
-        ColTableHeadCellSortable,
-        colTableHeadCellSortableProps,
-      ] = getOverrides(
+      const [ColTableHeadCellSortable, colTableHeadCellSortableProps] = getOverrides(
         colOverrides.TableHeadCellSortable,
-        TableHeadCellSortable,
+        TableHeadCellSortable
       );
 
       let sortIcon = null;
@@ -176,33 +164,15 @@ export default class TableBuilder<T> extends React.Component<
 
       switch (col.id === sortColumn && sortOrder) {
         case 'ASC':
-          sortIcon = (
-            <SortAscIcon
-              aria-hidden={true}
-              role="presentation"
-              {...sortAscIconProps}
-            />
-          );
+          sortIcon = <SortAscIcon aria-hidden={true} role="presentation" {...sortAscIconProps} />;
           sortLabel = 'ascending sorting';
           break;
         case 'DESC':
-          sortIcon = (
-            <SortDescIcon
-              aria-hidden={true}
-              role="presentation"
-              {...sortDescIconProps}
-            />
-          );
+          sortIcon = <SortDescIcon aria-hidden={true} role="presentation" {...sortDescIconProps} />;
           sortLabel = 'descending sorting';
           break;
         default:
-          sortIcon = (
-            <SortNoneIcon
-              aria-hidden={true}
-              role="presentation"
-              {...sortNoneIconProps}
-            />
-          );
+          sortIcon = <SortNoneIcon aria-hidden={true} role="presentation" {...sortNoneIconProps} />;
           break;
       }
 
@@ -238,7 +208,7 @@ export default class TableBuilder<T> extends React.Component<
 
       const [ColTableBodyCell, colTableBodyCellProps] = getOverrides(
         colOverrides.TableBodyCell,
-        TableBodyCell,
+        TableBodyCell
       );
 
       return (
@@ -265,12 +235,7 @@ export default class TableBuilder<T> extends React.Component<
     const isRendered = !isLoading && !isEmpty;
 
     return (
-      <Root
-        data-baseweb="table-builder-semantic"
-        $divider={divider}
-        {...rootProps}
-        {...rest}
-      >
+      <Root data-baseweb="table-builder-semantic" $divider={divider} {...rootProps} {...rest}>
         <Table
           $width={horizontalScrollWidth}
           {...tableProps}
@@ -280,7 +245,7 @@ export default class TableBuilder<T> extends React.Component<
           <TableHead {...tableHeadProps}>
             <TableHeadRow {...tableHeadRowProps}>
               {columns.map((col, colIndex) =>
-                renderHeader(col, colIndex, this.state.isFocusVisible),
+                renderHeader(col, colIndex, this.state.isFocusVisible)
               )}
             </TableHeadRow>
           </TableHead>
@@ -289,9 +254,7 @@ export default class TableBuilder<T> extends React.Component<
               <tr>
                 <td colSpan={columns.length}>
                   <TableLoadingMessage {...tableLoadingMessageProps}>
-                    {typeof loadingMessage === 'function'
-                      ? loadingMessage()
-                      : loadingMessage}
+                    {typeof loadingMessage === 'function' ? loadingMessage() : loadingMessage}
                   </TableLoadingMessage>
                 </td>
               </tr>
@@ -300,9 +263,7 @@ export default class TableBuilder<T> extends React.Component<
               <tr>
                 <td colSpan={columns.length}>
                   <TableEmptyMessage {...tableEmptyMessageProps}>
-                    {typeof emptyMessage === 'function'
-                      ? emptyMessage()
-                      : emptyMessage}
+                    {typeof emptyMessage === 'function' ? emptyMessage() : emptyMessage}
                   </TableEmptyMessage>
                 </td>
               </tr>
@@ -317,7 +278,7 @@ export default class TableBuilder<T> extends React.Component<
                   {...tableBodyRowProps}
                 >
                   {columns.map((col, colIndex) =>
-                    renderCell(col, colIndex, row, rowIndex, data.length - 1),
+                    renderCell(col, colIndex, row, rowIndex, data.length - 1)
                   )}
                 </TableBodyRow>
               ))}

package/table-semantic/table.js.flow

@@ -19,9 +19,9 @@ import {
   StyledTableLoadingMessage,
   StyledTableEmptyMessage,
 } from './styled-components.js';
-import {getOverrides} from '../helpers/overrides.js';
+import { getOverrides } from '../helpers/overrides.js';
 
-import type {TablePropsT} from './types.js';
+import type { TablePropsT } from './types.js';
 
 export default class Table extends React.Component<TablePropsT> {
   static defaultProps = {
@@ -48,56 +48,45 @@ export default class Table extends React.Component<TablePropsT> {
 
     const [Table, tableProps] = getOverrides(overrides.Table, StyledTable);
 
-    const [TableHead, tableHeadProps] = getOverrides(
-      overrides.TableHead,
-      StyledTableHead,
-    );
+    const [TableHead, tableHeadProps] = getOverrides(overrides.TableHead, StyledTableHead);
 
     const [TableHeadRow, tableHeadRowProps] = getOverrides(
       overrides.TableHeadRow,
-      StyledTableHeadRow,
+      StyledTableHeadRow
     );
 
     const [TableHeadCell, tableHeadCellProps] = getOverrides(
       overrides.TableHeadCell,
-      StyledTableHeadCell,
+      StyledTableHeadCell
     );
 
-    const [TableBody, tableBodyProps] = getOverrides(
-      overrides.TableBody,
-      StyledTableBody,
-    );
+    const [TableBody, tableBodyProps] = getOverrides(overrides.TableBody, StyledTableBody);
 
     const [TableBodyRow, tableBodyRowProps] = getOverrides(
       overrides.TableBodyRow,
-      StyledTableBodyRow,
+      StyledTableBodyRow
     );
 
     const [TableBodyCell, tableBodyCellProps] = getOverrides(
       overrides.TableBodyCell,
-      StyledTableBodyCell,
+      StyledTableBodyCell
     );
 
     const [TableLoadingMessage, tableLoadingMessageProps] = getOverrides(
       overrides.TableLoadingMessage,
-      StyledTableLoadingMessage,
+      StyledTableLoadingMessage
     );
 
     const [TableEmptyMessage, tableEmptyMessageProps] = getOverrides(
       overrides.TableEmptyMessage,
-      StyledTableEmptyMessage,
+      StyledTableEmptyMessage
     );
 
     const isEmpty = !isLoading && data.length === 0;
     const isRendered = !isLoading && !isEmpty;
 
     return (
-      <Root
-        data-baseweb="table-semantic"
-        $divider={divider}
-        {...rootProps}
-        {...rest}
-      >
+      <Root data-baseweb="table-semantic" $divider={divider} {...rootProps} {...rest}>
         <Table $width={horizontalScrollWidth} {...tableProps}>
           <TableHead {...tableHeadProps}>
             <TableHeadRow {...tableHeadRowProps}>
@@ -120,9 +109,7 @@ export default class Table extends React.Component<TablePropsT> {
               <tr>
                 <td colSpan={columns.length}>
                   <TableLoadingMessage {...tableLoadingMessageProps}>
-                    {typeof loadingMessage === 'function'
-                      ? loadingMessage()
-                      : loadingMessage}
+                    {typeof loadingMessage === 'function' ? loadingMessage() : loadingMessage}
                   </TableLoadingMessage>
                 </td>
               </tr>
@@ -131,9 +118,7 @@ export default class Table extends React.Component<TablePropsT> {
               <tr>
                 <td colSpan={columns.length}>
                   <TableEmptyMessage {...tableEmptyMessageProps}>
-                    {typeof emptyMessage === 'function'
-                      ? emptyMessage()
-                      : emptyMessage}
+                    {typeof emptyMessage === 'function' ? emptyMessage() : emptyMessage}
                   </TableEmptyMessage>
                 </td>
               </tr>

package/table-semantic/types.js.flow

@@ -7,8 +7,8 @@ LICENSE file in the root directory of this source tree.
 // @flow
 import * as React from 'react';
 
-import type {OverrideT} from '../helpers/overrides.js';
-import {SIZE, DIVIDER} from './constants.js';
+import type { OverrideT } from '../helpers/overrides.js';
+import { SIZE, DIVIDER } from './constants.js';
 
 export type SizeT = $Keys<typeof SIZE>;
 export type DividerT = $Keys<typeof DIVIDER>;

package/tabs/index.js.flow

@@ -5,11 +5,11 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // @flow
-export {default as Tabs} from './tabs.js';
-export {default as StatefulTabs} from './stateful-tabs.js';
-export {default as Tab} from './tab.js';
+export { default as Tabs } from './tabs.js';
+export { default as StatefulTabs } from './stateful-tabs.js';
+export { default as Tab } from './tab.js';
 // Constants
-export {ORIENTATION, STATE_CHANGE_TYPE} from './constants.js';
+export { ORIENTATION, STATE_CHANGE_TYPE } from './constants.js';
 // Styled elements
 export {
   Root as StyledRoot,

package/tabs/stateful-tabs.js.flow

@@ -7,17 +7,10 @@ LICENSE file in the root directory of this source tree.
 // @flow
 import * as React from 'react';
 import Tabs from './tabs.js';
-import {STATE_CHANGE_TYPE} from './constants.js';
-import type {
-  StatefulTabsPropsT,
-  StatefulTabsStateT,
-  StateChangeTypeT,
-} from './types.js';
+import { STATE_CHANGE_TYPE } from './constants.js';
+import type { StatefulTabsPropsT, StatefulTabsStateT, StateChangeTypeT } from './types.js';
 
-export default class StatefulTabs extends React.Component<
-  StatefulTabsPropsT,
-  StatefulTabsStateT,
-> {
+export default class StatefulTabs extends React.Component<StatefulTabsPropsT, StatefulTabsStateT> {
   static defaultProps: $Shape<StatefulTabsPropsT> = {
     disabled: false,
     onChange: () => {},
@@ -34,33 +27,24 @@ export default class StatefulTabs extends React.Component<
   };
 
   internalSetState(type: StateChangeTypeT, changes: StatefulTabsStateT) {
-    const {stateReducer, onChange} = this.props;
+    const { stateReducer, onChange } = this.props;
     const newState = stateReducer(type, changes, this.state);
     this.setState(newState);
     typeof onChange === 'function' && onChange(newState);
   }
 
   getInitialKey() {
-    const {initialState, children} = this.props;
+    const { initialState, children } = this.props;
     if (initialState && initialState.activeKey) {
       return initialState.activeKey;
     } else {
-      return React.Children.map(
-        children,
-        (child, index) => child.key || String(index),
-      )[0];
+      return React.Children.map(children, (child, index) => child.key || String(index))[0];
     }
   }
 
   render() {
-    const {initialState, stateReducer, ...restProps} = this.props;
-    return (
-      <Tabs
-        {...restProps}
-        activeKey={this.state.activeKey}
-        onChange={this.onTabChange}
-      />
-    );
+    const { initialState, stateReducer, ...restProps } = this.props;
+    return <Tabs {...restProps} activeKey={this.state.activeKey} onChange={this.onTabChange} />;
   }
 }
 

package/tabs/styled-components.js.flow

@@ -5,13 +5,13 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // @flow
-import {styled} from '../styles/index.js';
-import {ORIENTATION} from './constants.js';
-import type {SharedStylePropsArgT} from './types.js';
+import { styled } from '../styles/index.js';
+import { ORIENTATION } from './constants.js';
+import type { SharedStylePropsArgT } from './types.js';
 
 // $FlowFixMe https://github.com/facebook/flow/issues/7745
-export const Root = styled<SharedStylePropsArgT>('div', props => {
-  const {$orientation} = props;
+export const Root = styled<SharedStylePropsArgT>('div', (props) => {
+  const { $orientation } = props;
   return {
     display: 'flex',
     flexDirection: $orientation === ORIENTATION.vertical ? 'row' : 'column',
@@ -19,13 +19,13 @@ export const Root = styled<SharedStylePropsArgT>('div', props => {
 });
 
 // $FlowFixMe https://github.com/facebook/flow/issues/7745
-export const Tab = styled<SharedStylePropsArgT>('div', props => {
+export const Tab = styled<SharedStylePropsArgT>('div', (props) => {
   const {
     $disabled,
     $active,
     $orientation,
     $isFocusVisible,
-    $theme: {colors, sizing, typography},
+    $theme: { colors, sizing, typography },
   } = props;
   let style = {
     ...typography.font200,
@@ -61,10 +61,10 @@ export const Tab = styled<SharedStylePropsArgT>('div', props => {
 });
 
 // $FlowFixMe https://github.com/facebook/flow/issues/7745
-export const TabBar = styled<SharedStylePropsArgT>('div', props => {
+export const TabBar = styled<SharedStylePropsArgT>('div', (props) => {
   const {
     $orientation,
-    $theme: {colors, sizing},
+    $theme: { colors, sizing },
   } = props;
   return {
     display: 'flex',
@@ -76,10 +76,10 @@ export const TabBar = styled<SharedStylePropsArgT>('div', props => {
 });
 
 // $FlowFixMe https://github.com/facebook/flow/issues/7745
-export const TabContent = styled<SharedStylePropsArgT>('div', props => {
+export const TabContent = styled<SharedStylePropsArgT>('div', (props) => {
   const {
     $active,
-    $theme: {sizing, typography},
+    $theme: { sizing, typography },
   } = props;
   return {
     ...typography.font300,

package/tabs/tab.js.flow

@@ -6,16 +6,13 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import {getOverrides} from '../helpers/overrides.js';
-import {Tab as StyledTab} from './styled-components.js';
-import {isFocusVisible, forkFocus, forkBlur} from '../utils/focusVisible.js';
+import { getOverrides } from '../helpers/overrides.js';
+import { Tab as StyledTab } from './styled-components.js';
+import { isFocusVisible, forkFocus, forkBlur } from '../utils/focusVisible.js';
 
-import type {TabPropsT, SharedStylePropsArgT} from './types.js';
+import type { TabPropsT, SharedStylePropsArgT } from './types.js';
 
-class TabComponent extends React.Component<
-  TabPropsT,
-  {isFocusVisible: boolean},
-> {
+class TabComponent extends React.Component<TabPropsT, { isFocusVisible: boolean }> {
   static defaultProps = {
     disabled: false,
     expanded: false,
@@ -25,22 +22,22 @@ class TabComponent extends React.Component<
     title: '',
   };
 
-  state = {isFocusVisible: false};
+  state = { isFocusVisible: false };
 
   handleFocus = (event: SyntheticEvent<>) => {
     if (isFocusVisible(event)) {
-      this.setState({isFocusVisible: true});
+      this.setState({ isFocusVisible: true });
     }
   };
 
   handleBlur = (event: SyntheticEvent<>) => {
     if (this.state.isFocusVisible !== false) {
-      this.setState({isFocusVisible: false});
+      this.setState({ isFocusVisible: false });
     }
   };
 
   onClick = (e: Event) => {
-    const {disabled, onSelect, onClick} = this.props;
+    const { disabled, onSelect, onClick } = this.props;
     if (disabled) {
       return;
     }
@@ -50,7 +47,7 @@ class TabComponent extends React.Component<
   };
 
   onKeyDown = (e: KeyboardEvent) => {
-    const {disabled, onSelect, onKeyDown} = this.props;
+    const { disabled, onSelect, onKeyDown } = this.props;
     if (disabled) {
       return;
     }
@@ -64,7 +61,7 @@ class TabComponent extends React.Component<
   };
 
   getSharedProps(): SharedStylePropsArgT {
-    const {disabled, active, $orientation} = this.props;
+    const { disabled, active, $orientation } = this.props;
     return {
       $disabled: disabled,
       $active: active,
@@ -73,9 +70,9 @@ class TabComponent extends React.Component<
   }
 
   render() {
-    const {active, disabled, id, overrides = {}, children} = this.props;
+    const { active, disabled, id, overrides = {}, children } = this.props;
     const sharedProps = this.getSharedProps();
-    const {Tab: TabOverride} = overrides;
+    const { Tab: TabOverride } = overrides;
     const [Tab, tabProps] = getOverrides(TabOverride, StyledTab);
 
     return (

package/tabs/tabs.js

@@ -86,7 +86,7 @@ var Tabs = /*#__PURE__*/function (_React$Component) {
           orientation = _this$props.orientation,
           children = _this$props.children,
           _this$props$overrides = _this$props.overrides,
-          overrides = _this$props$overrides === void 0 ? {} : _this$props$overrides; // eslint-disable-next-line flowtype/no-weak-types
+          overrides = _this$props$overrides === void 0 ? {} : _this$props$overrides; // flowlint-next-line unclear-type:off
 
       var tabs = React.Children.map(children, function (child, index) {
         if (!child) return;
@@ -125,7 +125,7 @@ var Tabs = /*#__PURE__*/function (_React$Component) {
       var _getOverrides = (0, _overrides.getOverrides)(TabContentOverride, _styledComponents.TabContent),
           _getOverrides2 = _slicedToArray(_getOverrides, 2),
           TabContent = _getOverrides2[0],
-          tabContentProps = _getOverrides2[1]; // eslint-disable-next-line flowtype/no-weak-types
+          tabContentProps = _getOverrides2[1]; // flowlint-next-line unclear-type:off
 
 
       var tabs = React.Children.map(children, function (child, index) {