@dubai-design-system/components-js 4.1.0 → 5.0.0

package/dist/types/components/dda-pagination/dda-pagination.stories.d.ts

@@ -30,6 +30,78 @@ declare const _default: {
             options: string[];
             description: string;
         };
+        simple_slider_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        simple_slider_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        buttons_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        buttons_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        text_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        text_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        text_pages_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        text_pages_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        button_text_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        button_text_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        buttons_pages_prev_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        buttons_pages_next_button: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-phonefield/dda-phonefield.d.ts

@@ -21,6 +21,13 @@ export declare class DdaPhoneField {
     aria_label: string;
     button_id?: string;
     button_aria_label: string;
+    toggle_button_name: string;
+    country_select_button_name: string;
+    phone_input_name: string;
+    autocomplete: string;
+    private get helperId();
+    private get errorId();
+    private get describedBy();
     componentWillLoad(): void;
     toggleDropdown(): void;
     selectCountry(country: {

package/dist/types/components/dda-phonefield/dda-phonefield.stories.d.ts

@@ -79,6 +79,30 @@ declare const _default: {
             };
             description: string;
         };
+        toggle_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        country_select_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        phone_input_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        autocomplete: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-progressbar/dda-progressbar.d.ts

@@ -5,5 +5,6 @@ export declare class DdaProgressBar {
     show_percentage_text: boolean;
     custom_class: string;
     component_mode?: string;
+    aria_label: string;
     render(): any;
 }

package/dist/types/components/dda-progressbar/dda-progressbar.stories.d.ts

@@ -36,6 +36,13 @@ declare const _default: {
             options: string[];
             description: string;
         };
+        aria_label: {
+            control: {
+                type: string;
+            };
+            description: string;
+            defaultValue: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-range-slider/dda-range-slider.d.ts

@@ -14,6 +14,8 @@ export declare class DdaRangeSlider {
     right_input_id: string;
     left_aria_label?: string;
     right_aria_label?: string;
+    left_input_name: string;
+    right_input_name: string;
     componentWillLoad(): void;
     handleMinChange(event: any): void;
     handleMaxChange(event: any): void;

package/dist/types/components/dda-range-slider/dda-range-slider.stories.d.ts

@@ -66,6 +66,18 @@ declare const _default: {
             };
             description: string;
         };
+        left_input_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        right_input_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-search-input/dda-search-input.d.ts

@@ -10,9 +10,16 @@ export declare class DdaSearchInput {
     custom_class?: string;
     component_mode?: string;
     button_id?: string;
+    input_id?: string;
     aria_label?: string;
     button_aria_label?: string;
+    search_input_name: string;
+    close_button_name: string;
+    search_button_name: string;
     el: HTMLElement;
+    private get helperId();
+    private get errorId();
+    private get describedBy();
     clearInput(): void;
     render(): any;
 }

package/dist/types/components/dda-search-input/dda-search-input.stories.d.ts

@@ -59,6 +59,12 @@ declare const _default: {
             };
             description: string;
         };
+        input_id: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
         aria_label: {
             control: {
                 type: string;
@@ -77,6 +83,24 @@ declare const _default: {
             };
             description: string;
         };
+        search_input_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        close_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        search_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-select/dda-select.d.ts

@@ -12,8 +12,23 @@ export declare class Ddaselect {
     component_mode?: string;
     aria_label?: string;
     button_id: string;
+    toggle_button_name: string;
+    option_select_button_name: string;
+    el: HTMLElement;
+    private pendingFocusIndex;
+    private get listboxId();
+    private get helperId();
+    private get errorId();
+    private get describedBy();
     private get parsedOptions();
+    private focusOption;
+    private currentFocusedOptionIndex;
+    private initialOptionIndex;
     toggleSelect(): void;
+    private closeAndReturnFocus;
     selectOption(option: string): void;
+    private onTriggerKeyDown;
+    private onOptionKeyDown;
+    componentDidRender(): void;
     render(): any;
 }

package/dist/types/components/dda-select/dda-select.stories.d.ts

@@ -65,6 +65,18 @@ declare const _default: {
             };
             description: string;
         };
+        toggle_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        option_select_button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-sticky-footer/dda-sticky-footer.d.ts

@@ -28,9 +28,11 @@ export declare class DdaStickyFooter {
     thirdLogoTooltip: string;
     /** Right Section Props */
     locationButtonHref: string;
+    locationLogoSrc: string;
     locationButtonText: string;
     locationButtonIcon: string;
     newsButtonHref: string;
+    newsButtonSrc: string;
     newsButtonText: string;
     newsButtonIcon: string;
     aiIconHref: string;
@@ -41,5 +43,12 @@ export declare class DdaStickyFooter {
     chatIconSrc: string;
     chatIconAlt: string;
     chatIconTooltip: string;
+    isHidden: boolean;
+    private lastScrollY;
+    hideMiddleSection: boolean;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    handleScroll(): void;
     render(): any;
 }

package/dist/types/components/dda-sticky-footer/dda-sticky-footer.stories.d.ts

@@ -1,6 +1,14 @@
 declare const _default: {
     title: string;
     tags: string[];
+    argTypes: {
+        hideMiddleSection: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+    };
     component: string;
     parameters: {
         docs: {

package/dist/types/components/dda-tabs/dda-tabs.d.ts

@@ -1,3 +1,4 @@
+import { EventEmitter } from '../../stencil-public-runtime';
 export declare class DdaTabs {
     type: 'text' | 'text-icon';
     hover_style: 'dda-tab-default' | 'dda-tab-filed' | 'dda-tab-underline' | 'dda-tab-underline-filled';
@@ -6,11 +7,14 @@ export declare class DdaTabs {
     component_mode?: string;
     button_id?: string;
     aria_label: string;
+    tab_texts: string;
+    tab_icons: string;
+    button_name: string;
+    tabClick?: EventEmitter<void>;
+    private tabhandler;
     active_tab: number;
-    tabs: {
-        title: string;
-        icon: string;
-    }[];
+    get parsedTabs(): any;
+    get parsedIcons(): any;
     setActiveTab(index: number): void;
     render(): any;
 }

package/dist/types/components/dda-tabs/dda-tabs.stories.d.ts

@@ -41,6 +41,22 @@ declare const _default: {
             };
             description: string;
         };
+        tab_texts: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        onTabClick: {
+            action: string;
+            description: string;
+        };
+        button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-textarea/dda-textarea.d.ts

@@ -13,10 +13,17 @@ export declare class DdaTextarea {
     component_mode?: string;
     input_id: string;
     aria_label?: string;
+    textarea_name: string;
     el: HTMLElement;
     characterCount: number;
     private quill;
+    private get labelId();
+    private get helperId();
+    private get errorId();
+    private get describedBy();
+    private syncRichEditorA11y;
     componentDidLoad(): void;
+    componentDidUpdate(): void;
     handleInput(event: any): void;
     render(): any;
 }

package/dist/types/components/dda-textarea/dda-textarea.stories.d.ts

@@ -77,6 +77,12 @@ declare const _default: {
             };
             description: string;
         };
+        textarea_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {

package/dist/types/components/dda-tooltip/dda-tooltip.d.ts

@@ -1,8 +1,14 @@
 export declare class DdaTooltip {
+    el: HTMLElement;
     title_text: string;
     description: string;
     position: 'top' | 'bottom' | 'left' | 'right';
     custom_class?: string;
     component_mode?: string;
+    dismissed: boolean;
+    private handleKeyDown;
+    private resetDismissed;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     render(): any;
 }

package/dist/types/components/dda-ui-card/dda-ui-card.d.ts

@@ -0,0 +1,13 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class DdaUiCard {
+    type: 'default' | 'custom';
+    icon: string;
+    image: string;
+    maintitle: string;
+    subtitle: string;
+    link: string;
+    linktext: string;
+    linkicon: string;
+    linkClick?: EventEmitter<void>;
+    render(): any;
+}

package/dist/types/components/segmented-groups/dda-segmented-tabs/dda-segmented-tabs.d.ts

@@ -1,9 +1,22 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
 export declare class DdaSegmentedTabs {
     items: string;
     radius_type: string;
     custom_class: string;
     component_mode?: string;
+    button_name: string;
+    /** Accessible name for the group (applied as aria-label on the group container). */
+    aria_label: string;
+    /** Index of the segment selected by default. Clamped to a valid item index. */
+    selected_index: number;
+    /** F-004 repair: the currently-selected segment. Exactly one segment is
+     * selected at a time; this is what makes the component interactive at all. */
+    active_index: number;
+    /** Emits the newly-selected index whenever the selection changes. */
+    segmentChange: EventEmitter<number>;
     private parsedItems;
     componentWillLoad(): void;
+    private clampIndex;
+    private selectSegment;
     render(): any;
 }

package/dist/types/components/segmented-groups/dda-segmented-tabs/dda-segmented-tabs.stories.d.ts

@@ -26,6 +26,24 @@ declare const _default: {
             options: string[];
             description: string;
         };
+        button_name: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        aria_label: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
+        selected_index: {
+            control: {
+                type: string;
+            };
+            description: string;
+        };
     };
     parameters: {
         docs: {