@otto-de/b2b-core-components 1.21.0 → 1.23.0

package/dist/types/components.d.ts

@@ -75,6 +75,22 @@ export namespace Components {
         "underlineText": boolean;
     }
     interface B2bBackgroundBox {
+        /**
+          * Whether the box should have a bottom border. Per default, the border is enabled
+         */
+        "borderBottom": 'default' | 'none';
+        /**
+          * Whether the box should have a left border. Per default, the border is enabled
+         */
+        "borderLeft": 'default' | 'none';
+        /**
+          * Whether the box should have a right border. Per default, the border is enabled
+         */
+        "borderRight": 'default' | 'none';
+        /**
+          * Whether the box should have a top border. Per default, the border is enabled
+         */
+        "borderTop": 'default' | 'none';
         /**
           * Fixes width to 1212px. Per default, it is false
          */
@@ -273,6 +289,34 @@ export namespace Components {
         "value"?: any;
     }
     interface B2bDatePicker {
+        /**
+          * The dates that are part of this array are disabled. By default, this is an empty array.
+         */
+        "disableDates": string | string[];
+        /**
+          * All the dates until the given specified date will be disabled.
+         */
+        "disableDatesFrom": string;
+        /**
+          * All the dates until the given specified date will be disabled.
+         */
+        "disableDatesUntil": string;
+        /**
+          * Disable the days of the week specified here.
+         */
+        "disableDays": | 'Mo'
+    | 'Di'
+    | 'Mi'
+    | 'Do'
+    | 'Fr'
+    | 'Sa'
+    | 'So'
+    | 'Tu'
+    | 'We'
+    | 'Th'
+    | 'Su'
+    | string
+    | string[];
         /**
           * Whether the dates after the current date are disabled. By default, this is false.
          */
@@ -285,10 +329,22 @@ export namespace Components {
           * Whether the dates that fall on the weekend are disabled. By default, this is false.
          */
         "disableWeekends": boolean;
+        /**
+          * Hint text that should be displayed when showHint is true
+         */
+        "hint": string;
         /**
           * Label for the date picker component.
          */
         "label": string;
+        /**
+          * The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language": 'de' | 'en';
+        /**
+          * The placeholder shown in the date picker.
+         */
+        "placeholder": string;
         /**
           * Default date picker date
          */
@@ -297,8 +353,28 @@ export namespace Components {
           * Whether to show hint message or not.
          */
         "showHint": boolean;
+        /**
+          * The width of the input field of the date picker in pixel. Minimum is 250, maximum is 600px.
+         */
+        "width": number;
     }
     interface B2bDatePickerDays {
+        /**
+          * Internal the dates that are part of this array are disabled. By default, this is an empty array.
+         */
+        "disableDates": Date[];
+        /**
+          * Internal all the dates from the given specified date will be disabled.
+         */
+        "disableDatesFrom": Date;
+        /**
+          * Internal all the dates until the given specified date will be disabled.
+         */
+        "disableDatesUntil": Date;
+        /**
+          * Internal the specific days of the week that need to be disabled
+         */
+        "disableEvery": string[];
         /**
           * Internal whether the dates after the current date are disabled. By default, this is false.
          */
@@ -325,8 +401,16 @@ export namespace Components {
         "selectedYear": number;
     }
     interface B2bDatePickerDaysHeader {
+        /**
+          * Internal the language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language": 'de' | 'en';
     }
     interface B2bDatePickerHeader {
+        /**
+          * The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language": 'de' | 'en';
         /**
           * Internal selected month
          */
@@ -337,6 +421,10 @@ export namespace Components {
         "selectedYear": number;
     }
     interface B2bDatePickerMonths {
+        /**
+          * Internal The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language": 'de' | 'en';
         /**
           * Internal selected month
          */
@@ -912,6 +1000,36 @@ export namespace Components {
          */
         "alignment": 'vertical' | 'horizontal';
     }
+    interface B2bSnackbar {
+        /**
+          * Text for the Call-to-Action link.
+         */
+        "actionLabel": string;
+        /**
+          * Text on the snackbar.
+         */
+        "description": string;
+        /**
+          * How long is snackbar shown. Default value is 5000 ms.
+         */
+        "duration": number;
+        /**
+          * Whether the snackbar has a Call-to-Action. Per default, it is false.
+         */
+        "hasAction": boolean;
+        /**
+          * Whether the snackbar is currently visible. Set to true to display the snackbar.
+         */
+        "opened": boolean;
+        /**
+          * Whether snackbar is show for limited time. Default is true. Error snackbars cannot be timed.
+         */
+        "timed": boolean;
+        /**
+          * The type of snackbar. Default is info.
+         */
+        "type": 'info' | 'success' | 'warning' | 'error';
+    }
     /**
      * Spinner component to display loading indicator.
      * Initial story: https://otto-eg.atlassian.net/browse/B2BDS-70
@@ -1164,10 +1282,6 @@ export namespace Components {
           * The value associated with the toggle chip. This is emitted when the chip is interacted with.
          */
         "value": any;
-        /**
-          * The color scheme of the toggle button. Use white for grey backgrounds and grey for white backgrounds. Per default, it is grey
-         */
-        "variant": 'grey' | 'white';
     }
     interface B2bToggleGroup {
         /**
@@ -1362,6 +1476,10 @@ export interface B2bSearchCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLB2bSearchElement;
 }
+export interface B2bSnackbarCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLB2bSnackbarElement;
+}
 export interface B2bTabCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLB2bTabElement;
@@ -1969,6 +2087,24 @@ declare global {
         prototype: HTMLB2bSeparatorElement;
         new (): HTMLB2bSeparatorElement;
     };
+    interface HTMLB2bSnackbarElementEventMap {
+        "b2b-close": void;
+        "b2b-action-click": void;
+    }
+    interface HTMLB2bSnackbarElement extends Components.B2bSnackbar, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLB2bSnackbarElementEventMap>(type: K, listener: (this: HTMLB2bSnackbarElement, ev: B2bSnackbarCustomEvent<HTMLB2bSnackbarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLB2bSnackbarElementEventMap>(type: K, listener: (this: HTMLB2bSnackbarElement, ev: B2bSnackbarCustomEvent<HTMLB2bSnackbarElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLB2bSnackbarElement: {
+        prototype: HTMLB2bSnackbarElement;
+        new (): HTMLB2bSnackbarElement;
+    };
     /**
      * Spinner component to display loading indicator.
      * Initial story: https://otto-eg.atlassian.net/browse/B2BDS-70
@@ -2259,6 +2395,7 @@ declare global {
         "b2b-scrollable-container": HTMLB2bScrollableContainerElement;
         "b2b-search": HTMLB2bSearchElement;
         "b2b-separator": HTMLB2bSeparatorElement;
+        "b2b-snackbar": HTMLB2bSnackbarElement;
         "b2b-spinner": HTMLB2bSpinnerElement;
         "b2b-tab": HTMLB2bTabElement;
         "b2b-tab-group": HTMLB2bTabGroupElement;
@@ -2333,6 +2470,22 @@ declare namespace LocalJSX {
         "underlineText"?: boolean;
     }
     interface B2bBackgroundBox {
+        /**
+          * Whether the box should have a bottom border. Per default, the border is enabled
+         */
+        "borderBottom"?: 'default' | 'none';
+        /**
+          * Whether the box should have a left border. Per default, the border is enabled
+         */
+        "borderLeft"?: 'default' | 'none';
+        /**
+          * Whether the box should have a right border. Per default, the border is enabled
+         */
+        "borderRight"?: 'default' | 'none';
+        /**
+          * Whether the box should have a top border. Per default, the border is enabled
+         */
+        "borderTop"?: 'default' | 'none';
         /**
           * Fixes width to 1212px. Per default, it is false
          */
@@ -2553,6 +2706,34 @@ declare namespace LocalJSX {
         "value"?: any;
     }
     interface B2bDatePicker {
+        /**
+          * The dates that are part of this array are disabled. By default, this is an empty array.
+         */
+        "disableDates"?: string | string[];
+        /**
+          * All the dates until the given specified date will be disabled.
+         */
+        "disableDatesFrom"?: string;
+        /**
+          * All the dates until the given specified date will be disabled.
+         */
+        "disableDatesUntil"?: string;
+        /**
+          * Disable the days of the week specified here.
+         */
+        "disableDays"?: | 'Mo'
+    | 'Di'
+    | 'Mi'
+    | 'Do'
+    | 'Fr'
+    | 'Sa'
+    | 'So'
+    | 'Tu'
+    | 'We'
+    | 'Th'
+    | 'Su'
+    | string
+    | string[];
         /**
           * Whether the dates after the current date are disabled. By default, this is false.
          */
@@ -2565,14 +2746,26 @@ declare namespace LocalJSX {
           * Whether the dates that fall on the weekend are disabled. By default, this is false.
          */
         "disableWeekends"?: boolean;
+        /**
+          * Hint text that should be displayed when showHint is true
+         */
+        "hint"?: string;
         /**
           * Label for the date picker component.
          */
         "label"?: string;
+        /**
+          * The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language"?: 'de' | 'en';
         /**
           * Emits the selected date as Date type.
          */
         "onB2b-selected"?: (event: B2bDatePickerCustomEvent<DatePickerEventDetail>) => void;
+        /**
+          * The placeholder shown in the date picker.
+         */
+        "placeholder"?: string;
         /**
           * Default date picker date
          */
@@ -2581,8 +2774,28 @@ declare namespace LocalJSX {
           * Whether to show hint message or not.
          */
         "showHint"?: boolean;
+        /**
+          * The width of the input field of the date picker in pixel. Minimum is 250, maximum is 600px.
+         */
+        "width"?: number;
     }
     interface B2bDatePickerDays {
+        /**
+          * Internal the dates that are part of this array are disabled. By default, this is an empty array.
+         */
+        "disableDates"?: Date[];
+        /**
+          * Internal all the dates from the given specified date will be disabled.
+         */
+        "disableDatesFrom"?: Date;
+        /**
+          * Internal all the dates until the given specified date will be disabled.
+         */
+        "disableDatesUntil"?: Date;
+        /**
+          * Internal the specific days of the week that need to be disabled
+         */
+        "disableEvery"?: string[];
         /**
           * Internal whether the dates after the current date are disabled. By default, this is false.
          */
@@ -2617,8 +2830,16 @@ declare namespace LocalJSX {
         "selectedYear"?: number;
     }
     interface B2bDatePickerDaysHeader {
+        /**
+          * Internal the language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language"?: 'de' | 'en';
     }
     interface B2bDatePickerHeader {
+        /**
+          * The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language"?: 'de' | 'en';
         /**
           * Event emitted for next month click*
          */
@@ -2641,6 +2862,10 @@ declare namespace LocalJSX {
         "selectedYear"?: number;
     }
     interface B2bDatePickerMonths {
+        /**
+          * Internal The language for month and the weekdays will be decided based on the given input. By default, this will be de which is german
+         */
+        "language"?: 'de' | 'en';
         /**
           * Event emitted on selecting month*
          */
@@ -3288,6 +3513,44 @@ declare namespace LocalJSX {
          */
         "alignment"?: 'vertical' | 'horizontal';
     }
+    interface B2bSnackbar {
+        /**
+          * Text for the Call-to-Action link.
+         */
+        "actionLabel"?: string;
+        /**
+          * Text on the snackbar.
+         */
+        "description"?: string;
+        /**
+          * How long is snackbar shown. Default value is 5000 ms.
+         */
+        "duration"?: number;
+        /**
+          * Whether the snackbar has a Call-to-Action. Per default, it is false.
+         */
+        "hasAction"?: boolean;
+        /**
+          * Emits whenever the CTA is clicked.
+         */
+        "onB2b-action-click"?: (event: B2bSnackbarCustomEvent<void>) => void;
+        /**
+          * Emits whenever the snackbar is closed.
+         */
+        "onB2b-close"?: (event: B2bSnackbarCustomEvent<void>) => void;
+        /**
+          * Whether the snackbar is currently visible. Set to true to display the snackbar.
+         */
+        "opened"?: boolean;
+        /**
+          * Whether snackbar is show for limited time. Default is true. Error snackbars cannot be timed.
+         */
+        "timed"?: boolean;
+        /**
+          * The type of snackbar. Default is info.
+         */
+        "type"?: 'info' | 'success' | 'warning' | 'error';
+    }
     /**
      * Spinner component to display loading indicator.
      * Initial story: https://otto-eg.atlassian.net/browse/B2BDS-70
@@ -3420,7 +3683,7 @@ declare namespace LocalJSX {
          */
         "onB2b-open"?: (event: B2bTableRowCustomEvent<boolean>) => void;
         /**
-          * Emits if the row is selectable and it is selected or unselected. Emits both unique value and the checkbox status.
+          * Emits if the row is selectable and if it is selected or unselected. Emits both unique value and the checkbox status.
          */
         "onB2b-row-selected"?: (event: B2bTableRowCustomEvent<CheckboxEventDetail1>) => void;
         /**
@@ -3578,10 +3841,6 @@ declare namespace LocalJSX {
           * The value associated with the toggle chip. This is emitted when the chip is interacted with.
          */
         "value": any;
-        /**
-          * The color scheme of the toggle button. Use white for grey backgrounds and grey for white backgrounds. Per default, it is grey
-         */
-        "variant"?: 'grey' | 'white';
     }
     interface B2bToggleGroup {
         /**
@@ -3733,6 +3992,7 @@ declare namespace LocalJSX {
         "b2b-scrollable-container": B2bScrollableContainer;
         "b2b-search": B2bSearch;
         "b2b-separator": B2bSeparator;
+        "b2b-snackbar": B2bSnackbar;
         "b2b-spinner": B2bSpinner;
         "b2b-tab": B2bTab;
         "b2b-tab-group": B2bTabGroup;
@@ -3818,6 +4078,7 @@ declare module "@stencil/core" {
             "b2b-scrollable-container": LocalJSX.B2bScrollableContainer & JSXBase.HTMLAttributes<HTMLB2bScrollableContainerElement>;
             "b2b-search": LocalJSX.B2bSearch & JSXBase.HTMLAttributes<HTMLB2bSearchElement>;
             "b2b-separator": LocalJSX.B2bSeparator & JSXBase.HTMLAttributes<HTMLB2bSeparatorElement>;
+            "b2b-snackbar": LocalJSX.B2bSnackbar & JSXBase.HTMLAttributes<HTMLB2bSnackbarElement>;
             /**
              * Spinner component to display loading indicator.
              * Initial story: https://otto-eg.atlassian.net/browse/B2BDS-70

package/dist/types/utils/datepicker/date-picker-util.d.ts

@@ -0,0 +1,14 @@
+export declare class DateUtils {
+    static isSameDate(date1: Date, date2: Date): boolean;
+    static isDisabledDate(givenDate: Date, options: {
+        disableDates?: Date[];
+        disablePastDates?: boolean;
+        disableFutureDates?: boolean;
+        disableWeekends?: boolean;
+        todayWithoutTime?: Date;
+        disableEvery?: string[];
+        disableDatesUntil?: Date;
+        disableDatesFrom?: Date;
+    }): boolean;
+    static parseStringToDateArray(value: string): Date[];
+}