@gov-design-system-ce/components 4.0.8-rc23 → 4.1.0-rc03

package/dist/types/components/gov-control-group/gov-control-group.d.ts

@@ -1,4 +1,4 @@
-import { ControlGroupVariantType } from "./constants";
+import { ControlGroupColorType } from "./constants";
 export declare class GovControlGroup {
     private readonly h;
     constructor();
@@ -6,11 +6,15 @@ export declare class GovControlGroup {
     /**
      * Style variation of the content message.
      */
-    readonly variant: ControlGroupVariantType;
+    readonly color: ControlGroupColorType;
     /**
      * Specifies the display of the border between elements
      */
     readonly noBorder: boolean;
-    validateVariant(newValue: string): void;
+    /**
+     * Specifies the display of elements to full width
+     */
+    readonly fitContent: boolean;
+    validateColor(newValue: string): void;
     render(): any;
 }

package/dist/types/components/gov-cookiebar/constants.d.ts

@@ -1,6 +1,5 @@
-export declare const CookiebarClass: {
+export declare const CookieConsentClass: {
     root: string;
-    holder: string;
     content: string;
     actions: string;
     actionsPrimary: string;

package/dist/types/components/gov-dialog/constants.d.ts

@@ -0,0 +1,11 @@
+export declare const DialogClass: {
+    root: string;
+    dialog: string;
+    inner: string;
+    header: string;
+    title: string;
+    content: string;
+    close: string;
+    footer: string;
+    bodyFix: string;
+};

package/dist/types/components/gov-dialog/gov-dialog.d.ts

@@ -0,0 +1,67 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { Nullable } from '../../types/interfaces';
+export declare class GovDialog {
+    private h;
+    private readonly labelId;
+    private readonly contentId;
+    private hydrated;
+    private closeCtaRef?;
+    constructor();
+    host: HTMLGovDialogElement;
+    /**
+     * Attribute for dialog window display
+     */
+    open: boolean;
+    /**
+     * Attribute allowing blocking the dialog closing
+     */
+    blockClose: boolean;
+    /**
+     * Attribute allowing blocking the backdrop dialog closing
+     */
+    blockBackdropClose: boolean;
+    /**
+     * Role of dialog
+     */
+    role: Nullable<string>;
+    /**
+     * Used to change the HTML tag in the dialog label for correct semantic structure
+     */
+    readonly labelTag: string;
+    /**
+     * String of id's that indicate alternative labels elements
+     */
+    accessibleLabelledBy: string;
+    /**
+     * Indicates the id of a component that describes the dialog.
+     */
+    accessibleDescribedBy: string;
+    /**
+     * Adds accessible label for the dialog close button that is only shown for screen readers.
+     */
+    readonly accessibleCloseLabel: string;
+    /**
+     * A string of identifiers that indicate alternative label elements for closing the dialog window
+     */
+    accessibleCloseLabelledBy: string;
+    /**
+     * Emitted when dialog window closes.
+     */
+    govClose: EventEmitter<PointerEvent>;
+    watchOpen(newValue: boolean): void;
+    private showDialog;
+    private hideDialog;
+    componentDidRender(): Promise<void>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): any;
+    private onCloseHandler;
+    /**
+     * Sets the close button to focus
+     */
+    setFocus(): Promise<void>;
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    validateAccessibility(): Promise<void>;
+}

package/dist/types/components/gov-empty/constants.d.ts

@@ -1,6 +1,8 @@
+import { Sizes } from "../../core/constants/sizes";
+import { ValueOf } from "../../types/interfaces";
+export declare const EmptySizes: Pick<typeof Sizes, "_S" | "_M" | "_L">;
+export type EmptySizesType = `${ValueOf<typeof EmptySizes>}`;
 export declare const EmptyClass: {
     root: string;
-    icon: string;
-    container: string;
     content: string;
 };

package/dist/types/components/gov-empty/gov-empty.d.ts

@@ -1,6 +1,13 @@
+import { EmptySizesType } from './constants';
 export declare class GovEmpty {
     private h;
     constructor();
     host: HTMLGovEmptyElement;
+    /**
+     * Element size.
+     */
+    readonly size?: EmptySizesType;
+    validateSize(newValue: string): void;
+    componentWillLoad(): void;
     render(): any;
 }

package/dist/types/components/gov-error-code/constants.d.ts

@@ -1,6 +1,4 @@
 export declare const ErrorCodeClass: {
     root: string;
-    icon: string;
-    holder: string;
     content: string;
 };

package/dist/types/components/gov-form/autocomplete/constants.d.ts

@@ -1,10 +1,7 @@
 import { Sizes } from '../../../core/constants/sizes';
-import { Variants } from '../../../core/constants/variants';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormAutocompleteSizes: Pick<typeof Sizes, "_M" | "_L" | "_XL">;
+export declare const FormAutocompleteSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
 export type SizesType = `${ValueOf<typeof FormAutocompleteSizes>}`;
-export declare const FormAutocompleteVariants: Pick<typeof Variants, "PRIMARY" | "SECONDARY">;
-export type VariantType = `${ValueOf<typeof FormAutocompleteVariants>}`;
 export declare const FormAutocompleteClass: {
     root: string;
     list: string;

package/dist/types/components/gov-form/autocomplete/gov-form-autocomplete.d.ts

@@ -1,12 +1,14 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
-import { SizesType, VariantType } from './constants';
+import { SizesType } from './constants';
 import { FormAutocompleteEvent, GovFormAutocompleteItem } from './gov-form-autocomplete.types';
+import { Attributes } from "../../../helpers/Dom/attribute";
 export declare class GovFormAutocomplete {
     private inputRef?;
     private listRef?;
     private readonly listBoxId;
     private searchCallback;
     private templateResolver;
+    private attributeObserver;
     constructor();
     host: HTMLGovFormInputElement;
     /**
@@ -21,10 +23,6 @@ export declare class GovFormAutocomplete {
      * Custom input identifier.
      */
     readonly identifier: string;
-    /**
-     * Style variation of the form input.
-     */
-    readonly variant?: VariantType;
     /**
      * Indicates the entered value of child form element does conform to the format expected by the application.
      */
@@ -83,19 +81,6 @@ export declare class GovFormAutocomplete {
      * Custom message for when data is loaded
      */
     readonly messageLoading: string;
-    /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagDescribedBy: string;
-    /**
-     * Indicates the id of a component that labels the input.
-     */
-    readonly wcagLabelledBy: string;
-    /**
-     * Same as original parameter
-     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-owns
-     */
-    readonly wcagOwns: string;
     /**
      * Emitted when the input has focus.
      */
@@ -116,7 +101,7 @@ export declare class GovFormAutocomplete {
     processing: boolean;
     arrowCounter: number;
     list: GovFormAutocompleteItem[];
-    validateVariant(newValue: string): void;
+    inheritedAttributes: Attributes;
     validateSize(newValue: string): void;
     watchOptions(newValue: string | GovFormAutocompleteItem[]): void;
     private onArrowUp;
@@ -125,7 +110,10 @@ export declare class GovFormAutocomplete {
     private doSearch;
     private clearList;
     get isValueAccepted(): boolean;
+    componentDidLoad(): void;
     componentWillLoad(): void;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
     render(): any;
     private onFocusHandler;
     private onBlurHandler;

package/dist/types/components/gov-form/checkbox/constants.d.ts

@@ -1,9 +1,10 @@
 import { Sizes } from '../../../core/constants/sizes';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormCheckboxSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L">;
+export declare const FormCheckboxSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
 export type FormCheckboxSizesType = `${ValueOf<typeof FormCheckboxSizes>}`;
 export declare const FormCheckboxClass: {
     root: string;
     check: string;
+    indeterminate: string;
     label: string;
 };

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

@@ -1,10 +1,12 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
 import { FormCheckboxSizesType } from "./constants";
 import { FormCheckboxEvent } from "./gov-form-checkbox.types";
+import { Attributes } from "../../../helpers/Dom/attribute";
 export declare class GovFormCheckbox {
     private readonly h;
     private f;
     private inputRef?;
+    private attributeObserver;
     private readonly checkboxId;
     private hydrated;
     constructor();
@@ -24,9 +26,12 @@ export declare class GovFormCheckbox {
     readonly required: boolean;
     /**
      * Makes the checkbox component disabled.
-     * This prevents users from being able to interact with the checkbox, and conveys its inactive state to assistive technologies.
      */
     readonly disabled: boolean;
+    /**
+     * Same as original parameter (https://developer.mozilla.org/en-US/docs/Web/CSS/:indeterminate)
+     */
+    readonly indeterminate: boolean;
     /**
      * Name of the checkbox.
      */
@@ -47,14 +52,6 @@ export declare class GovFormCheckbox {
      * Indicates the entered value does not conform to the format expected by the application.
      */
     readonly invalid: boolean;
-    /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagDescribedBy: string;
-    /**
-     * Indicates the id of a component that labels the input.
-     */
-    readonly wcagLabelledBy: string;
     /**
      * Emitted when the checkbox has focus.
      */
@@ -69,9 +66,14 @@ export declare class GovFormCheckbox {
     govChange: EventEmitter<FormCheckboxEvent>;
     validateSize(newValue: string): void;
     watchControlAttrs(): void;
+    inheritedAttributes: Attributes;
     private passControlAttrs;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
     componentDidRender(): Promise<void>;
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
     render(): any;
     private onFocusHandler;
     private onBlurHandler;
@@ -81,8 +83,4 @@ export declare class GovFormCheckbox {
      * Returns the reference of the native element
      */
     getRef(): Promise<HTMLInputElement>;
-    /**
-     * Validate the WCAG attributes of the component
-     */
-    validateWcag(): Promise<void>;
 }

package/dist/types/components/gov-form/file/constants.d.ts

@@ -1,9 +1,6 @@
 export declare const FormFileClass: {
     root: string;
     area: string;
-    label: string;
     input: string;
-    list: string;
-    item: string;
     attachments: string;
 };

package/dist/types/components/gov-form/file/gov-form-file.d.ts

@@ -1,11 +1,13 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
 import { GovFormFileEvent, GovFormFileItem } from "./gov-form-file.types";
+import { Attributes } from "../../../helpers/Dom/attribute";
 export declare class GovFormFile {
     private f;
     private readonly h;
     private areaRef?;
     private inputRef?;
     private readonly fileId;
+    private attributeObserver;
     constructor();
     host: HTMLGovFormFileElement;
     /**
@@ -73,22 +75,14 @@ export declare class GovFormFile {
      * Description of the list of attachments
      */
     readonly attachmentsLabel: string;
-    /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagDescribedBy: string;
-    /**
-     * Indicates the id of a component that labels the input.
-     */
-    readonly wcagLabelledBy: string;
     /**
      * Adds accessible label for the remove button that is only shown for screen readers.
      */
-    readonly wcagRemoveLabel: string;
+    readonly accessibleRemoveLabel: string;
     /**
      * Adds accessible label for the list of attachments.
      */
-    readonly wcagAttachmentsLabel: string;
+    readonly accessibleAttachmentsLabel: string;
     /**
      * Emitted when the File has focus.
      */
@@ -109,14 +103,19 @@ export declare class GovFormFile {
      * Called when a file is removed from the list
      */
     govRemoveFile: EventEmitter<GovFormFileEvent>;
-    files: GovFormFileItem[];
     watchControlAttrs(): void;
+    files: GovFormFileItem[];
+    inheritedAttributes: Attributes;
     private passControlAttrs;
     private registerListeners;
     preventDefaults(e: any): void;
     handleDrop(e: DragEvent): void;
     private validateFiles;
+    componentDidLoad(): void;
+    componentWillLoad(): void;
     componentDidRender(): Promise<void>;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
     render(): any;
     private onRemoveFileHandler;
     private onFocusHandler;
@@ -134,8 +133,4 @@ export declare class GovFormFile {
      * Remove all files from component state
      */
     reset(): Promise<void>;
-    /**
-     * Validate the WCAG attributes of the component
-     */
-    validateWcag(): Promise<void>;
 }

package/dist/types/components/gov-form/input/constants.d.ts

@@ -1,10 +1,7 @@
 import { Sizes } from '../../../core/constants/sizes';
-import { Variants } from '../../../core/constants/variants';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormInputSizes: Pick<typeof Sizes, "_S" | "_M" | "_L" | "_XL">;
+export declare const FormInputSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
 export type FormInputSizesType = `${ValueOf<typeof FormInputSizes>}`;
-export declare const FormInputVariants: Pick<typeof Variants, "PRIMARY" | "SECONDARY">;
-export type FormInputVariantType = `${ValueOf<typeof FormInputVariants>}`;
 export declare enum InputTypes {
     COLOR = "color",
     DATE = "date",

package/dist/types/components/gov-form/input/gov-form-input.d.ts

@@ -1,12 +1,14 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
-import { FormInputSizesType, FormInputVariantType, InputType, Type } from "./constants";
+import { FormInputSizesType, InputType, Type } from "./constants";
 import { FormInputEvent } from "./gov-form-input.types";
 import { Nullable } from "../../../types/interfaces";
+import { Attributes } from "../../../helpers/Dom/attribute";
 export declare class GovFormInput {
     private f;
     private readonly h;
     private inputRef?;
     private readonly inputId;
+    private attributeObserver;
     constructor();
     host: HTMLGovFormInputElement;
     /**
@@ -17,10 +19,6 @@ export declare class GovFormInput {
      * Custom input identifier.
      */
     readonly identifier: string;
-    /**
-     * Style variation of the form input.
-     */
-    readonly variant?: FormInputVariantType;
     /**
      * Indicates the entered value of child form element does conform to the format expected by the application.
      */
@@ -52,7 +50,6 @@ export declare class GovFormInput {
     readonly required: boolean;
     /**
      * Makes the input component disabled.
-     * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.
      */
     readonly disabled: boolean;
     /**
@@ -114,25 +111,13 @@ export declare class GovFormInput {
      */
     readonly invalid: boolean;
     /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagDescribedBy: string;
-    /**
-     * Indicates the id of a component that labels the input.
-     */
-    readonly wcagLabelledBy: string;
-    /**
-     * Indicates the id of a component that describes the input.
+     * Accessible text for password display
      */
-    readonly wcagOwns: string;
+    readonly accessibleShowPasswordLabel = "Zobrazit heslo";
     /**
-     * Indicates whether inputting text could trigger display of one or more predictions of the user's intended value.
+     * Accessible text to hide the password
      */
-    readonly wcagAutocomplete: string;
-    /**
-     *  Attribute is set on an element to indicate if a control is expanded or collapsed
-     */
-    readonly wcagExpanded: boolean;
+    readonly accessibleHidePasswordLabel = "Skr\u00FDt heslo";
     /**
      * Emitted when the input has focus.
      */
@@ -158,13 +143,16 @@ export declare class GovFormInput {
      */
     govKeyDown: EventEmitter<FormInputEvent>;
     focused: boolean;
-    validateVariant(newValue: string): void;
+    showPassword: boolean;
     validateSize(newValue: string): void;
     watchControlAttrs(): void;
+    inheritedAttributes: Attributes;
     private passControlAttrs;
-    componentWillLoad(): void;
-    componentDidRender(): Promise<void>;
     componentDidLoad(): void;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    disconnectedCallback(): void;
     render(): any;
     private onFocusHandler;
     private onBlurHandler;
@@ -187,8 +175,4 @@ export declare class GovFormInput {
      * Returns an instance of the native html input element
      */
     getRef(): Promise<HTMLInputElement>;
-    /**
-     * Validate the WCAG attributes of the component
-     */
-    validateWcag(): Promise<void>;
 }

package/dist/types/components/gov-form/message/constants.d.ts

@@ -1,9 +1,11 @@
-import { Variants } from '../../../core/constants/variants';
+import { Colors } from '../../../core/constants/colors';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormMessageVariants: Pick<typeof Variants, "SECONDARY" | "SUCCESS" | "ERROR" | "WARNING">;
-export type FormMessageVariantType = `${ValueOf<typeof FormMessageVariants>}`;
+import { Sizes } from "../../../core/constants/sizes";
+export declare const FormMessageColors: Pick<typeof Colors, "NEUTRAL" | "SUCCESS" | "ERROR" | "WARNING">;
+export type FormMessageColorType = `${ValueOf<typeof FormMessageColors>}`;
+export declare const FormMessageSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
+export type FormMessageSizesTypes = `${ValueOf<typeof FormMessageSizes>}`;
 export declare const FormMessageClass: {
     root: string;
     content: string;
-    icon: string;
 };

package/dist/types/components/gov-form/message/gov-form-message.d.ts

@@ -1,4 +1,4 @@
-import { FormMessageVariantType } from './constants';
+import { FormMessageSizesTypes, FormMessageColorType } from './constants';
 import { GovHost } from '../../../helpers/Dom/template.types';
 export declare class GovFormMessage {
     h: GovHost;
@@ -8,12 +8,16 @@ export declare class GovFormMessage {
     /**
      * Style variation of the message.
      */
-    readonly variant?: FormMessageVariantType;
-    validateVariant(newValue: string): void;
+    readonly color?: FormMessageColorType;
+    /**
+     * Message's size.
+     */
+    readonly size?: FormMessageSizesTypes;
+    validateColor(newValue: string): void;
     componentWillLoad(): void;
     render(): any;
     /**
-     * Returns unique identfiier of message
+     * Returns unique identifier of message
      */
     identifier(): Promise<string>;
 }

package/dist/types/components/gov-form/multiselect/constants.d.ts

@@ -1,10 +1,7 @@
 import { Sizes } from '../../../core/constants/sizes';
-import { Variants } from '../../../core/constants/variants';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormMultiselectSizes: Pick<typeof Sizes, "_M" | "_L" | "_XL">;
+export declare const FormMultiselectSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
 export type FormMultiselectSizesType = `${ValueOf<typeof FormMultiselectSizes>}`;
-export declare const FormMultiselectVariants: Pick<typeof Variants, "PRIMARY" | "SECONDARY">;
-export type FormMultiselectVariantType = `${ValueOf<typeof FormMultiselectVariants>}`;
 export declare const FormMultiSelectClass: {
     root: string;
     wrap: string;

package/dist/types/components/gov-form/multiselect/gov-form-multi-select.d.ts

@@ -1,11 +1,13 @@
 import { EventEmitter } from '../../../stencil-public-runtime';
-import { FormMultiselectSizesType, FormMultiselectVariantType } from './constants';
+import { FormMultiselectSizesType } from './constants';
 import { FormMultiselectEvent, GovFormMultiSelectItem, GovFormMultiSelectSelectedItem } from './gov-form-multi-select.types';
+import { Attributes } from "../../../helpers/Dom/attribute";
 export declare class GovFormMultiSelect {
     private f;
     private readonly h;
     private selectRef?;
     private autocompleteRef?;
+    private attributeObserver;
     private readonly selectId;
     private readonly listId;
     constructor();
@@ -26,10 +28,6 @@ export declare class GovFormMultiSelect {
      * Custom select placeholder.
      */
     readonly placeholder: string;
-    /**
-     * Style variation of the form select.
-     */
-    readonly variant?: FormMultiselectVariantType;
     /**
      * Select’s size.
      */
@@ -68,18 +66,6 @@ export declare class GovFormMultiSelect {
      * Custom message for when data is loaded
      */
     readonly messageLoading: string;
-    /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagDescribedBy: string;
-    /**
-     * Indicates the id of a component that labels the input.
-     */
-    readonly wcagLabelledBy: string;
-    /**
-     * Indicates the id of a component that describes the input.
-     */
-    readonly wcagOwns: string;
     /**
      * Emitted when the select has focus.
      */
@@ -104,13 +90,16 @@ export declare class GovFormMultiSelect {
     valueState: string;
     selectedOptionsState: GovFormMultiSelectSelectedItem[];
     optionsState: GovFormMultiSelectItem[];
-    validateVariant(newValue: string): void;
     validateSize(newValue: string): void;
     watchOptions(newValue: string | GovFormMultiSelectItem[]): void;
     watchValue(newValue: string | GovFormMultiSelectItem[]): void;
     watchControlAttrs(): void;
+    inheritedAttributes: Attributes;
     private passControlAttrs;
+    componentDidLoad(): void;
     componentWillLoad(): void;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
     private getAvailableOptions;
     private initAutocomplete;
     private selectedValueIndex;
@@ -118,7 +107,6 @@ export declare class GovFormMultiSelect {
     private getOption;
     private selectOption;
     private removeOption;
-    componentDidLoad(): Promise<void>;
     componentDidRender(): Promise<void>;
     render(): any;
     private onFocusHandler;
@@ -138,8 +126,4 @@ export declare class GovFormMultiSelect {
      * Returns an instance of the native html select element
      */
     getRef(): Promise<HTMLSelectElement>;
-    /**
-     * Validate the WCAG attributes of the component
-     */
-    validateWcag(): Promise<void>;
 }

package/dist/types/components/gov-form/radio/constants.d.ts

@@ -1,10 +1,9 @@
 import { Sizes } from '../../../core/constants/sizes';
 import { ValueOf } from '../../../types/interfaces';
-export declare const FormRadioSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L">;
+export declare const FormRadioSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
 export type FormRadioSizesType = `${ValueOf<typeof FormRadioSizes>}`;
 export declare const FormRadioClass: {
     root: string;
-    holder: string;
     input: string;
     indicator: string;
     label: string;