@helsenorge/datepicker 6.3.0 → 6.4.0

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+## [6.3.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv6.2.0&targetVersion=GTv6.3.0) (2024-02-22)
+
+### Features
+
+- select og datepicker støtter autoComplete-attributt
+  ([84c34af](https://github.com/helsenorge/designsystem/commit/84c34afd23a5d236573f5b3b3480175708fb9ecc)), closes
+  [#314727](https://github.com/helsenorge/designsystem/issues/314727) [#314932](https://github.com/helsenorge/designsystem/issues/314932)
+
+### Bug Fixes
+
+- badge er inline-flex og skalerer ikke til full bredde
+  ([ac485e9](https://github.com/helsenorge/designsystem/commit/ac485e923223e7a92ede0743e924a2c39c40bbb8))
+- spacing i promopanel ([60a00bd](https://github.com/helsenorge/designsystem/commit/60a00bdb88d3b35b2e7b1449832674a9bf35ee46))
+- tabell endrer responsiv oppførsel når den vises
+  ([0c21208](https://github.com/helsenorge/designsystem/commit/0c212084cfa5161842dbb0339ae85c82e3c42046)), closes
+  [#315245](https://github.com/helsenorge/designsystem/issues/315245)
+
 ## [6.2.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv6.1.3&targetVersion=GTv6.2.0) (2024-02-20)
 
 ### Features

package/__mocks__/styleMock.d.ts

@@ -1,2 +1,2 @@
-export {};
+export {};
 //# sourceMappingURL=styleMock.d.ts.map

package/components/DatePicker/DatePicker.d.ts

@@ -1,40 +1,40 @@
-import React from 'react';
-import { DayPickerSingleProps } from 'react-day-picker';
-export type DateFormat = 'dd.MM.yyyy';
-export interface DatePickerProps extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'aria-describedby' | 'onBlur' | 'autoComplete'>, Pick<DayPickerSingleProps, 'dir' | 'initialFocus'> {
-    /** Adds custom classes to the element. */
-    className?: string;
-    /** Sets aria-label on the button that opens the datepicker dialogue */
-    dateButtonAriaLabel?: string;
-    /** Sets the format of the date - only applies for desktop use. Native mobile date fields base their formats on the device */
-    dateFormat?: DateFormat;
-    /** Sets the date of the component */
-    dateValue?: Date;
-    /** Sets the current month */
-    defaultMonth?: Date;
-    /** Disables the days in the datepicker */
-    disableDays?: Date[];
-    /** Disables weekends in the datepicker */
-    disableWeekends?: boolean;
-    /** Activates Error style for the input */
-    error?: boolean;
-    /** Error text to show above the component */
-    errorText?: string;
-    /** Content to be rendered in the footer of the datepicker popup */
-    footerContent?: React.ReactNode;
-    /** Label of the input */
-    label?: React.ReactNode;
-    /** Sets the locale of the datepicker */
-    locale?: Locale;
-    /** Maximum date allowed to be selected */
-    maxDate?: Date;
-    /** Minimum date allowed to be selected */
-    minDate?: Date;
-    /** onChange callback trigges ved endring i valgt dato */
-    onChange?: (event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<Element, MouseEvent>, date: Date | string | undefined) => void;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-export declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
-export default DatePicker;
+import React from 'react';
+import { DayPickerSingleProps } from 'react-day-picker';
+export type DateFormat = 'dd.MM.yyyy';
+export interface DatePickerProps extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'aria-describedby' | 'onBlur' | 'autoComplete'>, Pick<DayPickerSingleProps, 'dir' | 'initialFocus'> {
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Sets aria-label on the button that opens the datepicker dialogue */
+    dateButtonAriaLabel?: string;
+    /** Sets the format of the date - only applies for desktop use. Native mobile date fields base their formats on the device */
+    dateFormat?: DateFormat;
+    /** Sets the date of the component */
+    dateValue?: Date;
+    /** Sets the current month */
+    defaultMonth?: Date;
+    /** Disables the days in the datepicker */
+    disableDays?: Date[];
+    /** Disables weekends in the datepicker */
+    disableWeekends?: boolean;
+    /** Activates Error style for the input */
+    error?: boolean;
+    /** Error text to show above the component */
+    errorText?: string;
+    /** Content to be rendered in the footer of the datepicker popup */
+    footerContent?: React.ReactNode;
+    /** Label of the input */
+    label?: React.ReactNode;
+    /** Sets the locale of the datepicker */
+    locale?: Locale;
+    /** Maximum date allowed to be selected */
+    maxDate?: Date;
+    /** Minimum date allowed to be selected */
+    minDate?: Date;
+    /** onChange callback trigges ved endring i valgt dato */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<Element, MouseEvent>, date: Date | string | undefined) => void;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
+export default DatePicker;
 //# sourceMappingURL=DatePicker.d.ts.map

package/components/DatePicker/DatePickerPopup.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import { DayPickerSingleProps } from 'react-day-picker';
-interface DatePickerPopupProps extends Pick<DayPickerSingleProps, 'dir' | 'disabled' | 'footer' | 'fromDate' | 'initialFocus' | 'locale' | 'month' | 'selected' | 'onSelect' | 'onMonthChange' | 'toDate'> {
-    datepickerWrapperRef: React.RefObject<HTMLDivElement>;
-    inputRef: React.RefObject<HTMLInputElement>;
-    testId?: string;
-}
-declare const DatePickerPopup: React.FC<DatePickerPopupProps>;
-export default DatePickerPopup;
+import React from 'react';
+import { DayPickerSingleProps } from 'react-day-picker';
+interface DatePickerPopupProps extends Pick<DayPickerSingleProps, 'dir' | 'disabled' | 'footer' | 'fromDate' | 'initialFocus' | 'locale' | 'month' | 'selected' | 'onSelect' | 'onMonthChange' | 'toDate'> {
+    datepickerWrapperRef: React.RefObject<HTMLDivElement>;
+    inputRef: React.RefObject<HTMLInputElement>;
+    testId?: string;
+}
+declare const DatePickerPopup: React.FC<DatePickerPopupProps>;
+export default DatePickerPopup;
 //# sourceMappingURL=DatePickerPopup.d.ts.map

package/components/DatePicker/DateTime.d.ts

@@ -1,18 +1,18 @@
-import React from 'react';
-export type TimeUnit = 'hours' | 'minutes';
-export interface DateTimeProps extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'aria-describedby' | 'aria-labelledby' | 'onChange' | 'disabled' | 'autoComplete'> {
-    defaultValue?: number;
-    /** Activates Error style for the input */
-    error?: boolean;
-    /** Error text to show above the component */
-    errorText?: string;
-    /** Label of the input */
-    label?: React.ReactNode;
-    /** Sets the unit of time for the input field */
-    timeUnit: TimeUnit;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-export declare const DateTime: React.ForwardRefExoticComponent<DateTimeProps & React.RefAttributes<HTMLInputElement>>;
-export default DateTime;
+import React from 'react';
+export type TimeUnit = 'hours' | 'minutes';
+export interface DateTimeProps extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'aria-describedby' | 'aria-labelledby' | 'onChange' | 'disabled' | 'autoComplete'> {
+    defaultValue?: number;
+    /** Activates Error style for the input */
+    error?: boolean;
+    /** Error text to show above the component */
+    errorText?: string;
+    /** Label of the input */
+    label?: React.ReactNode;
+    /** Sets the unit of time for the input field */
+    timeUnit: TimeUnit;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const DateTime: React.ForwardRefExoticComponent<DateTimeProps & React.RefAttributes<HTMLInputElement>>;
+export default DateTime;
 //# sourceMappingURL=DateTime.d.ts.map

package/components/DatePicker/DateTimePickerWrapper.d.ts

@@ -1,15 +1,15 @@
-import React from 'react';
-export type TimeUnits = 'hours' | 'minutes';
-interface DateTimePickerWrapperProps {
-    /** Sets the children of the datetimepicker - the DatePicker and DateTime components go here */
-    children?: React.ReactNode;
-    /** Error text to show above the component */
-    errorText?: string;
-    /** text placed in the legend tag of the fieldset */
-    legend?: string;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-export declare const DateTimePickerWrapper: React.ForwardRefExoticComponent<DateTimePickerWrapperProps & React.RefAttributes<HTMLDivElement>>;
-export default DateTimePickerWrapper;
+import React from 'react';
+export type TimeUnits = 'hours' | 'minutes';
+interface DateTimePickerWrapperProps {
+    /** Sets the children of the datetimepicker - the DatePicker and DateTime components go here */
+    children?: React.ReactNode;
+    /** Error text to show above the component */
+    errorText?: string;
+    /** text placed in the legend tag of the fieldset */
+    legend?: string;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const DateTimePickerWrapper: React.ForwardRefExoticComponent<DateTimePickerWrapperProps & React.RefAttributes<HTMLDivElement>>;
+export default DateTimePickerWrapper;
 //# sourceMappingURL=DateTimePickerWrapper.d.ts.map

package/components/DatePicker/index.d.ts

@@ -1,7 +1,7 @@
-import { DatePicker } from './DatePicker';
-export { DateTime } from './DateTime';
-export { DateTimePickerWrapper } from './DateTimePickerWrapper';
-export * from './validate-utils';
-export * from './DatePicker';
-export default DatePicker;
+import { DatePicker } from './DatePicker';
+export { DateTime } from './DateTime';
+export { DateTimePickerWrapper } from './DateTimePickerWrapper';
+export * from './validate-utils';
+export * from './DatePicker';
+export default DatePicker;
 //# sourceMappingURL=index.d.ts.map

package/components/DatePicker/position-utils.d.ts

@@ -1,27 +1,27 @@
-import { CSSProperties } from 'react';
-import { PopOverVariant } from '@helsenorge/designsystem-react/components/PopOver';
-/**
- * Beregn om hjelpeboblen skal vises over eller under kontrolleren
- * @param controllerSize DOMRect for controlleren
- * @param bubbleSize DOMRect for hjelpeboblen
- * @param variant Ønsket plassering av hjelpeboblen (over/under/automatisk)
- * @returns Om hjelpeboblen skal vises over eller under
- */
-export declare const getVerticalPosition: (controllerSize: DOMRect, bubbleSize: DOMRect) => keyof typeof PopOverVariant;
-/**
- * Finn riktig plassering av hjelpeboblen
- * @param controllerSize DOMRect for controlleren
- * @param bubbleSize DOMRect for hjelpeboblen
- * @param variant Ønsket plassering av hjelpeboblen (over/under)
- * @returns CSSProperties som plasserer hjelpeboblen riktig
- */
-export declare const getBubbleStyle: (controllerSize: DOMRect, bubbleSize: DOMRect) => CSSProperties;
-/**
- * Finn riktig plassering av pilen
- * @param bubbleStyle CSSProperties for hjelpeboblen
- * @param controllerSize DOMRect for kontrolleren
- * @param verticalPosition Ønsket plassering av hjelpeboblen (over/under)
- * @returns CSSProperties som plasserer pilen riktig
- */
-export declare const getArrowStyle: (bubbleStyle: CSSProperties, controllerSize: DOMRect, verticalPosition: keyof typeof PopOverVariant) => CSSProperties;
+import { CSSProperties } from 'react';
+import { PopOverVariant } from '@helsenorge/designsystem-react/components/PopOver';
+/**
+ * Beregn om hjelpeboblen skal vises over eller under kontrolleren
+ * @param controllerSize DOMRect for controlleren
+ * @param bubbleSize DOMRect for hjelpeboblen
+ * @param variant Ønsket plassering av hjelpeboblen (over/under/automatisk)
+ * @returns Om hjelpeboblen skal vises over eller under
+ */
+export declare const getVerticalPosition: (controllerSize: DOMRect, bubbleSize: DOMRect) => keyof typeof PopOverVariant;
+/**
+ * Finn riktig plassering av hjelpeboblen
+ * @param controllerSize DOMRect for controlleren
+ * @param bubbleSize DOMRect for hjelpeboblen
+ * @param variant Ønsket plassering av hjelpeboblen (over/under)
+ * @returns CSSProperties som plasserer hjelpeboblen riktig
+ */
+export declare const getBubbleStyle: (controllerSize: DOMRect, bubbleSize: DOMRect) => CSSProperties;
+/**
+ * Finn riktig plassering av pilen
+ * @param bubbleStyle CSSProperties for hjelpeboblen
+ * @param controllerSize DOMRect for kontrolleren
+ * @param verticalPosition Ønsket plassering av hjelpeboblen (over/under)
+ * @returns CSSProperties som plasserer pilen riktig
+ */
+export declare const getArrowStyle: (bubbleStyle: CSSProperties, controllerSize: DOMRect, verticalPosition: keyof typeof PopOverVariant) => CSSProperties;
 //# sourceMappingURL=position-utils.d.ts.map

package/components/DatePicker/validate-utils.d.ts

@@ -1,18 +1,18 @@
-export declare const parseInputDate: (dateString: string) => Date | null;
-export declare const isValidDate: (dateString: string) => boolean;
-/** react-hook-form fromDate and toDate validation */
-export declare const validateMinMaxDate: (date: string, errorMessage: string, minDate?: Date, maxDate?: Date) => string | true;
-/** react-hook-form fromDate and toDate validation */
-export declare const validateDisabledDates: (date: string, disabledDates: Date[], errorMessage: string) => string | true;
-/** react-hook-form fromTime and toTime validation */
-export declare const validateMinTimeMaxTime: (time: {
-    hour: number;
-    minute: number;
-}, errorMessage: string, minTime?: {
-    hour: number;
-    minute: number;
-}, maxTime?: {
-    hour: number;
-    minute: number;
-}) => string | true;
+export declare const parseInputDate: (dateString: string) => Date | null;
+export declare const isValidDate: (dateString: string) => boolean;
+/** react-hook-form fromDate and toDate validation */
+export declare const validateMinMaxDate: (date: string, errorMessage: string, minDate?: Date, maxDate?: Date) => string | true;
+/** react-hook-form fromDate and toDate validation */
+export declare const validateDisabledDates: (date: string, disabledDates: Date[], errorMessage: string) => string | true;
+/** react-hook-form fromTime and toTime validation */
+export declare const validateMinTimeMaxTime: (time: {
+    hour: number;
+    minute: number;
+}, errorMessage: string, minTime?: {
+    hour: number;
+    minute: number;
+}, maxTime?: {
+    hour: number;
+    minute: number;
+}) => string | true;
 //# sourceMappingURL=validate-utils.d.ts.map

package/package.json

@@ -4,10 +4,10 @@
   "description": "The official Helsenorge datepicker.",
   "repository": {
     "type": "git",
-    "url": "https://github.com/helsenorge/designsystem"
+    "url": "git+https://github.com/helsenorge/designsystem.git"
   },
   "homepage": "https://helsenorge.design",
-  "version": "6.3.0",
+  "version": "6.4.0",
   "author": "Helsenorge",
   "license": "MIT",
   "dependencies": {