@instructure/ui-form-field 8.10.1-snapshot.9 → 8.10.3-snapshot.2

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.10.2](https://github.com/instructure/instructure-ui/compare/v8.10.1...v8.10.2) (2021-10-01)
+
+**Note:** Version bump only for package @instructure/ui-form-field
+
+## [8.10.1](https://github.com/instructure/instructure-ui/compare/v8.10.0...v8.10.1) (2021-10-01)
+
+**Note:** Version bump only for package @instructure/ui-form-field
+
 # [8.10.0](https://github.com/instructure/instructure-ui/compare/v8.9.1...v8.10.0) (2021-09-28)
 
 **Note:** Version bump only for package @instructure/ui-form-field

package/es/FormField/index.js

@@ -32,11 +32,24 @@ category: components
 ---
 **/
 class FormField extends Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
+  }
+
   render() {
     return /*#__PURE__*/React.createElement(FormFieldLayout, Object.assign({}, omitProps(this.props, FormField.allowedProps), pickProps(this.props, FormFieldLayout.allowedProps), {
       vAlign: this.props.vAlign,
       as: "label",
-      htmlFor: this.props.id
+      htmlFor: this.props.id,
+      elementRef: this.handleRef
     }));
   }
 

package/es/FormField/props.js

@@ -45,7 +45,8 @@ const propTypes = {
   labelAlign: PropTypes.oneOf(['start', 'end']),
   vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
   width: PropTypes.string,
-  inputContainerRef: PropTypes.func
+  inputContainerRef: PropTypes.func,
+  elementRef: PropTypes.func
 };
-const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef'];
+const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef', 'elementRef'];
 export { propTypes, allowedProps };

package/es/FormFieldGroup/index.js

@@ -43,6 +43,18 @@ category: components
 ---
 **/
 let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class FormFieldGroup extends Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles(this.makeStylesVariables);
   }
@@ -90,17 +102,18 @@ let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _
   }
 
   render() {
-    const _this$props = this.props,
-          styles = _this$props.styles,
-          makeStyles = _this$props.makeStyles,
-          props = _objectWithoutProperties(_this$props, _excluded);
+    const _this$props2 = this.props,
+          styles = _this$props2.styles,
+          makeStyles = _this$props2.makeStyles,
+          props = _objectWithoutProperties(_this$props2, _excluded);
 
     return jsx(FormFieldLayout, Object.assign({}, omitProps(props, FormFieldGroup.allowedProps), pickProps(props, FormFieldLayout.allowedProps), {
       vAlign: props.vAlign,
       layout: props.layout === 'inline' ? 'inline' : 'stacked',
       label: props.description,
       "aria-disabled": props.disabled ? 'true' : null,
-      "aria-invalid": this.invalid ? 'true' : null
+      "aria-invalid": this.invalid ? 'true' : null,
+      elementRef: this.handleRef
     }), this.renderFields());
   }
 

package/es/FormFieldGroup/props.js

@@ -49,7 +49,8 @@ const propTypes = {
   rowSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
   colSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
   vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
-  startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null])
+  startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null]),
+  elementRef: PropTypes.func
 };
-const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt'];
+const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt', 'elementRef'];
 export { propTypes, allowedProps };

package/es/FormFieldLabel/index.js

@@ -49,6 +49,15 @@ example: true
 
 **/
 let FormFieldLabel = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class FormFieldLabel extends Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -63,7 +72,8 @@ let FormFieldLabel = (_dec = withStyle(generateStyle, generateComponentTheme), _
           styles = _this$props.styles,
           children = _this$props.children;
     return jsx(ElementType, Object.assign({}, omitProps(this.props, FormFieldLabel.allowedProps), {
-      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLabel
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLabel,
+      ref: this.handleRef
     }), children);
   }
 

package/es/FormFieldLayout/index.js

@@ -49,6 +49,14 @@ parent: FormField
 let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_temp = _class2 = class FormFieldLayout extends Component {
   constructor(props) {
     super(props);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
 
     this.handleInputContainerRef = node => {
       if (this.props.inputContainerRef) {
@@ -125,10 +133,10 @@ let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_te
   render() {
     const ElementType = this.elementType;
 
-    const _this$props = this.props,
-          makeStyles = _this$props.makeStyles,
-          styles = _this$props.styles,
-          props = _objectWithoutProperties(_this$props, _excluded);
+    const _this$props2 = this.props,
+          makeStyles = _this$props2.makeStyles,
+          styles = _this$props2.styles,
+          props = _objectWithoutProperties(_this$props2, _excluded);
 
     const width = props.width,
           layout = props.layout,
@@ -138,7 +146,8 @@ let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_te
       style: {
         width
       },
-      "aria-describedby": this.hasMessages ? this._messagesId : null
+      "aria-describedby": this.hasMessages ? this._messagesId : null,
+      ref: this.handleRef
     }), this.elementType === 'fieldset' && this.renderLegend(), jsx(Grid, Object.assign({
       rowSpacing: "small",
       colSpacing: "small",

package/es/FormFieldLayout/props.js

@@ -53,7 +53,8 @@ const propTypes = {
   layout: PropTypes.oneOf(['stacked', 'inline']),
   labelAlign: PropTypes.oneOf(['start', 'end']),
   width: PropTypes.string,
-  inputContainerRef: PropTypes.func
+  inputContainerRef: PropTypes.func,
+  elementRef: PropTypes.func
 };
-const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef'];
+const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef', 'elementRef'];
 export { propTypes, allowedProps };

package/es/FormFieldMessage/index.js

@@ -48,6 +48,15 @@ example: true
 ```
 **/
 let FormFieldMessage = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class FormFieldMessage extends Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -61,8 +70,11 @@ let FormFieldMessage = (_dec = withStyle(generateStyle, generateComponentTheme),
           children = _this$props.children,
           styles = _this$props.styles;
     return this.props.variant !== 'screenreader-only' ? jsx("span", {
-      css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessage
-    }, children) : jsx(ScreenReaderContent, null, children);
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessage,
+      ref: this.handleRef
+    }, children) : jsx(ScreenReaderContent, {
+      elementRef: this.handleRef
+    }, children);
   }
 
 }, _class2.displayName = "FormFieldMessage", _class2.componentId = 'FormFieldMessage', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {

package/es/FormFieldMessages/index.js

@@ -52,6 +52,15 @@ example: true
 ```
 **/
 let FormFieldMessages = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class FormFieldMessages extends Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -66,7 +75,9 @@ let FormFieldMessages = (_dec = withStyle(generateStyle, generateComponentTheme)
           styles = _this$props.styles;
     return messages && messages.length > 0 ? jsx("span", Object.assign({
       css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessages
-    }, omitProps(this.props, FormFieldMessages.allowedProps)), messages.map((msg, i) => {
+    }, omitProps(this.props, FormFieldMessages.allowedProps), {
+      ref: this.handleRef
+    }), messages.map((msg, i) => {
       return jsx("span", {
         key: `error${i}`,
         css: styles === null || styles === void 0 ? void 0 : styles.message

package/lib/FormField/index.js

@@ -47,11 +47,24 @@ category: components
 ---
 **/
 class FormField extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
+  }
+
   render() {
     return /*#__PURE__*/_react.default.createElement(_FormFieldLayout.FormFieldLayout, Object.assign({}, (0, _omitProps.omitProps)(this.props, FormField.allowedProps), (0, _pickProps.pickProps)(this.props, _FormFieldLayout.FormFieldLayout.allowedProps), {
       vAlign: this.props.vAlign,
       as: "label",
-      htmlFor: this.props.id
+      htmlFor: this.props.id,
+      elementRef: this.handleRef
     }));
   }
 

package/lib/FormField/props.js

@@ -56,8 +56,9 @@ const propTypes = {
   labelAlign: _propTypes.default.oneOf(['start', 'end']),
   vAlign: _propTypes.default.oneOf(['top', 'middle', 'bottom']),
   width: _propTypes.default.string,
-  inputContainerRef: _propTypes.default.func
+  inputContainerRef: _propTypes.default.func,
+  elementRef: _propTypes.default.func
 };
 exports.propTypes = propTypes;
-const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef'];
+const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef', 'elementRef'];
 exports.allowedProps = allowedProps;

package/lib/FormFieldGroup/index.js

@@ -37,6 +37,18 @@ category: components
 ---
 **/
 let FormFieldGroup = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class FormFieldGroup extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles(this.makeStylesVariables);
   }
@@ -84,16 +96,17 @@ let FormFieldGroup = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
   }
 
   render() {
-    const _this$props = this.props,
-          styles = _this$props.styles,
-          makeStyles = _this$props.makeStyles,
-          props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    const _this$props2 = this.props,
+          styles = _this$props2.styles,
+          makeStyles = _this$props2.makeStyles,
+          props = (0, _objectWithoutProperties2.default)(_this$props2, _excluded);
     return (0, _emotion.jsx)(_FormFieldLayout.FormFieldLayout, Object.assign({}, (0, _omitProps.omitProps)(props, FormFieldGroup.allowedProps), (0, _pickProps.pickProps)(props, _FormFieldLayout.FormFieldLayout.allowedProps), {
       vAlign: props.vAlign,
       layout: props.layout === 'inline' ? 'inline' : 'stacked',
       label: props.description,
       "aria-disabled": props.disabled ? 'true' : null,
-      "aria-invalid": this.invalid ? 'true' : null
+      "aria-invalid": this.invalid ? 'true' : null,
+      elementRef: this.handleRef
     }), this.renderFields());
   }
 

package/lib/FormFieldGroup/props.js

@@ -60,8 +60,9 @@ const propTypes = {
   rowSpacing: _propTypes.default.oneOf(['none', 'small', 'medium', 'large']),
   colSpacing: _propTypes.default.oneOf(['none', 'small', 'medium', 'large']),
   vAlign: _propTypes.default.oneOf(['top', 'middle', 'bottom']),
-  startAt: _propTypes.default.oneOf(['small', 'medium', 'large', 'x-large', null])
+  startAt: _propTypes.default.oneOf(['small', 'medium', 'large', 'x-large', null]),
+  elementRef: _propTypes.default.func
 };
 exports.propTypes = propTypes;
-const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt'];
+const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt', 'elementRef'];
 exports.allowedProps = allowedProps;

package/lib/FormFieldLabel/index.js

@@ -40,6 +40,15 @@ example: true
 
 **/
 let FormFieldLabel = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class FormFieldLabel extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -54,7 +63,8 @@ let FormFieldLabel = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
           styles = _this$props.styles,
           children = _this$props.children;
     return (0, _emotion.jsx)(ElementType, Object.assign({}, (0, _omitProps.omitProps)(this.props, FormFieldLabel.allowedProps), {
-      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLabel
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLabel,
+      ref: this.handleRef
     }), children);
   }
 

package/lib/FormFieldLayout/index.js

@@ -49,6 +49,14 @@ parent: FormField
 let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_class = (_temp = _class2 = class FormFieldLayout extends _react.Component {
   constructor(props) {
     super(props);
+    this.ref = null;
+
+    this.handleRef = el => {
+      var _this$props$elementRe, _this$props;
+
+      this.ref = el;
+      (_this$props$elementRe = (_this$props = this.props).elementRef) === null || _this$props$elementRe === void 0 ? void 0 : _this$props$elementRe.call(_this$props, el);
+    };
 
     this.handleInputContainerRef = node => {
       if (this.props.inputContainerRef) {
@@ -124,10 +132,10 @@ let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _d
 
   render() {
     const ElementType = this.elementType;
-    const _this$props = this.props,
-          makeStyles = _this$props.makeStyles,
-          styles = _this$props.styles,
-          props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    const _this$props2 = this.props,
+          makeStyles = _this$props2.makeStyles,
+          styles = _this$props2.styles,
+          props = (0, _objectWithoutProperties2.default)(_this$props2, _excluded);
     const width = props.width,
           layout = props.layout,
           children = props.children;
@@ -136,7 +144,8 @@ let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _d
       style: {
         width
       },
-      "aria-describedby": this.hasMessages ? this._messagesId : null
+      "aria-describedby": this.hasMessages ? this._messagesId : null,
+      ref: this.handleRef
     }), this.elementType === 'fieldset' && this.renderLegend(), (0, _emotion.jsx)(_Grid.Grid, Object.assign({
       rowSpacing: "small",
       colSpacing: "small",

package/lib/FormFieldLayout/props.js

@@ -64,8 +64,9 @@ const propTypes = {
   layout: _propTypes.default.oneOf(['stacked', 'inline']),
   labelAlign: _propTypes.default.oneOf(['start', 'end']),
   width: _propTypes.default.string,
-  inputContainerRef: _propTypes.default.func
+  inputContainerRef: _propTypes.default.func,
+  elementRef: _propTypes.default.func
 };
 exports.propTypes = propTypes;
-const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef'];
+const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef', 'elementRef'];
 exports.allowedProps = allowedProps;

package/lib/FormFieldMessage/index.js

@@ -37,6 +37,15 @@ example: true
 ```
 **/
 let FormFieldMessage = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class FormFieldMessage extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -50,8 +59,11 @@ let FormFieldMessage = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.d
           children = _this$props.children,
           styles = _this$props.styles;
     return this.props.variant !== 'screenreader-only' ? (0, _emotion.jsx)("span", {
-      css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessage
-    }, children) : (0, _emotion.jsx)(_ScreenReaderContent.ScreenReaderContent, null, children);
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessage,
+      ref: this.handleRef
+    }, children) : (0, _emotion.jsx)(_ScreenReaderContent.ScreenReaderContent, {
+      elementRef: this.handleRef
+    }, children);
   }
 
 }, _class2.displayName = "FormFieldMessage", _class2.componentId = 'FormFieldMessage', _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {

package/lib/FormFieldMessages/index.js

@@ -42,6 +42,15 @@ example: true
 ```
 **/
 let FormFieldMessages = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class FormFieldMessages extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+
+    this.handleRef = el => {
+      this.ref = el;
+    };
+  }
+
   componentDidMount() {
     this.props.makeStyles();
   }
@@ -56,7 +65,9 @@ let FormFieldMessages = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.
           styles = _this$props.styles;
     return messages && messages.length > 0 ? (0, _emotion.jsx)("span", Object.assign({
       css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessages
-    }, (0, _omitProps.omitProps)(this.props, FormFieldMessages.allowedProps)), messages.map((msg, i) => {
+    }, (0, _omitProps.omitProps)(this.props, FormFieldMessages.allowedProps), {
+      ref: this.handleRef
+    }), messages.map((msg, i) => {
       return (0, _emotion.jsx)("span", {
         key: `error${i}`,
         css: styles === null || styles === void 0 ? void 0 : styles.message

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-form-field",
-  "version": "8.10.1-snapshot.9+93b506fe0",
+  "version": "8.10.3-snapshot.2+ccdf8f43b",
   "description": "Form layout components.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "type": "commonjs",
@@ -24,22 +24,22 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-test-utils": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-themes": "8.10.1-snapshot.9+93b506fe0"
+    "@instructure/ui-babel-preset": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-test-utils": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-themes": "8.10.3-snapshot.2+ccdf8f43b"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/emotion": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/shared-types": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-a11y-content": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-a11y-utils": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-grid": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-icons": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-react-utils": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/ui-utils": "8.10.1-snapshot.9+93b506fe0",
-    "@instructure/uid": "8.10.1-snapshot.9+93b506fe0",
+    "@instructure/console": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/emotion": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/shared-types": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-a11y-content": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-a11y-utils": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-grid": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-icons": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-react-utils": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/ui-utils": "8.10.3-snapshot.2+ccdf8f43b",
+    "@instructure/uid": "8.10.3-snapshot.2+ccdf8f43b",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -48,5 +48,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "93b506fe0860718ebe2cc2729fd023e3e7489231"
+  "gitHead": "ccdf8f43b56a8edef32600281692dfeb436d5a01"
 }

package/src/FormField/index.tsx

@@ -49,6 +49,13 @@ class FormField extends Component<FormFieldProps> {
     children: null
   }
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+    this.props.elementRef?.(el)
+  }
+
   render() {
     return (
       <FormFieldLayout
@@ -58,6 +65,7 @@ class FormField extends Component<FormFieldProps> {
         vAlign={this.props.vAlign}
         as="label"
         htmlFor={this.props.id}
+        elementRef={this.handleRef}
       />
     )
   }

package/src/FormField/props.ts

@@ -42,6 +42,7 @@ type FormFieldOwnProps = {
   vAlign?: 'top' | 'middle' | 'bottom'
   width?: string
   inputContainerRef?: (...args: any[]) => any
+  elementRef?: (element: Element | null) => void
 }
 
 type PropKeys = keyof FormFieldOwnProps
@@ -70,7 +71,8 @@ const propTypes: PropValidators<PropKeys> = {
   labelAlign: PropTypes.oneOf(['start', 'end']),
   vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
   width: PropTypes.string,
-  inputContainerRef: PropTypes.func
+  inputContainerRef: PropTypes.func,
+  elementRef: PropTypes.func
 }
 
 const allowedProps: AllowedPropKeys = [
@@ -84,7 +86,8 @@ const allowedProps: AllowedPropKeys = [
   'labelAlign',
   'vAlign',
   'width',
-  'inputContainerRef'
+  'inputContainerRef',
+  'elementRef'
 ]
 
 export type { FormFieldProps }

package/src/FormFieldGroup/index.tsx

@@ -57,6 +57,13 @@ class FormFieldGroup extends Component<FormFieldGroupProps> {
     vAlign: 'middle'
   }
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+    this.props.elementRef?.(el)
+  }
+
   componentDidMount() {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     this.props.makeStyles(this.makeStylesVariables)
@@ -134,6 +141,7 @@ class FormFieldGroup extends Component<FormFieldGroupProps> {
         label={props.description}
         aria-disabled={props.disabled ? 'true' : null}
         aria-invalid={this.invalid ? 'true' : null}
+        elementRef={this.handleRef}
       >
         {this.renderFields()}
       </FormFieldLayout>

package/src/FormFieldGroup/props.ts

@@ -46,6 +46,7 @@ type FormFieldGroupOwnProps = {
   colSpacing?: 'none' | 'small' | 'medium' | 'large'
   vAlign?: 'top' | 'middle' | 'bottom'
   startAt?: any // TODO: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null])
+  elementRef?: (element: Element | null) => void
 }
 
 type FormFieldGroupStyleProps = {
@@ -84,7 +85,8 @@ const propTypes: PropValidators<PropKeys> = {
   rowSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
   colSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
   vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
-  startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null])
+  startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null]),
+  elementRef: PropTypes.func
 }
 
 const allowedProps: AllowedPropKeys = [
@@ -98,7 +100,8 @@ const allowedProps: AllowedPropKeys = [
   'rowSpacing',
   'colSpacing',
   'vAlign',
-  'startAt'
+  'startAt',
+  'elementRef'
 ]
 
 export type {

package/src/FormFieldLabel/index.tsx

@@ -60,6 +60,12 @@ class FormFieldLabel extends Component<FormFieldLabelProps> {
     as: 'span'
   } as const
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+  }
+
   componentDidMount() {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     this.props.makeStyles()
@@ -78,8 +84,10 @@ class FormFieldLabel extends Component<FormFieldLabelProps> {
 
     return (
       <ElementType
+        // @ts-expect-error TODO: `ref` prop causes: "Expression produces a union type that is too complex to represent.ts(2590)"
         {...omitProps(this.props, FormFieldLabel.allowedProps)}
         css={styles?.formFieldLabel}
+        ref={this.handleRef}
       >
         {children}
       </ElementType>

package/src/FormFieldLayout/index.tsx

@@ -81,6 +81,13 @@ class FormFieldLayout extends Component<FormFieldLayoutProps> {
     )
   }
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+    this.props.elementRef?.(el)
+  }
+
   componentDidMount() {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     this.props.makeStyles()
@@ -185,6 +192,7 @@ class FormFieldLayout extends Component<FormFieldLayoutProps> {
         style={{ width }}
         // @ts-expect-error ts-migrate(2339) FIXME: Property '_messagesId' does not exist on type 'For... Remove this comment to see the full error message
         aria-describedby={this.hasMessages ? this._messagesId : null}
+        ref={this.handleRef}
       >
         {this.elementType === 'fieldset' && this.renderLegend()}
         <Grid

package/src/FormFieldLayout/props.ts

@@ -42,6 +42,7 @@ type FormFieldLayoutOwnProps = {
   labelAlign?: 'start' | 'end'
   width?: string
   inputContainerRef?: (...args: any[]) => any
+  elementRef?: (element: Element | null) => void
 }
 
 type PropKeys = keyof FormFieldLayoutOwnProps
@@ -79,7 +80,8 @@ const propTypes: PropValidators<PropKeys> = {
   layout: PropTypes.oneOf(['stacked', 'inline']),
   labelAlign: PropTypes.oneOf(['start', 'end']),
   width: PropTypes.string,
-  inputContainerRef: PropTypes.func
+  inputContainerRef: PropTypes.func,
+  elementRef: PropTypes.func
 }
 
 const allowedProps: AllowedPropKeys = [
@@ -93,7 +95,8 @@ const allowedProps: AllowedPropKeys = [
   'layout',
   'labelAlign',
   'width',
-  'inputContainerRef'
+  'inputContainerRef',
+  'elementRef'
 ]
 
 export type { FormFieldLayoutProps, FormFieldLayoutStyle }

package/src/FormFieldMessage/index.tsx

@@ -61,6 +61,12 @@ class FormFieldMessage extends Component<FormFieldMessageProps> {
     children: null
   }
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+  }
+
   componentDidMount() {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     this.props.makeStyles()
@@ -76,9 +82,13 @@ class FormFieldMessage extends Component<FormFieldMessageProps> {
     const { children, styles } = this.props
 
     return this.props.variant !== 'screenreader-only' ? (
-      <span css={styles?.formFieldMessage}>{children}</span>
+      <span css={styles?.formFieldMessage} ref={this.handleRef}>
+        {children}
+      </span>
     ) : (
-      <ScreenReaderContent>{children}</ScreenReaderContent>
+      <ScreenReaderContent elementRef={this.handleRef}>
+        {children}
+      </ScreenReaderContent>
     )
   }
 }

package/src/FormFieldMessages/index.tsx

@@ -63,6 +63,12 @@ class FormFieldMessages extends Component<FormFieldMessagesProps> {
   static allowedProps = allowedProps
   static defaultProps = {}
 
+  ref: Element | null = null
+
+  handleRef = (el: Element | null) => {
+    this.ref = el
+  }
+
   componentDidMount() {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     this.props.makeStyles()
@@ -81,6 +87,7 @@ class FormFieldMessages extends Component<FormFieldMessagesProps> {
       <span
         css={styles?.formFieldMessages}
         {...omitProps(this.props, FormFieldMessages.allowedProps)}
+        ref={this.handleRef}
       >
         {messages.map((msg, i) => {
           return (

package/types/FormField/index.d.ts

@@ -19,6 +19,7 @@ declare class FormField extends Component<FormFieldProps> {
         vAlign?: "middle" | "bottom" | "top" | undefined;
         width?: string | undefined;
         inputContainerRef?: ((...args: any[]) => any) | undefined;
+        elementRef?: ((element: Element | null) => void) | undefined;
     }>;
     static allowedProps: readonly (keyof {
         label: React.ReactNode;
@@ -32,6 +33,7 @@ declare class FormField extends Component<FormFieldProps> {
         vAlign?: "middle" | "bottom" | "top" | undefined;
         width?: string | undefined;
         inputContainerRef?: ((...args: any[]) => any) | undefined;
+        elementRef?: ((element: Element | null) => void) | undefined;
     })[];
     static defaultProps: {
         inline: boolean;
@@ -40,6 +42,8 @@ declare class FormField extends Component<FormFieldProps> {
         vAlign: string;
         children: null;
     };
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     render(): JSX.Element;
 }
 export default FormField;

package/types/FormField/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormField/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;GAIG;AACH,cAAM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,MAAM,CAAC,SAAS;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMlB;IAED,MAAM;CAYP;AAED,eAAe,SAAS,CAAA;AACxB,OAAO,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormField/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;GAIG;AACH,cAAM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAG9B;IAED,MAAM;CAaP;AAED,eAAe,SAAS,CAAA;AACxB,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/types/FormField/props.d.ts

@@ -13,6 +13,7 @@ declare type FormFieldOwnProps = {
     vAlign?: 'top' | 'middle' | 'bottom';
     width?: string;
     inputContainerRef?: (...args: any[]) => any;
+    elementRef?: (element: Element | null) => void;
 };
 declare type PropKeys = keyof FormFieldOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;

package/types/FormField/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormField/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,iBAAiB,GAAG;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;CAC5C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,CAAA;AAEvC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAqBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAYnB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormField/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,iBAAiB,GAAG;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAC3C,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,CAAA;AAEvC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAsBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/FormFieldGroup/index.d.ts

@@ -21,6 +21,7 @@ declare class FormFieldGroup extends Component<FormFieldGroupProps> {
         colSpacing?: "small" | "none" | "medium" | "large" | undefined;
         vAlign?: "middle" | "bottom" | "top" | undefined;
         startAt?: any;
+        elementRef?: ((element: Element | null) => void) | undefined;
     }>;
     static allowedProps: readonly (keyof {
         description: import("react").ReactNode;
@@ -34,6 +35,7 @@ declare class FormFieldGroup extends Component<FormFieldGroupProps> {
         colSpacing?: "small" | "none" | "medium" | "large" | undefined;
         vAlign?: "middle" | "bottom" | "top" | undefined;
         startAt?: any;
+        elementRef?: ((element: Element | null) => void) | undefined;
     })[];
     static defaultProps: {
         children: null;
@@ -43,6 +45,8 @@ declare class FormFieldGroup extends Component<FormFieldGroupProps> {
         colSpacing: string;
         vAlign: string;
     };
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     get makeStylesVariables(): FormFieldGroupStyleProps;

package/types/FormFieldGroup/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAA;AAI3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAE5E;;;;GAIG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;MAOlB;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,wBAAwB,CAElD;IAED,IAAI,OAAO,YAOV;IAED,aAAa;IAcb,cAAc;IAgBd,YAAY;IAUZ,MAAM;CAkBP;AAED,eAAe,cAAc,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAA;AAI3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAE5E;;;;GAIG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;MAOlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAG9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,wBAAwB,CAElD;IAED,IAAI,OAAO,YAOV;IAED,aAAa;IAcb,cAAc;IAgBd,YAAY;IAUZ,MAAM;CAmBP;AAED,eAAe,cAAc,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/types/FormFieldGroup/props.d.ts

@@ -14,6 +14,7 @@ declare type FormFieldGroupOwnProps = {
     colSpacing?: 'none' | 'small' | 'medium' | 'large';
     vAlign?: 'top' | 'middle' | 'bottom';
     startAt?: any;
+    elementRef?: (element: Element | null) => void;
 };
 declare type FormFieldGroupStyleProps = {
     invalid: boolean;

package/types/FormFieldGroup/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,sBAAsB,GAAG;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACzC,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,OAAO,CAAC,EAAE,GAAG,CAAA;CACd,CAAA;AAED,aAAK,wBAAwB,GAAG;IAC9B,OAAO,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAA;AAE1D,aAAK,mBAAmB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAA;AAE3D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAwBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAYnB,CAAA;AAED,YAAY,EACV,mBAAmB,EACnB,wBAAwB,EACxB,mBAAmB,EACpB,CAAA;AACD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,sBAAsB,GAAG;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACzC,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,OAAO,CAAC,EAAE,GAAG,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,wBAAwB,GAAG;IAC9B,OAAO,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAA;AAE1D,aAAK,mBAAmB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAA;AAE3D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAyBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EACV,mBAAmB,EACnB,wBAAwB,EACxB,mBAAmB,EACpB,CAAA;AACD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/FormFieldLabel/index.d.ts

@@ -31,6 +31,8 @@ declare class FormFieldLabel extends Component<FormFieldLabelProps> {
     static defaultProps: {
         readonly as: "span";
     };
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     render(): jsx.JSX.Element;

package/types/FormFieldLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElD;;;;;;;;;;;;;;;GAeG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;SAAe;IAClC,MAAM,CAAC,YAAY;;MAET;IAEV,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAcP;AAED,eAAe,cAAc,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElD;;;;;;;;;;;;;;;GAeG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;SAAe;IAClC,MAAM,CAAC,YAAY;;MAET;IAEV,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAgBP;AAED,eAAe,cAAc,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/types/FormFieldLayout/index.d.ts

@@ -21,6 +21,7 @@ declare class FormFieldLayout extends Component<FormFieldLayoutProps> {
         labelAlign?: "end" | "start" | undefined;
         width?: string | undefined;
         inputContainerRef?: ((...args: any[]) => any) | undefined;
+        elementRef?: ((element: Element | null) => void) | undefined;
     }>;
     static allowedProps: readonly (keyof {
         label: import("react").ReactNode;
@@ -34,6 +35,7 @@ declare class FormFieldLayout extends Component<FormFieldLayoutProps> {
         labelAlign?: "end" | "start" | undefined;
         width?: string | undefined;
         inputContainerRef?: ((...args: any[]) => any) | undefined;
+        elementRef?: ((element: Element | null) => void) | undefined;
     })[];
     static defaultProps: {
         readonly children: null;
@@ -43,6 +45,8 @@ declare class FormFieldLayout extends Component<FormFieldLayoutProps> {
         readonly labelAlign: "end";
     };
     constructor(props: any);
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     get hasVisibleLabel(): boolean | "" | 0 | null | undefined;

package/types/FormFieldLayout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAajC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,cACM,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAC3D,MAAM,CAAC,QAAQ,CAAC,WAAW,qBAAoB;IAE/C,MAAM,CAAC,SAAS;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMT;gBAGE,KAAK,KAAA;IAejB,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,eAAe,wCAElB;IAED,IAAI,WAAW,wBAEd;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,uBAAuB,wBAG1B;IAGD,uBAAuB,sBAItB;IAED,WAAW;IAsBX,YAAY;IAaZ,qBAAqB;IAkBrB,MAAM;CAwCP;AAED,eAAe,eAAe,CAAA;AAC9B,OAAO,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAajC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,cACM,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAC3D,MAAM,CAAC,QAAQ,CAAC,WAAW,qBAAoB;IAE/C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMT;gBAGE,KAAK,KAAA;IAejB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAG9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,eAAe,wCAElB;IAED,IAAI,WAAW,wBAEd;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,uBAAuB,wBAG1B;IAGD,uBAAuB,sBAItB;IAED,WAAW;IAsBX,YAAY;IAaZ,qBAAqB;IAkBrB,MAAM;CAyCP;AAED,eAAe,eAAe,CAAA;AAC9B,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/types/FormFieldLayout/props.d.ts

@@ -14,6 +14,7 @@ declare type FormFieldLayoutOwnProps = {
     labelAlign?: 'start' | 'end';
     width?: string;
     inputContainerRef?: (...args: any[]) => any;
+    elementRef?: (element: Element | null) => void;
 };
 declare type PropKeys = keyof FormFieldLayoutOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;

package/types/FormFieldLayout/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,uBAAuB,GAAG;IAC7B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;CAC5C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,uBAAuB,CAAA;AAE7C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,oBAAoB,GAAG,uBAAuB,GACjD,cAAc,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAA;AAE5C,aAAK,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA;AAE7D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA2BvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAYnB,CAAA;AAED,YAAY,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,CAAA;AAC1D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,uBAAuB,GAAG;IAC7B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAC3C,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,uBAAuB,CAAA;AAE7C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,oBAAoB,GAAG,uBAAuB,GACjD,cAAc,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAA;AAE5C,aAAK,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA;AAE7D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA4BvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,CAAA;AAC1D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/FormFieldMessage/index.d.ts

@@ -31,6 +31,8 @@ declare class FormFieldMessage extends Component<FormFieldMessageProps> {
         variant: string;
         children: null;
     };
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     render(): jsx.JSX.Element;

package/types/FormFieldMessage/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessage/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD;;;;;;;;;;;;;;GAcG;AACH,cACM,gBAAiB,SAAQ,SAAS,CAAC,qBAAqB,CAAC;IAC7D,MAAM,CAAC,QAAQ,CAAC,WAAW,sBAAqB;IAEhD,MAAM,CAAC,SAAS;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;MAGlB;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CASP;AAED,eAAe,gBAAgB,CAAA;AAC/B,OAAO,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessage/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD;;;;;;;;;;;;;;GAcG;AACH,cACM,gBAAiB,SAAQ,SAAS,CAAC,qBAAqB,CAAC;IAC7D,MAAM,CAAC,QAAQ,CAAC,WAAW,sBAAqB;IAEhD,MAAM,CAAC,SAAS;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;MAGlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAaP;AAED,eAAe,gBAAgB,CAAA;AAC/B,OAAO,EAAE,gBAAgB,EAAE,CAAA"}

package/types/FormFieldMessages/index.d.ts

@@ -25,6 +25,8 @@ declare class FormFieldMessages extends Component<FormFieldMessagesProps> {
     static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<"messages">;
     static allowedProps: readonly "messages"[];
     static defaultProps: {};
+    ref: Element | null;
+    handleRef: (el: Element | null) => void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     render(): jsx.JSX.Element | null;

package/types/FormFieldMessages/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessages/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAErD;;;;;;;;;;;;;;;;;GAiBG;AACH,cACM,iBAAkB,SAAQ,SAAS,CAAC,sBAAsB,CAAC;IAC/D,MAAM,CAAC,QAAQ,CAAC,WAAW,uBAAsB;IAEjD,MAAM,CAAC,SAAS,oFAAY;IAC5B,MAAM,CAAC,YAAY,wBAAe;IAClC,MAAM,CAAC,YAAY,KAAK;IAExB,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAkBP;AAED,eAAe,iBAAiB,CAAA;AAChC,OAAO,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessages/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAErD;;;;;;;;;;;;;;;;;GAiBG;AACH,cACM,iBAAkB,SAAQ,SAAS,CAAC,sBAAsB,CAAC;IAC/D,MAAM,CAAC,QAAQ,CAAC,WAAW,uBAAsB;IAEjD,MAAM,CAAC,SAAS,oFAAY;IAC5B,MAAM,CAAC,YAAY,wBAAe;IAClC,MAAM,CAAC,YAAY,KAAK;IAExB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAE9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,MAAM;CAmBP;AAED,eAAe,iBAAiB,CAAA;AAChC,OAAO,EAAE,iBAAiB,EAAE,CAAA"}