@danxbot/ui 3.12.0 → 3.12.2
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.
|
@@ -5,6 +5,19 @@ export interface PopoverProps {
|
|
|
5
5
|
align?: "start" | "center" | "end";
|
|
6
6
|
/** Draws the little pointer at the trigger. Off by default — see below. */
|
|
7
7
|
arrow?: boolean;
|
|
8
|
+
/**
|
|
9
|
+
* The panel's DESIGN width — any CSS length, e.g. `"30rem"`.
|
|
10
|
+
*
|
|
11
|
+
* A prop rather than a `max-w-*` in `className`, and the difference is not
|
|
12
|
+
* cosmetic: `className` is merged last and would take the viewport clamp
|
|
13
|
+
* with it (see THE SIZE CLAMP above). This writes `--dx-popover-w`, which
|
|
14
|
+
* sits INSIDE the `min()` — so a design size can be as large as it likes and
|
|
15
|
+
* still cannot render wider than 80vw or than the room the positioner found.
|
|
16
|
+
*
|
|
17
|
+
* Unset, the popup keeps the library default of 20rem at the current
|
|
18
|
+
* `--ui-scale`.
|
|
19
|
+
*/
|
|
20
|
+
width?: string;
|
|
8
21
|
className?: string;
|
|
9
22
|
children: ReactNode;
|
|
10
23
|
ref?: Ref<HTMLDivElement>;
|
|
@@ -43,7 +56,7 @@ export interface PopoverProps {
|
|
|
43
56
|
"aria-labelledby"?: string;
|
|
44
57
|
"aria-label"?: string;
|
|
45
58
|
}
|
|
46
|
-
export declare function Popover({ trigger, side, align, arrow, className, children, ref, defaultOpen, onOpenChange, "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, }: PopoverProps): import("react").JSX.Element;
|
|
59
|
+
export declare function Popover({ trigger, side, align, arrow, width, className, children, ref, defaultOpen, onOpenChange, "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, }: PopoverProps): import("react").JSX.Element;
|
|
47
60
|
/** Closes the nearest Popover. */
|
|
48
61
|
export declare function PopoverClose({ children }: {
|
|
49
62
|
children: ReactNode;
|
|
@@ -59,6 +59,54 @@ export interface ProvenanceDisclosureProps {
|
|
|
59
59
|
* edges and does not want a second one.
|
|
60
60
|
*/
|
|
61
61
|
triggerContent?: ReactNode;
|
|
62
|
+
/**
|
|
63
|
+
* Draw the PANEL HEADER'S VALUE yourself — an editor, most usefully.
|
|
64
|
+
*
|
|
65
|
+
* This replaces the one paragraph that prints the value inside the open
|
|
66
|
+
* panel, and nothing else: the field name above it, the state badge beside
|
|
67
|
+
* it, the confidence meter under it, and every row below the separator are
|
|
68
|
+
* still the component's. It does not touch the trigger — the value on the
|
|
69
|
+
* page is still drawn from `record`, still truncated or wrapped per
|
|
70
|
+
* `valueWrap`, still announced as part of the trigger's own name. The
|
|
71
|
+
* closed page does not change because a consumer supplied this.
|
|
72
|
+
*
|
|
73
|
+
* UNLIKE `triggerContent`, THIS MAY BE INTERACTIVE, and that is the entire
|
|
74
|
+
* reason it exists. `triggerContent` sits inside the disclosure's `<button>`,
|
|
75
|
+
* so a control there would nest a control inside a control — invalid and
|
|
76
|
+
* unfocusable. This sits in the panel body, which Base UI gives
|
|
77
|
+
* `role="dialog"` and full focus management: an `InlineEdit`, a select, a
|
|
78
|
+
* confirm/cancel pair are all legitimate here.
|
|
79
|
+
*
|
|
80
|
+
* WHY A SLOT AND NOT AN `onCorrect` PROP. The same reason `actions` is a
|
|
81
|
+
* slot: this library has no idea who is allowed to correct an extracted
|
|
82
|
+
* value, what the permitted values are, or what writing one costs. What it
|
|
83
|
+
* does know is WHERE the correction belongs — against the value, in the
|
|
84
|
+
* surface someone opened to judge it — and the observed alternative is a
|
|
85
|
+
* consumer putting its editor in `actions`, which reads as "here is the
|
|
86
|
+
* value, and separately, down here, a form about some value".
|
|
87
|
+
*
|
|
88
|
+
* IT OVERRIDES THE ABSENCES TOO — redacted, empty and failed alike — and
|
|
89
|
+
* that is a deliberate choice rather than an oversight. A slot that
|
|
90
|
+
* disappeared whenever the value was missing would vanish in exactly the
|
|
91
|
+
* case a value editor is most wanted: a field that was never extracted is
|
|
92
|
+
* the one somebody actually has to type. It would also make the header's
|
|
93
|
+
* shape depend on a state the consumer did not ask about, so an editor would
|
|
94
|
+
* silently become a read-only word for reasons invisible at the call site.
|
|
95
|
+
* The absence vocabulary is not lost — the struck-through eye, the dash and
|
|
96
|
+
* the triangle still do their whole job on the trigger, which is the surface
|
|
97
|
+
* the density argument was ever about.
|
|
98
|
+
*
|
|
99
|
+
* The redaction gate is unchanged and still worth knowing about: the panel
|
|
100
|
+
* keeps withholding the quote, the reasoning and the sign-off note from a
|
|
101
|
+
* record marked `redacted`. It cannot police a node you built yourself, so
|
|
102
|
+
* a consumer rendering this against a redactable record owns that one
|
|
103
|
+
* decision — `record.redacted` is right there to branch on.
|
|
104
|
+
*
|
|
105
|
+
* Passing `null` or `undefined` falls back to the built-in paragraph, so
|
|
106
|
+
* gating editability is `canEdit ? <Editor … /> : null` rather than two
|
|
107
|
+
* spellings of the whole component.
|
|
108
|
+
*/
|
|
109
|
+
valueContent?: ReactNode;
|
|
62
110
|
/**
|
|
63
111
|
* Called with `true` when the panel opens and `false` when it closes.
|
|
64
112
|
*
|
|
@@ -79,4 +127,4 @@ export interface ProvenanceDisclosureProps {
|
|
|
79
127
|
onOpenChange?: (open: boolean) => void;
|
|
80
128
|
className?: string;
|
|
81
129
|
}
|
|
82
|
-
export declare function ProvenanceDisclosure({ record, actions, emptyLabel, redactedLabel, triggerBadge, valueWrap, triggerContent, onOpenChange, className, }: ProvenanceDisclosureProps): import("react").JSX.Element;
|
|
130
|
+
export declare function ProvenanceDisclosure({ record, actions, emptyLabel, redactedLabel, triggerBadge, valueWrap, triggerContent, valueContent, onOpenChange, className, }: ProvenanceDisclosureProps): import("react").JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@danxbot/ui",
|
|
3
|
-
"version": "3.12.
|
|
3
|
+
"version": "3.12.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Danxbot — a domain-agnostic React design system with motion as a first-class primitive.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
"gates": "npm run shoot && npm run a11y && node scripts/shoot-overlays.mjs && npm run probe",
|
|
74
74
|
"a11y": "node scripts/a11y-scan.mjs",
|
|
75
75
|
"shoot": "node scripts/shoot.mjs",
|
|
76
|
-
"probe": "node scripts/probe-scale.mjs && node scripts/probe-switch.mjs && node scripts/probe-slider.mjs && node scripts/probe-panel.mjs && node scripts/probe-popover-width.mjs && node scripts/probe-api.mjs && node scripts/probe-api-live.mjs && node scripts/probe-tabs-overflow.mjs && node scripts/probe-stat-row.mjs && node scripts/probe-packaging.mjs && node scripts/probe-containment.mjs && node scripts/probe-shell.mjs && node scripts/probe-card-header.mjs && node scripts/probe-inline-edit.mjs",
|
|
76
|
+
"probe": "node scripts/probe-scale.mjs && node scripts/probe-switch.mjs && node scripts/probe-slider.mjs && node scripts/probe-panel.mjs && node scripts/probe-popover-width.mjs && node scripts/probe-api.mjs && node scripts/probe-api-live.mjs && node scripts/probe-tabs-overflow.mjs && node scripts/probe-stat-row.mjs && node scripts/probe-packaging.mjs && node scripts/probe-containment.mjs && node scripts/probe-popover-containment.mjs && node scripts/probe-shell.mjs && node scripts/probe-card-header.mjs && node scripts/probe-inline-edit.mjs",
|
|
77
77
|
"sync": "node scripts/sync.mjs",
|
|
78
78
|
"visual": "node scripts/visual-docker.mjs",
|
|
79
79
|
"visual:update": "node scripts/visual-docker.mjs --update-snapshots",
|