@leonardaustin/ui 0.7.0 → 0.7.1
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/dist/components/ui/Card.d.ts.map +1 -1
- package/dist/components/ui/Dialog.d.ts +35 -4
- package/dist/components/ui/Dialog.d.ts.map +1 -1
- package/dist/components/ui/DialogActions.d.ts +14 -8
- package/dist/components/ui/DialogActions.d.ts.map +1 -1
- package/dist/components/ui/SideSheet.d.ts.map +1 -1
- package/dist/hooks/useDropUp.d.ts.map +1 -1
- package/dist/index.js +877 -707
- package/dist/lib/anchorPlacement.d.ts +44 -0
- package/dist/lib/anchorPlacement.d.ts.map +1 -0
- package/dist/lib/dialogDrag.d.ts +20 -11
- package/dist/lib/dialogDrag.d.ts.map +1 -1
- package/dist/lib/rect.d.ts +8 -0
- package/dist/lib/rect.d.ts.map +1 -0
- package/dist/styles.css +10 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC5D,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6EAA6E;IAC7E,EAAE,CAAC,EAAE,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC7C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,EAAE,EAAE,IAAY,EAChB,KAAa,EACb,aAAa,EACb,GAAG,KAAK,EACT,EAAE,SAAS,2CA+BX"}
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import { type ReactNode, type RefObject } from "react";
|
|
2
|
+
import { type AnchorPlacement } from "../../lib/anchorPlacement";
|
|
3
|
+
/** Where a Dialog opens: the centred layout, or beside its anchor. */
|
|
4
|
+
export type DialogPlacement = "center" | AnchorPlacement;
|
|
2
5
|
export interface DialogProps {
|
|
3
6
|
open: boolean;
|
|
4
7
|
onClose: () => void;
|
|
@@ -24,11 +27,39 @@ export interface DialogProps {
|
|
|
24
27
|
footer?: ReactNode;
|
|
25
28
|
className?: string;
|
|
26
29
|
/**
|
|
27
|
-
* Let the user move the dialog by dragging its title bar. It
|
|
28
|
-
* the viewport and reopens in its default
|
|
29
|
-
*
|
|
30
|
+
* Let the user move the dialog by dragging its title bar. It keeps a
|
|
31
|
+
* theme-spacing margin from the viewport edges and reopens in its default
|
|
32
|
+
* position unless `rememberPosition` is set. Off below the `md`
|
|
33
|
+
* breakpoint.
|
|
30
34
|
*/
|
|
31
35
|
draggable?: boolean;
|
|
36
|
+
/**
|
|
37
|
+
* With `draggable`, reopen the dialog at the screen position the user last
|
|
38
|
+
* dragged it to, instead of its default (or anchored) position. Kept in
|
|
39
|
+
* memory for this Dialog instance only (not persisted), pulled back inside
|
|
40
|
+
* the viewport if the window has shrunk, and cleared below the `md`
|
|
41
|
+
* breakpoint. Ignored without `draggable`.
|
|
42
|
+
*/
|
|
43
|
+
rememberPosition?: boolean;
|
|
44
|
+
/**
|
|
45
|
+
* Where the dialog opens. `center` (default) is the usual layout: centred
|
|
46
|
+
* horizontally, near the top of the viewport. `top`, `bottom`, `left` and
|
|
47
|
+
* `right` open it beside `anchorRef`, flipping to the opposite side when
|
|
48
|
+
* it doesn't fit there; `auto` tries each side from the most room to the
|
|
49
|
+
* least and uses the first that fits. When no candidate side fits, or
|
|
50
|
+
* there's no usable anchor, it falls back to `center`. Re-checked when the
|
|
51
|
+
* window resizes or scrolls and when the dialog changes size. Ignored
|
|
52
|
+
* below the `md` breakpoint.
|
|
53
|
+
*/
|
|
54
|
+
placement?: DialogPlacement;
|
|
55
|
+
/**
|
|
56
|
+
* The element an anchored `placement` opens against, usually the button
|
|
57
|
+
* that opened the dialog. Ignored when `placement` is `center`. If it's
|
|
58
|
+
* unset, detached or hidden, the element that had focus when the dialog
|
|
59
|
+
* opened is used instead; Safari doesn't focus buttons on click, so pass
|
|
60
|
+
* `anchorRef` for reliable placement.
|
|
61
|
+
*/
|
|
62
|
+
anchorRef?: RefObject<HTMLElement | null>;
|
|
32
63
|
role?: "dialog" | "alertdialog";
|
|
33
64
|
description?: ReactNode;
|
|
34
65
|
"aria-label"?: string;
|
|
@@ -41,5 +72,5 @@ export interface DialogProps {
|
|
|
41
72
|
closeOnOverlayClick?: boolean;
|
|
42
73
|
hideCloseButton?: boolean;
|
|
43
74
|
}
|
|
44
|
-
export declare function Dialog({ open, onClose, title, children, footer, className, draggable, role, description, "aria-label": ariaLabel, "aria-describedby": describedBy, initialFocusRef, returnFocusRef, busy, closeOnEscape, closeOnOverlayClick, hideCloseButton, }: DialogProps): import("react").ReactPortal | null;
|
|
75
|
+
export declare function Dialog({ open, onClose, title, children, footer, className, draggable, rememberPosition, placement, anchorRef, role, description, "aria-label": ariaLabel, "aria-describedby": describedBy, initialFocusRef, returnFocusRef, busy, closeOnEscape, closeOnOverlayClick, hideCloseButton, }: DialogProps): import("react").ReactPortal | null;
|
|
45
76
|
//# sourceMappingURL=Dialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EAEd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAMf,OAAO,EAEL,KAAK,eAAe,EAErB,MAAM,2BAA2B,CAAC;AAanC,sEAAsE;AACtE,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,eAAe,CAAC;AAEzD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;;;;;;;;;;;OAgBG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IAChC,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAChD,cAAc,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC/C,yEAAyE;IACzE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAuWD,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,SAAiB,EACjB,gBAAwB,EACxB,SAAoB,EACpB,SAAS,EACT,IAAe,EACf,WAAW,EACX,YAAY,EAAE,SAAS,EACvB,kBAAkB,EAAE,WAAW,EAC/B,eAAe,EACf,cAAc,EACd,IAAY,EACZ,aAAoB,EACpB,mBAA0B,EAC1B,eAAuB,GACxB,EAAE,WAAW,sCA+Hb"}
|
|
@@ -1,20 +1,26 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* DialogActions — a right-aligned button footer for dialogs.
|
|
3
3
|
*
|
|
4
|
-
* Provides a consistent Cancel + Confirm button layout
|
|
5
|
-
*
|
|
4
|
+
* Provides a consistent Cancel + Confirm button layout for a `<Dialog>`'s
|
|
5
|
+
* `footer`. The confirm button supports all `Button` variants
|
|
6
6
|
* so it can be used for destructive confirmations (variant="danger") or
|
|
7
7
|
* standard confirmations (variant="primary").
|
|
8
8
|
*
|
|
9
9
|
* @example Standard confirmation
|
|
10
10
|
* ```tsx
|
|
11
|
-
* <Dialog
|
|
11
|
+
* <Dialog
|
|
12
|
+
* open={open}
|
|
13
|
+
* onClose={() => setOpen(false)}
|
|
14
|
+
* title="Confirm"
|
|
15
|
+
* footer={
|
|
16
|
+
* <DialogActions
|
|
17
|
+
* onCancel={() => setOpen(false)}
|
|
18
|
+
* onConfirm={handleConfirm}
|
|
19
|
+
* confirmLabel="Confirm"
|
|
20
|
+
* />
|
|
21
|
+
* }
|
|
22
|
+
* >
|
|
12
23
|
* <p>Are you sure?</p>
|
|
13
|
-
* <DialogActions
|
|
14
|
-
* onCancel={() => setOpen(false)}
|
|
15
|
-
* onConfirm={handleConfirm}
|
|
16
|
-
* confirmLabel="Confirm"
|
|
17
|
-
* />
|
|
18
24
|
* </Dialog>
|
|
19
25
|
* ```
|
|
20
26
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogActions.d.ts","sourceRoot":"","sources":["../../../src/components/ui/DialogActions.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"DialogActions.d.ts","sourceRoot":"","sources":["../../../src/components/ui/DialogActions.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGjC,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEpD,MAAM,WAAW,kBAAkB;IACjC,gDAAgD;IAChD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,iDAAiD;IACjD,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACxC,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,UAAU,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACpC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,SAAS,EACT,WAAsB,EACtB,YAAwB,EACxB,cAA0B,EAC1B,SAAS,EACT,IAAY,EACZ,SAAsB,EACtB,SAAS,EACT,UAAU,EACV,eAAuB,GACxB,EAAE,kBAAkB,2CAgCpB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SideSheet.d.ts","sourceRoot":"","sources":["../../../src/components/ui/SideSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SideSheet.d.ts","sourceRoot":"","sources":["../../../src/components/ui/SideSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAU1D,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,MAAM,EACN,IAAc,EACd,cAA4B,EAC5B,SAAS,EACT,gBAAgB,GACjB,EAAE,cAAc,sCAoFhB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDropUp.d.ts","sourceRoot":"","sources":["../../src/hooks/useDropUp.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"useDropUp.d.ts","sourceRoot":"","sources":["../../src/hooks/useDropUp.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlE;;;GAGG;AACH,wBAAgB,SAAS,CACvB,IAAI,EAAE,OAAO,EACb,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EACzC,OAAO,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GACrC,OAAO,CAoBT"}
|