@agentero/design-system 0.24.3 → 0.24.5
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/mcp/manifests/components.html +1714 -1001
- package/mcp/manifests/components.json +6985 -1
- package/mcp/server.mjs +3921 -2320
- package/package.json +1 -1
- package/src/accordion/accordion.d.ts +35 -23
- package/src/accordion/accordion.js +1 -8
- package/src/accordion/index.d.ts +18 -1
- package/src/accordion/index.js +10 -2
- package/src/avatar-group/avatar-group.d.ts +2 -0
- package/src/avatar-group/avatar-group.js +0 -1
- package/src/button/button.js +0 -1
- package/src/check-list/check-list.d.ts +15 -14
- package/src/check-list/check-list.js +1 -6
- package/src/check-list/index.d.ts +11 -1
- package/src/check-list/index.js +8 -2
- package/src/command/command.d.ts +117 -43
- package/src/command/command.js +1 -9
- package/src/command/index.d.ts +86 -1
- package/src/command/index.js +12 -2
- package/src/data-table/data-table.d.ts +81 -46
- package/src/data-table/data-table.js +71 -78
- package/src/data-table/index.d.ts +175 -2
- package/src/data-table/index.js +22 -3
- package/src/data-table/table.d.ts +107 -44
- package/src/data-table/table.js +1 -12
- package/src/divider/divider.js +0 -1
- package/src/dropdown-menu/dropdown-menu.d.ts +254 -136
- package/src/dropdown-menu/dropdown-menu.js +1 -14
- package/src/dropdown-menu/index.d.ts +51 -1
- package/src/dropdown-menu/index.js +16 -2
- package/src/hover-card/hover-card.d.ts +40 -26
- package/src/hover-card/hover-card.js +1 -9
- package/src/hover-card/index.d.ts +20 -1
- package/src/hover-card/index.js +11 -2
- package/src/label/label.js +0 -1
- package/src/modal/index.d.ts +38 -1
- package/src/modal/index.js +14 -2
- package/src/modal/modal.d.ts +125 -81
- package/src/modal/modal.js +1 -11
- package/src/popover/index.d.ts +24 -1
- package/src/popover/index.js +12 -2
- package/src/popover/popover.d.ts +30 -30
- package/src/popover/popover.js +1 -10
- package/src/skeleton/skeleton.js +0 -1
- package/src/tag/tag.js +0 -1
- package/src/validation-list/validation-list.d.ts +2 -0
- package/src/validation-list/validation-list.js +0 -1
|
@@ -1 +1,51 @@
|
|
|
1
|
-
export
|
|
1
|
+
export declare const DropdownMenu: {
|
|
2
|
+
Root: {
|
|
3
|
+
(props: import('@radix-ui/react-dropdown-menu').DropdownMenuProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
displayName: string;
|
|
5
|
+
};
|
|
6
|
+
Trigger: {
|
|
7
|
+
({ className, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuTriggerProps & import('react').RefAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
displayName: string;
|
|
9
|
+
};
|
|
10
|
+
Portal: import('react').FC<import('@radix-ui/react-dropdown-menu').DropdownMenuPortalProps>;
|
|
11
|
+
Content: {
|
|
12
|
+
({ className, hasTriggerWidth, sideOffset, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuContentProps & import('react').RefAttributes<HTMLDivElement> & import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
|
|
13
|
+
hasTriggerWidth: {
|
|
14
|
+
true: string;
|
|
15
|
+
};
|
|
16
|
+
}, undefined, string[], {
|
|
17
|
+
hasTriggerWidth: {
|
|
18
|
+
true: string;
|
|
19
|
+
};
|
|
20
|
+
}, undefined, import('tailwind-variants').TVReturnType<{
|
|
21
|
+
hasTriggerWidth: {
|
|
22
|
+
true: string;
|
|
23
|
+
};
|
|
24
|
+
}, undefined, string[], unknown, unknown, undefined>>>): import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
displayName: string;
|
|
26
|
+
};
|
|
27
|
+
Item: {
|
|
28
|
+
({ className, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuItemProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
displayName: string;
|
|
30
|
+
};
|
|
31
|
+
Separator: {
|
|
32
|
+
({ className, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuSeparatorProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
33
|
+
displayName: string;
|
|
34
|
+
};
|
|
35
|
+
Label: {
|
|
36
|
+
({ className, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuLabelProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
displayName: string;
|
|
38
|
+
};
|
|
39
|
+
Sub: {
|
|
40
|
+
(props: import('@radix-ui/react-dropdown-menu').DropdownMenuSubProps): import("react/jsx-runtime").JSX.Element;
|
|
41
|
+
displayName: string;
|
|
42
|
+
};
|
|
43
|
+
SubTrigger: {
|
|
44
|
+
({ className, children, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuSubTriggerProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
45
|
+
displayName: string;
|
|
46
|
+
};
|
|
47
|
+
SubContent: {
|
|
48
|
+
({ className, sideOffset, alignOffset, ...props }: import('@radix-ui/react-dropdown-menu').DropdownMenuSubContentProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
49
|
+
displayName: string;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
@@ -1,2 +1,16 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { Content as e, Item as t, Label as n, Portal as r, Root as i, Separator as a, Sub as o, SubContent as s, SubTrigger as c, Trigger as l } from "./dropdown-menu.js";
|
|
2
|
+
//#region src/dropdown-menu/index.ts
|
|
3
|
+
var u = {
|
|
4
|
+
Root: i,
|
|
5
|
+
Trigger: l,
|
|
6
|
+
Portal: r,
|
|
7
|
+
Content: e,
|
|
8
|
+
Item: t,
|
|
9
|
+
Separator: a,
|
|
10
|
+
Label: n,
|
|
11
|
+
Sub: o,
|
|
12
|
+
SubTrigger: c,
|
|
13
|
+
SubContent: s
|
|
14
|
+
};
|
|
15
|
+
//#endregion
|
|
16
|
+
export { u as DropdownMenu };
|
|
@@ -1,39 +1,53 @@
|
|
|
1
1
|
import { ComponentProps } from 'react';
|
|
2
2
|
import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
|
|
3
3
|
type RootProps = ComponentProps<typeof HoverCardPrimitive.Root>;
|
|
4
|
-
type TriggerProps = ComponentProps<typeof HoverCardPrimitive.Trigger>;
|
|
5
|
-
export declare const hoverCardRecipe: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
|
|
6
|
-
type ContentProps = ComponentProps<typeof HoverCardPrimitive.Content>;
|
|
7
|
-
type ArrowProps = ComponentProps<typeof HoverCardPrimitive.Arrow>;
|
|
8
4
|
/**
|
|
9
|
-
*
|
|
10
|
-
* previews) shown on hover/focus, built on Radix HoverCard.
|
|
11
|
-
* `Root`
|
|
5
|
+
* Root of a rich, sighted-user hover preview anchored to a trigger (profile
|
|
6
|
+
* cards, entity previews) shown on hover/focus, built on Radix HoverCard.
|
|
7
|
+
* Compose `Root` with `Trigger` / `Portal` / `Content`, plus an optional
|
|
8
|
+
* `Arrow`.
|
|
12
9
|
*
|
|
13
10
|
* Pointer-first and NOT keyboard-accessible: focus opens it but focus never
|
|
14
11
|
* enters the card — never put essential info or the only path to an action
|
|
15
12
|
* inside. Use `Popover`/`DropdownMenu` for that, or `Tooltip` for text hints.
|
|
16
13
|
*
|
|
17
|
-
* @summary
|
|
14
|
+
* @summary Root provider for a rich hover preview of an entity
|
|
18
15
|
* @see {@link https://www.radix-ui.com/primitives/docs/components/hover-card|Radix UI HoverCard}
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* ```tsx
|
|
19
|
+
* import { HoverCard } from '@agentero/design-system/hover-card';
|
|
20
|
+
*
|
|
21
|
+
* <HoverCard.Root>
|
|
22
|
+
* <HoverCard.Trigger>@rafa</HoverCard.Trigger>
|
|
23
|
+
* <HoverCard.Portal>
|
|
24
|
+
* <HoverCard.Content>
|
|
25
|
+
* <ProfileCard />
|
|
26
|
+
* <HoverCard.Arrow />
|
|
27
|
+
* </HoverCard.Content>
|
|
28
|
+
* </HoverCard.Portal>
|
|
29
|
+
* </HoverCard.Root>
|
|
30
|
+
* ```
|
|
19
31
|
*/
|
|
20
|
-
export declare const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
32
|
+
export declare const Root: {
|
|
33
|
+
(props: RootProps): import("react/jsx-runtime").JSX.Element;
|
|
34
|
+
displayName: string;
|
|
35
|
+
};
|
|
36
|
+
type TriggerProps = ComponentProps<typeof HoverCardPrimitive.Trigger>;
|
|
37
|
+
export declare const Trigger: {
|
|
38
|
+
(props: TriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
displayName: string;
|
|
40
|
+
};
|
|
41
|
+
export declare const Portal: import('react').FC<HoverCardPrimitive.HoverCardPortalProps>;
|
|
42
|
+
export declare const hoverCardRecipe: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
|
|
43
|
+
type ContentProps = ComponentProps<typeof HoverCardPrimitive.Content>;
|
|
44
|
+
export declare const Content: {
|
|
45
|
+
({ className, sideOffset, collisionPadding, ...props }: ContentProps): import("react/jsx-runtime").JSX.Element;
|
|
46
|
+
displayName: string;
|
|
47
|
+
};
|
|
48
|
+
type ArrowProps = ComponentProps<typeof HoverCardPrimitive.Arrow>;
|
|
49
|
+
export declare const Arrow: {
|
|
50
|
+
({ className, width, height, ...props }: ArrowProps): import("react/jsx-runtime").JSX.Element;
|
|
51
|
+
displayName: string;
|
|
38
52
|
};
|
|
39
53
|
export {};
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use client";
|
|
2
1
|
import { cn as e } from "../../lib/utils.js";
|
|
3
2
|
import { tv as t } from "tailwind-variants";
|
|
4
3
|
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
@@ -56,12 +55,5 @@ var u = ({ className: t, width: a = 12, height: o = 6, ...s }) => /* @__PURE__ *
|
|
|
56
55
|
})
|
|
57
56
|
});
|
|
58
57
|
u.displayName = "HoverCard.Arrow";
|
|
59
|
-
var d = {
|
|
60
|
-
Root: a,
|
|
61
|
-
Trigger: o,
|
|
62
|
-
Portal: s,
|
|
63
|
-
Content: l,
|
|
64
|
-
Arrow: u
|
|
65
|
-
};
|
|
66
58
|
//#endregion
|
|
67
|
-
export {
|
|
59
|
+
export { u as Arrow, l as Content, s as Portal, a as Root, o as Trigger, c as hoverCardRecipe };
|
|
@@ -1 +1,20 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { hoverCardRecipe } from './hover-card';
|
|
2
|
+
export declare const HoverCard: {
|
|
3
|
+
Root: {
|
|
4
|
+
(props: import('@radix-ui/react-hover-card').HoverCardProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
displayName: string;
|
|
6
|
+
};
|
|
7
|
+
Trigger: {
|
|
8
|
+
(props: import('@radix-ui/react-hover-card').HoverCardTriggerProps & import('react').RefAttributes<HTMLAnchorElement>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
};
|
|
11
|
+
Portal: import('react').FC<import('@radix-ui/react-hover-card').HoverCardPortalProps>;
|
|
12
|
+
Content: {
|
|
13
|
+
({ className, sideOffset, collisionPadding, ...props }: import('@radix-ui/react-hover-card').HoverCardContentProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
displayName: string;
|
|
15
|
+
};
|
|
16
|
+
Arrow: {
|
|
17
|
+
({ className, width, height, ...props }: import('@radix-ui/react-hover-card').HoverCardArrowProps & import('react').RefAttributes<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
displayName: string;
|
|
19
|
+
};
|
|
20
|
+
};
|
package/src/hover-card/index.js
CHANGED
|
@@ -1,2 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { Arrow as e, Content as t, Portal as n, Root as r, Trigger as i, hoverCardRecipe as a } from "./hover-card.js";
|
|
2
|
+
//#region src/hover-card/index.ts
|
|
3
|
+
var o = {
|
|
4
|
+
Root: r,
|
|
5
|
+
Trigger: i,
|
|
6
|
+
Portal: n,
|
|
7
|
+
Content: t,
|
|
8
|
+
Arrow: e
|
|
9
|
+
};
|
|
10
|
+
//#endregion
|
|
11
|
+
export { o as HoverCard, a as hoverCardRecipe };
|
package/src/label/label.js
CHANGED
package/src/modal/index.d.ts
CHANGED
|
@@ -1 +1,38 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { modalRecipe } from './modal';
|
|
2
|
+
export declare const Modal: {
|
|
3
|
+
Root: {
|
|
4
|
+
(props: import('@radix-ui/react-dialog').DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
displayName: string;
|
|
6
|
+
};
|
|
7
|
+
Trigger: {
|
|
8
|
+
(props: import('@radix-ui/react-dialog').DialogTriggerProps & import('react').RefAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
};
|
|
11
|
+
Content: {
|
|
12
|
+
({ className, size, variant, children, onEscapeKeyDown, onPointerDownOutside, ...props }: import('@radix-ui/react-dialog').DialogContentProps & import('react').RefAttributes<HTMLDivElement> & {
|
|
13
|
+
size?: "md" | "lg" | undefined;
|
|
14
|
+
variant?: "dialog" | "alert";
|
|
15
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
displayName: string;
|
|
17
|
+
};
|
|
18
|
+
Title: {
|
|
19
|
+
({ className, children, ...props }: import('@radix-ui/react-dialog').DialogTitleProps & import('react').RefAttributes<HTMLHeadingElement>): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
displayName: string;
|
|
21
|
+
};
|
|
22
|
+
Description: {
|
|
23
|
+
({ className, ...props }: import('@radix-ui/react-dialog').DialogDescriptionProps & import('react').RefAttributes<HTMLParagraphElement>): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
displayName: string;
|
|
25
|
+
};
|
|
26
|
+
Body: {
|
|
27
|
+
({ className, ...props }: import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
displayName: string;
|
|
29
|
+
};
|
|
30
|
+
Footer: {
|
|
31
|
+
({ className, ...props }: import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
32
|
+
displayName: string;
|
|
33
|
+
};
|
|
34
|
+
Close: {
|
|
35
|
+
(props: import('@radix-ui/react-dialog').DialogCloseProps & import('react').RefAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
|
|
36
|
+
displayName: string;
|
|
37
|
+
};
|
|
38
|
+
};
|
package/src/modal/index.js
CHANGED
|
@@ -1,2 +1,14 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { Body as e, Close as t, Content as n, Description as r, Footer as i, Root as a, Title as o, Trigger as s, modalRecipe as c } from "./modal.js";
|
|
2
|
+
//#region src/modal/index.ts
|
|
3
|
+
var l = {
|
|
4
|
+
Root: a,
|
|
5
|
+
Trigger: s,
|
|
6
|
+
Content: n,
|
|
7
|
+
Title: o,
|
|
8
|
+
Description: r,
|
|
9
|
+
Body: e,
|
|
10
|
+
Footer: i,
|
|
11
|
+
Close: t
|
|
12
|
+
};
|
|
13
|
+
//#endregion
|
|
14
|
+
export { l as Modal, c as modalRecipe };
|
package/src/modal/modal.d.ts
CHANGED
|
@@ -2,7 +2,71 @@ import { ComponentProps } from 'react';
|
|
|
2
2
|
import { VariantProps } from 'tailwind-variants';
|
|
3
3
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
4
4
|
type RootProps = ComponentProps<typeof DialogPrimitive.Root>;
|
|
5
|
+
/**
|
|
6
|
+
* Root container of a dialog that interrupts the flow — confirmations, forms,
|
|
7
|
+
* and detail views. It owns the modal's open state, controlled via
|
|
8
|
+
* `open`/`onOpenChange` or uncontrolled via `defaultOpen`/`Trigger`. Built on
|
|
9
|
+
* Radix UI Dialog, so focus trapping, scroll locking, `Escape`/overlay
|
|
10
|
+
* dismissal, and ARIA wiring come for free.
|
|
11
|
+
*
|
|
12
|
+
* Compose `Root` with `Content` (surface, `size` md/lg), and fill it with
|
|
13
|
+
* `Title` (built-in X button), an optional `Description` right below it, `Body`
|
|
14
|
+
* (scrollable), and `Footer` (right-aligned actions). Close from inside with
|
|
15
|
+
* `Close asChild` around your cancel button.
|
|
16
|
+
*
|
|
17
|
+
* For a modal the user has to answer, pass `variant="alert"` to `Content`:
|
|
18
|
+
* `Escape`, the overlay click and the X button all stop closing it, and it is
|
|
19
|
+
* announced as an `alertdialog`.
|
|
20
|
+
*
|
|
21
|
+
* @summary Root provider for a Modal's open state
|
|
22
|
+
*
|
|
23
|
+
* @example
|
|
24
|
+
* ```tsx
|
|
25
|
+
* import { Modal } from '@agentero/design-system/modal';
|
|
26
|
+
*
|
|
27
|
+
* <Modal.Root open={isOpen} onOpenChange={setIsOpen}>
|
|
28
|
+
* <Modal.Content size="md">
|
|
29
|
+
* <Modal.Title>Delete carrier</Modal.Title>
|
|
30
|
+
* <Modal.Description>This action cannot be undone.</Modal.Description>
|
|
31
|
+
* <Modal.Footer>
|
|
32
|
+
* <Modal.Close asChild>
|
|
33
|
+
* <Button variant="ghost">Cancel</Button>
|
|
34
|
+
* </Modal.Close>
|
|
35
|
+
* <Button onClick={handleDelete}>Delete</Button>
|
|
36
|
+
* </Modal.Footer>
|
|
37
|
+
* </Modal.Content>
|
|
38
|
+
* </Modal.Root>
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* @example
|
|
42
|
+
* ```tsx
|
|
43
|
+
* // Alert: no Escape, no overlay click, no X — the user must answer.
|
|
44
|
+
* <Modal.Root open={isOpen}>
|
|
45
|
+
* <Modal.Content variant="alert">
|
|
46
|
+
* <Modal.Title>Complete your Docusign integration</Modal.Title>
|
|
47
|
+
* <Modal.Body>Authorize access to finish connecting your account.</Modal.Body>
|
|
48
|
+
* <Modal.Footer>
|
|
49
|
+
* <Button onClick={handleAuthorize}>Authorize</Button>
|
|
50
|
+
* </Modal.Footer>
|
|
51
|
+
* </Modal.Content>
|
|
52
|
+
* </Modal.Root>
|
|
53
|
+
* ```
|
|
54
|
+
*/
|
|
55
|
+
export declare const Root: {
|
|
56
|
+
(props: RootProps): import("react/jsx-runtime").JSX.Element;
|
|
57
|
+
displayName: string;
|
|
58
|
+
};
|
|
5
59
|
type TriggerProps = ComponentProps<typeof DialogPrimitive.Trigger>;
|
|
60
|
+
/**
|
|
61
|
+
* Button that opens the Modal. Pass `asChild` to delegate rendering to a
|
|
62
|
+
* custom element (e.g. a `Button`) while inheriting Radix's wiring.
|
|
63
|
+
*
|
|
64
|
+
* @summary Toggle button that opens the Modal
|
|
65
|
+
*/
|
|
66
|
+
export declare const Trigger: {
|
|
67
|
+
(props: TriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
68
|
+
displayName: string;
|
|
69
|
+
};
|
|
6
70
|
type ModalVariant = 'dialog' | 'alert';
|
|
7
71
|
export declare const modalRecipe: import('tailwind-variants').TVReturnType<{
|
|
8
72
|
size: {
|
|
@@ -69,94 +133,74 @@ type ContentProps = ComponentProps<typeof DialogPrimitive.Content> & {
|
|
|
69
133
|
*/
|
|
70
134
|
variant?: ModalVariant;
|
|
71
135
|
};
|
|
72
|
-
type TitleProps = ComponentProps<typeof DialogPrimitive.Title>;
|
|
73
|
-
type DescriptionProps = ComponentProps<typeof DialogPrimitive.Description>;
|
|
74
|
-
type BodyProps = ComponentProps<'div'>;
|
|
75
|
-
type FooterProps = ComponentProps<'div'>;
|
|
76
|
-
type CloseProps = ComponentProps<typeof DialogPrimitive.Close>;
|
|
77
136
|
/**
|
|
78
|
-
*
|
|
79
|
-
*
|
|
80
|
-
*
|
|
81
|
-
* for
|
|
137
|
+
* The modal surface, portalled over a dimmed overlay and centered in the
|
|
138
|
+
* viewport. Focus is trapped inside, `Escape` and overlay clicks close it,
|
|
139
|
+
* and body scroll is locked while open. Labelled by `Modal.Title`
|
|
140
|
+
* automatically; pass `aria-label` for the rare titleless modal.
|
|
82
141
|
*
|
|
83
|
-
*
|
|
84
|
-
*
|
|
85
|
-
* below it, `Body` (scrollable), and `Footer` (right-aligned actions). Open
|
|
86
|
-
* it controlled (`open`/`onOpenChange`) or via `Trigger`; close from inside
|
|
87
|
-
* with `Close asChild` around your cancel button.
|
|
142
|
+
* `variant="alert"` turns off every implicit way out — `Escape`, the overlay
|
|
143
|
+
* click, and the X button in `Modal.Title` — leaving only the footer actions.
|
|
88
144
|
*
|
|
89
|
-
*
|
|
90
|
-
|
|
91
|
-
|
|
145
|
+
* @summary Centered modal surface over a dimmed overlay
|
|
146
|
+
*/
|
|
147
|
+
export declare const Content: {
|
|
148
|
+
({ className, size, variant, children, onEscapeKeyDown, onPointerDownOutside, ...props }: ContentProps): import("react/jsx-runtime").JSX.Element;
|
|
149
|
+
displayName: string;
|
|
150
|
+
};
|
|
151
|
+
type TitleProps = ComponentProps<typeof DialogPrimitive.Title>;
|
|
152
|
+
/**
|
|
153
|
+
* Heading row of the modal with a built-in close (X) button. Radix wires it
|
|
154
|
+
* as the modal's accessible name via `aria-labelledby`. The X button is
|
|
155
|
+
* omitted inside a `Modal.Content` with `variant="alert"`.
|
|
92
156
|
*
|
|
93
|
-
* @summary
|
|
157
|
+
* @summary Modal heading with built-in close button
|
|
158
|
+
*/
|
|
159
|
+
export declare const Title: {
|
|
160
|
+
({ className, children, ...props }: TitleProps): import("react/jsx-runtime").JSX.Element;
|
|
161
|
+
displayName: string;
|
|
162
|
+
};
|
|
163
|
+
type DescriptionProps = ComponentProps<typeof DialogPrimitive.Description>;
|
|
164
|
+
/**
|
|
165
|
+
* Supporting text placed directly below `Modal.Title`, spaced 0.5rem beneath
|
|
166
|
+
* it. Wired as the modal's accessible description via `aria-describedby`.
|
|
94
167
|
*
|
|
95
|
-
* @
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
*
|
|
104
|
-
*
|
|
105
|
-
* <Button onClick={handleDelete}>Delete</Button>
|
|
106
|
-
* </Modal.Footer>
|
|
107
|
-
* </Modal.Content>
|
|
108
|
-
* </Modal.Root>
|
|
109
|
-
* ```
|
|
168
|
+
* @summary Supporting text below the Modal title
|
|
169
|
+
*/
|
|
170
|
+
export declare const Description: {
|
|
171
|
+
({ className, ...props }: DescriptionProps): import("react/jsx-runtime").JSX.Element;
|
|
172
|
+
displayName: string;
|
|
173
|
+
};
|
|
174
|
+
type BodyProps = ComponentProps<'div'>;
|
|
175
|
+
/**
|
|
176
|
+
* Scrollable content area of the modal. Focusable (`tabIndex 0`) so keyboard
|
|
177
|
+
* users can scroll overflowing content with the arrow keys.
|
|
110
178
|
*
|
|
111
|
-
* @
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
*
|
|
120
|
-
* </Modal.Footer>
|
|
121
|
-
* </Modal.Content>
|
|
122
|
-
* </Modal.Root>
|
|
123
|
-
* ```
|
|
179
|
+
* @summary Scrollable modal content area
|
|
180
|
+
*/
|
|
181
|
+
export declare const Body: {
|
|
182
|
+
({ className, ...props }: BodyProps): import("react/jsx-runtime").JSX.Element;
|
|
183
|
+
displayName: string;
|
|
184
|
+
};
|
|
185
|
+
type FooterProps = ComponentProps<'div'>;
|
|
186
|
+
/**
|
|
187
|
+
* Right-aligned action row at the bottom of the modal.
|
|
124
188
|
*
|
|
125
|
-
* @
|
|
126
|
-
* @namespace Modal
|
|
189
|
+
* @summary Right-aligned modal action row
|
|
127
190
|
*/
|
|
128
|
-
export declare const
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
({ className, children, ...props }: TitleProps): import("react/jsx-runtime").JSX.Element;
|
|
143
|
-
displayName: string;
|
|
144
|
-
};
|
|
145
|
-
Description: {
|
|
146
|
-
({ className, ...props }: DescriptionProps): import("react/jsx-runtime").JSX.Element;
|
|
147
|
-
displayName: string;
|
|
148
|
-
};
|
|
149
|
-
Body: {
|
|
150
|
-
({ className, ...props }: BodyProps): import("react/jsx-runtime").JSX.Element;
|
|
151
|
-
displayName: string;
|
|
152
|
-
};
|
|
153
|
-
Footer: {
|
|
154
|
-
({ className, ...props }: FooterProps): import("react/jsx-runtime").JSX.Element;
|
|
155
|
-
displayName: string;
|
|
156
|
-
};
|
|
157
|
-
Close: {
|
|
158
|
-
(props: CloseProps): import("react/jsx-runtime").JSX.Element;
|
|
159
|
-
displayName: string;
|
|
160
|
-
};
|
|
191
|
+
export declare const Footer: {
|
|
192
|
+
({ className, ...props }: FooterProps): import("react/jsx-runtime").JSX.Element;
|
|
193
|
+
displayName: string;
|
|
194
|
+
};
|
|
195
|
+
type CloseProps = ComponentProps<typeof DialogPrimitive.Close>;
|
|
196
|
+
/**
|
|
197
|
+
* Closes the modal when activated. Pass `asChild` to wrap your own button —
|
|
198
|
+
* the idiomatic replacement for the legacy `{({ close }) => …}` render prop.
|
|
199
|
+
*
|
|
200
|
+
* @summary Closes the Modal when activated
|
|
201
|
+
*/
|
|
202
|
+
export declare const Close: {
|
|
203
|
+
(props: CloseProps): import("react/jsx-runtime").JSX.Element;
|
|
204
|
+
displayName: string;
|
|
161
205
|
};
|
|
162
206
|
export {};
|
package/src/modal/modal.js
CHANGED
|
@@ -109,15 +109,5 @@ var y = (e) => /* @__PURE__ */ i(c.Close, {
|
|
|
109
109
|
...e
|
|
110
110
|
});
|
|
111
111
|
y.displayName = "Modal.Close";
|
|
112
|
-
var b = {
|
|
113
|
-
Root: l,
|
|
114
|
-
Trigger: u,
|
|
115
|
-
Content: m,
|
|
116
|
-
Title: h,
|
|
117
|
-
Description: g,
|
|
118
|
-
Body: _,
|
|
119
|
-
Footer: v,
|
|
120
|
-
Close: y
|
|
121
|
-
};
|
|
122
112
|
//#endregion
|
|
123
|
-
export {
|
|
113
|
+
export { _ as Body, y as Close, m as Content, g as Description, v as Footer, l as Root, h as Title, u as Trigger, f as modalRecipe };
|
package/src/popover/index.d.ts
CHANGED
|
@@ -1 +1,24 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { popoverRecipe } from './popover';
|
|
2
|
+
export declare const Popover: {
|
|
3
|
+
Root: {
|
|
4
|
+
(props: import('@radix-ui/react-popover').PopoverProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
displayName: string;
|
|
6
|
+
};
|
|
7
|
+
Trigger: {
|
|
8
|
+
(props: import('@radix-ui/react-popover').PopoverTriggerProps & import('react').RefAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
};
|
|
11
|
+
Anchor: {
|
|
12
|
+
(props: import('@radix-ui/react-popover').PopoverAnchorProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
};
|
|
15
|
+
Close: {
|
|
16
|
+
(props: import('@radix-ui/react-popover').PopoverCloseProps & import('react').RefAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
displayName: string;
|
|
18
|
+
};
|
|
19
|
+
Portal: import('react').FC<import('@radix-ui/react-popover').PopoverPortalProps>;
|
|
20
|
+
Content: {
|
|
21
|
+
({ className, sideOffset, ...props }: import('@radix-ui/react-popover').PopoverContentProps & import('react').RefAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
displayName: string;
|
|
23
|
+
};
|
|
24
|
+
};
|
package/src/popover/index.js
CHANGED
|
@@ -1,2 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { Anchor as e, Close as t, Content as n, Portal as r, Root as i, Trigger as a, popoverRecipe as o } from "./popover.js";
|
|
2
|
+
//#region src/popover/index.ts
|
|
3
|
+
var s = {
|
|
4
|
+
Root: i,
|
|
5
|
+
Trigger: a,
|
|
6
|
+
Anchor: e,
|
|
7
|
+
Close: t,
|
|
8
|
+
Portal: r,
|
|
9
|
+
Content: n
|
|
10
|
+
};
|
|
11
|
+
//#endregion
|
|
12
|
+
export { s as Popover, o as popoverRecipe };
|
package/src/popover/popover.d.ts
CHANGED
|
@@ -1,22 +1,19 @@
|
|
|
1
1
|
import { ComponentProps } from 'react';
|
|
2
2
|
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
3
3
|
type RootProps = ComponentProps<typeof PopoverPrimitive.Root>;
|
|
4
|
-
type TriggerProps = ComponentProps<typeof PopoverPrimitive.Trigger>;
|
|
5
|
-
type AnchorProps = ComponentProps<typeof PopoverPrimitive.Anchor>;
|
|
6
|
-
type CloseProps = ComponentProps<typeof PopoverPrimitive.Close>;
|
|
7
|
-
export declare const popoverRecipe: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
|
|
8
|
-
type ContentProps = ComponentProps<typeof PopoverPrimitive.Content>;
|
|
9
4
|
/**
|
|
10
|
-
*
|
|
11
|
-
* Compose
|
|
5
|
+
* Root of a non-modal floating surface anchored to a trigger, built on Radix
|
|
6
|
+
* Popover. Compose `Root` with `Trigger` / `Content`, plus optional `Anchor`,
|
|
12
7
|
* `Close`, and `Portal`. Use for rich interactive overlays (forms, filters,
|
|
13
8
|
* pickers); prefer `Tooltip` for text hints and `DropdownMenu` for menus.
|
|
14
9
|
*
|
|
15
|
-
* @summary
|
|
10
|
+
* @summary Root provider for a floating interactive overlay
|
|
16
11
|
* @see {@link https://www.radix-ui.com/primitives/docs/components/popover|Radix UI Popover}
|
|
17
12
|
*
|
|
18
13
|
* @example
|
|
19
14
|
* ```tsx
|
|
15
|
+
* import { Popover } from '@agentero/design-system/popover';
|
|
16
|
+
*
|
|
20
17
|
* <Popover.Root>
|
|
21
18
|
* <Popover.Trigger asChild>
|
|
22
19
|
* <Button>Filters</Button>
|
|
@@ -27,27 +24,30 @@ type ContentProps = ComponentProps<typeof PopoverPrimitive.Content>;
|
|
|
27
24
|
* </Popover.Root>
|
|
28
25
|
* ```
|
|
29
26
|
*/
|
|
30
|
-
export declare const
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
27
|
+
export declare const Root: {
|
|
28
|
+
(props: RootProps): import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
displayName: string;
|
|
30
|
+
};
|
|
31
|
+
type TriggerProps = ComponentProps<typeof PopoverPrimitive.Trigger>;
|
|
32
|
+
export declare const Trigger: {
|
|
33
|
+
(props: TriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
34
|
+
displayName: string;
|
|
35
|
+
};
|
|
36
|
+
type AnchorProps = ComponentProps<typeof PopoverPrimitive.Anchor>;
|
|
37
|
+
export declare const Anchor: {
|
|
38
|
+
(props: AnchorProps): import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
displayName: string;
|
|
40
|
+
};
|
|
41
|
+
type CloseProps = ComponentProps<typeof PopoverPrimitive.Close>;
|
|
42
|
+
export declare const Close: {
|
|
43
|
+
(props: CloseProps): import("react/jsx-runtime").JSX.Element;
|
|
44
|
+
displayName: string;
|
|
45
|
+
};
|
|
46
|
+
export declare const Portal: import('react').FC<PopoverPrimitive.PopoverPortalProps>;
|
|
47
|
+
export declare const popoverRecipe: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
|
|
48
|
+
type ContentProps = ComponentProps<typeof PopoverPrimitive.Content>;
|
|
49
|
+
export declare const Content: {
|
|
50
|
+
({ className, sideOffset, ...props }: ContentProps): import("react/jsx-runtime").JSX.Element;
|
|
51
|
+
displayName: string;
|
|
52
52
|
};
|
|
53
53
|
export {};
|