@rededor/cura 1.2.0 → 1.4.0-alpha.0

package/dist/types/components/accordion/cura-accordion/cura-accordion.d.ts

@@ -4,7 +4,6 @@ export declare class CuraAccordion {
      * Color scheme base color
      */
     color: string;
-    activeColor: string;
     handleChangeColor(): void;
     /**
      * Set the color mode to dark or light
@@ -14,19 +13,24 @@ export declare class CuraAccordion {
      * Accordion items icons
      */
     iconSize: number;
+    labelIcon: string;
     openIcon: string;
     closeIcon: string;
     /**
      * Color scheme base color
-     * (By default, the icon will use the same color of 'color' and 'activeColor')
+     * (By default, the icon will use the same color of 'color')
      */
     iconColor: string;
-    iconActiveColor: string;
     /**
      * Accordion behavior when item is clicked
      * (The default will close all items except the current one)
      */
     behavior: 'default' | 'keep-open';
+    /**
+     * Heading level for semantics. Will render the related HTML tag <h1>, <h2>, ...
+     * Values: 1 to 6 (3 default).
+     */
+    level: 1 | 2 | 3 | 4 | 5 | 6;
     mutationObserverCallback: (mutations: MutationRecord[], _: MutationObserver) => void;
     mutationObserver: MutationObserver;
     styles: {};

package/dist/types/components/accordion/cura-accordion/cura-accordion.stories.d.ts

@@ -19,7 +19,7 @@ declare const _default: {
             };
             name: string;
         };
-        activeColor: {
+        colorMode: {
             control: {
                 type: string;
             };
@@ -33,7 +33,7 @@ declare const _default: {
             };
             name: string;
         };
-        colorMode: {
+        behavior: {
             control: {
                 type: string;
             };
@@ -47,21 +47,22 @@ declare const _default: {
             };
             name: string;
         };
-        behavior: {
+        level: {
             control: {
                 type: string;
+                min: number;
+                max: number;
+                step: number;
             };
-            options: string[];
             description: string;
             table: {
                 category: string;
                 defaultValue: {
-                    summary: string;
+                    summary: number;
                 };
             };
-            name: string;
         };
-        openIcon: {
+        labelIcon: {
             control: {
                 type: string;
             };
@@ -69,13 +70,10 @@ declare const _default: {
             description: string;
             table: {
                 category: string;
-                defaultValue: {
-                    summary: string;
-                };
             };
             name: string;
         };
-        closeIcon: {
+        openIcon: {
             control: {
                 type: string;
             };
@@ -89,7 +87,7 @@ declare const _default: {
             };
             name: string;
         };
-        iconSize: {
+        closeIcon: {
             control: {
                 type: string;
             };
@@ -103,7 +101,7 @@ declare const _default: {
             };
             name: string;
         };
-        iconColor: {
+        iconSize: {
             control: {
                 type: string;
             };
@@ -111,10 +109,13 @@ declare const _default: {
             description: string;
             table: {
                 category: string;
+                defaultValue: {
+                    summary: string;
+                };
             };
             name: string;
         };
-        iconActiveColor: {
+        iconColor: {
             control: {
                 type: string;
             };
@@ -135,20 +136,41 @@ declare const _default: {
                 };
             };
         };
+        label: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
+        labelIconItem: {
+            control: {
+                type: string;
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
     };
 };
 export default _default;
 export declare const Accordion: {
     args: {
         color: string;
-        activeColor: string;
         colorMode: string;
+        labelIcon: string;
         openIcon: string;
         closeIcon: string;
         iconSize: string;
         iconColor: string;
-        iconActiveColor: string;
         behavior: string;
+        level: string;
         darkBackground: boolean;
+        label: string;
+        labelIconItem: string;
     };
 };

package/dist/types/components/accordion/cura-accordion-item/cura-accordion-item.d.ts

@@ -8,22 +8,27 @@ export declare class CuraAccordionItem {
      * Accordion items icons
      */
     iconSize: number;
+    labelIcon: string;
     openIcon: string;
     closeIcon: string;
     /**
      * Color scheme base color
-     * (By default, the icon will use the same color of 'color' and 'activeColor')
+     * (By default, the icon will use the same color of 'color')
      */
     iconColor: string;
-    iconActiveColor: string;
     /**
      * Set the color mode to dark or light
      */
     colorMode: 'dark' | 'light';
+    /**
+     * Heading level for semantics. Will render the related HTML tag <h1>, <h2>, ...
+     * Values: 1 to 6 (3 default).
+     */
+    level: 1 | 2 | 3 | 4 | 5 | 6;
     opened: boolean;
     styles: {};
-    getIconColor(): string;
     getClasses(): {};
     accordionItemClick(_: Event): void;
+    renderIcon(): any;
     render(): any;
 }

package/dist/types/components/buttons/cura-button-select/cura-button-select.d.ts

@@ -8,6 +8,7 @@ export declare class CuraButtonSelect {
     disabled: boolean;
     background: 'dark' | 'light';
     color: string;
+    iconPosition: 'left' | 'right';
     hovered: boolean;
     styles: {};
     onclick: EventEmitter<{
@@ -23,6 +24,7 @@ export declare class CuraButtonSelect {
     getColorBagdeNumber(): string;
     getIcon(): any;
     getCounter(): any;
+    getCheckIconRight(): any;
     handleMouseEnter(): void;
     handleMouseLeave(): void;
     handleClick(e: Event): void;

package/dist/types/components/buttons/cura-button-select/cura-button-select.stories.d.ts

@@ -88,6 +88,19 @@ declare const _default: {
                 };
             };
         };
+        iconPosition: {
+            control: {
+                type: string;
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
     };
 };
 export default _default;
@@ -101,5 +114,6 @@ export declare const Button: {
         background: string;
         color: string;
         label: string;
+        iconPosition: string;
     };
 };

package/dist/types/components/cura-modal/cura-modal.d.ts

@@ -0,0 +1,28 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class CuraModal {
+    /**
+     * Property open to control modal visibility.
+     * Default: false
+     */
+    open?: boolean;
+    /**
+     * Property background to control modal backdrop color.
+     * Default: light
+     */
+    background?: 'dark' | 'light';
+    /**
+     * Property offsetTop to control modal top position.
+     * Default: 0px
+     */
+    topOffset?: number;
+    /**
+     * Event close to handle modal close.
+     */
+    modalClose: EventEmitter<void>;
+    styles: {};
+    setColors(): void;
+    setOffsetTop(): void;
+    connectedCallback(): void;
+    private handleClose;
+    render(): any;
+}

package/dist/types/components/cura-modal/cura-modal.stories.d.ts

@@ -0,0 +1,70 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    render: ({ ...args }: {
+        [x: string]: any;
+    }) => string;
+    argTypes: {
+        open: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: boolean;
+                };
+            };
+        };
+        background: {
+            control: {
+                type: string;
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        topOffset: {
+            control: {
+                type: string;
+            };
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        content: {
+            control: {
+                type: string;
+            };
+            description: string;
+            table: {
+                category: string;
+            };
+        };
+        close: {
+            action: string;
+            description: string;
+            name: string;
+            table: {
+                category: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const CuraModal: {
+    args: {
+        background: string;
+        open: boolean;
+        content: string;
+        topOffset: number;
+    };
+};

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

@@ -0,0 +1,25 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class CuraTooltip {
+    host: HTMLElement;
+    elementId: string;
+    interactive: boolean;
+    delay: number;
+    maxWidth: string;
+    position: 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-start' | 'bottom' | 'bottom-end' | 'left-start' | 'left' | 'left-end';
+    label: string;
+    closeButton: boolean;
+    isMobile: boolean;
+    tooltipClosed: EventEmitter<void>;
+    targetElement: HTMLElement;
+    styles: {};
+    onWindowResize(): void;
+    onWindowScroll(): void;
+    connectedCallback(): void;
+    render(): any;
+    componentDidLoad(): void;
+    setStyle(): void;
+    getClasses(): {};
+    setPosition(element: HTMLElement): void;
+    closeContainer(): void;
+    handleClose: () => void;
+}

package/dist/types/components/cura-tooltip/cura-tooltip.stories.d.ts

@@ -0,0 +1,119 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+    render: ({ ...args }: {
+        [x: string]: any;
+    }) => string;
+    argTypes: {
+        targetElementId: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
+        interactive: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
+        delay: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: number;
+                };
+            };
+            name: string;
+        };
+        maxWidth: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: string;
+                };
+            };
+            name: string;
+        };
+        label: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
+        position: {
+            control: {
+                type: string;
+            };
+            options: string[];
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: string;
+                };
+            };
+            name: string;
+        };
+        closeButton: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+                defaultValue: {
+                    summary: boolean;
+                };
+            };
+            name: string;
+        };
+        targetElement: {
+            control: string;
+            description: string;
+            table: {
+                category: string;
+            };
+            name: string;
+        };
+        content: {
+            control: string;
+            description: string;
+            defaultValue: string;
+            table: {
+                category: string;
+            };
+        };
+        closeEvent: {
+            control: string;
+            description: string;
+            name: string;
+            table: {
+                category: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Tooltip: {
+    args: {
+        targetElement: string;
+        targetElementId: string;
+        interactive: boolean;
+        delay: number;
+        maxWidth: string;
+        label: string;
+        position: string;
+        closeButton: boolean;
+        content: string;
+    };
+    closeEvent: string;
+};

package/dist/types/components/forms/cura-dropdown-search/cura-dropdown-search.d.ts

@@ -127,5 +127,6 @@ export declare class CuraDropdownSearch {
         '--dropdown-max-height': string;
     };
     handleOnFocus(): void;
+    getDropdownSearchListHeight(): void;
     render(): any;
 }

package/dist/types/components/forms/cura-input-date/cura-input-date.d.ts

@@ -47,36 +47,35 @@ export declare class CuraInputDate {
      * @type {EventEmitter<string>}
      */
     dateChange: EventEmitter<string>;
+    /**
+     * Emitted when the value of the status changes
+     * @type {EventEmitter<string>}
+     */
+    statusInputChange: EventEmitter<string>;
     styles: {};
     isCalendarVisible: boolean;
     dates: Date[];
     value?: string;
+    dateSettings: {
+        placeholder: any;
+        mask: string;
+        mode: string;
+    };
     connectedCallback(): void;
+    componentWillLoad(): void;
     /**
      * Callback for form association
      */
     formAssociatedCallback(form: {
         ariaLabel: string;
     }): void;
-    /**
-     * Formats the placeholder based on the enableRangeDates flag
-     *
-     * @returns {string} A string representing the placeholder format,
-     * either for a date range ('dd/mm/yyyy - dd/mm/yyyy') or a single date ('dd/mm/yyyy')
-     */
-    setPlaceholder(): string;
-    /**
-     * Sets the mask type based on the enableRangeDates flag
-     *
-     * @returns {string} The mask type, either 'dateRange' or 'date'
-     */
-    setMask(): string;
-    /**
-     * Sets the mode type based on the enableRangeDates flag
-     *
-     * @returns {'range' | 'single'}
-     */
-    setMode(): 'range' | 'single';
+    updateDateSettings(): void;
+    getDateSettings(isRange: boolean): {
+        placeholder: string;
+        mask: string;
+        mode: string;
+    };
+    shouldUpdateDateSettings(newSettings: any): boolean;
     handleClick(ev: {
         target: Node;
     }): void;
@@ -87,6 +86,7 @@ export declare class CuraInputDate {
     isDateValid(date: Date): boolean;
     parseStringToDate(dateString: string): Date;
     parseDateToString(date: Date): string;
+    resetDates(): void;
     renderCalendarOrHelperText(): any;
     render(): any;
 }

package/dist/types/components/text/cura-heading/cura-heading.d.ts

@@ -53,6 +53,7 @@ export declare class CuraHeading {
         '--margin-block': string;
         '--font-size-base': string;
         '--line-height': string;
+        '--color-body': string;
     };
     setColors(): void;
     getHeadingTag(): any;