@imfusion/web-ui 0.6.4-dev.30.g1907865c → 0.6.4-dev.31.gcef47041
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -15
- package/dist/{code-Ce8uiPsv.js → code-D2lwxHgd.js} +15 -15
- package/dist/components/app-shell/app-shell.d.ts +7 -11
- package/dist/components/button/button.d.ts +3 -10
- package/dist/components/callout/callout.d.ts +4 -8
- package/dist/components/card/card.d.ts +5 -5
- package/dist/components/checkbox/checkbox.d.ts +2 -38
- package/dist/components/chip/chip.d.ts +1 -1
- package/dist/components/code/code.d.ts +1 -1
- package/dist/components/collapsible/collapsible.d.ts +3 -33
- package/dist/components/copy-button/copy-button.d.ts +1 -1
- package/dist/components/drawer/drawer.d.ts +16 -97
- package/dist/components/field/field.d.ts +7 -67
- package/dist/components/fieldset/fieldset.d.ts +2 -15
- package/dist/components/icon/icon.d.ts +1 -1
- package/dist/components/input/input.d.ts +2 -8
- package/dist/components/logo/logo.d.ts +1 -1
- package/dist/components/navigation-menu/subs/flyout-link.d.ts +2 -14
- package/dist/components/navigation-menu/subs/link.d.ts +6 -23
- package/dist/components/navigation-menu/subs/overlay.d.ts +6 -51
- package/dist/components/navigation-menu/subs/shared.d.ts +4 -14
- package/dist/components/navigation-menu/subs/structure.d.ts +7 -29
- package/dist/components/navigation-menu/subs/trigger.d.ts +6 -13
- package/dist/components/popover/popover.d.ts +22 -94
- package/dist/components/row/row.d.ts +1 -1
- package/dist/components/select/select.d.ts +22 -184
- package/dist/components/separator/separator.d.ts +5 -4
- package/dist/components/slider/slider.d.ts +7 -77
- package/dist/components/spinner/spinner.d.ts +1 -1
- package/dist/components/stack/stack.d.ts +1 -1
- package/dist/components/switch/switch.d.ts +2 -31
- package/dist/components/table/table.d.ts +7 -13
- package/dist/components/tabs/tabs.d.ts +13 -43
- package/dist/components/toast/toast.d.ts +15 -100
- package/dist/components/toggle/toggle.d.ts +3 -20
- package/dist/components/toggle-group/toggle-group.d.ts +3 -19
- package/dist/components/tooltip/tooltip.d.ts +20 -74
- package/dist/components/typo/typo.d.ts +14 -21
- package/dist/{icons-Cy1HAosO.js → icons-CaGCCwG-.js} +7 -7
- package/dist/icons.js +1 -1
- package/dist/index.js +1270 -1286
- package/dist/integrations/code-highlight.js +2 -2
- package/dist/integrations/image-display-options.js +54 -54
- package/dist/{tabs-DIe1Utiy.js → tabs-By5ir2pt.js} +162 -159
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/resolve-state-props.d.ts +4 -0
- package/package.json +2 -2
- package/src/docgen/doc.gen.json +2445 -552
- /package/dist/{meta-CySnRuVp.js → meta-j-7HGrWv.js} +0 -0
|
@@ -1,104 +1,44 @@
|
|
|
1
1
|
import { Field as FieldPrimitive } from '@base-ui/react/field';
|
|
2
|
-
type UpstreamRoot = React.ComponentProps<typeof FieldPrimitive.Root>;
|
|
3
|
-
type UpstreamItem = React.ComponentProps<typeof FieldPrimitive.Item>;
|
|
4
|
-
type UpstreamLabel = React.ComponentProps<typeof FieldPrimitive.Label>;
|
|
5
|
-
type UpstreamDescription = React.ComponentProps<typeof FieldPrimitive.Description>;
|
|
6
|
-
type UpstreamControl = React.ComponentProps<typeof FieldPrimitive.Control>;
|
|
7
|
-
type UpstreamError = React.ComponentProps<typeof FieldPrimitive.Error>;
|
|
8
|
-
type UpstreamValidity = React.ComponentProps<typeof FieldPrimitive.Validity>;
|
|
9
|
-
type RootProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style"> & {
|
|
10
|
-
name?: string;
|
|
11
|
-
actionsRef?: UpstreamRoot["actionsRef"];
|
|
12
|
-
dirty?: boolean;
|
|
13
|
-
touched?: boolean;
|
|
14
|
-
/** @default false */
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
invalid?: boolean;
|
|
17
|
-
validate?: UpstreamRoot["validate"];
|
|
18
|
-
/** @default "onSubmit" */
|
|
19
|
-
validationMode?: UpstreamRoot["validationMode"];
|
|
20
|
-
/** @default 0 */
|
|
21
|
-
validationDebounceTime?: number;
|
|
22
|
-
className?: UpstreamRoot["className"];
|
|
23
|
-
style?: UpstreamRoot["style"];
|
|
24
|
-
render?: UpstreamRoot["render"];
|
|
25
|
-
};
|
|
26
2
|
/**
|
|
27
3
|
* Field.Root — groups a label, control, validation state, and supporting copy.
|
|
28
4
|
*
|
|
29
5
|
* @doc https://base-ui.com/react/components/field
|
|
30
6
|
* @llm https://base-ui.com/react/components/field.md
|
|
31
7
|
*/
|
|
32
|
-
export declare function Root(
|
|
8
|
+
export declare function Root(props: React.ComponentProps<typeof FieldPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
33
9
|
export declare namespace Root {
|
|
34
10
|
var displayName: string;
|
|
35
11
|
}
|
|
36
|
-
type ItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style"> & {
|
|
37
|
-
/** @default false */
|
|
38
|
-
disabled?: boolean;
|
|
39
|
-
className?: UpstreamItem["className"];
|
|
40
|
-
style?: UpstreamItem["style"];
|
|
41
|
-
render?: UpstreamItem["render"];
|
|
42
|
-
};
|
|
43
12
|
/** Field.Item — groups one checkable option with its label and description. */
|
|
44
|
-
export declare function Item(
|
|
13
|
+
export declare function Item(props: React.ComponentProps<typeof FieldPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
|
|
45
14
|
export declare namespace Item {
|
|
46
15
|
var displayName: string;
|
|
47
16
|
}
|
|
48
|
-
type LabelProps = Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "className" | "style"> & {
|
|
49
|
-
/** @default true */
|
|
50
|
-
nativeLabel?: boolean;
|
|
51
|
-
className?: UpstreamLabel["className"];
|
|
52
|
-
style?: UpstreamLabel["style"];
|
|
53
|
-
render?: UpstreamLabel["render"];
|
|
54
|
-
};
|
|
55
17
|
/** Field.Label — an accessible label automatically associated with the control. */
|
|
56
|
-
export declare function Label(
|
|
18
|
+
export declare function Label(props: React.ComponentProps<typeof FieldPrimitive.Label>): import("react/jsx-runtime").JSX.Element;
|
|
57
19
|
export declare namespace Label {
|
|
58
20
|
var displayName: string;
|
|
59
21
|
}
|
|
60
|
-
type DescriptionProps = Omit<React.HTMLAttributes<HTMLParagraphElement>, "className" | "style"> & {
|
|
61
|
-
className?: UpstreamDescription["className"];
|
|
62
|
-
style?: UpstreamDescription["style"];
|
|
63
|
-
render?: UpstreamDescription["render"];
|
|
64
|
-
};
|
|
65
22
|
/** Field.Description — supporting information for a field. */
|
|
66
|
-
export declare function Description(
|
|
23
|
+
export declare function Description(props: React.ComponentProps<typeof FieldPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
|
|
67
24
|
export declare namespace Description {
|
|
68
25
|
var displayName: string;
|
|
69
26
|
}
|
|
70
|
-
type ControlProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "className" | "style" | "defaultValue"> & {
|
|
71
|
-
defaultValue?: UpstreamControl["defaultValue"];
|
|
72
|
-
onValueChange?: UpstreamControl["onValueChange"];
|
|
73
|
-
className?: UpstreamControl["className"];
|
|
74
|
-
style?: UpstreamControl["style"];
|
|
75
|
-
render?: UpstreamControl["render"];
|
|
76
|
-
};
|
|
77
27
|
/** Field.Control — a native input control with Field labeling and validation. */
|
|
78
|
-
export declare function Control(
|
|
28
|
+
export declare function Control(props: React.ComponentProps<typeof FieldPrimitive.Control>): import("react/jsx-runtime").JSX.Element;
|
|
79
29
|
export declare namespace Control {
|
|
80
30
|
var displayName: string;
|
|
81
31
|
}
|
|
82
|
-
type ErrorProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style"> & {
|
|
83
|
-
match?: UpstreamError["match"];
|
|
84
|
-
className?: UpstreamError["className"];
|
|
85
|
-
style?: UpstreamError["style"];
|
|
86
|
-
render?: UpstreamError["render"];
|
|
87
|
-
};
|
|
88
32
|
/** Field.Error — an inline validation message shown when its match condition fails. */
|
|
89
|
-
export declare function Error(
|
|
33
|
+
export declare function Error(props: React.ComponentProps<typeof FieldPrimitive.Error>): import("react/jsx-runtime").JSX.Element;
|
|
90
34
|
export declare namespace Error {
|
|
91
35
|
var displayName: string;
|
|
92
36
|
}
|
|
93
|
-
type ValidityProps = {
|
|
94
|
-
children: UpstreamValidity["children"];
|
|
95
|
-
};
|
|
96
37
|
/**
|
|
97
38
|
* Field.Validity — renderless access to the field validity data for custom messages.
|
|
98
39
|
* Its function child owns the rendered element and therefore its identity and styling.
|
|
99
40
|
*/
|
|
100
|
-
export declare function Validity({ children }:
|
|
41
|
+
export declare function Validity({ children }: React.ComponentProps<typeof FieldPrimitive.Validity>): import("react/jsx-runtime").JSX.Element;
|
|
101
42
|
export declare namespace Validity {
|
|
102
43
|
var displayName: string;
|
|
103
44
|
}
|
|
104
|
-
export {};
|
|
@@ -1,29 +1,16 @@
|
|
|
1
1
|
import { Fieldset as FieldsetPrimitive } from '@base-ui/react/fieldset';
|
|
2
|
-
type UpstreamRoot = React.ComponentProps<typeof FieldsetPrimitive.Root>;
|
|
3
|
-
type UpstreamLegend = React.ComponentProps<typeof FieldsetPrimitive.Legend>;
|
|
4
|
-
type RootProps = Omit<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, "className" | "style"> & {
|
|
5
|
-
className?: UpstreamRoot["className"];
|
|
6
|
-
style?: UpstreamRoot["style"];
|
|
7
|
-
render?: UpstreamRoot["render"];
|
|
8
|
-
};
|
|
9
2
|
/**
|
|
10
3
|
* Fieldset.Root — semantic grouping for related form controls and a shared legend.
|
|
11
4
|
*
|
|
12
5
|
* @doc https://base-ui.com/react/components/fieldset
|
|
13
6
|
* @llm https://base-ui.com/react/components/fieldset.md
|
|
14
7
|
*/
|
|
15
|
-
export declare function Root(
|
|
8
|
+
export declare function Root(props: React.ComponentProps<typeof FieldsetPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
16
9
|
export declare namespace Root {
|
|
17
10
|
var displayName: string;
|
|
18
11
|
}
|
|
19
|
-
type LegendProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style"> & {
|
|
20
|
-
className?: UpstreamLegend["className"];
|
|
21
|
-
style?: UpstreamLegend["style"];
|
|
22
|
-
render?: UpstreamLegend["render"];
|
|
23
|
-
};
|
|
24
12
|
/** Fieldset.Legend — the accessible label for its related controls. */
|
|
25
|
-
export declare function Legend(
|
|
13
|
+
export declare function Legend(props: React.ComponentProps<typeof FieldsetPrimitive.Legend>): import("react/jsx-runtime").JSX.Element;
|
|
26
14
|
export declare namespace Legend {
|
|
27
15
|
var displayName: string;
|
|
28
16
|
}
|
|
29
|
-
export {};
|
|
@@ -12,5 +12,5 @@ type Props = Omit<React.ComponentProps<IconComponent>, "color"> & VariantProps<t
|
|
|
12
12
|
size?: React.SVGProps<SVGSVGElement>["width"];
|
|
13
13
|
};
|
|
14
14
|
/** Icon — renders an icon component with a semantic Web UI foreground color. */
|
|
15
|
-
export declare function Icon({ glyph: Glyph, variant, size, width, height,
|
|
15
|
+
export declare function Icon({ glyph: Glyph, variant, size, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
|
|
16
16
|
export {};
|
|
@@ -5,16 +5,10 @@ declare const input: (props?: ({
|
|
|
5
5
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
6
6
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
7
7
|
type UpstreamInput = React.ComponentProps<typeof InputPrimitive>;
|
|
8
|
-
|
|
9
|
-
value?: UpstreamInput["value"];
|
|
10
|
-
defaultValue?: UpstreamInput["defaultValue"];
|
|
11
|
-
onValueChange?: UpstreamInput["onValueChange"];
|
|
8
|
+
interface Props extends Omit<UpstreamInput, "size">, VariantProps<typeof input> {
|
|
12
9
|
/** Called when the search input's clear button is pressed. */
|
|
13
10
|
onClear?: () => void;
|
|
14
|
-
|
|
15
|
-
style?: UpstreamInput["style"];
|
|
16
|
-
render?: UpstreamInput["render"];
|
|
17
|
-
};
|
|
11
|
+
}
|
|
18
12
|
/**
|
|
19
13
|
* Single-line text input. Also called a text field or input field.
|
|
20
14
|
* Wraps Base UI Input for controlled/uncontrolled state, form integration,
|
|
@@ -11,5 +11,5 @@ type Props = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & VariantPr
|
|
|
11
11
|
/** Explicit height — overrides `size` variant when set. */
|
|
12
12
|
height?: string | number;
|
|
13
13
|
};
|
|
14
|
-
export declare function Logo({ src, alt, size, variant, height,
|
|
14
|
+
export declare function Logo({ src, alt, size, variant, height, style, ...props }: Props): import("react/jsx-runtime").JSX.Element;
|
|
15
15
|
export {};
|
|
@@ -1,15 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type FlyoutLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "className"> & {
|
|
3
|
-
/**
|
|
4
|
-
* Marks the link as the current page — renders it in full primary colour.
|
|
5
|
-
* @default false
|
|
6
|
-
*/
|
|
7
|
-
active?: UpstreamLink["active"];
|
|
8
|
-
/** @default false */
|
|
9
|
-
closeOnClick?: UpstreamLink["closeOnClick"];
|
|
10
|
-
className?: UpstreamLink["className"];
|
|
11
|
-
render?: UpstreamLink["render"];
|
|
12
|
-
};
|
|
1
|
+
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
13
2
|
/**
|
|
14
3
|
* NavigationMenu.FlyoutLink — a quiet text link inside a flyout `Content`, the
|
|
15
4
|
* lightweight alternative to a `LinkCard` when a card is too heavy. Renders an
|
|
@@ -17,8 +6,7 @@ type FlyoutLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "clas
|
|
|
17
6
|
* meet it; the current page is marked in primary. When a custom `render` is
|
|
18
7
|
* supplied the icon is omitted — the consumer's element owns its content.
|
|
19
8
|
*/
|
|
20
|
-
export declare function FlyoutLink({
|
|
9
|
+
export declare function FlyoutLink({ children, render, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Link>): import("react/jsx-runtime").JSX.Element;
|
|
21
10
|
export declare namespace FlyoutLink {
|
|
22
11
|
var displayName: string;
|
|
23
12
|
}
|
|
24
|
-
export {};
|
|
@@ -1,15 +1,5 @@
|
|
|
1
|
+
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
1
2
|
import { UpstreamLink } from './shared';
|
|
2
|
-
type LinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "className"> & {
|
|
3
|
-
/**
|
|
4
|
-
* Marks the link as the current page — renders it in full primary colour.
|
|
5
|
-
* @default false
|
|
6
|
-
*/
|
|
7
|
-
active?: UpstreamLink["active"];
|
|
8
|
-
/** @default false */
|
|
9
|
-
closeOnClick?: UpstreamLink["closeOnClick"];
|
|
10
|
-
className?: UpstreamLink["className"];
|
|
11
|
-
render?: UpstreamLink["render"];
|
|
12
|
-
};
|
|
13
3
|
/**
|
|
14
4
|
* NavigationMenu.Link — a top-strip (rail) link: a peer of `Trigger` for a
|
|
15
5
|
* section that navigates directly instead of opening a flyout. Renders an `<a>`.
|
|
@@ -18,22 +8,21 @@ type LinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "className"
|
|
|
18
8
|
* A trailing `ArrowRight` slides in on hover/focus. When a custom `render` is
|
|
19
9
|
* supplied the icon is omitted — the consumer's element owns its content.
|
|
20
10
|
*/
|
|
21
|
-
export declare function Link({
|
|
11
|
+
export declare function Link({ children, render, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Link>): import("react/jsx-runtime").JSX.Element;
|
|
22
12
|
export declare namespace Link {
|
|
23
13
|
var displayName: string;
|
|
24
14
|
}
|
|
25
|
-
type LinkListProps = React.HTMLAttributes<HTMLUListElement>;
|
|
26
15
|
/**
|
|
27
16
|
* NavigationMenu.LinkList — a reset `<ul>` that lays out a flyout's `LinkCard`s
|
|
28
17
|
* (a responsive two-column grid that collapses to one column on narrow flyouts).
|
|
29
18
|
* Owns the flyout list layout so consumers wrap each card in an `<li>` and add no
|
|
30
19
|
* layout styling of their own. Renders a `<ul>`.
|
|
31
20
|
*/
|
|
32
|
-
export declare function LinkList(
|
|
21
|
+
export declare function LinkList(props: React.HTMLAttributes<HTMLUListElement>): import("react/jsx-runtime").JSX.Element;
|
|
33
22
|
export declare namespace LinkList {
|
|
34
23
|
var displayName: string;
|
|
35
24
|
}
|
|
36
|
-
|
|
25
|
+
interface LinkCardProps extends Omit<UpstreamLink, "title"> {
|
|
37
26
|
/** Card heading — the link label. */
|
|
38
27
|
title: React.ReactNode;
|
|
39
28
|
/** Supporting line beneath the title. */
|
|
@@ -42,13 +31,7 @@ type LinkCardProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "classN
|
|
|
42
31
|
image?: string;
|
|
43
32
|
/** Alt text for `image`. */
|
|
44
33
|
imageAlt?: string;
|
|
45
|
-
|
|
46
|
-
active?: UpstreamLink["active"];
|
|
47
|
-
/** @default false */
|
|
48
|
-
closeOnClick?: UpstreamLink["closeOnClick"];
|
|
49
|
-
className?: UpstreamLink["className"];
|
|
50
|
-
render?: UpstreamLink["render"];
|
|
51
|
-
};
|
|
34
|
+
}
|
|
52
35
|
/**
|
|
53
36
|
* NavigationMenu.LinkCard — a rich flyout entry (optional image + title +
|
|
54
37
|
* description) for the bigger menus. Built on the `Card` primitive (like
|
|
@@ -57,7 +40,7 @@ type LinkCardProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "classN
|
|
|
57
40
|
* thick primary bar along the card's bottom edge on hover and when active. Use
|
|
58
41
|
* where a plain `NavigationMenu.FlyoutLink` is too sparse.
|
|
59
42
|
*/
|
|
60
|
-
export declare function LinkCard({ title, description, image, imageAlt,
|
|
43
|
+
export declare function LinkCard({ title, description, image, imageAlt, ...props }: LinkCardProps): import("react/jsx-runtime").JSX.Element;
|
|
61
44
|
export declare namespace LinkCard {
|
|
62
45
|
var displayName: string;
|
|
63
46
|
}
|
|
@@ -1,75 +1,30 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type PortalProps = {
|
|
3
|
-
container?: UpstreamPortal["container"];
|
|
4
|
-
/** @default false */
|
|
5
|
-
keepMounted?: UpstreamPortal["keepMounted"];
|
|
6
|
-
children?: UpstreamPortal["children"];
|
|
7
|
-
};
|
|
1
|
+
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
8
2
|
/** NavigationMenu.Portal — renders the positioner outside the main document flow. */
|
|
9
|
-
export declare function Portal(props:
|
|
3
|
+
export declare function Portal(props: React.ComponentProps<typeof NavigationMenuPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
|
|
10
4
|
export declare namespace Portal {
|
|
11
5
|
var displayName: string;
|
|
12
6
|
}
|
|
13
|
-
type PositionerProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
14
|
-
/** @default 'bottom' */
|
|
15
|
-
side?: UpstreamPositioner["side"];
|
|
16
|
-
/** @default 'start' */
|
|
17
|
-
align?: UpstreamPositioner["align"];
|
|
18
|
-
/** @default 0 */
|
|
19
|
-
sideOffset?: UpstreamPositioner["sideOffset"];
|
|
20
|
-
/** @default 0 */
|
|
21
|
-
alignOffset?: UpstreamPositioner["alignOffset"];
|
|
22
|
-
/** @default 5 */
|
|
23
|
-
arrowPadding?: UpstreamPositioner["arrowPadding"];
|
|
24
|
-
anchor?: UpstreamPositioner["anchor"];
|
|
25
|
-
/** @default 'absolute' */
|
|
26
|
-
positionMethod?: UpstreamPositioner["positionMethod"];
|
|
27
|
-
/** @default false */
|
|
28
|
-
disableAnchorTracking?: UpstreamPositioner["disableAnchorTracking"];
|
|
29
|
-
collisionAvoidance?: UpstreamPositioner["collisionAvoidance"];
|
|
30
|
-
/** @default 'clipping-ancestors' */
|
|
31
|
-
collisionBoundary?: UpstreamPositioner["collisionBoundary"];
|
|
32
|
-
/** @default 5 */
|
|
33
|
-
collisionPadding?: UpstreamPositioner["collisionPadding"];
|
|
34
|
-
/** @default false */
|
|
35
|
-
sticky?: UpstreamPositioner["sticky"];
|
|
36
|
-
className?: UpstreamPositioner["className"];
|
|
37
|
-
render?: UpstreamPositioner["render"];
|
|
38
|
-
};
|
|
39
7
|
/**
|
|
40
8
|
* NavigationMenu.Positioner — anchors the popup to the active trigger.
|
|
41
9
|
* Defaults to `align="start"` (DESIGN.md §5) so the flyout reads as anchored to
|
|
42
10
|
* the trigger edge rather than centered. Renders a `<div>`.
|
|
43
11
|
*/
|
|
44
|
-
export declare function Positioner({ align,
|
|
12
|
+
export declare function Positioner({ align, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Positioner>): import("react/jsx-runtime").JSX.Element;
|
|
45
13
|
export declare namespace Positioner {
|
|
46
14
|
var displayName: string;
|
|
47
15
|
}
|
|
48
|
-
type PopupProps = Omit<React.HTMLAttributes<HTMLElement>, "className"> & {
|
|
49
|
-
className?: UpstreamPopup["className"];
|
|
50
|
-
render?: UpstreamPopup["render"];
|
|
51
|
-
};
|
|
52
16
|
/** NavigationMenu.Popup — the shared flyout surface holding the active Content. Renders a `<nav>`. */
|
|
53
|
-
export declare function Popup(
|
|
17
|
+
export declare function Popup(props: React.ComponentProps<typeof NavigationMenuPrimitive.Popup>): import("react/jsx-runtime").JSX.Element;
|
|
54
18
|
export declare namespace Popup {
|
|
55
19
|
var displayName: string;
|
|
56
20
|
}
|
|
57
|
-
type ArrowProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
58
|
-
className?: UpstreamArrow["className"];
|
|
59
|
-
render?: UpstreamArrow["render"];
|
|
60
|
-
};
|
|
61
21
|
/** NavigationMenu.Arrow — a pointer anchored to the popup edge. Receives data-side for orientation. Renders a `<div>`. */
|
|
62
|
-
export declare function Arrow(
|
|
22
|
+
export declare function Arrow(props: React.ComponentProps<typeof NavigationMenuPrimitive.Arrow>): import("react/jsx-runtime").JSX.Element;
|
|
63
23
|
export declare namespace Arrow {
|
|
64
24
|
var displayName: string;
|
|
65
25
|
}
|
|
66
|
-
type BackdropProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
67
|
-
className?: UpstreamBackdrop["className"];
|
|
68
|
-
render?: UpstreamBackdrop["render"];
|
|
69
|
-
};
|
|
70
26
|
/** NavigationMenu.Backdrop — overlay beneath the popup. Receives data-open/data-closed for transitions. Renders a `<div>`. */
|
|
71
|
-
export declare function Backdrop(
|
|
27
|
+
export declare function Backdrop(props: React.ComponentProps<typeof NavigationMenuPrimitive.Backdrop>): import("react/jsx-runtime").JSX.Element;
|
|
72
28
|
export declare namespace Backdrop {
|
|
73
29
|
var displayName: string;
|
|
74
30
|
}
|
|
75
|
-
export {};
|
|
@@ -1,20 +1,10 @@
|
|
|
1
1
|
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
3
|
+
* Upstream types for the NavigationMenu parts that add Web UI props on top, and
|
|
4
|
+
* the orientation union those parts share. A part that only passes upstream
|
|
5
|
+
* props through annotates them inline instead.
|
|
6
6
|
*/
|
|
7
|
-
export type UpstreamRoot = React.ComponentProps<typeof NavigationMenuPrimitive.Root
|
|
8
|
-
export type UpstreamList = React.ComponentProps<typeof NavigationMenuPrimitive.List>;
|
|
9
|
-
export type UpstreamItem = React.ComponentProps<typeof NavigationMenuPrimitive.Item>;
|
|
7
|
+
export type UpstreamRoot<Value = unknown> = React.ComponentProps<typeof NavigationMenuPrimitive.Root<Value>>;
|
|
10
8
|
export type UpstreamTrigger = React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>;
|
|
11
|
-
export type UpstreamIcon = React.ComponentProps<typeof NavigationMenuPrimitive.Icon>;
|
|
12
|
-
export type UpstreamContent = React.ComponentProps<typeof NavigationMenuPrimitive.Content>;
|
|
13
9
|
export type UpstreamLink = React.ComponentProps<typeof NavigationMenuPrimitive.Link>;
|
|
14
|
-
export type UpstreamPortal = React.ComponentProps<typeof NavigationMenuPrimitive.Portal>;
|
|
15
|
-
export type UpstreamPositioner = React.ComponentProps<typeof NavigationMenuPrimitive.Positioner>;
|
|
16
|
-
export type UpstreamPopup = React.ComponentProps<typeof NavigationMenuPrimitive.Popup>;
|
|
17
|
-
export type UpstreamViewport = React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>;
|
|
18
|
-
export type UpstreamArrow = React.ComponentProps<typeof NavigationMenuPrimitive.Arrow>;
|
|
19
|
-
export type UpstreamBackdrop = React.ComponentProps<typeof NavigationMenuPrimitive.Backdrop>;
|
|
20
10
|
export type Orientation = "horizontal" | "vertical";
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
2
|
-
import { Orientation,
|
|
3
|
-
|
|
2
|
+
import { Orientation, UpstreamRoot } from './shared';
|
|
3
|
+
interface RootProps<Value = unknown> extends Omit<UpstreamRoot<Value>, "orientation"> {
|
|
4
4
|
/**
|
|
5
5
|
* Layout of the menu. `horizontal` is a top nav bar; `vertical` stacks the
|
|
6
6
|
* whole menu into a side rail with flyouts opening to the side.
|
|
7
7
|
* @default 'horizontal'
|
|
8
8
|
*/
|
|
9
9
|
orientation?: Orientation;
|
|
10
|
-
|
|
11
|
-
render?: UpstreamRoot["render"];
|
|
12
|
-
};
|
|
10
|
+
}
|
|
13
11
|
/**
|
|
14
12
|
* NavigationMenu.Root — groups all parts and manages which item is open.
|
|
15
13
|
* Renders a `<nav>`.
|
|
@@ -21,43 +19,23 @@ export declare function Root<Value = unknown>({ orientation, className, ...props
|
|
|
21
19
|
export declare namespace Root {
|
|
22
20
|
var displayName: string;
|
|
23
21
|
}
|
|
24
|
-
type ListProps = Omit<React.HTMLAttributes<HTMLUListElement>, "className"> & {
|
|
25
|
-
className?: UpstreamList["className"];
|
|
26
|
-
render?: UpstreamList["render"];
|
|
27
|
-
};
|
|
28
22
|
/** NavigationMenu.List — the strip of items. Renders a `<ul>`. */
|
|
29
|
-
export declare function List(
|
|
23
|
+
export declare function List(props: React.ComponentProps<typeof NavigationMenuPrimitive.List>): import("react/jsx-runtime").JSX.Element;
|
|
30
24
|
export declare namespace List {
|
|
31
25
|
var displayName: string;
|
|
32
26
|
}
|
|
33
|
-
type ItemProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, "className"> & {
|
|
34
|
-
/** Unique identifier for controlled use; auto-generated when omitted. */
|
|
35
|
-
value?: UpstreamItem["value"];
|
|
36
|
-
className?: UpstreamItem["className"];
|
|
37
|
-
render?: UpstreamItem["render"];
|
|
38
|
-
};
|
|
39
27
|
/** NavigationMenu.Item — a single item in the list. Renders a `<li>`. */
|
|
40
|
-
export declare function Item(
|
|
28
|
+
export declare function Item(props: React.ComponentProps<typeof NavigationMenuPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
|
|
41
29
|
export declare namespace Item {
|
|
42
30
|
var displayName: string;
|
|
43
31
|
}
|
|
44
|
-
type ContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
45
|
-
/** @default false */
|
|
46
|
-
keepMounted?: UpstreamContent["keepMounted"];
|
|
47
|
-
className?: UpstreamContent["className"];
|
|
48
|
-
render?: UpstreamContent["render"];
|
|
49
|
-
};
|
|
50
32
|
/** NavigationMenu.Content — an item's flyout body; moved into the shared Popup when active. Renders a `<div>`. */
|
|
51
|
-
export declare function Content(
|
|
33
|
+
export declare function Content(props: React.ComponentProps<typeof NavigationMenuPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
|
|
52
34
|
export declare namespace Content {
|
|
53
35
|
var displayName: string;
|
|
54
36
|
}
|
|
55
|
-
type ViewportProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
56
|
-
className?: UpstreamViewport["className"];
|
|
57
|
-
render?: UpstreamViewport["render"];
|
|
58
|
-
};
|
|
59
37
|
/** NavigationMenu.Viewport — clips the current content for direction-aware transitions. Renders a `<div>`. */
|
|
60
|
-
export declare function Viewport(
|
|
38
|
+
export declare function Viewport(props: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>): import("react/jsx-runtime").JSX.Element;
|
|
61
39
|
export declare namespace Viewport {
|
|
62
40
|
var displayName: string;
|
|
63
41
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
|
|
2
|
+
import { UpstreamTrigger } from './shared';
|
|
3
|
+
interface TriggerProps extends UpstreamTrigger {
|
|
3
4
|
/**
|
|
4
5
|
* Marks this section as the current page so it shows the active treatment even
|
|
5
6
|
* when its flyout is closed — the "active trail" anchor for a nav where the
|
|
@@ -20,27 +21,19 @@ type TriggerProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "classNa
|
|
|
20
21
|
* @default false
|
|
21
22
|
*/
|
|
22
23
|
nested?: boolean;
|
|
23
|
-
|
|
24
|
-
nativeButton?: UpstreamTrigger["nativeButton"];
|
|
25
|
-
className?: UpstreamTrigger["className"];
|
|
26
|
-
render?: UpstreamTrigger["render"];
|
|
27
|
-
};
|
|
24
|
+
}
|
|
28
25
|
/**
|
|
29
26
|
* NavigationMenu.Trigger — opens an item's flyout on hover or click. Renders a
|
|
30
27
|
* `<button>`. Ships a built-in `ChevronDown` (rotates when open) so consumers
|
|
31
28
|
* don't hand-author an indicator; pass `hideChevron` to supply a custom `Icon`,
|
|
32
29
|
* and `nested` when the trigger opens a submenu from inside another flyout.
|
|
33
30
|
*/
|
|
34
|
-
export declare function Trigger({ active, hideChevron, nested, children,
|
|
31
|
+
export declare function Trigger({ active, hideChevron, nested, children, ...props }: TriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
35
32
|
export declare namespace Trigger {
|
|
36
33
|
var displayName: string;
|
|
37
34
|
}
|
|
38
|
-
type IconProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "className"> & {
|
|
39
|
-
className?: UpstreamIcon["className"];
|
|
40
|
-
render?: UpstreamIcon["render"];
|
|
41
|
-
};
|
|
42
35
|
/** NavigationMenu.Icon — a chevron/marker that rotates when its trigger is open. Renders a `<span>`. */
|
|
43
|
-
export declare function Icon(
|
|
36
|
+
export declare function Icon(props: React.ComponentProps<typeof NavigationMenuPrimitive.Icon>): import("react/jsx-runtime").JSX.Element;
|
|
44
37
|
export declare namespace Icon {
|
|
45
38
|
var displayName: string;
|
|
46
39
|
}
|