@duetds/components 8.0.6 → 8.1.0

package/lib/types/components/duet-date-picker/duet-date-picker.d.ts

@@ -4,229 +4,229 @@ import { InputComponent } from "../../common/form-components";
 import { ThemeableComponent } from "../../common/themeable-component";
 import { DuetLangObject } from "../../utils/language-utils";
 export type DuetDatePickerChangeEvent = {
-  component: "duet-date-picker";
-  valueAsDate: Date;
-  value: string;
+    component: "duet-date-picker";
+    valueAsDate: Date;
+    value: string;
 };
 export type DuetDatePickerFocusEvent = {
-  component: "duet-date-picker";
+    component: "duet-date-picker";
 };
 export type DuetDatePickerDirection = "left" | "right";
 export declare class DuetDatePicker implements ThemeableComponent, InputComponent {
-  private monthSelectId;
-  private yearSelectId;
-  private dialogLabelId;
-  private datePickerButton;
-  private datePickerInput;
-  private closeButtonNode;
-  private monthSelectNode;
-  private dialogWrapperNode;
-  private focusedDayNode;
-  private initialTouchX;
-  private initialTouchY;
-  private focusTarget;
-  open: boolean;
-  focusedDay: Date;
-  inputValue: string;
-  /**
-   * Reference to host HTML element.
-   */
-  element: HTMLElement;
-  /**
-   * Theme of the component.
-   */
-  theme: DuetTheme;
-  /**
-   * Expands the date picker input to fill 100% of the container width.
-   */
-  expand: boolean;
-  /**
-   * Name of the date picker input.
-   */
-  name: string;
-  /**
-   * Adds a unique identifier for the date picker input.
-   */
-  identifier: string;
-  /**
-   * Label for the date picker input.
-   */
-  label: string;
-  /**
-   * Caption (underneath label) that can be set as a way of adding extra information.
-   */
-  caption: string;
-  /**
-   * Controls the margin of the component.
-   */
-  margin: DuetMargin;
-  /**
-   * The currently active language. This setting changes the month/year/day.
-   * names and button labels as well as all screen reader labels.
-   * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing.
-   * @default "fi"
-   */
-  language: DuetLanguage;
-  /**
-   * Placeholder defaults.
-   * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
-   */
-  placeholderDefaults: DuetLangObject | string;
-  /**
-   * Hint text to display before the user types into the date picker input.
-   * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
-   */
-  placeholder: string;
-  /**
-   * If form input field has a placeholder text, and user types anything (causing the text to dissapear),
-   * settings this to true will "echo" it into the caption slot - this option will be false by default for the next few versions, but will eventually be true by default (scheduled for 4.30.0)
-   */
-  echoPlaceholder: boolean;
-  /**
-   * 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;
-  /**
-   * Display the date picker input in error state along with an error message.
-   */
-  error: string;
-  /**
-   * Visually hide the label, but still show it to screen readers.
-   */
-  labelHidden: boolean;
-  /**
-   * Defines a specific role attribute for the date picker input.
-   */
-  role: string | null;
-  /**
-   * Indicates the id of a related component’s visually focused element.
-   */
-  accessibleActiveDescendant: string;
-  /**
-   * Use this prop to add an aria-controls attribute. Use the attribute to
-   * indicate the id of a component controlled by this component.
-   */
-  accessibleControls: string;
-  /**
-   * Indicates the id of a component owned by the input.
-   */
-  accessibleOwns: string;
-  /**
-   * Indicates the id of a component that describes the input.
-   */
-  accessibleDescribedBy: 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.
-   */
-  required: boolean;
-  /**
-   * Forces the opening direction of the calendar modal to be always left or right.
-   * This setting can be useful when the input is smaller than the opening date picker
-   * would be as by default the picker always opens towards right.
-   */
-  direction: DuetDatePickerDirection;
-  /**
-   * Tooltip to display next to the label of the date picker input.
-   */
-  tooltip: string;
-  /**
-   * With direction setting you can force the tooltip to always open towards left
-   * or right instead of automatically determining the direction.
-   */
-  tooltipDirection: DuetTooltipDirection;
-  /**
-   * Date value. Must be in IS0-8601 format: YYYY-MM-DD
-   */
-  value: string;
-  /**
-   * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
-   * This setting can be used alone or together with the max property.
-   */
-  min: string;
-  /**
-   * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
-   * This setting can be used alone or together with the min property.
-   */
-  max: string;
-  /**
-   * Increment to add to years, defaults to 10 for simplicity, if you need a larger selectionspace you can set it to 100
-   */
-  incrementYears: number;
-  /**
-   * This offers information relating to the current validity of the component.
-   * It follow as closely as possible the behaviour of the native date input.
-   * Useful properties to inspect are badInput, valueMissing, rangeOverflow, rangeUnderflow.
-   * **This property should be treated as read only**.
-   */
-  validity: ValidityState;
-  updateValidity(): void;
-  updateInternalValue(): void;
-  /**
-   * Event emitted when a date is selected.
-   */
-  duetChange: EventEmitter<DuetDatePickerChangeEvent>;
-  /**
-   * Event emitted the date picker input is blurred.
-   */
-  duetBlur: EventEmitter<DuetDatePickerFocusEvent>;
-  /**
-   * Event emitted the date picker input is focused.
-   */
-  duetFocus: EventEmitter<DuetDatePickerFocusEvent>;
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad(): void;
-  componentDidUpdate(): void;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  /**
-   * Sets focus on the date picker's input. Use this method instead of the global `focus()`.
-   */
-  setFocus(options?: FocusOptions): Promise<void>;
-  /**
-   * Show the calendar modal, moving focus to the calendar inside.
-   */
-  show(): Promise<void>;
-  /**
-   * Hide the calendar modal. Set `moveFocusToButton` to false to prevent focus
-   * returning to the date picker's button. Default is true.
-   */
-  hide(moveFocusToButton?: boolean): Promise<void>;
-  private enableActiveFocus;
-  private disableActiveFocus;
-  private addDays;
-  private addMonths;
-  private addYears;
-  private startOfWeek;
-  private endOfWeek;
-  private setMonth;
-  private setYear;
-  private setFocusedDay;
-  private toggleOpen;
-  private handleBlur;
-  private handleFocus;
-  private handleTouchStart;
-  private handleTouchMove;
-  private handleTouchEnd;
-  private handleNextMonthClick;
-  private handlePreviousMonthClick;
-  private handleEscKey;
-  private handleKeyboardNavigation;
-  private determineValidity;
-  private handleDaySelect;
-  private handleMonthSelect;
-  private handleYearSelect;
-  private handleInputChange;
-  private setValue;
-  handleDocumentClick(e: MouseEvent): void;
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render(): any;
+    private monthSelectId;
+    private yearSelectId;
+    private dialogLabelId;
+    private datePickerButton;
+    private datePickerInput;
+    private closeButtonNode;
+    private monthSelectNode;
+    private dialogWrapperNode;
+    private focusedDayNode;
+    private initialTouchX;
+    private initialTouchY;
+    private focusTarget;
+    open: boolean;
+    focusedDay: Date;
+    inputValue: string;
+    /**
+     * Reference to host HTML element.
+     */
+    element: HTMLElement;
+    /**
+     * Theme of the component.
+     */
+    theme: DuetTheme;
+    /**
+     * Expands the date picker input to fill 100% of the container width.
+     */
+    expand: boolean;
+    /**
+     * Name of the date picker input.
+     */
+    name: string;
+    /**
+     * Adds a unique identifier for the date picker input.
+     */
+    identifier: string;
+    /**
+     * Label for the date picker input.
+     */
+    label: string;
+    /**
+     * Caption (underneath label) that can be set as a way of adding extra information.
+     */
+    caption: string;
+    /**
+     * Controls the margin of the component.
+     */
+    margin: DuetMargin;
+    /**
+     * The currently active language. This setting changes the month/year/day.
+     * names and button labels as well as all screen reader labels.
+     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing.
+     * @default "fi"
+     */
+    language: DuetLanguage;
+    /**
+     * Placeholder defaults.
+     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
+     */
+    placeholderDefaults: DuetLangObject | string;
+    /**
+     * Hint text to display before the user types into the date picker input.
+     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
+     */
+    placeholder: string;
+    /**
+     * If form input field has a placeholder text, and user types anything (causing the text to dissapear),
+     * settings this to true will "echo" it into the caption slot - this option will be false by default for the next few versions, but will eventually be true by default (scheduled for 4.30.0)
+     */
+    echoPlaceholder: boolean;
+    /**
+     * 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;
+    /**
+     * Display the date picker input in error state along with an error message.
+     */
+    error: string;
+    /**
+     * Visually hide the label, but still show it to screen readers.
+     */
+    labelHidden: boolean;
+    /**
+     * Defines a specific role attribute for the date picker input.
+     */
+    role: string | null;
+    /**
+     * Indicates the id of a related component’s visually focused element.
+     */
+    accessibleActiveDescendant: string;
+    /**
+     * Use this prop to add an aria-controls attribute. Use the attribute to
+     * indicate the id of a component controlled by this component.
+     */
+    accessibleControls: string;
+    /**
+     * Indicates the id of a component owned by the input.
+     */
+    accessibleOwns: string;
+    /**
+     * Indicates the id of a component that describes the input.
+     */
+    accessibleDescribedBy: 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.
+     */
+    required: boolean;
+    /**
+     * Forces the opening direction of the calendar modal to be always left or right.
+     * This setting can be useful when the input is smaller than the opening date picker
+     * would be as by default the picker always opens towards right.
+     */
+    direction: DuetDatePickerDirection;
+    /**
+     * Tooltip to display next to the label of the date picker input.
+     */
+    tooltip: string;
+    /**
+     * With direction setting you can force the tooltip to always open towards left
+     * or right instead of automatically determining the direction.
+     */
+    tooltipDirection: DuetTooltipDirection;
+    /**
+     * Date value. Must be in IS0-8601 format: YYYY-MM-DD
+     */
+    value: string;
+    /**
+     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
+     * This setting can be used alone or together with the max property.
+     */
+    min: string;
+    /**
+     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
+     * This setting can be used alone or together with the min property.
+     */
+    max: string;
+    /**
+     * Increment to add to years, defaults to 10 for simplicity, if you need a larger selectionspace you can set it to 100
+     */
+    incrementYears: number;
+    /**
+     * This offers information relating to the current validity of the component.
+     * It follow as closely as possible the behaviour of the native date input.
+     * Useful properties to inspect are badInput, valueMissing, rangeOverflow, rangeUnderflow.
+     * **This property should be treated as read only**.
+     */
+    validity: ValidityState;
+    updateValidity(): void;
+    updateInternalValue(): void;
+    /**
+     * Event emitted when a date is selected.
+     */
+    duetChange: EventEmitter<DuetDatePickerChangeEvent>;
+    /**
+     * Event emitted the date picker input is blurred.
+     */
+    duetBlur: EventEmitter<DuetDatePickerFocusEvent>;
+    /**
+     * Event emitted the date picker input is focused.
+     */
+    duetFocus: EventEmitter<DuetDatePickerFocusEvent>;
+    /**
+     * Component lifecycle events.
+     */
+    componentWillLoad(): void;
+    componentDidUpdate(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * Sets focus on the date picker's input. Use this method instead of the global `focus()`.
+     */
+    setFocus(options?: FocusOptions): Promise<void>;
+    /**
+     * Show the calendar modal, moving focus to the calendar inside.
+     */
+    show(): Promise<void>;
+    /**
+     * Hide the calendar modal. Set `moveFocusToButton` to false to prevent focus
+     * returning to the date picker's button. Default is true.
+     */
+    hide(moveFocusToButton?: boolean): Promise<void>;
+    private enableActiveFocus;
+    private disableActiveFocus;
+    private addDays;
+    private addMonths;
+    private addYears;
+    private startOfWeek;
+    private endOfWeek;
+    private setMonth;
+    private setYear;
+    private setFocusedDay;
+    private toggleOpen;
+    private handleBlur;
+    private handleFocus;
+    private handleTouchStart;
+    private handleTouchMove;
+    private handleTouchEnd;
+    private handleNextMonthClick;
+    private handlePreviousMonthClick;
+    private handleEscKey;
+    private handleKeyboardNavigation;
+    private determineValidity;
+    private handleDaySelect;
+    private handleMonthSelect;
+    private handleYearSelect;
+    private handleInputChange;
+    private setValue;
+    handleDocumentClick(e: MouseEvent): void;
+    /**
+     * render() function
+     * Always the last one in the class.
+     */
+    render(): any;
 }

package/lib/types/components/duet-divider/duet-divider.d.ts

@@ -2,30 +2,30 @@ import { DuetColor, DuetMargin, DuetTheme } from "../../common-types";
 import { ThemeableComponent } from "../../common/themeable-component";
 export type DuetDividerMargin = DuetMargin | "small";
 export declare class DuetDivider implements ThemeableComponent {
-  /**
-   * Reference to host HTML element.
-   */
-  element: HTMLElement;
-  /**
-   * Theme of the divider.
-   */
-  theme: DuetTheme;
-  /**
-   * Controls the margin of the component.
-   */
-  margin: DuetDividerMargin;
-  /**
-   * Custom color, as a design token entered in camelCase or kebab-case.
-   * Example: "color-primary".
-   */
-  color: DuetColor;
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad(): void;
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render(): any;
+    /**
+     * Reference to host HTML element.
+     */
+    element: HTMLElement;
+    /**
+     * Theme of the divider.
+     */
+    theme: DuetTheme;
+    /**
+     * Controls the margin of the component.
+     */
+    margin: DuetDividerMargin;
+    /**
+     * Custom color, as a design token entered in camelCase or kebab-case.
+     * Example: "color-primary".
+     */
+    color: DuetColor;
+    /**
+     * Component lifecycle events.
+     */
+    componentWillLoad(): void;
+    /**
+     * render() function
+     * Always the last one in the class.
+     */
+    render(): any;
 }

package/lib/types/components/duet-editable-table/duet-editable-table-tabledata.d.ts

@@ -1,8 +1,8 @@
 import { FunctionalComponent } from "../../stencil-public-runtime";
 interface TableDataProps {
-  data: any;
-  groupId?: string;
-  alignment?: string;
+    data: any;
+    groupId?: string;
+    alignment?: string;
 }
 export declare const TableData: FunctionalComponent<TableDataProps>;
 export {};