@entur/datepicker 4.0.0-beta.2 → 4.0.0-beta.4

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.0.0-beta.4](https://bitbucket.org/enturas/design-system/compare/@entur/datepicker@4.0.0-beta.3...@entur/datepicker@4.0.0-beta.4) (2022-11-11)
+
+### Bug Fixes
+
+- **DatePicker:** change DatePickerProps to DatePickerBeta to avoid ts-errors when bundeling ([f1efb0a](https://bitbucket.org/enturas/design-system/commits/f1efb0a9b509cfcf6975e9f26034fc5b5a4bba97))
+
+# [4.0.0-beta.3](https://bitbucket.org/enturas/design-system/compare/@entur/datepicker@4.0.0-beta.2...@entur/datepicker@4.0.0-beta.3) (2022-11-08)
+
+### Bug Fixes
+
+- **datepicker:** change min- and maxValue to min- and maxDate ([f5bfb88](https://bitbucket.org/enturas/design-system/commits/f5bfb885bbbd253f150756f36550b07ed848fdc3))
+- **datepicker:** fix page jumping when opening datepicker popover ([4629f2c](https://bitbucket.org/enturas/design-system/commits/4629f2c6f134f622cab7546b3f6d3980c9ed913a))
+
 # [4.0.0-beta.2](https://bitbucket.org/enturas/design-system/compare/@entur/datepicker@4.0.0-beta.1...@entur/datepicker@4.0.0-beta.2) (2022-10-31)
 
 ### Features

package/dist/DatePicker/beta/DatePicker.d.ts

@@ -3,7 +3,7 @@ import type { CalendarDate } from '@internationalized/date';
 import type { DateValue, SpectrumDatePickerProps } from '@react-types/datepicker';
 import type { VariantType } from '@entur/form';
 import './DatePicker.scss';
-declare type DatePickerProps = {
+declare type DatePickerBetaProps = {
     /** Den valgte datoen. Dato i '@internationalized/date'-pakkens format */
     selectedDate: DateValue;
     /** Kalles når tiden endres. Dato i '@internationalized/date'-pakkens format */
@@ -24,12 +24,12 @@ declare type DatePickerProps = {
     showTime?: boolean;
     /** Tidligste gyldige datovalg.
      * Eks: today(getLocalTimeZone()) == i dag i lokal tidssone. */
-    minValue?: CalendarDate;
+    minDate?: CalendarDate;
     /** Seneste gyldige datovalg.
      * Eks: today(getLocalTimeZone()) == i dag i lokal tidssone
      *
      * OBS: Hvis du bruker dato med tid vil det være til, men ikke med denne datoen */
-    maxValue?: CalendarDate;
+    maxDate?: CalendarDate;
     /** Funksjon som tar inn en dato og sier om den er utilgjengelig.
      * Eks. (date) => isWeekend(date, 'no-NO') == helgedager er ikke tilgjengelig */
     isDateUnavailable?: (date: DateValue) => boolean;
@@ -59,5 +59,5 @@ declare type DatePickerProps = {
     className?: string;
     style?: React.CSSProperties;
 } & Omit<SpectrumDatePickerProps<DateValue>, 'value' | 'onChange' | 'label' | 'hideTimeZone' | 'placeholder' | 'minValue' | 'maxValue'>;
-export declare const DatePickerBeta: ({ selectedDate: value, onChange, locale, disabled: isDisabled, showTime, showTimeZone, className, style, variant, feedback, validationVariant, validationFeedback, disableModal, labelTooltip, navigationDescription, ...rest }: DatePickerProps) => JSX.Element;
+export declare const DatePickerBeta: ({ selectedDate: value, onChange, locale, disabled: isDisabled, showTime, showTimeZone, className, style, variant, feedback, validationVariant, validationFeedback, disableModal, labelTooltip, navigationDescription, minDate: minValue, maxDate: maxValue, ...rest }: DatePickerBetaProps) => JSX.Element;
 export {};

package/dist/datepicker.cjs.development.js

@@ -530,7 +530,7 @@ var FieldSegment = function FieldSegment(_ref) {
  * @param {boolean} noTimeOnlyDate Hvis tidspunktet er irrelevant kan denne settes til true, da får man et CalendarDate-objekt uten tidspunkt tilbake
  * @param {string} timeZone Tidssonen på IANA-formatet som tidpunktet skal konverteres til. Utelates denne får man et tidspunkt uten tidssone. Kan brukes med og uten en UTC-offset Vær obs på annen oppførsel med offset, les mer på beskrivelsen av offset
  * @param {number} offset UTC-offset i millisekunder, må brukes med en tidssone. Ved å legge på en offset lager du en variant av en tidssone. Det betyr at tidspunktet ikke endres (time, minutt, sekund uendret), men tidssonen, med tilhørende offset, tidspunktet er i endres.
- * @returns {Time | CalendarDateTime | ZonedDateTime | CalendarDate} et av TimeValue-objektene med verdier fra date
+ * @returns {Time | CalendarDateTime | ZonedDateTime | CalendarDate} et av Time- eller DateValue-objektene med verdier fra date
  */
 
 var nativeDateToTimeOrDateValue = function nativeDateToTimeOrDateValue(date$1, noDateOnlyTime, noTimeOnlyDate, timeZone, offset) {
@@ -560,7 +560,7 @@ var nativeDateToTimeOrDateValue = function nativeDateToTimeOrDateValue(date$1, n
  * @param {string} timeZoneForCalendarDateTime Tidssonen value er i. Fungerer kun med typen er CalendarDateTime
  * @returns {Date} et Date-objekt med verdier fra time
  */
-// This function uses a lot of @ts-expect-error to make it work with all TimeValue types. Sorry ...
+// This function uses a lot of @ts-expect-error to make it work with all Date- and TimeValue types. Sorry ...
 
 var timeOrDateValueToNativeDate = function timeOrDateValueToNativeDate(value, timeZoneForCalendarDateTime) {
   // @ts-expect-error .day does not exist on Time-object
@@ -854,7 +854,7 @@ var Calendar = /*#__PURE__*/React__default["default"].forwardRef(function (_ref,
   })));
 });
 
-var _excluded$3 = ["selectedDate", "onChange", "locale", "disabled", "showTime", "showTimeZone", "className", "style", "variant", "feedback", "validationVariant", "validationFeedback", "disableModal", "labelTooltip", "navigationDescription"];
+var _excluded$3 = ["selectedDate", "onChange", "locale", "disabled", "showTime", "showTimeZone", "className", "style", "variant", "feedback", "validationVariant", "validationFeedback", "disableModal", "labelTooltip", "navigationDescription", "minDate", "maxDate"];
 var DatePickerBeta = function DatePickerBeta(_ref) {
   var value = _ref.selectedDate,
       _onChange = _ref.onChange,
@@ -872,6 +872,8 @@ var DatePickerBeta = function DatePickerBeta(_ref) {
       disableModal = _ref$disableModal === void 0 ? false : _ref$disableModal,
       labelTooltip = _ref.labelTooltip,
       navigationDescription = _ref.navigationDescription,
+      minValue = _ref.minDate,
+      maxValue = _ref.maxDate,
       rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
 
   var CALENDAR_MODAL_MAX_SCREEN_WIDTH = 1000;
@@ -883,12 +885,16 @@ var DatePickerBeta = function DatePickerBeta(_ref) {
       width = _useWindowDimensions.width;
 
   var state = datepicker$1.useDatePickerState(_extends({}, rest, {
+    minValue: minValue,
+    maxValue: maxValue,
     value: value,
     onChange: _onChange
   }));
 
   var _useDatePicker = datepicker.useDatePicker(_extends({
-    isDisabled: isDisabled
+    isDisabled: isDisabled,
+    minValue: minValue,
+    maxValue: maxValue
   }, rest), state, datePickerRef),
       groupProps = _useDatePicker.groupProps,
       labelProps = _useDatePicker.labelProps,
@@ -946,7 +952,7 @@ var DatePickerBeta = function DatePickerBeta(_ref) {
     if (selectedCell) selectedCell.focus();else if (todayCell) todayCell.focus();
   };
 
-  var popoverCalendar = React__default["default"].createElement(FocusLock__default["default"], {
+  var popoverCalendar = React__default["default"].createElement(React__default["default"].Fragment, null, state.isOpen && React__default["default"].createElement(FocusLock__default["default"], {
     disabled: !state.isOpen,
     returnFocus: true
   }, React__default["default"].createElement(Calendar, _extends({}, dialogProps, calendarProps, {
@@ -963,13 +969,12 @@ var DatePickerBeta = function DatePickerBeta(_ref) {
     navigationDescription: navigationDescription,
     // styling for floating-UI popover
     style: {
-      display: state.isOpen ? 'block' : 'none',
       position: strategy,
       top: y != null ? y : 0,
       left: x != null ? x : 0,
-      zIndex: 10
+      zIndex: tokens.zIndexes.popover
     }
-  })));
+  }))));
   var modalCalendar = React__default["default"].createElement(modal.Modal, {
     size: 'small',
     title: "",