@designsystem-se/af 36.0.1-beta.0 → 36.0.2

package/dist/esm/{text-26e02c8d.js → text-8f88c0f6.js}

@@ -11,6 +11,7 @@ const common = {
     required: 'Obligatoriskt',
     optional: 'Frivilligt',
     of: 'av',
+    and: 'och',
     today: 'Idag',
     cancel: 'Avbryt',
     canceled: 'Avbruten',
@@ -26,6 +27,24 @@ const common = {
 };
 const calendar = {
     screenReaderInstructions: 'För navigering mellan månader med piltangenterna, använd inte den virtuella markören.',
+    year: 'År',
+    month: 'Månad',
+    months: [
+        'januari',
+        'februari',
+        'mars',
+        'april',
+        'maj',
+        'juni',
+        'juli',
+        'augusti',
+        'september',
+        'oktober',
+        'november',
+        'december'
+    ],
+    previousMonth: 'föregående månad',
+    nextMonth: 'nästa månad',
     week: 'Vecka',
     weekdays: {
         mon: 'Måndag',

package/dist/esm/typography-heading-jumbo-variation.enum-eb737f1b.js

@@ -0,0 +1,17 @@
+var TypographyHeadingJumboLevel;
+(function (TypographyHeadingJumboLevel) {
+    TypographyHeadingJumboLevel["H1"] = "h1";
+    TypographyHeadingJumboLevel["H2"] = "h2";
+    TypographyHeadingJumboLevel["H3"] = "h3";
+    TypographyHeadingJumboLevel["H4"] = "h4";
+    TypographyHeadingJumboLevel["H5"] = "h5";
+    TypographyHeadingJumboLevel["H6"] = "h6";
+})(TypographyHeadingJumboLevel || (TypographyHeadingJumboLevel = {}));
+
+var TypographyHeadingJumboVariation;
+(function (TypographyHeadingJumboVariation) {
+    TypographyHeadingJumboVariation["PRIMARY"] = "primary";
+    TypographyHeadingJumboVariation["SECONDARY"] = "secondary";
+})(TypographyHeadingJumboVariation || (TypographyHeadingJumboVariation = {}));
+
+export { TypographyHeadingJumboLevel as T, TypographyHeadingJumboVariation as a };

package/dist/esm/{typography-variation.enum-8ba40d15.js → typography-variation.enum-8c3ff25c.js}

@@ -65,6 +65,14 @@ var FormErrorListHeadingLevel;
     FormErrorListHeadingLevel["H6"] = "h6";
 })(FormErrorListHeadingLevel || (FormErrorListHeadingLevel = {}));
 
+var FormFieldsetValidation;
+(function (FormFieldsetValidation) {
+    FormFieldsetValidation["SUCCESS"] = "success";
+    FormFieldsetValidation["ERROR"] = "error";
+    FormFieldsetValidation["WARNING"] = "warning";
+    FormFieldsetValidation["NEUTRAL"] = "neutral";
+})(FormFieldsetValidation || (FormFieldsetValidation = {}));
+
 var FormRadiobuttonLayout;
 (function (FormRadiobuttonLayout) {
     FormRadiobuttonLayout["INLINE"] = "inline";
@@ -162,38 +170,6 @@ var InfoCardHeadingLevel;
     InfoCardHeadingLevel["H6"] = "h6";
 })(InfoCardHeadingLevel || (InfoCardHeadingLevel = {}));
 
-var LayoutBlockContainer;
-(function (LayoutBlockContainer) {
-    LayoutBlockContainer["STATIC"] = "static";
-    LayoutBlockContainer["FLUID"] = "fluid";
-    LayoutBlockContainer["NONE"] = "none";
-})(LayoutBlockContainer || (LayoutBlockContainer = {}));
-
-var LayoutContainerVariation;
-(function (LayoutContainerVariation) {
-    LayoutContainerVariation["STATIC"] = "static";
-    LayoutContainerVariation["FLUID"] = "fluid";
-    LayoutContainerVariation["NONE"] = "none";
-})(LayoutContainerVariation || (LayoutContainerVariation = {}));
-
-var LayoutContainerMaxWidth;
-(function (LayoutContainerMaxWidth) {
-    LayoutContainerMaxWidth["WIDTH_1200"] = "1200";
-    LayoutContainerMaxWidth["WIDTH_1400"] = "1400";
-})(LayoutContainerMaxWidth || (LayoutContainerMaxWidth = {}));
-
-var NavigationVerticalMenuActiveIndicatorSize;
-(function (NavigationVerticalMenuActiveIndicatorSize) {
-    NavigationVerticalMenuActiveIndicatorSize["PRIMARY"] = "primary";
-    NavigationVerticalMenuActiveIndicatorSize["SECONDARY"] = "secondary";
-})(NavigationVerticalMenuActiveIndicatorSize || (NavigationVerticalMenuActiveIndicatorSize = {}));
-
-var NavigationVerticalMenuVariation;
-(function (NavigationVerticalMenuVariation) {
-    NavigationVerticalMenuVariation["PRIMARY"] = "primary";
-    NavigationVerticalMenuVariation["SECONDARY"] = "secondary";
-})(NavigationVerticalMenuVariation || (NavigationVerticalMenuVariation = {}));
-
 var NotificationAlertHeadingLevel;
 (function (NotificationAlertHeadingLevel) {
     NotificationAlertHeadingLevel["H1"] = "h1";
@@ -253,26 +229,10 @@ var FeedbackVariation;
     FeedbackVariation["SECONDARY"] = "secondary";
 })(FeedbackVariation || (FeedbackVariation = {}));
 
-var TypographyHeadingJumboLevel;
-(function (TypographyHeadingJumboLevel) {
-    TypographyHeadingJumboLevel["H1"] = "h1";
-    TypographyHeadingJumboLevel["H2"] = "h2";
-    TypographyHeadingJumboLevel["H3"] = "h3";
-    TypographyHeadingJumboLevel["H4"] = "h4";
-    TypographyHeadingJumboLevel["H5"] = "h5";
-    TypographyHeadingJumboLevel["H6"] = "h6";
-})(TypographyHeadingJumboLevel || (TypographyHeadingJumboLevel = {}));
-
-var TypographyHeadingJumboVariation;
-(function (TypographyHeadingJumboVariation) {
-    TypographyHeadingJumboVariation["PRIMARY"] = "primary";
-    TypographyHeadingJumboVariation["SECONDARY"] = "secondary";
-})(TypographyHeadingJumboVariation || (TypographyHeadingJumboVariation = {}));
-
 var TypographyVariation;
 (function (TypographyVariation) {
     TypographyVariation["SMALL"] = "small";
     TypographyVariation["LARGE"] = "large";
 })(TypographyVariation || (TypographyVariation = {}));
 
-export { BadgeNotificationType as B, CalendarDatepickerValidation as C, DialogHeadingLevel as D, ErrorPageStatusCodes as E, FooterVariation as F, HeaderCenterContentWidth as H, InfoCardMultiContainerHeadingLevel as I, LayoutBlockContainer as L, NavigationVerticalMenuActiveIndicatorSize as N, TitleLogoVariation as T, CodeBlockLanguage as a, DialogSize as b, DialogVariation as c, FormErrorListHeadingLevel as d, FormRadiobuttonLayout as e, FormRadiobuttonValidation as f, FormRadiobuttonVariation as g, FormReceiptHeadingLevel as h, FormReceiptType as i, FormReceiptVariation as j, FormSelectFilterValidation as k, InfoCardMultiHeadingLevel as l, InfoCardMultiVariation as m, InfoCardHeadingLevel as n, LayoutContainerVariation as o, LayoutContainerMaxWidth as p, NavigationVerticalMenuVariation as q, NotificationAlertHeadingLevel as r, NotificationAlertSize as s, NotificationAlertVariation as t, ToolsFeedbackHeadingLevel as u, ToolsFeedbackType as v, FeedbackVariation as w, TypographyHeadingJumboLevel as x, TypographyHeadingJumboVariation as y, TypographyVariation as z };
+export { BadgeNotificationType as B, CalendarDatepickerValidation as C, DialogHeadingLevel as D, ErrorPageStatusCodes as E, FooterVariation as F, HeaderCenterContentWidth as H, InfoCardMultiContainerHeadingLevel as I, NotificationAlertHeadingLevel as N, TitleLogoVariation as T, CodeBlockLanguage as a, DialogSize as b, DialogVariation as c, FormErrorListHeadingLevel as d, FormFieldsetValidation as e, FormRadiobuttonLayout as f, FormRadiobuttonValidation as g, FormRadiobuttonVariation as h, FormReceiptHeadingLevel as i, FormReceiptType as j, FormReceiptVariation as k, FormSelectFilterValidation as l, InfoCardMultiHeadingLevel as m, InfoCardMultiVariation as n, InfoCardHeadingLevel as o, NotificationAlertSize as p, NotificationAlertVariation as q, ToolsFeedbackHeadingLevel as r, ToolsFeedbackType as s, FeedbackVariation as t, TypographyVariation as u };

package/dist/types/components/_calendar/calendar/calendar.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
 /**
  * @slot calendar-footer - displayed beneath the calendar. Preferable buttons.
- *
+ * @valueAccessor TextValueAccessor
  */
 export interface YearAndMonth {
     year: number;
@@ -13,28 +13,26 @@ export interface YearAndMonth {
 export declare class Calendar {
     selectedDates: Date[];
     focusedDate: Date;
+    focusedDateChanged(): void;
     dirty: boolean;
     private _tbody;
     /**
-     * Prefix för komponentens alla olika interna 'id'-attribut på kalendern etc. Ex. 'my-cool-id' genererar 'my-cool-id-calendar' osv. Ges inget värde genereras ett slumpmässigt.
-     * @en Prefix for all id attributes inside the component. Example: 'my-cool-id' generates 'my-cool-id-calendar' and so on. Defaults to random string.
+     * Prefix för komponentens 'id'-attribut. Ex. 'my-cool-id' genererar 'my-cool-id-calendar'. Ges inget värde genereras ett slumpmässigt.
+     * @en Prefix for the component's 'id' attribute. Example: 'my-cool-id' generates 'my-cool-id-calendar'. Defaults to random string.
      */
     afId: string;
     /**
-     * Vald månad att visa från start. Förvalt är den månad som dagens datum har. (Januari = 0, December = 11)
-     * @en Selected month to display from start. Defaults to the month of todays month. (Januray = 0, December = 11)
+     * Styr vilken månad som visas från start, samt vilken datumknapp som är ingångspunkt för tangentbordsnavigering. Om inte angiven används valt datum eller dagens datum.
+     * @en Controls which month is shown from start, and which date button is the entry point for keyboard navigation. If not provided, selected date or today's date is used.
      */
-    afInitSelectedMonth: number;
+    afOpenCalendarTo: Date;
+    afOpenCalendarToChangeHandler(): void;
     /**
-     * Valt måndad och år från start. Förvalt är dagens månad och år.
-     * @en Selected month and year to display from start. Defaults to todays month and year.
-     */
-    afInitSelectedDate: Date;
-    /**
-     * Visa veckonummer i kalender. Förvalt är false
-     * @en Show week number in the calander. Default is false
+     * Visa veckonummer i kalender
+     * @en Show week number in the calendar
      */
     afShowWeekNumber: boolean;
+    afShowWeekNumberChangeHandler(): void;
     /**
      * Valt datum i kalendern
      * @en Selected date in calendar
@@ -48,8 +46,8 @@ export declare class Calendar {
     afSelectedDates: Date[];
     afSelectedDatesChangeHandler(): void;
     /**
-     * Visar döljer kalendern. Visas som förvalt
-     * @en Toggle calendar hide/show. Defaults to true
+     * Visar eller döljer kalendern.
+     * @en Toggle calendar hide/show.
      */
     afActive: boolean;
     /**
@@ -63,13 +61,13 @@ export declare class Calendar {
      */
     afMaxDate: Date;
     /**
-     * Sätt denna till true för att kunna markera mer en ett datum i kalendern. Förvalt är false
-     * @en Set this to true to be able to select multiple dates in the calander. Default is false
+     * Sätt denna till true för att tillåta val av flera datum
+     * @en Set this to true to be able to allow selection of multiple dates
      */
     afMultipleDates: boolean;
     /**
-     * Sätt denna till true för att kunna välja år genom en väljare. Förvalt är false
-     * @en Set this to true to be able to select year through a select component. Default is false
+     * Sätt denna till true för att visa väljare för år
+     * @en Set this to true to be show year selector
      */
     afYearSelect: boolean;
     /**
@@ -97,9 +95,9 @@ export declare class Calendar {
     firstWeekOfNextMonth: Date[];
     weeksBetween: number;
     weekDaysbetween: Date[];
-    months: any[];
     focusoutHandler(e: FocusEvent): void;
     clickHandler(e: MouseEvent): void;
+    determineFocusedDate(): void;
     drawCalendar(focusedDate: Date): void;
     appendFirstWeekOfNextMonth(): Date[];
     getLastDayOfPrevMonth(date: YearAndMonth): Date;
@@ -130,7 +128,7 @@ export declare class Calendar {
     resetFocus(): void;
     getFullDate(date: Date): string;
     getDateName(date: Date): string;
-    setFocused(date: Date): boolean;
+    isFocused(date: Date): boolean;
     ariaPressed(date: Date): "true" | "false";
     selectMonth(evt: any): void;
     selectYear(evt: any): void;
@@ -138,7 +136,6 @@ export declare class Calendar {
     latestSelectableYear(): number;
     allSelectableYears(): number[];
     componentWillLoad(): void;
-    componentWillUpdate(): void;
     componentDidLoad(): Promise<void>;
     cssDateModifiers(date: Date): {
         'digi-calendar__date--today': boolean;

package/dist/types/components/_calendar/calendar-datepicker/calendar-datepicker.d.ts

@@ -1,11 +1,15 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
 import type { HTMLStencilElement } from '../../../stencil-public-runtime';
 import { CalendarDatepickerValidation } from './calendar-datepicker-validation.enum';
+import { ValidationChange } from './calendar-datepicker.types';
 /**
  * @swedishName Datumväljare
+ * @eventListeners focus - Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet
+ * @valueAccessor TextValueAccessor
  */
 export declare class CalendarDatepicker {
     hostElement: HTMLStencilElement;
+    private _input?;
     showWrongFormatError: boolean;
     showDisabledDateError: boolean;
     showCalendar: boolean;
@@ -13,20 +17,25 @@ export declare class CalendarDatepicker {
     private screenReaderUpdateTrigger;
     userInput: string;
     /**
-     * Sätter ett id attribut.
-     * @en Sets an id attribute. Standard är slumpmässig sträng.
+     * Sätter attributet id för inputfältet, och utgör basen för andra id:n i komponenten
+     * @en Sets an id attribute for the input field, and serves as the base for other ids in the component
      */
     afId: string;
     /**
-     * Texten till labelelementet
+     * Texten till etiketten
      * @en The label text
      */
     afLabel: string;
     /**
-     * Valfri beskrivande text
+     * Beskrivande text som bör ange det förväntade formatet och/eller andra krav
      * @en Optional description text
      */
     afLabelDescription: string;
+    /**
+     * Sätter attributet 'name' på det inre input-elementet
+     * @en Sets the 'name' attribute on the inner input element
+     */
+    afName: string;
     /**
      * Aria-label till knappen som öppnar kalendern
      * @en Aria-label for the button that opens the calendar
@@ -38,48 +47,39 @@ export declare class CalendarDatepicker {
      */
     afCloseCalendarAriaLabel: string;
     /**
-     * Sätter valideringsstatus. Kan vara 'success', 'error', 'warning', 'neutral' eller ingenting.
+     * Sätter valideringsstatus. Kan vara 'success', 'error', 'warning', 'neutral' eller ingenting. Om värdet är 'error' sätts också aria-invalid="true" på input-elementet.
      * @en Set input validation status
      */
     afValidation: CalendarDatepickerValidation;
     /**
-     * Sätter valideringsmeddelandet
-     * @en Set input validation message
+     * Sätter valideringsmeddelandet för egen validering
+     * @en Set input validation message for custom validation
      */
     afValidationText: string;
     /**
-     * Sätter valideringsmeddelandet när du använder afInvalid
-     * @en Set input validation message when using afInvalid property
-     */
-    afInvalid: boolean;
-    /**
-     * Sätter valideringsmeddelandet när du använder afInvalid
-     * @en Set input validation message when using afInvalid property
-     */
-    afValidationMessage: string;
-    /**
-     * Sätter valideringsmeddelandet
-     * @en Set input validation message
+     * Sätter valideringsmeddelandet för den inbyggda formatvalideringen. Default är "Fel format"
+     * @en Set input validation message for the built-in format validation
      */
     afValidationWrongFormat: string;
     /**
-     * Sätter valideringsmeddelandet
-     * @en Set input validation message
+     * Sätter valideringsmeddelandet för den inbyggda valideringen när man anger datum som inte är valbara. Default är "Ej valbart datum"
+     * @en Set input validation message for the built-in when date is not selectable
      */
     afValidationDisabledDate: string;
     /**
-     * Sätter attributet 'required'.
+     * Sätter attributet 'required'
      * @en Input required attribute
      */
     afRequired: boolean;
     /**
-     * Sätt denna till true för att stänga av komponentens egna validering.
-     * @en Set this to true to disable internal validation.
+     * Sätt denna till true för att stänga av komponentens egna validering
+     * @en Set this to true to disable internal validation
      */
     afDisableValidation: boolean;
+    afDisableValidationChangeHandler(newVal: boolean): void;
     /**
-     * Sätter text för afRequired.
-     * @en Set text for afRequired.
+     * Ersätter texten "obligatorisk" i fältetiketten
+     * @en Replaces the text "obligatorisk" in the label
      */
     afRequiredText: string;
     /**
@@ -87,6 +87,12 @@ export declare class CalendarDatepicker {
      * @en Selected dates in calendar
      */
     afSelectedDates: Array<Date>;
+    afSelectedDatesChangeHandler(newVal: Array<Date>): void;
+    /**
+     * Sätts till true för att byta knapparna för föregående och nästa månad till dropdowns för att välja månad och år. Rekommenderas då förväntat datum är många månader bakåt eller framåt i tiden, som exempelvis ett födelsedatum.
+     * @en Set this to true to change the previous/next month buttons to dropdowns for selecting month and year. Recommended when the expected date is many months back or forward in time, such as a birthdate.
+     */
+    afYearSelect: boolean;
     /**
      * Sätter attributet 'value'
      * @en Input value attribute
@@ -99,46 +105,80 @@ export declare class CalendarDatepicker {
      * @en Earliest selectable date
      */
     afMinDate: Date;
+    afMinDateChangeHandler(newVal: Date): void;
     /**
      * Senaste valbara datumet
      * @en Latest selectable date
      */
     afMaxDate: Date;
+    afMaxDateChangeHandler(newVal: Date): void;
     /**
-     * Visa veckonummer i kalender. Förvalt är false
-     * @en Show week number in the calander. Default is false
+     * Visa veckonummer i kalender
+     * @en Show week number in the calander.
      */
     afShowWeekNumber: boolean;
     /**
-     * Sätt denna till true för att kunna markera mer en ett datum i kalendern. Förvalt är false
-     * @en Set this to true to be able to select multiple dates in the calander. Default is false
+     * Sätt denna till true för att kunna markera mer en ett datum i kalendern
+     * @en Set this to true to be able to select multiple dates in the calander
      */
     afMultipleDates: boolean;
     afMultipleDatesChangeHandler(): void;
     /**
-     * Sätt denna till true om kalendern ska stängas när användaren väljer ett datum. Förvalt är false
-     * @en Set this to true if the calendar should close when a date is selected. Default is false
+     * Sätt denna till true om kalendern ska stängas när användaren väljer ett datum
+     * @en Set this to true if the calendar should close when a date is selected
      */
     afCloseOnSelect: boolean;
     /**
-     * Sker vid datum uppdatering
-     * @en When date is updated
+     * Styr vilken månad som visas från start, samt vilken datumknapp som är ingångspunkt för tangentbordsnavigering. Om inte angiven används valt datum eller dagens datum.
+     * @en Controls which month is shown from start, and which date button is the entry point for keyboard navigation. If not provided, selected date or today's date is used.
+     */
+    afOpenCalendarTo: Date;
+    /**
+     * Om värdet är true får felmeddelandet attributet role="alert".
+     * Om felet visas tillsammans med flera andra fel (till exempel efter servervalidering) ska värdet sättas till false.
+     * @en If the value is true, the error message gets the attribute role="alert".
+     * If the error is shown together with multiple errors (for example after server-side validation), the value should be set to false.
+     */
+    afErrorMessageIsAlert: boolean | string;
+    get errorMessageIsAlert(): boolean;
+    /**
+     * Skickar värdet som en array av Date-objekt när datumet uppdateras
+     * @en Sends the value as an array of Date objects when the date is updated
+     */
+    afOnDateChange: EventEmitter<Date[]>;
+    /**
+     * Skickar strängen som visas i inputfältet när datumet uppdateras
+     * @en Sends the string displayed in the input field when the date is updated
      */
-    afOnDateChange: EventEmitter<Date[] | string[] | []>;
+    afOnDateChangeRawText: EventEmitter<string>;
     clickHandler(e: MouseEvent): void;
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual input element.
+     */
+    focusOnInput(): void;
+    /**
+     * Skickar resultatet när validering sker
+     * @en Emits the validation result
+     */
+    afOnValidationChange: EventEmitter<ValidationChange>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     componentDidLoad(): void;
+    componentDidUpdate(): void;
     get cssModifiers(): {
         'digi-calendar-datepicker__show-week-numbers': boolean;
         'digi-calendar-datepicker__show-error': boolean;
         'digi-calendar-datepicker__show-calendar': boolean;
     };
     keyUpHandler(e: KeyboardEvent): void;
+    focusOnCalendarInput(): void;
     focusOnCalendarButton(): void;
+    private positionCalendar;
     toggleCalendar(): void;
     parseInputString(value: string): Date[];
     resetValueAndState(): void;
+    removeDuplicateDates(dates: Date[]): Date[];
     validateInputAndShowErrors(dates: Date[]): void;
     setValue(value: Date[]): void;
     parseInput(evt: any): void;
@@ -149,8 +189,9 @@ export declare class CalendarDatepicker {
     isBefore(a: Date, b: Date): boolean;
     isAfter(a: Date, b: Date): boolean;
     dateWithoutTime(date: Date): Date;
-    getShowError(): boolean;
-    getErrorText(): string;
+    hasBuiltInValidationError(): boolean;
+    hasCustomValidationError(): boolean;
+    getErrorText(): string | undefined;
     get inputValue(): string;
     datesToInputString(dates: Date[]): string;
     private get getSelectedDates();

package/dist/types/components/_calendar/calendar-datepicker/calendar-datepicker.types.d.ts

@@ -0,0 +1,4 @@
+export interface ValidationChange {
+    isValid: boolean;
+    validationText?: string;
+}

package/dist/types/components/_form/form-category-filter/form-category-filter.d.ts

@@ -13,17 +13,17 @@ export declare class FormCategoryFilter {
     afCategories: Array<FormCategory>;
     afCategoriesChangeHandler(): void;
     /**
-     * Ifall listan ska börja med en 'Alla kategorier' kategori
-     * @en If the list should start with a 'All categories' category
+     * Ifall listan ska börja med en knapp för 'Alla kategorier'
+     * @en If the list should start with a button for 'All categories'
      */
     afAllCategories: boolean;
     /**
-     * Ifall 'Alla kategorier' kategorin ska börja vald
-     * @en If the 'All categories' category should start selected
+     * Ifall 'Alla kategorier' kategorin ska vara vald från start
+     * @en If the 'All categories' category should be selected from start
      */
     afAllCategoriesSelected: boolean;
     /**
-     * Namnet på 'Alla kategorier' kategorin
+     * Namnet på 'Alla kategorier'-kategorin
      * @en The name of the 'All categories' category
      */
     afAllCategoriesText: string;
@@ -33,8 +33,8 @@ export declare class FormCategoryFilter {
      */
     afVisibleCollapsed: number;
     /**
-     * Ifall listan ska var kollapsad från början
-     * @en If the list should start out collapsed
+     * Ifall listan ska vara kollapsad från början
+     * @en If the list should be collapsed from start
      */
     afStartCollapsed: boolean;
     /**
@@ -43,15 +43,15 @@ export declare class FormCategoryFilter {
      */
     afMultiselect: boolean;
     /**
-     * Visa alla kategorier och dölj knappen för att "visa fler/visa färre
-     * @en Show all categories and hide button to "visa fler"/"visa färre"
+     * Visa alla kategorier och dölj knappen för att visa fler/färre
+     * @en Show all categories and hide button to show more/fewer
      */
     afHideToggle: boolean;
     /**
      * Sker vid ändrade valda kategorier
      * @en When selected categories is changed
      */
-    afOnSelectedCategoryChange: EventEmitter;
+    afOnSelectedCategoryChange: EventEmitter<string[]>;
     selectedCategories: Array<string>;
     collapsed: boolean;
     componentDidLoad(): void;

package/dist/types/components/_form/form-checkbox/form-checkbox.d.ts

@@ -7,6 +7,8 @@ import { FormCheckboxLayout } from './form-checkbox-layout.enum';
  * @enums FormCheckboxValidation - form-checkbox-validation.enum.ts
  * @enums FormCheckboxVariation - form-checkbox-variation.enum.ts
  * @swedishName Kryssruta
+ * @eventListeners focus - Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet
+ * @valueAccessor BooleanValueAccessor
  */
 export declare class FormCheckbox {
     hostElement: HTMLStencilElement;
@@ -112,7 +114,8 @@ export declare class FormCheckbox {
      */
     afAutofocus: boolean;
     /**
-     * TODO
+     * Tabindex
+     * @deprecated Denna prop kommer att tas bort i slutet av juli
      */
     afTabIndex: number;
     /**
@@ -160,6 +163,11 @@ export declare class FormCheckbox {
      * @en Returns a reference to the input element. Handy for setting focus programmatically.
      */
     afMGetFormControlElement(): Promise<HTMLInputElement>;
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual input element.
+     */
+    focusOnInput(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
     get cssModifiers(): {

package/dist/types/components/_form/form-error-list/form-error-list.d.ts

@@ -1,6 +1,7 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
 import type { HTMLStencilElement } from '../../../stencil-public-runtime';
 import { FormErrorListHeadingLevel } from './form-error-list-heading-level.enum';
+import { ClickLink } from './form-error-list.types';
 /**
  * @enums FormErrorListHeadingLevel - form-error-list-heading-level.enum.ts
  * @swedishName Felmeddelandelista
@@ -8,11 +9,7 @@ import { FormErrorListHeadingLevel } from './form-error-list-heading-level.enum'
 export declare class FormErrorList {
     hostElement: HTMLStencilElement;
     private _notificationAlert;
-    private _observer;
-    linkItems: Array<{
-        text: string;
-        href: string;
-    }>;
+    linkItems: Array<any>;
     /**
      * Rubrikens text
      * @en The heading text
@@ -45,10 +42,10 @@ export declare class FormErrorList {
      */
     afEnableHeadingFocus: boolean;
     /**
-     * Länkelementens 'onclick'-event.
+     * Används för att fånga upp href till länken man har klickat på
      * @en The link elements' 'onclick' event.
      */
-    afOnClickLink: EventEmitter;
+    afOnClickLink: EventEmitter<ClickLink>;
     /**
      * När komponenten och slotsen är laddade och initierade så skickas detta eventet.
      * @en When the component and slots are loaded and initialized this event will trigger.
@@ -59,10 +56,7 @@ export declare class FormErrorList {
      * @en Sets focus on the heading.
      */
     afMSetHeadingFocus(): Promise<void>;
-    componentWillLoad(): void;
-    componentWillUpdate(): void;
     componentDidLoad(): void;
-    getLinks(update?: boolean): void;
     setHeadingFocus(): void;
     clickResponse(e: CustomEvent): void;
     render(): any;

package/dist/types/components/_form/form-error-list/form-error-list.types.d.ts

@@ -0,0 +1,3 @@
+export interface ClickLink {
+    id: string;
+}

package/dist/types/components/_form/form-fieldset/form-fieldset-validation.enum.d.ts

@@ -0,0 +1,6 @@
+export declare enum FormFieldsetValidation {
+    SUCCESS = "success",
+    ERROR = "error",
+    WARNING = "warning",
+    NEUTRAL = "neutral"
+}

package/dist/types/components/_form/form-fieldset/form-fieldset.d.ts

@@ -1,20 +1,21 @@
+import { FormFieldsetValidation } from './form-fieldset-validation.enum';
 /**
- * @slot default - Ska vara formulärselement. Till exempel digi-form-input.
+ * @slot default - Formulärkomponenter, till exempel digi-form-input eller digi-form-checkbox.
  * @swedishName Fältgruppering
  */
 export declare class FormFieldset {
     /**
-     * Legend-elementets text.
+     * Text till legend-elementet som fungerar som fältgruppens rubrik.
      * @en The legend text.
      */
     afLegend: string;
     /**
-     * Fieldset-elementets namn attribut.
+     * Text till name-attributet som ger fältgruppen ett programmatiskt namn.
      * @en The fieldset name attribute.
      */
     afName: string;
     /**
-     * Fieldset-elementets form attribut.
+     * Id för form-elementet som fältgruppen tillhör.
      * @en The fieldset form attribute.
      */
     afForm: string;
@@ -23,5 +24,23 @@ export declare class FormFieldset {
      * @en Input id attribute. Defaults to random string.
      */
     afId: string;
+    /**
+     * Sätter valideringsstatus. Kan vara 'success', 'error', 'warning', 'neutral' eller ingenting.
+     * @en Set input validation status
+     */
+    afValidation: FormFieldsetValidation;
+    /**
+     * Sätter valideringsmeddelandet
+     * @en Set input validation message
+     */
+    afValidationText: string;
+    /**
+     * Om värdet är true får felmeddelandet attributet role="alert".
+     * Om felet visas tillsammans med flera andra fel (till exempel efter servervalidering) ska värdet sättas till false.
+     * @en If the value is true, the error message gets the attribute role="alert".
+     * If the error is shown together with multiple errors (for example after server-side validation), the value should be set to false.
+     */
+    afErrorMessageIsAlert: boolean | string;
+    get errorMessageIsAlert(): boolean;
     render(): any;
 }