@gov-design-system-ce/components 4.2.9 → 4.6.0

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

@@ -0,0 +1,8 @@
+import { Sizes } from '../../../core/constants/sizes';
+import { ValueOf } from '../../../types/interfaces';
+export declare const FormSelectSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
+export type FormSelectSizesType = `${ValueOf<typeof FormSelectSizes>}`;
+export declare const FormSelectClass: {
+    root: string;
+    icon: string;
+};

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

@@ -0,0 +1,89 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+import { FormSelectSizesType } from './constants';
+import { FormSelectEvent, FormSelectOption } from './gov-form-select.types';
+import { Attributes } from "../../../helpers/Dom/attribute";
+export declare class GovFormSelect {
+    private f;
+    private readonly h;
+    private selectRef?;
+    private attributeObserver;
+    private readonly selectId;
+    constructor();
+    host: HTMLGovFormSelectElement;
+    /**
+     * Value of select
+     */
+    value: string;
+    /**
+     * Options of select
+     */
+    options?: string | FormSelectOption[];
+    /**
+     * Custom select identifier.
+     */
+    readonly identifier: string;
+    /**
+     * Select’s size.
+     */
+    readonly size?: FormSelectSizesType;
+    /**
+     * Name of the select.
+     */
+    readonly name: string;
+    /**
+     * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.
+     * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.
+     */
+    readonly required: boolean;
+    /**
+     * Indicates the entered value of child form element does conform to the format expected by the application.
+     */
+    readonly success: boolean;
+    /**
+     * Makes the select component disabled.
+     * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.
+     */
+    readonly disabled: boolean;
+    /**
+     * Indicates the entered value does not conform to the format expected by the application.
+     */
+    readonly invalid: boolean;
+    /**
+     * Emitted when the select has focus.
+     */
+    govFocus: EventEmitter<FormSelectEvent>;
+    /**
+     * Emitted when the select loses focus.
+     */
+    govBlur: EventEmitter<FormSelectEvent>;
+    /**
+     * Emitted when the select change value.
+     */
+    govChange: EventEmitter<FormSelectEvent>;
+    focused: boolean;
+    optionsState: FormSelectOption[];
+    validateSize(newValue: string): void;
+    watchOptions(newValue: string | FormSelectOption[]): void;
+    watchControlAttrs(): void;
+    watchValue(): void;
+    inheritedAttributes: Attributes;
+    private passControlAttrs;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidRender(): Promise<void>;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    private markSelectedValue;
+    render(): any;
+    private onFocusHandler;
+    private onBlurHandler;
+    private onChangeHandler;
+    /**
+     * Returns the current state of the component
+     */
+    setFocus(options?: FocusOptions): Promise<void>;
+    /**
+     * Returns an instance of the native html select element
+     */
+    getRef(): Promise<HTMLSelectElement>;
+}

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

@@ -0,0 +1,9 @@
+import { GovBaseEvent } from "../../../types/event.types";
+export interface FormSelectEvent extends GovBaseEvent {
+    value: string;
+}
+export interface FormSelectOption {
+    value: string;
+    label?: string;
+    disabled?: boolean;
+}

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

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

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

@@ -0,0 +1,81 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+import { FormSwitchSizesType } from "./constants";
+import { FormSwitchEvent } from "./gov-form-switch.types";
+import { Attributes } from "../../../helpers/Dom/attribute";
+export declare class GovFormSwitch {
+    private readonly h;
+    private f;
+    private inputRef?;
+    private attributeObserver;
+    private readonly checkboxId;
+    private hydrated;
+    constructor();
+    host: HTMLGovFormSwitchElement;
+    /**
+     * Value of switch
+     */
+    readonly value: string;
+    /**
+     * When you can't use the form label.
+     */
+    readonly noLabel: boolean;
+    /**
+     * Switch button state
+     */
+    checked: boolean;
+    /**
+     * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.
+     */
+    readonly required: boolean;
+    /**
+     * Makes the switch component disabled.
+     */
+    readonly disabled: boolean;
+    /**
+     * Name of the switch.
+     */
+    readonly name: string;
+    /**
+     * Switch's size.
+     */
+    readonly size?: FormSwitchSizesType;
+    /**
+     * Custom switch identifier.
+     */
+    readonly identifier: string;
+    /**
+     * Indicates the entered value does not conform to the format expected by the application.
+     */
+    readonly invalid: boolean;
+    /**
+     * Emitted when the switch has focus.
+     */
+    govFocus: EventEmitter<FormSwitchEvent>;
+    /**
+     * Emitted when the switch loses focus.
+     */
+    govBlur: EventEmitter<FormSwitchEvent>;
+    /**
+     * Emitted when the switch change value.
+     */
+    govChange: EventEmitter<FormSwitchEvent>;
+    validateSize(newValue: string): void;
+    watchDisabled(): void;
+    inheritedAttributes: Attributes;
+    private passControlAttrs;
+    componentDidLoad(): void;
+    componentWillLoad(): void;
+    disconnectedCallback(): void;
+    componentDidRender(): Promise<void>;
+    connectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    render(): any;
+    private onClickHandler;
+    private onFocusHandler;
+    private onBlurHandler;
+    private onChangeHandler;
+    /**
+     * Returns the reference of the native element
+     */
+    getRef(): Promise<HTMLInputElement>;
+}

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

@@ -0,0 +1,5 @@
+import { GovBaseEvent } from "../../../types/event.types";
+export interface FormSwitchEvent extends GovBaseEvent {
+    checked: boolean;
+    value: string;
+}

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

@@ -0,0 +1,10 @@
+import { Sizes } from "../../core/constants/sizes";
+import { ValueOf } from "../../types/interfaces";
+export declare const GridSizes: typeof Sizes;
+export type GridSizesType = `${ValueOf<typeof GridSizes>}`;
+export declare const GridClass: {
+    root: string;
+};
+export declare const GridItemClass: {
+    root: string;
+};

package/dist/dist/types/components/gov-grid/gov-grid-item.d.ts

@@ -0,0 +1,46 @@
+export declare class GovGridItem {
+    private h;
+    constructor();
+    readonly host: HTMLGovGridItemElement;
+    /**
+     * Cell size as a fraction of 1/12 of the grid size
+     */
+    readonly column: string;
+    /**
+     * Cell size for SM media query and up as a fraction of 12 of the grid size
+     */
+    readonly columnSm?: string;
+    /**
+     * Cell size for MD media query and up as a fraction of 12 of the grid size
+     */
+    readonly columnMd?: string;
+    /**
+     * Cell size for LG media query and up as a fraction of 12 of the grid size
+     */
+    readonly columnLg?: string;
+    /**
+     * Cell size for XL media query and up as a fraction of 12 of the grid size
+     */
+    readonly columnXl?: string;
+    /**
+     * Connects rows in the grid
+     */
+    readonly row: string;
+    /**
+     * Cell size for SM media query and up as a fraction of 12 of the grid size
+     */
+    readonly rowSm?: string;
+    /**
+     * Cell size for MD media query and up as a fraction of 12 of the grid size
+     */
+    readonly rowMd?: string;
+    /**
+     * Cell size for LG media query and up as a fraction of 12 of the grid size
+     */
+    readonly rowLg?: string;
+    /**
+     * Cell size for XL media query and up as a fraction of 12 of the grid size
+     */
+    readonly rowXl?: string;
+    render(): any;
+}

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

@@ -0,0 +1,19 @@
+import { GridSizesType } from './constants';
+export declare class GovGrid {
+    private h;
+    constructor();
+    host: HTMLGovGridElement;
+    /**
+     * Horizontal align of cells
+     */
+    alignItems?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * Vertical align of cells
+     */
+    justifyItems?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * The gap property creates consistent spacing between flex items in the container.
+     */
+    gap?: GridSizesType;
+    render(): any;
+}

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

@@ -0,0 +1,18 @@
+import { ValueOf } from '../../types/interfaces';
+import { Colors } from '../../core/constants/colors';
+import { Sizes } from "../../core/constants/sizes";
+export declare const IconSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL" | "_2XL" | "_3XL" | "_4XL" | "_5XL">;
+export type IconSizesType = `${ValueOf<typeof IconSizes>}`;
+export declare const IconColors: Pick<typeof Colors, "PRIMARY" | "NEUTRAL" | "SECONDARY" | "SUCCESS" | "ERROR" | "WARNING" | "DEFAULT" | "DISABLED" | "BLACK" | "WHITE">;
+export type IconColorType = `${ValueOf<typeof IconColors>}`;
+declare enum Types {
+    BASIC = "basic",
+    COMPLEX = "complex",
+    COLORED = "colored"
+}
+export type Type = `${ValueOf<typeof Types>}`;
+export declare const IconClass: {
+    root: string;
+    holder: string;
+};
+export {};

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

@@ -0,0 +1,34 @@
+import { type IconColorType, IconSizesType } from "./constants";
+export declare class GovIcon {
+    private h;
+    private intersectionObserver;
+    constructor();
+    host: HTMLGovIconElement;
+    /**
+     * Icon size
+     */
+    readonly size?: IconSizesType;
+    /**
+     * Icon color
+     */
+    readonly color?: IconColorType;
+    /**
+     * Name of icon in folder
+     */
+    name: string;
+    /**
+     * Type (folder) of icon
+     */
+    type: string;
+    private visible;
+    private error;
+    validateSize(newValue: string): void;
+    validateColor(newValue: string): void;
+    private loadIconPathData;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): Promise<void>;
+    private waitUntilVisible;
+    private loadIcon;
+    render(): any;
+}

package/dist/dist/types/components/gov-icon/helpers.d.ts

@@ -0,0 +1,6 @@
+import { Nullable } from "../../types/interfaces";
+export type IconType = {
+    type: string;
+    name: string;
+};
+export declare const prepareIconFormat: (value: string) => Nullable<IconType>;

package/dist/dist/types/components/gov-icon/list.d.ts

@@ -0,0 +1,3 @@
+export declare const complexIcons: string[];
+export declare const componentsIcons: string[];
+export declare const icons: string[];

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

@@ -0,0 +1,16 @@
+import { Colors } from '../../core/constants/colors';
+import { ValueOf } from '../../types/interfaces';
+export declare const InfobarColors: Pick<typeof Colors, "PRIMARY" | "NEUTRAL" | "SECONDARY" | "SUCCESS" | "ERROR" | "WARNING">;
+export type ColorType = `${ValueOf<typeof InfobarColors>}`;
+export declare enum InfobarType {
+    BOLD = "bold",
+    SUBTLE = "subtle"
+}
+export type InfobarTypesType = `${ValueOf<typeof InfobarType>}`;
+export declare const InfobarClass: {
+    root: string;
+    section: string;
+    content: string;
+    headline: string;
+    close: string;
+};

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

@@ -0,0 +1,51 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { ButtonEvent } from '../gov-button/button/gov-button.types';
+import { ColorType, InfobarTypesType } from './constants';
+import { InfobarEvent } from './gov-infobar.types';
+import { Attributes } from "../../helpers/Dom/attribute";
+export declare class GovInfobar {
+    private h;
+    private attributeObserver;
+    private hydrated;
+    constructor();
+    host: HTMLGovInfobarElement;
+    /**
+     * Style variation of the button.
+     */
+    readonly color: ColorType;
+    /**
+     * Infobar appearance
+     */
+    readonly type?: InfobarTypesType;
+    /**
+     * Style variation of the button.
+     */
+    readonly role: HTMLElement['role'];
+    /**
+     * Aria label for the closing button. It is mandatory if the infobar is closable
+     */
+    readonly accessibleCloseLabel: string;
+    /**
+     * Aria label for the toggle button. It is mandatory if the infobar has headline
+     */
+    readonly accessibleToggleLabel: string;
+    /**
+     * Called when the close button is clicked
+     */
+    govClose: EventEmitter<InfobarEvent>;
+    /**
+     * Displays the option to close the infobar
+     */
+    readonly closable?: boolean;
+    toggleContent: boolean;
+    inheritedAttributes: Attributes;
+    validateColor(newValue: string): void;
+    componentDidLoad(): void;
+    componentWillLoad(): void;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    connectedCallback(): void;
+    render(): any;
+    onCloseHandler(e: CustomEvent<ButtonEvent>): void;
+    get isBold(): boolean;
+}

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

@@ -0,0 +1,4 @@
+import { GovBaseEvent } from "../../types/event.types";
+export interface InfobarEvent extends GovBaseEvent {
+    ref: HTMLGovInfobarElement;
+}

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

@@ -0,0 +1,20 @@
+import { ValueOf } from '../../types/interfaces';
+export declare const LayoutClass: {
+    root: string;
+    section: string;
+};
+declare enum LayoutTypes {
+    STRETCH = "stretch",
+    ASIDE = "aside",
+    TEXT = "text"
+}
+export type LayoutType = `${ValueOf<typeof LayoutTypes>}`;
+declare enum LayoutVariant {
+    LEFT = "left",
+    RIGHT = "right"
+}
+export type LayoutVariantType = `${ValueOf<typeof LayoutVariant>}`;
+export declare const LayoutColumnClass: {
+    root: string;
+};
+export {};

package/dist/dist/types/components/gov-layout/gov-layout-column.d.ts

@@ -0,0 +1,6 @@
+export declare class GovLayoutColumn {
+    private h;
+    constructor();
+    readonly host: HTMLGovLayoutColumnElement;
+    render(): any;
+}

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

@@ -0,0 +1,20 @@
+import { LayoutType, LayoutVariantType } from './constants';
+export declare class GovLayout {
+    private h;
+    constructor();
+    host: HTMLGovLayoutElement;
+    /**
+     * Layout type
+     */
+    readonly type?: LayoutType;
+    /**
+     * Layout align
+     */
+    readonly variant?: LayoutVariantType;
+    /**
+     * Determine if component should have inverse column order
+     */
+    readonly inverse: boolean;
+    private typeClass;
+    render(): any;
+}

package/dist/dist/types/components/gov-lifecycle-tester/gov-lifecycle-tester.d.ts

@@ -0,0 +1,14 @@
+export declare class GovLifecycle {
+    private readonly uniqueId;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    componentShouldUpdate(): void;
+    componentWillRender(): void;
+    componentDidRender(): void;
+    componentWillUpdate(): void;
+    componentDidUpdate(): void;
+    render(): any;
+}

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

@@ -0,0 +1,8 @@
+import { Sizes } from "../../core/constants/sizes";
+import { ValueOf } from "../../types/interfaces";
+export declare const LinkSizes: Pick<typeof Sizes, "_S" | "_M" | "_L">;
+export type LinkSizesType = `${ValueOf<typeof LinkSizes>}`;
+export declare const LinkClass: {
+    root: string;
+    external: string;
+};

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

@@ -0,0 +1,34 @@
+import { LinkSizesType } from './constants';
+import { Attributes } from "../../helpers/Dom/attribute";
+export declare class GovLink {
+    private h;
+    constructor();
+    host: HTMLGovLinkElement;
+    /**
+     * Element size.
+     */
+    readonly size?: LinkSizesType;
+    /**
+     * Element size.
+     */
+    readonly external?: boolean;
+    /**
+     * Cutting text to one line
+     */
+    readonly truncate?: boolean;
+    /**
+     * Same as original parameter
+     * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href
+     */
+    readonly href: string;
+    /**
+     * Same as original parameter
+     * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target
+     */
+    readonly target: string;
+    validateSize(newValue: string): void;
+    inheritedAttributes: Attributes;
+    componentWillLoad(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    render(): any;
+}

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

@@ -0,0 +1,9 @@
+import { Sizes } from "../../../core/constants/sizes";
+import { ValueOf } from "../../../types/interfaces";
+export declare const LoadingSizes: Pick<typeof Sizes, "_S" | "_M" | "_L">;
+export type LoadingSizesType = `${ValueOf<typeof LoadingSizes>}`;
+export declare const LoadingClass: {
+    root: string;
+    content: string;
+    icon: string;
+};

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

@@ -0,0 +1,13 @@
+import { LoadingSizesType } from "./constants";
+export declare class GovLoading {
+    private h;
+    constructor();
+    host: HTMLGovLoadingElement;
+    /**
+     * Loading size
+     */
+    readonly size?: LoadingSizesType;
+    validateSize(newValue: string): void;
+    componentWillLoad(): void;
+    render(): any;
+}

package/dist/dist/types/components/gov-loading/skeleton/constants.d.ts

@@ -0,0 +1,21 @@
+import { ValueOf } from "../../../types/interfaces";
+import { Sizes } from "../../../core/constants/sizes";
+import { Colors } from "../../../core/constants/colors";
+export declare const SkeletonSizes: Pick<typeof Sizes, "_XS" | "_S" | "_M" | "_L" | "_XL">;
+export type SkeletonSizesType = `${ValueOf<typeof SkeletonSizes>}`;
+export declare const SkeletonColors: Pick<typeof Colors, "PRIMARY" | "NEUTRAL">;
+export type SkeletonColorType = `${ValueOf<typeof SkeletonColors>}`;
+export declare enum SkeletonShapes {
+    CIRCLE = "circle",
+    LINE = "line"
+}
+export type SkeletonShapesType = `${ValueOf<typeof SkeletonShapes>}`;
+export declare enum SkeletonAnimation {
+    PULSE = "pulse",
+    PROGRESS = "progress",
+    FALSE = "false"
+}
+export type SkeletonAnimationType = `${ValueOf<typeof SkeletonAnimation>}`;
+export declare const SkeletonClass: {
+    root: string;
+};

package/dist/dist/types/components/gov-loading/skeleton/gov-skeleton.d.ts

@@ -0,0 +1,46 @@
+import { SkeletonAnimationType, SkeletonColorType, SkeletonShapesType } from "./constants";
+import { GovHost } from "../../../helpers/Dom/template.types";
+import { FormInputSizesType } from "../../gov-form/input/constants";
+import { Attributes } from "../../../helpers/Dom/attribute";
+export declare class GovSkeleton {
+    h: GovHost;
+    private attributeObserver;
+    constructor();
+    host: HTMLGovSkeletonElement;
+    /**
+     * Input’s size.
+     */
+    readonly size?: FormInputSizesType;
+    /**
+     * Style variation of the skeleton.
+     */
+    readonly color?: SkeletonColorType;
+    /**
+     * Shape of the skeleton
+     */
+    shape?: SkeletonShapesType;
+    /**
+     * Width of the skeleton ex. 100px, 100%, auto etc.
+     */
+    width?: string;
+    /**
+     * Height of the skeleton ex. 100px, 100%, auto etc.
+     */
+    height?: string;
+    /**
+     * Animation type
+     */
+    animation?: SkeletonAnimationType;
+    items: number[];
+    validateSize(newValue: string): void;
+    validateShape(newValue: string): void;
+    validateAnimation(newValue: string): void;
+    inheritedAttributes: Attributes;
+    componentDidLoad(): void;
+    componentWillLoad(): void;
+    componentWillUpdate(): void;
+    disconnectedCallback(): void;
+    onAriaAttributeChange(attributeName: string, newValue: string): void;
+    init(): void;
+    render(): any;
+}

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

@@ -0,0 +1,13 @@
+import { Colors } from '../../core/constants/colors';
+import { ValueOf } from '../../types/interfaces';
+export declare const MessageColors: Pick<typeof Colors, "PRIMARY" | "NEUTRAL" | "SUCCESS" | "ERROR" | "WARNING">;
+export type MessageColorType = `${ValueOf<typeof MessageColors>}`;
+export declare enum MessageType {
+    BOLD = "bold",
+    SUBTLE = "subtle"
+}
+export type MessageTypesType = `${ValueOf<typeof MessageType>}`;
+export declare const MessageClass: {
+    root: string;
+    content: string;
+};

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

@@ -0,0 +1,16 @@
+import { MessageTypesType, MessageColorType } from "./constants";
+export declare class GovMessage {
+    private h;
+    constructor();
+    host: HTMLGovMessageElement;
+    /**
+     * Style variation of the content message.
+     */
+    readonly color: MessageColorType;
+    /**
+     * Message type
+     */
+    readonly type?: MessageTypesType;
+    validateColor(newValue: string): void;
+    render(): any;
+}