@aotearoan/neon 25.0.2 → 25.2.0

package/dist/src/components/navigation/pagination/NeonPagination.d.ts

@@ -0,0 +1,565 @@
+import { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';
+/**
+ * A pagination component that displays a list of page numbers and allows the user to navigate between pages. Typically,
+ * the component displays the first and last page numbers and 3 pages before and after the current page.
+ */
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * The current page number.
+     */
+    page: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * The URL template for the pagination links. The template should contain a '{page}' placeholder that will be
+     * substituted in links with the correct page number.
+     */
+    urlTemplate: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The number of items per page.
+     */
+    pageSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The total number of items.
+     */
+    total: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * Whether to display links to the first and last pages.
+     */
+    displayFirstAndLast: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The accent color of the component.
+     */
+    color: {
+        type: () => NeonFunctionalColor;
+        default: () => NeonFunctionalColor;
+    };
+}>, {
+    pageCount: import("vue").ComputedRef<number>;
+    hidePagination: import("vue").ComputedRef<boolean>;
+    previousPage: import("vue").ComputedRef<number>;
+    disabledPrevious: import("vue").ComputedRef<boolean>;
+    nextPage: import("vue").ComputedRef<number>;
+    disabledNext: import("vue").ComputedRef<boolean>;
+    showFirstPageWithEllipsis: import("vue").ComputedRef<boolean>;
+    showLastPageWithEllipsis: import("vue").ComputedRef<boolean>;
+    pageRange: import("vue").ComputedRef<number[]>;
+    url: (page: number) => string;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The current page number.
+     */
+    page: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * The URL template for the pagination links. The template should contain a '{page}' placeholder that will be
+     * substituted in links with the correct page number.
+     */
+    urlTemplate: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The number of items per page.
+     */
+    pageSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The total number of items.
+     */
+    total: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * Whether to display links to the first and last pages.
+     */
+    displayFirstAndLast: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The accent color of the component.
+     */
+    color: {
+        type: () => NeonFunctionalColor;
+        default: () => NeonFunctionalColor;
+    };
+}>> & Readonly<{}>, {
+    color: NeonFunctionalColor;
+    pageSize: number;
+    displayFirstAndLast: boolean;
+}, {}, {
+    NeonButton: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        href: {
+            type: StringConstructor;
+            default: null;
+        };
+        label: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => import("../../../neon").NeonButtonSize;
+            default: import("../../../neon").NeonButtonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor;
+            default: NeonFunctionalColor;
+        };
+        inverse: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        alternateColor: {
+            type: () => NeonFunctionalColor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconAriaLabel: {
+            type: StringConstructor;
+        };
+        iconPosition: {
+            type: () => import("../../../neon").NeonHorizontalPosition;
+            default: import("../../../neon").NeonHorizontalPosition;
+        };
+        buttonStyle: {
+            type: () => import("../../../neon").NeonButtonStyle;
+            default: import("../../../neon").NeonButtonStyle;
+        };
+        buttonType: {
+            type: () => import("../../../neon").NeonButtonType;
+            default: import("../../../neon").NeonButtonType;
+        };
+        state: {
+            type: () => import("../../../neon").NeonState;
+            default: import("../../../neon").NeonState;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        transparent: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        outline: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        circular: {
+            type: BooleanConstructor;
+            default: null;
+        };
+        fullWidth: {
+            type: BooleanConstructor;
+            default: null;
+        };
+        indicator: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        indicatorExpanded: {
+            type: BooleanConstructor;
+            default: null;
+        };
+    }>, {
+        iconName: import("vue").ComputedRef<string>;
+        classes: import("vue").ComputedRef<(string | false | {
+            [x: string]: boolean | "" | NeonFunctionalColor;
+            'neon-button--text-transparent': boolean;
+            'neon-button--disabled': boolean;
+            'neon-button--inverse': boolean;
+            'neon-button--circular': boolean;
+            'neon-button--no-outline': boolean;
+            'neon-button--full-width': boolean;
+            'neon-button--with-icon neon-button--icon-only': boolean | "";
+            'neon-button--with-icon neon-button--icon-left': boolean | "";
+            'neon-button--with-icon neon-button--icon-right': boolean | "";
+        })[]>;
+        button: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+        attrs: {
+            [x: string]: unknown;
+        };
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        clickLink: () => void | undefined;
+        clickButton: () => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        href: {
+            type: StringConstructor;
+            default: null;
+        };
+        label: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => import("../../../neon").NeonButtonSize;
+            default: import("../../../neon").NeonButtonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor;
+            default: NeonFunctionalColor;
+        };
+        inverse: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        alternateColor: {
+            type: () => NeonFunctionalColor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconAriaLabel: {
+            type: StringConstructor;
+        };
+        iconPosition: {
+            type: () => import("../../../neon").NeonHorizontalPosition;
+            default: import("../../../neon").NeonHorizontalPosition;
+        };
+        buttonStyle: {
+            type: () => import("../../../neon").NeonButtonStyle;
+            default: import("../../../neon").NeonButtonStyle;
+        };
+        buttonType: {
+            type: () => import("../../../neon").NeonButtonType;
+            default: import("../../../neon").NeonButtonType;
+        };
+        state: {
+            type: () => import("../../../neon").NeonState;
+            default: import("../../../neon").NeonState;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        transparent: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        outline: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        circular: {
+            type: BooleanConstructor;
+            default: null;
+        };
+        fullWidth: {
+            type: BooleanConstructor;
+            default: null;
+        };
+        indicator: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        indicatorExpanded: {
+            type: BooleanConstructor;
+            default: null;
+        };
+    }>> & Readonly<{
+        onClick?: ((...args: any[]) => any) | undefined;
+    }>, {
+        color: NeonFunctionalColor;
+        icon: string;
+        label: string;
+        inverse: boolean;
+        disabled: boolean;
+        href: string;
+        size: import("../../../neon").NeonButtonSize;
+        outline: boolean;
+        alternateColor: NeonFunctionalColor;
+        iconPosition: import("../../../neon").NeonHorizontalPosition;
+        buttonStyle: import("../../../neon").NeonButtonStyle;
+        buttonType: import("../../../neon").NeonButtonType;
+        state: import("../../../neon").NeonState;
+        transparent: boolean;
+        circular: boolean;
+        fullWidth: boolean;
+        indicator: boolean;
+        indicatorExpanded: boolean;
+    }, {}, {
+        NeonExpansionIndicator: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            expanded: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean; /**
+                 * The current page number.
+                 */
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+        }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+            expanded: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean; /**
+                 * The current page number.
+                 */
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+        }>> & Readonly<{}>, {
+            color: NeonFunctionalColor;
+            inverse: boolean;
+            disabled: boolean;
+            expanded: boolean;
+        }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+        NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>, {
+            sanitizedAttributes: import("vue").ComputedRef<{
+                [x: string]: unknown;
+            }>;
+            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;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{}>, {
+            color: NeonFunctionalColor;
+            id: string;
+            inverse: boolean;
+            disabled: boolean;
+        }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+        NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            href: {
+                type: StringConstructor;
+                default: null;
+            };
+            noStyle: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            outlineStyle: {
+                type: () => import("../../../neon").NeonOutlineStyle;
+                default: import("../../../neon").NeonOutlineStyle;
+            };
+            externalIndicator: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>, {
+            neonLink: import("vue").Ref<HTMLAnchorElement | null, HTMLAnchorElement | null>;
+            routerUrl: import("vue").ComputedRef<string | undefined>;
+            sanitizedAttributes: import("vue").ComputedRef<{
+                [x: string]: unknown;
+            }>;
+            activeRoute: import("vue").ComputedRef<boolean | "">;
+            exactRoute: import("vue").ComputedRef<boolean | "">;
+            onClick: () => void;
+            onSpace: () => Promise<void>;
+        }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+            href: {
+                type: StringConstructor;
+                default: null;
+            };
+            noStyle: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            outlineStyle: {
+                type: () => import("../../../neon").NeonOutlineStyle;
+                default: import("../../../neon").NeonOutlineStyle;
+            };
+            externalIndicator: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onClick?: ((...args: any[]) => any) | undefined;
+        }>, {
+            href: string;
+            noStyle: boolean;
+            outlineStyle: import("../../../neon").NeonOutlineStyle;
+            externalIndicator: boolean;
+        }, {}, {
+            NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+                name: {
+                    type: StringConstructor;
+                    required: true;
+                };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
+                color: {
+                    type: () => NeonFunctionalColor;
+                    default: null;
+                };
+                inverse: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                disabled: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+            }>, {
+                sanitizedAttributes: import("vue").ComputedRef<{
+                    [x: string]: unknown;
+                }>;
+                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;
+                };
+                inverse: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                disabled: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+            }>> & Readonly<{}>, {
+                color: NeonFunctionalColor;
+                id: string;
+                inverse: boolean;
+                disabled: boolean;
+            }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+        }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        name: {
+            type: StringConstructor;
+            required: true;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        color: {
+            type: () => NeonFunctionalColor;
+            default: null;
+        };
+        inverse: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>, {
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        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;
+        };
+        inverse: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        color: NeonFunctionalColor;
+        id: string;
+        inverse: boolean;
+        disabled: boolean;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/src/components/navigation/pagination/NeonPagination.vue.d.ts

@@ -0,0 +1,2 @@
+export * from './NeonPagination.js';
+export { default } from './NeonPagination.js';

package/dist/src/components/presentation/labelled-content/NeonLabelledContent.d.ts

@@ -0,0 +1,64 @@
+/**
+ * A component for rendering a piece of content with a label.
+ */
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * The label to render.
+     */
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * A single line value to render. NOTE: for more complex content use the default slot instead.
+     */
+    value: {
+        type: StringConstructor;
+    };
+    /**
+     * Apply an "important" style to the label.
+     */
+    important: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Apply the "neon-number" style to the value.
+     */
+    numeric: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The label to render.
+     */
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * A single line value to render. NOTE: for more complex content use the default slot instead.
+     */
+    value: {
+        type: StringConstructor;
+    };
+    /**
+     * Apply an "important" style to the label.
+     */
+    important: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Apply the "neon-number" style to the value.
+     */
+    numeric: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    numeric: boolean;
+    important: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/src/components/presentation/labelled-content/NeonLabelledContent.vue.d.ts

@@ -0,0 +1,2 @@
+export * from './NeonLabelledContent.js';
+export { default } from './NeonLabelledContent.js';

package/dist/src/neon.d.ts

@@ -33,6 +33,7 @@ export { default as NeonInline } from './components/layout/inline/NeonInline.vue
 export { default as NeonInput } from './components/user-input/input/NeonInput.vue';
 export { default as NeonInputIndicator } from './components/user-input/input-indicator/NeonInputIndicator.vue';
 export { default as NeonLabel } from './components/presentation/label/NeonLabel.vue';
+export { default as NeonLabelledContent } from './components/presentation/labelled-content/NeonLabelledContent.vue';
 export { default as NeonLinearProgress } from './components/feedback/linear-progress/NeonLinearProgress.vue';
 export { default as NeonLink } from './components/navigation/link/NeonLink.vue';
 export { default as NeonList } from './components/user-input/list/NeonList.vue';
@@ -44,6 +45,9 @@ export { default as NeonNotificationCounter } from './components/feedback/notifi
 export { default as NeonNumber } from './components/user-input/number/NeonNumber.vue';
 export { default as NeonPage } from './components/layout/page/NeonPage.vue';
 export { default as NeonPageContainer } from './components/layout/page-container/NeonPageContainer.vue';
+export { default as NeonPageHeader } from './components/layout/page-header/NeonPageHeader.vue';
+export { default as NeonPageSection } from './components/layout/page-section/NeonPageSection.vue';
+export { default as NeonPagination } from './components/navigation/pagination/NeonPagination.vue';
 export { default as NeonPassword } from './components/user-input/password/NeonPassword.vue';
 export { default as NeonRangeSlider } from './components/user-input/range-slider/NeonRangeSlider.vue';
 export { default as NeonSideNav } from './components/layout/side-nav/NeonSideNav.vue';
@@ -55,6 +59,7 @@ export { default as NeonSlider } from './components/user-input/slider/NeonSlider
 export { default as NeonSplashLoader } from './components/feedback/splash-loader/NeonSplashLoader.vue';
 export { default as NeonStack } from './components/layout/stack/NeonStack.vue';
 export { default as NeonStepper } from './components/navigation/stepper/NeonStepper.vue';
+export { default as NeonStickyButtons } from './components/layout/sticky-buttons/NeonStickyButtons.vue';
 export { default as NeonSwiper } from './components/layout/swiper/NeonSwiper.vue';
 export { default as NeonSwitch } from './components/user-input/switch/NeonSwitch.vue';
 export { default as NeonTab } from './components/presentation/tabs/tab/NeonTab.vue';
@@ -110,10 +115,14 @@ export type { NeonDropdownMenuItem } from './common/models/NeonDropdownMenuItem'
 export type { NeonDropdownPlacementObject } from './common/models/NeonDropdownPlacementObject';
 export type { NeonFilterListItem } from './common/models/NeonFilterListItem';
 export type { NeonGridModel } from './common/models/NeonGridModel';
+export type { NeonIdentifiable } from './common/models/NeonIdentifiable';
 export type { NeonListItem } from './common/models/NeonListItem';
+export type { NeonLoadOnDemandModel } from './common/models/NeonLoadOnDemandModel';
 export type { NeonMenuItem } from './common/models/NeonMenuItem';
 export type { NeonMenuModel } from './common/models/NeonMenuModel';
+export type { NeonNoteModel } from './common/models/NeonNoteModel';
 export type { NeonNumberFormatOptions } from './common/models/NeonNumberFormatOptions';
+export type { NeonPaginationModel } from './common/models/NeonPaginationModel';
 export type { NeonPriorityMenuItem } from './components/navigation/menu/NeonPriorityMenuItem';
 export type { NeonSearchOption } from './common/models/NeonSearchOption';
 export type { NeonSelectGroup } from './common/models/NeonSelectGroup';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aotearoan/neon",
   "description": "Neon is a lightweight design library of Vue 3 components with minimal dependencies.",
-  "version": "25.0.2",
+  "version": "25.2.0",
   "main": "./dist/neon.cjs.js",
   "module": "./dist/neon.es.js",
   "types": "./dist/src/neon.d.ts",