dap-design-system 0.10.6 → 0.11.0

package/dist/dds.d.ts

@@ -516,6 +516,37 @@ export declare class BuildingsHome6Line extends DdsElement {
     render(): TemplateResult_2;
 }
 
+/**
+ * `dap-ds-icon-calendar-line`
+ * @summary An icon
+ * @element dap-ds-icon-calendar-line
+ * @title - BusinessCalendarLine
+ * @group icon
+ * @icontype business
+ *
+ * @attribute {number} size - (optional) The width and height in pixels
+ * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute
+ * @attribute {boolean} decorative - (optional) If `true` the SVG element will get `aria-hidden="true"`
+ * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility
+ * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus
+ *
+ * @csspart base - The main icon container.
+ */
+export declare class BusinessCalendarLine extends DdsElement {
+    /** (optional) The width and height in pixels */
+    size?: number | undefined;
+    /** (optional) Sets the icon color via the `fill` attribute */
+    selected?: boolean;
+    /** (optional) If `true` the SVG element will get `aria-hidden="true"` */
+    decorative?: boolean;
+    /** (optional) When using the icon standalone, make it meaningful for accessibility */
+    accessibilityTitle?: string;
+    /** (optional) If `true` the icon can receive focus */
+    focusable?: boolean;
+    static styles: CSSResult;
+    render(): TemplateResult_2;
+}
+
 declare type ButtonShape = 'button' | 'circle';
 
 declare type ButtonSize = Extract<Size, 'lg' | 'md' | 'sm'>;
@@ -873,7 +904,7 @@ export declare class DapDSButton extends GenericFormElement {
  */
 export declare class DapDSCalendar extends DdsElement {
     cells: NodeListOf<DapDSCalendarCell>;
-    value: Dayjs;
+    value?: Dayjs;
     currentDate: default_2.Dayjs;
     minDate: default_2.Dayjs;
     maxDate: default_2.Dayjs;
@@ -885,7 +916,7 @@ export declare class DapDSCalendar extends DdsElement {
     protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
     protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
     updateLocale: () => void;
-    setValue(value: Dayjs, setFocus?: boolean): void;
+    setValue(value?: Dayjs, setFocus?: boolean): void;
     getWeeksInMonth: (date: Dayjs) => number;
     isOutOfRange(currentDate: Dayjs, date: Dayjs): boolean;
     isToday(date: Dayjs): boolean;
@@ -903,10 +934,12 @@ export declare class DapDSCalendar extends DdsElement {
     getCellByDate(date: Dayjs): DapDSCalendarCell | undefined;
     handleKeyDown(event: KeyboardEvent): void;
     setCurrentCell(cell: DapDSCalendarCell, setFocus?: boolean): void;
+    setFocusToCurrentCell(): void;
     setToFirstDayOfMonth(): void;
     setToToday(): void;
     setToFirstAllowedDayOfMonth(currentDate?: default_2.Dayjs): void;
     focusNextCell(element: DapDSCalendarCell, offset: number): void;
+    captureFocus(): void;
     renderCalendarGridHeader(): TemplateResult_2;
     renderCalendarGridBody(date: Dayjs): TemplateResult_2;
     renderCalendarHeader(): TemplateResult_2;
@@ -1236,6 +1269,12 @@ export declare class DapDSCheckbox extends LabelPositionedFormElement {
  * @attribute {'error' | 'warning' | 'info'} feedbackType - The feedback type of the select.
  * @attribute {'none' | 'typehead' | 'autocomplete' | 'manual'} searchMode - The search mode of the select.
  * @attribute {boolean} openOnEmpty - Whether the combobox should open on empty results.
+ * @attribute {boolean} allowManualInput - Whether the combobox allows manual input, or free text.
+ * @attribute {boolean} searchForText - Whether the combobox should search for the selected item text.
+ * @attribute {boolean} noTextComplete - Whether the combobox should not complete the text.
+ * @attribute {string} searchButtonAriaLabel - The aria label of the search button.
+ * @attribute {boolean} selectable - Show the selected item check mark in the dropdown.
+ * @attribute {boolean} noAnimation - Whether the combobox open indicator should be animated.
  *
  * @csspart base - The main select container.
  * @csspart trigger - The trigger button of the select.
@@ -1307,10 +1346,93 @@ export declare class DapDSContentSwitcherItem extends DdsElement {
  * @element dap-ds-datepicker
  * @title - Datepicker
  *
+ * @attribute {Dayjs} value - The value of the datepicker.
+ * @attribute {string} format - The format of the datepicker.
+ * @attribute {Dayjs} currentDate - The current date of the datepicker.
+ * @attribute {Dayjs} minDate - The minimum date of the datepicker.
+ * @attribute {Dayjs} maxDate - The maximum date of the datepicker.
+ * @attribute {Function} disabledDate - The disabled date of the datepicker.
+ * @attribute {PopupPlacement} placement - The placement of the datepicker. Can be 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-start', 'bottom', 'bottom-end', 'left-start', 'left', or 'left-end'. Default is 'bottom-start'.
+ * @attribute {boolean} opened - The open state of the datepicker.
+ * @attribute {boolean} openCalendarOnInput - Wheter the calendar should open on typing.
+ * @attribute {boolean} sendEmptyEventOnInput - Wheter the calendar should send an empty event on typing.
+ * @attribute {string} placeholder - The placeholder of the datepicker.
+ * @attribute {'sm' | 'lg'} size - The size of the datepicker. Default is 'md'.
+ * @attribute {boolean} loading - The loading state of the datepicker.
+ * @attribute {boolean} disabled - The disabled state of the datepicker.
+ * @attribute {boolean} required - The required state of the datepicker.
+ * @attribute {boolean} readonly - The readonly state of the datepicker.
+ * @attribute {boolean} autofocus - The autofocus state of the datepicker.
+ * @attribute {string} label - The label of the datepicker.
+ * @attribute {string} description - The description of the datepicker.
+ * @attribute {string} tooltip - The tooltip of the datepicker.
+ * @attribute {string} feedback - The feedback of the datepicker.
+ * @attribute {'error' | 'warning' | 'info'} feedbackType - The feedback type of the datepicker.
+ * @attribute {boolean} optional - The optional state of the datepicker.
+ * @attribute {string} optionalLabel - The optional label of the datepicker.
+ * @attribute {boolean} subtle - The weight of the label. Default is `false`
+ * @attribute {string} autocomplete - The autocomplete of the datepicker.
+ * @attribute {boolean} autofocus - The autofocus of the datepicker.
+ * @attribute {string} clearButton - Whether the clear button should be shown.
+ *
+ * @event dds-change - Fired when the datepicker value changes.
+ * @event dds-input - Fired when the datepicker input value changes.
+ * @event dds-valid-date - Fired when the datepicker input value is valid.
+ * @event dds-invalid-date - Fired when the datepicker input value is invalid.
+ * @event dds-clear - Fired when the datepicker is cleared.
+ * @event dds-focus - Emitted when the datepicker gains focus.
+ * @event dds-blur - Emitted when the datepicker loses focus.
+ *
+ * @csspart base - The main datepicker container.
+ * @csspart calendar - The calendar of the datepicker.
+ * @csspart trigger - The trigger button of the datepicker.
+ * @csspart label - The label of the datepicker.
+ * @csspart description - The description of the datepicker.
+ * @csspart feedback - The feedback of the datepicker.
+ * @csspart tooltip - The tooltip of the datepicker.
+ * @csspart input - The input of the datepicker.
+ * @csspart clear-button - The clear button of the datepicker.
+ *
  */
-export declare class DapDSDatePicker extends DdsElement {
-    value: string;
+export declare class DapDSDatePicker extends GenericFormElement {
+    triggerInput: HTMLInputElement;
+    calendar: DapDSCalendar;
+    value?: Dayjs;
+    currentDate: default_2.Dayjs;
+    minDate: default_2.Dayjs;
+    maxDate: default_2.Dayjs;
+    disabledDate: (date: Dayjs) => boolean;
+    placement: PopupPlacement;
+    opened: boolean;
+    openCalendarOnInput: boolean;
+    sendEmptyEventOnInput: boolean;
+    placeholder: string | null;
+    loading?: boolean;
+    format?: string;
+    clearButton?: string;
     static styles: CSSResult;
+    protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    getFormattedValue(): string;
+    isValueValid(): boolean;
+    setValue(value?: Dayjs, setInputValue?: boolean, sendEmptyEventOnInput?: boolean): void;
+    clearSelection(): Promise<void>;
+    handleDocumentMouseDown: (event: MouseEvent) => void;
+    handleInput: (event: InputEvent) => void;
+    handleKeyDown: (event: KeyboardEvent) => Promise<void>;
+    get focusElement(): void;
+    handleClick: () => void;
+    handleClearClick: () => void;
+    showCalendar(): Promise<void>;
+    hideCalendar(): Promise<void>;
+    handleFocus: () => void;
+    handleBlur: () => void;
+    getValidity(): boolean;
+    get validity(): ValidityState;
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    setValidity(): void;
+    handleInvalid(event: Event): void;
     render(): TemplateResult_2;
 }
 
@@ -2074,7 +2196,7 @@ export declare class DapDSPopup extends DdsElement {
     floatingStrategy: 'absolute' | 'fixed';
     offset: number;
     sync?: boolean;
-    maxHeight: number;
+    maxHeight: number | 'auto';
     hasArrow: boolean;
     overflow: boolean;
     connectedCallback(): Promise<void>;
@@ -2208,7 +2330,7 @@ export declare class DapDSRadioGroup extends GenericFormElement {
  * @attribute {string} description - The description of the search.
  * @attribute {string} tooltip - The tooltip of the search.
  * @attribute {'sm' | 'lg'} size - The size of the search. Default is 'md'.
- * @attribute {'none' | 'typehead' | 'autocomplete' | 'manual'} searchMode - The search mode of the select.
+ * @attribute {'none' | 'typehead' | 'autocomplete' | 'manual'} searchMode - The search mode of the select. Default is 'none'.
  * @attribute {boolean} disabled - Whether the search is disabled.
  * @attribute {boolean} required - Whether the search is required.
  * @attribute {boolean} readonly - Whether the search is readonly.
@@ -2222,6 +2344,8 @@ export declare class DapDSRadioGroup extends GenericFormElement {
  * @attribute {boolean} noTextComplete - Whether the search should not complete the text.
  * @attribute {string} searchButtonAriaLabel - The aria label of the search button.
  * @attribute {boolean} openOnEmpty - Whether the search should open on empty results.
+ * @attribute {boolean} selectable - Show the selected item check mark in the dropdown. Default is false.
+ * @attribute {boolean} noAnimation - Whether the search open indicator should be animated. Default is true.
  *
  * @csspart base - The main search container.
  * @csspart trigger - The trigger button of the search.
@@ -2844,6 +2968,8 @@ export declare type DdsFocusEvent = CustomEvent<Record<PropertyKey, never>>;
 
 export declare type DdsInputEvent = CustomEvent<Record<PropertyKey, never>>;
 
+export declare type DdsInvalidDateEvent = CustomEvent<Record<PropertyKey, never>>;
+
 export declare type DdsKeydownEvent = CustomEvent<Record<PropertyKey, never>>;
 
 export declare type DdsOkEvent = CustomEvent<Record<PropertyKey, never>>;
@@ -2870,6 +2996,8 @@ export declare type DdsUploadProgressEvent = CustomEvent<Record<PropertyKey, nev
 
 export declare type DdsUploadStartEvent = CustomEvent<Record<PropertyKey, never>>;
 
+export declare type DdsValidDateEvent = CustomEvent<Record<PropertyKey, never>>;
+
 declare type DescriptionPlacement = Extract<Placement, 'top' | 'bottom'>;
 
 declare type DescriptionProps = {
@@ -2975,6 +3103,7 @@ declare interface FormElementInterface {
     validationMessage: string;
     willValidate: boolean;
     innerInput: HTMLElement;
+    autocomplete: string;
     setValidity(): void;
     checkValidity(): boolean;
     reportValidity(): boolean;
@@ -4251,6 +4380,13 @@ declare global {
 }
 
 
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'dds-invalid-date': DdsInvalidDateEvent;
+    }
+}
+
+
 declare global {
     interface GlobalEventHandlersEventMap {
         'dds-keydown': DdsKeydownEvent;
@@ -4335,6 +4471,13 @@ declare global {
 }
 
 
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'dds-valid-date': DdsValidDateEvent;
+    }
+}
+
+
 declare global {
     interface HTMLElementTagNameMap {
         'dap-ds-accordion': DapDSAccordion;
@@ -4634,6 +4777,13 @@ declare global {
 }
 
 
+declare global {
+    interface HTMLElementTagNameMap {
+        'dap-ds-icon-calendar-line': BusinessCalendarLine;
+    }
+}
+
+
 declare global {
     interface HTMLElementTagNameMap {
         'dap-ds-icon-clipboard-line': DocumentClipboardLine;