@surflane/ui 0.1.0 → 0.2.0
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 +8 -8
- package/dist/advanced-forms.d.ts +2 -2
- package/dist/advanced-forms.js +39 -39
- package/dist/app-shell.d.ts +1 -1
- package/dist/app-shell.js +11 -11
- package/dist/button.d.ts +5 -5
- package/dist/button.js +12 -12
- package/dist/chart.d.ts +3 -3
- package/dist/chart.js +36 -34
- package/dist/commands.d.ts +5 -5
- package/dist/commands.js +17 -17
- package/dist/content.d.ts +2 -2
- package/dist/content.js +66 -28
- package/dist/context-overlays.d.ts +3 -3
- package/dist/context-overlays.js +11 -11
- package/dist/data.d.ts +1 -1
- package/dist/data.js +18 -18
- package/dist/date-picker.d.ts +8 -8
- package/dist/date-picker.js +18 -18
- package/dist/dialog-focus.js +7 -7
- package/dist/dialog.d.ts +5 -5
- package/dist/dialog.js +16 -16
- package/dist/feedback.d.ts +5 -5
- package/dist/feedback.js +20 -20
- package/dist/file-upload.d.ts +9 -9
- package/dist/file-upload.js +64 -63
- package/dist/filter-bar.d.ts +1 -1
- package/dist/filter-bar.js +9 -9
- package/dist/form-state.d.ts +1 -1
- package/dist/form-state.js +11 -11
- package/dist/forms.d.ts +5 -5
- package/dist/forms.js +32 -32
- package/dist/foundations.d.ts +10 -10
- package/dist/foundations.js +26 -26
- package/dist/icon.d.ts +7 -7
- package/dist/icon.js +22 -22
- package/dist/index.d.ts +37 -37
- package/dist/index.js +38 -38
- package/dist/input-extensions.d.ts +3 -3
- package/dist/input-extensions.js +21 -21
- package/dist/input.d.ts +2 -2
- package/dist/input.js +7 -7
- package/dist/markdown.d.ts +2 -2
- package/dist/markdown.js +38 -38
- package/dist/menu.d.ts +2 -2
- package/dist/menu.js +19 -19
- package/dist/messages.d.ts +2 -2
- package/dist/messages.js +18 -18
- package/dist/navigation-menu.d.ts +2 -2
- package/dist/navigation-menu.js +16 -16
- package/dist/navigation.d.ts +5 -5
- package/dist/navigation.js +40 -40
- package/dist/otp-field.d.ts +1 -1
- package/dist/otp-field.js +14 -14
- package/dist/pagination.d.ts +2 -2
- package/dist/pagination.js +12 -12
- package/dist/panels.d.ts +8 -8
- package/dist/panels.js +39 -39
- package/dist/parts.d.ts +2 -2
- package/dist/parts.js +8 -8
- package/dist/popover.d.ts +3 -3
- package/dist/popover.js +6 -6
- package/dist/scroll-area.d.ts +1 -1
- package/dist/scroll-area.js +20 -20
- package/dist/select.d.ts +8 -8
- package/dist/select.js +21 -21
- package/dist/sizing.d.ts +3 -3
- package/dist/sizing.js +9 -9
- package/dist/slot.d.ts +1 -1
- package/dist/slot.js +4 -4
- package/dist/status.d.ts +4 -4
- package/dist/status.js +8 -8
- package/dist/syntax-engine.js +43 -43
- package/dist/syntax-highlighter.d.ts +2 -2
- package/dist/syntax-highlighter.js +32 -32
- package/dist/toast.d.ts +4 -4
- package/dist/toast.js +33 -33
- package/dist/tone-transition.d.ts +1 -1
- package/dist/tone-transition.js +17 -17
- package/dist/tooltip.d.ts +1 -1
- package/dist/tooltip.js +4 -4
- package/dist/tree.d.ts +4 -4
- package/dist/tree.js +60 -60
- package/package.json +2 -2
- package/src/styles.css +233 -142
package/dist/foundations.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as React from
|
|
1
|
+
import * as React from 'react';
|
|
2
2
|
export type Space = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16 | 20;
|
|
3
3
|
export declare const Container: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
|
|
4
4
|
width?: "workspace" | "reading" | "wide" | "full";
|
|
@@ -29,23 +29,23 @@ export declare const Surface: React.ForwardRefExoticComponent<Omit<React.ClassAt
|
|
|
29
29
|
}, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
30
30
|
export declare function Heading({ level, size, className, ...props }: React.HTMLAttributes<HTMLHeadingElement> & {
|
|
31
31
|
level?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
32
|
-
size?:
|
|
32
|
+
size?: 'display' | 'title' | 'page' | 'section' | 'subsection' | 'workspace' | 'document';
|
|
33
33
|
}): React.JSX.Element;
|
|
34
34
|
export declare function Text({ as: Tag, variant, color, weight, className, ...props }: React.HTMLAttributes<HTMLElement> & {
|
|
35
|
-
as?:
|
|
36
|
-
variant?:
|
|
37
|
-
color?:
|
|
38
|
-
weight?:
|
|
35
|
+
as?: 'p' | 'span' | 'div';
|
|
36
|
+
variant?: 'body' | 'reading' | 'table' | 'caption' | 'label' | 'mono' | 'metric';
|
|
37
|
+
color?: 'primary' | 'secondary' | 'muted';
|
|
38
|
+
weight?: 'regular' | 'medium';
|
|
39
39
|
}): React.JSX.Element;
|
|
40
|
-
export declare function PageHeader({ as: Root, headingProps, actionsLabel, title, description, breadcrumb, actions, level, size, className, ...props }: Omit<React.ComponentProps<
|
|
41
|
-
as?:
|
|
42
|
-
headingProps?: Omit<React.HTMLAttributes<HTMLHeadingElement>,
|
|
40
|
+
export declare function PageHeader({ as: Root, headingProps, actionsLabel, title, description, breadcrumb, actions, level, size, className, ...props }: Omit<React.ComponentProps<'div'>, 'title'> & {
|
|
41
|
+
as?: 'div' | 'header';
|
|
42
|
+
headingProps?: Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'dangerouslySetInnerHTML'>;
|
|
43
43
|
actionsLabel?: string;
|
|
44
44
|
title: React.ReactNode;
|
|
45
45
|
description?: React.ReactNode;
|
|
46
46
|
breadcrumb?: React.ReactNode;
|
|
47
47
|
actions?: React.ReactNode;
|
|
48
48
|
level?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
49
|
-
size?:
|
|
49
|
+
size?: 'title' | 'page' | 'workspace' | 'document';
|
|
50
50
|
}): React.JSX.Element;
|
|
51
51
|
export declare const Prose: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
package/dist/foundations.js
CHANGED
|
@@ -1,55 +1,55 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from
|
|
4
|
-
const cx = (...values) => values.filter(Boolean).join(
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
const cx = (...values) => values.filter(Boolean).join(' ');
|
|
5
5
|
const gapStyle = (gap, style) => ({
|
|
6
|
-
...(gap === undefined ? {} : {
|
|
6
|
+
...(gap === undefined ? {} : { '--layout-gap': `var(--space-${gap})` }),
|
|
7
7
|
...style,
|
|
8
8
|
});
|
|
9
|
-
export const Container = React.forwardRef(function Container({ width =
|
|
10
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
9
|
+
export const Container = React.forwardRef(function Container({ width = 'workspace', className, ...props }, ref) {
|
|
10
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-container', className), "data-width": width }));
|
|
11
11
|
});
|
|
12
12
|
export const Stack = React.forwardRef(function Stack({ gap, className, style, ...props }, ref) {
|
|
13
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
13
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-stack', className), style: gapStyle(gap, style) }));
|
|
14
14
|
});
|
|
15
|
-
export const Inline = React.forwardRef(function Inline({ gap, justify =
|
|
16
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
15
|
+
export const Inline = React.forwardRef(function Inline({ gap, justify = 'start', className, style, ...props }, ref) {
|
|
16
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-inline', className), "data-justify": justify, style: gapStyle(gap, style) }));
|
|
17
17
|
});
|
|
18
18
|
export const Grid = React.forwardRef(function Grid({ gap, bleed = 0, columns = 3, className, style, ...props }, ref) {
|
|
19
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
20
|
-
|
|
19
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-grid', className), "data-columns": columns, style: gapStyle(gap, {
|
|
20
|
+
'--grid-inline-bleed': `var(--space-${bleed})`,
|
|
21
21
|
...style,
|
|
22
22
|
}) }));
|
|
23
23
|
});
|
|
24
24
|
/** Spans are explicit at each viewport breakpoint; placement follows DOM order. */
|
|
25
25
|
export const GridItem = React.forwardRef(function GridItem({ span, mediumSpan, smallSpan, className, style, ...props }, ref) {
|
|
26
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-grid-item', className), style: {
|
|
27
|
+
'--grid-item-span': span,
|
|
28
|
+
'--grid-item-span-medium': mediumSpan,
|
|
29
|
+
'--grid-item-span-small': smallSpan,
|
|
30
30
|
...style,
|
|
31
31
|
} }));
|
|
32
32
|
});
|
|
33
|
-
export const Surface = React.forwardRef(function Surface({ tone =
|
|
34
|
-
return (_jsx("div", { ...props, ref: ref, className: cx(
|
|
33
|
+
export const Surface = React.forwardRef(function Surface({ tone = 'subtle', padding, className, style, ...props }, ref) {
|
|
34
|
+
return (_jsx("div", { ...props, ref: ref, className: cx('pui-surface', className), "data-tone": tone, style: {
|
|
35
35
|
...(padding === undefined
|
|
36
36
|
? {}
|
|
37
|
-
: {
|
|
37
|
+
: { '--surface-padding': `var(--space-${padding})` }),
|
|
38
38
|
...style,
|
|
39
39
|
} }));
|
|
40
40
|
});
|
|
41
|
-
export function Heading({ level = 2, size =
|
|
41
|
+
export function Heading({ level = 2, size = 'section', className, ...props }) {
|
|
42
42
|
const Tag = `h${level}`;
|
|
43
|
-
return (_jsx(Tag, { ...props, className: cx(
|
|
43
|
+
return (_jsx(Tag, { ...props, className: cx('pui-heading', className), "data-size": size }));
|
|
44
44
|
}
|
|
45
|
-
export function Text({ as: Tag =
|
|
46
|
-
return (_jsx(Tag, { ...props, className: cx(
|
|
45
|
+
export function Text({ as: Tag = 'p', variant = 'body', color = 'primary', weight = 'regular', className, ...props }) {
|
|
46
|
+
return (_jsx(Tag, { ...props, className: cx('pui-text', className), "data-variant": variant, "data-color": color, "data-weight": weight }));
|
|
47
47
|
}
|
|
48
|
-
export function PageHeader({ as: Root =
|
|
49
|
-
return (_jsxs(Root, { ...props, className: cx(
|
|
48
|
+
export function PageHeader({ as: Root = 'div', headingProps, actionsLabel, title, description, breadcrumb, actions, level = 1, size = 'title', className, ...props }) {
|
|
49
|
+
return (_jsxs(Root, { ...props, className: cx('pui-page-header', className), children: [breadcrumb != null && breadcrumb !== false && breadcrumb !== '' && (_jsx("div", { className: 'pui-page-header-breadcrumb', children: breadcrumb })), _jsxs("div", { className: 'pui-page-header-content', children: [_jsxs("div", { className: 'pui-page-header-copy', children: [_jsx(Heading, { ...headingProps, level: level, size: size, children: title }), description != null &&
|
|
50
50
|
description !== false &&
|
|
51
|
-
description !==
|
|
51
|
+
description !== '' && (_jsx(Text, { color: 'secondary', className: 'pui-page-header-description', children: description }))] }), actions != null && actions !== false && actions !== '' && (_jsx("div", { className: 'pui-page-header-actions', role: actionsLabel ? 'group' : undefined, "aria-label": actionsLabel, children: actions }))] })] }));
|
|
52
52
|
}
|
|
53
53
|
export const Prose = React.forwardRef(function Prose({ className, ...props }, ref) {
|
|
54
|
-
return _jsx("div", { ...props, ref: ref, className: cx(
|
|
54
|
+
return _jsx("div", { ...props, ref: ref, className: cx('pui-prose', className) });
|
|
55
55
|
});
|
package/dist/icon.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as React from
|
|
1
|
+
import * as React from 'react';
|
|
2
2
|
declare const shapes: {
|
|
3
3
|
search: React.JSX.Element;
|
|
4
4
|
plus: React.JSX.Element;
|
|
@@ -11,10 +11,10 @@ declare const shapes: {
|
|
|
11
11
|
sun: React.JSX.Element;
|
|
12
12
|
moon: React.JSX.Element;
|
|
13
13
|
monitor: React.JSX.Element;
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
'chevron-down': React.JSX.Element;
|
|
15
|
+
'chevron-forward': React.JSX.Element;
|
|
16
|
+
'arrow-back': React.JSX.Element;
|
|
17
|
+
'external-link': React.JSX.Element;
|
|
18
18
|
copy: React.JSX.Element;
|
|
19
19
|
play: React.JSX.Element;
|
|
20
20
|
settings: React.JSX.Element;
|
|
@@ -28,9 +28,9 @@ type Semantics = {
|
|
|
28
28
|
decorative: false;
|
|
29
29
|
label: string;
|
|
30
30
|
};
|
|
31
|
-
export type IconProps = Omit<React.ComponentPropsWithoutRef<
|
|
31
|
+
export type IconProps = Omit<React.ComponentPropsWithoutRef<'svg'>, 'children' | 'name' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-hidden' | 'tabIndex' | 'focusable' | 'width' | 'height' | 'viewBox' | 'strokeWidth' | 'fill' | 'stroke' | 'title'> & Semantics & {
|
|
32
32
|
name: IconName;
|
|
33
|
-
size?:
|
|
33
|
+
size?: 'sm' | 'md' | 'lg';
|
|
34
34
|
};
|
|
35
35
|
/** Static SVG only. Actions, focus, accessible button names and hit targets belong to the parent control. */
|
|
36
36
|
export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
|
package/dist/icon.js
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from
|
|
3
|
+
import * as React from 'react';
|
|
4
4
|
const shapes = {
|
|
5
|
-
search: (_jsxs(_Fragment, { children: [_jsx("circle", { cx:
|
|
6
|
-
plus: _jsx("path", { d:
|
|
7
|
-
close: _jsx("path", { d:
|
|
8
|
-
check: _jsx("path", { d:
|
|
9
|
-
info: (_jsxs(_Fragment, { children: [_jsx("circle", { cx:
|
|
10
|
-
alert: (_jsxs(_Fragment, { children: [_jsx("circle", { cx:
|
|
11
|
-
warning: (_jsxs(_Fragment, { children: [_jsx("path", { d:
|
|
12
|
-
menu: _jsx("path", { d:
|
|
13
|
-
sun: (_jsxs(_Fragment, { children: [_jsx("circle", { cx:
|
|
14
|
-
moon: _jsx("path", { d:
|
|
15
|
-
monitor: (_jsxs(_Fragment, { children: [_jsx("rect", { x:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
copy: (_jsxs(_Fragment, { children: [_jsx("rect", { x:
|
|
21
|
-
play: _jsx("path", { d:
|
|
22
|
-
settings: (_jsx(_Fragment, { children: _jsx("path", { d:
|
|
5
|
+
search: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '10.5', cy: '10.5', r: '6.5' }), _jsx("path", { d: 'm16 16 4 4' })] })),
|
|
6
|
+
plus: _jsx("path", { d: 'M12 5v14M5 12h14' }),
|
|
7
|
+
close: _jsx("path", { d: 'm6 6 12 12M18 6 6 18' }),
|
|
8
|
+
check: _jsx("path", { d: 'm5 12 4 4L19 6' }),
|
|
9
|
+
info: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '12', cy: '12', r: '9' }), _jsx("path", { d: 'M12 11v6m0-10v1' })] })),
|
|
10
|
+
alert: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '12', cy: '12', r: '9' }), _jsx("path", { d: 'M12 7v6m0 3v1' })] })),
|
|
11
|
+
warning: (_jsxs(_Fragment, { children: [_jsx("path", { d: 'm12 3 10 18H2L12 3Z' }), _jsx("path", { d: 'M12 9v4m0 3v1' })] })),
|
|
12
|
+
menu: _jsx("path", { d: 'M4 6h16M4 12h16M4 18h16' }),
|
|
13
|
+
sun: (_jsxs(_Fragment, { children: [_jsx("circle", { cx: '12', cy: '12', r: '4' }), _jsx("path", { d: 'M12 2v2m0 16v2M2 12h2m16 0h2M5 5l1.5 1.5m11 11L19 19M5 19l1.5-1.5m11-11L19 5' })] })),
|
|
14
|
+
moon: _jsx("path", { d: 'M20.5 13.2A8.5 8.5 0 0 1 10.8 3.5 8.5 8.5 0 1 0 20.5 13.2Z' }),
|
|
15
|
+
monitor: (_jsxs(_Fragment, { children: [_jsx("rect", { x: '3', y: '4', width: '18', height: '13', rx: '2' }), _jsx("path", { d: 'M8 21h8m-4-4v4' })] })),
|
|
16
|
+
'chevron-down': _jsx("path", { d: 'm7 10 5 5 5-5' }),
|
|
17
|
+
'chevron-forward': _jsx("path", { d: 'm9 6 6 6-6 6' }),
|
|
18
|
+
'arrow-back': _jsx("path", { d: 'M20 12H4m7-7-7 7 7 7' }),
|
|
19
|
+
'external-link': (_jsx(_Fragment, { children: _jsx("path", { d: 'M14 3h7v7m0-7L10 14M10 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5' }) })),
|
|
20
|
+
copy: (_jsxs(_Fragment, { children: [_jsx("rect", { x: '8', y: '8', width: '12', height: '13', rx: '2' }), _jsx("path", { d: 'M16 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3' })] })),
|
|
21
|
+
play: _jsx("path", { d: 'm7 3 14 9-14 9V3Z' }),
|
|
22
|
+
settings: (_jsx(_Fragment, { children: _jsx("path", { d: 'M4 6h16M4 12h16M4 18h16M9 3v6m6 0v6m-6 0v6' }) })),
|
|
23
23
|
};
|
|
24
24
|
export const iconNames = Object.keys(shapes);
|
|
25
25
|
/** Static SVG only. Actions, focus, accessible button names and hit targets belong to the parent control. */
|
|
26
|
-
export const Icon = React.forwardRef(function Icon({ name, size =
|
|
27
|
-
return (_jsx("svg", { ...props, ref: ref, className: [
|
|
26
|
+
export const Icon = React.forwardRef(function Icon({ name, size = 'sm', decorative = true, label, className, ...props }, ref) {
|
|
27
|
+
return (_jsx("svg", { ...props, ref: ref, className: ['pui-icon', className].filter(Boolean).join(' '), "data-size": size, "data-directional": name === 'chevron-forward' || name === 'arrow-back' ? 'true' : undefined, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeLinecap: 'round', strokeLinejoin: 'round', focusable: 'false', "aria-hidden": decorative ? true : undefined, role: decorative ? undefined : 'img', "aria-label": decorative ? undefined : label, children: shapes[name] }));
|
|
28
28
|
});
|
package/dist/index.d.ts
CHANGED
|
@@ -1,37 +1,37 @@
|
|
|
1
|
-
export { SizeProvider, type ComponentSize, type ComponentSizeAlias, } from
|
|
2
|
-
export { Button, type ButtonVariant, type ButtonSize, type ButtonProps, } from
|
|
3
|
-
export { Slot } from
|
|
4
|
-
export { Input } from
|
|
5
|
-
export { Select, NativeSelect, NativeSelectOption, NativeSelectOptGroup, type SelectOption, type SelectProps, } from
|
|
6
|
-
export { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverHandle, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, PopoverViewport, PopoverContent, } from
|
|
7
|
-
export { Tooltip, TooltipProvider } from
|
|
8
|
-
export { Dialog, AlertDialog, DialogBackdrop, DialogClose, DialogDescription, DialogHandle, DialogPopup, DialogPortal, DialogRoot, DialogTitle, DialogTrigger, DialogViewport, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogHandle, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, } from
|
|
9
|
-
export { Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuClear, MenuEmpty, MenuFilterProvider, MenuGroup, MenuGroupLabel, MenuHandle, MenuInput, MenuItem, MenuLinkItem, MenuList, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRoot, MenuSeparator, MenuSubmenuRoot, MenuSubmenuTrigger, MenuTrigger, MenuViewport, MenuContent, } from
|
|
10
|
-
export { ScrollArea } from
|
|
11
|
-
export { Sheet, Drawer, type PanelSide, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from
|
|
12
|
-
export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, type Space, } from
|
|
13
|
-
export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from
|
|
14
|
-
export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from
|
|
15
|
-
export { Badge, StatusBadge, type BadgeProps, type StatusTone, } from
|
|
16
|
-
export { Progress, Meter, Spinner, Skeleton, type SpinnerProps, type SkeletonProps, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from
|
|
17
|
-
export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from
|
|
18
|
-
export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from
|
|
19
|
-
export { Card, CodeBlock, type CodeBlockProps, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from
|
|
20
|
-
export { Pagination, type PaginationProps } from
|
|
21
|
-
export { Combobox, NumberField, ComboboxArrow, ComboboxBackdrop, ComboboxChip, ComboboxChipRemove, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxIcon, ComboboxInput, ComboboxInputGroup, ComboboxItem, ComboboxItemIndicator, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPortal, ComboboxPositioner, ComboboxRoot, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxContent, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, } from
|
|
22
|
-
export { Autocomplete, Slider, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRoot, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, AutocompleteContent, SliderControl, SliderIndicator, SliderLabel, SliderRoot, SliderThumb, SliderTrack, SliderValue, } from
|
|
23
|
-
export { DirectionProvider } from
|
|
24
|
-
export { Toggle, ToggleGroup, Toolbar, Menubar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarRoot, ToolbarSeparator, } from
|
|
25
|
-
export { ContextMenu, PreviewCard, ContextMenuArrow, ContextMenuBackdrop, ContextMenuCheckboxItem, ContextMenuCheckboxItemIndicator, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuLinkItem, ContextMenuPopup, ContextMenuPortal, ContextMenuPositioner, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuRadioItemIndicator, ContextMenuRoot, ContextMenuSeparator, ContextMenuSubmenuRoot, ContextMenuSubmenuTrigger, ContextMenuTrigger, ContextMenuContent, PreviewCardArrow, PreviewCardBackdrop, PreviewCardHandle, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardRoot, PreviewCardTrigger, PreviewCardViewport, PreviewCardContent, } from
|
|
26
|
-
export { NavigationMenu, NavigationMenuArrow, NavigationMenuBackdrop, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuPortal, NavigationMenuPositioner, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, } from
|
|
27
|
-
export { OTPField, OTPFieldInput, OTPFieldRoot, OTPFieldSeparator, OTPFieldGroup, } from
|
|
28
|
-
export { Toast, type ToastRootProps, type ToastViewportProps, ToastAction, ToastArrow, ToastClose, ToastContent, ToastDescription, ToastPortal, ToastPositioner, ToastProvider, ToastRoot, ToastTitle, ToastViewport, ToastIcon, ToastText, } from
|
|
29
|
-
export { FileUpload, type FileUploadProps, type UploadTransport, type FileUploadLabels, type FileChangeDetails, type FileRejection, type UploadState, } from
|
|
30
|
-
export { Icon, iconNames, type IconName, type IconProps } from
|
|
31
|
-
export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from
|
|
32
|
-
export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from
|
|
33
|
-
export { Tree, type TreeNode, type TreeProps } from
|
|
34
|
-
export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, type DatePickerProps, type DateRangePickerProps, type TimeFieldProps, type DateValue, type TimeValue, } from
|
|
35
|
-
export { Chart, type ChartDatum, type ChartSeries, type ChartProps, } from
|
|
36
|
-
export { SyntaxHighlighter, syntaxLanguages, type SyntaxHighlighterProps, } from
|
|
37
|
-
export { Markdown, type MarkdownProps } from
|
|
1
|
+
export { SizeProvider, type ComponentSize, type ComponentSizeAlias, } from './sizing.js';
|
|
2
|
+
export { Button, type ButtonVariant, type ButtonSize, type ButtonProps, } from './button.js';
|
|
3
|
+
export { Slot } from './slot.js';
|
|
4
|
+
export { Input } from './input.js';
|
|
5
|
+
export { Select, NativeSelect, NativeSelectOption, NativeSelectOptGroup, type SelectOption, type SelectProps, } from './select.js';
|
|
6
|
+
export { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverHandle, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, PopoverViewport, PopoverContent, } from './popover.js';
|
|
7
|
+
export { Tooltip, TooltipProvider } from './tooltip.js';
|
|
8
|
+
export { Dialog, AlertDialog, DialogBackdrop, DialogClose, DialogDescription, DialogHandle, DialogPopup, DialogPortal, DialogRoot, DialogTitle, DialogTrigger, DialogViewport, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogHandle, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, } from './dialog.js';
|
|
9
|
+
export { Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuClear, MenuEmpty, MenuFilterProvider, MenuGroup, MenuGroupLabel, MenuHandle, MenuInput, MenuItem, MenuLinkItem, MenuList, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRoot, MenuSeparator, MenuSubmenuRoot, MenuSubmenuTrigger, MenuTrigger, MenuViewport, MenuContent, } from './menu.js';
|
|
10
|
+
export { ScrollArea } from './scroll-area.js';
|
|
11
|
+
export { Sheet, Drawer, type PanelSide, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from './panels.js';
|
|
12
|
+
export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, type Space, } from './foundations.js';
|
|
13
|
+
export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from './forms.js';
|
|
14
|
+
export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
|
|
15
|
+
export { Badge, StatusBadge, type BadgeProps, type StatusTone, } from './status.js';
|
|
16
|
+
export { Progress, Meter, Spinner, Skeleton, type SpinnerProps, type SkeletonProps, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from './feedback.js';
|
|
17
|
+
export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from './data.js';
|
|
18
|
+
export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from './messages.js';
|
|
19
|
+
export { Card, CodeBlock, type CodeBlockProps, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from './content.js';
|
|
20
|
+
export { Pagination, type PaginationProps } from './pagination.js';
|
|
21
|
+
export { Combobox, NumberField, ComboboxArrow, ComboboxBackdrop, ComboboxChip, ComboboxChipRemove, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxIcon, ComboboxInput, ComboboxInputGroup, ComboboxItem, ComboboxItemIndicator, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPortal, ComboboxPositioner, ComboboxRoot, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxContent, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, } from './advanced-forms.js';
|
|
22
|
+
export { Autocomplete, Slider, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRoot, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, AutocompleteContent, SliderControl, SliderIndicator, SliderLabel, SliderRoot, SliderThumb, SliderTrack, SliderValue, } from './input-extensions.js';
|
|
23
|
+
export { DirectionProvider } from '@base-ui/react/direction-provider';
|
|
24
|
+
export { Toggle, ToggleGroup, Toolbar, Menubar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarRoot, ToolbarSeparator, } from './commands.js';
|
|
25
|
+
export { ContextMenu, PreviewCard, ContextMenuArrow, ContextMenuBackdrop, ContextMenuCheckboxItem, ContextMenuCheckboxItemIndicator, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuLinkItem, ContextMenuPopup, ContextMenuPortal, ContextMenuPositioner, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuRadioItemIndicator, ContextMenuRoot, ContextMenuSeparator, ContextMenuSubmenuRoot, ContextMenuSubmenuTrigger, ContextMenuTrigger, ContextMenuContent, PreviewCardArrow, PreviewCardBackdrop, PreviewCardHandle, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardRoot, PreviewCardTrigger, PreviewCardViewport, PreviewCardContent, } from './context-overlays.js';
|
|
26
|
+
export { NavigationMenu, NavigationMenuArrow, NavigationMenuBackdrop, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuPortal, NavigationMenuPositioner, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, } from './navigation-menu.js';
|
|
27
|
+
export { OTPField, OTPFieldInput, OTPFieldRoot, OTPFieldSeparator, OTPFieldGroup, } from './otp-field.js';
|
|
28
|
+
export { Toast, type ToastRootProps, type ToastViewportProps, ToastAction, ToastArrow, ToastClose, ToastContent, ToastDescription, ToastPortal, ToastPositioner, ToastProvider, ToastRoot, ToastTitle, ToastViewport, ToastIcon, ToastText, } from './toast.js';
|
|
29
|
+
export { FileUpload, type FileUploadProps, type UploadTransport, type FileUploadLabels, type FileChangeDetails, type FileRejection, type UploadState, } from './file-upload.js';
|
|
30
|
+
export { Icon, iconNames, type IconName, type IconProps } from './icon.js';
|
|
31
|
+
export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from './filter-bar.js';
|
|
32
|
+
export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
|
|
33
|
+
export { Tree, type TreeNode, type TreeProps } from './tree.js';
|
|
34
|
+
export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, type DatePickerProps, type DateRangePickerProps, type TimeFieldProps, type DateValue, type TimeValue, } from './date-picker.js';
|
|
35
|
+
export { Chart, type ChartDatum, type ChartSeries, type ChartProps, } from './chart.js';
|
|
36
|
+
export { SyntaxHighlighter, syntaxLanguages, type SyntaxHighlighterProps, } from './syntax-highlighter.js';
|
|
37
|
+
export { Markdown, type MarkdownProps } from './markdown.js';
|
package/dist/index.js
CHANGED
|
@@ -1,38 +1,38 @@
|
|
|
1
|
-
|
|
2
|
-
export { SizeProvider, } from
|
|
3
|
-
export { Button, } from
|
|
4
|
-
export { Slot } from
|
|
5
|
-
export { Input } from
|
|
6
|
-
export { Select, NativeSelect, NativeSelectOption, NativeSelectOptGroup, } from
|
|
7
|
-
export { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverHandle, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, PopoverViewport, PopoverContent, } from
|
|
8
|
-
export { Tooltip, TooltipProvider } from
|
|
9
|
-
export { Dialog, AlertDialog, DialogBackdrop, DialogClose, DialogDescription, DialogHandle, DialogPopup, DialogPortal, DialogRoot, DialogTitle, DialogTrigger, DialogViewport, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogHandle, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, } from
|
|
10
|
-
export { Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuClear, MenuEmpty, MenuFilterProvider, MenuGroup, MenuGroupLabel, MenuHandle, MenuInput, MenuItem, MenuLinkItem, MenuList, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRoot, MenuSeparator, MenuSubmenuRoot, MenuSubmenuTrigger, MenuTrigger, MenuViewport, MenuContent, } from
|
|
11
|
-
export { ScrollArea } from
|
|
12
|
-
export { Sheet, Drawer, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from
|
|
13
|
-
export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, } from
|
|
14
|
-
export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from
|
|
15
|
-
export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from
|
|
16
|
-
export { Badge, StatusBadge, } from
|
|
17
|
-
export { Progress, Meter, Spinner, Skeleton, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from
|
|
18
|
-
export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from
|
|
19
|
-
export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from
|
|
20
|
-
export { Card, CodeBlock, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from
|
|
21
|
-
export { Pagination } from
|
|
22
|
-
export { Combobox, NumberField, ComboboxArrow, ComboboxBackdrop, ComboboxChip, ComboboxChipRemove, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxIcon, ComboboxInput, ComboboxInputGroup, ComboboxItem, ComboboxItemIndicator, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPortal, ComboboxPositioner, ComboboxRoot, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxContent, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, } from
|
|
23
|
-
export { Autocomplete, Slider, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRoot, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, AutocompleteContent, SliderControl, SliderIndicator, SliderLabel, SliderRoot, SliderThumb, SliderTrack, SliderValue, } from
|
|
24
|
-
export { DirectionProvider } from
|
|
25
|
-
export { Toggle, ToggleGroup, Toolbar, Menubar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarRoot, ToolbarSeparator, } from
|
|
26
|
-
export { ContextMenu, PreviewCard, ContextMenuArrow, ContextMenuBackdrop, ContextMenuCheckboxItem, ContextMenuCheckboxItemIndicator, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuLinkItem, ContextMenuPopup, ContextMenuPortal, ContextMenuPositioner, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuRadioItemIndicator, ContextMenuRoot, ContextMenuSeparator, ContextMenuSubmenuRoot, ContextMenuSubmenuTrigger, ContextMenuTrigger, ContextMenuContent, PreviewCardArrow, PreviewCardBackdrop, PreviewCardHandle, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardRoot, PreviewCardTrigger, PreviewCardViewport, PreviewCardContent, } from
|
|
27
|
-
export { NavigationMenu, NavigationMenuArrow, NavigationMenuBackdrop, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuPortal, NavigationMenuPositioner, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, } from
|
|
28
|
-
export { OTPField, OTPFieldInput, OTPFieldRoot, OTPFieldSeparator, OTPFieldGroup, } from
|
|
29
|
-
export { Toast, ToastAction, ToastArrow, ToastClose, ToastContent, ToastDescription, ToastPortal, ToastPositioner, ToastProvider, ToastRoot, ToastTitle, ToastViewport, ToastIcon, ToastText, } from
|
|
30
|
-
export { FileUpload, } from
|
|
31
|
-
export { Icon, iconNames } from
|
|
32
|
-
export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from
|
|
33
|
-
export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from
|
|
34
|
-
export { Tree } from
|
|
35
|
-
export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, } from
|
|
36
|
-
export { Chart, } from
|
|
37
|
-
export { SyntaxHighlighter, syntaxLanguages, } from
|
|
38
|
-
export { Markdown } from
|
|
1
|
+
'use client';
|
|
2
|
+
export { SizeProvider, } from './sizing.js';
|
|
3
|
+
export { Button, } from './button.js';
|
|
4
|
+
export { Slot } from './slot.js';
|
|
5
|
+
export { Input } from './input.js';
|
|
6
|
+
export { Select, NativeSelect, NativeSelectOption, NativeSelectOptGroup, } from './select.js';
|
|
7
|
+
export { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverHandle, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, PopoverViewport, PopoverContent, } from './popover.js';
|
|
8
|
+
export { Tooltip, TooltipProvider } from './tooltip.js';
|
|
9
|
+
export { Dialog, AlertDialog, DialogBackdrop, DialogClose, DialogDescription, DialogHandle, DialogPopup, DialogPortal, DialogRoot, DialogTitle, DialogTrigger, DialogViewport, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogHandle, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, } from './dialog.js';
|
|
10
|
+
export { Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuClear, MenuEmpty, MenuFilterProvider, MenuGroup, MenuGroupLabel, MenuHandle, MenuInput, MenuItem, MenuLinkItem, MenuList, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRoot, MenuSeparator, MenuSubmenuRoot, MenuSubmenuTrigger, MenuTrigger, MenuViewport, MenuContent, } from './menu.js';
|
|
11
|
+
export { ScrollArea } from './scroll-area.js';
|
|
12
|
+
export { Sheet, Drawer, SheetBackdrop, SheetClose, SheetDescription, SheetHandle, SheetPopup, SheetPortal, SheetRoot, SheetTitle, SheetTrigger, SheetViewport, SheetContent, SheetHeader, SheetBody, SheetFooter, DrawerBackdrop, DrawerClose, DrawerContent, DrawerDescription, DrawerHandle, DrawerIndent, DrawerIndentBackground, DrawerPopup, DrawerPortal, DrawerProvider, DrawerRoot, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DrawerVirtualKeyboardProvider, DrawerPrimitiveContent, DrawerHeader, DrawerBody, DrawerFooter, } from './panels.js';
|
|
13
|
+
export { Container, Stack, Inline, Grid, GridItem, Surface, Heading, Text, PageHeader, Prose, } from './foundations.js';
|
|
14
|
+
export { Field, Fieldset, Form, Textarea, Checkbox, CheckboxGroup, Radio, RadioGroup, Switch, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldRoot, FieldValidity, FieldsetLegend, FieldsetRoot, CheckboxIndicator, CheckboxRoot, RadioIndicator, RadioRoot, SwitchRoot, SwitchThumb, } from './forms.js';
|
|
15
|
+
export { Tabs, Accordion, Collapsible, Avatar, Separator, Link, Breadcrumbs, TabsIndicator, TabsList, TabsPanel, TabsRoot, TabsTab, AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger, AvatarFallback, AvatarImage, AvatarRoot, AvatarStatus, BreadcrumbsRoot, BreadcrumbsList, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsSeparator, BreadcrumbsCurrent, } from './navigation.js';
|
|
16
|
+
export { Badge, StatusBadge, } from './status.js';
|
|
17
|
+
export { Progress, Meter, Spinner, Skeleton, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue, MeterIndicator, MeterLabel, MeterRoot, MeterTrack, MeterValue, } from './feedback.js';
|
|
18
|
+
export { Table, List, TableContainer, TableRoot, TableCaption, TableHead, TableBody, TableFoot, TableRow, TableHeaderCell, TableCell, ListRoot, ListItem, ListContent, ListTitle, ListDescription, ListActions, } from './data.js';
|
|
19
|
+
export { InlineMessage, EmptyState, InlineMessageRoot, InlineMessageIcon, InlineMessageContent, InlineMessageTitle, InlineMessageDescription, InlineMessageActions, EmptyStateRoot, EmptyStateIcon, EmptyStateTitle, EmptyStateDescription, EmptyStateActions, } from './messages.js';
|
|
20
|
+
export { Card, CodeBlock, CardRoot, CardHeader, CardTitle, CardDescription, CardBody, CardFooter, } from './content.js';
|
|
21
|
+
export { Pagination } from './pagination.js';
|
|
22
|
+
export { Combobox, NumberField, ComboboxArrow, ComboboxBackdrop, ComboboxChip, ComboboxChipRemove, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxIcon, ComboboxInput, ComboboxInputGroup, ComboboxItem, ComboboxItemIndicator, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPortal, ComboboxPositioner, ComboboxRoot, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxContent, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, } from './advanced-forms.js';
|
|
23
|
+
export { Autocomplete, Slider, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRoot, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, AutocompleteContent, SliderControl, SliderIndicator, SliderLabel, SliderRoot, SliderThumb, SliderTrack, SliderValue, } from './input-extensions.js';
|
|
24
|
+
export { DirectionProvider } from '@base-ui/react/direction-provider';
|
|
25
|
+
export { Toggle, ToggleGroup, Toolbar, Menubar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarRoot, ToolbarSeparator, } from './commands.js';
|
|
26
|
+
export { ContextMenu, PreviewCard, ContextMenuArrow, ContextMenuBackdrop, ContextMenuCheckboxItem, ContextMenuCheckboxItemIndicator, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuLinkItem, ContextMenuPopup, ContextMenuPortal, ContextMenuPositioner, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuRadioItemIndicator, ContextMenuRoot, ContextMenuSeparator, ContextMenuSubmenuRoot, ContextMenuSubmenuTrigger, ContextMenuTrigger, ContextMenuContent, PreviewCardArrow, PreviewCardBackdrop, PreviewCardHandle, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardRoot, PreviewCardTrigger, PreviewCardViewport, PreviewCardContent, } from './context-overlays.js';
|
|
27
|
+
export { NavigationMenu, NavigationMenuArrow, NavigationMenuBackdrop, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuPortal, NavigationMenuPositioner, NavigationMenuRoot, NavigationMenuTrigger, NavigationMenuViewport, } from './navigation-menu.js';
|
|
28
|
+
export { OTPField, OTPFieldInput, OTPFieldRoot, OTPFieldSeparator, OTPFieldGroup, } from './otp-field.js';
|
|
29
|
+
export { Toast, ToastAction, ToastArrow, ToastClose, ToastContent, ToastDescription, ToastPortal, ToastPositioner, ToastProvider, ToastRoot, ToastTitle, ToastViewport, ToastIcon, ToastText, } from './toast.js';
|
|
30
|
+
export { FileUpload, } from './file-upload.js';
|
|
31
|
+
export { Icon, iconNames } from './icon.js';
|
|
32
|
+
export { FilterBar, FilterBarRoot, FilterBarControls, FilterBarField, FilterBarActions, FilterBarSummary, } from './filter-bar.js';
|
|
33
|
+
export { AppShell, AppShellRoot, AppShellHeader, AppShellSidebar, AppShellContent, AppShellFooter, AppShellLabel, AppShellLink, } from './app-shell.js';
|
|
34
|
+
export { Tree } from './tree.js';
|
|
35
|
+
export { DatePicker, DateRangePicker, TimeField, DateLocaleProvider, } from './date-picker.js';
|
|
36
|
+
export { Chart, } from './chart.js';
|
|
37
|
+
export { SyntaxHighlighter, syntaxLanguages, } from './syntax-highlighter.js';
|
|
38
|
+
export { Markdown } from './markdown.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from
|
|
2
|
-
import { Autocomplete as BaseAutocomplete } from
|
|
3
|
-
import { Slider as BaseSlider } from
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Autocomplete as BaseAutocomplete } from '@base-ui/react/autocomplete';
|
|
3
|
+
import { Slider as BaseSlider } from '@base-ui/react/slider';
|
|
4
4
|
declare const AutocompleteRoot: typeof BaseAutocomplete.Root;
|
|
5
5
|
export declare const Autocomplete: {
|
|
6
6
|
Root: typeof BaseAutocomplete.Root;
|
package/dist/input-extensions.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from
|
|
4
|
-
import { Autocomplete as BaseAutocomplete } from
|
|
5
|
-
import { Slider as BaseSlider } from
|
|
6
|
-
import { Combobox } from
|
|
7
|
-
import { skin, part } from
|
|
8
|
-
import { useResetValue, useRootRef } from
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Autocomplete as BaseAutocomplete } from '@base-ui/react/autocomplete';
|
|
5
|
+
import { Slider as BaseSlider } from '@base-ui/react/slider';
|
|
6
|
+
import { Combobox } from './advanced-forms.js';
|
|
7
|
+
import { skin, part } from './parts.js';
|
|
8
|
+
import { useResetValue, useRootRef } from './form-state.js';
|
|
9
9
|
const AutocompleteRoot = function AutocompleteRoot({ children, form, value, defaultValue, onValueChange, ...props }) {
|
|
10
10
|
const anchor = React.useRef(null);
|
|
11
|
-
const [query, setQuery, revision] = useResetValue(value, defaultValue ??
|
|
11
|
+
const [query, setQuery, revision] = useResetValue(value, defaultValue ?? '', anchor, form);
|
|
12
12
|
return (_jsxs(BaseAutocomplete.Root, { ...props, form: form, value: query, onValueChange: (next, event) => {
|
|
13
13
|
onValueChange?.(next, event);
|
|
14
14
|
if (value === undefined && !event.isCanceled)
|
|
@@ -16,10 +16,10 @@ const AutocompleteRoot = function AutocompleteRoot({ children, form, value, defa
|
|
|
16
16
|
}, children: [_jsx("span", { hidden: true, ref: anchor }), children] }, revision));
|
|
17
17
|
};
|
|
18
18
|
const AutoTrigger = React.forwardRef(function AutoTrigger({ className, children, ...props }, ref) {
|
|
19
|
-
return (_jsx(BaseAutocomplete.Trigger, { "aria-label":
|
|
19
|
+
return (_jsx(BaseAutocomplete.Trigger, { "aria-label": 'Show suggestions', ...props, ref: ref, className: skin('pui-combobox-action', className), children: children ?? (_jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.6', "aria-hidden": 'true', children: _jsx("path", { d: 'm6 9 6 6 6-6' }) })) }));
|
|
20
20
|
});
|
|
21
21
|
const AutoClear = React.forwardRef(function AutoClear(props, ref) {
|
|
22
|
-
return _jsx(Combobox.Clear, { "aria-label":
|
|
22
|
+
return _jsx(Combobox.Clear, { "aria-label": 'Clear input', ...props, ref: ref });
|
|
23
23
|
});
|
|
24
24
|
export const Autocomplete = {
|
|
25
25
|
...BaseAutocomplete,
|
|
@@ -35,14 +35,14 @@ export const Autocomplete = {
|
|
|
35
35
|
GroupLabel: Combobox.GroupLabel,
|
|
36
36
|
Clear: AutoClear,
|
|
37
37
|
Trigger: AutoTrigger,
|
|
38
|
-
InputGroup: part(BaseAutocomplete.InputGroup,
|
|
39
|
-
Item: part(BaseAutocomplete.Item,
|
|
40
|
-
Separator: part(BaseAutocomplete.Separator,
|
|
38
|
+
InputGroup: part(BaseAutocomplete.InputGroup, 'pui-combobox-group'),
|
|
39
|
+
Item: part(BaseAutocomplete.Item, 'pui-combobox-item'),
|
|
40
|
+
Separator: part(BaseAutocomplete.Separator, 'pui-combobox-separator'),
|
|
41
41
|
};
|
|
42
|
-
function SliderRoot({ value, defaultValue, onValueChange, ref, className, form, thumbAlignment =
|
|
42
|
+
function SliderRoot({ value, defaultValue, onValueChange, ref, className, form, thumbAlignment = 'edge', ...props }) {
|
|
43
43
|
const [element, attach] = useRootRef(ref);
|
|
44
44
|
const [selected, setSelected] = useResetValue(value, (defaultValue ?? props.min ?? 0), element, form);
|
|
45
|
-
return (_jsx(BaseSlider.Root, { ...props, form: form, ref: attach, value: selected, thumbAlignment: thumbAlignment, className: skin(
|
|
45
|
+
return (_jsx(BaseSlider.Root, { ...props, form: form, ref: attach, value: selected, thumbAlignment: thumbAlignment, className: skin('pui-slider', className), onValueChange: (next, event) => {
|
|
46
46
|
onValueChange?.(next, event);
|
|
47
47
|
if (value === undefined && !event.isCanceled)
|
|
48
48
|
setSelected(next);
|
|
@@ -51,12 +51,12 @@ function SliderRoot({ value, defaultValue, onValueChange, ref, className, form,
|
|
|
51
51
|
export const Slider = {
|
|
52
52
|
...BaseSlider,
|
|
53
53
|
Root: SliderRoot,
|
|
54
|
-
Label: part(BaseSlider.Label,
|
|
55
|
-
Value: part(BaseSlider.Value,
|
|
56
|
-
Control: part(BaseSlider.Control,
|
|
57
|
-
Track: part(BaseSlider.Track,
|
|
58
|
-
Indicator: part(BaseSlider.Indicator,
|
|
59
|
-
Thumb: part(BaseSlider.Thumb,
|
|
54
|
+
Label: part(BaseSlider.Label, 'pui-slider-label'),
|
|
55
|
+
Value: part(BaseSlider.Value, 'pui-slider-value'),
|
|
56
|
+
Control: part(BaseSlider.Control, 'pui-slider-control'),
|
|
57
|
+
Track: part(BaseSlider.Track, 'pui-slider-track'),
|
|
58
|
+
Indicator: part(BaseSlider.Indicator, 'pui-slider-indicator'),
|
|
59
|
+
Thumb: part(BaseSlider.Thumb, 'pui-slider-thumb'),
|
|
60
60
|
};
|
|
61
61
|
// Flat names for React Server Components, which cannot dot into client exports.
|
|
62
62
|
export { AutocompleteRoot, SliderRoot };
|
package/dist/input.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React from
|
|
2
|
-
import { type ComponentSizeAlias } from
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { type ComponentSizeAlias } from './sizing.js';
|
|
3
3
|
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "size"> & {
|
|
4
4
|
size?: number | ComponentSizeAlias;
|
|
5
5
|
leadingIcon?: React.ReactNode;
|
package/dist/input.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from
|
|
4
|
-
import { useComponentSize } from
|
|
5
|
-
import { Input as BaseInput } from
|
|
6
|
-
const cx = (...v) => v.filter(Boolean).join(
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { useComponentSize } from './sizing.js';
|
|
5
|
+
import { Input as BaseInput } from '@base-ui/react/input';
|
|
6
|
+
const cx = (...v) => v.filter(Boolean).join(' ');
|
|
7
7
|
export const Input = React.forwardRef(function Input({ className, leadingIcon, wrapperClassName, size, ...props }, ref) {
|
|
8
|
-
const scheme = useComponentSize(typeof size ===
|
|
9
|
-
return (_jsxs("span", { "data-ui-size": scheme, className: cx(
|
|
8
|
+
const scheme = useComponentSize(typeof size === 'string' ? size : undefined);
|
|
9
|
+
return (_jsxs("span", { "data-ui-size": scheme, className: cx('pui-control', wrapperClassName), "data-leading-icon": leadingIcon ? '' : undefined, "data-disabled": props.disabled || undefined, children: [leadingIcon && (_jsx("span", { className: 'pui-control-icon control-icon', "aria-hidden": 'true', children: leadingIcon })), _jsx(BaseInput, { ...props, size: typeof size === 'number' ? size : undefined, ref: ref, className: cx('pui-input', className) })] }));
|
|
10
10
|
});
|
package/dist/markdown.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React from
|
|
2
|
-
export type MarkdownProps = Omit<React.ComponentPropsWithoutRef<
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export type MarkdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {
|
|
3
3
|
source: string;
|
|
4
4
|
label?: string;
|
|
5
5
|
headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
|