baseui 12.1.3 → 13.0.0

package/input/stateful-container.js

@@ -76,12 +76,14 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
         value: e.target.value
       };
 
-      _this.internalSetState(_constants.STATE_CHANGE_TYPE.change, nextState);
+      _this.internalSetState(_constants.STATE_CHANGE_TYPE.change, nextState); // @ts-ignore
+
 
       _this.props.onChange(e);
     });
 
     _defineProperty(_assertThisInitialized(_this), "internalSetState", function (type, nextState) {
+      // @ts-ignore
       var newState = _this.props.stateReducer(type, nextState, _this.state);
 
       _this.setState(newState);
@@ -102,6 +104,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
 
       var onChange = this.onChange;
       return children(_objectSpread(_objectSpread(_objectSpread({}, restProps), this.state), {}, {
+        // @ts-ignore
         onChange: onChange
       }));
     }

package/input/styled-components.js

@@ -75,9 +75,12 @@ exports.StyledClearIcon = StyledClearIcon;
 StyledClearIcon.displayName = "StyledClearIcon";
 StyledClearIcon.displayName = 'StyledClearIcon';
 
-function getInputPadding(size, sizing) {
+function getInputPadding( // @ts-ignore
+size, // @ts-ignore
+sizing) {
   var _SIZE$mini$SIZE$compa3;
 
+  // @ts-ignore
   return (_SIZE$mini$SIZE$compa3 = {}, _defineProperty(_SIZE$mini$SIZE$compa3, _constants.SIZE.mini, {
     paddingTop: sizing.scale100,
     paddingBottom: sizing.scale100,
@@ -101,24 +104,35 @@ function getInputPadding(size, sizing) {
   }), _SIZE$mini$SIZE$compa3)[size];
 }
 
-function getRootPadding(adjoined, size, sizing, direction, hasIconTrailing) {
+function getRootPadding( // @ts-ignore
+adjoined, // @ts-ignore
+size, // @ts-ignore
+sizing, // @ts-ignore
+direction, // @ts-ignore
+hasIconTrailing) {
   var ifLeftPad = adjoined === _constants.ADJOINED.both || adjoined === _constants.ADJOINED.left && direction !== 'rtl' || adjoined === _constants.ADJOINED.right && direction === 'rtl' || hasIconTrailing && direction === 'rtl';
   var ifRightPad = adjoined === _constants.ADJOINED.both || adjoined === _constants.ADJOINED.right && direction !== 'rtl' || adjoined === _constants.ADJOINED.left && direction === 'rtl' || hasIconTrailing && direction !== 'rtl';
   return {
     paddingLeft: ifLeftPad ? sizing.scale550 : '0px',
     paddingRight: ifRightPad ? sizing.scale550 : '0px'
   };
-}
+} // @ts-ignore
+
 
 function getFont(size, typography) {
   var _SIZE$mini$SIZE$compa4;
 
+  // @ts-ignore
   return (_SIZE$mini$SIZE$compa4 = {}, _defineProperty(_SIZE$mini$SIZE$compa4, _constants.SIZE.mini, typography.font100), _defineProperty(_SIZE$mini$SIZE$compa4, _constants.SIZE.compact, typography.font200), _defineProperty(_SIZE$mini$SIZE$compa4, _constants.SIZE.default, typography.font300), _defineProperty(_SIZE$mini$SIZE$compa4, _constants.SIZE.large, typography.font400), _SIZE$mini$SIZE$compa4)[size];
 }
 
-function getRootColors($disabled, $isFocused, $error) {
+function getRootColors( // @ts-ignore
+$disabled, // @ts-ignore
+$isFocused, // @ts-ignore
+$error) {
   var $positive = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-  var colors = arguments.length > 4 ? arguments[4] : undefined;
+  var // @ts-ignore
+  colors = arguments.length > 4 ? arguments[4] : undefined;
 
   if ($disabled) {
     return {
@@ -169,7 +183,9 @@ function getRootColors($disabled, $isFocused, $error) {
   };
 }
 
-function getRootBorderRadius(size, borders) {
+function getRootBorderRadius( // @ts-ignore
+size, // @ts-ignore
+borders) {
   var radius = borders.inputBorderRadius;
 
   if (size === _constants.SIZE.mini) {
@@ -224,9 +240,11 @@ exports.Root = Root;
 Root.displayName = "Root";
 Root.displayName = 'Root'; // InputEnhancer
 
+// @ts-ignore
 function getInputEnhancerPadding($size, sizing) {
   var _SIZE$mini$SIZE$compa5;
 
+  // @ts-ignore
   return (_SIZE$mini$SIZE$compa5 = {}, _defineProperty(_SIZE$mini$SIZE$compa5, _constants.SIZE.mini, {
     paddingRight: sizing.scale400,
     paddingLeft: sizing.scale400
@@ -240,7 +258,8 @@ function getInputEnhancerPadding($size, sizing) {
     paddingRight: sizing.scale200,
     paddingLeft: sizing.scale200
   }), _SIZE$mini$SIZE$compa5)[$size];
-}
+} // @ts-ignore
+
 
 function getInputEnhancerColors($disabled, $isFocused, $error, $positive, colors) {
   if ($disabled) {
@@ -300,6 +319,7 @@ var InputEnhancer = (0, _styles.styled)('div', function (props) {
 exports.InputEnhancer = InputEnhancer;
 InputEnhancer.displayName = "InputEnhancer";
 InputEnhancer.displayName = 'InputEnhancer'; // InputContainer
+// @ts-ignore
 
 function getInputContainerColors($disabled, $isFocused, $error, $positive, colors) {
   if ($disabled) {
@@ -359,7 +379,7 @@ exports.getInputContainerStyles = getInputContainerStyles;
 var InputContainer = (0, _styles.styled)('div', getInputContainerStyles);
 exports.InputContainer = InputContainer;
 InputContainer.displayName = "InputContainer";
-InputContainer.displayName = 'InputContainer';
+InputContainer.displayName = 'InputContainer'; // @ts-ignore
 
 function getInputColors($disabled, $isFocused, $error, colors) {
   if ($disabled) {
@@ -409,9 +429,13 @@ var getInputStyles = function getInputStyles(props) {
     maxWidth: '100%',
     cursor: $disabled ? 'not-allowed' : 'text',
     margin: '0',
+    // @ts-ignore
     paddingTop: '0',
+    // @ts-ignore
     paddingBottom: '0',
+    // @ts-ignore
     paddingLeft: '0',
+    // @ts-ignore
     paddingRight: '0'
   }, getFont($size, typography)), getInputPadding($size, sizing)), getInputColors($disabled, $isFocused, $error, colors));
 };

package/input/types.d.ts

@@ -2,10 +2,10 @@ import type * as React from 'react';
 import type { Properties } from 'csstype';
 import type { Override } from '../helpers/overrides';
 import type { STATE_CHANGE_TYPE, ADJOINED, SIZE, ENHANCER_POSITION } from './constants';
-export declare type Adjoined = keyof typeof ADJOINED;
-export declare type Size = keyof typeof SIZE;
-export declare type StateType = keyof typeof STATE_CHANGE_TYPE;
-export declare type InternalState = {
+export type Adjoined = keyof typeof ADJOINED;
+export type Size = keyof typeof SIZE;
+export type StateType = keyof typeof STATE_CHANGE_TYPE;
+export type InternalState = {
     /** Renders UI in 'focus' state */
     isFocused?: boolean;
     /** Renders input in 'masked' state if type equals "password" */
@@ -15,11 +15,11 @@ export declare type InternalState = {
     /** Tracks if focus should be visible on the mask toggle button. */
     isFocusVisibleForMaskToggle?: boolean;
 };
-export declare type State = {
+export type State = {
     value?: string | number;
 };
-export declare type StateReducer = (stateType: StateType, nextState: State, currentState: State) => State;
-export declare type SharedProps = {
+export type StateReducer = (stateType: StateType, nextState: State, currentState: State) => State;
+export type SharedProps = {
     /** Renders UI in 'focus' state */
     $isFocused?: boolean;
     /** Renders UI in 'readOnly' state */
@@ -41,7 +41,7 @@ export declare type SharedProps = {
     /** Defines if has a clearable or MaskToggleButton at the end */
     $hasIconTrailing?: boolean;
 };
-export declare type BaseInputOverrides = {
+export type BaseInputOverrides = {
     InputContainer?: Override;
     Input?: Override;
     Before?: Override;
@@ -52,12 +52,12 @@ export declare type BaseInputOverrides = {
     MaskToggleShowIcon?: Override;
     MaskToggleHideIcon?: Override;
 };
-export declare type InputOverrides = {
+export type InputOverrides = {
     Root?: Override;
     StartEnhancer?: Override;
     EndEnhancer?: Override;
 } & BaseInputOverrides;
-export declare type BaseInputProps<T> = {
+export type BaseInputProps<T> = {
     'aria-activedescendant'?: string;
     'aria-autocomplete'?: string;
     'aria-controls'?: string;
@@ -128,7 +128,7 @@ export declare type BaseInputProps<T> = {
     /** Renders component in 'readOnly' state. */
     readOnly?: boolean;
 };
-export declare type InputProps = {
+export type InputProps = {
     overrides?: InputOverrides;
     /** An input helper rendered before and attached to the input field. */
     startEnhancer?: React.ReactNode | ((props: SharedProps) => React.ReactNode);
@@ -139,18 +139,18 @@ export declare type InputProps = {
     /** Handler for the `blur` event. */
     onBlur?: (e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
 } & BaseInputProps<HTMLInputElement | HTMLTextAreaElement>;
-export declare type MaskedInputProps = Partial<{
+export type MaskedInputProps = Partial<{
     /** See mask examples here: https://github.com/sanniassin/react-input-mask */
     mask?: string;
     /** Character to render for unfilled mask element. */
     maskChar?: string;
 } & InputProps>;
-export declare type StatefulContainerChildrenProps<T> = {
+export type StatefulContainerChildrenProps<T> = {
     onChange: (e: React.ChangeEvent<T>) => void;
     /** If true, adds a clear value icon button to the end of the input container. */
     clearable?: boolean;
 } & StatefulInputProps;
-export declare type StatefulContainerProps<T> = {
+export type StatefulContainerProps<T> = {
     children: (props: StatefulContainerChildrenProps<T>) => React.ReactNode;
     /** Initial state of an uncontrolled input component. */
     initialState?: State;
@@ -162,9 +162,9 @@ export declare type StatefulContainerProps<T> = {
 } & {
     overrides?: InputOverrides;
 } & Omit<InputProps, 'overrides' | 'children'>;
-declare type FullStProps = InputProps & StatefulContainerProps<HTMLInputElement | HTMLTextAreaElement>;
-export declare type StInputPropsDiff = Omit<FullStProps, 'overrides' | 'children'>;
-export declare type StatefulInputProps = {
+type FullStProps = InputProps & StatefulContainerProps<HTMLInputElement | HTMLTextAreaElement>;
+export type StInputPropsDiff = Omit<FullStProps, 'overrides' | 'children'>;
+export type StatefulInputProps = {
     overrides?: InputOverrides;
 } & StInputPropsDiff;
 export {};

package/input/utils.js

@@ -26,7 +26,9 @@ function getSharedProps(props, state) {
     $disabled: disabled,
     $error: error,
     $positive: positive,
+    // @ts-ignore
     $adjoined: adjoined,
+    // @ts-ignore
     $size: size,
     $required: required,
     $resize: resize,

package/layer/layer.js

@@ -73,6 +73,8 @@ var LayerComponent = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call.apply(_super, [this].concat(args));
 
+    _defineProperty(_assertThisInitialized(_this), "context", void 0);
+
     _defineProperty(_assertThisInitialized(_this), "state", {
       container: null
     });
@@ -147,7 +149,8 @@ var LayerComponent = /*#__PURE__*/function (_React$Component) {
       if (host) {
         this.addContainer(host);
       }
-    }
+    } // @ts-ignore
+
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
@@ -195,7 +198,8 @@ var LayerComponent = /*#__PURE__*/function (_React$Component) {
     }
   }, {
     key: "addContainer",
-    value: function addContainer(host) {
+    value: // @ts-ignore
+    function addContainer(host) {
       var _this$props3 = this.props,
           index = _this$props3.index,
           mountNode = _this$props3.mountNode,

package/layer/layers-manager.d.ts

@@ -15,13 +15,13 @@ export default class LayersManager extends React.Component<LayersManagerProps, L
     onKeyPress: (event: KeyboardEvent) => void;
     onAddEscapeHandler: (escapeKeyHandler: () => unknown) => void;
     onRemoveEscapeHandler: (escapeKeyHandler: () => unknown) => void;
-    onAddKeyDownHandler: (keyDownHandler: () => unknown) => void;
-    onRemoveKeyDownHandler: (keyDownHandler: () => unknown) => void;
-    onAddKeyUpHandler: (keyUpHandler: () => unknown) => void;
-    onRemoveKeyUpHandler: (keyUpHandler: () => unknown) => void;
-    onAddKeyPressHandler: (keyPressHandler: () => unknown) => void;
-    onRemoveKeyPressHandler: (keyPressHandler: () => unknown) => void;
-    onAddDocClickHandler: (docClickHandler: (event: MouseEvent) => unknown) => void;
-    onRemoveDocClickHandler: (docClickHandler: (event: MouseEvent) => unknown) => void;
+    onAddKeyDownHandler: (keyDownHandler: (event: KeyboardEvent) => void) => void;
+    onRemoveKeyDownHandler: (keyDownHandler: (event: KeyboardEvent) => void) => void;
+    onAddKeyUpHandler: (keyUpHandler: (event: KeyboardEvent) => void) => void;
+    onRemoveKeyUpHandler: (keyUpHandler: (event: KeyboardEvent) => void) => void;
+    onAddKeyPressHandler: (keyPressHandler: (event: KeyboardEvent) => void) => void;
+    onRemoveKeyPressHandler: (keyPressHandler: (event: KeyboardEvent) => void) => void;
+    onAddDocClickHandler: (docClickHandler: (event: MouseEvent) => void) => void;
+    onRemoveDocClickHandler: (docClickHandler: (event: MouseEvent) => void) => void;
     render(): JSX.Element;
 }

package/layer/tether.d.ts

@@ -23,6 +23,6 @@ declare class Tether extends React.Component<TetherProps, TetherState> {
     initializePopper(): void;
     onPopperUpdate: (data: PopperDataObject) => void;
     destroyPopover(): void;
-    render(): {};
+    render(): string | number | true | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment;
 }
 export default Tether;

package/layer/tether.js

@@ -139,7 +139,7 @@ var Tether = /*#__PURE__*/function (_React$Component) {
           if (!this.props.anchorRef) {
             if (process.env.NODE_ENV !== "production") {
               // eslint-disable-next-line no-console
-              console.warn("[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.\n              See how to pass the ref to an anchor element in the Popover example\n              http://baseui.design/components/popover#anchor-ref-handling-example");
+              console.warn("[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.\n              See how to pass the ref to an anchor element in the Popover example\n              https://baseweb.design/components/popover/#anchor-ref-handling-example");
             }
           } else {
             this.initializePopper();
@@ -211,11 +211,14 @@ var Tether = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 
 _defineProperty(Tether, "defaultProps", {
+  // @ts-ignore
   anchorRef: null,
+  // @ts-ignore
   onPopperUpdate: function onPopperUpdate() {
     return null;
   },
   placement: _constants.TETHER_PLACEMENT.auto,
+  // @ts-ignore
   popperRef: null,
   popperOptions: {}
 });

package/layer/tether.js.flow

@@ -67,7 +67,7 @@ class Tether extends React.Component<TetherPropsT, TetherStateT> {
             console.warn(
               `[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.
               See how to pass the ref to an anchor element in the Popover example
-              http://baseui.design/components/popover#anchor-ref-handling-example`
+              https://baseweb.design/components/popover/#anchor-ref-handling-example`
             );
           }
         } else {

package/layer/types.d.ts

@@ -2,7 +2,7 @@ import type * as React from 'react';
 import type { TETHER_PLACEMENT } from './constants';
 import type { Override } from '../helpers/overrides';
 /** LayersManager */
-export declare type LayersManagerProps = {
+export type LayersManagerProps = {
     children: React.ReactNode;
     overrides?: {
         AppContainer?: Override;
@@ -10,29 +10,29 @@ export declare type LayersManagerProps = {
     };
     zIndex?: number;
 };
-export declare type LayersManagerState = {
+export type LayersManagerState = {
     escapeKeyHandlers: Array<() => unknown>;
     keyDownHandlers: Array<(event: KeyboardEvent) => unknown>;
     keyUpHandlers: Array<(event: KeyboardEvent) => unknown>;
     keyPressHandlers: Array<(event: KeyboardEvent) => unknown>;
     docClickHandlers: Array<(event: MouseEvent) => unknown>;
 };
-export declare type LayersContextProps = {
+export type LayersContextProps = {
     host?: HTMLElement | null;
     zIndex?: number;
     addEscapeHandler: (a: () => unknown) => void;
     removeEscapeHandler: (a: () => unknown) => void;
-    addKeyDownHandler: (a: () => unknown) => void;
-    removeKeyDownHandler: (a: () => unknown) => void;
-    addKeyUpHandler: (a: () => unknown) => void;
-    removeKeyUpHandler: (a: () => unknown) => void;
-    addKeyPressHandler: (a: () => unknown) => void;
-    removeKeyPressHandler: (a: () => unknown) => void;
-    addDocClickHandler: (a: () => unknown) => void;
-    removeDocClickHandler: (a: () => unknown) => void;
+    addKeyDownHandler: (a: (event: KeyboardEvent) => void) => void;
+    removeKeyDownHandler: (a: (event: KeyboardEvent) => void) => void;
+    addKeyUpHandler: (a: (event: KeyboardEvent) => void) => void;
+    removeKeyUpHandler: (a: (event: KeyboardEvent) => void) => void;
+    addKeyPressHandler: (a: (event: KeyboardEvent) => void) => void;
+    removeKeyPressHandler: (a: (event: KeyboardEvent) => void) => void;
+    addDocClickHandler: (a: (event: MouseEvent) => void) => void;
+    removeDocClickHandler: (a: (event: MouseEvent) => void) => void;
 };
 /** Layer */
-export declare type LayerProps = {
+export type LayerProps = {
     /** Content to be rendered in the Layer. */
     children: React.ReactNode;
     /** A DOM element where the Layer will be inserted into as a child.
@@ -72,7 +72,7 @@ export declare type LayerProps = {
      The zIndex value comes from the layers context provider. */
     zIndex?: number;
 };
-export declare type LayerComponentProps = {
+export type LayerComponentProps = {
     children: React.ReactNode;
     host: HTMLElement | undefined | null;
     index?: number;
@@ -87,31 +87,31 @@ export declare type LayerComponentProps = {
     onUnmount?: () => unknown;
     zIndex?: number;
 };
-export declare type LayerState = {
+export type LayerState = {
     container: HTMLElement | undefined | null;
 };
 /** TetherBehavior */
-export declare type TetherPlacement = keyof typeof TETHER_PLACEMENT;
-export declare type NormalizedOffset = {
+export type TetherPlacement = keyof typeof TETHER_PLACEMENT;
+export type NormalizedOffset = {
     top: number;
     left: number;
 };
-export declare type NormalizedOffsets = {
+export type NormalizedOffsets = {
     arrow?: NormalizedOffset;
     popper: NormalizedOffset;
 };
-export declare type PopperOffset = {
+export type PopperOffset = {
     top?: number | null;
     left?: number | null;
 };
-export declare type PopperDataObject = {
+export type PopperDataObject = {
     offsets: {
         arrow?: PopperOffset;
         popper: PopperOffset;
     };
     placement: string;
 };
-export declare type PopperOptions = {
+export type PopperOptions = {
     placement: string;
     modifiers: {
         arrow: {};
@@ -122,7 +122,7 @@ export declare type PopperOptions = {
         };
     };
 };
-export declare type TetherProps = {
+export type TetherProps = {
     /** The reference element used to position the popper. */
     anchorRef: HTMLElement | undefined | null;
     /** The arrow element that is passed as an arrow modifier to alter
@@ -141,6 +141,6 @@ export declare type TetherProps = {
      for the full list of available options. */
     popperOptions: any;
 };
-export declare type TetherState = {
+export type TetherState = {
     isMounted: boolean;
 };

package/layout-grid/grid.js

@@ -98,6 +98,7 @@ function Grid(_ref) {
       gridColumns: gridColumns,
       gridGaps: gridGaps,
       gridGutters: gridGutters,
+      // @ts-ignore
       gridUnit: gridUnit
     }, gridContextStyleValues)
   }, children)));

package/layout-grid/index.d.ts

@@ -10,4 +10,4 @@ export declare const Unstable_Grid: typeof Grid;
 export declare const Unstable_Cell: typeof Cell;
 export * from './types';
 /** @deprecated use CSSLengthUnit instead. To be removed in future versions.*/
-export declare type CSSLengthUnitT = CSSLengthUnit;
+export type CSSLengthUnitT = CSSLengthUnit;

package/layout-grid/index.js

@@ -86,7 +86,8 @@ LICENSE file in the root directory of this source tree.
 var componentName = 'Layout Grid (baseui/layout-grid)';
 var Unstable_StyledGrid = (0, _deprecatedComponent.default)(_styledComponents.StyledGrid, componentName);
 exports.Unstable_StyledGrid = Unstable_StyledGrid;
-var Unstable_StyledCell = (0, _deprecatedComponent.default)(_styledComponents.StyledCell, componentName);
+var Unstable_StyledCell = (0, _deprecatedComponent.default)(_styledComponents.StyledCell, componentName); // @ts-ignore
+
 exports.Unstable_StyledCell = Unstable_StyledCell;
 var Unstable_Grid = (0, _deprecatedComponent.default)(_grid.default, componentName);
 exports.Unstable_Grid = Unstable_Grid;

package/layout-grid/index.js.flow

@@ -13,6 +13,7 @@ import DeprecatedHOC from '../utils/deprecated-component.js';
 
 export { StyledGrid, StyledCell, Grid, Cell };
 export * from './constants.js';
+export type * from './types.js';
 
 const componentName = 'Layout Grid (baseui/layout-grid)';
 export const Unstable_StyledGrid = DeprecatedHOC(StyledGrid, componentName);

package/layout-grid/styled-components.js

@@ -17,7 +17,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-var StyledGridWrapper = (0, _styles.styled)('div', function (_ref) {
+var StyledGridWrapper = (0, _styles.styled)('div', // @ts-ignore
+function (_ref) {
   var $theme = _ref.$theme,
       _ref$$behavior = _ref.$behavior,
       $behavior = _ref$$behavior === void 0 ? _constants.BEHAVIOR.fixed : _ref$$behavior,
@@ -35,7 +36,8 @@ var StyledGridWrapper = (0, _styles.styled)('div', function (_ref) {
 exports.StyledGridWrapper = StyledGridWrapper;
 StyledGridWrapper.displayName = "StyledGridWrapper";
 StyledGridWrapper.displayName = 'StyledGridWrapper';
-var StyledGrid = (0, _styles.styled)('div', function (_ref2) {
+var StyledGrid = (0, _styles.styled)('div', // @ts-ignore
+function (_ref2) {
   var $theme = _ref2.$theme,
       _ref2$$align = _ref2.$align,
       $align = _ref2$$align === void 0 ? null : _ref2$$align,
@@ -75,7 +77,8 @@ var StyledGrid = (0, _styles.styled)('div', function (_ref2) {
 exports.StyledGrid = StyledGrid;
 StyledGrid.displayName = "StyledGrid";
 StyledGrid.displayName = 'StyledGrid';
-var StyledCell = (0, _styles.styled)('div', function (_ref3) {
+var StyledCell = (0, _styles.styled)('div', // @ts-ignore
+function (_ref3) {
   var $theme = _ref3.$theme,
       _ref3$$align = _ref3.$align,
       $align = _ref3$$align === void 0 ? null : _ref3$$align,

package/layout-grid/types.d.ts

@@ -1,12 +1,12 @@
 import type * as React from 'react';
 import type { ALIGNMENT, BEHAVIOR, STYLE } from './constants';
 import type { Override } from '../helpers/overrides';
-export declare type Responsive<T> = T | Array<T>;
-export declare type Alignment = typeof ALIGNMENT.start | typeof ALIGNMENT.center | typeof ALIGNMENT.end;
-export declare type Behavior = typeof BEHAVIOR.fixed | typeof BEHAVIOR.fluid;
-export declare type CSSLengthUnit = 'cm' | 'mm' | 'Q' | 'in' | 'pc' | 'px' | 'pt' | 'em' | 'ex' | 'ch' | 'rem' | 'lh' | 'vw' | 'vh' | 'vmin' | 'vmax' | '%';
-export declare type GridStyle = typeof STYLE[keyof typeof STYLE];
-export declare type SharedGridProps = {
+export type Responsive<T> = T | Array<T>;
+export type Alignment = typeof ALIGNMENT.start | typeof ALIGNMENT.center | typeof ALIGNMENT.end;
+export type Behavior = typeof BEHAVIOR.fixed | typeof BEHAVIOR.fluid;
+export type CSSLengthUnit = 'cm' | 'mm' | 'Q' | 'in' | 'pc' | 'px' | 'pt' | 'em' | 'ex' | 'ch' | 'rem' | 'lh' | 'vw' | 'vh' | 'vmin' | 'vmax' | '%';
+export type GridStyle = (typeof STYLE)[keyof typeof STYLE];
+export type SharedGridProps = {
     /** Number of columns at each breakpoint. */
     gridColumns?: Responsive<number>;
     /** Gap between rows at each breakpoint. */
@@ -16,17 +16,17 @@ export declare type SharedGridProps = {
     /** Modify the CSS length unit used to measure columns and rows. Defaults to theme value. */
     gridUnit?: CSSLengthUnit;
 };
-export declare type GridOverrides = {
+export type GridOverrides = {
     Grid?: Override;
     GridWrapper?: Override;
 };
-export declare type GridProps = {
+export type GridProps = {
     /** Control vertical alignment of cells at each breakpoint. */
     align?: Responsive<Alignment>;
     /** Grid container behavior beyond max width. Fluid will continue to expand. Fixed will limit grid container to max width and center the container horizontally within parent element. */
     behavior?: Behavior;
     /** Children should be Cells. */
-    children: React.ReactElement | React.ReactElement[];
+    children: React.ReactNode;
     /** Gap on either side of grid container at each breakpoint. */
     gridMargins?: Responsive<number>;
     /** Maximum width of the grid container. Does not include Margins. Only applies when `behavior` is `fluid`. */
@@ -36,7 +36,7 @@ export declare type GridProps = {
     /** Overrides for your grid. */
     overrides?: GridOverrides;
 } & SharedGridProps;
-export declare type StyledGridWrapperProps = {
+export type StyledGridWrapperProps = {
     /** Grid container behavior beyond max width. Fluid will continue to expand. Fixed will limit grid container to max width and center the container horizontally within parent element. */
     $behavior?: Behavior;
     /** Gap on either side of grid container at each breakpoint. */
@@ -46,7 +46,7 @@ export declare type StyledGridWrapperProps = {
     /** Modify the CSS length unit used to measure columns and rows. Defaults to theme value. */
     $gridUnit?: CSSLengthUnit;
 };
-export declare type StyledGridProps = {
+export type StyledGridProps = {
     /** Control vertical alignment of cells at each breakpoint. */
     $align?: Responsive<Alignment>;
     /** Grid container behavior beyond max width. Fluid will continue to expand. Fixed will limit grid container to max width and center the container horizontally within parent element. */
@@ -62,10 +62,10 @@ export declare type StyledGridProps = {
     /** Style for your grid. The `default` style will pull values from the theme, while other styles have preset values that are unaffected by the theme. **/
     $gridStyle?: GridStyle;
 };
-export declare type CellOverrides = {
+export type CellOverrides = {
     Cell?: Override;
 };
-export declare type CellProps = {
+export type CellProps = {
     /** Control vertical alignment of individual cell at each breakpoint. Limited proxy for `align-self` CSS property. */
     align?: Responsive<Alignment>;
     /** Content to be placed in Cell. */
@@ -79,7 +79,7 @@ export declare type CellProps = {
     /** Overrides for a single cell. */
     overrides?: CellOverrides;
 } & SharedGridProps;
-export declare type StyledCellProps = {
+export type StyledCellProps = {
     /** Control vertical alignment of individual cell at each breakpoint. Limited proxy for `align-self` CSS property. */
     $align?: Responsive<Alignment>;
     /** Number of columns at each breakpoint. */

package/layout-grid/types.js.flow

@@ -47,6 +47,12 @@ export type SharedGridPropsT = {
   /** Modify the CSS length unit used to measure columns and rows. Defaults to theme value. */
   gridUnit?: CSSLengthUnitT,
 };
+
+export type GridOverridesT = {
+  Grid?: OverrideT,
+  GridWrapper?: OverrideT,
+};
+
 export type GridPropsT = {
   ...SharedGridPropsT,
   /** Control vertical alignment of cells at each breakpoint. */
@@ -62,10 +68,7 @@ export type GridPropsT = {
   /** Style for your grid. The `default` style will pull values from the theme, while other styles have preset values that are unaffected by the theme. **/
   gridStyle?: GridStyle,
   /** Overrides for your grid. */
-  overrides?: {
-    Grid?: OverrideT,
-    GridWrapper?: OverrideT,
-  },
+  overrides?: GridOverridesT,
 };
 
 export type StyledGridWrapperPropsT = {
@@ -133,7 +136,6 @@ export type StyledCellPropsT = {
   /** Control number of columns the cell should span. */
   $span?: ResponsiveT<number>,
 };
-
 declare var __DEV__: boolean;
 declare var __NODE__: boolean;
 declare var __BROWSER__: boolean;

package/link/index.d.ts

@@ -6,4 +6,4 @@ export declare const StyledLink: import("styletron-react").StyletronComponent<"a
     animateUnderline?: boolean;
 }>;
 /** @deprecated To be removed in future versions.*/
-export declare type LinkProps = React.ComponentProps<typeof StyledLink>;
+export type LinkProps = React.ComponentProps<typeof StyledLink>;

package/link/index.js

@@ -39,6 +39,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+// @ts-ignore
 function LinkFocus(props) {
   var _React$useState = React.useState(false),
       _React$useState2 = _slicedToArray(_React$useState, 2),