@aotearoan/neon 22.5.0 → 22.5.2

package/dist/src/components/presentation/expansion-panel/NeonExpansionPanel.d.ts

@@ -195,6 +195,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -208,15 +212,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: boolean;
         };
     }>, {
-        attrs: {
+        sanitizedAttributes: import("vue").ComputedRef<{
             [x: string]: unknown;
-        };
-        icon: import("vue").ComputedRef<string>;
+        }>;
+        icon: import("vue").ComputedRef<string | undefined>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         name: {
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -232,6 +240,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }>> & Readonly<{}>, {
         disabled: boolean;
         color: NeonFunctionalColor;
+        id: string;
         inverse: boolean;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/src/components/presentation/icon/NeonIcon.d.ts

@@ -23,6 +23,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: true;
     };
+    /**
+     * An id to inject into the icon. This is necessary for rendering clipPaths correctly if the same icon is used
+     * multiple times on a page as the ids need to be unique.
+     */
+    id: {
+        type: StringConstructor;
+        default: null;
+    };
     /**
      * The color to render the icon. By default, it will be the current text color (light text in dark mode or dark text in light mode).
      */
@@ -45,10 +53,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
 }>, {
-    attrs: {
+    sanitizedAttributes: import("vue").ComputedRef<{
         [x: string]: unknown;
-    };
-    icon: import("vue").ComputedRef<string>;
+    }>;
+    icon: import("vue").ComputedRef<string | undefined>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The name of an icon registered in the icon registry.
@@ -57,6 +65,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: true;
     };
+    /**
+     * An id to inject into the icon. This is necessary for rendering clipPaths correctly if the same icon is used
+     * multiple times on a page as the ids need to be unique.
+     */
+    id: {
+        type: StringConstructor;
+        default: null;
+    };
     /**
      * The color to render the icon. By default, it will be the current text color (light text in dark mode or dark text in light mode).
      */
@@ -81,6 +97,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>> & Readonly<{}>, {
     disabled: boolean;
     color: NeonFunctionalColor;
+    id: string;
     inverse: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/src/components/presentation/image-carousel/NeonImageCarousel.d.ts

@@ -8,6 +8,13 @@ import type { NeonCarouselImage } from '@/common/models/NeonCarouselImage';
  * </p>
  */
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * The expanded state of the image carousel.
+     */
+    expanded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * The images to be displayed in the carousel.
      */
@@ -52,16 +59,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: string;
     };
 }>, {
-    emit: (event: "current-image", ...args: any[]) => void;
+    emit: (event: "current-image" | "update:expanded", ...args: any[]) => void;
     currentImage: import("vue").Ref<number, number>;
     carouselItem: import("vue").Ref<HTMLLIElement[], HTMLLIElement[]>;
     carouselItems: import("vue").Ref<HTMLUListElement | null, HTMLUListElement | null>;
     initialised: import("vue").Ref<boolean, boolean>;
-    expanded: import("vue").Ref<boolean, boolean>;
+    isExpanded: import("vue").Ref<boolean, boolean>;
     next: () => void;
     previous: () => void;
     scrollTo: (index: number) => void;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "current-image"[], "current-image", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    toggleExpanded: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("current-image" | "update:expanded")[], "current-image" | "update:expanded", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The expanded state of the image carousel.
+     */
+    expanded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * The images to be displayed in the carousel.
      */
@@ -107,7 +122,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
 }>> & Readonly<{
     "onCurrent-image"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:expanded"?: ((...args: any[]) => any) | undefined;
 }>, {
+    expanded: boolean;
     imageCountLabel: string;
     hideLabel: boolean;
     closeLabel: string;
@@ -311,6 +328,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         indicator: boolean;
         indicatorExpanded: boolean;
     }, {}, {
+        /**
+         * The images to be displayed in the carousel.
+         */
         NeonExpansionIndicator: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
             expanded: {
                 type: BooleanConstructor;
@@ -356,10 +376,21 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                /**
+                 * Provide an alternative label for the Next button.
+                 */
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => import("../../../neon").NeonFunctionalColor;
                 default: null;
-            };
+            }; /**
+             * The current expanded state of the image carousel.
+             *
+             * @type {boolean}
+             */
             inverse: {
                 type: BooleanConstructor;
                 default: boolean;
@@ -369,19 +400,30 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                /**
+                 * Provide an alternative label for the Next button.
+                 */
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => import("../../../neon").NeonFunctionalColor;
                 default: null;
-            };
+            }; /**
+             * The current expanded state of the image carousel.
+             *
+             * @type {boolean}
+             */
             inverse: {
                 type: BooleanConstructor;
                 default: boolean;
@@ -393,6 +435,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: import("../../../neon").NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
         NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -452,10 +495,21 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    /**
+                     * Provide an alternative label for the Next button.
+                     */
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => import("../../../neon").NeonFunctionalColor;
                     default: null;
-                };
+                }; /**
+                 * The current expanded state of the image carousel.
+                 *
+                 * @type {boolean}
+                 */
                 inverse: {
                     type: BooleanConstructor;
                     default: boolean;
@@ -465,19 +519,30 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    /**
+                     * Provide an alternative label for the Next button.
+                     */
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => import("../../../neon").NeonFunctionalColor;
                     default: null;
-                };
+                }; /**
+                 * The current expanded state of the image carousel.
+                 *
+                 * @type {boolean}
+                 */
                 inverse: {
                     type: BooleanConstructor;
                     default: boolean;
@@ -489,6 +554,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: import("../../../neon").NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
         }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -550,10 +616,21 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                /**
+                 * Provide an alternative label for the Next button.
+                 */
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => import("../../../neon").NeonFunctionalColor;
                 default: null;
-            };
+            }; /**
+             * The current expanded state of the image carousel.
+             *
+             * @type {boolean}
+             */
             inverse: {
                 type: BooleanConstructor;
                 default: boolean;
@@ -563,19 +640,30 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                /**
+                 * Provide an alternative label for the Next button.
+                 */
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => import("../../../neon").NeonFunctionalColor;
                 default: null;
-            };
+            }; /**
+             * The current expanded state of the image carousel.
+             *
+             * @type {boolean}
+             */
             inverse: {
                 type: BooleanConstructor;
                 default: boolean;
@@ -587,6 +675,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: import("../../../neon").NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/src/components/presentation/label/NeonLabel.d.ts

@@ -117,6 +117,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -130,15 +134,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: boolean;
         };
     }>, {
-        attrs: {
+        sanitizedAttributes: import("vue").ComputedRef<{
             [x: string]: unknown;
-        };
-        icon: import("vue").ComputedRef<string>;
+        }>;
+        icon: import("vue").ComputedRef<string | undefined>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         name: {
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -154,6 +162,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }>> & Readonly<{}>, {
         disabled: boolean;
         color: NeonFunctionalColor;
+        id: string;
         inverse: boolean;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/src/components/presentation/tabs/NeonTabs.d.ts

@@ -114,6 +114,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -127,15 +131,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -151,6 +159,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>[], import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -218,6 +227,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -231,15 +244,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -255,6 +272,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>[]>;
@@ -314,6 +332,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -327,15 +349,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: boolean;
         };
     }>, {
-        attrs: {
+        sanitizedAttributes: import("vue").ComputedRef<{
             [x: string]: unknown;
-        };
-        icon: import("vue").ComputedRef<string>;
+        }>;
+        icon: import("vue").ComputedRef<string | undefined>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         name: {
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -351,6 +377,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }>> & Readonly<{}>, {
         disabled: boolean;
         color: NeonFunctionalColor;
+        id: string;
         inverse: boolean;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -418,6 +445,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -431,15 +462,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -455,6 +490,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/src/components/presentation/tabs/tab/NeonTab.d.ts

@@ -17,15 +17,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: null;
     };
     /**
-     * By default, use CSS display property to show/hide tab contents. This flag will enable using v-if instead.
-     * */
-    toggleOnIf: {
+     * Use fade transition when switching tabs. This is useful to prevent a reflow.
+     */
+    transition: {
         type: BooleanConstructor;
         default: boolean;
     };
-}>, {
-    responsiveView: import("vue").Ref<boolean, boolean>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * True if the current tab is the visible tab.
      */
@@ -41,14 +39,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: null;
     };
     /**
-     * By default, use CSS display property to show/hide tab contents. This flag will enable using v-if instead.
-     * */
-    toggleOnIf: {
+     * Use fade transition when switching tabs. This is useful to prevent a reflow.
+     */
+    transition: {
         type: BooleanConstructor;
         default: boolean;
     };
 }>> & Readonly<{}>, {
     id: string;
-    toggleOnIf: boolean;
+    transition: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;