@instructure/ui-form-field 8.8.1-snapshot.3 → 8.9.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [8.9.0](https://github.com/instructure/instructure-ui/compare/v8.8.0...v8.9.0) (2021-09-15)
+
+### Bug Fixes
+
+- fix shared-types TS errors ([7b83164](https://github.com/instructure/instructure-ui/commit/7b83164f4c5872f3a217e010563f59bf584ae4fc))
+
 # [8.8.0](https://github.com/instructure/instructure-ui/compare/v8.7.0...v8.8.0) (2021-08-27)
 
 **Note:** Version bump only for package @instructure/ui-form-field

package/es/FormField/index.js

@@ -22,10 +22,9 @@
  * SOFTWARE.
  */
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import { omitProps, pickProps } from '@instructure/ui-react-utils';
-import { FormPropTypes } from '../FormPropTypes';
 import { FormFieldLayout } from '../FormFieldLayout';
+import { propTypes, allowedProps } from './props';
 
 /**
 ---
@@ -45,40 +44,14 @@ class FormField extends Component {
 
 FormField.displayName = "FormField";
 FormField.componentId = 'FormField';
-FormField.propTypes = {
-  label: PropTypes.node.isRequired,
-
-  /**
-   * the id of the input (to link it to its label for a11y)
-   */
-  id: PropTypes.string.isRequired,
-
-  /**
-   * object with shape: `{
-   *   text: PropTypes.string,
-   *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
-   * }`
-   */
-  messages: PropTypes.arrayOf(FormPropTypes.message),
-  messagesId: PropTypes.string,
-  children: PropTypes.node,
-  inline: PropTypes.bool,
-  layout: PropTypes.oneOf(['stacked', 'inline']),
-  labelAlign: PropTypes.oneOf(['start', 'end']),
-  vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
-  width: PropTypes.string,
-  inputContainerRef: PropTypes.func
-};
+FormField.propTypes = propTypes;
+FormField.allowedProps = allowedProps;
 FormField.defaultProps = {
   inline: false,
   layout: 'stacked',
   labelAlign: 'end',
   vAlign: 'middle',
-  messages: void 0,
-  messagesId: void 0,
-  children: null,
-  width: void 0,
-  inputContainerRef: void 0
+  children: null
 };
 export default FormField;
 export { FormField };

package/es/FormField/props.js

@@ -0,0 +1,51 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import PropTypes from 'prop-types';
+import { FormPropTypes } from '../FormPropTypes';
+const propTypes = {
+  label: PropTypes.node.isRequired,
+
+  /**
+   * the id of the input (to link it to its label for a11y)
+   */
+  id: PropTypes.string.isRequired,
+
+  /**
+   * object with shape: `{
+   *   text: PropTypes.string,
+   *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
+   * }`
+   */
+  messages: PropTypes.arrayOf(FormPropTypes.message),
+  messagesId: PropTypes.string,
+  children: PropTypes.node,
+  inline: PropTypes.bool,
+  layout: PropTypes.oneOf(['stacked', 'inline']),
+  labelAlign: PropTypes.oneOf(['start', 'end']),
+  vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
+  width: PropTypes.string,
+  inputContainerRef: PropTypes.func
+};
+const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef'];
+export { propTypes, allowedProps };

package/es/FormFieldGroup/index.js

@@ -29,14 +29,13 @@ var _dec, _class, _class2, _temp;
 
 /** @jsx jsx */
 import { Component, Children } from 'react';
-import PropTypes from 'prop-types';
 import { Grid } from '@instructure/ui-grid';
 import { pickProps, omitProps } from '@instructure/ui-react-utils';
 import { withStyle, jsx } from '@instructure/emotion';
 import { FormFieldLayout } from '../FormFieldLayout';
-import { FormPropTypes } from '../FormPropTypes';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
+import { propTypes, allowedProps } from './props';
 
 /**
 ---
@@ -86,7 +85,7 @@ let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _
     const styles = this.props.styles;
     return jsx("span", {
       key: "fields",
-      css: styles.formFieldGroup
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldGroup
     }, this.renderChildren());
   }
 
@@ -105,43 +104,8 @@ let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _
     }), this.renderFields());
   }
 
-}, _class2.displayName = "FormFieldGroup", _class2.componentId = 'FormFieldGroup', _class2.propTypes = {
-  // eslint-disable-next-line react/require-default-props
-  makeStyles: PropTypes.func,
-  // eslint-disable-next-line react/require-default-props
-  styles: PropTypes.object,
-  description: PropTypes.node.isRequired,
-
-  /**
-   * the element type to render as
-   */
-  as: PropTypes.elementType,
-
-  /**
-   * object with shape: `{
-   * text: PropTypes.string,
-   * type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
-   *   }`
-   */
-  messages: PropTypes.arrayOf(FormPropTypes.message),
-
-  /**
-   * id for the form field messages
-   */
-  messagesId: PropTypes.string,
-  disabled: PropTypes.bool,
-  children: PropTypes.node,
-  layout: PropTypes.oneOf(['stacked', 'columns', 'inline']),
-  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])
-}, _class2.defaultProps = {
+}, _class2.displayName = "FormFieldGroup", _class2.componentId = 'FormFieldGroup', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
   children: null,
-  layout: void 0,
-  startAt: void 0,
-  messages: void 0,
-  messagesId: void 0,
   as: 'fieldset',
   disabled: false,
   rowSpacing: 'medium',

package/es/FormFieldGroup/props.js

@@ -0,0 +1,55 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import PropTypes from 'prop-types';
+import { FormPropTypes } from '../FormPropTypes';
+const propTypes = {
+  description: PropTypes.node.isRequired,
+
+  /**
+   * the element type to render as
+   */
+  as: PropTypes.elementType,
+
+  /**
+   * object with shape: `{
+   * text: PropTypes.string,
+   * type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
+   *   }`
+   */
+  messages: PropTypes.arrayOf(FormPropTypes.message),
+
+  /**
+   * id for the form field messages
+   */
+  messagesId: PropTypes.string,
+  disabled: PropTypes.bool,
+  children: PropTypes.node,
+  layout: PropTypes.oneOf(['stacked', 'columns', 'inline']),
+  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])
+};
+const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt'];
+export { propTypes, allowedProps };

package/es/FormFieldLabel/index.js

@@ -26,11 +26,11 @@ var _dec, _class, _class2, _temp;
 
 /** @jsx jsx */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { omitProps, getElementType } from '@instructure/ui-react-utils';
 import { withStyle, jsx } from '@instructure/emotion';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
+import { propTypes, allowedProps } from './props';
 
 /**
 ---
@@ -63,18 +63,11 @@ let FormFieldLabel = (_dec = withStyle(generateStyle, generateComponentTheme), _
           styles = _this$props.styles,
           children = _this$props.children;
     return jsx(ElementType, Object.assign({}, omitProps(this.props, FormFieldLabel.propTypes), {
-      css: styles.formFieldLabel
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLabel
     }), children);
   }
 
-}, _class2.displayName = "FormFieldLabel", _class2.componentId = 'FormFieldLabel', _class2.propTypes = {
-  // eslint-disable-next-line react/require-default-props
-  makeStyles: PropTypes.func,
-  // eslint-disable-next-line react/require-default-props
-  styles: PropTypes.object,
-  as: PropTypes.elementType,
-  children: PropTypes.node.isRequired
-}, _class2.defaultProps = {
+}, _class2.displayName = "FormFieldLabel", _class2.componentId = 'FormFieldLabel', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
   as: 'span'
 }, _temp)) || _class);
 export default FormFieldLabel;

package/{src/FormFieldMessage/types.ts → es/FormFieldLabel/props.js}

@@ -21,11 +21,10 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-
-import { FormMessageType } from '../FormPropTypes'
-
-export type FormFieldMessageProps = {
-  makeStyles?: (...args: any[]) => any
-  styles?: any
-  variant?: FormMessageType
-}
+import PropTypes from 'prop-types';
+const propTypes = {
+  as: PropTypes.elementType,
+  children: PropTypes.node.isRequired
+};
+const allowedProps = ['as', 'children'];
+export { propTypes, allowedProps };

package/es/FormFieldLayout/index.js

@@ -29,7 +29,6 @@ var _dec, _class, _class2, _temp;
 
 /** @jsx jsx */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { hasVisibleChildren } from '@instructure/ui-a11y-utils';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
 import { Grid } from '@instructure/ui-grid';
@@ -39,8 +38,8 @@ import { uid } from '@instructure/uid';
 import { withStyle, jsx } from '@instructure/emotion';
 import { FormFieldLabel } from '../FormFieldLabel';
 import { FormFieldMessages } from '../FormFieldMessages';
-import { FormPropTypes } from '../FormPropTypes';
 import generateStyle from './styles';
+import { propTypes, allowedProps } from './props';
 
 /**
 ---
@@ -137,7 +136,7 @@ let FormFieldLayout = (_dec = withStyle(generateStyle), _dec(_class = (_temp = _
     return jsx(ElementType, Object.assign({}, omitProps(props, { ...FormFieldLayout.propTypes,
       ...Grid.propTypes
     }), {
-      css: styles.formFieldLayout,
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldLayout,
       style: {
         width
       },
@@ -152,52 +151,12 @@ let FormFieldLayout = (_dec = withStyle(generateStyle), _dec(_class = (_temp = _
     }, children)), this.renderVisibleMessages()));
   }
 
-}, _class2.displayName = "FormFieldLayout", _class2.componentId = 'FormFieldLayout', _class2.propTypes = {
-  // eslint-disable-next-line react/require-default-props
-  makeStyles: PropTypes.func,
-  // eslint-disable-next-line react/require-default-props
-  styles: PropTypes.object,
-  label: PropTypes.node.isRequired,
-
-  /**
-   * the id of the input (to link it to its label for a11y)
-   */
-  id: PropTypes.string,
-
-  /**
-   * the element type to render as
-   */
-  as: PropTypes.elementType,
-
-  /**
-   * object with shape: `{
-   * text: PropTypes.string,
-   * type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
-   *   }`
-   */
-  messages: PropTypes.arrayOf(FormPropTypes.message),
-
-  /**
-   * id for the form field messages
-   */
-  messagesId: PropTypes.string,
-  children: PropTypes.node,
-  inline: PropTypes.bool,
-  layout: PropTypes.oneOf(['stacked', 'inline']),
-  labelAlign: PropTypes.oneOf(['start', 'end']),
-  width: PropTypes.string,
-  inputContainerRef: PropTypes.func
-}, _class2.defaultProps = {
-  id: void 0,
-  width: void 0,
-  messages: void 0,
-  messagesId: void 0,
+}, _class2.displayName = "FormFieldLayout", _class2.componentId = 'FormFieldLayout', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
   children: null,
   inline: false,
   layout: 'stacked',
   as: 'label',
-  labelAlign: 'end',
-  inputContainerRef: void 0
+  labelAlign: 'end'
 }, _temp)) || _class);
 export default FormFieldLayout;
 export { FormFieldLayout };

package/es/FormFieldLayout/props.js

@@ -0,0 +1,59 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import PropTypes from 'prop-types';
+import { FormPropTypes } from '../FormPropTypes';
+const propTypes = {
+  label: PropTypes.node.isRequired,
+
+  /**
+   * the id of the input (to link it to its label for a11y)
+   */
+  id: PropTypes.string,
+
+  /**
+   * the element type to render as
+   */
+  as: PropTypes.elementType,
+
+  /**
+   * object with shape: `{
+   * text: PropTypes.string,
+   * type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
+   *   }`
+   */
+  messages: PropTypes.arrayOf(FormPropTypes.message),
+
+  /**
+   * id for the form field messages
+   */
+  messagesId: PropTypes.string,
+  children: PropTypes.node,
+  inline: PropTypes.bool,
+  layout: PropTypes.oneOf(['stacked', 'inline']),
+  labelAlign: PropTypes.oneOf(['start', 'end']),
+  width: PropTypes.string,
+  inputContainerRef: PropTypes.func
+};
+const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef'];
+export { propTypes, allowedProps };

package/es/FormFieldMessage/index.js

@@ -26,11 +26,11 @@ var _dec, _class, _class2, _temp;
 
 /** @jsx jsx */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
 import { withStyle, jsx } from '@instructure/emotion';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
+import { propTypes, allowedProps } from './props';
 
 /**
 ---
@@ -61,18 +61,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.formFieldMessage
+      css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessage
     }, children) : jsx(ScreenReaderContent, null, children);
   }
 
-}, _class2.displayName = "FormFieldMessage", _class2.componentId = 'FormFieldMessage', _class2.propTypes = {
-  // eslint-disable-next-line react/require-default-props
-  makeStyles: PropTypes.func,
-  // eslint-disable-next-line react/require-default-props
-  styles: PropTypes.object,
-  variant: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only']),
-  children: PropTypes.node
-}, _class2.defaultProps = {
+}, _class2.displayName = "FormFieldMessage", _class2.componentId = 'FormFieldMessage', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
   variant: 'hint',
   children: null
 }, _temp)) || _class);