@makolabs/ripple/dist/layout/navbar/navbar.d.ts

Simple Svelte 5 powered component library ✨

import type { ClassValue } from 'tailwind-variants';
import type { Snippet } from 'svelte';
import type { Component } from 'svelte';
import { Size, Color } from '../../variants.js';
export type NavbarLinkItem = {
    label: string;
    href: string;
    icon?: Component;
    current?: boolean;
    children?: NavbarLinkItem[];
};
export declare const navbar: import("tailwind-variants").TVReturnType<{
    color: {
        [Color.DEFAULT]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.PRIMARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.SECONDARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
    };
    size: {
        [Size.SM]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.BASE]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.LG]: {
            container: string;
            link: string;
            mobileLink: string;
        };
    };
    active: {
        true: {};
    };
}, {
    base: string;
    wrapper: string;
    container: string;
    brand: string;
    menu: string;
    mobileMenu: string;
    mobileMenuButton: string;
    mobileMenuContainer: string;
    links: string;
    link: string;
    mobileLink: string;
    actions: string;
    avatar: string;
    selectButton: string;
    selectMenu: string;
    selectItem: string;
    divider: string;
}, undefined, {
    color: {
        [Color.DEFAULT]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.PRIMARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.SECONDARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
    };
    size: {
        [Size.SM]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.BASE]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.LG]: {
            container: string;
            link: string;
            mobileLink: string;
        };
    };
    active: {
        true: {};
    };
}, {
    base: string;
    wrapper: string;
    container: string;
    brand: string;
    menu: string;
    mobileMenu: string;
    mobileMenuButton: string;
    mobileMenuContainer: string;
    links: string;
    link: string;
    mobileLink: string;
    actions: string;
    avatar: string;
    selectButton: string;
    selectMenu: string;
    selectItem: string;
    divider: string;
}, import("tailwind-variants").TVReturnType<{
    color: {
        [Color.DEFAULT]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.PRIMARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
        [Color.SECONDARY]: {
            base: string;
            mobileMenuButton: string;
            link: string;
            mobileLink: string;
            selectItem: string;
        };
    };
    size: {
        [Size.SM]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.BASE]: {
            container: string;
            link: string;
            mobileLink: string;
        };
        [Size.LG]: {
            container: string;
            link: string;
            mobileLink: string;
        };
    };
    active: {
        true: {};
    };
}, {
    base: string;
    wrapper: string;
    container: string;
    brand: string;
    menu: string;
    mobileMenu: string;
    mobileMenuButton: string;
    mobileMenuContainer: string;
    links: string;
    link: string;
    mobileLink: string;
    actions: string;
    avatar: string;
    selectButton: string;
    selectMenu: string;
    selectItem: string;
    divider: string;
}, undefined, unknown, unknown, undefined>>;
export type NavbarProps = {
    logo?: string | Component;
    links?: NavbarLinkItem[];
    class?: ClassValue;
    brand?: Snippet;
    children?: Snippet;
    actions?: Snippet;
};