@instructure/ui-flex 8.10.1 → 8.10.2-snapshot.22

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.
package/LICENSE.md ADDED
@@ -0,0 +1,27 @@
1
+ ---
2
+ title: The MIT License (MIT)
3
+ category: Getting Started
4
+ order: 9
5
+ ---
6
+
7
+ # The MIT License (MIT)
8
+
9
+ Copyright (c) 2015 Instructure, Inc.
10
+
11
+ **Permission is hereby granted, free of charge, to any person obtaining a copy
12
+ of this software and associated documentation files (the "Software"), to deal
13
+ in the Software without restriction, including without limitation the rights
14
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
15
+ copies of the Software, and to permit persons to whom the Software is
16
+ furnished to do so, subject to the following conditions.**
17
+
18
+ The above copyright notice and this permission notice shall be included in all
19
+ copies or substantial portions of the Software.
20
+
21
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
22
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
23
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
24
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
25
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
26
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
27
+ SOFTWARE.
@@ -39,6 +39,18 @@ id: Flex.Item
39
39
  ---
40
40
  **/
41
41
  let Item = (_dec = withStyle(generateStyle, null), _dec(_class = (_temp = _class2 = class Item extends Component {
42
+ constructor(...args) {
43
+ super(...args);
44
+ this.ref = null;
45
+
46
+ this.handleRef = el => {
47
+ var _this$props$elementRe, _this$props;
48
+
49
+ this.ref = el;
50
+ (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
51
+ };
52
+ }
53
+
42
54
  componentDidMount() {
43
55
  this.props.makeStyles();
44
56
  }
@@ -49,24 +61,23 @@ let Item = (_dec = withStyle(generateStyle, null), _dec(_class = (_temp = _class
49
61
 
50
62
  render() {
51
63
  const props = omitProps(this.props, Item.allowedProps);
52
- const _this$props = this.props,
53
- as = _this$props.as,
54
- elementRef = _this$props.elementRef,
55
- children = _this$props.children,
56
- withVisualDebug = _this$props.withVisualDebug,
57
- textAlign = _this$props.textAlign,
58
- size = _this$props.size,
59
- direction = _this$props.direction,
60
- margin = _this$props.margin,
61
- padding = _this$props.padding,
62
- overflowX = _this$props.overflowX,
63
- overflowY = _this$props.overflowY,
64
- styles = _this$props.styles;
64
+ const _this$props2 = this.props,
65
+ as = _this$props2.as,
66
+ children = _this$props2.children,
67
+ withVisualDebug = _this$props2.withVisualDebug,
68
+ textAlign = _this$props2.textAlign,
69
+ size = _this$props2.size,
70
+ direction = _this$props2.direction,
71
+ margin = _this$props2.margin,
72
+ padding = _this$props2.padding,
73
+ overflowX = _this$props2.overflowX,
74
+ overflowY = _this$props2.overflowY,
75
+ styles = _this$props2.styles;
65
76
  const dirColumn = direction === 'column';
66
77
  const dirRow = direction === 'row';
67
78
  return jsx(View, Object.assign({}, props, {
68
79
  css: styles === null || styles === void 0 ? void 0 : styles.flexItem,
69
- elementRef: elementRef,
80
+ elementRef: this.handleRef,
70
81
  as: as,
71
82
  minHeight: dirColumn ? size : void 0,
72
83
  minWidth: dirRow ? size : void 0,
package/es/Flex/index.js CHANGED
@@ -43,6 +43,15 @@ category: components
43
43
  let Flex = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class Flex extends Component {
44
44
  constructor(props) {
45
45
  super(props);
46
+ this.ref = null;
47
+
48
+ this.handleRef = el => {
49
+ var _this$props$elementRe, _this$props;
50
+
51
+ this.ref = el;
52
+ (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
53
+ };
54
+
46
55
  props.makeStyles();
47
56
  }
48
57
 
@@ -67,23 +76,22 @@ let Flex = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class
67
76
  }
68
77
 
69
78
  render() {
70
- const _this$props = this.props,
71
- as = _this$props.as,
72
- elementRef = _this$props.elementRef,
73
- withVisualDebug = _this$props.withVisualDebug,
74
- height = _this$props.height,
75
- display = _this$props.display,
76
- margin = _this$props.margin,
77
- padding = _this$props.padding,
78
- textAlign = _this$props.textAlign,
79
- width = _this$props.width,
80
- styles = _this$props.styles;
79
+ const _this$props2 = this.props,
80
+ as = _this$props2.as,
81
+ withVisualDebug = _this$props2.withVisualDebug,
82
+ height = _this$props2.height,
83
+ display = _this$props2.display,
84
+ margin = _this$props2.margin,
85
+ padding = _this$props2.padding,
86
+ textAlign = _this$props2.textAlign,
87
+ width = _this$props2.width,
88
+ styles = _this$props2.styles;
81
89
  const children = callRenderProp(this.props.children);
82
90
 
83
91
  if (children && Children.count(children) > 0) {
84
92
  return jsx(View, Object.assign({}, passthroughProps(this.props), {
85
93
  css: styles === null || styles === void 0 ? void 0 : styles.flex,
86
- elementRef: elementRef,
94
+ elementRef: this.handleRef,
87
95
  as: as,
88
96
  display: display,
89
97
  width: width,
@@ -28,6 +28,18 @@ id: Flex.Item
28
28
  ---
29
29
  **/
30
30
  let Item = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_class = (_temp = _class2 = class Item extends _react.Component {
31
+ constructor(...args) {
32
+ super(...args);
33
+ this.ref = null;
34
+
35
+ this.handleRef = el => {
36
+ var _this$props$elementRe, _this$props;
37
+
38
+ this.ref = el;
39
+ (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
40
+ };
41
+ }
42
+
31
43
  componentDidMount() {
32
44
  this.props.makeStyles();
33
45
  }
@@ -38,24 +50,23 @@ let Item = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_class =
38
50
 
39
51
  render() {
40
52
  const props = (0, _omitProps.omitProps)(this.props, Item.allowedProps);
41
- const _this$props = this.props,
42
- as = _this$props.as,
43
- elementRef = _this$props.elementRef,
44
- children = _this$props.children,
45
- withVisualDebug = _this$props.withVisualDebug,
46
- textAlign = _this$props.textAlign,
47
- size = _this$props.size,
48
- direction = _this$props.direction,
49
- margin = _this$props.margin,
50
- padding = _this$props.padding,
51
- overflowX = _this$props.overflowX,
52
- overflowY = _this$props.overflowY,
53
- styles = _this$props.styles;
53
+ const _this$props2 = this.props,
54
+ as = _this$props2.as,
55
+ children = _this$props2.children,
56
+ withVisualDebug = _this$props2.withVisualDebug,
57
+ textAlign = _this$props2.textAlign,
58
+ size = _this$props2.size,
59
+ direction = _this$props2.direction,
60
+ margin = _this$props2.margin,
61
+ padding = _this$props2.padding,
62
+ overflowX = _this$props2.overflowX,
63
+ overflowY = _this$props2.overflowY,
64
+ styles = _this$props2.styles;
54
65
  const dirColumn = direction === 'column';
55
66
  const dirRow = direction === 'row';
56
67
  return (0, _emotion.jsx)(_View.View, Object.assign({}, props, {
57
68
  css: styles === null || styles === void 0 ? void 0 : styles.flexItem,
58
- elementRef: elementRef,
69
+ elementRef: this.handleRef,
59
70
  as: as,
60
71
  minHeight: dirColumn ? size : void 0,
61
72
  minWidth: dirRow ? size : void 0,
package/lib/Flex/index.js CHANGED
@@ -46,6 +46,15 @@ category: components
46
46
  let Flex = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class Flex extends _react.Component {
47
47
  constructor(props) {
48
48
  super(props);
49
+ this.ref = null;
50
+
51
+ this.handleRef = el => {
52
+ var _this$props$elementRe, _this$props;
53
+
54
+ this.ref = el;
55
+ (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
56
+ };
57
+
49
58
  props.makeStyles();
50
59
  }
51
60
 
@@ -70,23 +79,22 @@ let Flex = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _de
70
79
  }
71
80
 
72
81
  render() {
73
- const _this$props = this.props,
74
- as = _this$props.as,
75
- elementRef = _this$props.elementRef,
76
- withVisualDebug = _this$props.withVisualDebug,
77
- height = _this$props.height,
78
- display = _this$props.display,
79
- margin = _this$props.margin,
80
- padding = _this$props.padding,
81
- textAlign = _this$props.textAlign,
82
- width = _this$props.width,
83
- styles = _this$props.styles;
82
+ const _this$props2 = this.props,
83
+ as = _this$props2.as,
84
+ withVisualDebug = _this$props2.withVisualDebug,
85
+ height = _this$props2.height,
86
+ display = _this$props2.display,
87
+ margin = _this$props2.margin,
88
+ padding = _this$props2.padding,
89
+ textAlign = _this$props2.textAlign,
90
+ width = _this$props2.width,
91
+ styles = _this$props2.styles;
84
92
  const children = (0, _callRenderProp.callRenderProp)(this.props.children);
85
93
 
86
94
  if (children && _react.Children.count(children) > 0) {
87
95
  return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(this.props), {
88
96
  css: styles === null || styles === void 0 ? void 0 : styles.flex,
89
- elementRef: elementRef,
97
+ elementRef: this.handleRef,
90
98
  as: as,
91
99
  display: display,
92
100
  width: width,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-flex",
3
- "version": "8.10.1",
3
+ "version": "8.10.2-snapshot.22+b84160eff",
4
4
  "description": "A component that makes it easy to align content using flexbox CSS",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "type": "commonjs",
@@ -25,17 +25,17 @@
25
25
  "license": "MIT",
26
26
  "dependencies": {
27
27
  "@babel/runtime": "^7.13.10",
28
- "@instructure/console": "8.10.1",
29
- "@instructure/emotion": "8.10.1",
30
- "@instructure/shared-types": "8.10.1",
31
- "@instructure/ui-react-utils": "8.10.1",
32
- "@instructure/ui-view": "8.10.1",
28
+ "@instructure/console": "8.10.2-snapshot.22+b84160eff",
29
+ "@instructure/emotion": "8.10.2-snapshot.22+b84160eff",
30
+ "@instructure/shared-types": "8.10.2-snapshot.22+b84160eff",
31
+ "@instructure/ui-react-utils": "8.10.2-snapshot.22+b84160eff",
32
+ "@instructure/ui-view": "8.10.2-snapshot.22+b84160eff",
33
33
  "prop-types": "^15"
34
34
  },
35
35
  "devDependencies": {
36
- "@instructure/ui-babel-preset": "8.10.1",
37
- "@instructure/ui-test-utils": "8.10.1",
38
- "@instructure/ui-themes": "8.10.1"
36
+ "@instructure/ui-babel-preset": "8.10.2-snapshot.22+b84160eff",
37
+ "@instructure/ui-test-utils": "8.10.2-snapshot.22+b84160eff",
38
+ "@instructure/ui-themes": "8.10.2-snapshot.22+b84160eff"
39
39
  },
40
40
  "peerDependencies": {
41
41
  "react": ">=16.8 <=17"
@@ -43,5 +43,6 @@
43
43
  "publishConfig": {
44
44
  "access": "public"
45
45
  },
46
- "sideEffects": false
46
+ "sideEffects": false,
47
+ "gitHead": "b84160effefb01aeb94b754f0b7a64f8dad1b7f2"
47
48
  }
@@ -64,12 +64,18 @@ class Item extends Component<FlexItemProps> {
64
64
  shouldShrink: false
65
65
  }
66
66
 
67
+ ref: Element | null = null
68
+
69
+ handleRef = (el: Element | null) => {
70
+ this.ref = el
71
+ this.props.elementRef?.(el)
72
+ }
73
+
67
74
  render() {
68
75
  const props = omitProps(this.props, Item.allowedProps)
69
76
 
70
77
  const {
71
78
  as,
72
- elementRef,
73
79
  children,
74
80
  withVisualDebug,
75
81
  textAlign,
@@ -89,7 +95,7 @@ class Item extends Component<FlexItemProps> {
89
95
  <View
90
96
  {...props}
91
97
  css={styles?.flexItem}
92
- elementRef={elementRef}
98
+ elementRef={this.handleRef}
93
99
  as={as}
94
100
  minHeight={dirColumn ? size : undefined}
95
101
  minWidth={dirRow ? size : undefined}
@@ -37,7 +37,7 @@ import type {
37
37
  type FlexItemOwnProps = {
38
38
  children?: React.ReactNode
39
39
  as?: AsElementType
40
- elementRef?: (...args: any[]) => any
40
+ elementRef?: (element: Element | null) => void
41
41
  margin?: Spacing
42
42
  padding?: Spacing
43
43
  align?: 'center' | 'start' | 'end' | 'stretch'
@@ -79,6 +79,13 @@ class Flex extends Component<FlexProps> {
79
79
  wrap: 'no-wrap'
80
80
  }
81
81
 
82
+ ref: Element | null = null
83
+
84
+ handleRef = (el: Element | null) => {
85
+ this.ref = el
86
+ this.props.elementRef?.(el)
87
+ }
88
+
82
89
  renderChildren(children: any) {
83
90
  return Children.map(children, (child) => {
84
91
  if (!child) {
@@ -99,7 +106,6 @@ class Flex extends Component<FlexProps> {
99
106
  render() {
100
107
  const {
101
108
  as,
102
- elementRef,
103
109
  withVisualDebug,
104
110
  height,
105
111
  display,
@@ -117,7 +123,7 @@ class Flex extends Component<FlexProps> {
117
123
  <View
118
124
  {...passthroughProps(this.props)}
119
125
  css={styles?.flex}
120
- elementRef={elementRef}
126
+ elementRef={this.handleRef}
121
127
  as={as}
122
128
  display={display}
123
129
  width={width}
package/src/Flex/props.ts CHANGED
@@ -40,7 +40,7 @@ import type {
40
40
  type FlexOwnProps = {
41
41
  children?: React.ReactNode | ((...args: any[]) => React.ReactNode)
42
42
  as?: AsElementType
43
- elementRef?: (...args: any[]) => any
43
+ elementRef?: (element: Element | null) => void
44
44
  height?: string | number
45
45
  width?: string | number
46
46
  margin?: Spacing
@@ -15,7 +15,7 @@ declare class Item extends Component<FlexItemProps> {
15
15
  static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
16
16
  children?: import("react").ReactNode;
17
17
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
18
- elementRef?: ((...args: any[]) => any) | undefined;
18
+ elementRef?: ((element: Element | null) => void) | undefined;
19
19
  margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
20
20
  padding?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
21
21
  align?: "center" | "start" | "end" | "stretch" | undefined;
@@ -31,7 +31,7 @@ declare class Item extends Component<FlexItemProps> {
31
31
  static allowedProps: readonly (keyof {
32
32
  children?: import("react").ReactNode;
33
33
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
34
- elementRef?: ((...args: any[]) => any) | undefined;
34
+ elementRef?: ((element: Element | null) => void) | undefined;
35
35
  margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
36
36
  padding?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
37
37
  align?: "center" | "start" | "end" | "stretch" | undefined;
@@ -50,6 +50,8 @@ declare class Item extends Component<FlexItemProps> {
50
50
  shouldGrow: boolean;
51
51
  shouldShrink: boolean;
52
52
  };
53
+ ref: Element | null;
54
+ handleRef: (el: Element | null) => void;
53
55
  render(): jsx.JSX.Element;
54
56
  }
55
57
  export default Item;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Flex/Item/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C;;;;;GAKG;AACH,cACM,IAAK,SAAQ,SAAS,CAAC,aAAa,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,iBAAiB;IAKjB,kBAAkB;IAKlB,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;yBAGA,GAAG;;;MAGrB;IAED,MAAM;CAwCP;AAED,eAAe,IAAI,CAAA;AACnB,OAAO,EAAE,IAAI,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Flex/Item/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C;;;;;GAKG;AACH,cACM,IAAK,SAAQ,SAAS,CAAC,aAAa,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,iBAAiB;IAKjB,kBAAkB;IAKlB,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;yBAGA,GAAG;;;MAGrB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAG9B;IAED,MAAM;CAuCP;AAED,eAAe,IAAI,CAAA;AACnB,OAAO,EAAE,IAAI,EAAE,CAAA"}
@@ -4,7 +4,7 @@ import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emoti
4
4
  declare type FlexItemOwnProps = {
5
5
  children?: React.ReactNode;
6
6
  as?: AsElementType;
7
- elementRef?: (...args: any[]) => any;
7
+ elementRef?: (element: Element | null) => void;
8
8
  margin?: Spacing;
9
9
  padding?: Spacing;
10
10
  align?: 'center' | 'start' | 'end' | 'stretch';
@@ -1 +1 @@
1
- {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Flex/Item/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAE7B,aAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IAC9C,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;IACzC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,gBAAgB,CAAA;AAEtC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,aAAa,GAAG,gBAAgB,GAAG,cAAc,CAAC,IAAI,EAAE,aAAa,CAAC,CAAA;AAE3E,aAAK,aAAa,GAAG,cAAc,CAAC,UAAU,CAAC,CAAA;AAE/C,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA6DvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Flex/Item/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAE7B,aAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IAC9C,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;IACzC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,gBAAgB,CAAA;AAEtC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,aAAa,GAAG,gBAAgB,GAAG,cAAc,CAAC,IAAI,EAAE,aAAa,CAAC,CAAA;AAE3E,aAAK,aAAa,GAAG,cAAc,CAAC,UAAU,CAAC,CAAA;AAE/C,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA6DvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
@@ -17,7 +17,7 @@ declare class Flex extends Component<FlexProps> {
17
17
  static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
18
18
  children?: import("react").ReactNode | ((...args: any[]) => import("react").ReactNode);
19
19
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
20
- elementRef?: ((...args: any[]) => any) | undefined;
20
+ elementRef?: ((element: Element | null) => void) | undefined;
21
21
  height?: string | number | undefined;
22
22
  width?: string | number | undefined;
23
23
  margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
@@ -33,7 +33,7 @@ declare class Flex extends Component<FlexProps> {
33
33
  static allowedProps: readonly (keyof {
34
34
  children?: import("react").ReactNode | ((...args: any[]) => import("react").ReactNode);
35
35
  as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
36
- elementRef?: ((...args: any[]) => any) | undefined;
36
+ elementRef?: ((element: Element | null) => void) | undefined;
37
37
  height?: string | number | undefined;
38
38
  width?: string | number | undefined;
39
39
  margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
@@ -56,6 +56,8 @@ declare class Flex extends Component<FlexProps> {
56
56
  withVisualDebug: boolean;
57
57
  wrap: string;
58
58
  };
59
+ ref: Element | null;
60
+ handleRef: (el: Element | null) => void;
59
61
  renderChildren(children: any): any;
60
62
  render(): jsx.JSX.Element | null;
61
63
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Flex/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAY,SAAS,EAAE,MAAM,OAAO,CAAA;AAS3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAM7B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC;;;;;GAKG;AACH,cACM,IAAK,SAAQ,SAAS,CAAC,SAAS,CAAC;IACrC,MAAM,CAAC,QAAQ,CAAC,WAAW,UAAS;gBAExB,KAAK,EAAE,SAAS;IAM5B,kBAAkB;IAKlB,MAAM,CAAC,IAAI,cAAO;IAElB,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;yBAIA,GAAG;;;;;;MAMrB;IAED,cAAc,CAAC,QAAQ,EAAE,GAAG;IAiB5B,MAAM;CAsCP;AAED,eAAe,IAAI,CAAA;AACnB,OAAO,EAAE,IAAI,EAAE,IAAI,IAAI,QAAQ,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Flex/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAY,SAAS,EAAE,MAAM,OAAO,CAAA;AAS3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAM7B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC;;;;;GAKG;AACH,cACM,IAAK,SAAQ,SAAS,CAAC,SAAS,CAAC;IACrC,MAAM,CAAC,QAAQ,CAAC,WAAW,UAAS;gBAExB,KAAK,EAAE,SAAS;IAM5B,kBAAkB;IAKlB,MAAM,CAAC,IAAI,cAAO;IAElB,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;yBAIA,GAAG;;;;;;MAMrB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAG9B;IAED,cAAc,CAAC,QAAQ,EAAE,GAAG;IAiB5B,MAAM;CAqCP;AAED,eAAe,IAAI,CAAA;AACnB,OAAO,EAAE,IAAI,EAAE,IAAI,IAAI,QAAQ,EAAE,CAAA"}
@@ -4,7 +4,7 @@ import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emoti
4
4
  declare type FlexOwnProps = {
5
5
  children?: React.ReactNode | ((...args: any[]) => React.ReactNode);
6
6
  as?: AsElementType;
7
- elementRef?: (...args: any[]) => any;
7
+ elementRef?: (element: Element | null) => void;
8
8
  height?: string | number;
9
9
  width?: string | number;
10
10
  margin?: Spacing;
@@ -1 +1 @@
1
- {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Flex/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,SAAS,EACV,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAE7B,aAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IAClE,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,GAAG,aAAa,CAAA;IAChC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,aAAa,GAAG,gBAAgB,CAAA;IAC/D,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IACnD,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,cAAc,GAAG,eAAe,CAAA;IAC5E,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,cAAc,CAAA;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,YAAY,CAAA;AAElC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,SAAS,GAAG,YAAY,GAAG,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;AAEpE,aAAK,SAAS,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;AAEvC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA2EvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Flex/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,SAAS,EACV,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAE7B,aAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IAClE,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,GAAG,aAAa,CAAA;IAChC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,aAAa,GAAG,gBAAgB,CAAA;IAC/D,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IACnD,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,cAAc,GAAG,eAAe,CAAA;IAC5E,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,cAAc,CAAA;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,YAAY,CAAA;AAElC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,SAAS,GAAG,YAAY,GAAG,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;AAEpE,aAAK,SAAS,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;AAEvC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA2EvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}