carbon-react 110.1.3 → 110.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/esm/__spec_helper__/test-utils.d.ts +3 -2
  2. package/esm/__spec_helper__/test-utils.js +17 -1
  3. package/esm/components/box/box.component.d.ts +4 -2
  4. package/esm/components/box/box.component.js +2 -1
  5. package/esm/components/dismissible-box/dismissible-box.component.js +398 -0
  6. package/esm/components/portal/portal.d.ts +15 -12
  7. package/esm/components/portal/portal.js +3 -13
  8. package/esm/style/utils/filter-out-position-props.d.ts +3 -0
  9. package/esm/style/utils/filter-out-position-props.js +5 -0
  10. package/lib/__spec_helper__/test-utils.d.ts +3 -2
  11. package/lib/__spec_helper__/test-utils.js +20 -2
  12. package/lib/components/box/box.component.d.ts +4 -2
  13. package/lib/components/box/box.component.js +1 -0
  14. package/lib/components/dismissible-box/dismissible-box.component.js +398 -0
  15. package/lib/components/portal/portal.d.ts +15 -12
  16. package/lib/components/portal/portal.js +3 -14
  17. package/lib/style/utils/filter-out-position-props.d.ts +3 -0
  18. package/lib/style/utils/filter-out-position-props.js +18 -0
  19. package/package.json +1 -1
package/esm/__spec_helper__/test-utils.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { ReactWrapper, ShallowWrapper } from "enzyme";
3
- import { LayoutProps, FlexboxProps, BackgroundProps } from "styled-system";
3
+ import { LayoutProps, FlexboxProps, BackgroundProps, PositionProps } from "styled-system";
4
4
  import { ReactTestRendererJSON } from "react-test-renderer";
5
5
  import { mockMatchMedia } from "./mock-match-media";
6
6
  declare const toCSSCase: (str: string) => string;
@@ -47,5 +47,6 @@ declare const testStyledSystemWidth: (component: (widthProperties?: {
47
47
  declare const testStyledSystemLayout: (component: (layoutProperties?: LayoutProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
48
48
  declare const testStyledSystemFlexBox: (component: (flexboxProperties?: FlexboxProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
49
49
  declare const testStyledSystemBackground: (component: (backgroundProperties?: BackgroundProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
50
+ declare const testStyledSystemPosition: (component: (positionProperties?: PositionProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
50
51
  declare const expectConsoleOutput: (message: string, type?: "warn" | "error") => () => void;
51
- export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, expectConsoleOutput, };
52
+ export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, testStyledSystemPosition, expectConsoleOutput, };
package/esm/__spec_helper__/test-utils.js CHANGED
@@ -109,6 +109,7 @@ const widthProps = ["width", "width", "200px"];
109
109
  const layoutProps = [widthProps, ["height", "height", "200px"], ["minWidth", "min-width", "120px"], ["maxWidth", "max-width", "120px"], ["minHeight", "min-height", "120px"], ["maxHeight", "max-height", "120px"], ["size", "width", "120px"], ["size", "height", "120px"], ["display", "display", "inline-block"], ["verticalAlign", "vertical-align", "baseline"], ["overflow", "overflow", "hidden"], ["overflowX", "overflow-x", "hidden"], ["overflowY", "overflow-y", "hidden"]];
110
110
  const flexBoxProps = [["alignItems", "alignItems", "center"], ["alignContent", "alignContent", "center"], ["justifyItems", "justifyItems", "center"], ["justifyContent", "justifyContent", "center"], ["flexWrap", "flexWrap", "wrap"], ["flexDirection", "flexDirection", "row-reverse"], ["flex", "flex", "1"], ["flexGrow", "flexGrow", "1"], ["flexShrink", "flexShrink", "1"], ["flexBasis", "flexBasis", "100px"], ["justifySelf", "justifySelf", "center"], ["alignSelf", "alignSelf", "center"], ["order", "order", "1"]];
111
111
  const backgroundProps = [["background", "background", "lightblue url('foo.jpg') no-repeat fixed center"], ["backgroundImage", "background-image", "url(foo.jpg)"], ["backgroundSize", "background-size", "center"], ["backgroundRepeat", "background-repeat", "no-repeat"]];
112
+ const positionProps = [["top", "0px"], ["bottom", "0px"], ["right", "0px"], ["left", "0px"], ["position", "fixed"], ["position", "sticky"], ["position", "absolute"], ["position", "static"], ["position", "relative"]];
112
113
  export const getDefaultValue = value => {
113
114
  const spaceArrayLength = space.length - 1;
114
115
  if (value === undefined) return value;
@@ -302,6 +303,21 @@ const testStyledSystemBackground = (component, styleContainer) => {
302
303
  }, styleContainer ? styleContainer(wrapper) : wrapper);
303
304
  });
304
305
  });
306
+ };
307
+
308
+ const testStyledSystemPosition = (component, styleContainer) => {
309
+ describe.each(positionProps)('when a prop is specified using the "%s" styled system props', (styledSystemProp, value) => {
310
+ it(`then ${styledSystemProp} should have been set correctly`, () => {
311
+ const props = {
312
+ [styledSystemProp]: value
313
+ };
314
+ const wrapper = mount(component({ ...props
315
+ }));
316
+ assertStyleMatch({
317
+ [styledSystemProp]: value
318
+ }, styleContainer ? styleContainer(wrapper) : wrapper);
319
+ });
320
+ });
305
321
  }; // this util will catch that a console output occurred without polluting the output when running the unit tests
306
322
 
307
323
 
@@ -335,4 +351,4 @@ const expectConsoleOutput = (message, type = "error") => {
335
351
  };
336
352
  };
337
353
 
338
- export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, expectConsoleOutput };
354
+ export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, testStyledSystemPosition, expectConsoleOutput };
package/esm/components/box/box.component.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import React from "react";
2
- import { SpaceProps, LayoutProps, FlexboxProps, ColorProps } from "styled-system";
2
+ import { SpaceProps, LayoutProps, FlexboxProps, ColorProps, PositionProps } from "styled-system";
3
3
  export declare type OverflowWrap = "break-word" | "anywhere";
4
4
  export declare type ScrollVariant = "light" | "dark";
5
5
  export declare type BoxSizing = "content-box" | "border-box";
6
- export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorProps {
6
+ export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorProps, Omit<PositionProps, "zIndex"> {
7
7
  as?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
8
8
  /** String to set Box content break strategy. Note "anywhere" is not supported in Safari */
9
9
  overflowWrap?: OverflowWrap;
@@ -11,6 +11,8 @@ export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorPr
11
11
  scrollVariant?: ScrollVariant;
12
12
  /** set the box-sizing attribute of the Box component */
13
13
  boxSizing?: BoxSizing;
14
+ /** Allows a tabindex to be specified */
15
+ tabIndex?: number | string;
14
16
  }
15
17
  declare const Box: import("styled-components").StyledComponent<"div", any, BoxProps, never>;
16
18
  export default Box;
package/esm/components/box/box.component.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import styled, { css } from "styled-components";
2
- import { space, layout, flexbox } from "styled-system";
2
+ import { space, layout, flexbox, position } from "styled-system";
3
3
  import BaseTheme from "../../style/themes/base";
4
4
  import styledColor from "../../style/utils/color";
5
5
  import boxConfig from "./box.config";
@@ -7,6 +7,7 @@ const Box = styled.div`
7
7
  ${space}
8
8
  ${layout}
9
9
  ${flexbox}
10
+ ${position}
10
11
  ${({
11
12
  color,
12
13
  bg,
package/esm/components/dismissible-box/dismissible-box.component.js CHANGED
@@ -358,6 +358,105 @@ DismissibleBox.propTypes = {
358
358
  "toString": PropTypes.func.isRequired,
359
359
  "valueOf": PropTypes.func.isRequired
360
360
  }), PropTypes.string]),
361
+ "bottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
362
+ "__@iterator": PropTypes.func.isRequired,
363
+ "anchor": PropTypes.func.isRequired,
364
+ "big": PropTypes.func.isRequired,
365
+ "blink": PropTypes.func.isRequired,
366
+ "bold": PropTypes.func.isRequired,
367
+ "charAt": PropTypes.func.isRequired,
368
+ "charCodeAt": PropTypes.func.isRequired,
369
+ "codePointAt": PropTypes.func.isRequired,
370
+ "concat": PropTypes.func.isRequired,
371
+ "endsWith": PropTypes.func.isRequired,
372
+ "fixed": PropTypes.func.isRequired,
373
+ "fontcolor": PropTypes.func.isRequired,
374
+ "fontsize": PropTypes.func.isRequired,
375
+ "includes": PropTypes.func.isRequired,
376
+ "indexOf": PropTypes.func.isRequired,
377
+ "italics": PropTypes.func.isRequired,
378
+ "lastIndexOf": PropTypes.func.isRequired,
379
+ "length": PropTypes.number.isRequired,
380
+ "link": PropTypes.func.isRequired,
381
+ "localeCompare": PropTypes.func.isRequired,
382
+ "match": PropTypes.func.isRequired,
383
+ "matchAll": PropTypes.func.isRequired,
384
+ "normalize": PropTypes.func.isRequired,
385
+ "padEnd": PropTypes.func.isRequired,
386
+ "padStart": PropTypes.func.isRequired,
387
+ "repeat": PropTypes.func.isRequired,
388
+ "replace": PropTypes.func.isRequired,
389
+ "search": PropTypes.func.isRequired,
390
+ "slice": PropTypes.func.isRequired,
391
+ "small": PropTypes.func.isRequired,
392
+ "split": PropTypes.func.isRequired,
393
+ "startsWith": PropTypes.func.isRequired,
394
+ "strike": PropTypes.func.isRequired,
395
+ "sub": PropTypes.func.isRequired,
396
+ "substr": PropTypes.func.isRequired,
397
+ "substring": PropTypes.func.isRequired,
398
+ "sup": PropTypes.func.isRequired,
399
+ "toLocaleLowerCase": PropTypes.func.isRequired,
400
+ "toLocaleUpperCase": PropTypes.func.isRequired,
401
+ "toLowerCase": PropTypes.func.isRequired,
402
+ "toString": PropTypes.func.isRequired,
403
+ "toUpperCase": PropTypes.func.isRequired,
404
+ "trim": PropTypes.func.isRequired,
405
+ "trimEnd": PropTypes.func.isRequired,
406
+ "trimLeft": PropTypes.func.isRequired,
407
+ "trimRight": PropTypes.func.isRequired,
408
+ "trimStart": PropTypes.func.isRequired,
409
+ "valueOf": PropTypes.func.isRequired
410
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
411
+ "__@iterator": PropTypes.func.isRequired,
412
+ "anchor": PropTypes.func.isRequired,
413
+ "big": PropTypes.func.isRequired,
414
+ "blink": PropTypes.func.isRequired,
415
+ "bold": PropTypes.func.isRequired,
416
+ "charAt": PropTypes.func.isRequired,
417
+ "charCodeAt": PropTypes.func.isRequired,
418
+ "codePointAt": PropTypes.func.isRequired,
419
+ "concat": PropTypes.func.isRequired,
420
+ "endsWith": PropTypes.func.isRequired,
421
+ "fixed": PropTypes.func.isRequired,
422
+ "fontcolor": PropTypes.func.isRequired,
423
+ "fontsize": PropTypes.func.isRequired,
424
+ "includes": PropTypes.func.isRequired,
425
+ "indexOf": PropTypes.func.isRequired,
426
+ "italics": PropTypes.func.isRequired,
427
+ "lastIndexOf": PropTypes.func.isRequired,
428
+ "length": PropTypes.number.isRequired,
429
+ "link": PropTypes.func.isRequired,
430
+ "localeCompare": PropTypes.func.isRequired,
431
+ "match": PropTypes.func.isRequired,
432
+ "matchAll": PropTypes.func.isRequired,
433
+ "normalize": PropTypes.func.isRequired,
434
+ "padEnd": PropTypes.func.isRequired,
435
+ "padStart": PropTypes.func.isRequired,
436
+ "repeat": PropTypes.func.isRequired,
437
+ "replace": PropTypes.func.isRequired,
438
+ "search": PropTypes.func.isRequired,
439
+ "slice": PropTypes.func.isRequired,
440
+ "small": PropTypes.func.isRequired,
441
+ "split": PropTypes.func.isRequired,
442
+ "startsWith": PropTypes.func.isRequired,
443
+ "strike": PropTypes.func.isRequired,
444
+ "sub": PropTypes.func.isRequired,
445
+ "substr": PropTypes.func.isRequired,
446
+ "substring": PropTypes.func.isRequired,
447
+ "sup": PropTypes.func.isRequired,
448
+ "toLocaleLowerCase": PropTypes.func.isRequired,
449
+ "toLocaleUpperCase": PropTypes.func.isRequired,
450
+ "toLowerCase": PropTypes.func.isRequired,
451
+ "toString": PropTypes.func.isRequired,
452
+ "toUpperCase": PropTypes.func.isRequired,
453
+ "trim": PropTypes.func.isRequired,
454
+ "trimEnd": PropTypes.func.isRequired,
455
+ "trimLeft": PropTypes.func.isRequired,
456
+ "trimRight": PropTypes.func.isRequired,
457
+ "trimStart": PropTypes.func.isRequired,
458
+ "valueOf": PropTypes.func.isRequired
459
+ }), PropTypes.string]),
361
460
  "boxSizing": PropTypes.oneOf(["border-box", "content-box"]),
362
461
  "children": PropTypes.node,
363
462
  "color": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
@@ -899,6 +998,105 @@ DismissibleBox.propTypes = {
899
998
  "trimStart": PropTypes.func.isRequired,
900
999
  "valueOf": PropTypes.func.isRequired
901
1000
  })]),
1001
+ "left": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
1002
+ "__@iterator": PropTypes.func.isRequired,
1003
+ "anchor": PropTypes.func.isRequired,
1004
+ "big": PropTypes.func.isRequired,
1005
+ "blink": PropTypes.func.isRequired,
1006
+ "bold": PropTypes.func.isRequired,
1007
+ "charAt": PropTypes.func.isRequired,
1008
+ "charCodeAt": PropTypes.func.isRequired,
1009
+ "codePointAt": PropTypes.func.isRequired,
1010
+ "concat": PropTypes.func.isRequired,
1011
+ "endsWith": PropTypes.func.isRequired,
1012
+ "fixed": PropTypes.func.isRequired,
1013
+ "fontcolor": PropTypes.func.isRequired,
1014
+ "fontsize": PropTypes.func.isRequired,
1015
+ "includes": PropTypes.func.isRequired,
1016
+ "indexOf": PropTypes.func.isRequired,
1017
+ "italics": PropTypes.func.isRequired,
1018
+ "lastIndexOf": PropTypes.func.isRequired,
1019
+ "length": PropTypes.number.isRequired,
1020
+ "link": PropTypes.func.isRequired,
1021
+ "localeCompare": PropTypes.func.isRequired,
1022
+ "match": PropTypes.func.isRequired,
1023
+ "matchAll": PropTypes.func.isRequired,
1024
+ "normalize": PropTypes.func.isRequired,
1025
+ "padEnd": PropTypes.func.isRequired,
1026
+ "padStart": PropTypes.func.isRequired,
1027
+ "repeat": PropTypes.func.isRequired,
1028
+ "replace": PropTypes.func.isRequired,
1029
+ "search": PropTypes.func.isRequired,
1030
+ "slice": PropTypes.func.isRequired,
1031
+ "small": PropTypes.func.isRequired,
1032
+ "split": PropTypes.func.isRequired,
1033
+ "startsWith": PropTypes.func.isRequired,
1034
+ "strike": PropTypes.func.isRequired,
1035
+ "sub": PropTypes.func.isRequired,
1036
+ "substr": PropTypes.func.isRequired,
1037
+ "substring": PropTypes.func.isRequired,
1038
+ "sup": PropTypes.func.isRequired,
1039
+ "toLocaleLowerCase": PropTypes.func.isRequired,
1040
+ "toLocaleUpperCase": PropTypes.func.isRequired,
1041
+ "toLowerCase": PropTypes.func.isRequired,
1042
+ "toString": PropTypes.func.isRequired,
1043
+ "toUpperCase": PropTypes.func.isRequired,
1044
+ "trim": PropTypes.func.isRequired,
1045
+ "trimEnd": PropTypes.func.isRequired,
1046
+ "trimLeft": PropTypes.func.isRequired,
1047
+ "trimRight": PropTypes.func.isRequired,
1048
+ "trimStart": PropTypes.func.isRequired,
1049
+ "valueOf": PropTypes.func.isRequired
1050
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
1051
+ "__@iterator": PropTypes.func.isRequired,
1052
+ "anchor": PropTypes.func.isRequired,
1053
+ "big": PropTypes.func.isRequired,
1054
+ "blink": PropTypes.func.isRequired,
1055
+ "bold": PropTypes.func.isRequired,
1056
+ "charAt": PropTypes.func.isRequired,
1057
+ "charCodeAt": PropTypes.func.isRequired,
1058
+ "codePointAt": PropTypes.func.isRequired,
1059
+ "concat": PropTypes.func.isRequired,
1060
+ "endsWith": PropTypes.func.isRequired,
1061
+ "fixed": PropTypes.func.isRequired,
1062
+ "fontcolor": PropTypes.func.isRequired,
1063
+ "fontsize": PropTypes.func.isRequired,
1064
+ "includes": PropTypes.func.isRequired,
1065
+ "indexOf": PropTypes.func.isRequired,
1066
+ "italics": PropTypes.func.isRequired,
1067
+ "lastIndexOf": PropTypes.func.isRequired,
1068
+ "length": PropTypes.number.isRequired,
1069
+ "link": PropTypes.func.isRequired,
1070
+ "localeCompare": PropTypes.func.isRequired,
1071
+ "match": PropTypes.func.isRequired,
1072
+ "matchAll": PropTypes.func.isRequired,
1073
+ "normalize": PropTypes.func.isRequired,
1074
+ "padEnd": PropTypes.func.isRequired,
1075
+ "padStart": PropTypes.func.isRequired,
1076
+ "repeat": PropTypes.func.isRequired,
1077
+ "replace": PropTypes.func.isRequired,
1078
+ "search": PropTypes.func.isRequired,
1079
+ "slice": PropTypes.func.isRequired,
1080
+ "small": PropTypes.func.isRequired,
1081
+ "split": PropTypes.func.isRequired,
1082
+ "startsWith": PropTypes.func.isRequired,
1083
+ "strike": PropTypes.func.isRequired,
1084
+ "sub": PropTypes.func.isRequired,
1085
+ "substr": PropTypes.func.isRequired,
1086
+ "substring": PropTypes.func.isRequired,
1087
+ "sup": PropTypes.func.isRequired,
1088
+ "toLocaleLowerCase": PropTypes.func.isRequired,
1089
+ "toLocaleUpperCase": PropTypes.func.isRequired,
1090
+ "toLowerCase": PropTypes.func.isRequired,
1091
+ "toString": PropTypes.func.isRequired,
1092
+ "toUpperCase": PropTypes.func.isRequired,
1093
+ "trim": PropTypes.func.isRequired,
1094
+ "trimEnd": PropTypes.func.isRequired,
1095
+ "trimLeft": PropTypes.func.isRequired,
1096
+ "trimRight": PropTypes.func.isRequired,
1097
+ "trimStart": PropTypes.func.isRequired,
1098
+ "valueOf": PropTypes.func.isRequired
1099
+ }), PropTypes.string]),
902
1100
  "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
903
1101
  "__@toStringTag": PropTypes.string.isRequired,
904
1102
  "description": PropTypes.string,
@@ -1776,6 +1974,7 @@ DismissibleBox.propTypes = {
1776
1974
  "toString": PropTypes.func.isRequired,
1777
1975
  "valueOf": PropTypes.func.isRequired
1778
1976
  }), PropTypes.string]),
1977
+ "position": PropTypes.oneOfType([PropTypes.oneOf(["-moz-initial", "-webkit-sticky", "absolute", "fixed", "inherit", "initial", "relative", "revert", "static", "sticky", "unset"]), PropTypes.arrayOf(PropTypes.oneOf(["-moz-initial", "-webkit-sticky", "absolute", "fixed", "inherit", "initial", "relative", "revert", "static", "sticky", "unset", null])), PropTypes.object]),
1779
1978
  "pr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
1780
1979
  "__@toStringTag": PropTypes.string.isRequired,
1781
1980
  "description": PropTypes.string,
@@ -1820,6 +2019,105 @@ DismissibleBox.propTypes = {
1820
2019
  "toString": PropTypes.func.isRequired,
1821
2020
  "valueOf": PropTypes.func.isRequired
1822
2021
  }), PropTypes.string]),
2022
+ "right": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
2023
+ "__@iterator": PropTypes.func.isRequired,
2024
+ "anchor": PropTypes.func.isRequired,
2025
+ "big": PropTypes.func.isRequired,
2026
+ "blink": PropTypes.func.isRequired,
2027
+ "bold": PropTypes.func.isRequired,
2028
+ "charAt": PropTypes.func.isRequired,
2029
+ "charCodeAt": PropTypes.func.isRequired,
2030
+ "codePointAt": PropTypes.func.isRequired,
2031
+ "concat": PropTypes.func.isRequired,
2032
+ "endsWith": PropTypes.func.isRequired,
2033
+ "fixed": PropTypes.func.isRequired,
2034
+ "fontcolor": PropTypes.func.isRequired,
2035
+ "fontsize": PropTypes.func.isRequired,
2036
+ "includes": PropTypes.func.isRequired,
2037
+ "indexOf": PropTypes.func.isRequired,
2038
+ "italics": PropTypes.func.isRequired,
2039
+ "lastIndexOf": PropTypes.func.isRequired,
2040
+ "length": PropTypes.number.isRequired,
2041
+ "link": PropTypes.func.isRequired,
2042
+ "localeCompare": PropTypes.func.isRequired,
2043
+ "match": PropTypes.func.isRequired,
2044
+ "matchAll": PropTypes.func.isRequired,
2045
+ "normalize": PropTypes.func.isRequired,
2046
+ "padEnd": PropTypes.func.isRequired,
2047
+ "padStart": PropTypes.func.isRequired,
2048
+ "repeat": PropTypes.func.isRequired,
2049
+ "replace": PropTypes.func.isRequired,
2050
+ "search": PropTypes.func.isRequired,
2051
+ "slice": PropTypes.func.isRequired,
2052
+ "small": PropTypes.func.isRequired,
2053
+ "split": PropTypes.func.isRequired,
2054
+ "startsWith": PropTypes.func.isRequired,
2055
+ "strike": PropTypes.func.isRequired,
2056
+ "sub": PropTypes.func.isRequired,
2057
+ "substr": PropTypes.func.isRequired,
2058
+ "substring": PropTypes.func.isRequired,
2059
+ "sup": PropTypes.func.isRequired,
2060
+ "toLocaleLowerCase": PropTypes.func.isRequired,
2061
+ "toLocaleUpperCase": PropTypes.func.isRequired,
2062
+ "toLowerCase": PropTypes.func.isRequired,
2063
+ "toString": PropTypes.func.isRequired,
2064
+ "toUpperCase": PropTypes.func.isRequired,
2065
+ "trim": PropTypes.func.isRequired,
2066
+ "trimEnd": PropTypes.func.isRequired,
2067
+ "trimLeft": PropTypes.func.isRequired,
2068
+ "trimRight": PropTypes.func.isRequired,
2069
+ "trimStart": PropTypes.func.isRequired,
2070
+ "valueOf": PropTypes.func.isRequired
2071
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
2072
+ "__@iterator": PropTypes.func.isRequired,
2073
+ "anchor": PropTypes.func.isRequired,
2074
+ "big": PropTypes.func.isRequired,
2075
+ "blink": PropTypes.func.isRequired,
2076
+ "bold": PropTypes.func.isRequired,
2077
+ "charAt": PropTypes.func.isRequired,
2078
+ "charCodeAt": PropTypes.func.isRequired,
2079
+ "codePointAt": PropTypes.func.isRequired,
2080
+ "concat": PropTypes.func.isRequired,
2081
+ "endsWith": PropTypes.func.isRequired,
2082
+ "fixed": PropTypes.func.isRequired,
2083
+ "fontcolor": PropTypes.func.isRequired,
2084
+ "fontsize": PropTypes.func.isRequired,
2085
+ "includes": PropTypes.func.isRequired,
2086
+ "indexOf": PropTypes.func.isRequired,
2087
+ "italics": PropTypes.func.isRequired,
2088
+ "lastIndexOf": PropTypes.func.isRequired,
2089
+ "length": PropTypes.number.isRequired,
2090
+ "link": PropTypes.func.isRequired,
2091
+ "localeCompare": PropTypes.func.isRequired,
2092
+ "match": PropTypes.func.isRequired,
2093
+ "matchAll": PropTypes.func.isRequired,
2094
+ "normalize": PropTypes.func.isRequired,
2095
+ "padEnd": PropTypes.func.isRequired,
2096
+ "padStart": PropTypes.func.isRequired,
2097
+ "repeat": PropTypes.func.isRequired,
2098
+ "replace": PropTypes.func.isRequired,
2099
+ "search": PropTypes.func.isRequired,
2100
+ "slice": PropTypes.func.isRequired,
2101
+ "small": PropTypes.func.isRequired,
2102
+ "split": PropTypes.func.isRequired,
2103
+ "startsWith": PropTypes.func.isRequired,
2104
+ "strike": PropTypes.func.isRequired,
2105
+ "sub": PropTypes.func.isRequired,
2106
+ "substr": PropTypes.func.isRequired,
2107
+ "substring": PropTypes.func.isRequired,
2108
+ "sup": PropTypes.func.isRequired,
2109
+ "toLocaleLowerCase": PropTypes.func.isRequired,
2110
+ "toLocaleUpperCase": PropTypes.func.isRequired,
2111
+ "toLowerCase": PropTypes.func.isRequired,
2112
+ "toString": PropTypes.func.isRequired,
2113
+ "toUpperCase": PropTypes.func.isRequired,
2114
+ "trim": PropTypes.func.isRequired,
2115
+ "trimEnd": PropTypes.func.isRequired,
2116
+ "trimLeft": PropTypes.func.isRequired,
2117
+ "trimRight": PropTypes.func.isRequired,
2118
+ "trimStart": PropTypes.func.isRequired,
2119
+ "valueOf": PropTypes.func.isRequired
2120
+ }), PropTypes.string]),
1823
2121
  "scrollVariant": PropTypes.oneOf(["dark", "light"]),
1824
2122
  "size": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
1825
2123
  "__@iterator": PropTypes.func.isRequired,
@@ -1920,6 +2218,106 @@ DismissibleBox.propTypes = {
1920
2218
  "trimStart": PropTypes.func.isRequired,
1921
2219
  "valueOf": PropTypes.func.isRequired
1922
2220
  }), PropTypes.string]),
2221
+ "tabIndex": PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
2222
+ "top": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
2223
+ "__@iterator": PropTypes.func.isRequired,
2224
+ "anchor": PropTypes.func.isRequired,
2225
+ "big": PropTypes.func.isRequired,
2226
+ "blink": PropTypes.func.isRequired,
2227
+ "bold": PropTypes.func.isRequired,
2228
+ "charAt": PropTypes.func.isRequired,
2229
+ "charCodeAt": PropTypes.func.isRequired,
2230
+ "codePointAt": PropTypes.func.isRequired,
2231
+ "concat": PropTypes.func.isRequired,
2232
+ "endsWith": PropTypes.func.isRequired,
2233
+ "fixed": PropTypes.func.isRequired,
2234
+ "fontcolor": PropTypes.func.isRequired,
2235
+ "fontsize": PropTypes.func.isRequired,
2236
+ "includes": PropTypes.func.isRequired,
2237
+ "indexOf": PropTypes.func.isRequired,
2238
+ "italics": PropTypes.func.isRequired,
2239
+ "lastIndexOf": PropTypes.func.isRequired,
2240
+ "length": PropTypes.number.isRequired,
2241
+ "link": PropTypes.func.isRequired,
2242
+ "localeCompare": PropTypes.func.isRequired,
2243
+ "match": PropTypes.func.isRequired,
2244
+ "matchAll": PropTypes.func.isRequired,
2245
+ "normalize": PropTypes.func.isRequired,
2246
+ "padEnd": PropTypes.func.isRequired,
2247
+ "padStart": PropTypes.func.isRequired,
2248
+ "repeat": PropTypes.func.isRequired,
2249
+ "replace": PropTypes.func.isRequired,
2250
+ "search": PropTypes.func.isRequired,
2251
+ "slice": PropTypes.func.isRequired,
2252
+ "small": PropTypes.func.isRequired,
2253
+ "split": PropTypes.func.isRequired,
2254
+ "startsWith": PropTypes.func.isRequired,
2255
+ "strike": PropTypes.func.isRequired,
2256
+ "sub": PropTypes.func.isRequired,
2257
+ "substr": PropTypes.func.isRequired,
2258
+ "substring": PropTypes.func.isRequired,
2259
+ "sup": PropTypes.func.isRequired,
2260
+ "toLocaleLowerCase": PropTypes.func.isRequired,
2261
+ "toLocaleUpperCase": PropTypes.func.isRequired,
2262
+ "toLowerCase": PropTypes.func.isRequired,
2263
+ "toString": PropTypes.func.isRequired,
2264
+ "toUpperCase": PropTypes.func.isRequired,
2265
+ "trim": PropTypes.func.isRequired,
2266
+ "trimEnd": PropTypes.func.isRequired,
2267
+ "trimLeft": PropTypes.func.isRequired,
2268
+ "trimRight": PropTypes.func.isRequired,
2269
+ "trimStart": PropTypes.func.isRequired,
2270
+ "valueOf": PropTypes.func.isRequired
2271
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
2272
+ "__@iterator": PropTypes.func.isRequired,
2273
+ "anchor": PropTypes.func.isRequired,
2274
+ "big": PropTypes.func.isRequired,
2275
+ "blink": PropTypes.func.isRequired,
2276
+ "bold": PropTypes.func.isRequired,
2277
+ "charAt": PropTypes.func.isRequired,
2278
+ "charCodeAt": PropTypes.func.isRequired,
2279
+ "codePointAt": PropTypes.func.isRequired,
2280
+ "concat": PropTypes.func.isRequired,
2281
+ "endsWith": PropTypes.func.isRequired,
2282
+ "fixed": PropTypes.func.isRequired,
2283
+ "fontcolor": PropTypes.func.isRequired,
2284
+ "fontsize": PropTypes.func.isRequired,
2285
+ "includes": PropTypes.func.isRequired,
2286
+ "indexOf": PropTypes.func.isRequired,
2287
+ "italics": PropTypes.func.isRequired,
2288
+ "lastIndexOf": PropTypes.func.isRequired,
2289
+ "length": PropTypes.number.isRequired,
2290
+ "link": PropTypes.func.isRequired,
2291
+ "localeCompare": PropTypes.func.isRequired,
2292
+ "match": PropTypes.func.isRequired,
2293
+ "matchAll": PropTypes.func.isRequired,
2294
+ "normalize": PropTypes.func.isRequired,
2295
+ "padEnd": PropTypes.func.isRequired,
2296
+ "padStart": PropTypes.func.isRequired,
2297
+ "repeat": PropTypes.func.isRequired,
2298
+ "replace": PropTypes.func.isRequired,
2299
+ "search": PropTypes.func.isRequired,
2300
+ "slice": PropTypes.func.isRequired,
2301
+ "small": PropTypes.func.isRequired,
2302
+ "split": PropTypes.func.isRequired,
2303
+ "startsWith": PropTypes.func.isRequired,
2304
+ "strike": PropTypes.func.isRequired,
2305
+ "sub": PropTypes.func.isRequired,
2306
+ "substr": PropTypes.func.isRequired,
2307
+ "substring": PropTypes.func.isRequired,
2308
+ "sup": PropTypes.func.isRequired,
2309
+ "toLocaleLowerCase": PropTypes.func.isRequired,
2310
+ "toLocaleUpperCase": PropTypes.func.isRequired,
2311
+ "toLowerCase": PropTypes.func.isRequired,
2312
+ "toString": PropTypes.func.isRequired,
2313
+ "toUpperCase": PropTypes.func.isRequired,
2314
+ "trim": PropTypes.func.isRequired,
2315
+ "trimEnd": PropTypes.func.isRequired,
2316
+ "trimLeft": PropTypes.func.isRequired,
2317
+ "trimRight": PropTypes.func.isRequired,
2318
+ "trimStart": PropTypes.func.isRequired,
2319
+ "valueOf": PropTypes.func.isRequired
2320
+ }), PropTypes.string]),
1923
2321
  "variant": PropTypes.oneOf(["dark", "light"]),
1924
2322
  "verticalAlign": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
1925
2323
  "__@iterator": PropTypes.func.isRequired,
package/esm/components/portal/portal.d.ts CHANGED
@@ -1,14 +1,17 @@
1
- import * as React from "react";
2
-
3
- export interface PortalProps {
4
- /** The content of the portal. */
5
- children?: React.ReactNode;
6
- className?: string;
7
- id?: string;
8
- /** Callback function triggered when parent element is scrolled or window resized. */
9
- onReposition?: () => void;
1
+ import React from "react";
2
+ interface PortalContextProps {
3
+ renderInRoot?: boolean;
10
4
  }
11
-
12
- declare function Portal(props: PortalProps): JSX.Element;
13
-
5
+ export declare const PortalContext: React.Context<PortalContextProps>;
6
+ interface PortalProps {
7
+ /** The content of the portal. */
8
+ children?: React.ReactNode;
9
+ /** Classname attached to portal container. */
10
+ className?: string;
11
+ /** Id attribute attached to portal container. */
12
+ id?: string;
13
+ /** Callback function triggered when parent element is scrolled or window resized. */
14
+ onReposition?: () => void;
15
+ }
16
+ declare const Portal: ({ children, className, id, onReposition }: PortalProps) => JSX.Element;
14
17
  export default Portal;
package/esm/components/portal/portal.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import React, { useContext, useEffect, useMemo, useState } from "react";
2
- import PropTypes from "prop-types";
3
2
  import ReactDOM from "react-dom";
4
3
  import guid from "../../__internal__/utils/helpers/guid";
5
4
  import CarbonScopedTokensProvider from "../../style/design-tokens/carbon-scoped-tokens-provider/carbon-scoped-tokens-provider.component";
@@ -30,13 +29,13 @@ const Portal = ({
30
29
  }, [onReposition]);
31
30
  useEffect(() => {
32
31
  return () => {
33
- portalNode.remove();
32
+ portalNode === null || portalNode === void 0 ? void 0 : portalNode.remove();
34
33
  }; // eslint-disable-next-line react-hooks/exhaustive-deps
35
34
  }, []);
36
35
 
37
36
  const addClassNames = node => {
38
- className.split(" ").forEach(el => {
39
- node.classList.add(el);
37
+ className === null || className === void 0 ? void 0 : className.split(" ").forEach(el => {
38
+ node === null || node === void 0 ? void 0 : node.classList.add(el);
40
39
  });
41
40
  return node;
42
41
  };
@@ -80,13 +79,4 @@ const Portal = ({
80
79
  }, /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(CarbonScopedTokensProvider, null, children), getPortalContainer()));
81
80
  };
82
81
 
83
- Portal.propTypes = {
84
- /** The content of the portal. */
85
- children: PropTypes.node,
86
- className: PropTypes.string,
87
- id: PropTypes.string,
88
-
89
- /** Callback function triggered when parent element is scrolled or window resized. */
90
- onReposition: PropTypes.func
91
- };
92
82
  export default Portal;
package/esm/style/utils/filter-out-position-props.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { PositionProps } from "styled-system";
2
+ export declare const positionPropertyNames: string[];
3
+ export default function filterStyledSystemPositionProps(originalObject: Record<string, unknown> | PositionProps): PositionProps;
package/esm/style/utils/filter-out-position-props.js ADDED
@@ -0,0 +1,5 @@
1
+ import filterObjectProperties from "../../__internal__/filter-object-properties";
2
+ export const positionPropertyNames = ["top", "right", "bottom", "left", "position"];
3
+ export default function filterStyledSystemPositionProps(originalObject) {
4
+ return filterObjectProperties(originalObject, positionPropertyNames);
5
+ }
package/lib/__spec_helper__/test-utils.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { ReactWrapper, ShallowWrapper } from "enzyme";
3
- import { LayoutProps, FlexboxProps, BackgroundProps } from "styled-system";
3
+ import { LayoutProps, FlexboxProps, BackgroundProps, PositionProps } from "styled-system";
4
4
  import { ReactTestRendererJSON } from "react-test-renderer";
5
5
  import { mockMatchMedia } from "./mock-match-media";
6
6
  declare const toCSSCase: (str: string) => string;
@@ -47,5 +47,6 @@ declare const testStyledSystemWidth: (component: (widthProperties?: {
47
47
  declare const testStyledSystemLayout: (component: (layoutProperties?: LayoutProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
48
48
  declare const testStyledSystemFlexBox: (component: (flexboxProperties?: FlexboxProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
49
49
  declare const testStyledSystemBackground: (component: (backgroundProperties?: BackgroundProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
50
+ declare const testStyledSystemPosition: (component: (positionProperties?: PositionProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined) => JSX.Element, styleContainer?: ((wrapper: ReactWrapper) => ReactWrapper) | undefined) => void;
50
51
  declare const expectConsoleOutput: (message: string, type?: "warn" | "error") => () => void;
51
- export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, expectConsoleOutput, };
52
+ export { assertStyleMatch, toCSSCase, hoverList, selectedItemOf, childrenFrom, makeArrayKeys, keyboard, assertKeyboardTraversal, assertHoverTraversal, listFrom, click, simulate, carbonThemesJestTable, mockMatchMedia, testStyledSystemSpacing, testStyledSystemMargin, testStyledSystemPadding, testStyledSystemColor, testStyledSystemWidth, testStyledSystemLayout, testStyledSystemFlexBox, testStyledSystemBackground, testStyledSystemPosition, expectConsoleOutput, };
package/lib/__spec_helper__/test-utils.js CHANGED
@@ -9,7 +9,7 @@ Object.defineProperty(exports, "mockMatchMedia", {
9
9
  return _mockMatchMedia.mockMatchMedia;
10
10
  }
11
11
  });
12
- exports.expectConsoleOutput = exports.testStyledSystemBackground = exports.testStyledSystemFlexBox = exports.testStyledSystemLayout = exports.testStyledSystemWidth = exports.testStyledSystemColor = exports.testStyledSystemPadding = exports.testStyledSystemMargin = exports.testStyledSystemSpacing = exports.carbonThemesJestTable = exports.simulate = exports.click = exports.listFrom = exports.assertHoverTraversal = exports.assertKeyboardTraversal = exports.keyboard = exports.makeArrayKeys = exports.childrenFrom = exports.selectedItemOf = exports.hoverList = exports.toCSSCase = exports.assertStyleMatch = exports.getDefaultValue = void 0;
12
+ exports.expectConsoleOutput = exports.testStyledSystemPosition = exports.testStyledSystemBackground = exports.testStyledSystemFlexBox = exports.testStyledSystemLayout = exports.testStyledSystemWidth = exports.testStyledSystemColor = exports.testStyledSystemPadding = exports.testStyledSystemMargin = exports.testStyledSystemSpacing = exports.carbonThemesJestTable = exports.simulate = exports.click = exports.listFrom = exports.assertHoverTraversal = exports.assertKeyboardTraversal = exports.keyboard = exports.makeArrayKeys = exports.childrenFrom = exports.selectedItemOf = exports.hoverList = exports.toCSSCase = exports.assertStyleMatch = exports.getDefaultValue = void 0;
13
13
 
14
14
  var _enzyme = require("enzyme");
15
15
 
@@ -148,6 +148,7 @@ const widthProps = ["width", "width", "200px"];
148
148
  const layoutProps = [widthProps, ["height", "height", "200px"], ["minWidth", "min-width", "120px"], ["maxWidth", "max-width", "120px"], ["minHeight", "min-height", "120px"], ["maxHeight", "max-height", "120px"], ["size", "width", "120px"], ["size", "height", "120px"], ["display", "display", "inline-block"], ["verticalAlign", "vertical-align", "baseline"], ["overflow", "overflow", "hidden"], ["overflowX", "overflow-x", "hidden"], ["overflowY", "overflow-y", "hidden"]];
149
149
  const flexBoxProps = [["alignItems", "alignItems", "center"], ["alignContent", "alignContent", "center"], ["justifyItems", "justifyItems", "center"], ["justifyContent", "justifyContent", "center"], ["flexWrap", "flexWrap", "wrap"], ["flexDirection", "flexDirection", "row-reverse"], ["flex", "flex", "1"], ["flexGrow", "flexGrow", "1"], ["flexShrink", "flexShrink", "1"], ["flexBasis", "flexBasis", "100px"], ["justifySelf", "justifySelf", "center"], ["alignSelf", "alignSelf", "center"], ["order", "order", "1"]];
150
150
  const backgroundProps = [["background", "background", "lightblue url('foo.jpg') no-repeat fixed center"], ["backgroundImage", "background-image", "url(foo.jpg)"], ["backgroundSize", "background-size", "center"], ["backgroundRepeat", "background-repeat", "no-repeat"]];
151
+ const positionProps = [["top", "0px"], ["bottom", "0px"], ["right", "0px"], ["left", "0px"], ["position", "fixed"], ["position", "sticky"], ["position", "absolute"], ["position", "static"], ["position", "relative"]];
151
152
 
152
153
  const getDefaultValue = value => {
153
154
  const spaceArrayLength = _baseTheme.space.length - 1;
@@ -358,10 +359,27 @@ const testStyledSystemBackground = (component, styleContainer) => {
358
359
  }, styleContainer ? styleContainer(wrapper) : wrapper);
359
360
  });
360
361
  });
362
+ };
363
+
364
+ exports.testStyledSystemBackground = testStyledSystemBackground;
365
+
366
+ const testStyledSystemPosition = (component, styleContainer) => {
367
+ describe.each(positionProps)('when a prop is specified using the "%s" styled system props', (styledSystemProp, value) => {
368
+ it(`then ${styledSystemProp} should have been set correctly`, () => {
369
+ const props = {
370
+ [styledSystemProp]: value
371
+ };
372
+ const wrapper = (0, _enzyme.mount)(component({ ...props
373
+ }));
374
+ assertStyleMatch({
375
+ [styledSystemProp]: value
376
+ }, styleContainer ? styleContainer(wrapper) : wrapper);
377
+ });
378
+ });
361
379
  }; // this util will catch that a console output occurred without polluting the output when running the unit tests
362
380
 
363
381
 
364
- exports.testStyledSystemBackground = testStyledSystemBackground;
382
+ exports.testStyledSystemPosition = testStyledSystemPosition;
365
383
 
366
384
  const expectConsoleOutput = (message, type = "error") => {
367
385
  if (!message) {
package/lib/components/box/box.component.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import React from "react";
2
- import { SpaceProps, LayoutProps, FlexboxProps, ColorProps } from "styled-system";
2
+ import { SpaceProps, LayoutProps, FlexboxProps, ColorProps, PositionProps } from "styled-system";
3
3
  export declare type OverflowWrap = "break-word" | "anywhere";
4
4
  export declare type ScrollVariant = "light" | "dark";
5
5
  export declare type BoxSizing = "content-box" | "border-box";
6
- export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorProps {
6
+ export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorProps, Omit<PositionProps, "zIndex"> {
7
7
  as?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
8
8
  /** String to set Box content break strategy. Note "anywhere" is not supported in Safari */
9
9
  overflowWrap?: OverflowWrap;
@@ -11,6 +11,8 @@ export interface BoxProps extends SpaceProps, LayoutProps, FlexboxProps, ColorPr
11
11
  scrollVariant?: ScrollVariant;
12
12
  /** set the box-sizing attribute of the Box component */
13
13
  boxSizing?: BoxSizing;
14
+ /** Allows a tabindex to be specified */
15
+ tabIndex?: number | string;
14
16
  }
15
17
  declare const Box: import("styled-components").StyledComponent<"div", any, BoxProps, never>;
16
18
  export default Box;
package/lib/components/box/box.component.js CHANGED
@@ -25,6 +25,7 @@ const Box = _styledComponents.default.div`
25
25
  ${_styledSystem.space}
26
26
  ${_styledSystem.layout}
27
27
  ${_styledSystem.flexbox}
28
+ ${_styledSystem.position}
28
29
  ${({
29
30
  color,
30
31
  bg,
package/lib/components/dismissible-box/dismissible-box.component.js CHANGED
@@ -372,6 +372,105 @@ DismissibleBox.propTypes = {
372
372
  "toString": _propTypes.default.func.isRequired,
373
373
  "valueOf": _propTypes.default.func.isRequired
374
374
  }), _propTypes.default.string]),
375
+ "bottom": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
376
+ "__@iterator": _propTypes.default.func.isRequired,
377
+ "anchor": _propTypes.default.func.isRequired,
378
+ "big": _propTypes.default.func.isRequired,
379
+ "blink": _propTypes.default.func.isRequired,
380
+ "bold": _propTypes.default.func.isRequired,
381
+ "charAt": _propTypes.default.func.isRequired,
382
+ "charCodeAt": _propTypes.default.func.isRequired,
383
+ "codePointAt": _propTypes.default.func.isRequired,
384
+ "concat": _propTypes.default.func.isRequired,
385
+ "endsWith": _propTypes.default.func.isRequired,
386
+ "fixed": _propTypes.default.func.isRequired,
387
+ "fontcolor": _propTypes.default.func.isRequired,
388
+ "fontsize": _propTypes.default.func.isRequired,
389
+ "includes": _propTypes.default.func.isRequired,
390
+ "indexOf": _propTypes.default.func.isRequired,
391
+ "italics": _propTypes.default.func.isRequired,
392
+ "lastIndexOf": _propTypes.default.func.isRequired,
393
+ "length": _propTypes.default.number.isRequired,
394
+ "link": _propTypes.default.func.isRequired,
395
+ "localeCompare": _propTypes.default.func.isRequired,
396
+ "match": _propTypes.default.func.isRequired,
397
+ "matchAll": _propTypes.default.func.isRequired,
398
+ "normalize": _propTypes.default.func.isRequired,
399
+ "padEnd": _propTypes.default.func.isRequired,
400
+ "padStart": _propTypes.default.func.isRequired,
401
+ "repeat": _propTypes.default.func.isRequired,
402
+ "replace": _propTypes.default.func.isRequired,
403
+ "search": _propTypes.default.func.isRequired,
404
+ "slice": _propTypes.default.func.isRequired,
405
+ "small": _propTypes.default.func.isRequired,
406
+ "split": _propTypes.default.func.isRequired,
407
+ "startsWith": _propTypes.default.func.isRequired,
408
+ "strike": _propTypes.default.func.isRequired,
409
+ "sub": _propTypes.default.func.isRequired,
410
+ "substr": _propTypes.default.func.isRequired,
411
+ "substring": _propTypes.default.func.isRequired,
412
+ "sup": _propTypes.default.func.isRequired,
413
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
414
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
415
+ "toLowerCase": _propTypes.default.func.isRequired,
416
+ "toString": _propTypes.default.func.isRequired,
417
+ "toUpperCase": _propTypes.default.func.isRequired,
418
+ "trim": _propTypes.default.func.isRequired,
419
+ "trimEnd": _propTypes.default.func.isRequired,
420
+ "trimLeft": _propTypes.default.func.isRequired,
421
+ "trimRight": _propTypes.default.func.isRequired,
422
+ "trimStart": _propTypes.default.func.isRequired,
423
+ "valueOf": _propTypes.default.func.isRequired
424
+ }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
425
+ "__@iterator": _propTypes.default.func.isRequired,
426
+ "anchor": _propTypes.default.func.isRequired,
427
+ "big": _propTypes.default.func.isRequired,
428
+ "blink": _propTypes.default.func.isRequired,
429
+ "bold": _propTypes.default.func.isRequired,
430
+ "charAt": _propTypes.default.func.isRequired,
431
+ "charCodeAt": _propTypes.default.func.isRequired,
432
+ "codePointAt": _propTypes.default.func.isRequired,
433
+ "concat": _propTypes.default.func.isRequired,
434
+ "endsWith": _propTypes.default.func.isRequired,
435
+ "fixed": _propTypes.default.func.isRequired,
436
+ "fontcolor": _propTypes.default.func.isRequired,
437
+ "fontsize": _propTypes.default.func.isRequired,
438
+ "includes": _propTypes.default.func.isRequired,
439
+ "indexOf": _propTypes.default.func.isRequired,
440
+ "italics": _propTypes.default.func.isRequired,
441
+ "lastIndexOf": _propTypes.default.func.isRequired,
442
+ "length": _propTypes.default.number.isRequired,
443
+ "link": _propTypes.default.func.isRequired,
444
+ "localeCompare": _propTypes.default.func.isRequired,
445
+ "match": _propTypes.default.func.isRequired,
446
+ "matchAll": _propTypes.default.func.isRequired,
447
+ "normalize": _propTypes.default.func.isRequired,
448
+ "padEnd": _propTypes.default.func.isRequired,
449
+ "padStart": _propTypes.default.func.isRequired,
450
+ "repeat": _propTypes.default.func.isRequired,
451
+ "replace": _propTypes.default.func.isRequired,
452
+ "search": _propTypes.default.func.isRequired,
453
+ "slice": _propTypes.default.func.isRequired,
454
+ "small": _propTypes.default.func.isRequired,
455
+ "split": _propTypes.default.func.isRequired,
456
+ "startsWith": _propTypes.default.func.isRequired,
457
+ "strike": _propTypes.default.func.isRequired,
458
+ "sub": _propTypes.default.func.isRequired,
459
+ "substr": _propTypes.default.func.isRequired,
460
+ "substring": _propTypes.default.func.isRequired,
461
+ "sup": _propTypes.default.func.isRequired,
462
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
463
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
464
+ "toLowerCase": _propTypes.default.func.isRequired,
465
+ "toString": _propTypes.default.func.isRequired,
466
+ "toUpperCase": _propTypes.default.func.isRequired,
467
+ "trim": _propTypes.default.func.isRequired,
468
+ "trimEnd": _propTypes.default.func.isRequired,
469
+ "trimLeft": _propTypes.default.func.isRequired,
470
+ "trimRight": _propTypes.default.func.isRequired,
471
+ "trimStart": _propTypes.default.func.isRequired,
472
+ "valueOf": _propTypes.default.func.isRequired
473
+ }), _propTypes.default.string]),
375
474
  "boxSizing": _propTypes.default.oneOf(["border-box", "content-box"]),
376
475
  "children": _propTypes.default.node,
377
476
  "color": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
@@ -913,6 +1012,105 @@ DismissibleBox.propTypes = {
913
1012
  "trimStart": _propTypes.default.func.isRequired,
914
1013
  "valueOf": _propTypes.default.func.isRequired
915
1014
  })]),
1015
+ "left": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
1016
+ "__@iterator": _propTypes.default.func.isRequired,
1017
+ "anchor": _propTypes.default.func.isRequired,
1018
+ "big": _propTypes.default.func.isRequired,
1019
+ "blink": _propTypes.default.func.isRequired,
1020
+ "bold": _propTypes.default.func.isRequired,
1021
+ "charAt": _propTypes.default.func.isRequired,
1022
+ "charCodeAt": _propTypes.default.func.isRequired,
1023
+ "codePointAt": _propTypes.default.func.isRequired,
1024
+ "concat": _propTypes.default.func.isRequired,
1025
+ "endsWith": _propTypes.default.func.isRequired,
1026
+ "fixed": _propTypes.default.func.isRequired,
1027
+ "fontcolor": _propTypes.default.func.isRequired,
1028
+ "fontsize": _propTypes.default.func.isRequired,
1029
+ "includes": _propTypes.default.func.isRequired,
1030
+ "indexOf": _propTypes.default.func.isRequired,
1031
+ "italics": _propTypes.default.func.isRequired,
1032
+ "lastIndexOf": _propTypes.default.func.isRequired,
1033
+ "length": _propTypes.default.number.isRequired,
1034
+ "link": _propTypes.default.func.isRequired,
1035
+ "localeCompare": _propTypes.default.func.isRequired,
1036
+ "match": _propTypes.default.func.isRequired,
1037
+ "matchAll": _propTypes.default.func.isRequired,
1038
+ "normalize": _propTypes.default.func.isRequired,
1039
+ "padEnd": _propTypes.default.func.isRequired,
1040
+ "padStart": _propTypes.default.func.isRequired,
1041
+ "repeat": _propTypes.default.func.isRequired,
1042
+ "replace": _propTypes.default.func.isRequired,
1043
+ "search": _propTypes.default.func.isRequired,
1044
+ "slice": _propTypes.default.func.isRequired,
1045
+ "small": _propTypes.default.func.isRequired,
1046
+ "split": _propTypes.default.func.isRequired,
1047
+ "startsWith": _propTypes.default.func.isRequired,
1048
+ "strike": _propTypes.default.func.isRequired,
1049
+ "sub": _propTypes.default.func.isRequired,
1050
+ "substr": _propTypes.default.func.isRequired,
1051
+ "substring": _propTypes.default.func.isRequired,
1052
+ "sup": _propTypes.default.func.isRequired,
1053
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
1054
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
1055
+ "toLowerCase": _propTypes.default.func.isRequired,
1056
+ "toString": _propTypes.default.func.isRequired,
1057
+ "toUpperCase": _propTypes.default.func.isRequired,
1058
+ "trim": _propTypes.default.func.isRequired,
1059
+ "trimEnd": _propTypes.default.func.isRequired,
1060
+ "trimLeft": _propTypes.default.func.isRequired,
1061
+ "trimRight": _propTypes.default.func.isRequired,
1062
+ "trimStart": _propTypes.default.func.isRequired,
1063
+ "valueOf": _propTypes.default.func.isRequired
1064
+ }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
1065
+ "__@iterator": _propTypes.default.func.isRequired,
1066
+ "anchor": _propTypes.default.func.isRequired,
1067
+ "big": _propTypes.default.func.isRequired,
1068
+ "blink": _propTypes.default.func.isRequired,
1069
+ "bold": _propTypes.default.func.isRequired,
1070
+ "charAt": _propTypes.default.func.isRequired,
1071
+ "charCodeAt": _propTypes.default.func.isRequired,
1072
+ "codePointAt": _propTypes.default.func.isRequired,
1073
+ "concat": _propTypes.default.func.isRequired,
1074
+ "endsWith": _propTypes.default.func.isRequired,
1075
+ "fixed": _propTypes.default.func.isRequired,
1076
+ "fontcolor": _propTypes.default.func.isRequired,
1077
+ "fontsize": _propTypes.default.func.isRequired,
1078
+ "includes": _propTypes.default.func.isRequired,
1079
+ "indexOf": _propTypes.default.func.isRequired,
1080
+ "italics": _propTypes.default.func.isRequired,
1081
+ "lastIndexOf": _propTypes.default.func.isRequired,
1082
+ "length": _propTypes.default.number.isRequired,
1083
+ "link": _propTypes.default.func.isRequired,
1084
+ "localeCompare": _propTypes.default.func.isRequired,
1085
+ "match": _propTypes.default.func.isRequired,
1086
+ "matchAll": _propTypes.default.func.isRequired,
1087
+ "normalize": _propTypes.default.func.isRequired,
1088
+ "padEnd": _propTypes.default.func.isRequired,
1089
+ "padStart": _propTypes.default.func.isRequired,
1090
+ "repeat": _propTypes.default.func.isRequired,
1091
+ "replace": _propTypes.default.func.isRequired,
1092
+ "search": _propTypes.default.func.isRequired,
1093
+ "slice": _propTypes.default.func.isRequired,
1094
+ "small": _propTypes.default.func.isRequired,
1095
+ "split": _propTypes.default.func.isRequired,
1096
+ "startsWith": _propTypes.default.func.isRequired,
1097
+ "strike": _propTypes.default.func.isRequired,
1098
+ "sub": _propTypes.default.func.isRequired,
1099
+ "substr": _propTypes.default.func.isRequired,
1100
+ "substring": _propTypes.default.func.isRequired,
1101
+ "sup": _propTypes.default.func.isRequired,
1102
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
1103
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
1104
+ "toLowerCase": _propTypes.default.func.isRequired,
1105
+ "toString": _propTypes.default.func.isRequired,
1106
+ "toUpperCase": _propTypes.default.func.isRequired,
1107
+ "trim": _propTypes.default.func.isRequired,
1108
+ "trimEnd": _propTypes.default.func.isRequired,
1109
+ "trimLeft": _propTypes.default.func.isRequired,
1110
+ "trimRight": _propTypes.default.func.isRequired,
1111
+ "trimStart": _propTypes.default.func.isRequired,
1112
+ "valueOf": _propTypes.default.func.isRequired
1113
+ }), _propTypes.default.string]),
916
1114
  "m": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
917
1115
  "__@toStringTag": _propTypes.default.string.isRequired,
918
1116
  "description": _propTypes.default.string,
@@ -1790,6 +1988,7 @@ DismissibleBox.propTypes = {
1790
1988
  "toString": _propTypes.default.func.isRequired,
1791
1989
  "valueOf": _propTypes.default.func.isRequired
1792
1990
  }), _propTypes.default.string]),
1991
+ "position": _propTypes.default.oneOfType([_propTypes.default.oneOf(["-moz-initial", "-webkit-sticky", "absolute", "fixed", "inherit", "initial", "relative", "revert", "static", "sticky", "unset"]), _propTypes.default.arrayOf(_propTypes.default.oneOf(["-moz-initial", "-webkit-sticky", "absolute", "fixed", "inherit", "initial", "relative", "revert", "static", "sticky", "unset", null])), _propTypes.default.object]),
1793
1992
  "pr": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
1794
1993
  "__@toStringTag": _propTypes.default.string.isRequired,
1795
1994
  "description": _propTypes.default.string,
@@ -1834,6 +2033,105 @@ DismissibleBox.propTypes = {
1834
2033
  "toString": _propTypes.default.func.isRequired,
1835
2034
  "valueOf": _propTypes.default.func.isRequired
1836
2035
  }), _propTypes.default.string]),
2036
+ "right": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
2037
+ "__@iterator": _propTypes.default.func.isRequired,
2038
+ "anchor": _propTypes.default.func.isRequired,
2039
+ "big": _propTypes.default.func.isRequired,
2040
+ "blink": _propTypes.default.func.isRequired,
2041
+ "bold": _propTypes.default.func.isRequired,
2042
+ "charAt": _propTypes.default.func.isRequired,
2043
+ "charCodeAt": _propTypes.default.func.isRequired,
2044
+ "codePointAt": _propTypes.default.func.isRequired,
2045
+ "concat": _propTypes.default.func.isRequired,
2046
+ "endsWith": _propTypes.default.func.isRequired,
2047
+ "fixed": _propTypes.default.func.isRequired,
2048
+ "fontcolor": _propTypes.default.func.isRequired,
2049
+ "fontsize": _propTypes.default.func.isRequired,
2050
+ "includes": _propTypes.default.func.isRequired,
2051
+ "indexOf": _propTypes.default.func.isRequired,
2052
+ "italics": _propTypes.default.func.isRequired,
2053
+ "lastIndexOf": _propTypes.default.func.isRequired,
2054
+ "length": _propTypes.default.number.isRequired,
2055
+ "link": _propTypes.default.func.isRequired,
2056
+ "localeCompare": _propTypes.default.func.isRequired,
2057
+ "match": _propTypes.default.func.isRequired,
2058
+ "matchAll": _propTypes.default.func.isRequired,
2059
+ "normalize": _propTypes.default.func.isRequired,
2060
+ "padEnd": _propTypes.default.func.isRequired,
2061
+ "padStart": _propTypes.default.func.isRequired,
2062
+ "repeat": _propTypes.default.func.isRequired,
2063
+ "replace": _propTypes.default.func.isRequired,
2064
+ "search": _propTypes.default.func.isRequired,
2065
+ "slice": _propTypes.default.func.isRequired,
2066
+ "small": _propTypes.default.func.isRequired,
2067
+ "split": _propTypes.default.func.isRequired,
2068
+ "startsWith": _propTypes.default.func.isRequired,
2069
+ "strike": _propTypes.default.func.isRequired,
2070
+ "sub": _propTypes.default.func.isRequired,
2071
+ "substr": _propTypes.default.func.isRequired,
2072
+ "substring": _propTypes.default.func.isRequired,
2073
+ "sup": _propTypes.default.func.isRequired,
2074
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
2075
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
2076
+ "toLowerCase": _propTypes.default.func.isRequired,
2077
+ "toString": _propTypes.default.func.isRequired,
2078
+ "toUpperCase": _propTypes.default.func.isRequired,
2079
+ "trim": _propTypes.default.func.isRequired,
2080
+ "trimEnd": _propTypes.default.func.isRequired,
2081
+ "trimLeft": _propTypes.default.func.isRequired,
2082
+ "trimRight": _propTypes.default.func.isRequired,
2083
+ "trimStart": _propTypes.default.func.isRequired,
2084
+ "valueOf": _propTypes.default.func.isRequired
2085
+ }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
2086
+ "__@iterator": _propTypes.default.func.isRequired,
2087
+ "anchor": _propTypes.default.func.isRequired,
2088
+ "big": _propTypes.default.func.isRequired,
2089
+ "blink": _propTypes.default.func.isRequired,
2090
+ "bold": _propTypes.default.func.isRequired,
2091
+ "charAt": _propTypes.default.func.isRequired,
2092
+ "charCodeAt": _propTypes.default.func.isRequired,
2093
+ "codePointAt": _propTypes.default.func.isRequired,
2094
+ "concat": _propTypes.default.func.isRequired,
2095
+ "endsWith": _propTypes.default.func.isRequired,
2096
+ "fixed": _propTypes.default.func.isRequired,
2097
+ "fontcolor": _propTypes.default.func.isRequired,
2098
+ "fontsize": _propTypes.default.func.isRequired,
2099
+ "includes": _propTypes.default.func.isRequired,
2100
+ "indexOf": _propTypes.default.func.isRequired,
2101
+ "italics": _propTypes.default.func.isRequired,
2102
+ "lastIndexOf": _propTypes.default.func.isRequired,
2103
+ "length": _propTypes.default.number.isRequired,
2104
+ "link": _propTypes.default.func.isRequired,
2105
+ "localeCompare": _propTypes.default.func.isRequired,
2106
+ "match": _propTypes.default.func.isRequired,
2107
+ "matchAll": _propTypes.default.func.isRequired,
2108
+ "normalize": _propTypes.default.func.isRequired,
2109
+ "padEnd": _propTypes.default.func.isRequired,
2110
+ "padStart": _propTypes.default.func.isRequired,
2111
+ "repeat": _propTypes.default.func.isRequired,
2112
+ "replace": _propTypes.default.func.isRequired,
2113
+ "search": _propTypes.default.func.isRequired,
2114
+ "slice": _propTypes.default.func.isRequired,
2115
+ "small": _propTypes.default.func.isRequired,
2116
+ "split": _propTypes.default.func.isRequired,
2117
+ "startsWith": _propTypes.default.func.isRequired,
2118
+ "strike": _propTypes.default.func.isRequired,
2119
+ "sub": _propTypes.default.func.isRequired,
2120
+ "substr": _propTypes.default.func.isRequired,
2121
+ "substring": _propTypes.default.func.isRequired,
2122
+ "sup": _propTypes.default.func.isRequired,
2123
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
2124
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
2125
+ "toLowerCase": _propTypes.default.func.isRequired,
2126
+ "toString": _propTypes.default.func.isRequired,
2127
+ "toUpperCase": _propTypes.default.func.isRequired,
2128
+ "trim": _propTypes.default.func.isRequired,
2129
+ "trimEnd": _propTypes.default.func.isRequired,
2130
+ "trimLeft": _propTypes.default.func.isRequired,
2131
+ "trimRight": _propTypes.default.func.isRequired,
2132
+ "trimStart": _propTypes.default.func.isRequired,
2133
+ "valueOf": _propTypes.default.func.isRequired
2134
+ }), _propTypes.default.string]),
1837
2135
  "scrollVariant": _propTypes.default.oneOf(["dark", "light"]),
1838
2136
  "size": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
1839
2137
  "__@iterator": _propTypes.default.func.isRequired,
@@ -1934,6 +2232,106 @@ DismissibleBox.propTypes = {
1934
2232
  "trimStart": _propTypes.default.func.isRequired,
1935
2233
  "valueOf": _propTypes.default.func.isRequired
1936
2234
  }), _propTypes.default.string]),
2235
+ "tabIndex": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
2236
+ "top": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
2237
+ "__@iterator": _propTypes.default.func.isRequired,
2238
+ "anchor": _propTypes.default.func.isRequired,
2239
+ "big": _propTypes.default.func.isRequired,
2240
+ "blink": _propTypes.default.func.isRequired,
2241
+ "bold": _propTypes.default.func.isRequired,
2242
+ "charAt": _propTypes.default.func.isRequired,
2243
+ "charCodeAt": _propTypes.default.func.isRequired,
2244
+ "codePointAt": _propTypes.default.func.isRequired,
2245
+ "concat": _propTypes.default.func.isRequired,
2246
+ "endsWith": _propTypes.default.func.isRequired,
2247
+ "fixed": _propTypes.default.func.isRequired,
2248
+ "fontcolor": _propTypes.default.func.isRequired,
2249
+ "fontsize": _propTypes.default.func.isRequired,
2250
+ "includes": _propTypes.default.func.isRequired,
2251
+ "indexOf": _propTypes.default.func.isRequired,
2252
+ "italics": _propTypes.default.func.isRequired,
2253
+ "lastIndexOf": _propTypes.default.func.isRequired,
2254
+ "length": _propTypes.default.number.isRequired,
2255
+ "link": _propTypes.default.func.isRequired,
2256
+ "localeCompare": _propTypes.default.func.isRequired,
2257
+ "match": _propTypes.default.func.isRequired,
2258
+ "matchAll": _propTypes.default.func.isRequired,
2259
+ "normalize": _propTypes.default.func.isRequired,
2260
+ "padEnd": _propTypes.default.func.isRequired,
2261
+ "padStart": _propTypes.default.func.isRequired,
2262
+ "repeat": _propTypes.default.func.isRequired,
2263
+ "replace": _propTypes.default.func.isRequired,
2264
+ "search": _propTypes.default.func.isRequired,
2265
+ "slice": _propTypes.default.func.isRequired,
2266
+ "small": _propTypes.default.func.isRequired,
2267
+ "split": _propTypes.default.func.isRequired,
2268
+ "startsWith": _propTypes.default.func.isRequired,
2269
+ "strike": _propTypes.default.func.isRequired,
2270
+ "sub": _propTypes.default.func.isRequired,
2271
+ "substr": _propTypes.default.func.isRequired,
2272
+ "substring": _propTypes.default.func.isRequired,
2273
+ "sup": _propTypes.default.func.isRequired,
2274
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
2275
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
2276
+ "toLowerCase": _propTypes.default.func.isRequired,
2277
+ "toString": _propTypes.default.func.isRequired,
2278
+ "toUpperCase": _propTypes.default.func.isRequired,
2279
+ "trim": _propTypes.default.func.isRequired,
2280
+ "trimEnd": _propTypes.default.func.isRequired,
2281
+ "trimLeft": _propTypes.default.func.isRequired,
2282
+ "trimRight": _propTypes.default.func.isRequired,
2283
+ "trimStart": _propTypes.default.func.isRequired,
2284
+ "valueOf": _propTypes.default.func.isRequired
2285
+ }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
2286
+ "__@iterator": _propTypes.default.func.isRequired,
2287
+ "anchor": _propTypes.default.func.isRequired,
2288
+ "big": _propTypes.default.func.isRequired,
2289
+ "blink": _propTypes.default.func.isRequired,
2290
+ "bold": _propTypes.default.func.isRequired,
2291
+ "charAt": _propTypes.default.func.isRequired,
2292
+ "charCodeAt": _propTypes.default.func.isRequired,
2293
+ "codePointAt": _propTypes.default.func.isRequired,
2294
+ "concat": _propTypes.default.func.isRequired,
2295
+ "endsWith": _propTypes.default.func.isRequired,
2296
+ "fixed": _propTypes.default.func.isRequired,
2297
+ "fontcolor": _propTypes.default.func.isRequired,
2298
+ "fontsize": _propTypes.default.func.isRequired,
2299
+ "includes": _propTypes.default.func.isRequired,
2300
+ "indexOf": _propTypes.default.func.isRequired,
2301
+ "italics": _propTypes.default.func.isRequired,
2302
+ "lastIndexOf": _propTypes.default.func.isRequired,
2303
+ "length": _propTypes.default.number.isRequired,
2304
+ "link": _propTypes.default.func.isRequired,
2305
+ "localeCompare": _propTypes.default.func.isRequired,
2306
+ "match": _propTypes.default.func.isRequired,
2307
+ "matchAll": _propTypes.default.func.isRequired,
2308
+ "normalize": _propTypes.default.func.isRequired,
2309
+ "padEnd": _propTypes.default.func.isRequired,
2310
+ "padStart": _propTypes.default.func.isRequired,
2311
+ "repeat": _propTypes.default.func.isRequired,
2312
+ "replace": _propTypes.default.func.isRequired,
2313
+ "search": _propTypes.default.func.isRequired,
2314
+ "slice": _propTypes.default.func.isRequired,
2315
+ "small": _propTypes.default.func.isRequired,
2316
+ "split": _propTypes.default.func.isRequired,
2317
+ "startsWith": _propTypes.default.func.isRequired,
2318
+ "strike": _propTypes.default.func.isRequired,
2319
+ "sub": _propTypes.default.func.isRequired,
2320
+ "substr": _propTypes.default.func.isRequired,
2321
+ "substring": _propTypes.default.func.isRequired,
2322
+ "sup": _propTypes.default.func.isRequired,
2323
+ "toLocaleLowerCase": _propTypes.default.func.isRequired,
2324
+ "toLocaleUpperCase": _propTypes.default.func.isRequired,
2325
+ "toLowerCase": _propTypes.default.func.isRequired,
2326
+ "toString": _propTypes.default.func.isRequired,
2327
+ "toUpperCase": _propTypes.default.func.isRequired,
2328
+ "trim": _propTypes.default.func.isRequired,
2329
+ "trimEnd": _propTypes.default.func.isRequired,
2330
+ "trimLeft": _propTypes.default.func.isRequired,
2331
+ "trimRight": _propTypes.default.func.isRequired,
2332
+ "trimStart": _propTypes.default.func.isRequired,
2333
+ "valueOf": _propTypes.default.func.isRequired
2334
+ }), _propTypes.default.string]),
1937
2335
  "variant": _propTypes.default.oneOf(["dark", "light"]),
1938
2336
  "verticalAlign": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
1939
2337
  "__@iterator": _propTypes.default.func.isRequired,
package/lib/components/portal/portal.d.ts CHANGED
@@ -1,14 +1,17 @@
1
- import * as React from "react";
2
-
3
- export interface PortalProps {
4
- /** The content of the portal. */
5
- children?: React.ReactNode;
6
- className?: string;
7
- id?: string;
8
- /** Callback function triggered when parent element is scrolled or window resized. */
9
- onReposition?: () => void;
1
+ import React from "react";
2
+ interface PortalContextProps {
3
+ renderInRoot?: boolean;
10
4
  }
11
-
12
- declare function Portal(props: PortalProps): JSX.Element;
13
-
5
+ export declare const PortalContext: React.Context<PortalContextProps>;
6
+ interface PortalProps {
7
+ /** The content of the portal. */
8
+ children?: React.ReactNode;
9
+ /** Classname attached to portal container. */
10
+ className?: string;
11
+ /** Id attribute attached to portal container. */
12
+ id?: string;
13
+ /** Callback function triggered when parent element is scrolled or window resized. */
14
+ onReposition?: () => void;
15
+ }
16
+ declare const Portal: ({ children, className, id, onReposition }: PortalProps) => JSX.Element;
14
17
  export default Portal;
package/lib/components/portal/portal.js CHANGED
@@ -7,8 +7,6 @@ exports.default = exports.PortalContext = void 0;
7
7
 
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
 
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
10
  var _reactDom = _interopRequireDefault(require("react-dom"));
13
11
 
14
12
  var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
@@ -50,13 +48,13 @@ const Portal = ({
50
48
  }, [onReposition]);
51
49
  (0, _react.useEffect)(() => {
52
50
  return () => {
53
- portalNode.remove();
51
+ portalNode === null || portalNode === void 0 ? void 0 : portalNode.remove();
54
52
  }; // eslint-disable-next-line react-hooks/exhaustive-deps
55
53
  }, []);
56
54
 
57
55
  const addClassNames = node => {
58
- className.split(" ").forEach(el => {
59
- node.classList.add(el);
56
+ className === null || className === void 0 ? void 0 : className.split(" ").forEach(el => {
57
+ node === null || node === void 0 ? void 0 : node.classList.add(el);
60
58
  });
61
59
  return node;
62
60
  };
@@ -100,14 +98,5 @@ const Portal = ({
100
98
  }, /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_carbonScopedTokensProvider.default, null, children), getPortalContainer()));
101
99
  };
102
100
 
103
- Portal.propTypes = {
104
- /** The content of the portal. */
105
- children: _propTypes.default.node,
106
- className: _propTypes.default.string,
107
- id: _propTypes.default.string,
108
-
109
- /** Callback function triggered when parent element is scrolled or window resized. */
110
- onReposition: _propTypes.default.func
111
- };
112
101
  var _default = Portal;
113
102
  exports.default = _default;
package/lib/style/utils/filter-out-position-props.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { PositionProps } from "styled-system";
2
+ export declare const positionPropertyNames: string[];
3
+ export default function filterStyledSystemPositionProps(originalObject: Record<string, unknown> | PositionProps): PositionProps;
package/lib/style/utils/filter-out-position-props.js ADDED
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = filterStyledSystemPositionProps;
7
+ exports.positionPropertyNames = void 0;
8
+
9
+ var _filterObjectProperties = _interopRequireDefault(require("../../__internal__/filter-object-properties"));
10
+
11
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
+
13
+ const positionPropertyNames = ["top", "right", "bottom", "left", "position"];
14
+ exports.positionPropertyNames = positionPropertyNames;
15
+
16
+ function filterStyledSystemPositionProps(originalObject) {
17
+ return (0, _filterObjectProperties.default)(originalObject, positionPropertyNames);
18
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "110.1.3",
3
+ "version": "110.2.0",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "engineStrict": true,
6
6
  "engines": {