@webx-ui/core 0.6.0 → 0.8.0

package/dist/components/Menu/Menu.d.ts

@@ -0,0 +1,45 @@
+import { MenuValue } from '../../composables/useMenu';
+import { MenuProps } from './types';
+type __VLS_Props = MenuProps;
+type __VLS_PublicProps = {
+    modelValue?: MenuValue | undefined;
+    'open'?: MenuValue[];
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        list: HTMLUListElement;
+    };
+    rootEl: HTMLUListElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: MenuValue | undefined) => any;
+    select: (value: MenuValue, event: MouseEvent) => any;
+    "update:open": (value: MenuValue[]) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: MenuValue | undefined) => any) | undefined;
+    onSelect?: ((value: MenuValue, event: MouseEvent) => any) | undefined;
+    "onUpdate:open"?: ((value: MenuValue[]) => any) | undefined;
+}>, {
+    size: import('./types').MenuSize;
+    label: string;
+    collapsed: boolean;
+    mode: import('./types').MenuMode;
+    overflow: import('./types').MenuOverflow;
+    overflowTitle: string;
+    accordion: boolean;
+    autoExpand: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    list: HTMLUListElement;
+}, HTMLUListElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxMenu } from './Menu';
+export type * from './types';

package/dist/components/Menu/nodes.d.ts

@@ -0,0 +1,30 @@
+import { PropType, VNode } from 'vue';
+/**
+ * The entries of a menu as a flat list, so they can be counted and split between the
+ * bar and the branch that holds what did not fit.
+ *
+ * A `v-for` arrives as one fragment holding many entries, and a `v-if` that is false
+ * arrives as a comment. Both have to go: the list is lined up index for index against
+ * the `<li>` elements the browser actually laid out, and a comment is not one.
+ */
+export declare function flattenEntries(nodes: VNode[]): VNode[];
+/**
+ * Renders vnodes that have already been created — the two halves of a split menu.
+ *
+ * It exists because a template can render a slot but not a slice of one, and the
+ * entries must be rendered *once*: an entry that appeared in both halves would
+ * register itself twice and report the wrong branch to the menu above it.
+ */
+export declare const WxMenuNodes: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    nodes: {
+        type: PropType<VNode[]>;
+        required: true;
+    };
+}>, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    nodes: {
+        type: PropType<VNode[]>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/Menu/types.d.ts

@@ -0,0 +1,36 @@
+import { MenuMode, MenuSize, MenuValue } from '../../composables/useMenu';
+export type { MenuMode, MenuSize, MenuValue };
+/**
+ * What a bar does with entries it has no room for: move them into a branch at the
+ * end of it, or let the bar scroll sideways. Vertical menus ignore this — a column
+ * has as much room as it needs.
+ */
+export type MenuOverflow = 'menu' | 'scroll';
+export interface MenuProps {
+    /** A sidebar down the page, or a bar across the top of it. */
+    mode?: MenuMode;
+    /** Row height and text size. */
+    size?: MenuSize;
+    /** What a bar does with the entries that do not fit across it. */
+    overflow?: MenuOverflow;
+    /** Title of the branch those entries move into. */
+    overflowTitle?: string;
+    /**
+     * The icon rail: labels are hidden and submenus open as flyouts beside the rail.
+     * Vertical menus only — there is nothing to collapse in a bar.
+     */
+    collapsed?: boolean;
+    /** Only one submenu stays open at a time. */
+    accordion?: boolean;
+    /**
+     * Opens the branch the active entry sits in. On by default: a sidebar rendered on
+     * a nested route should show where you are without being told.
+     */
+    autoExpand?: boolean;
+    /** Accessible name of the menu, e.g. `Main navigation`. */
+    label?: string;
+}
+export interface MenuEmits {
+    /** An entry was chosen. */
+    select: [value: MenuValue, event: MouseEvent];
+}

package/dist/components/MenuGroup/MenuGroup.d.ts

@@ -0,0 +1,21 @@
+import { MenuGroupProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        title?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLLIElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<MenuGroupProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<MenuGroupProps> & Readonly<{}>, {
+    title: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLLIElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/MenuGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxMenuGroup } from './MenuGroup';
+export type * from './types';

package/dist/components/MenuGroup/types.d.ts

@@ -0,0 +1,4 @@
+export interface MenuGroupProps {
+    /** Heading above the entries. On a collapsed rail it becomes a plain rule. */
+    title?: string;
+}

package/dist/components/MenuItem/MenuItem.d.ts

@@ -0,0 +1,32 @@
+import { MenuItemProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {}): any;
+        default?(_: {}): any;
+        trailing?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<MenuItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<MenuItemProps> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    disabled: boolean;
+    as: string | import('vue').Component;
+    label: string;
+    target: string;
+    value: import('..').MenuValue;
+    icon: import('..').IconName;
+    href: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/MenuItem/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxMenuItem } from './MenuItem';
+export type * from './types';

package/dist/components/MenuItem/types.d.ts

@@ -0,0 +1,23 @@
+import { Component } from 'vue';
+import { IconName } from '../Icon/types';
+import { MenuValue } from '../../composables/useMenu';
+export interface MenuItemProps {
+    /** What identifies the entry — the value the menu reports as selected. */
+    value?: MenuValue;
+    /** Icon before the label. The only thing left of the entry on a collapsed rail. */
+    icon?: IconName;
+    /**
+     * The label, when a slot would be overkill. It is also what a collapsed rail shows
+     * as the entry's title on hover.
+     */
+    label?: string;
+    /** Where the entry points. Without it the entry is a button. */
+    href?: string;
+    target?: string;
+    /** Renders through another component — `RouterLink`, say, with `to` in the attrs. */
+    as?: string | Component;
+    disabled?: boolean;
+}
+export interface MenuItemEmits {
+    click: [event: MouseEvent];
+}

package/dist/components/Row/Row.d.ts

@@ -0,0 +1,25 @@
+import { RowProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<RowProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<RowProps> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    align: import('./types').RowAlign;
+    justify: import('./types').RowJustify;
+    gutter: number | string;
+    gutterY: number | string;
+    wrap: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Row/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxRow } from './Row';
+export type * from './types';

package/dist/components/Row/types.d.ts

@@ -0,0 +1,17 @@
+import { Component } from 'vue';
+export type RowJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+export type RowAlign = 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+export interface RowProps {
+    /** Gap between columns: pixels as a number, or any CSS length. */
+    gutter?: number | string;
+    /** Gap between rows once the columns wrap. Defaults to `gutter`. */
+    gutterY?: number | string;
+    /** Distribution along the row. */
+    justify?: RowJustify;
+    /** Alignment across it. */
+    align?: RowAlign;
+    /** Lets columns wrap onto the next line. */
+    wrap?: boolean;
+    /** The element to render. */
+    as?: string | Component;
+}

package/dist/components/Scrollbar/Scrollbar.d.ts

@@ -0,0 +1,39 @@
+import { ScrollbarProps, ScrollMotion, ScrollTarget } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        viewport: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<ScrollbarProps, {
+    /** The scrolling element. */
+    el: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+    scrollTo: (options: ScrollTarget) => void | undefined;
+    scrollToTop: (behavior?: ScrollMotion) => void | undefined;
+    scrollToBottom: (behavior?: ScrollMotion) => void | undefined;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    scroll: (event: Event) => any;
+}, string, import('vue').PublicProps, Readonly<ScrollbarProps> & Readonly<{
+    onScroll?: ((event: Event) => any) | undefined;
+}>, {
+    size: import('./types').ScrollbarSize;
+    always: boolean;
+    height: number | string;
+    maxHeight: number | string;
+    axis: import('./types').ScrollbarAxis;
+    chainScroll: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    viewport: HTMLDivElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Scrollbar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxScrollbar } from './Scrollbar';
+export type * from './types';

package/dist/components/Scrollbar/types.d.ts

@@ -0,0 +1,30 @@
+export type ScrollbarAxis = 'y' | 'x' | 'both';
+export type ScrollbarSize = 'sm' | 'md';
+export interface ScrollbarProps {
+    /** Fixed height: pixels as a number, or any CSS length. */
+    height?: number | string;
+    /** Height the box grows to before it starts scrolling. */
+    maxHeight?: number | string;
+    /** Which way the content scrolls. */
+    axis?: ScrollbarAxis;
+    /** Thickness of the bar. */
+    size?: ScrollbarSize;
+    /** Keeps the bar visible instead of fading it in on hover. */
+    always?: boolean;
+    /**
+     * Lets a scroll that reaches the end carry on to the page behind it. Off by
+     * default: a panel inside a dialog should not scroll the page under it.
+     */
+    chainScroll?: boolean;
+}
+export interface ScrollbarEmits {
+    scroll: [event: Event];
+}
+/** How a programmatic scroll moves — the native `ScrollBehavior` values. */
+export type ScrollMotion = 'auto' | 'smooth' | 'instant';
+/** Where to scroll to, in the shape the native `scrollTo` takes. */
+export interface ScrollTarget {
+    top?: number;
+    left?: number;
+    behavior?: ScrollMotion;
+}

package/dist/components/Space/Space.d.ts

@@ -0,0 +1,27 @@
+import { SpaceProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<SpaceProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SpaceProps> & Readonly<{}>, {
+    fill: boolean;
+    size: import('./types').SpaceSize | number | string;
+    as: string | import('vue').Component;
+    align: import('./types').SpaceAlign;
+    inline: boolean;
+    direction: import('./types').SpaceDirection;
+    justify: import('./types').SpaceJustify;
+    wrap: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Space/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxSpace } from './Space';
+export type * from './types';

package/dist/components/Space/types.d.ts

@@ -0,0 +1,23 @@
+import { Component } from 'vue';
+export type SpaceDirection = 'horizontal' | 'vertical';
+export type SpaceSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type SpaceAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';
+export type SpaceJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+export interface SpaceProps {
+    /** Along the line or down the page. */
+    direction?: SpaceDirection;
+    /** Gap between children: a keyword from the spacing scale, pixels, or any CSS length. */
+    size?: SpaceSize | number | string;
+    /** Cross-axis alignment. */
+    align?: SpaceAlign;
+    /** Main-axis distribution. */
+    justify?: SpaceJustify;
+    /** Lets a horizontal row wrap onto the next line. */
+    wrap?: boolean;
+    /** Children stretch to fill the row — equal-width buttons in a toolbar. */
+    fill?: boolean;
+    /** Renders as `inline-flex`, so the group sits inside a line of text. */
+    inline?: boolean;
+    /** The element to render. */
+    as?: string | Component;
+}

package/dist/components/Submenu/Submenu.d.ts

@@ -0,0 +1,31 @@
+import { SubmenuProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {}): any;
+        icon?(_: {}): any;
+        title?(_: {}): any;
+        title?(_: {}): any;
+        default?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLLIElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<SubmenuProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    toggle: (open: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<SubmenuProps> & Readonly<{
+    onToggle?: ((open: boolean) => any) | undefined;
+}>, {
+    disabled: boolean;
+    title: string;
+    icon: import('..').IconName;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLLIElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Submenu/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxSubmenu } from './Submenu';
+export type * from './types';

package/dist/components/Submenu/types.d.ts

@@ -0,0 +1,15 @@
+import { IconName } from '../Icon/types';
+import { MenuValue } from '../../composables/useMenu';
+export interface SubmenuProps {
+    /** What identifies the branch — the key the menu opens and closes it by. */
+    value: MenuValue;
+    /** Icon before the title. */
+    icon?: IconName;
+    /** The title, when a slot would be overkill. */
+    title?: string;
+    disabled?: boolean;
+}
+export interface SubmenuEmits {
+    /** The branch was opened or closed. */
+    toggle: [open: boolean];
+}

package/dist/components/index.d.ts

@@ -2,26 +2,35 @@ export * from './Accordion';
 export * from './AccordionItem';
 export * from './Action';
 export * from './Actions';
+export * from './Alert';
+export * from './Aside';
 export * from './Autocomplete';
 export * from './Badge';
+export * from './Breadcrumb';
+export * from './BreadcrumbItem';
 export * from './Button';
 export * from './ButtonGroup';
 export * from './Card';
 export * from './Cascader';
 export * from './Checkbox';
 export * from './CheckboxGroup';
+export * from './Col';
 export * from './ColorPicker';
+export * from './Container';
 export * from './Countdown';
 export * from './DatePicker';
 export * from './DateRangePicker';
 export * from './DateTimePicker';
 export * from './Dialog';
+export * from './Divider';
 export * from './Drawer';
 export * from './Dropdown';
 export * from './DropdownItem';
 export * from './EntityCard';
+export * from './Footer';
 export * from './Form';
 export * from './FormItem';
+export * from './Header';
 export * from './Heading';
 export * from './Icon';
 export * from './Indicator';
@@ -29,6 +38,11 @@ export * from './Input';
 export * from './InputNumber';
 export * from './Kanban';
 export * from './Link';
+export * from './ListDetail';
+export * from './Main';
+export * from './Menu';
+export * from './MenuGroup';
+export * from './MenuItem';
 export * from './Pagination';
 export * from './Popover';
 export * from './Prose';
@@ -36,9 +50,13 @@ export * from './Radio';
 export * from './RadioGroup';
 export * from './Rate';
 export * from './RichText';
+export * from './Row';
+export * from './Scrollbar';
 export * from './Select';
 export * from './Slider';
+export * from './Space';
 export * from './Statistic';
+export * from './Submenu';
 export * from './Switch';
 export * from './Tab';
 export * from './Table';

package/dist/composables/useBreadcrumb.d.ts

@@ -0,0 +1,13 @@
+import { ComputedRef, InjectionKey } from 'vue';
+import { IconName } from '../components/Icon/types';
+export type BreadcrumbSize = 'sm' | 'md';
+/** What `WxBreadcrumb` hands down to the items inside it. */
+export interface BreadcrumbContext {
+    /** The character drawn between items. */
+    separator: ComputedRef<string>;
+    /** An icon drawn instead of that character. */
+    separatorIcon: ComputedRef<IconName | undefined>;
+    size: ComputedRef<BreadcrumbSize>;
+}
+export declare const breadcrumbKey: InjectionKey<BreadcrumbContext>;
+export declare function useBreadcrumb(): BreadcrumbContext | null;

package/dist/composables/useControlAttrs.d.ts

@@ -0,0 +1,35 @@
+import { ComputedRef } from 'vue';
+/**
+ * Splits what the caller wrote on a control between its two halves.
+ *
+ * Every control here sets `inheritAttrs: false` and hands `$attrs` to the element
+ * inside it, so that `placeholder`, `autocomplete`, `data-*` and the ARIA attributes
+ * reach the real `<input>` rather than the wrapper around it. Taken literally that
+ * sends `class` and `style` there too, and both are then in the wrong place:
+ *
+ * - The caller means the control, not its input. `class="w-60"` on a `<wx-select>` is
+ *   asking for a narrower select, and the select is the wrapper.
+ * - A parent's scoped CSS cannot reach it. Scoped styles carry an attribute that is
+ *   stamped on a child component's *root*, so a class that lands three elements deep
+ *   matches nothing — silently.
+ * - And where `$attrs` is bound to an element that is only sometimes rendered — the
+ *   search field of a filterable `WxSelect` — the class disappears altogether.
+ *
+ * So `class` and `style` go on the root, and everything else goes on the control.
+ *
+ * ```ts
+ * const { rootAttrs, controlAttrs } = useControlAttrs()
+ * ```
+ * ```vue
+ * <div :class="classes" v-bind="rootAttrs">
+ *   <input v-bind="controlAttrs" />
+ * </div>
+ * ```
+ */
+export interface ControlAttrs {
+    /** `class` and `style` — for the wrapper the caller can see. */
+    rootAttrs: ComputedRef<Record<string, unknown>>;
+    /** Everything else — for the element the browser focuses and reads out. */
+    controlAttrs: ComputedRef<Record<string, unknown>>;
+}
+export declare function useControlAttrs(): ControlAttrs;

package/dist/composables/useElementWidth.d.ts

@@ -0,0 +1,17 @@
+import { Ref } from 'vue';
+/**
+ * The width of an element, kept up to date — the measurement every layout that
+ * answers to its own box rather than to the window is built on.
+ *
+ * `0` means nothing has been measured yet: on the server, and until the element is
+ * mounted. Treat it as "assume the roomy case" rather than as zero width, the way
+ * `useResponsiveShell` does — the real number arrives before paint.
+ *
+ * ```ts
+ * const el = ref<HTMLElement | null>(null)
+ * const width = useElementWidth(el)
+ * ```
+ *
+ * Pass nothing to measure the page itself.
+ */
+export declare function useElementWidth(target?: Ref<HTMLElement | null | undefined>): Ref<number>;

package/dist/composables/useMenu.d.ts

@@ -0,0 +1,49 @@
+import { ComputedRef, InjectionKey } from 'vue';
+export type MenuMode = 'vertical' | 'horizontal';
+export type MenuSize = 'sm' | 'md';
+/** What identifies an entry: whatever you would put in a route table. */
+export type MenuValue = string | number;
+/** What `WxMenu` hands down to everything inside it. */
+export interface MenuContext {
+    mode: ComputedRef<MenuMode>;
+    size: ComputedRef<MenuSize>;
+    /** The icon rail: labels hidden, submenus opening as flyouts. */
+    collapsed: ComputedRef<boolean>;
+    /** The entry that is currently selected. */
+    active: ComputedRef<MenuValue | undefined>;
+    /** The submenus the active entry sits in, outermost first. */
+    trail: ComputedRef<MenuValue[]>;
+    select: (value: MenuValue, event: MouseEvent) => void;
+    isOpen: (value: MenuValue) => boolean;
+    setOpen: (value: MenuValue, open: boolean, ancestors: MenuValue[]) => void;
+    /**
+     * Bumped when every open flyout should close — an entry inside one was chosen.
+     * A panel cannot close on any click of its own: the branches inside it are opened
+     * by clicking too, and that would shut the panel before they could unfold.
+     */
+    closeSignal: ComputedRef<number>;
+    closeFlyouts: () => void;
+    /**
+     * An entry says where it sits so a submenu can tell it holds the active one —
+     * the highlight on a collapsed branch, and what `autoExpand` follows.
+     */
+    register: (value: MenuValue, ancestors: MenuValue[]) => void;
+    unregister: (value: MenuValue) => void;
+}
+/** What a `WxSubmenu` hands down to the entries it holds. */
+export interface SubmenuContext {
+    /** The submenus above this one, outermost first, including itself. */
+    ancestors: MenuValue[];
+    /** How deep the entries below sit — what the indent is counted from. */
+    depth: number;
+    /**
+     * Whether these entries are already inside a flyout panel. A panel is a fresh
+     * surface: the depth restarts at its edge, and the branches in it open inline
+     * rather than throwing a second panel beside the first.
+     */
+    inFlyout: boolean;
+}
+export declare const menuKey: InjectionKey<MenuContext>;
+export declare const submenuKey: InjectionKey<SubmenuContext>;
+export declare function useMenu(): MenuContext | null;
+export declare function useSubmenu(): SubmenuContext;