@dso-toolkit/core 62.18.0 → 62.20.0

package/dist/types/components/autosuggest/autosuggest.d.ts

@@ -1,80 +1,81 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { Suggestion } from "./autosuggest.interfaces";
 export declare class Autosuggest {
-  /**
-   * The suggestions for the value of the slotted input element. Optionally a
-   * Suggestion can have a `type` and `item`.
-   *
-   * The `type` is used to style the suggestion. `item` can be use to reference
-   * the original object that was used to create the suggestion.
-   *
-   * The value should be null when no suggestions have been fetched.
-   */
-  readonly suggestions: Suggestion[] | null;
-  /**
-   * Shows progress indicator when fetching results.
-   */
-  loading: boolean;
-  /**
-   * To override progress indicator's default loading label.
-   */
-  loadingLabel?: string;
-  /**
-   * To delay progress indicator showing (in ms).
-   */
-  loadingDelayed?: number;
-  /**
-   * To show text when no results are found.
-   */
-  notFoundLabel?: string;
-  /**
-   * Whether the previous suggestions will be presented when the input gets focus again.
-   */
-  suggestOnFocus: boolean;
-  /**
-   * Emitted when a suggestion is selected.
-   * The `detail` property of the `CustomEvent` will contain the selected suggestion.
-   */
-  dsoSelect: EventEmitter<Suggestion>;
-  /**
-   * This is emitted debounced for every change for the slotted input type=text element.
-   */
-  dsoChange: EventEmitter<string>;
-  /**
-   * Emitted when enter is pressed.
-   * The `detail` property of the `CustomEvent` will contain the input text.
-   */
-  dsoSearch: EventEmitter<string>;
-  host: HTMLDsoAutosuggestElement;
-  showSuggestions: boolean;
-  selectedSuggestion: Suggestion | undefined;
-  notFound: boolean;
-  showLoading: boolean;
-  suggestionsWatcher(): void;
-  private input?;
-  private listbox;
-  private listboxId;
-  private inputId;
-  private labelId;
-  private debouncedEmitValue;
-  private debouncedShowLoading;
-  private inputValue;
-  private onInput;
-  private onFocusIn;
-  onDocumentClick(event: MouseEvent): void;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  private markTerms;
-  private selectSuggestion;
-  private selectFirstSuggestion;
-  private selectLastSuggestion;
-  private selectNextSuggestion;
-  private selectPreviousSuggestion;
-  private resetSelectedSuggestion;
-  private openSuggestions;
-  private closeSuggestions;
-  private pickSelectedValue;
-  private onKeyDown;
-  private listboxItemId;
-  render(): any;
+    /**
+     * The suggestions for the value of the slotted input element. Optionally a
+     * Suggestion can have a `type` and `item`.
+     *
+     * The `type` is used to style the suggestion. `item` can be use to reference
+     * the original object that was used to create the suggestion.
+     *
+     * The value should be null when no suggestions have been fetched.
+     */
+    readonly suggestions: Suggestion[] | null;
+    /**
+     * Shows progress indicator when fetching results.
+     */
+    loading: boolean;
+    /**
+     * To override progress indicator's default loading label.
+     */
+    loadingLabel?: string;
+    /**
+     * To delay progress indicator showing (in ms).
+     */
+    loadingDelayed?: number;
+    /**
+     * To show text when no results are found.
+     */
+    notFoundLabel?: string;
+    /**
+     * Whether the previous suggestions will be presented when the input gets focus again.
+     */
+    suggestOnFocus: boolean;
+    /**
+     * Emitted when a suggestion is selected.
+     * The `detail` property of the `CustomEvent` will contain the selected suggestion.
+     */
+    dsoSelect: EventEmitter<Suggestion>;
+    /**
+     * This is emitted debounced for every change for the slotted input type=text element.
+     */
+    dsoChange: EventEmitter<string>;
+    /**
+     * Emitted when enter is pressed.
+     * The `detail` property of the `CustomEvent` will contain the input text.
+     */
+    dsoSearch: EventEmitter<string>;
+    host: HTMLDsoAutosuggestElement;
+    showSuggestions: boolean;
+    selectedSuggestion: Suggestion | undefined;
+    notFound: boolean;
+    showLoading: boolean;
+    suggestionsWatcher(): void;
+    private input?;
+    private listbox;
+    private listboxId;
+    private inputId;
+    private labelId;
+    private debouncedEmitValue;
+    private debouncedShowLoading;
+    private inputValue;
+    private onInput;
+    private onFocusIn;
+    onDocumentClick(event: MouseEvent): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private markTerms;
+    private selectSuggestion;
+    private selectFirstSuggestion;
+    private selectLastSuggestion;
+    private selectNextSuggestion;
+    private selectPreviousSuggestion;
+    private resetSelectedSuggestion;
+    private openSuggestions;
+    private closeSuggestions;
+    private pickSelectedValue;
+    private onKeyDown;
+    private listboxItemId;
+    private getChunkedExtras;
+    render(): any;
 }

package/dist/types/components/autosuggest/autosuggest.interfaces.d.ts

@@ -1,14 +1,18 @@
 export interface Suggestion {
-  /**
-   * The text that will be displayed as the suggestion.
-   */
-  value: string;
-  /**
-   * The type of suggestion.
-   */
-  type?: string;
-  /**
-   * A reference to the original object that was used to create the suggestion.
-   */
-  item?: unknown;
+    /**
+     * The text that will be displayed as the suggestion.
+     */
+    value: string;
+    /**
+     * The type of suggestion.
+     */
+    type?: string;
+    /**
+     * A reference to the original object that was used to create the suggestion.
+     */
+    item?: unknown;
+    /**
+     * An array of additional strings
+     */
+    extras?: string[];
 }

package/dist/types/components/badge/badge.d.ts

@@ -1,7 +1,7 @@
 export declare class Badge {
-  /**
-   * The status of the Badge.
-   */
-  status?: "primary" | "success" | "info" | "warning" | "danger" | "error" | "outline" | "attention";
-  render(): any;
+    /**
+     * The status of the Badge.
+     */
+    status?: "primary" | "success" | "info" | "warning" | "danger" | "error" | "outline" | "attention";
+    render(): any;
 }

package/dist/types/components/banner/banner.d.ts

@@ -1,17 +1,17 @@
 export declare class Banner {
-  /**
-   * The status of the banner.
-   */
-  status: "danger" | "error" | "info" | "warning";
-  /**
-   * compact mode.
-   */
-  compact: boolean;
-  /**
-   * *Only available when `compact` is set to `true`.
-   *
-   * Option to show banner icon.
-   */
-  noIcon: boolean;
-  render(): any;
+    /**
+     * The status of the banner.
+     */
+    status: "danger" | "error" | "info" | "warning";
+    /**
+     * compact mode.
+     */
+    compact: boolean;
+    /**
+     * *Only available when `compact` is set to `true`.
+     *
+     * Option to show banner icon.
+     */
+    noIcon: boolean;
+    render(): any;
 }

package/dist/types/components/card/card.d.ts

@@ -1,40 +1,40 @@
 import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
 import { DsoCardClickedEvent, ImageShape } from "./card.interfaces";
 export declare class Card implements ComponentInterface {
-  host: HTMLDsoCardElement;
-  /**
-   * Whether or not the Card is clickable. This is NOT a boolean attribute. Set to "false" to make the Card non-clickable.
-   *
-   * @deprecated Use `href` instead and `<ELEMENT_TYPE slot="heading">` should NOT be of element type `a` (anchor).
-   */
-  clickable: boolean;
-  /**
-   * Presentation of image in header.
-   *  - "normal" ("24 x 24").
-   *  - "wide" ("30 x 26")
-   */
-  imageShape: ImageShape;
-  /**
-   * The URL to which the Card heading links.
-   */
-  href?: string;
-  /**
-   * Display the link as an external link or a download link
-   *  - "download"
-   *  - "extern"
-   */
-  mode?: string;
-  /**
-   * Emitted when the Card is clickable and the user clicked the Card.
-   */
-  dsoCardClicked: EventEmitter<DsoCardClickedEvent>;
-  private mutationObserver?;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  private clickEventHandler;
-  get selectableSlottedElement(): Element | null;
-  get imageSlottedElement(): Element | null;
-  get headingSlottedElement(): Element | null;
-  get interactionsSlottedElement(): Element | null;
-  render(): any;
+    host: HTMLDsoCardElement;
+    /**
+     * Whether or not the Card is clickable. This is NOT a boolean attribute. Set to "false" to make the Card non-clickable.
+     *
+     * @deprecated Use `href` instead and `<ELEMENT_TYPE slot="heading">` should NOT be of element type `a` (anchor).
+     */
+    clickable: boolean;
+    /**
+     * Presentation of image in header.
+     *  - "normal" ("24 x 24").
+     *  - "wide" ("30 x 26")
+     */
+    imageShape: ImageShape;
+    /**
+     * The URL to which the Card heading links.
+     */
+    href?: string;
+    /**
+     * Display the link as an external link or a download link
+     *  - "download"
+     *  - "extern"
+     */
+    mode?: string;
+    /**
+     * Emitted when the Card is clickable and the user clicked the Card.
+     */
+    dsoCardClicked: EventEmitter<DsoCardClickedEvent>;
+    private mutationObserver?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private clickEventHandler;
+    get selectableSlottedElement(): Element | null;
+    get imageSlottedElement(): Element | null;
+    get headingSlottedElement(): Element | null;
+    get interactionsSlottedElement(): Element | null;
+    render(): any;
 }

package/dist/types/components/card/card.interfaces.d.ts

@@ -1,6 +1,6 @@
 export interface DsoCardClickedEvent {
-  originalEvent?: MouseEvent;
-  /** True when user clicked the card while holding Ctrl, Alt or other modifiers, or when the card is right-clicked. Can be used to determine navigation. */
-  isModifiedEvent: boolean;
+    originalEvent?: MouseEvent;
+    /** True when user clicked the card while holding Ctrl, Alt or other modifiers, or when the card is right-clicked. Can be used to determine navigation. */
+    isModifiedEvent: boolean;
 }
 export type ImageShape = "normal" | "wide";

package/dist/types/components/card-container/card-container.d.ts

@@ -1,9 +1,9 @@
 import { ComponentInterface } from "../../stencil-public-runtime";
 import { CardContainerMode } from "./card-container.interfaces";
 export declare class CardContainer implements ComponentInterface {
-  /**
-   * The mode of the Card Container.
-   */
-  mode: CardContainerMode;
-  render(): any;
+    /**
+     * The mode of the Card Container.
+     */
+    mode: CardContainerMode;
+    render(): any;
 }

package/dist/types/components/date-picker/date-picker.d.ts

@@ -1,82 +1,82 @@
 import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
 import { DatePickerBlurEvent, DatePickerChangeEvent, DatePickerFocusEvent, DatePickerKeyboardEvent } from "./date-picker.interfaces";
 export declare class DsoDatePicker implements ComponentInterface {
-  /**
-   * Reference to host HTML element.
-   */
-  element: HTMLDsoDatePickerElement;
-  /**
-   * Name of the date picker input.
-   */
-  name: string;
-  /**
-   * Adds a unique identifier for the date picker input. Use this instead of html `id` attribute.
-   */
-  identifier: string | undefined;
-  /**
-   * Makes the date picker input component disabled. This prevents users from being able to
-   * interact with the input, and conveys its inactive state to assistive technologies.
-   */
-  disabled: boolean;
-  /**
-   * Should the input be marked as required?
-   */
-  required: boolean;
-  /**
-   * Is input invalid?
-   */
-  invalid?: boolean;
-  /**
-   * ID of element that describes the input element
-   */
-  describedBy?: string;
-  /**
-   * Should the input be focused on load?
-   */
-  dsoAutofocus: boolean;
-  /**
-   * Date value. Must be in Dutch date format: DD-MM-YYYY.
-   */
-  value: string;
-  /**
-   * Minimum date allowed to be picked. Must be in Dutch date format: DD-MM-YYYY.
-   * This setting can be used alone or together with the max property.
-   */
-  min: string | undefined;
-  /**
-   * Maximum date allowed to be picked. Must be in Dutch date format: DD-MM-YYYY.
-   * This setting can be used alone or together with the min property.
-   */
-  max: string | undefined;
-  /**
-   * Events section.
-   */
-  /**
-   * Event emitted when a date is selected.
-   */
-  dsoDateChange: EventEmitter<DatePickerChangeEvent>;
-  /**
-   * Event emitted the date picker input is blurred.
-   */
-  dsoBlur: EventEmitter<DatePickerBlurEvent>;
-  /**
-   * Event emitted on key up in the date picker input.
-   */
-  dsoKeyUp: EventEmitter<DatePickerKeyboardEvent>;
-  /**
-   * Event emitted on key down in the date picker input.
-   */
-  dsoKeyDown: EventEmitter<DatePickerKeyboardEvent>;
-  /**
-   * Event emitted the date picker input is focused.
-   */
-  dsoFocus: EventEmitter<DatePickerFocusEvent>;
-  private handleBlur;
-  private handleFocus;
-  private handleKeyUp;
-  private handleKeyDown;
-  private handleInputChange;
-  private dateValues;
-  private validityToError;
-  render(): any;
+    /**
+     * Reference to host HTML element.
+     */
+    element: HTMLDsoDatePickerElement;
+    /**
+     * Name of the date picker input.
+     */
+    name: string;
+    /**
+     * Adds a unique identifier for the date picker input. Use this instead of html `id` attribute.
+     */
+    identifier: string | undefined;
+    /**
+     * Makes the date picker input component disabled. This prevents users from being able to
+     * interact with the input, and conveys its inactive state to assistive technologies.
+     */
+    disabled: boolean;
+    /**
+     * Should the input be marked as required?
+     */
+    required: boolean;
+    /**
+     * Is input invalid?
+     */
+    invalid?: boolean;
+    /**
+     * ID of element that describes the input element
+     */
+    describedBy?: string;
+    /**
+     * Should the input be focused on load?
+     */
+    dsoAutofocus: boolean;
+    /**
+     * Date value. Must be in Dutch date format: DD-MM-YYYY.
+     */
+    value: string;
+    /**
+     * Minimum date allowed to be picked. Must be in Dutch date format: DD-MM-YYYY.
+     * This setting can be used alone or together with the max property.
+     */
+    min: string | undefined;
+    /**
+     * Maximum date allowed to be picked. Must be in Dutch date format: DD-MM-YYYY.
+     * This setting can be used alone or together with the min property.
+     */
+    max: string | undefined;
+    /**
+     * Events section.
+     */
+    /**
+     * Event emitted when a date is selected.
+     */
+    dsoDateChange: EventEmitter<DatePickerChangeEvent>;
+    /**
+     * Event emitted the date picker input is blurred.
+     */
+    dsoBlur: EventEmitter<DatePickerBlurEvent>;
+    /**
+     * Event emitted on key up in the date picker input.
+     */
+    dsoKeyUp: EventEmitter<DatePickerKeyboardEvent>;
+    /**
+     * Event emitted on key down in the date picker input.
+     */
+    dsoKeyDown: EventEmitter<DatePickerKeyboardEvent>;
+    /**
+     * Event emitted the date picker input is focused.
+     */
+    dsoFocus: EventEmitter<DatePickerFocusEvent>;
+    private handleBlur;
+    private handleFocus;
+    private handleKeyUp;
+    private handleKeyDown;
+    private handleInputChange;
+    private dateValues;
+    private validityToError;
+    render(): any;
 }

package/dist/types/components/date-picker/date-picker.interfaces.d.ts

@@ -1,46 +1,46 @@
 export interface DatePickerChangeEvent {
-  component: "dso-date-picker";
-  /**
-   * The original event that the change event of the `<input type="date">` emitted.
-   */
-  originalEvent: Event;
-  /**
-   * The entered date in DD-MM-YYYY.
-   *
-   * Also set if the entered date is out of bounds, but empty `""` if the date is invalid.
-   */
-  value: string;
-  /**
-   * The entered date as Date object.
-   *
-   * `undefined` if the date is out of bounds or invalid.
-   */
-  valueAsDate: Date | undefined;
-  /**
-   * The original validity object. Only for convienience, this object equals `detail.originalEvent.target.validity`.
-   */
-  validity: ValidityState;
-  /**
-   * If the input causes an error this property is set:
-   *
-   * * `required`: If the date is required but no date is given. Equals `validity.valueMissing`.
-   * * `min-range`: The entered date is sooner than the minimum date set in `min`. Equals `validity.rangeUnderflow`.
-   * * `max-range`: The entered date is later than the maximum date set in `max`. Equals `validity.rangeOverflow`.
-   * * `invalid`: If the entered date is invalid. Equals `validity.invalid === false`.
-   *
-   * For more data on the validity of the input, refer to the property `validity`.
-   */
-  error?: DatePickerError;
+    component: "dso-date-picker";
+    /**
+     * The original event that the change event of the `<input type="date">` emitted.
+     */
+    originalEvent: Event;
+    /**
+     * The entered date in DD-MM-YYYY.
+     *
+     * Also set if the entered date is out of bounds, but empty `""` if the date is invalid.
+     */
+    value: string;
+    /**
+     * The entered date as Date object.
+     *
+     * `undefined` if the date is out of bounds or invalid.
+     */
+    valueAsDate: Date | undefined;
+    /**
+     * The original validity object. Only for convienience, this object equals `detail.originalEvent.target.validity`.
+     */
+    validity: ValidityState;
+    /**
+     * If the input causes an error this property is set:
+     *
+     * * `required`: If the date is required but no date is given. Equals `validity.valueMissing`.
+     * * `min-range`: The entered date is sooner than the minimum date set in `min`. Equals `validity.rangeUnderflow`.
+     * * `max-range`: The entered date is later than the maximum date set in `max`. Equals `validity.rangeOverflow`.
+     * * `invalid`: If the entered date is invalid. Equals `validity.invalid === false`.
+     *
+     * For more data on the validity of the input, refer to the property `validity`.
+     */
+    error?: DatePickerError;
 }
 export interface DatePickerFocusEvent {
-  originalEvent: FocusEvent;
-  component: "dso-date-picker";
+    originalEvent: FocusEvent;
+    component: "dso-date-picker";
 }
 export interface DatePickerBlurEvent extends DatePickerChangeEvent {
-  originalEvent: FocusEvent;
+    originalEvent: FocusEvent;
 }
 export interface DatePickerKeyboardEvent {
-  originalEvent: KeyboardEvent;
-  component: "dso-date-picker";
+    originalEvent: KeyboardEvent;
+    component: "dso-date-picker";
 }
 export type DatePickerError = "required" | "min-range" | "max-range" | "invalid";

package/dist/types/components/date-picker-legacy/date-localization.d.ts

@@ -1,19 +1,19 @@
 type MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string];
 type DayNames = [string, string, string, string, string, string, string];
 export type DsoLocalizedText = {
-  buttonLabel: string;
-  placeholder: string;
-  selectedDateMessage: string;
-  prevMonthLabel: string;
-  nextMonthLabel: string;
-  monthSelectLabel: string;
-  yearSelectLabel: string;
-  closeLabel: string;
-  keyboardInstruction: string;
-  calendarHeading: string;
-  dayNames: DayNames;
-  monthNames: MonthsNames;
-  monthNamesShort: MonthsNames;
+    buttonLabel: string;
+    placeholder: string;
+    selectedDateMessage: string;
+    prevMonthLabel: string;
+    nextMonthLabel: string;
+    monthSelectLabel: string;
+    yearSelectLabel: string;
+    closeLabel: string;
+    keyboardInstruction: string;
+    calendarHeading: string;
+    dayNames: DayNames;
+    monthNames: MonthsNames;
+    monthNamesShort: MonthsNames;
 };
 declare const localization: DsoLocalizedText;
 export default localization;

package/dist/types/components/date-picker-legacy/date-picker-day.d.ts

@@ -1,11 +1,11 @@
 import { FunctionalComponent } from "../../stencil-public-runtime";
 export type DatePickerLegacyDayProps = {
-  focusedDay: Date;
-  today: Date;
-  day: Date;
-  inRange: boolean;
-  onDaySelect: (event: MouseEvent, day: Date) => void;
-  onKeyboardNavigation: (event: KeyboardEvent) => void;
-  focusedDayRef?: (element: HTMLButtonElement) => void;
+    focusedDay: Date;
+    today: Date;
+    day: Date;
+    inRange: boolean;
+    onDaySelect: (event: MouseEvent, day: Date) => void;
+    onKeyboardNavigation: (event: KeyboardEvent) => void;
+    focusedDayRef?: (element: HTMLButtonElement) => void;
 };
 export declare const DatePickerLegacyDay: FunctionalComponent<DatePickerLegacyDayProps>;