@fusion.dev/helix-headless 0.43.0 → 0.44.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/custom-elements.json +30 -35
- package/dist/chat/composer/chat-composer.d.ts +1 -1
- package/dist/chat/message/chat-message.d.ts +1 -1
- package/dist/chat/message/chat-message.js +1 -1
- package/dist/chat/root/chat-root.d.ts +1 -1
- package/dist/element-events.generated.js +0 -1
- package/dist/notifications/group/notification-group.d.ts +17 -3
- package/dist/notifications/group/notification-group.js +8 -11
- package/dist/notifications/notification/notification.d.ts +3 -1
- package/dist/notifications/notification/notification.js +1 -1
- package/dist/notifications/root/notifications-root.d.ts +8 -3
- package/dist/speed-dial/item/speed-dial-item.d.ts +1 -1
- package/dist/speed-dial/root/speed-dial-root.d.ts +1 -1
- package/dist/splitter/root/splitter-root.d.ts +26 -3
- package/dist/splitter/root/splitter-root.js +4 -3
- package/dist/toast/item/toast-item.d.ts +1 -1
- package/dist/toast/root/toast-root.d.ts +2 -2
- package/dist/tour/root/tour-root.d.ts +0 -1
- package/package.json +5 -5
- package/types/jsx.d.ts +10 -14
- package/types/vue.d.ts +2 -4
package/custom-elements.json
CHANGED
|
@@ -11148,7 +11148,7 @@
|
|
|
11148
11148
|
"helix": {
|
|
11149
11149
|
"category": "forms",
|
|
11150
11150
|
"since": "0.1.0",
|
|
11151
|
-
"status": "
|
|
11151
|
+
"status": "stable",
|
|
11152
11152
|
"documentation": "https://fusion.dev/helix/components/chat",
|
|
11153
11153
|
"aliases": [
|
|
11154
11154
|
"Message box",
|
|
@@ -11882,7 +11882,7 @@
|
|
|
11882
11882
|
"helix": {
|
|
11883
11883
|
"category": "feedback",
|
|
11884
11884
|
"since": "0.1.0",
|
|
11885
|
-
"status": "
|
|
11885
|
+
"status": "stable",
|
|
11886
11886
|
"documentation": "https://fusion.dev/helix/components/chat",
|
|
11887
11887
|
"aliases": [
|
|
11888
11888
|
"Message",
|
|
@@ -13286,7 +13286,7 @@
|
|
|
13286
13286
|
"helix": {
|
|
13287
13287
|
"category": "feedback",
|
|
13288
13288
|
"since": "0.1.0",
|
|
13289
|
-
"status": "
|
|
13289
|
+
"status": "stable",
|
|
13290
13290
|
"documentation": "https://fusion.dev/helix/components/chat",
|
|
13291
13291
|
"aliases": [
|
|
13292
13292
|
"Conversation",
|
|
@@ -57791,6 +57791,16 @@
|
|
|
57791
57791
|
"description": "How many the group says it stands for, which is the count or the rows.",
|
|
57792
57792
|
"readonly": true
|
|
57793
57793
|
},
|
|
57794
|
+
{
|
|
57795
|
+
"kind": "field",
|
|
57796
|
+
"name": "counted",
|
|
57797
|
+
"type": {
|
|
57798
|
+
"text": "number | undefined"
|
|
57799
|
+
},
|
|
57800
|
+
"privacy": "private",
|
|
57801
|
+
"description": "The same number where anything can know it, and nothing where nothing can.\n\n**A server has no rows to count and must not say zero.** `items` reads\n`knownChildren`, which is empty on a server and while hydrating what one\nsent, so a group written around three notifications with no `count` of its\nown served `<span part=\"count\">0</span>`: a crawler, and a reader before the\npage has run, given a group that says it holds nothing over the three rows\nunderneath it. Not knowing is not zero, which is the rule `MixinCollection`\nalready states about an empty list.\n\nA declared `count` is a fact about the group rather than about its children,\nso it serves whole, which is the shape a feed trimmed by a server already\nwants: it is the number the rows were cut from.",
|
|
57802
|
+
"readonly": true
|
|
57803
|
+
},
|
|
57794
57804
|
{
|
|
57795
57805
|
"kind": "method",
|
|
57796
57806
|
"name": "assign",
|
|
@@ -57808,16 +57818,6 @@
|
|
|
57808
57818
|
"privacy": "private",
|
|
57809
57819
|
"readonly": true
|
|
57810
57820
|
},
|
|
57811
|
-
{
|
|
57812
|
-
"kind": "field",
|
|
57813
|
-
"name": "folded",
|
|
57814
|
-
"type": {
|
|
57815
|
-
"text": "number"
|
|
57816
|
-
},
|
|
57817
|
-
"privacy": "private",
|
|
57818
|
-
"description": "How many rows the collapse is hiding, for the control to say so.",
|
|
57819
|
-
"readonly": true
|
|
57820
|
-
},
|
|
57821
57821
|
{
|
|
57822
57822
|
"kind": "field",
|
|
57823
57823
|
"name": "open",
|
|
@@ -58348,7 +58348,7 @@
|
|
|
58348
58348
|
"helix": {
|
|
58349
58349
|
"category": "feedback",
|
|
58350
58350
|
"since": "0.24.0",
|
|
58351
|
-
"status": "
|
|
58351
|
+
"status": "stable",
|
|
58352
58352
|
"documentation": "https://fusion.dev/helix/components/notifications",
|
|
58353
58353
|
"aliases": [
|
|
58354
58354
|
"NotificationSection",
|
|
@@ -58481,6 +58481,10 @@
|
|
|
58481
58481
|
"description": "A block belonging to the row rather than a line about it: a quoted comment, a status moving from one value to another, a preview. Unlike `caption` nothing here sets a size or an ink, because whatever fills it usually brings its own.",
|
|
58482
58482
|
"name": "detail"
|
|
58483
58483
|
},
|
|
58484
|
+
{
|
|
58485
|
+
"description": "Replaces the glyph inside the dismiss control, which is drawn only where the row is `dismissible`.",
|
|
58486
|
+
"name": "dismiss"
|
|
58487
|
+
},
|
|
58484
58488
|
{
|
|
58485
58489
|
"description": "An avatar or icon identifying who or what it came from.",
|
|
58486
58490
|
"name": "media"
|
|
@@ -59058,7 +59062,7 @@
|
|
|
59058
59062
|
"helix": {
|
|
59059
59063
|
"category": "feedback",
|
|
59060
59064
|
"since": "0.1.0",
|
|
59061
|
-
"status": "
|
|
59065
|
+
"status": "stable",
|
|
59062
59066
|
"documentation": "https://fusion.dev/helix/components/notifications",
|
|
59063
59067
|
"aliases": [
|
|
59064
59068
|
"Notification item",
|
|
@@ -59283,7 +59287,7 @@
|
|
|
59283
59287
|
"text": "void"
|
|
59284
59288
|
}
|
|
59285
59289
|
},
|
|
59286
|
-
"description": "Says whether anything in the feed has media, so every item can hold the\ncolumn open whether or not it has one of its own.\n\n**A fact no item can answer for itself**, which is why it is here. An item\nknows about its own media slot and nothing about its neighbors, so a feed\nwhere some rows have an avatar and some do not draws two different left\nedges for its text: measured on a four item feed, the rows without media\nstarted their text 32 pixels to the left of the rows with it. The styled\ntier turns this into a width; this tier ships no stylesheet and is\nunaffected.\n\
|
|
59290
|
+
"description": "Says whether anything in the feed has media, so every item can hold the\ncolumn open whether or not it has one of its own.\n\n**A fact no item can answer for itself**, which is why it is here. An item\nknows about its own media slot and nothing about its neighbors, so a feed\nwhere some rows have an avatar and some do not draws two different left\nedges for its text: measured on a four item feed, the rows without media\nstarted their text 32 pixels to the left of the rows with it. The styled\ntier turns this into a width; this tier ships no stylesheet and is\nunaffected.\n\n**What is asked of each row is its light DOM, not the row.** A notification\npublishes no property for this, and asking one would make the answer depend\non the row having drawn itself; a `[slot=\"media\"]` child is there from the\nmoment the markup is parsed. The rows themselves come from `items`, which\ndoes need them upgraded, and that is the honest limit rather than a claim\nthis had made the other way: a row that upgrades late is counted on the next\nupdate, which its own `slotchange` asks for."
|
|
59287
59291
|
},
|
|
59288
59292
|
{
|
|
59289
59293
|
"kind": "method",
|
|
@@ -59917,7 +59921,7 @@
|
|
|
59917
59921
|
"helix": {
|
|
59918
59922
|
"category": "feedback",
|
|
59919
59923
|
"since": "0.1.0",
|
|
59920
|
-
"status": "
|
|
59924
|
+
"status": "stable",
|
|
59921
59925
|
"documentation": "https://fusion.dev/helix/components/notifications",
|
|
59922
59926
|
"aliases": [
|
|
59923
59927
|
"Notification feed",
|
|
@@ -79818,7 +79822,7 @@
|
|
|
79818
79822
|
"helix": {
|
|
79819
79823
|
"category": "actions",
|
|
79820
79824
|
"since": "0.1.0",
|
|
79821
|
-
"status": "
|
|
79825
|
+
"status": "stable",
|
|
79822
79826
|
"documentation": "https://fusion.dev/helix/components/speed-dial",
|
|
79823
79827
|
"aliases": [
|
|
79824
79828
|
"Speed dial action",
|
|
@@ -80555,7 +80559,7 @@
|
|
|
80555
80559
|
"helix": {
|
|
80556
80560
|
"category": "actions",
|
|
80557
80561
|
"since": "0.1.0",
|
|
80558
|
-
"status": "
|
|
80562
|
+
"status": "stable",
|
|
80559
80563
|
"documentation": "https://fusion.dev/helix/components/speed-dial",
|
|
80560
80564
|
"aliases": [
|
|
80561
80565
|
"FAB",
|
|
@@ -81062,7 +81066,7 @@
|
|
|
81062
81066
|
}
|
|
81063
81067
|
}
|
|
81064
81068
|
],
|
|
81065
|
-
"description": "
|
|
81069
|
+
"description": "Moves the divider under a gesture that is still happening.\n\nNot announced per step: `helix-before-resize` is the settling, below. A drag that\nannounced every position would be asking a consumer to record a hundred\ndecisions to keep one.\n\n**A drag only, which is the whole of why applying before announcing is\nright here.** The divider has to follow the hand, and the one number worth\na decision is where the hand let go. Nothing discrete calls this: a key and\na double click go straight to `settle`, so their announcement comes before\ntheir change and refusing one takes the decision, and the corner's arrows\nalready did."
|
|
81066
81070
|
},
|
|
81067
81071
|
{
|
|
81068
81072
|
"kind": "method",
|
|
@@ -81081,7 +81085,7 @@
|
|
|
81081
81085
|
}
|
|
81082
81086
|
}
|
|
81083
81087
|
],
|
|
81084
|
-
"description": "Says the arrangement has settled, so a consumer can keep it.\n\nThrough the audited path, so a consumer who owns `position` is told what was\nasked for and decides, and one who does not has already had it applied."
|
|
81088
|
+
"description": "Says the arrangement has settled, so a consumer can keep it.\n\nThrough the audited path, so a consumer who owns `position` is told what was\nasked for and decides, and one who does not has already had it applied.\n\n**The second announcement is conditional on the first, because it is derived\nfrom it.** `shutAt` reads the position the gesture ended on, so a refused\n`helix-before-resize` leaves a collapse computed from a number that was\nrefused. Announced anyway, the refusal produced the outcome it was refusing:\nmeasured on a divider at 40 with a listener calling `preventDefault`, Home\nleft `position` reporting 0 and `collapsed` reporting `start`, because the\ncollapse applied and `position` reads the sliver once a pane is shut. The\nreturn of the first request is what says so, and it was being dropped: a\ncancelable event dispatched as a bare statement with nothing reading the\nanswer, which is the shape the navigation cohort named on `Outline` and left.\n\nRefusing the collapse alone still leaves the resize, which is the other way\nround and is coherent: the divider goes where the drag put it and the pane\nis not declared shut. What a consumer cannot have is a pane that collapses\nout from under a position they said no to."
|
|
81085
81089
|
},
|
|
81086
81090
|
{
|
|
81087
81091
|
"kind": "field",
|
|
@@ -81585,7 +81589,7 @@
|
|
|
81585
81589
|
"type": {
|
|
81586
81590
|
"text": "HelixBeforeCollapseEvent"
|
|
81587
81591
|
},
|
|
81588
|
-
"description": "Fired before a pane shuts or reopens, and
|
|
81592
|
+
"description": "Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it.",
|
|
81589
81593
|
"name": "helix-before-collapse",
|
|
81590
81594
|
"reactProp": "onhelix-before-collapse"
|
|
81591
81595
|
},
|
|
@@ -81593,7 +81597,7 @@
|
|
|
81593
81597
|
"type": {
|
|
81594
81598
|
"text": "HelixBeforeResizeEvent"
|
|
81595
81599
|
},
|
|
81596
|
-
"description": "Fired before the divider settles, and
|
|
81600
|
+
"description": "Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own.",
|
|
81597
81601
|
"name": "helix-before-resize",
|
|
81598
81602
|
"reactProp": "onhelix-before-resize"
|
|
81599
81603
|
}
|
|
@@ -96635,7 +96639,7 @@
|
|
|
96635
96639
|
"summary": "One message in the toast region.",
|
|
96636
96640
|
"helix": {
|
|
96637
96641
|
"since": "0.1.0",
|
|
96638
|
-
"status": "
|
|
96642
|
+
"status": "stable",
|
|
96639
96643
|
"documentation": "https://fusion.dev/helix/components/toast",
|
|
96640
96644
|
"tier": "headless",
|
|
96641
96645
|
"group": "BaseToast",
|
|
@@ -97079,12 +97083,11 @@
|
|
|
97079
97083
|
"helix": {
|
|
97080
97084
|
"category": "overlays",
|
|
97081
97085
|
"since": "0.1.0",
|
|
97082
|
-
"status": "
|
|
97086
|
+
"status": "stable",
|
|
97083
97087
|
"documentation": "https://fusion.dev/helix/components/toast",
|
|
97084
97088
|
"aliases": [
|
|
97085
97089
|
"Toaster",
|
|
97086
|
-
"Snackbar"
|
|
97087
|
-
"Notifications"
|
|
97090
|
+
"Snackbar"
|
|
97088
97091
|
],
|
|
97089
97092
|
"tier": "headless",
|
|
97090
97093
|
"group": "BaseToast",
|
|
@@ -101154,14 +101157,6 @@
|
|
|
101154
101157
|
"description": "A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves.",
|
|
101155
101158
|
"name": "helix-tour-ask",
|
|
101156
101159
|
"reactProp": "onhelix-tour-ask"
|
|
101157
|
-
},
|
|
101158
|
-
{
|
|
101159
|
-
"type": {
|
|
101160
|
-
"text": "Event"
|
|
101161
|
-
},
|
|
101162
|
-
"description": "Says the state moved, carrying `newState` and `oldState`.",
|
|
101163
|
-
"name": "toggle",
|
|
101164
|
-
"reactProp": "ontoggle"
|
|
101165
101160
|
}
|
|
101166
101161
|
],
|
|
101167
101162
|
"attributes": [
|
|
@@ -19,7 +19,7 @@ import { type PropertyValues, type TemplateResult } from 'lit';
|
|
|
19
19
|
* of what the reader wrote.
|
|
20
20
|
*
|
|
21
21
|
* @since 0.1.0
|
|
22
|
-
* @status
|
|
22
|
+
* @status stable
|
|
23
23
|
* @category forms
|
|
24
24
|
* @aliases Message box, Prompt input
|
|
25
25
|
* @documentation https://fusion.dev/helix/components/chat
|
|
@@ -23,7 +23,7 @@ export declare const FAILED_LABEL = "Not sent";
|
|
|
23
23
|
* completion is the only version of this that works.
|
|
24
24
|
*
|
|
25
25
|
* @since 0.1.0
|
|
26
|
-
* @status
|
|
26
|
+
* @status stable
|
|
27
27
|
* @category feedback
|
|
28
28
|
* @aliases Message, Bubble, Turn
|
|
29
29
|
* @documentation https://fusion.dev/helix/components/chat
|
|
@@ -40,7 +40,7 @@ let HelixHeadlessChatMessage = class HelixHeadlessChatMessage extends HelixEleme
|
|
|
40
40
|
this.clock = Date.now();
|
|
41
41
|
}
|
|
42
42
|
hostAria(this.internals, { role: 'article' });
|
|
43
|
-
this.
|
|
43
|
+
this.internals.ariaBusy = this.state === 'streaming' ? 'true' : null;
|
|
44
44
|
}
|
|
45
45
|
renderTime() {
|
|
46
46
|
const moment = this.moment;
|
|
@@ -69,7 +69,7 @@ declare const HelixHeadlessChat_base: (new (...args: any[]) => import("@fusion.d
|
|
|
69
69
|
* turns as children.
|
|
70
70
|
*
|
|
71
71
|
* @since 0.1.0
|
|
72
|
-
* @status
|
|
72
|
+
* @status stable
|
|
73
73
|
* @category feedback
|
|
74
74
|
* @aliases Conversation, Transcript, Thread, Messages
|
|
75
75
|
* @documentation https://fusion.dev/helix/components/chat
|
|
@@ -138,7 +138,6 @@ registerElementEvents({
|
|
|
138
138
|
'helix-before-close',
|
|
139
139
|
'helix-complete',
|
|
140
140
|
'helix-tour-ask',
|
|
141
|
-
'toggle',
|
|
142
141
|
],
|
|
143
142
|
'helix-headless-tour-stop': ['helix-tour-ask'],
|
|
144
143
|
'helix-headless-tree': ['helix-activate', 'helix-before-activate', 'helix-select'],
|
|
@@ -27,7 +27,7 @@ declare const HelixHeadlessNotificationGroup_base: (new (...args: any[]) => impo
|
|
|
27
27
|
* Left off, it is the number of rows.
|
|
28
28
|
*
|
|
29
29
|
* @since 0.24.0
|
|
30
|
-
* @status
|
|
30
|
+
* @status stable
|
|
31
31
|
* @category feedback
|
|
32
32
|
* @aliases NotificationSection, FeedGroup
|
|
33
33
|
* @documentation https://fusion.dev/helix/components/notifications
|
|
@@ -100,6 +100,22 @@ export declare class HelixHeadlessNotificationGroup extends HelixHeadlessNotific
|
|
|
100
100
|
get items(): HelixHeadlessNotification[];
|
|
101
101
|
/** How many the group says it stands for, which is the count or the rows. */
|
|
102
102
|
get total(): number;
|
|
103
|
+
/**
|
|
104
|
+
* The same number where anything can know it, and nothing where nothing can.
|
|
105
|
+
*
|
|
106
|
+
* **A server has no rows to count and must not say zero.** `items` reads
|
|
107
|
+
* `knownChildren`, which is empty on a server and while hydrating what one
|
|
108
|
+
* sent, so a group written around three notifications with no `count` of its
|
|
109
|
+
* own served `<span part="count">0</span>`: a crawler, and a reader before the
|
|
110
|
+
* page has run, given a group that says it holds nothing over the three rows
|
|
111
|
+
* underneath it. Not knowing is not zero, which is the rule `MixinCollection`
|
|
112
|
+
* already states about an empty list.
|
|
113
|
+
*
|
|
114
|
+
* A declared `count` is a fact about the group rather than about its children,
|
|
115
|
+
* so it serves whole, which is the shape a feed trimmed by a server already
|
|
116
|
+
* wants: it is the number the rows were cut from.
|
|
117
|
+
*/
|
|
118
|
+
private get counted();
|
|
103
119
|
protected willUpdate(changed: PropertyValues): void;
|
|
104
120
|
protected firstUpdated(changed: PropertyValues): void;
|
|
105
121
|
protected updated(changed: PropertyValues): void;
|
|
@@ -119,8 +135,6 @@ export declare class HelixHeadlessNotificationGroup extends HelixHeadlessNotific
|
|
|
119
135
|
*/
|
|
120
136
|
private assign;
|
|
121
137
|
private readonly handleToggle;
|
|
122
|
-
/** How many rows the collapse is hiding, for the control to say so. */
|
|
123
|
-
private get folded();
|
|
124
138
|
protected render(): TemplateResult;
|
|
125
139
|
}
|
|
126
140
|
declare global {
|
|
@@ -29,6 +29,9 @@ let HelixHeadlessNotificationGroup = class HelixHeadlessNotificationGroup extend
|
|
|
29
29
|
get total() {
|
|
30
30
|
return this.count ?? this.items.length;
|
|
31
31
|
}
|
|
32
|
+
get counted() {
|
|
33
|
+
return this.count ?? (this.childrenKnown ? this.items.length : undefined);
|
|
34
|
+
}
|
|
32
35
|
willUpdate(changed) {
|
|
33
36
|
super.willUpdate(changed);
|
|
34
37
|
hostAria(this.internals, this.label === '' ? { role: 'group' } : { label: this.label, role: 'group' });
|
|
@@ -60,11 +63,9 @@ let HelixHeadlessNotificationGroup = class HelixHeadlessNotificationGroup extend
|
|
|
60
63
|
const label = this.renderRoot?.querySelector?.('slot[name="label"]');
|
|
61
64
|
label?.assign?.(...[...this.children].filter((child) => child.getAttribute('slot') === 'label'));
|
|
62
65
|
}
|
|
63
|
-
get folded() {
|
|
64
|
-
return Math.max(this.items.length - 1, 0);
|
|
65
|
-
}
|
|
66
66
|
render() {
|
|
67
|
-
const
|
|
67
|
+
const counted = this.counted;
|
|
68
|
+
const count = html `<span part="count">${counted ?? nothing}</span>`;
|
|
68
69
|
return html `<div part="header">
|
|
69
70
|
${this.collapsible
|
|
70
71
|
? html `<button
|
|
@@ -76,17 +77,13 @@ let HelixHeadlessNotificationGroup = class HelixHeadlessNotificationGroup extend
|
|
|
76
77
|
@click=${this.handleToggle}
|
|
77
78
|
>
|
|
78
79
|
<span part="label"><slot name="label">${this.label}</slot></span>
|
|
79
|
-
|
|
80
|
+
${count}
|
|
80
81
|
</button>`
|
|
81
82
|
: html `<span part="label"><slot name="label">${this.label}</slot></span>
|
|
82
|
-
|
|
83
|
+
${count}`}
|
|
83
84
|
<span part="action"><slot name="action"></slot></span>
|
|
84
85
|
</div>
|
|
85
|
-
<div
|
|
86
|
-
id=${ITEMS_ID}
|
|
87
|
-
part="items"
|
|
88
|
-
aria-label=${collapsed && this.folded > 0 ? `${this.folded} more` : nothing}
|
|
89
|
-
>
|
|
86
|
+
<div id=${ITEMS_ID} part="items">
|
|
90
87
|
<slot></slot>
|
|
91
88
|
</div>`;
|
|
92
89
|
}
|
|
@@ -30,7 +30,7 @@ import '../../format-date/index.js';
|
|
|
30
30
|
* cancelable, and a `read` set by the consumer makes this element defer entirely.
|
|
31
31
|
*
|
|
32
32
|
* @since 0.1.0
|
|
33
|
-
* @status
|
|
33
|
+
* @status stable
|
|
34
34
|
* @category feedback
|
|
35
35
|
* @aliases Notification item, Inbox item
|
|
36
36
|
* @documentation https://fusion.dev/helix/components/notifications
|
|
@@ -44,6 +44,8 @@ import '../../format-date/index.js';
|
|
|
44
44
|
* @slot detail - A block belonging to the row rather than a line about it: a quoted
|
|
45
45
|
* comment, a status moving from one value to another, a preview. Unlike `caption` nothing
|
|
46
46
|
* here sets a size or an ink, because whatever fills it usually brings its own.
|
|
47
|
+
* @slot dismiss - Replaces the glyph inside the dismiss control, which is drawn
|
|
48
|
+
* only where the row is `dismissible`.
|
|
47
49
|
* @slot media - An avatar or icon identifying who or what it came from.
|
|
48
50
|
*
|
|
49
51
|
* @event {HelixDismissEvent} helix-dismiss - Fired when a reader asks to remove it, and cancelable.
|
|
@@ -22,7 +22,7 @@ let HelixHeadlessNotification = class HelixHeadlessNotification extends HelixEle
|
|
|
22
22
|
this.isNotification = true;
|
|
23
23
|
this.readState = undefined;
|
|
24
24
|
this.handleActions = () => {
|
|
25
|
-
this.
|
|
25
|
+
this.markActions();
|
|
26
26
|
};
|
|
27
27
|
this.handleDismiss = (event) => {
|
|
28
28
|
event.stopPropagation();
|
|
@@ -25,7 +25,7 @@ declare const HelixHeadlessNotifications_base: (new (...args: any[]) => import("
|
|
|
25
25
|
* either of them counting.
|
|
26
26
|
*
|
|
27
27
|
* @since 0.1.0
|
|
28
|
-
* @status
|
|
28
|
+
* @status stable
|
|
29
29
|
* @category feedback
|
|
30
30
|
* @aliases Notification feed, Inbox, Activity
|
|
31
31
|
* @documentation https://fusion.dev/helix/components/notifications
|
|
@@ -174,8 +174,13 @@ export declare class HelixHeadlessNotifications extends HelixHeadlessNotificatio
|
|
|
174
174
|
* tier turns this into a width; this tier ships no stylesheet and is
|
|
175
175
|
* unaffected.
|
|
176
176
|
*
|
|
177
|
-
*
|
|
178
|
-
*
|
|
177
|
+
* **What is asked of each row is its light DOM, not the row.** A notification
|
|
178
|
+
* publishes no property for this, and asking one would make the answer depend
|
|
179
|
+
* on the row having drawn itself; a `[slot="media"]` child is there from the
|
|
180
|
+
* moment the markup is parsed. The rows themselves come from `items`, which
|
|
181
|
+
* does need them upgraded, and that is the honest limit rather than a claim
|
|
182
|
+
* this had made the other way: a row that upgrades late is counted on the next
|
|
183
|
+
* update, which its own `slotchange` asks for.
|
|
179
184
|
*/
|
|
180
185
|
private markMedia;
|
|
181
186
|
/**
|
|
@@ -16,7 +16,7 @@ import { type TemplateResult } from 'lit';
|
|
|
16
16
|
* being there, so it is read, searched and translated like anything else.
|
|
17
17
|
*
|
|
18
18
|
* @since 0.1.0
|
|
19
|
-
* @status
|
|
19
|
+
* @status stable
|
|
20
20
|
* @category actions
|
|
21
21
|
* @aliases Speed dial action, FAB action, Quick action
|
|
22
22
|
* @documentation https://fusion.dev/helix/components/speed-dial
|
|
@@ -28,7 +28,7 @@ declare const HelixHeadlessSpeedDial_base: (new (...args: any[]) => import("@fus
|
|
|
28
28
|
* with no reason to argue with it.
|
|
29
29
|
*
|
|
30
30
|
* @since 0.1.0
|
|
31
|
-
* @status
|
|
31
|
+
* @status stable
|
|
32
32
|
* @category actions
|
|
33
33
|
* @aliases FAB, Floating action button, Action button, Quick actions
|
|
34
34
|
* @documentation https://fusion.dev/helix/components/speed-dial
|
|
@@ -41,8 +41,8 @@ import { type PropertyValues, type TemplateResult } from 'lit';
|
|
|
41
41
|
* @slot end - The pane after it.
|
|
42
42
|
* @slot start - The pane before the divider.
|
|
43
43
|
*
|
|
44
|
-
* @event {HelixBeforeCollapseEvent} helix-before-collapse - Fired before a pane shuts or reopens, and
|
|
45
|
-
* @event {HelixBeforeResizeEvent} helix-before-resize - Fired before the divider settles, and
|
|
44
|
+
* @event {HelixBeforeCollapseEvent} helix-before-collapse - Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it.
|
|
45
|
+
* @event {HelixBeforeResizeEvent} helix-before-resize - Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own.
|
|
46
46
|
*
|
|
47
47
|
* @csspart corner - The handle where two dividers cross, added on the client.
|
|
48
48
|
* @csspart end - The box holding the second.
|
|
@@ -300,11 +300,18 @@ export declare class HelixHeadlessSplitter extends HelixElement {
|
|
|
300
300
|
*/
|
|
301
301
|
get vertical(): boolean;
|
|
302
302
|
/**
|
|
303
|
-
*
|
|
303
|
+
* Moves the divider under a gesture that is still happening.
|
|
304
304
|
*
|
|
305
305
|
* Not announced per step: `helix-before-resize` is the settling, below. A drag that
|
|
306
306
|
* announced every position would be asking a consumer to record a hundred
|
|
307
307
|
* decisions to keep one.
|
|
308
|
+
*
|
|
309
|
+
* **A drag only, which is the whole of why applying before announcing is
|
|
310
|
+
* right here.** The divider has to follow the hand, and the one number worth
|
|
311
|
+
* a decision is where the hand let go. Nothing discrete calls this: a key and
|
|
312
|
+
* a double click go straight to `settle`, so their announcement comes before
|
|
313
|
+
* their change and refusing one takes the decision, and the corner's arrows
|
|
314
|
+
* already did.
|
|
308
315
|
*/
|
|
309
316
|
private move;
|
|
310
317
|
/**
|
|
@@ -312,6 +319,22 @@ export declare class HelixHeadlessSplitter extends HelixElement {
|
|
|
312
319
|
*
|
|
313
320
|
* Through the audited path, so a consumer who owns `position` is told what was
|
|
314
321
|
* asked for and decides, and one who does not has already had it applied.
|
|
322
|
+
*
|
|
323
|
+
* **The second announcement is conditional on the first, because it is derived
|
|
324
|
+
* from it.** `shutAt` reads the position the gesture ended on, so a refused
|
|
325
|
+
* `helix-before-resize` leaves a collapse computed from a number that was
|
|
326
|
+
* refused. Announced anyway, the refusal produced the outcome it was refusing:
|
|
327
|
+
* measured on a divider at 40 with a listener calling `preventDefault`, Home
|
|
328
|
+
* left `position` reporting 0 and `collapsed` reporting `start`, because the
|
|
329
|
+
* collapse applied and `position` reads the sliver once a pane is shut. The
|
|
330
|
+
* return of the first request is what says so, and it was being dropped: a
|
|
331
|
+
* cancelable event dispatched as a bare statement with nothing reading the
|
|
332
|
+
* answer, which is the shape the navigation cohort named on `Outline` and left.
|
|
333
|
+
*
|
|
334
|
+
* Refusing the collapse alone still leaves the resize, which is the other way
|
|
335
|
+
* round and is coherent: the divider goes where the drag put it and the pane
|
|
336
|
+
* is not declared shut. What a consumer cannot have is a pane that collapses
|
|
337
|
+
* out from under a position they said no to.
|
|
315
338
|
*/
|
|
316
339
|
private settle;
|
|
317
340
|
private readonly handlePointerDown;
|
|
@@ -82,7 +82,6 @@ let HelixHeadlessSplitter = HelixHeadlessSplitter_1 = class HelixHeadlessSplitte
|
|
|
82
82
|
else {
|
|
83
83
|
return;
|
|
84
84
|
}
|
|
85
|
-
this.move(next);
|
|
86
85
|
this.settle(next);
|
|
87
86
|
event.preventDefault();
|
|
88
87
|
};
|
|
@@ -300,7 +299,7 @@ let HelixHeadlessSplitter = HelixHeadlessSplitter_1 = class HelixHeadlessSplitte
|
|
|
300
299
|
settle(next) {
|
|
301
300
|
const wanted = this.clamp(next);
|
|
302
301
|
const shut = this.shutAt(wanted);
|
|
303
|
-
requestChange({
|
|
302
|
+
const moved = requestChange({
|
|
304
303
|
apply: (value) => {
|
|
305
304
|
const previous = this.position;
|
|
306
305
|
this.positionState = value;
|
|
@@ -310,6 +309,9 @@ let HelixHeadlessSplitter = HelixHeadlessSplitter_1 = class HelixHeadlessSplitte
|
|
|
310
309
|
host: this,
|
|
311
310
|
next: wanted,
|
|
312
311
|
});
|
|
312
|
+
if (!moved) {
|
|
313
|
+
return;
|
|
314
|
+
}
|
|
313
315
|
if (shut !== this.collapsed) {
|
|
314
316
|
requestChange({
|
|
315
317
|
apply: (value) => {
|
|
@@ -334,7 +336,6 @@ let HelixHeadlessSplitter = HelixHeadlessSplitter_1 = class HelixHeadlessSplitte
|
|
|
334
336
|
}
|
|
335
337
|
reset() {
|
|
336
338
|
const home = this.clamp(this.defaultPosition);
|
|
337
|
-
this.move(home);
|
|
338
339
|
this.settle(home);
|
|
339
340
|
}
|
|
340
341
|
cross(by, at) {
|
|
@@ -29,9 +29,9 @@ import { type PropertyValues, type TemplateResult } from 'lit';
|
|
|
29
29
|
* test, or twice.
|
|
30
30
|
*
|
|
31
31
|
* @since 0.1.0
|
|
32
|
-
* @status
|
|
32
|
+
* @status stable
|
|
33
33
|
* @category overlays
|
|
34
|
-
* @aliases Toaster, Snackbar
|
|
34
|
+
* @aliases Toaster, Snackbar
|
|
35
35
|
* @documentation https://fusion.dev/helix/components/toast
|
|
36
36
|
*
|
|
37
37
|
* @slot - The messages, as `helix-toast-item` elements.
|
|
@@ -32,7 +32,6 @@ import type { HelixHeadlessTourStop } from '../stop/tour-stop.js';
|
|
|
32
32
|
* @event {HelixCompleteEvent} helix-complete - Fired when the last stop is
|
|
33
33
|
* finished.
|
|
34
34
|
* @event {HelixTourAskEvent} helix-tour-ask - A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves.
|
|
35
|
-
* @event {Event} toggle - Says the state moved, carrying `newState` and `oldState`.
|
|
36
35
|
*
|
|
37
36
|
* @csspart spotlight - The box over the current target, which paints the scrim.
|
|
38
37
|
*/
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fusion.dev/helix-headless",
|
|
3
3
|
"description": "Headless component tier. Structure, accessibility, state, and form participation. No styling.",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.44.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Ross Sheppard <ross.sheppard@fusion.dev>",
|
|
7
7
|
"repository": {
|
|
@@ -46,14 +46,14 @@
|
|
|
46
46
|
},
|
|
47
47
|
"bugs": "https://github.com/project-fusion/fusion/issues",
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@fusion.dev/helix-core": "0.
|
|
50
|
-
"@fusion.dev/helix-icons": "0.
|
|
49
|
+
"@fusion.dev/helix-core": "0.44.0",
|
|
50
|
+
"@fusion.dev/helix-icons": "0.44.0",
|
|
51
51
|
"uqr": "^0.1.3"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@custom-elements-manifest/analyzer": "^0.11.0",
|
|
55
|
-
"@fusion.dev/helix-cem": "0.
|
|
56
|
-
"@fusion.dev/helix-testing": "0.
|
|
55
|
+
"@fusion.dev/helix-cem": "0.44.0",
|
|
56
|
+
"@fusion.dev/helix-testing": "0.44.0",
|
|
57
57
|
"@fusion.dev/scripts": "0.0.0-dev",
|
|
58
58
|
"@happy-dom/global-registrator": "^20.0.0",
|
|
59
59
|
"@lit-labs/ssr": "^4.1.0",
|
package/types/jsx.d.ts
CHANGED
|
@@ -13023,11 +13023,11 @@ has an honest answer. */
|
|
|
13023
13023
|
/** How far one arrow press moves it, as a percentage. */
|
|
13024
13024
|
step?: (HelixHeadlessSplitter["step"]) | undefined;
|
|
13025
13025
|
|
|
13026
|
-
/** Fired before a pane shuts or reopens, and
|
|
13026
|
+
/** Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it. */
|
|
13027
13027
|
"onhelix-before-collapse"?: ((
|
|
13028
13028
|
e: HelixHeadlessSplitterHelixBeforeCollapseElementEvent,
|
|
13029
13029
|
) => void) | undefined;
|
|
13030
|
-
/** Fired before the divider settles, and
|
|
13030
|
+
/** Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own. */
|
|
13031
13031
|
"onhelix-before-resize"?: ((
|
|
13032
13032
|
e: HelixHeadlessSplitterHelixBeforeResizeElementEvent,
|
|
13033
13033
|
) => void) | undefined;
|
|
@@ -13127,11 +13127,11 @@ has an honest answer. */
|
|
|
13127
13127
|
"prop:orientation"?: (HelixHeadlessSplitter["orientation"]) | undefined;
|
|
13128
13128
|
/** How far one arrow press moves it, as a percentage. */
|
|
13129
13129
|
"prop:step"?: (HelixHeadlessSplitter["step"]) | undefined;
|
|
13130
|
-
/** Fired before a pane shuts or reopens, and
|
|
13130
|
+
/** Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it. */
|
|
13131
13131
|
"on:helix-before-collapse"?: ((
|
|
13132
13132
|
e: HelixHeadlessSplitterHelixBeforeCollapseElementEvent,
|
|
13133
13133
|
) => void) | undefined;
|
|
13134
|
-
/** Fired before the divider settles, and
|
|
13134
|
+
/** Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own. */
|
|
13135
13135
|
"on:helix-before-resize"?: ((
|
|
13136
13136
|
e: HelixHeadlessSplitterHelixBeforeResizeElementEvent,
|
|
13137
13137
|
) => void) | undefined;
|
|
@@ -15977,8 +15977,6 @@ The shape is `Carousel`'s, which is the nearest thing in the library: a
|
|
|
15977
15977
|
"onhelix-complete"?: ((e: HelixHeadlessTourHelixCompleteElementEvent) => void) | undefined;
|
|
15978
15978
|
/** A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves. */
|
|
15979
15979
|
"onhelix-tour-ask"?: ((e: HelixHeadlessTourHelixTourAskElementEvent) => void) | undefined;
|
|
15980
|
-
/** Says the state moved, carrying `newState` and `oldState`. */
|
|
15981
|
-
ontoggle?: ((e: HelixHeadlessTourElementEvent) => void) | undefined;
|
|
15982
15980
|
};
|
|
15983
15981
|
|
|
15984
15982
|
export type HelixHeadlessTourSolidJsProps = {
|
|
@@ -16033,8 +16031,6 @@ The shape is `Carousel`'s, which is the nearest thing in the library: a
|
|
|
16033
16031
|
"on:helix-complete"?: ((e: HelixHeadlessTourHelixCompleteElementEvent) => void) | undefined;
|
|
16034
16032
|
/** A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves. */
|
|
16035
16033
|
"on:helix-tour-ask"?: ((e: HelixHeadlessTourHelixTourAskElementEvent) => void) | undefined;
|
|
16036
|
-
/** Says the state moved, carrying `newState` and `oldState`. */
|
|
16037
|
-
"on:toggle"?: ((e: HelixHeadlessTourElementEvent) => void) | undefined;
|
|
16038
16034
|
|
|
16039
16035
|
/** Set the innerHTML of the element */
|
|
16040
16036
|
innerHTML?: (string) | undefined;
|
|
@@ -26912,6 +26908,7 @@ export type CustomElements = {
|
|
|
26912
26908
|
* - `actions`: What a reader can do about it, under the words it is about. Drawn always rather than on hover, because an action is the point of the row and not chrome around it.
|
|
26913
26909
|
* - `caption`: A second line qualifying it, quieter than the first. A bare slot rather than a box, so an item without one pays nothing for it; style it through `::slotted()`.
|
|
26914
26910
|
* - `detail`: A block belonging to the row rather than a line about it: a quoted comment, a status moving from one value to another, a preview. Unlike `caption` nothing here sets a size or an ink, because whatever fills it usually brings its own.
|
|
26911
|
+
* - `dismiss`: Replaces the glyph inside the dismiss control, which is drawn only where the row is `dismissible`.
|
|
26915
26912
|
* - `media`: An avatar or icon identifying who or what it came from.
|
|
26916
26913
|
*
|
|
26917
26914
|
* ## Methods
|
|
@@ -30667,8 +30664,8 @@ export type CustomElements = {
|
|
|
30667
30664
|
*
|
|
30668
30665
|
* Events that will be emitted by the component.
|
|
30669
30666
|
*
|
|
30670
|
-
* - `helix-before-collapse`: Fired before a pane shuts or reopens, and
|
|
30671
|
-
* - `helix-before-resize`: Fired before the divider settles, and
|
|
30667
|
+
* - `helix-before-collapse`: Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it.
|
|
30668
|
+
* - `helix-before-resize`: Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own.
|
|
30672
30669
|
*
|
|
30673
30670
|
* ## Slots
|
|
30674
30671
|
*
|
|
@@ -33752,7 +33749,6 @@ export type CustomElements = {
|
|
|
33752
33749
|
* - `helix-before-close`: Fired before the reader leaves early. Cancelable: refusing it takes the decision and nothing moves.
|
|
33753
33750
|
* - `helix-complete`: Fired when the last stop is finished.
|
|
33754
33751
|
* - `helix-tour-ask`: A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves.
|
|
33755
|
-
* - `toggle`: Says the state moved, carrying `newState` and `oldState`.
|
|
33756
33752
|
*
|
|
33757
33753
|
* ## Slots
|
|
33758
33754
|
*
|
|
@@ -44742,6 +44738,7 @@ export type CustomElementsSolidJs = {
|
|
|
44742
44738
|
* - `actions`: What a reader can do about it, under the words it is about. Drawn always rather than on hover, because an action is the point of the row and not chrome around it.
|
|
44743
44739
|
* - `caption`: A second line qualifying it, quieter than the first. A bare slot rather than a box, so an item without one pays nothing for it; style it through `::slotted()`.
|
|
44744
44740
|
* - `detail`: A block belonging to the row rather than a line about it: a quoted comment, a status moving from one value to another, a preview. Unlike `caption` nothing here sets a size or an ink, because whatever fills it usually brings its own.
|
|
44741
|
+
* - `dismiss`: Replaces the glyph inside the dismiss control, which is drawn only where the row is `dismissible`.
|
|
44745
44742
|
* - `media`: An avatar or icon identifying who or what it came from.
|
|
44746
44743
|
*
|
|
44747
44744
|
* ## Methods
|
|
@@ -48554,8 +48551,8 @@ export type CustomElementsSolidJs = {
|
|
|
48554
48551
|
*
|
|
48555
48552
|
* Events that will be emitted by the component.
|
|
48556
48553
|
*
|
|
48557
|
-
* - `helix-before-collapse`: Fired before a pane shuts or reopens, and
|
|
48558
|
-
* - `helix-before-resize`: Fired before the divider settles, and
|
|
48554
|
+
* - `helix-before-collapse`: Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it.
|
|
48555
|
+
* - `helix-before-resize`: Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own.
|
|
48559
48556
|
*
|
|
48560
48557
|
* ## Slots
|
|
48561
48558
|
*
|
|
@@ -51706,7 +51703,6 @@ export type CustomElementsSolidJs = {
|
|
|
51706
51703
|
* - `helix-before-close`: Fired before the reader leaves early. Cancelable: refusing it takes the decision and nothing moves.
|
|
51707
51704
|
* - `helix-complete`: Fired when the last stop is finished.
|
|
51708
51705
|
* - `helix-tour-ask`: A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves.
|
|
51709
|
-
* - `toggle`: Says the state moved, carrying `newState` and `oldState`.
|
|
51710
51706
|
*
|
|
51711
51707
|
* ## Slots
|
|
51712
51708
|
*
|
package/types/vue.d.ts
CHANGED
|
@@ -6722,9 +6722,9 @@ has an honest answer. */
|
|
|
6722
6722
|
};
|
|
6723
6723
|
|
|
6724
6724
|
export type HelixHeadlessSplitterVueEvents = {
|
|
6725
|
-
/** Fired before a pane shuts or reopens, and
|
|
6725
|
+
/** Fired before a pane shuts or reopens, and only where the position it is derived from stood. Cancelable: refusing it leaves the pane as it was and the divider where the gesture put it. */
|
|
6726
6726
|
"helix-before-collapse": HelixHeadlessSplitterHelixBeforeCollapseElementEvent;
|
|
6727
|
-
/** Fired before the divider settles, and
|
|
6727
|
+
/** Fired before the divider settles. Cancelable: refusing it takes the whole of where the gesture ended, so no collapse follows from it either. A drag has already drawn itself by then and holds where it was dropped until the consumer assigns their own. */
|
|
6728
6728
|
"helix-before-resize": HelixHeadlessSplitterHelixBeforeResizeElementEvent;
|
|
6729
6729
|
};
|
|
6730
6730
|
|
|
@@ -8225,8 +8225,6 @@ export type HelixHeadlessTourVueEvents = {
|
|
|
8225
8225
|
"helix-complete": HelixHeadlessTourHelixCompleteElementEvent;
|
|
8226
8226
|
/** A stop's own controls asking the tour to move, dispatched by the stop and heard here because the tour is what moves. */
|
|
8227
8227
|
"helix-tour-ask": HelixHeadlessTourHelixTourAskElementEvent;
|
|
8228
|
-
/** Says the state moved, carrying `newState` and `oldState`. */
|
|
8229
|
-
toggle: HelixHeadlessTourElementEvent;
|
|
8230
8228
|
};
|
|
8231
8229
|
|
|
8232
8230
|
/** `HelixHeadlessTourStop` component event */
|