@instructure/ui-date-input 10.16.1-snapshot-0 → 10.16.1

package/lib/DateInput/index.js

@@ -1,13 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.DateInput = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _Calendar = require("@instructure/ui-calendar/lib/Calendar");
 var _IconCalendarMonthLine = require("@instructure/ui-icons/lib/IconCalendarMonthLine.js");
 var _Popover = require("@instructure/ui-popover/lib/Popover");
@@ -24,6 +23,7 @@ var _Locale = require("@instructure/ui-i18n/lib/Locale.js");
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles"));
 var _props2 = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const _excluded = ["renderLabel", "value", "placeholder", "onBlur", "isRequired", "size", "isInline", "layout", "width", "onRequestValidateDate", "onRequestShowCalendar", "onRequestHideCalendar", "onRequestSelectNextDay", "onRequestSelectPrevDay", "onRequestRenderNextMonth", "onRequestRenderPrevMonth"],
   _excluded2 = ["ref"];
 var _dec, _dec2, _class, _DateInput, _IconCalendarMonthLin;
@@ -50,7 +50,6 @@ var _dec, _dec2, _class, _DateInput, _IconCalendarMonthLin;
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-/** @jsx jsx */
 /**
 ---
 category: components
@@ -282,14 +281,18 @@ let DateInput = exports.DateInput = (_dec = (0, _emotion.withStyle)(_styles.defa
         this.handleHideCalendar(e, dateString);
       }
     };
-    return (0, _emotion.jsx)(_Calendar.Calendar, Object.assign({}, getListProps({
-      onRequestRenderNextMonth,
-      onRequestRenderPrevMonth,
-      renderNavigationLabel,
-      renderWeekdayLabels,
-      renderNextMonthButton: this.renderMonthNavigationButton('next'),
-      renderPrevMonthButton: this.renderMonthNavigationButton('prev')
-    }), noChildrenProps), this.renderDays(getOptionProps));
+    return (0, _jsxRuntime.jsx)(_Calendar.Calendar, {
+      ...getListProps({
+        onRequestRenderNextMonth,
+        onRequestRenderPrevMonth,
+        renderNavigationLabel,
+        renderWeekdayLabels,
+        renderNextMonthButton: this.renderMonthNavigationButton('next'),
+        renderPrevMonthButton: this.renderMonthNavigationButton('prev')
+      }),
+      ...noChildrenProps,
+      children: this.renderDays(getOptionProps)
+    });
   }
   renderInput({
     getInputProps,
@@ -318,24 +321,27 @@ let DateInput = exports.DateInput = (_dec = (0, _emotion.withStyle)(_styles.defa
       ref = _getTriggerProps.ref,
       triggerProps = (0, _objectWithoutProperties2.default)(_getTriggerProps, _excluded2);
     const messages = this.props.messages || this.state.messages;
-    return (0, _emotion.jsx)(_TextInput.TextInput, Object.assign({}, triggerProps, (0, _passthroughProps.passthroughProps)(rest), getInputProps({
-      renderLabel: (0, _callRenderProp.callRenderProp)(renderLabel),
-      value,
-      placeholder,
-      size,
-      layout,
-      width,
-      messages,
-      onChange: this.handleInputChange,
-      onBlur: (0, _createChainedFunction.createChainedFunction)(onBlur, this.handleHideCalendar),
-      inputRef: (0, _createChainedFunction.createChainedFunction)(ref, this.handleInputRef),
-      interaction,
-      isRequired,
-      display: isInline ? 'inline-block' : 'block',
-      renderAfterInput: _IconCalendarMonthLin || (_IconCalendarMonthLin = (0, _emotion.jsx)(_IconCalendarMonthLine.IconCalendarMonthLine, {
-        inline: false
-      }))
-    }), {
+    return (0, _jsxRuntime.jsx)(_TextInput.TextInput, {
+      ...triggerProps,
+      ...(0, _passthroughProps.passthroughProps)(rest),
+      ...getInputProps({
+        renderLabel: (0, _callRenderProp.callRenderProp)(renderLabel),
+        value,
+        placeholder,
+        size,
+        layout,
+        width,
+        messages,
+        onChange: this.handleInputChange,
+        onBlur: (0, _createChainedFunction.createChainedFunction)(onBlur, this.handleHideCalendar),
+        inputRef: (0, _createChainedFunction.createChainedFunction)(ref, this.handleInputRef),
+        interaction,
+        isRequired,
+        display: isInline ? 'inline-block' : 'block',
+        renderAfterInput: _IconCalendarMonthLin || (_IconCalendarMonthLin = (0, _jsxRuntime.jsx)(_IconCalendarMonthLine.IconCalendarMonthLine, {
+          inline: false
+        }))
+      }),
       onKeyDown: e => {
         var _triggerProps$onKeyDo;
         if (!this.props.children) {
@@ -346,7 +352,7 @@ let DateInput = exports.DateInput = (_dec = (0, _emotion.withStyle)(_styles.defa
         }
         (_triggerProps$onKeyDo = triggerProps.onKeyDown) === null || _triggerProps$onKeyDo === void 0 ? void 0 : _triggerProps$onKeyDo.call(triggerProps, e);
       }
-    }));
+    });
   }
   render() {
     const _this$props13 = this.props,
@@ -354,40 +360,46 @@ let DateInput = exports.DateInput = (_dec = (0, _emotion.withStyle)(_styles.defa
       assistiveText = _this$props13.assistiveText,
       styles = _this$props13.styles;
     const isShowingCalendar = this.shouldShowCalendar();
-    return (0, _emotion.jsx)(_Selectable.Selectable, {
+    return (0, _jsxRuntime.jsx)(_Selectable.Selectable, {
       isShowingOptions: isShowingCalendar,
       onRequestShowOptions: this.handleShowCalendar,
       onRequestHideOptions: this.handleHideCalendar,
       onRequestHighlightOption: this.handleHighlightOption,
       onRequestSelectOption: e => this.handleHideCalendar(e),
       selectedOptionId: this.selectedDateId,
-      highlightedOptionId: this.selectedDateId
-    }, ({
-      getRootProps,
-      getInputProps,
-      getTriggerProps,
-      getListProps,
-      getOptionProps,
-      getDescriptionProps
-    }) => (0, _emotion.jsx)("span", Object.assign({}, getRootProps({
-      css: styles === null || styles === void 0 ? void 0 : styles.dateInput
-    }), {
-      ref: el => this.ref = el
-    }), 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
-    }))));
+      highlightedOptionId: this.selectedDateId,
+      children: ({
+        getRootProps,
+        getInputProps,
+        getTriggerProps,
+        getListProps,
+        getOptionProps,
+        getDescriptionProps
+      }) => (0, _jsxRuntime.jsxs)("span", {
+        ...getRootProps({
+          css: styles === null || styles === void 0 ? void 0 : styles.dateInput
+        }),
+        ref: el => this.ref = el,
+        children: [this.renderInput({
+          getInputProps,
+          getTriggerProps
+        }), (0, _jsxRuntime.jsx)("span", {
+          ...getDescriptionProps(),
+          css: styles === null || styles === void 0 ? void 0 : styles.assistiveText,
+          children: assistiveText
+        }), (0, _jsxRuntime.jsx)(_Popover.Popover, {
+          placement: placement,
+          isShowingContent: isShowingCalendar,
+          positionTarget: this._input,
+          shouldReturnFocus: false,
+          shouldFocusContentOnTriggerBlur: true,
+          children: this.renderCalendar({
+            getListProps,
+            getOptionProps
+          })
+        })]
+      })
+    });
   }
 }, _DateInput.displayName = "DateInput", _DateInput.componentId = 'DateInput', _DateInput.Day = _Calendar.Calendar.Day, _DateInput.propTypes = _props2.propTypes, _DateInput.allowedProps = _props2.allowedProps, _DateInput.defaultProps = {
   value: '',

package/lib/DateInput2/__new-tests__/DateInput2.test.js

@@ -1,15 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _react2 = require("@testing-library/react");
 var _vitest = require("vitest");
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
 require("@testing-library/jest-dom");
 var _IconHeartLine2 = require("@instructure/ui-icons/lib/IconHeartLine.js");
 var _index = require("../index");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _DateInputExample, _DateInputExample2, _IconHeartLine, _DateInputExample3, _DateInputExample4;
 /*
  * The MIT License (MIT)
@@ -40,7 +40,7 @@ const DateInputExample = () => {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     inputValue = _useState2[0],
     setInputValue = _useState2[1];
-  return /*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+  return (0, _jsxRuntime.jsx)(_index.DateInput2, {
     renderLabel: LABEL_TEXT,
     screenReaderLabels: {
       calendarIcon: 'Calendar',
@@ -66,14 +66,14 @@ describe('<DateInput2 />', () => {
     consoleErrorMock.mockRestore();
   });
   it('should render an input', async () => {
-    const _render = (0, _react2.render)(_DateInputExample || (_DateInputExample = /*#__PURE__*/_react.default.createElement(DateInputExample, null))),
+    const _render = (0, _react2.render)(_DateInputExample || (_DateInputExample = (0, _jsxRuntime.jsx)(DateInputExample, {}))),
       container = _render.container;
     const dateInput = container.querySelector('input');
     expect(dateInput).toBeInTheDocument();
     expect(dateInput).toHaveAttribute('type', 'text');
   });
   it('should render an input label', async () => {
-    const _render2 = (0, _react2.render)(_DateInputExample2 || (_DateInputExample2 = /*#__PURE__*/_react.default.createElement(DateInputExample, null))),
+    const _render2 = (0, _react2.render)(_DateInputExample2 || (_DateInputExample2 = (0, _jsxRuntime.jsx)(DateInputExample, {}))),
       container = _render2.container;
     const label = container.querySelector('label');
     expect(label).toBeInTheDocument();
@@ -81,7 +81,7 @@ describe('<DateInput2 />', () => {
   });
   it('should render an input placeholder', async () => {
     const placeholder = 'Placeholder';
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
       renderLabel: "Choose a date",
       screenReaderLabels: {
         calendarIcon: 'Calendar',
@@ -96,7 +96,7 @@ describe('<DateInput2 />', () => {
   });
   it('should render a calendar icon with screen reader label', async () => {
     const iconLabel = 'Calendar icon Label';
-    const _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    const _render3 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: "Choose a date",
         screenReaderLabels: {
           calendarIcon: iconLabel,
@@ -113,7 +113,7 @@ describe('<DateInput2 />', () => {
   });
   it('should render a custom calendar icon with screen reader label', async () => {
     const iconLabel = 'Calendar icon Label';
-    const _render4 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    const _render4 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: "Choose a date",
         screenReaderLabels: {
           calendarIcon: iconLabel,
@@ -121,7 +121,7 @@ describe('<DateInput2 />', () => {
           prevMonthButton: 'Previous month'
         },
         value: "",
-        renderCalendarIcon: _IconHeartLine || (_IconHeartLine = /*#__PURE__*/_react.default.createElement(_IconHeartLine2.IconHeartLine, null))
+        renderCalendarIcon: _IconHeartLine || (_IconHeartLine = (0, _jsxRuntime.jsx)(_IconHeartLine2.IconHeartLine, {}))
       })),
       container = _render4.container;
     const calendarIcon = container.querySelector('svg[name="IconHeart"]');
@@ -130,12 +130,12 @@ describe('<DateInput2 />', () => {
     expect(calendarLabel).toBeInTheDocument();
   });
   it('should not show calendar table by default', async () => {
-    (0, _react2.render)(_DateInputExample3 || (_DateInputExample3 = /*#__PURE__*/_react.default.createElement(DateInputExample, null)));
+    (0, _react2.render)(_DateInputExample3 || (_DateInputExample3 = (0, _jsxRuntime.jsx)(DateInputExample, {})));
     const calendarTable = _react2.screen.queryByRole('table');
     expect(calendarTable).not.toBeInTheDocument();
   });
   it('should show calendar table when calendar button is clicked', async () => {
-    (0, _react2.render)(_DateInputExample4 || (_DateInputExample4 = /*#__PURE__*/_react.default.createElement(DateInputExample, null)));
+    (0, _react2.render)(_DateInputExample4 || (_DateInputExample4 = (0, _jsxRuntime.jsx)(DateInputExample, {})));
     const calendarButton = _react2.screen.getByRole('button');
     expect(calendarButton).toBeInTheDocument();
     await _userEvent.default.click(calendarButton);
@@ -147,7 +147,7 @@ describe('<DateInput2 />', () => {
   it('should render navigation arrow buttons with screen reader labels', async () => {
     const nextMonthLabel = 'Next month';
     const prevMonthLabel = 'Previous month';
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
       renderLabel: "Choose a date",
       screenReaderLabels: {
         calendarIcon: 'Calendar',
@@ -179,7 +179,7 @@ describe('<DateInput2 />', () => {
   });
   it('should programmatically set and render the initial value', async () => {
     const value = '26/03/2024';
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
       renderLabel: "Choose a date",
       screenReaderLabels: {
         calendarIcon: 'Calendar',
@@ -196,7 +196,7 @@ describe('<DateInput2 />', () => {
   });
   it('should set interaction type to disabled', async () => {
     const interactionDisabled = 'disabled';
-    const _render5 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    const _render5 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: "Choose a date",
         screenReaderLabels: {
           calendarIcon: 'Calendar',
@@ -212,7 +212,7 @@ describe('<DateInput2 />', () => {
   });
   it('should set interaction type to readonly', async () => {
     const interactionReadOnly = 'readonly';
-    const _render6 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    const _render6 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: "Choose a date",
         screenReaderLabels: {
           calendarIcon: 'Calendar',
@@ -234,7 +234,7 @@ describe('<DateInput2 />', () => {
     });
   });
   it('should set required', async () => {
-    const _render7 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    const _render7 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: "Choose a date",
         screenReaderLabels: {
           calendarIcon: 'Calendar',
@@ -250,7 +250,7 @@ describe('<DateInput2 />', () => {
   });
   it('should call onBlur', async () => {
     const onBlur = _vitest.vi.fn();
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
       renderLabel: "Choose a date",
       screenReaderLabels: {
         calendarIcon: 'Calendar',
@@ -273,7 +273,7 @@ describe('<DateInput2 />', () => {
         _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
         inputValue = _useState4[0],
         setInputValue = _useState4[1];
-      return /*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+      return (0, _jsxRuntime.jsx)(_index.DateInput2, {
         renderLabel: LABEL_TEXT,
         screenReaderLabels: {
           calendarIcon: 'Calendar',
@@ -287,7 +287,7 @@ describe('<DateInput2 />', () => {
         invalidDateErrorMessage: errorMsg
       });
     };
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(Example, null));
+    (0, _react2.render)((0, _jsxRuntime.jsx)(Example, {}));
     expect(_react2.screen.queryByText(errorMsg)).not.toBeInTheDocument();
     const dateInput = _react2.screen.getByLabelText(LABEL_TEXT);
     await _userEvent.default.click(dateInput);
@@ -313,7 +313,7 @@ describe('<DateInput2 />', () => {
       type: 'screenreader-only',
       text: 'Screenreader'
     }];
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.DateInput2, {
+    (0, _react2.render)((0, _jsxRuntime.jsx)(_index.DateInput2, {
       renderLabel: "Choose a date",
       screenReaderLabels: {
         calendarIcon: 'Calendar',

package/lib/DateInput2/index.js

@@ -18,8 +18,8 @@ var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 var _ApplyLocaleContext = require("@instructure/ui-i18n/lib/ApplyLocale/ApplyLocaleContext.js");
 var _Locale = require("@instructure/ui-i18n/lib/Locale.js");
-var _emotion = require("@instructure/emotion");
 var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _IconCalendarMonthLin, _IconArrowOpenEndSoli, _IconArrowOpenStartSo;
 /*
  * The MIT License (MIT)
@@ -44,7 +44,6 @@ var _IconCalendarMonthLin, _IconArrowOpenEndSoli, _IconArrowOpenStartSo;
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-/** @jsx jsx */
 function parseLocaleDate(dateString = '', locale, timeZone) {
   // This function may seem complicated but it basically does one thing:
   //   Given a dateString, a locale and a timeZone. The dateString is assumed to be formatted according
@@ -259,7 +258,8 @@ const DateInput2 = ({
     onBlur === null || onBlur === void 0 ? void 0 : onBlur(e, value || '', utcIsoDate);
   };
   const selectedDate = parseDate(value)[1];
-  return (0, _emotion.jsx)(_TextInput.TextInput, Object.assign({}, (0, _passthroughProps.passthroughProps)(rest), {
+  return (0, _jsxRuntime.jsx)(_TextInput.TextInput, {
+    ...(0, _passthroughProps.passthroughProps)(rest),
     inputRef: inputRef,
     renderLabel: renderLabel,
     onChange: handleInputChange,
@@ -272,49 +272,51 @@ const DateInput2 = ({
     messages: inputMessages,
     interaction: interaction,
     margin: margin,
-    renderAfterInput: (0, _emotion.jsx)(_Popover.Popover, {
-      renderTrigger: (0, _emotion.jsx)(_IconButton.IconButton, {
+    renderAfterInput: (0, _jsxRuntime.jsx)(_Popover.Popover, {
+      renderTrigger: (0, _jsxRuntime.jsx)(_IconButton.IconButton, {
         withBackground: false,
         withBorder: false,
         screenReaderLabel: screenReaderLabels.calendarIcon,
         shape: "circle",
-        interaction: interaction
-      }, renderCalendarIcon ? (0, _callRenderProp.callRenderProp)(renderCalendarIcon) : _IconCalendarMonthLin || (_IconCalendarMonthLin = (0, _emotion.jsx)(_IconCalendarMonthLine.IconCalendarMonthLine, null))),
+        interaction: interaction,
+        children: renderCalendarIcon ? (0, _callRenderProp.callRenderProp)(renderCalendarIcon) : _IconCalendarMonthLin || (_IconCalendarMonthLin = (0, _jsxRuntime.jsx)(_IconCalendarMonthLine.IconCalendarMonthLine, {}))
+      }),
       isShowingContent: showPopover,
       onShowContent: () => setShowPopover(true),
       onHideContent: () => setShowPopover(false),
       on: "click",
       shouldContainFocus: true,
       shouldReturnFocus: true,
-      shouldCloseOnDocumentClick: true
-    }, (0, _emotion.jsx)(_Calendar.Calendar, {
-      withYearPicker: withYearPicker,
-      onDateSelected: handleDateSelected,
-      selectedDate: selectedDate,
-      disabledDates: disabledDates,
-      visibleMonth: selectedDate,
-      locale: getLocale(),
-      timezone: getTimezone(),
-      renderNextMonthButton: (0, _emotion.jsx)(_IconButton.IconButton, {
-        size: "small",
-        withBackground: false,
-        withBorder: false,
-        renderIcon: _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = (0, _emotion.jsx)(_IconArrowOpenEndSolid.IconArrowOpenEndSolid, {
-          color: "primary"
-        })),
-        screenReaderLabel: screenReaderLabels.nextMonthButton
-      }),
-      renderPrevMonthButton: (0, _emotion.jsx)(_IconButton.IconButton, {
-        size: "small",
-        withBackground: false,
-        withBorder: false,
-        renderIcon: _IconArrowOpenStartSo || (_IconArrowOpenStartSo = (0, _emotion.jsx)(_IconArrowOpenStartSolid.IconArrowOpenStartSolid, {
-          color: "primary"
-        })),
-        screenReaderLabel: screenReaderLabels.prevMonthButton
+      shouldCloseOnDocumentClick: true,
+      children: (0, _jsxRuntime.jsx)(_Calendar.Calendar, {
+        withYearPicker: withYearPicker,
+        onDateSelected: handleDateSelected,
+        selectedDate: selectedDate,
+        disabledDates: disabledDates,
+        visibleMonth: selectedDate,
+        locale: getLocale(),
+        timezone: getTimezone(),
+        renderNextMonthButton: (0, _jsxRuntime.jsx)(_IconButton.IconButton, {
+          size: "small",
+          withBackground: false,
+          withBorder: false,
+          renderIcon: _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = (0, _jsxRuntime.jsx)(_IconArrowOpenEndSolid.IconArrowOpenEndSolid, {
+            color: "primary"
+          })),
+          screenReaderLabel: screenReaderLabels.nextMonthButton
+        }),
+        renderPrevMonthButton: (0, _jsxRuntime.jsx)(_IconButton.IconButton, {
+          size: "small",
+          withBackground: false,
+          withBorder: false,
+          renderIcon: _IconArrowOpenStartSo || (_IconArrowOpenStartSo = (0, _jsxRuntime.jsx)(_IconArrowOpenStartSolid.IconArrowOpenStartSolid, {
+            color: "primary"
+          })),
+          screenReaderLabel: screenReaderLabels.prevMonthButton
+        })
       })
-    }))
-  }));
+    })
+  });
 };
 exports.DateInput2 = DateInput2;
 DateInput2.propTypes = _props.propTypes;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-date-input",
-  "version": "10.16.1-snapshot-0",
+  "version": "10.16.1",
   "description": "A UI component library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,11 +23,11 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-axe-check": "10.16.1-snapshot-0",
-    "@instructure/ui-babel-preset": "10.16.1-snapshot-0",
-    "@instructure/ui-buttons": "10.16.1-snapshot-0",
-    "@instructure/ui-scripts": "10.16.1-snapshot-0",
-    "@instructure/ui-test-utils": "10.16.1-snapshot-0",
+    "@instructure/ui-axe-check": "10.16.1",
+    "@instructure/ui-babel-preset": "10.16.1",
+    "@instructure/ui-buttons": "10.16.1",
+    "@instructure/ui-scripts": "10.16.1",
+    "@instructure/ui-test-utils": "10.16.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
@@ -35,20 +35,20 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.26.0",
-    "@instructure/emotion": "10.16.1-snapshot-0",
-    "@instructure/shared-types": "10.16.1-snapshot-0",
-    "@instructure/ui-calendar": "10.16.1-snapshot-0",
-    "@instructure/ui-form-field": "10.16.1-snapshot-0",
-    "@instructure/ui-i18n": "10.16.1-snapshot-0",
-    "@instructure/ui-icons": "10.16.1-snapshot-0",
-    "@instructure/ui-popover": "10.16.1-snapshot-0",
-    "@instructure/ui-position": "10.16.1-snapshot-0",
-    "@instructure/ui-prop-types": "10.16.1-snapshot-0",
-    "@instructure/ui-react-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-selectable": "10.16.1-snapshot-0",
-    "@instructure/ui-testable": "10.16.1-snapshot-0",
-    "@instructure/ui-text-input": "10.16.1-snapshot-0",
-    "@instructure/ui-utils": "10.16.1-snapshot-0",
+    "@instructure/emotion": "10.16.1",
+    "@instructure/shared-types": "10.16.1",
+    "@instructure/ui-calendar": "10.16.1",
+    "@instructure/ui-form-field": "10.16.1",
+    "@instructure/ui-i18n": "10.16.1",
+    "@instructure/ui-icons": "10.16.1",
+    "@instructure/ui-popover": "10.16.1",
+    "@instructure/ui-position": "10.16.1",
+    "@instructure/ui-prop-types": "10.16.1",
+    "@instructure/ui-react-utils": "10.16.1",
+    "@instructure/ui-selectable": "10.16.1",
+    "@instructure/ui-testable": "10.16.1",
+    "@instructure/ui-text-input": "10.16.1",
+    "@instructure/ui-utils": "10.16.1",
     "moment-timezone": "^0.5.45",
     "prop-types": "^15.8.1"
   },

package/src/DateInput/__new-tests__/DateInput.test.tsx

@@ -21,7 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-import React from 'react'
+
 import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/DateInput/index.tsx

@@ -22,8 +22,7 @@
  * SOFTWARE.
  */
 
-/** @jsx jsx */
-import React, { Children, Component, ReactElement } from 'react'
+import { Children, Component, ReactElement } from 'react'
 
 import { Calendar } from '@instructure/ui-calendar'
 import type { CalendarProps, CalendarDayProps } from '@instructure/ui-calendar'
@@ -47,7 +46,7 @@ import { testable } from '@instructure/ui-testable'
 
 import { DateTime, ApplyLocaleContext, Locale } from '@instructure/ui-i18n'
 
-import { withStyle, jsx } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyle from './styles'
 

package/src/DateInput/props.ts

@@ -40,7 +40,7 @@ import type {
   PropValidators
 } from '@instructure/shared-types'
 import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
-import React, { InputHTMLAttributes, ReactElement, SyntheticEvent } from 'react'
+import { InputHTMLAttributes, ReactElement, SyntheticEvent } from 'react'
 
 type DateInputOwnProps = {
   /**

package/src/DateInput2/__new-tests__/DateInput2.test.tsx

@@ -21,7 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import { vi, MockInstance } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/DateInput2/index.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-/** @jsx jsx */
 import { useState, useEffect, useContext } from 'react'
 import type { SyntheticEvent } from 'react'
 import { Calendar } from '@instructure/ui-calendar'
@@ -37,7 +36,6 @@ import { TextInput } from '@instructure/ui-text-input'
 import { callRenderProp, passthroughProps } from '@instructure/ui-react-utils'
 
 import { ApplyLocaleContext, Locale } from '@instructure/ui-i18n'
-import { jsx } from '@instructure/emotion'
 
 import { propTypes } from './props'
 import type { DateInput2Props } from './props'