@designsystem-se/af 38.1.0 → 38.2.1-beta.0

package/dist/esm/{typography-variation.enum-c85d7857.js → typography-variation.enum-fdda731c.js}

@@ -49,13 +49,6 @@ var DialogVariation;
     DialogVariation["SECONDARY"] = "secondary";
 })(DialogVariation || (DialogVariation = {}));
 
-var FooterCardVariation;
-(function (FooterCardVariation) {
-    FooterCardVariation["NONE"] = "none";
-    FooterCardVariation["ICON"] = "icon";
-    FooterCardVariation["BORDER"] = "border";
-})(FooterCardVariation || (FooterCardVariation = {}));
-
 var FooterVariation;
 (function (FooterVariation) {
     FooterVariation["LARGE"] = "large";
@@ -72,6 +65,34 @@ var FormErrorListHeadingLevel;
     FormErrorListHeadingLevel["H6"] = "h6";
 })(FormErrorListHeadingLevel || (FormErrorListHeadingLevel = {}));
 
+var FormInputMode;
+(function (FormInputMode) {
+    FormInputMode["DEFAULT"] = "";
+    FormInputMode["NONE"] = "none";
+    FormInputMode["TEXT"] = "text";
+    FormInputMode["DECIMAL"] = "decimal";
+    FormInputMode["NUMERIC"] = "numeric";
+    FormInputMode["TEL"] = "tel";
+    FormInputMode["SEARCH"] = "search";
+    FormInputMode["EMAIL"] = "email";
+    FormInputMode["URL"] = "url";
+})(FormInputMode || (FormInputMode = {}));
+
+var FormInputValidation;
+(function (FormInputValidation) {
+    FormInputValidation["SUCCESS"] = "success";
+    FormInputValidation["ERROR"] = "error";
+    FormInputValidation["WARNING"] = "warning";
+    FormInputValidation["NEUTRAL"] = "neutral";
+})(FormInputValidation || (FormInputValidation = {}));
+
+var FormInputVariation;
+(function (FormInputVariation) {
+    FormInputVariation["SMALL"] = "small";
+    FormInputVariation["MEDIUM"] = "medium";
+    FormInputVariation["LARGE"] = "large";
+})(FormInputVariation || (FormInputVariation = {}));
+
 var FormFieldsetValidation;
 (function (FormFieldsetValidation) {
     FormFieldsetValidation["SUCCESS"] = "success";
@@ -177,32 +198,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 LogoColor;
-(function (LogoColor) {
-    LogoColor["PRIMARY"] = "primary";
-    LogoColor["SECONDARY"] = "secondary";
-})(LogoColor || (LogoColor = {}));
-
 var NotificationAlertHeadingLevel;
 (function (NotificationAlertHeadingLevel) {
     NotificationAlertHeadingLevel["H1"] = "h1";
@@ -268,4 +263,4 @@ var TypographyVariation;
     TypographyVariation["LARGE"] = "large";
 })(TypographyVariation || (TypographyVariation = {}));
 
-export { BadgeNotificationType as B, CalendarDatepickerValidation as C, DialogHeadingLevel as D, ErrorPageStatusCodes as E, FooterCardVariation as F, HeaderCenterContentWidth as H, InfoCardMultiContainerHeadingLevel as I, LayoutBlockContainer as L, NotificationAlertHeadingLevel as N, TitleLogoVariation as T, CodeBlockLanguage as a, DialogSize as b, DialogVariation as c, FooterVariation as d, FormErrorListHeadingLevel as e, FormFieldsetValidation as f, FormRadiobuttonLayout as g, FormRadiobuttonValidation as h, FormRadiobuttonVariation as i, FormReceiptHeadingLevel as j, FormReceiptType as k, FormReceiptVariation as l, FormSelectFilterValidation as m, InfoCardMultiHeadingLevel as n, InfoCardMultiVariation as o, InfoCardHeadingLevel as p, LayoutContainerVariation as q, LayoutContainerMaxWidth as r, LogoColor as s, NotificationAlertSize as t, NotificationAlertVariation as u, ToolsFeedbackHeadingLevel as v, ToolsFeedbackType as w, FeedbackVariation as x, TypographyVariation as y };
+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, FormInputMode as e, FormInputValidation as f, FormInputVariation as g, FormFieldsetValidation as h, FormRadiobuttonLayout as i, FormRadiobuttonValidation as j, FormRadiobuttonVariation as k, FormReceiptHeadingLevel as l, FormReceiptType as m, FormReceiptVariation as n, FormSelectFilterValidation as o, InfoCardMultiHeadingLevel as p, InfoCardMultiVariation as q, InfoCardHeadingLevel as r, NotificationAlertSize as s, NotificationAlertVariation as t, ToolsFeedbackHeadingLevel as u, ToolsFeedbackType as v, FeedbackVariation as w, TypographyVariation as x };

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

@@ -141,6 +141,16 @@ export declare class CalendarDatepicker {
      */
     afErrorMessageIsAlert: boolean | string;
     get errorMessageIsAlert(): boolean;
+    /**
+     * Sätt denna till true om formuläret innehåller fler obligatoriska fält än valfria.
+     * @en Set this to true if the form contains more required fields than optional fields.
+     */
+    afAnnounceIfOptional: boolean;
+    /**
+     * Sätter text för afAnnounceIfOptional.
+     * @en Set text for afAnnounceIfOptional.
+     */
+    afAnnounceIfOptionalText: string;
     /**
      * 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

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

@@ -116,8 +116,11 @@ export declare class FormCheckbox {
      */
     afAutofocus: boolean;
     /**
-     * Tabindex
-     * @deprecated Denna prop kommer att tas bort i slutet av augusti
+     * @ignore
+     * Sätter specifikt tabindex för input. Används till vår komponent Multifiter
+     * där vi vill manipulera tabbordningen för att underlätta navigeringen för tangentbordsanvändare
+     * @en Set specific tabindex for input. Used in our component Multifilter
+     * where we want to manipulate the tab order to facilitate navigation for keyboard users.
      */
     afTabIndex: number;
     /**

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

@@ -50,11 +50,14 @@ export declare class FormErrorList {
      * @en When the component and slots are loaded and initialized this event will trigger.
      */
     afOnReady: EventEmitter;
+    private observer;
     /**
      * Sätter fokus på rubriken.
      * @en Sets focus on the heading.
      */
     afMSetHeadingFocus(): Promise<void>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     componentDidLoad(): void;
     setHeadingFocus(): void;
     clickResponse(e: CustomEvent): void;

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

@@ -20,6 +20,10 @@ export declare class FormSelectFilter {
     private _toggleButton;
     private _submitButton;
     private _searchQuery;
+    /** True when `value` was set from outside (e.g. Angular CVA) — then value is selection master. */
+    private _valueIsMaster;
+    /** Guards internal `value` writes so they don't flip `_valueIsMaster`. */
+    private _updatingValueInternally;
     /**
      * En valfri beskrivningstext.
      * @en An optional description text.
@@ -71,9 +75,14 @@ export declare class FormSelectFilter {
     sortAlphabetically: boolean;
     /**
      * @ignore
+     * Propertyn `value` finns inte dokumenterad på komponentens sida på dokumentationswebben, utan
+     * är endast till för att användas tillsammans med Angulars Control Value Accessors (CVA).
+     * Används CVA för att hantera komponentens värden så ska inte afListItems användas för att
+     * påverka vilka val som är gjorda eller ej.
+     * Exempel på båda sätten att hantera datat finns i Angular Playground.
      */
     value: IListItem[];
-    onValueChanged(value: IListItem[]): void;
+    onValueChanged(newValue: IListItem[] | string): void;
     /**
      * Sätts till true om det ska gå att välja flera val från listan.
      * @en Set to true if you should be able to choose multiple items from the list.
@@ -201,7 +210,18 @@ export declare class FormSelectFilter {
      * @en Listens for when focus is set on the custom element and propagates it down to the toggle butto.
      */
     focusOnElement(): void;
-    debounce(func: any, timeout?: number): (...args: any[]) => void;
+    componentWillLoad(): void;
+    private bootstrapInitialValue;
+    /**
+     * Keep `value` and `afListItems[].selected` in sync.
+     * - If `value` was set externally (`_valueIsMaster`), value wins on list updates.
+     * - Otherwise selection is seeded from `afListItems[].selected` (React/vanilla data-as-master).
+     * Does not emit `afOnSelect` — that is reserved for user interaction so Angular Control Value Accessors
+     * does not get feedback loops on prop sync.
+     */
+    syncValueAndSelectedListItems(whereDidTheChangeComeFrom: 'valueChange' | 'afListItemsChange'): void;
+    private applyValueToListItems;
+    private setValueInternally;
     setClosed(focusToggleButton?: boolean): void;
     setScroll(scrollY: number): void;
     setOpen(): void;
@@ -210,7 +230,6 @@ export declare class FormSelectFilter {
     toggleDropdown(): void;
     inputItem(identifier: any, index: any): HTMLInputElement;
     emitFilterClosedEvent(): void;
-    componentWillLoad(): void;
     setFocusItem(): void;
     setFocusSearch(): void;
     incrementFocusItem(): void;

package/dist/types/components.d.ts

@@ -510,6 +510,16 @@ export namespace Components {
      * @valueAccessor TextValueAccessor
      */
     interface DigiCalendarDatepicker {
+        /**
+          * Sätt denna till true om formuläret innehåller fler obligatoriska fält än valfria.
+          * @en Set this to true if the form contains more required fields than optional fields.
+         */
+        "afAnnounceIfOptional": boolean;
+        /**
+          * Sätter text för afAnnounceIfOptional.
+          * @en Set text for afAnnounceIfOptional.
+         */
+        "afAnnounceIfOptionalText": string;
         /**
           * Aria-label till knappen som stänger kalendern
           * @en Aria-label for the button that closes the calendar
@@ -1122,8 +1132,8 @@ export namespace Components {
          */
         "afRequired": boolean;
         /**
-          * Tabindex
-          * @deprecated Denna prop kommer att tas bort i slutet av augusti
+          * @ignore Sätter specifikt tabindex för input. Används till vår komponent Multifiter där vi vill manipulera tabbordningen för att underlätta navigeringen för tangentbordsanvändare
+          * @en Set specific tabindex for input. Used in our component Multifilter  where we want to manipulate the tab order to facilitate navigation for keyboard users.
          */
         "afTabIndex": number;
         /**
@@ -2193,7 +2203,7 @@ export namespace Components {
          */
         "sortAlphabetically": boolean;
         /**
-          * @ignore
+          * @ignore Propertyn `value` finns inte dokumenterad på komponentens sida på dokumentationswebben, utan är endast till för att användas tillsammans med Angulars Control Value Accessors (CVA). Används CVA för att hantera komponentens värden så ska inte afListItems användas för att påverka vilka val som är gjorda eller ej. Exempel på båda sätten att hantera datat finns i Angular Playground.
          */
         "value": IListItem[];
     }
@@ -11941,6 +11951,16 @@ declare namespace LocalJSX {
      * @valueAccessor TextValueAccessor
      */
     interface DigiCalendarDatepicker {
+        /**
+          * Sätt denna till true om formuläret innehåller fler obligatoriska fält än valfria.
+          * @en Set this to true if the form contains more required fields than optional fields.
+         */
+        "afAnnounceIfOptional"?: boolean;
+        /**
+          * Sätter text för afAnnounceIfOptional.
+          * @en Set text for afAnnounceIfOptional.
+         */
+        "afAnnounceIfOptionalText"?: string;
         /**
           * Aria-label till knappen som stänger kalendern
           * @en Aria-label for the button that closes the calendar
@@ -12623,8 +12643,8 @@ declare namespace LocalJSX {
          */
         "afRequired"?: boolean;
         /**
-          * Tabindex
-          * @deprecated Denna prop kommer att tas bort i slutet av augusti
+          * @ignore Sätter specifikt tabindex för input. Används till vår komponent Multifiter där vi vill manipulera tabbordningen för att underlätta navigeringen för tangentbordsanvändare
+          * @en Set specific tabindex for input. Used in our component Multifilter  where we want to manipulate the tab order to facilitate navigation for keyboard users.
          */
         "afTabIndex"?: number;
         /**
@@ -13929,7 +13949,7 @@ declare namespace LocalJSX {
          */
         "sortAlphabetically"?: boolean;
         /**
-          * @ignore
+          * @ignore Propertyn `value` finns inte dokumenterad på komponentens sida på dokumentationswebben, utan är endast till för att användas tillsammans med Angulars Control Value Accessors (CVA). Används CVA för att hantera komponentens värden så ska inte afListItems användas för att påverka vilka val som är gjorda eller ej. Exempel på båda sätten att hantera datat finns i Angular Playground.
          */
         "value"?: IListItem[];
     }