@instructure/ui-date-input 8.12.1-snapshot.7 → 8.13.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.13.0](https://github.com/instructure/instructure-ui/compare/v8.12.0...v8.13.0) (2021-12-01)
+
+### Features
+
+- **ui-form-field:** make FormField messages accept `ReactNode` text, not just `string` ([4d36973](https://github.com/instructure/instructure-ui/commit/4d369733414715a70bae0628378e8d82214eab3e))
+
 # [8.12.0](https://github.com/instructure/instructure-ui/compare/v8.11.1...v8.12.0) (2021-11-17)
 
 ### Features

package/es/DateInput/DateInputLocator.js

@@ -30,8 +30,14 @@ import { PopoverLocator } from '@instructure/ui-popover/es/Popover/PopoverLocato
 
 import { DateInput } from './index';
 export const DateInputLocator = locator(DateInput.selector, {
-  findInput: (...args) => locator('input').find(...args),
-  findCalendar: async (element, ...args) => {
+  findInput: function () {
+    return locator('input').find(...arguments);
+  },
+  findCalendar: async function (element) {
+    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      args[_key - 1] = arguments[_key];
+    }
+
     const content = await PopoverLocator.findContent(element, ...args);
     return content ? CalendarLocator.find(content.getDOMNode()) : null;
   }

package/es/DateInput/index.js

@@ -48,8 +48,8 @@ category: components
 ---
 **/
 let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class DateInput extends Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
     this.state = {
       hasInputRef: false
     };
@@ -106,9 +106,8 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
       onRequestHideCalendar(event);
     };
 
-    this.handleHighlightOption = (event, {
-      direction
-    }) => {
+    this.handleHighlightOption = (event, _ref) => {
+      let direction = _ref.direction;
       const _this$props2 = this.props,
             onRequestSelectNextDay = _this$props2.onRequestSelectNextDay,
             onRequestSelectPrevDay = _this$props2.onRequestSelectPrevDay;
@@ -146,7 +145,8 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
     });
   }
 
-  renderMonthNavigationButton(type = 'prev') {
+  renderMonthNavigationButton() {
+    let type = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 'prev';
     const _this$props5 = this.props,
           renderPrevMonthButton = _this$props5.renderPrevMonthButton,
           renderNextMonthButton = _this$props5.renderNextMonthButton;
@@ -156,9 +156,8 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
     });
   }
 
-  renderDays({
-    getOptionProps
-  }) {
+  renderDays(_ref2) {
+    let getOptionProps = _ref2.getOptionProps;
     const children = this.props.children;
     return Children.map(children, day => {
       const _day$props2 = day.props,
@@ -177,10 +176,9 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
     });
   }
 
-  renderCalendar({
-    getListProps,
-    getOptionProps
-  }) {
+  renderCalendar(_ref3) {
+    let getListProps = _ref3.getListProps,
+        getOptionProps = _ref3.getOptionProps;
     const _this$props6 = this.props,
           onRequestRenderNextMonth = _this$props6.onRequestRenderNextMonth,
           onRequestRenderPrevMonth = _this$props6.onRequestRenderPrevMonth,
@@ -198,10 +196,10 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
     }));
   }
 
-  renderInput({
-    getInputProps,
-    getTriggerProps
-  }) {
+  renderInput(_ref4) {
+    let getInputProps = _ref4.getInputProps,
+        getTriggerProps = _ref4.getTriggerProps;
+
     const _this$props7 = this.props,
           renderLabel = _this$props7.renderLabel,
           value = _this$props7.value,
@@ -265,30 +263,31 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
       onRequestSelectOption: this.handleHideCalendar,
       selectedOptionId: selectedDateId,
       highlightedOptionId: selectedDateId
-    }, ({
-      getRootProps,
-      getInputProps,
-      getTriggerProps,
-      getListProps,
-      getOptionProps,
-      getDescriptionProps
-    }) => jsx("span", getRootProps({
-      css: styles === null || styles === void 0 ? void 0 : styles.dateInput
-    }), this.renderInput({
-      getInputProps,
-      getTriggerProps
-    }), jsx("span", Object.assign({}, getDescriptionProps(), {
-      css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
-    }), assistiveText), jsx(Popover, {
-      placement: placement,
-      isShowingContent: isShowingCalendar,
-      positionTarget: this._input,
-      shouldReturnFocus: false,
-      shouldFocusContentOnTriggerBlur: true
-    }, this.renderCalendar({
-      getListProps,
-      getOptionProps
-    }))));
+    }, _ref5 => {
+      let getRootProps = _ref5.getRootProps,
+          getInputProps = _ref5.getInputProps,
+          getTriggerProps = _ref5.getTriggerProps,
+          getListProps = _ref5.getListProps,
+          getOptionProps = _ref5.getOptionProps,
+          getDescriptionProps = _ref5.getDescriptionProps;
+      return jsx("span", getRootProps({
+        css: styles === null || styles === void 0 ? void 0 : styles.dateInput
+      }), this.renderInput({
+        getInputProps,
+        getTriggerProps
+      }), jsx("span", Object.assign({}, getDescriptionProps(), {
+        css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
+      }), assistiveText), jsx(Popover, {
+        placement: placement,
+        isShowingContent: isShowingCalendar,
+        positionTarget: this._input,
+        shouldReturnFocus: false,
+        shouldFocusContentOnTriggerBlur: true
+      }, this.renderCalendar({
+        getListProps,
+        getOptionProps
+      })));
+    });
   }
 
 }, _class2.displayName = "DateInput", _class2.componentId = 'DateInput', _class2.Day = Calendar.Day, _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {

package/es/DateInput/props.js

@@ -111,7 +111,7 @@ const propTypes = {
    * Displays messages and validation for the input. It should be an object
    * with the following shape:
    * `{
-   *   text: PropTypes.string,
+   *   text: PropTypes.node,
    *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
    * }`
    */

package/lib/DateInput/DateInputLocator.js

@@ -41,8 +41,14 @@ var _index = require("./index");
 
 /* eslint-enable no-restricted-imports */
 const DateInputLocator = (0, _locator.locator)(_index.DateInput.selector, {
-  findInput: (...args) => (0, _locator.locator)('input').find(...args),
-  findCalendar: async (element, ...args) => {
+  findInput: function () {
+    return (0, _locator.locator)('input').find(...arguments);
+  },
+  findCalendar: async function (element) {
+    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      args[_key - 1] = arguments[_key];
+    }
+
     const content = await _PopoverLocator.PopoverLocator.findContent(element, ...args);
     return content ? _CalendarLocator.CalendarLocator.find(content.getDOMNode()) : null;
   }

package/lib/DateInput/index.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DateInput = exports.default = void 0;
+exports.default = exports.DateInput = void 0;
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
@@ -50,8 +50,8 @@ category: components
 ---
 **/
 let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class DateInput extends _react.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
     this.state = {
       hasInputRef: false
     };
@@ -108,9 +108,8 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
       onRequestHideCalendar(event);
     };
 
-    this.handleHighlightOption = (event, {
-      direction
-    }) => {
+    this.handleHighlightOption = (event, _ref) => {
+      let direction = _ref.direction;
       const _this$props2 = this.props,
             onRequestSelectNextDay = _this$props2.onRequestSelectNextDay,
             onRequestSelectPrevDay = _this$props2.onRequestSelectPrevDay;
@@ -150,7 +149,8 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
     });
   }
 
-  renderMonthNavigationButton(type = 'prev') {
+  renderMonthNavigationButton() {
+    let type = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 'prev';
     const _this$props5 = this.props,
           renderPrevMonthButton = _this$props5.renderPrevMonthButton,
           renderNextMonthButton = _this$props5.renderNextMonthButton;
@@ -160,9 +160,8 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
     });
   }
 
-  renderDays({
-    getOptionProps
-  }) {
+  renderDays(_ref2) {
+    let getOptionProps = _ref2.getOptionProps;
     const children = this.props.children;
     return _react.Children.map(children, day => {
       const _day$props2 = day.props,
@@ -181,10 +180,9 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
     });
   }
 
-  renderCalendar({
-    getListProps,
-    getOptionProps
-  }) {
+  renderCalendar(_ref3) {
+    let getListProps = _ref3.getListProps,
+        getOptionProps = _ref3.getOptionProps;
     const _this$props6 = this.props,
           onRequestRenderNextMonth = _this$props6.onRequestRenderNextMonth,
           onRequestRenderPrevMonth = _this$props6.onRequestRenderPrevMonth,
@@ -202,10 +200,9 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
     }));
   }
 
-  renderInput({
-    getInputProps,
-    getTriggerProps
-  }) {
+  renderInput(_ref4) {
+    let getInputProps = _ref4.getInputProps,
+        getTriggerProps = _ref4.getTriggerProps;
     const _this$props7 = this.props,
           renderLabel = _this$props7.renderLabel,
           value = _this$props7.value,
@@ -268,30 +265,31 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
       onRequestSelectOption: this.handleHideCalendar,
       selectedOptionId: selectedDateId,
       highlightedOptionId: selectedDateId
-    }, ({
-      getRootProps,
-      getInputProps,
-      getTriggerProps,
-      getListProps,
-      getOptionProps,
-      getDescriptionProps
-    }) => (0, _emotion.jsx)("span", getRootProps({
-      css: styles === null || styles === void 0 ? void 0 : styles.dateInput
-    }), this.renderInput({
-      getInputProps,
-      getTriggerProps
-    }), (0, _emotion.jsx)("span", Object.assign({}, getDescriptionProps(), {
-      css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
-    }), assistiveText), (0, _emotion.jsx)(_Popover.Popover, {
-      placement: placement,
-      isShowingContent: isShowingCalendar,
-      positionTarget: this._input,
-      shouldReturnFocus: false,
-      shouldFocusContentOnTriggerBlur: true
-    }, this.renderCalendar({
-      getListProps,
-      getOptionProps
-    }))));
+    }, _ref5 => {
+      let getRootProps = _ref5.getRootProps,
+          getInputProps = _ref5.getInputProps,
+          getTriggerProps = _ref5.getTriggerProps,
+          getListProps = _ref5.getListProps,
+          getOptionProps = _ref5.getOptionProps,
+          getDescriptionProps = _ref5.getDescriptionProps;
+      return (0, _emotion.jsx)("span", getRootProps({
+        css: styles === null || styles === void 0 ? void 0 : styles.dateInput
+      }), this.renderInput({
+        getInputProps,
+        getTriggerProps
+      }), (0, _emotion.jsx)("span", Object.assign({}, getDescriptionProps(), {
+        css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
+      }), assistiveText), (0, _emotion.jsx)(_Popover.Popover, {
+        placement: placement,
+        isShowingContent: isShowingCalendar,
+        positionTarget: this._input,
+        shouldReturnFocus: false,
+        shouldFocusContentOnTriggerBlur: true
+      }, this.renderCalendar({
+        getListProps,
+        getOptionProps
+      })));
+    });
   }
 
 }, _class2.displayName = "DateInput", _class2.componentId = 'DateInput', _class2.Day = _Calendar.Calendar.Day, _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.defaultProps = {

package/lib/DateInput/props.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.allowedProps = exports.propTypes = void 0;
+exports.propTypes = exports.allowedProps = void 0;
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -127,7 +127,7 @@ const propTypes = {
    * Displays messages and validation for the input. It should be an object
    * with the following shape:
    * `{
-   *   text: PropTypes.string,
+   *   text: PropTypes.node,
    *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
    * }`
    */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-date-input",
-  "version": "8.12.1-snapshot.7+1e7ac8219",
+  "version": "8.13.0",
   "description": "A UI component library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "type": "commonjs",
@@ -24,24 +24,24 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-test-locator": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-test-utils": "8.12.1-snapshot.7+1e7ac8219"
+    "@instructure/ui-babel-preset": "8.13.0",
+    "@instructure/ui-test-locator": "8.13.0",
+    "@instructure/ui-test-utils": "8.13.0"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/emotion": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-calendar": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-form-field": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-icons": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-popover": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-position": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-prop-types": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-react-utils": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-selectable": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-testable": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-text-input": "8.12.1-snapshot.7+1e7ac8219",
-    "@instructure/ui-utils": "8.12.1-snapshot.7+1e7ac8219",
+    "@instructure/emotion": "8.13.0",
+    "@instructure/ui-calendar": "8.13.0",
+    "@instructure/ui-form-field": "8.13.0",
+    "@instructure/ui-icons": "8.13.0",
+    "@instructure/ui-popover": "8.13.0",
+    "@instructure/ui-position": "8.13.0",
+    "@instructure/ui-prop-types": "8.13.0",
+    "@instructure/ui-react-utils": "8.13.0",
+    "@instructure/ui-selectable": "8.13.0",
+    "@instructure/ui-testable": "8.13.0",
+    "@instructure/ui-text-input": "8.13.0",
+    "@instructure/ui-utils": "8.13.0",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -50,6 +50,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false,
-  "gitHead": "1e7ac821932a91fe9ef761c96f747c7ea1f3925a"
+  "sideEffects": false
 }

package/src/DateInput/props.ts

@@ -154,7 +154,7 @@ const propTypes: PropValidators<PropKeys> = {
    * Displays messages and validation for the input. It should be an object
    * with the following shape:
    * `{
-   *   text: PropTypes.string,
+   *   text: PropTypes.node,
    *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
    * }`
    */

package/types/DateInput/index.d.ts

@@ -25,7 +25,7 @@ declare class DateInput extends Component<DateInputProps> {
         width?: string | undefined;
         display?: "inline-block" | "block" | undefined;
         inputRef?: ((...args: any[]) => any) | undefined;
-        messages?: import("@instructure/ui-form-field").FormMessage[] | undefined;
+        messages?: import("@instructure/ui-form-field/types/FormPropTypes").FormMessage[] | undefined;
         placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
         isShowingCalendar?: boolean | undefined;
         onRequestValidateDate?: ((...args: any[]) => any) | undefined;
@@ -56,7 +56,7 @@ declare class DateInput extends Component<DateInputProps> {
         width?: string | undefined;
         display?: "inline-block" | "block" | undefined;
         inputRef?: ((...args: any[]) => any) | undefined;
-        messages?: import("@instructure/ui-form-field").FormMessage[] | undefined;
+        messages?: import("@instructure/ui-form-field/types/FormPropTypes").FormMessage[] | undefined;
         placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
         isShowingCalendar?: boolean | undefined;
         onRequestValidateDate?: ((...args: any[]) => any) | undefined;

package/LICENSE.md

@@ -1,27 +0,0 @@
----
-title: The MIT License (MIT)
-category: Getting Started
-order: 9
----
-
-# The MIT License (MIT)
-
-Copyright (c) 2015 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.